div, form {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

html, body, p, ul, li {
  margin: 0;
  padding: 0; }
  p {margin-top: 15px}
  body {font-family: "light"; font-size: 18px; color: #333; line-height: 1.4; font-weight: 100; overflow-x: hidden}
  b, strong {font-family: "bold"; font-size: 21px}
  img {max-width: 100%}
  ul {padding-left: 40px}

@font-face {
  font-family: "light";
  src: url("../fonts/Fontfabric - MullerLight.otf"); }
@font-face {
  font-family: "regular";
  src: url("../fonts/Fontfabric - MullerRegular.otf"); }
  @font-face {
  font-family: "medium";
  src: url("../fonts/Fontfabric - MullerMedium.otf");}
  @font-face {
  font-family: "bold";
  src: url("../fonts/Fontfabric - MullerBold.otf"); }
 
  
  h1, h2, h3, h4, h5, h6 {font-family: "bold"; margin: 15px auto; line-height: 1.2;}
  #bg100 h1, #bg100 h2, #bg100 h3, #bg100 h4, #bg100 h5, #bg100 h6 {color: #fff}
  h1 {font-size: 40px; margin: 50px 0 0; display: inline-block; color: #fff; background: #009710; padding: 10px 20px 1px}
  h2 {font-size: 48px;}
   h3 {font-size: 36px; line-height: 1.5}
  h4 {font-size: 24px; }
   h5 {font-size: 22px; font-family: "light"; padding: 0 10px 50px; font-weight: 100; }
  h6 {font-size: 22px; margin: 25px auto 0}
 	  a {color: #009710; text-decoration: none; display: block}
		  li{position: relative; list-style: none; text-align: left; line-height: 1.5}
	  li::before {position: absolute; content: ""; background: #009710;     width: 8px;    height: 8px;    left: -30px;    top: 11px;}

#box100 { width: 100%; display: block; text-align:center; }
#box90 { max-width:1200px; margin: 0 auto; text-align:center; padding: 50px 0;}
#bg100 {width: 100%; display: block;  text-align:center; color: #fff;}
#bl2 {width: 50%; display: inline-block; vertical-align: top; text-align: left; margin: 0 -1.5px}
#box2 { display: inline-block; margin: 20px auto ; width: 49.5%; padding: 10px; text-align: left; vertical-align: top;}
#box2c { display: inline-block; margin: 0 auto; width: 66%; padding: 10px; text-align: left; vertical-align: top;}
#box3 { display: inline-block; margin: 0 auto; width: 33%; vertical-align: top;}
#box4 { display: inline-block; margin: 0 auto; width: 24.5%; padding: 0;  vertical-align: top;}
#box5 { display: inline-block; margin: 0 auto; width: 19.5%; padding: 0;  vertical-align: top;}

.menu {display: -webkit-box; display: flex;    background: #fff; font-family: "bold";
  padding: 15px; color: #333; font-size: 24px; justify-content: space-between; align-items:center}
  .header #box90 {padding: 0 50px}
  .menu li {padding-right: 20px;}
  .menu li::before, .menu_mobile li::before {display: none}
.menu a { cursor: pointer; width: 200px; height: 70px; background: #009710; font-size: 19px; font-family: "bold"; text-align: center; 
  display: block; color: #fff; border: none; padding-top: 24px; border-radius: 50px; box-shadow: 0 10px 20px #666;     box-sizing: border-box;}
.menu a:hover {background: #ff131c}
.menu_mobile {display: none}

.lead {background: url(../images/lead.jpg) center top no-repeat; min-height: 825px}
.lead #box90 {padding: 0}
#box2.logo {padding-left: 5%;}
#box2.contacts {padding-left: 15%; font-family: "regular"}
.phone {font-family: "bold"; font-size: 24px}
	i {color: #009710; margin-right: 10px; font-size: 24px}
.green {background: #009710; padding: 10px 15px; color: #fff}
.lead h3 {font-size: 30px; font-family: "medium"; font-weight: 400}
.lead ul {max-width: 600px; margin: 30px auto 0; font-size: 21px;}

.banner {display: block; margin: 0 auto}

.choice {background: url(../images/choice.jpg) center no-repeat}
.choice.alt {background: url(../images/choicealt.jpg) center no-repeat}
.choice.bau {background: url(../images/choicebau.jpg) center no-repeat}
.baumit {margin-top: -100px}
#box2.video {padding-top: 60px}
#box2.hidden {display: none}
iframe {width: 97%; height: 350px; border: solid 10px #fff; box-shadow: 0 5px 20px #666}
 .p20 {padding-left: 25px}
  .p50 {padding-left: 40px}
  .cedral h3, .baumit h3 {padding: 0 15px}
  .cedral ul, .baumit ul {margin-left: 40px}
  .cedral li::before, .baumit li::before {left: -20px; top: 9px}
  .grey {background: #eeeff1; padding: 10px 40px}
  
   .fasaiding_benefits {background: url(../images/fasajdyng.png) 100% 5% no-repeat;}
   .baumit_benefits {background: url(../images/baumit_logo.jpg) 100% 5% no-repeat;}
  .fasaiding_benefits #box2, .baumit_benefits #box2 {padding: 0}
   .fasaiding_benefits #box90 {padding: 50px 0 0}
  .fasaiding_benefits h6, .baumit_benefits h6 { margin: 15px auto 0;}
  #box2.slider {padding-top: 50px}
.object {width: 100%; height: 400px; box-shadow: 0 10px 20px #666}
.icon {display: inline-block; vertical-align: middle; width: 25%; text-align: center; padding-top: 20px}
.icon img {max-width: 70px}
.benefit {display: inline-block; vertical-align: middle; width: 74%;}

.why {background: url(../images/why.jpg) center; background-attachment: fixed}
.why #box90 {padding: 50px 0 0}
#box2.man {margin: 0 auto; padding: 0; text-align: center}
.man img {margin-bottom: -8px}
.why .icon {    background: url(../images/square.png) center no-repeat; background-size: contain; font-size: 42px;  font-family: "bold";  height: 140px;    padding-top: 44px;
width: 20%; margin-right: 5%}
.why h6 {margin: 10px auto 0}
.cheap {background: url(../images/cheap.jpg) center top no-repeat;}
.cheap #box90 {padding: 80px 0 50px}
.cheap form {margin-top: -150px}
a.hidden {display: none}

.defect img {box-shadow: 0 10px 20px #666}
.defect .grey {margin-top: 40px; padding: 20px 15px}
.owl-carousel .owl-item .defect .grey img { display: inline-block; width: 50px; vertical-align: middle; box-shadow: none}
.wrong { display: inline-block; width: 75%; vertical-align: middle; text-align: left; font-family: regular; line-height: 1.2; padding-left: 10px; font-size: 17px}
.portfolio {background: url(../images/portfol.jpg) center; background-attachment: fixed}
.portfolio .object {height: 300px; box-shadow: 0 10px 20px #333}

.team h4 {display: inline-block}
a.call {font-size: 16px; font-family: "bold"; color: #333; margin-top: 20px; padding-left: 20%}
.call img {width: 35px; margin-top: -5px}
a.call:hover {-webkit-transform: scale(1.1); transform: scale(1.1)}

.ps {background: url(../images/ps.jpg) center bottom no-repeat; padding: 250px 0 50px; margin-top: -200px}

	
.footer {background: #222; color: #fff }
.footer a {display: inline-block}
.footer #box3 {text-align: left}
.footer img {display: block; margin: 0 auto}


.tabs__content { display: none; }
.tabs__content.active {    display: block; padding-top: 50px}
.tabs__caption {display: flex;     justify-content: space-between; align-items: center;  padding: 0; background: #999; box-shadow: 0 10px 20px #999;}
.tabs__caption li:first-child {border-right: solid 1px #ccc}
.tabs__caption li {  width: 47%;  padding: 15px 15px 0;    text-align: center; font-family: "bold"; font-size: 30px;  background: #f5f5f5}
.tabs__caption li img { height: 70px}
.tabs__caption li::before {display: none}
.tabs__caption li:not(.active) {border-bottom: solid 5px #f5f5f5;	cursor: pointer;}
.tabs__caption li:not(.active):hover {border-bottom: solid 5px #999}
.tabs__caption .active {border-bottom: solid 5px #009710}
/*.tabs__caption li:not(.active) {	cursor: pointer;}
.tabs__caption li:not(.active):hover {	background: #f5f5f5}
.tabs__caption .active {color: #fff;   background: #009710}*/

.catalog h3, .table {margin-top: 50px}
.table {width: 100%}
.table, .table strong {font-size: 16px}
.table th {background: #f5f5f5; padding: 10px 5px}
.owl-aeroc .owl-item {padding: 0}
.owl-aeroc .owl-item img {width: auto; display: inline-block}
.owl-aeroc .owl-nav button.owl-next, .owl-aeroc .owl-nav button.owl-prev {top: 460px}

.blocks .choice img {height: 50px}

.popup-window {
  display: none;
  position: fixed;
  z-index: 99999999999;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-align-items: center;
  align-items: center;
  background-color: rgba( 0, 0, 0, 0.90 );}
  .popup-window.popup-colors {  background-color: #fff; overflow-y: scroll; -webkit-align-items: start;  align-items: start;}
  .colors { display:block}
  .colors h3{margin: 50px 10px 0;}
  .color {display: inline-block; width:250px; text-align: center; vertical-align: top}
  .color img {display: block; max-width: 200px; margin: 30px auto 10px}
  
  form {width: 400px;  padding: 30px 30px 50px;    background: #fff;    text-align: center; border: solid 10px #009710       }
		input[type="text"], input[type="tel"], input[type="email"] {width: 300px; height: 30px; display: block; margin: 15px auto 0; border: none; border-bottom:solid 1px #ccc; font-size: 18px; 
color: #999; text-align: left; padding: 5px 0 5px 30px; font-family: "light"}
.popup-call, input[type="submit"], .scroll, .popup-price {cursor: pointer; width: 300px; height: 70px; background: #ff131c; font-size: 19px; font-family: "bold"; text-align: center; margin: 40px auto 0; 
display: block; color: #fff; border: none; padding-top: 24px; border-radius: 50px; box-shadow: 0 10px 20px #666;     box-sizing: border-box;}
input[type="submit"] {padding-top: 1px}
input[type="submit"]:hover, .popup-call:hover {background: #f5a21f}
input[type="submit"], .popup-call, .contacts, a.call {-webkit-transition: all 1s ease;     -moz-transition: all 1s ease;     -o-transition: all 1s ease;
      -ms-transition: all 1s ease;          transition: all 1s ease;}
	
    .popup-close {
      position: absolute;
      right: 20px;
      top: 20px;
      width: 30px;
      height: 30px;
      background: url("../images/close.png") no-repeat;
      -webkit-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
      cursor: pointer; }
	 
      .popup-window form input:focus {
        outline: none; }
     
  .popup-success {
    text-align: center;
    display: none; }
    
    .blocks h1 {font-size: 48px}
   .blocks h5 {padding-bottom: 30px}
    .blocks .lead {background: url(../images/blocks/lead.jpg) center top no-repeat}
    .images_lead {display: flex; padding-top: 20px; justify-content: center}
    .images_lead img {height: 50px; margin: 0 15px}
    .blocks .baumit {margin-top: 0}
    .blocks .choice {background: none}
    .blocks #box2.slider {padding: 50px 20px 0}
    /*.blocks .baumit_benefits {background: url(../images/blocks/kerameia_logo.png) 90% 25% no-repeat;}
    .blocks .fasaiding_benefits {      background: url(../images/blocks/aeroc_logo.png) 5% top no-repeat;
  }*/
  .blocks .baumit_benefits ,
    .blocks .fasaiding_benefits {      background: none  }
  .imagetext {width:100%; margin: 0 auto; display: block}
  .krovlifasady {background: url(../images/blocks/krovlifasady.jpg) center; padding: 50px 0}
  .blocks .ps  {    background: #f5f5f5;    padding: 0 ;    margin-top: 0;}
  .blocks .fasaiding_benefits #box90 {padding: 50px 0}
  .blocks .team #box90 {max-width: 1500px}
  .blocks .team #box4 {width: 280px; margin-bottom: 30px; padding:0}
.m30 {margin-bottom: 50px}

 .footer img {
    display: inline-block;
    max-height: 100px;
    margin: auto 5%;
    vertical-align: middle;
}
 .footer img:last-child {
  max-height: 50px;
}
 .footer #box3 {vertical-align: middle;}
 .footer #box3:first-child {width:23%}

@media screen and (max-width: 1200px) {
	.cheap #box90 { padding: 30px 0 50px;}
.cheap #box3 {width: 400px}	
.cheap #box2c {width: 60%; padding-right: 30px}
.cheap form { margin-top: -100px;}
	}

@media screen and (max-width: 1100px) {
a.call {padding-left: 5%; text-align: left}  
.team .call img {margin-right: 10px}
.ps {    background: url(../images/ps.jpg) 80% bottom no-repeat; padding: 0 0 50px; margin-top: 0}
.ps #box2 {width: 600px}
	}
	
	@media screen and (max-width: 1050px) {
#box2.contacts {  padding-left: 5%;}
.why #box2 {width: 59%}
#box2.man {width: 40%; padding-top: 50px}
.cheap #box2c {width: 50%}
.color {width: 24.5%}
.color b {font-size: 18px}
	}
	
@media screen and (max-width: 1000px) {	
.choice #box2, .fasaiding_benefits #box2, .baumit_benefits #box2 {width: 600px}
#box2.hide {display: none}
#box2.hidden {display: inline-block}
#box2.video {padding: 50px 10px}
.choice, .choice.alt, .choice.bau {background: none}
.cedral {background: url(../images/cedral.jpg) left bottom no-repeat}
.baumit {background: url(../images/baumit.jpg) right bottom no-repeat}
.fasaiding_benefits {background: url(../images/cedral_logo.jpg) 5% 67% no-repeat;}
.baumit_benefits { background: url(../images/baumit_logo.jpg) 100% 62% no-repeat;}

.cheap #box2c {width: 600px}
.cheap #box3 {display: none}
a.hidden {display: block}

.defects .owl-theme .owl-item { padding: 15px}
#box4 {width: 49%; margin-bottom: 30px; padding: 0 10%}
#box5 {width: 49%; margin-bottom: 30px; padding: 0 10%}
.team img {display: block; margin: 0 auto}

.blocks .baumit, .blocks .cedral {  background: none}
}

@media screen and (max-width: 940px) {
#box3 {width: 32%}
}

@media screen and (max-width: 900px) {
#box2.man {padding-top: 100px}
}

@media screen and (max-width: 860px) {
h1 {font-size: 54px}
.why #box2 {width: 600px}
#box2.man {display: none}
.color img {max-width: 90%}

.lead {padding-top: 20px}
.menu {display: none}
.menu li{display: none}
    .menu_mobile  {
        z-index: 111;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        position: fixed;
        right: 0;
        width: 300px;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        top: 0;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        height: 100vh;
        background: #fff; color: #333;
        -webkit-transition: -webkit-transform .35s ease;
        transition: -webkit-transform .35s ease;
        -o-transition: transform .35s ease;
        transition: transform .35s ease;
        transition: transform .35s ease,-webkit-transform .35s ease;
        -webkit-transform: translateX(100%);
        -ms-transform: translateX(100%);
        transform: translateX(100%);}
    
        .menu_mobile a {color: #009710; margin: 10px auto; font-family:"bold"}
    
        .menu_mobile.active {
            -webkit-transform: translateX(0);
            -ms-transform: translateX(0);
            transform: translateX(0);
        }
    
        .hamburger {background: #f5f5f5;
            display: block;
    position: absolute;
    top: 10px;
            left: -40px;
            width: 30px;
            -webkit-transition: left .35s ease;
            -o-transition: left .35s ease;
            transition: left .35s ease;
        }
        .hamburger img {
            width: 30px;
            position: absolute; 
        }
        .hamburger .close {
            opacity: 0;
        }
        .menu_mobile.active .hamburger {
            left: 25px;
        }
        .menu_mobile.active .hamburger img {
            opacity: 0;
        }
        .menu_mobile.active .hamburger .close {
            opacity: 1;
        }
}

@media screen and (max-width: 800px) {	
.lead ul {max-width: 500px;}
#box4 {padding: 0 5%}
#box3 {width: 49%}
#box3.logo {display: none}
.color {width: 24%}

.krovlifasady {  background: url(../images/blocks/krovlifasady.jpg) center; background-size: cover;  padding: 0; }
.krovlifasady #box2 {width: 100%; margin: 0}
.krovlifasady #box2:last-child a {margin-top: 15px}
}

@media screen and (max-width: 600px) {
.choice #box2, .fasaiding_benefits #box2, .baumit_benefits #box2, .why #box2, .ps #box2, .cheap #box2c, #box5, #box4, #box3 {width: 100%}
 h1 {font-size: 36px}
  h2 {font-size: 30px;}
   h3 {font-size: 27px}
  h4 {font-size: 24px; }
   h5 {font-size: 18px; padding: 0 10px 30px;}
  h6 {font-size: 18px}
  body {font-size: 16px}
  b {   font-size: 18px}
  .lead h3 { font-size: 24px}
  .green {padding: 5px 10px}
  
  .lead {min-height: auto}
  #box2.logo {width: 35%; padding: 10px 0 0 5%}
  #box2.contacts {width: 63.5%; font-size: 15px}
  i, .phone {   font-size: 18px}
   .lead ul {   font-size: 19px; padding-left: 50px; font-family: "regular"}
  .popup-call, input[type="submit"] { font-size: 18px; width: 270px}
  form {  width: 100%}
  		input[type="text"], input[type="tel"], input[type="email"] {width: 250px; font-size: 16px; }
      .blocks .choice img {
        float: none;
    }
    .imagetext {height: auto
  }
  
  .p50 { padding-left: 10px;}
  iframe {  width: 95%;   height: 250px;}
  .choice .popup-call {width: 250px; font-size: 17px}
  .cedral {  background: url(../images/cedral.jpg) 20% bottom no-repeat;}
  
  .icon img { max-width: 60px;}
  .owl-theme .owl-item {  padding: 0;}
  .object {  height: 300px}
  
  a.call { margin-top: 10px;    padding-left: 15%}
  .ps {    background: url(../images/ps.jpg) 60% bottom no-repeat;}
  .ps #box90{padding:0}
  #box3 {padding: 0 10px 20px}
  .color {width: 32%}
  .color b {font-size: 16px}

  .blocks .lead {    background: url(../images/blocks/lead.jpg) center top; background-size: cover; padding-bottom: 50px}
  .blocks h1 {font-size: 36px}
  .images_lead {justify-content: space-around}
    .images_lead img {height: auto; margin: 0; width: 45%}
  .tabs__caption li {    font-size: 20px}
  .tabs__caption li img {height: auto}
  .catalog h3 {padding: 0 10px}
  .catalog #box2c {width: 100%}
  .table, .table strong {font-size: 14px}
  .owl-aeroc .owl-nav button.owl-next, .owl-aeroc .owl-nav button.owl-prev {
    top: 200px;
}
.owl-aeroc .owl-item {overflow: scroll}
.catalog #box90 {padding-bottom: 0}
.blocks #box2.video {padding-bottom: 0; margin-bottom: 0}
.blocks #box2.slider {
  padding: 0 20px;
}
.footer #box3:first-child {width:100%}
}

@media screen and (max-width: 470px) {
.why .icon { font-size: 24px;    padding-top: 57px;}
}

@media screen and (max-width: 420px) {

}

@media screen and (max-width: 400px) {

}

@media screen and (max-width: 370px) {

}


/*# sourceMappingURL=style.css.map */