/*********
krój do menu:
DM Serif Display Regular (google)

krój do opisów i to nazwy projektu:
Darker Grotesque Medium (google)

font-family: 'DM Serif Display', serif;

***********/


html, body {height: 100%;}

body {margin: 0 auto;
      padding: 0;
      font-family: 'Darker Grotesque', sans-serif;
      color: #231F20;
      font-size: 20px;}
      
.font {font-family: 'DM Serif Display', serif;
        letter-spacing: 1px;}      
       
input[type='text'],
input[type='email'],
input[type='submit'],
textarea,
input[type='tel'],
select,
input[type='date'] {font-family: 'Darker Grotesque', sans-serif;}       
      
*:focus {outline: 0;}
      
a {text-decoration: none;
   cursor: pointer;}
        

div {box-sizing: border-box;}     
      

.f-left {float: left;}

.f-right {float: right;}

.clear {clear: both;}

.center {text-align: center;}

.box-foto-phone {display: none;}

        
ul {margin: 0;
    padding: 0;
    list-style: none;}  
    
    
    
.header-container {width: 100%;
                   margin: 0 auto;
                   z-index: 100;
                   height: 85px;
                   background: #fff;
                   position: fixed;}
                   
.logo {padding: 20px 0 0 25px;       
       float: left;} 
       
.logo a {color: #231F20;}                
        

.logo img {width: 52px;
            float: left;}                   
                   
.logo .s-logo {display: block;
                float: left;
                line-height: 17px;
	            font-size: 16px;
                padding: 15px 0 0 6px;}  
                
.search {float: left;
         margin: 38px 35px 0 25px;}                                 
                   
.search input[type="submit"] {width: 17px;
                               height: 17px;
                               border: none;
                               background: url(img/search.svg) no-repeat;
                               background-size: cover;
                               cursor: pointer; }                

.menu-phone {float: right;}               

.menu-phone ul {float: left;}

.menu-phone ul li {display: inline-block;
                              text-transform: uppercase;
                              margin: 27px 0 0 0;
                              padding: 0 6px;} 

.menu-phone ul li a {font-size: 16px;
                                 color: #231F20;
                               font-weight: 400;
                                display: block;
                              padding: 15px 0 0 0;
                               transition: all .3s ease .15s;
                               border-bottom: 2px solid rgba(0, 0, 0, 0);} 
                               
.menu-phone ul li a:hover {border-bottom: 2px solid #A7BAB6;} 

.menu-phone ul li.current-menu-item a {border-bottom: 2px solid #A7BAB6;} 

.menu-phone ul li > ul {position: absolute;                        
                        margin: 0 0 0 -10px;
                        display: none;}

.menu-phone ul li:hover > ul {display: block;}

.menu-phone ul li > ul li {display: block;
                           padding: 15px 0 0 0;
                           margin: 0;
                           background: rgba(255, 255, 255, 0.5);}



.menu-phone ul li > ul li:hover {background: #fff;}

.menu-phone ul li > ul li a,
.header-pds .menu-phone ul li > ul li a {padding: 0 10px;
                             border: none;}

.menu-phone ul li > ul li a:hover,
.header-pds ul li > ul li a:hover {border: none;}

.header-pds .menu-phone ul li > ul li,
.header-pds .menu-phone ul li > ul li:hover {background: none;}

.header-pds .menu-phone ul li > ul li a {color: #231F20;}

/*.header-pds .menu-phone ul li > ul li {background: rgba(0, 0, 0, 0.3);}

.header-pds .menu-phone ul li > ul li:hover {background: rgba(0, 0, 0, 0.4);}*/

.slider {z-index: 2;
         width: 100%;
         height: 100%;
         position: relative; } 

.ngl {text-align: center;}

h2,
h1 {color: #A7BAB6;
    text-transform: uppercase; 
    font-family: 'DM Serif Display', serif;
    font-size: 16px;
    font-weight: 400;
    margin: 12px 0 6px 0;
    letter-spacing: 1px;}

.portfolio-home-container {clear: both;
                            width: 100%;
                            margin: 0 auto;}

.p-single-box {width: 33.3333333333333%;
               float: left;
               padding: 7px 6px;
               overflow: hidden;
               position: relative;}

.p-single-box:nth-child(3n+1) {padding: 7px 12px 7px 0;}

.p-single-box:nth-child(3n) {padding: 7px 0 7px 12px;}


               
.p-single-img {z-index: 1;}               

.p-single-img img {width: 100%;
                    margin-bottom: -4px;}




.p-single-box .overlay-text {position: absolute;
                             width: calc(100% - 12px);
                             height: calc(100% - 16px);
                             z-index: 10;
                             background: rgba(255, 255, 255, 0.5);
                             top: 7px;
                             left: 6px;                             
                             font-size: 30px;
                             opacity: 0;
                              transition: all .3s ease .15s;}

.p-single-box:nth-child(3n+1) .overlay-text {left: 0;}

.p-single-box:nth-child(3n) .overlay-text {left: 12px;}
                             
.p-single-box:hover .overlay-text  { opacity: 1;}                            
                             
.p-single-box .overlay-text .table {display: table;
                                     width: 100%;
                                       height: 100%;
                                     text-align: center;}                             

.p-single-box .overlay-text a {display: table-cell;
                                 color: #231F20;
                                 vertical-align: middle;}


.footer-container {width: 100%;
                   overflow: hidden;}  
                   
.footer-bottom {width: 100%;
                padding: 7px 25px 8px 25px;
                color: #fff;
                font-size: 20px;
                background: #A7BAB6;}                                    
                   
.footer-top {width: 100%;
          margin: 0 auto;
          padding:  35px 25px 25px 25px;
          display: flex;
          font-size: 20px;
          justify-content: space-between;
          overflow: hidden;}

.footer-top .font { font-size: 16px;}
          
.footer-top a {color: #231F20;
                font-weight: 600;} 
                
.footer-top input[type='email'] {width: calc(100% - 120px);
                                  border: 2px solid #A7BAB6;
                                  float: left;
                                  height: 40px;
                                  color:#231F20; 
                                  box-sizing: border-box;
                                  padding: 0 20px;
                                  font-size: 16px;}  
                                  
.footer-top input[type='submit'] {width: 98px;
                                  border: none; 
                                  background: #A7BAB6;
                                  float: right;
                                  height: 40px;
                                  color: #fff; 
                                  text-transform: uppercase;
                                  font-size: 14px;
                                  font-weight: 700;}   
                                  
.footer-top ::-webkit-input-placeholder {color:#231F20;
                                      opacity: 1;
                                      font-size: 16px;
                                      text-transform: uppercase;}

.footer-top :-moz-placeholder {color:#231F20;
                                      opacity: 1;
                                      font-size: 16px;
                                      text-transform: uppercase;}

.footer-top ::-moz-placeholder {color:#231F20;
                                      opacity: 1;
                                      font-size: 16px;
                                      text-transform: uppercase;}

.footer-top :-ms-input-placeholder {color:#231F20;
                                      opacity: 1;
                                      font-size: 16px;
                                      text-transform: uppercase;}                                                                                   
                
.footer-top span {text-transform: uppercase;}                

.f1 {/*width: 510px;*/
      width: 33%;}  

.f2 {/*width: 118px;*/
      width: 33%;
     padding-top: 25px;
     text-align: center;} 

.f2 img {width: 70px;}

.f3 {/*width: 510px;*/
      width: 33%;}  

.f1 p,
.f3 p {margin-top: 0;
      line-height: 20px;}

.f-logo-mobile {display: none;}                       
                   
                        
/*BUTTON*/   

.menu-button {
  position: absolute;
  top: 15px;
  right: 10px;
  background: transparent;
  display: none;
  padding: 10px 10px;
  cursor: pointer;}
  
  
.menu-button:focus {outline: none;}

.menu-button .menu-ico {display: block;
                       width: 35px;
                        height: 5px;
                         background:  #A7BAB6;}
                         
                         
.menu-button .menu-ico + .menu-ico { margin-top: 6px;} 

/******BLOG********/

.ngl-kategorie {display: none;}

/*.header-pds,
.portfolio-single-container {border-bottom: 1px solid #A7BAB6;}*/



.blog-categories {width: 100%;
                  text-align: center;}

.menu-kategorie-bloga-container ul { text-align: center;
                                      background: pink;}
                  
.kat-container ul li {display: inline-block;
                       text-transform: uppercase;
                       font-size: 16px;
                       padding: 30px 23px;}                  
                  
.kat-container ul li a {color: #A7BAB6;
                         transition: all .3s ease .15s;
                         padding-bottom: 8px;
                         border-bottom: 3px solid rgba(167, 186, 182, 0);} 
                               
.kat-container ul li a:hover {border-bottom: 3px solid rgba(167, 186, 182, 1);}                   
                  
.blog-container {clear: both; 
                 width: 100%;
                 max-width: 1464px;
                 margin: 0 auto;}                  
                  
.blog-single-box {width: 33.3333333333333%;
                  float: left;
                  padding: 8px 22px 27px 22px;}   

.blog-single-box:nth-child(3n+1) {clear: both;}
                  
.b-single-img {width: 100%;}                  
                  
.b-single-img img {width: 100%;}

.blog-text {font-size: 20px;
             line-height: 23px;}                   
                  
.blog-text a,
.blog-text a h2 {color: #231F20;}                 
                  
.blog-text h2 {text-align: center;
                font-size: 16px;
                margin: 12px 0;}   
                
.more {text-align: center;
        color: #000;
        /*font-weight: 700;*/
        display: block;
        padding: 4px 0 6px 0;
        margin: 12px 0 0 0;
        transition: all .3s ease .15s;
        position: relative;}  
        
.more:before, 
.more:after {display: block; 
               content: '';
               width: calc(50% - 50px);
               height: 1px;
               background: #A7BAB6;
               top: 19px;
               position: absolute;
               opacity: 1;}  
               
.more:before {right: 0;}               
               
.more:after  {left: 0;}                                   
                
.more:hover {color: #fff;
             background: #A7BAB6;}                
                               
.more:hover:before,
.more:hover:after {opacity: 0;}                  
                  
.pagination {clear: both;
              width: 100%;
              text-align: center;
              /*padding: 50px 0;*/}                 
                  
/**********pagination***********/
.navigation li a,
.navigation li a:hover,
.navigation li.active a,
.navigation li.disabled {
	color: #fff;
	text-decoration:none;
}

.navigation li {
	display: inline;
}

.navigation li a,
.navigation li a:hover,
.navigation li.active a,
.navigation li.disabled {
	background-color: #5E5E5E;
	border-radius: 3px;
	cursor: pointer;
	padding: 4px 8px;
}

.navigation li a:hover,
.navigation li.active a {
	background-color: #424242;
}

.navigation ul {padding: 0;}

.navigation {display:flex;
        justify-content:center;

        display:-webkit-flex;
        -webkit-justify-content:center;
          padding: 15px 0 35px 0;}
                  
/***********PORTFOLIO-SINGLE************/ 

.ps-title {text-align: center;}

.ps-title h1 {color: #A7BAB6;
               text-transform: uppercase;
               font-size: 16px;
               margin: 35px 0 20px 0;
               font-weight: 400;}

.ps-text {width: 100%;
           max-width: 1100px;
           margin: 0 auto;
           padding: 0 25px;
           clear: both;}

.blog-single-img {width: 100%;
              max-width: 900px;
              margin: 0 auto;
              padding: 20px 0 0 0;}

.blog-single-img img {width: 100%;}


.ps-galeria {width: 100%;
             margin: 0 auto;
             padding: 20px 0 25px 0;
             clear: both;}

.pswp__bg {background: rgba(255, 255, 255, 0.8)!important;}

.pswp__ui--fit .pswp__caption { background-color: rgba(0, 0, 0, 0)!important;}

.pswp__caption h4 {color: #231F20!important;}


#full-screen-search #full-screen-search-close { display: none;}

#full-screen-search.open #full-screen-search-close { display: block;}

#full-screen-search { height: 0!important;
                     overflow: hidden!important;}

#full-screen-search.open { height: 100%!important;}

#full-screen-search form div input,
#full-screen-search form div {height: 0!important;}

#full-screen-search.open form div input,
#full-screen-search.open form div {height: 100px!important;}

#full-screen-search form div input {background: #A7BAB6!important;
                                    color: #fff!important;}

.portfolio-single-container,
.portfolio-home-container {padding-top: 70px;}

.portfolio-single-container a {color: #A7BAB6;
                               font-weight: 700;}

.portfolio-single-container ul li {padding: 0 0 0 25px;
                                   position: relative;}

.portfolio-single-container ul li:before {position: absolute;
                                          display: block;
                                          content: '';
                                          width: 6px;
                                          height: 6px;
                                          border-radius: 50%;
                                          -moz-border-radius: 50%;
                                          -webkit-border-radius: 50%;
                                          background: #A7BAB6; 
                                          top: 13px;
                                          left: 8px;}

.sm {float: right;
      text-align: right;}

.sm a {padding-left: 5px;}

.sm img {height: 15px;}


#crellyslider-1 {width: 100%!important;
               height: 100%!important;}

.crellyslider {width: 100%!important;
               height: 100%!important;}

.crellyslider li { width: 100%!important;
                  height: 100%!important;
	               background-size: cover ;
                     background-position: 50% 50%!important; }

.form-newsletter .clear {clear: none;}

#catapult-cookie-bar {color: #fff;
	                  background-color: #A7BAB6;}

/*******Galeria*********/

/*napis na zdjęciu po hover*/

.dgwt-jg-effect-standard .dgwt-jg-caption span {display: none!important;}

/*podpis pod dużym zdjęciem*/

.pswp__caption h4 {display: none!important;}

/*ikonki na galerii*/

.pswp__ui--fit .pswp__top-bar, .pswp__ui--fit .pswp__caption {
	background-color: rgba(255, 255, 255, 0)!important;}

.pswp__button,
.pswp__button--arrow--left::before,
.pswp__button--arrow--right::before {background: url(img/galeria-icons.png) 0 0 no-repeat!important;
                                     background-size: 264px 88px!important;}

.pswp__button.pswp__button--arrow--left,
.pswp__button.pswp__button--arrow--right {background: none!important;}

.pswp__button--zoom {background-position: -88px 0!important;}

.pswp__button--share {background-position: -44px -44px!important;}

button.pswp__button--close {background-position: 0 -44px!important;}


.pswp__button--arrow--right::before {right: 6px!important;
	                                 background-position: -94px -44px!important;}

.pswp__button--arrow--left::before {left: 6px!important;
	                                background-position: -138px -44px!important;}

.pswp__button--arrow--left::before,
.pswp__button--arrow--right::before {background-color: rgba(255, 255, 255, 0.9)!important;}


.dgwt-jg-effect-standard .dgwt-jg-caption {background: rgba(255, 255, 255, 0.5) none repeat scroll 0 0!important;}

/****/

.dgwt-jg-gallery.dgwt-jg-effect-standard .hover-in-top .dgwt-jg-caption {
    animation: none!important;
    -webkit-animation: none!important;
    -moz-animation: none!important;
    -ms-animation: none!important;
    bottom: auto;
    display: block;
    top: 0;
}
.dgwt-jg-gallery.dgwt-jg-effect-standard .hover-out-top .dgwt-jg-caption {
      animation: none!important;
    -webkit-animation: none!important;
    -moz-animation: none!important;
    -ms-animation: none!important;
    bottom: auto;
    display: block;
    top: -100%;
}


.dgwt-jg-gallery.dgwt-jg-effect-standard .hover-in-bottom .dgwt-jg-caption {
     animation: none!important;
    -webkit-animation: none!important;
    -moz-animation: none!important;
    -ms-animation: none!important;
    bottom: 0;
    display: block;
    top: auto;
}
.dgwt-jg-gallery.dgwt-jg-effect-standard .hover-out-bottom .dgwt-jg-caption {
     animation: none!important;
    -webkit-animation: none!important;
    -moz-animation: none!important;
    -ms-animation: none!important;
    bottom: -100%;
    display: block;
    top: auto;
}

.dgwt-jg-gallery.dgwt-jg-effect-standard .hover-in-left .dgwt-jg-caption {
    animation: none!important;
    -webkit-animation: none!important;
    -moz-animation: none!important;
    -ms-animation: none!important;
    display: block;
    left: 0;
    right: auto;
}
.dgwt-jg-gallery.dgwt-jg-effect-standard .hover-out-left .dgwt-jg-caption {
     animation: none!important;
    -webkit-animation: none!important;
    -moz-animation: none!important;
    -ms-animation: none!important;
    display: block;
    left: -100%;
    right: auto;
}

.dgwt-jg-gallery.dgwt-jg-effect-standard .hover-in-right .dgwt-jg-caption {
     animation: none!important;
    -webkit-animation: none!important;
    -moz-animation: none!important;
    -ms-animation: none!important;
    display: block;
    left: auto;
    right: 0;
}
.dgwt-jg-gallery.dgwt-jg-effect-standard .hover-out-right .dgwt-jg-caption {
    animation: none!important;
    -webkit-animation: none!important;
    -moz-animation: none!important;
    -ms-animation: none!important;
    display: none;
    left: auto;
    /*! right: -100%; */
}


@keyframes dgwt-jg-in-right {
    0% {
        right: 100%!important;
    }
    100% {
        right:100%!important;
    }
}
@keyframes dgwt-jg-in-left {
    0% {
        left: 100%!important;
    }
    100% {
        left: 100%!important;
    }
}
@keyframes dgwt-jg-out-right {
    0% {
        right: 100%!important;
    }
    100% {
        right: 100%!important;
    }
}
@keyframes dgwt-jg-out-left {
    0% {
        left: 100%!important;
    }
    100% {
        left: 100%!important;
    }
}
@keyframes dgwt-jg-in-top {
    0% {
        top: 100%!important;
    }
    100% {
        top: 100%!important;
    }
}
@keyframes dgwt-jg-in-bottom {
    0% {
        bottom: 100%!important;
    }
    100% {
        bottom: 100%!important;
    }
}
@keyframes dgwt-jg-out-top {
    0% {
        top: 100%!important;
    }
    100% {
        top: 100%!important;
    }
}
@keyframes dgwt-jg-out-bottom {
    0% {
        bottom: 100%!important;
    }
    100% {
        bottom: 100%!important;
    }
}


/****/

.ctcc-more-info-link {font-weight: 700!important;}

.crellyslider a, .crellyslider a:hover { color: #231F20;}

/************KONTAKT************/


.kontakt-container {width: 100%;
                     max-width: 800px;
                     margin: 0 auto;
                     padding: 70px 25px 100px 25px;}

.formularz-box {width: 100%;
                     max-width: 800px;
                     margin: 0 auto;
                     padding: 35px 25px 0 25px;}

.formularz-box input[type='text'],
.formularz-box input[type='email'],
.formularz-box textarea {width: 100%;
                          border: none;
                          border-bottom: 1px solid rgba(0, 0, 0, 0.5);
                          height: 20px;
                          color: #231F20;
                          font-size: 20px;
                          margin-bottom: 25px;}

.formularz-box input[type='submit'] {border: none;
                                     background: none;
                                     color: #231F20;
                                     font-size: 22px;
                                     cursor: pointer;
                                     display: inline-block;}

.input-submit {text-align: center;}
                          
.input-1 {padding-right: 10px;} 

.input-2 {padding-left: 10px;}                          
                          
.formularz-box textarea {height: 170px;}                          
                          
.input-50 {width: 50%;
           float: left;}                         

.input100 {width: 100%;}

#faqs {width: 100%;
       max-width: 1240px;
       margin: 0 auto;}

#faqs h3 {font-weight: normal;
          color: rgba(0, 0, 0, 0.5);
          font-size: 20px;
          position: relative;
          padding-left: 25px;}

#faqs h3:before {position: absolute;
                                          display: block;
                                          content: '';
                                          width: 6px;
                                          height: 6px;
                                          border-radius: 50%;
                                          -moz-border-radius: 50%;
                                          -webkit-border-radius: 50%;
                                          background: #A7BAB6; 
                                          top: 13px;
                                          left: 8px;}


.formularz-box ::-webkit-input-placeholder {color:#231F20;
                                           opacity: 0.8;
                                          font-size: 20px;}

.formularz-box :-moz-placeholder {color:#231F20;
                                  opacity: 0.8;
                                 font-size: 20px;}

.formularz-box ::-moz-placeholder {color:#231F20;
                                   opacity: 0.8;
                                   font-size: 20px;}

.formularz-box :-ms-input-placeholder {color:#231F20;
                                       opacity: 0.8;
                                       font-size: 20px;} 

.kontakt-container a,
.box-right-inside a {color: #A7BAB6;
                       font-weight: bold;}


.crellyslider > .cs-slides > .cs-slide > * { top: calc(45% - 80px) !important;
                                             width: 100% !important;
                                             text-align: center !important;
                                             font-size: 30px !important;
	                                          text-transform: uppercase;
                                             color: #231F20;
                                             font-family: 'Darker Grotesque', sans-serif!important;}

.crellyslider > .cs-slides > .cs-slide > * p {display: inline-block;
                                               background: rgba(255, 255, 255, 0.5);
                                               padding: 25px;
                                              font-size: 30px!important;
                                               line-height: 32px!important;}

.crellyslider > .cs-slides > .cs-slide > * a { font-size: 20px !important;
	                                           color: #231F20;
                                               text-transform: uppercase;
                                               font-weight: 700;}

#eu-cookie-bar {background-color: #A7BAB6;
                padding: 20px 0;
                font-size: 18px;}

button#euCookieAcceptWP {background: #fff;
                         color: #231F20;
                         padding: 4px 12px;
                         border-radius: 0;
	                     font-size: 14px;}

.portfolio-single-container {min-height: 720px;}

.bio-left {width: 50%;
           padding-right: 15px;
           float: left;}

.bio-left img {width: 100%;}

.bio-right {width: 50%;
           padding-left: 15px;
           float: right;}

.bio-right p:first-child {margin-top: 0;}

.column-count {column-count: 2;
               column-gap: 60px;}

/*********BIOSENNIE*********/

.biosennie-container { width: 100%;
                      clear: both;
                       display: flex;
                      justify-content: center;
                      flex-wrap: wrap;}
                      
.homebox {width: 50%;}                      

.box-left {background: url(img/fin_sypialnia.jpg) top right;
             background-size: cover;}

.box-right-inside {float: left;
                   width: 100%;
                   max-width: 720px;
                   padding: 25px 20px 50px 25px;}

.biosennie-img {display: none;}

.grecaptcha-badge { visibility: hidden; }
	
.biosennie-ngl {padding: 85px 0 25px 0;
                text-align: center;}

.foto-col2 {width: 100%;}

.foto-col2 img {width: 48%;
                margin: 0 1%;
                float: left;}

.home-ngl h2 {color:#231F20; }

.pts {padding-top: 0;}

.hblog {clear: both;}

.hblog h1 {margin-top: 25px;}