html, body {height: 100%; scroll-behavior: smooth;}

/*Merriweather*/

body {margin: 0 auto;
      padding: 0;
      font-family: Roboto, sans-serif;
      font-size: 18px;
      line-height: 36px;
      color: #5b7291;
      font-weight: 300;}

input[type='text'], input[type='email'], input[type='submit'], textarea, input[type='tel']
{font-family:  Roboto, sans-serif;
box-sizing: border-box;
font-weight: 300;}


*:focus {outline: 0;}

a {text-decoration: none;
   cursor: pointer;}

b, strong {font-weight: 600;}

div {box-sizing: border-box;}

.clear {clear: both;}

.center {text-align: center;}


ul {margin: 0;
    padding: 0;
    list-style: none;}

ul li {position: relative;}

.header-container {width: 100%;
                   margin: 0 auto;
                   height: 90px;
                   z-index: 10;
                   position: absolute;}

.header { width: 100%;
           max-width: 1640px;
           margin: 0 auto;
          padding: 0 20px;
         position: relative;
         display: flex;
         justify-content: space-between;}

.logo {padding-top: 30px;}

.logo img {width: 100%;}


.menu-phone {display: flex;
                 justify-content: right;}

.menu-phone ul li {display: inline-block;
                   font-size: 20px;
                   position: relative;
                   font-weight: 400;}

.menu-phone ul li a {color: #5b7291;
                      display: block;
                       padding: 22px 42px 24px 42px;
                       transition: all .3s ease .10s;
                      position: relative;}

/* Wstawka marka */
.menu-phone ul li > ul {position: absolute;
                         display: none;}

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

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

.menu-phone ul li:hover > ul li a {background: rgba(255, 255, 255, 0.7);
                                      padding: 8px 32px 8px 32px;}

.menu-phone ul li:hover > ul li a:hover {background: rgba(255, 255, 255, 1);}

.menu-phone ul li > ul li:last-child a {border-radius:  0 0 12px 12px;
                                         -moz-border-radius:  0 0 12px 12px;
                                         -webkit-border-radius:  0 0 12px 12px;}

.menu-phone ul li:hover > ul li a:before {display: none;}
/* Koniec wstawka marka */



.slider-container {position: relative;
                   z-index: 1;
                   width: 100%;
                   /*height: 735px;*/
                   background: #EAEDF4;
                   /* background-image: url("img/listing_bg.jpg"); */
                   overflow: hidden;}

.slider-home {position: relative;
                   z-index: 1;
                   width: 100%;
                   overflow: hidden;}

.slider {width: 100%;
         max-width: 1640px;
         margin: 0 auto;
         position: relative;
         padding: 120px 20px 40px 20px;
         display: flex;
         justify-content: space-between;
         align-items: center;
         flex-wrap: wrap;
         height: 100%;}

.slider-box {width: 40%;
             padding: 65px 25px 65px 0;
             color: #093d6d;}

.slider-foto {width: 60%;}

.slider-foto img {width: 100%;}

.slider h1 {font-size: 60px;
             color: #5b7291;
             font-weight: 400;
             font-family: Merriweather;
             margin: 0 ;
             line-height: 70px;}

.slider h1 .h-light {font-size: 40px;
                      font-weight: 300;}

.slider span {font-size: 22px;
               line-height: 36px;
               font-weight: 300;
              display: inline-block;}

.over {width: 100%;
       overflow: hidden;}

.bg1 {background: #F3F6FD;}

.bg2 {background: #EAEDF4;}

h2.title,
h1.title {font-size: 24px;
          color: #5b7291;
          font-weight: 300;
          font-family: Merriweather;
          line-height: 50px;}

.img-box-over h2.title {line-height: 35px;
                         text-align: center;}


h2 .h-red,
h1 .h-red {font-size: 50px;
           text-transform: uppercase;
           color: #fa2e2f;
           font-weight: 700;}

.counter-over {width: 100%;
               max-width: 1520px;
               margin: 0 auto;
               padding: 167px 20px 170px 20px;
               display: flex;
               justify-content: space-between;
               flex-wrap: wrap;}

.counter-box {display: flex;
               justify-content: left;}

.c1 {font-size: 88px;
     letter-spacing: -2px;
     color: #fa2e2f;
     font-weight: 700;
     padding-right: 23px;
     padding-top: 19px;}

.c2 {font-size: 28px;
     color: #5b7291;
     font-weight: 700;
     font-family: Merriweather;}




.projekty-over {width: 100%;
                 max-width: 1640px;
                 margin: 0 auto;
                 padding: 60px 20px 0 20px;
                 display: flex;
                 justify-content: center;
                 flex-wrap: wrap;}

.img-box-over {width: 900px;
               display: flex;
                 justify-content: space-between;
                 flex-wrap: wrap;}

.text-box {width: calc(100% - 900px);
           display: flex;
           align-items: center;
           padding: 0 0 60px 60px;}

.text-phone {display: none;}

.tb-left {padding: 0 60px 60px 0;}

.text-box .text {padding: 0 0 25px 0;}

.text-box h2.title {margin: 0;}

.button {font-size: 16px;
         color: #5b7291;
         font-weight: 400;
         font-family: Merriweather;
         border-radius: 23px;
         -moz-border-radius: 23px;
         -webkit-border-radius: 23px;
         border: 1px solid #b9bfe5;
         padding: 10px 30px;
         background: rgba(185, 191, 229, 0);
         transition: all .3s ease .10s;}

.button:hover { background: rgba(185, 191, 229, 1);}

.img-www.img-box-over .img-box {width: calc(50% - 27px);}

.img-box {width: calc(33% - 37px);
          margin-bottom: 50px;}


.img-box img {border-radius: 33px;
               -moz-border-radius: 33px;
               -webkit-border-radius: 33px;
               box-shadow: 0px 12px 7px #e1e6f1;
               width: 100%;}


.jp-over {width: 100%;
          max-width: 1640px;
          padding: 20px 20px 30px 20px;
          margin: 0 auto;
          display: flex;
          justify-content: space-between;
          flex-wrap: wrap;}

.jp-box {width: calc(25% - 37px);}

.jp-box p {margin-top: 10px;}

.jp-ngl {font-size: 28px;
         color: #5b7291;
         font-weight: 700;
         font-family:  Merriweather;}

.red {color: #fa2e2f;
      font-size: 33px;}



.form-box {width: 100%;
           max-width: 980px;
           margin: 0 auto;
           padding: 30px 20px 60px 20px;}

.form-box p {margin: 0;}

.f-row {width: 100%;
        display: flex;
        justify-content: space-between;
        padding-bottom: 25px;
        flex-wrap: wrap;}

.f-col {width: calc(33% - 24px);}

.form-box input[type='email'],
.form-box input[type='text'],
.form-box input[type='tel'],
.form-box textarea  {width: 100%;
                               height: 48px;
                               border-radius: 16px;
                               -moz-border-radius: 16px;
                               -webkit-border-radius: 16px;
                               border: 1px solid #d6d9ec;
                               background: rgba(255, 255, 255, 0);
                               box-sizing: border-box;
                               padding: 0 20px;
                               font-size: 18px;}

.form-box textarea {height: 180px;
                     width: 100%;
                     padding: 15px 20px;}

.form-box input[type='submit'] {font-size: 16px;
                                 color: #fff;
                                 font-weight: 400;
                                 font-family: Merriweather;
                                 border-radius: 23px;
                                 -moz-border-radius: 23px;
                                 -webkit-border-radius: 23px;
                                 border: 1px solid #fa2e2f;
                                 padding: 10px 55px;
                                 background: #fa2e2f;
                                 transition: all .3s ease .10s;
                                 cursor: pointer;
                                 margin-left: 72px;}

.form-box input[type='submit']:hover { background: rgba(250, 46, 47, 0.8);}

.form-box ::-webkit-input-placeholder {color: #5b7291;
                                      opacity: 1;}

.form-box :-moz-placeholder {color: #5b7291;
                                      opacity: 1;}

.form-box ::-moz-placeholder {color:  #5b7291;
                                      opacity: 1;}

.form-box :-ms-input-placeholder {color: #5b7291;
                                      opacity: 1;}


.h2-box {padding-top: 20px;}

.footer-container {clear: both;
                   width: 100%;
                   overflow: hidden;
                   background: #102331;
                   color: #fff;}

.footer {width: 100%;
           max-width: 1640px;
           margin: 0 auto;
          padding: 30px 20px 40px 20px;}

.menu-footer {width: 100%;}

.menu-footer ul {text-align: center;}

.menu-footer ul li {display: inline-block;
                     padding: 0 60px;}

.menu-footer ul li a {font-size: 14px;
                       text-transform: uppercase;
                       color: #ffffff;
                       font-weight: 400;}

.logo-footer {text-align: center;
              padding-top: 25px;}

.footer-kontakt {clear: both;
                   width: 100%;
                   overflow: hidden;
                   background: #EAEDF4;
                   display: flex;
                   justify-content: center;
                   flex-wrap: wrap;}

.footer-kontakt a {font-size: 18px;
                    color: #0f2330;
                    font-weight: 400;
                    padding: 20px 60px 40px 60px;}


/*BUTTON*/

.menu-button {
  position: absolute;
  top: 22px;
  right: 30px;
  background: transparent;
  display: none;
  cursor: pointer;
  border: 1px solid #5b7291;
  border-radius: 8px;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
   padding: 10px; }


.menu-button:focus {outline: none;}

.menu-button .menu-ico {display: block;
                       width: 22px;
                        height: 1px;
                         background: #5b7291;}


.menu-button .menu-ico + .menu-ico { margin-top: 4px;}

/************PODSTRONA***************/

.pds-container {width: 100%;
                overflow: hidden;
                background: #F3F6FD;}

.singleproject-container { width: 100%;
                            max-width: 1640px;
                           margin: 0 auto;
                            padding: 30px 20px 0 20px;
                            display: flex;
                           justify-content: flex-between;
                           flex-wrap: wrap;}

.singleproject-container h2.title {margin-bottom: 0;}

.single-box1 { width: 910px;
              display: flex;
              justify-content: space-between;
              flex-wrap: wrap;
              padding: 30px 0 50px 0;}

.single-box1 img {border-radius: 33px;
               -moz-border-radius: 33px;
               -webkit-border-radius: 33px;
               box-shadow: 0px 12px 7px #e1e6f1;
               width: 100%;}

.single-box2 { width: calc(100% - 910px);
               padding: 0 0 60px 60px;}

.slider-podstrona {padding-top: 80px;}

.slider-podstrona img {width: 100%;}

.tech {line-height: 20px;
       display: block;
       padding-bottom: 20px;}

.single-box2 .text {padding-bottom: 50px;}

.foto1 {width: 643px;}

.foto2 {width: 205px;}

.foto-mini-box {width: 100%;}

.foto2 img {margin-bottom: 40px;}

.slide-mobile {display: none;}

.sbox-phone {display: none;}

/******PODSTRONA TEXT*******/

.pds-text-container {width: 100%;
                     overflow: hidden;
                     background: #F3F6FC;}

.pds-top {width: 100%;
          height: 90px;
          background: #EAEDF4;}

.pds-text-box {width: 100%;
               max-width: 1640px;
               margin: 0 auto;
               padding: 40px 20px 50px 20px;}

.pds-text-box ul li {padding: 0 0 0 24px;
                        position: relative;}

.pds-text-box ul li:before {position: absolute;
                             content: '';
                             display: block;
                             width: 8px;
                             height: 8px;
                               border-radius: 50%;
                              -moz-border-radius: 50%;
                              -webkit-border-radius: 50%;
                              background: #fa2e2f;
                              left: 4px;
                              top: 13px;}

.lista-wpisy {display: flex;
              justify-content: left;
              flex-wrap: wrap;}

.lista-wpisy .img-box-over {width: 33%;
                            padding: 0 15px 30px 15px;
                            display: block;}

.lista-wpisy .img-box {width: 100%;}

.box-over-banery .img-box img  { border-radius: 10px;
                                -moz-border-radius: 10px;
                                -webkit-border-radius: 10px;}

.box-over-banery .img-box {width: calc(50% - 27px);
                           margin-bottom: 30px;}

.over-logos .img-box img {background: #F3F6FD;}

.c-box p {margin: 0;
          font-size: 14px; }

.c-box a {color: #5b7291;
          position: relative;}

.c-box a:before {position: absolute;
                 transition: all .3s ease .10s;
                 width: 100%;
                 height: 1px;
                 content: '';
                 background: #5b7291;
                 left: 0;
                 bottom:0;
                 opacity: 0;}

.c-box a:hover:before {opacity: 1;}

.form-box input[type='checkbox'] {display: none;}

.form-box label {position: relative;}

.wpcf7-list-item-label {padding-left: 28px;}


.form-box .wpcf7-list-item-label:before { position: absolute;
                                                      top: -4px;
                                                      left: 0;
                                                      content: "";
                                                      width: 20px;
                                                      height: 20px;
                                                     border-radius: 6px;
                                                     -moz-border-radius: 6px;
                                                     -webkit-border-radius: 6px;
                                                     background: #ffffff;
                                                     border: 1px solid #d4d4d4;}


.wpcf7 .form-checkbox input[type='checkbox']:checked + .wpcf7-list-item-label:before {
                                                  background-image: url("img/check.svg");
                                                  background-position: center;
                                                  background-repeat: no-repeat;
                                                 background-size: 14px;}

.logos-over {padding-top: 20px;}

.wpcf7-list-item {margin: 0;}

.f-row-ta {padding-bottom: 5px;}

.grecaptcha-badge { 
    visibility: hidden;
}

.captcha-info {font-size: 10px;
               line-height: 10px;
               color: #5e5e5e;
               font-weight: 400;
                text-align: center;
                padding-top: 18px;}

.captcha-info a {color: #5e5e5e;}

/* Marek */
.lang-box ul li a {padding: 22px 8px 33px 8px;
                   text-transform: uppercase;}

.lang-box ul li {position: relative;}

.lang-box ul li:first-child {padding-right: 4px;}

.lang-box ul li:first-child:before {width: 1px;
                                    height: 18px;
                                    content: '';
                                    position: absolute;
                                    background: #d4d4d4;
                                    right: 0;
                                    top: 30px;
                                    display: block;}