/******************ALL******************/
.wrapper{ max-width:100%; width: 1200px; margin: 0 auto; padding:60px 45px; position: relative; z-index: 1; font-size: 16px}
.bigbg{background:url(/assets/images/bg.jpg); height: 940px;   width: 100%;background-position: top right;  background-repeat: no-repeat; position:absolute; top:0; left:0; right:0}

body{ font-family: 'Open Sans'; font-size: 18px; color: #242424; background-color: #fafbfd}
a {text-decoration: none;}

img {
  max-width: 100%;
}
.row{
  display: flex;
  flex-wrap: wrap;
  
}
.mobile-menu{display:none}
.btn {
    background-color: #F13F3F;
    border: none;
    color: #fff;
    padding: 15px 20px;
    font-family: Open Sans;
    font-style: normal;
    font-size: 16px;
    line-height: 22px;
    text-align: center;
    letter-spacing: 0.02em;
    box-shadow: 0px 4px 10px rgb(17 55 100 / 20%);
    border-radius: 5px;
}
h2{
  font-weight: 800;
  font-size: 30px;
  line-height: 41px;
  text-align: center;
  text-transform: uppercase;
    margin-bottom: 30px;
}
p {line-height: normal}
p{margin-bottom: 12px}

/*************** HEADER *******************/
header.header{background: #fff;
    position: relative;
    z-index: 1;
}
header .wrapper{ padding-top: 0; padding-bottom: 0;}

header .row{
  border-bottom: 1px solid #E5E4E4;
  padding: 15px 0;
  justify-content: space-between;
  align-items: center;
}
header .logo{

  flex-basis: 0;
  flex-grow: 1;

}
header .logo .mobile{display: none}

header .messengers {
  
  word-spacing: -1em;
  flex-basis: 0;
  flex-grow: 1;
  text-align:center; 
}
header .messengers a:not(:last-of-type){margin-right: 20px;}
header .messengers img{ width: 28px}


header .social{flex-grow:1;text-align:right; display: flex; align-items: center; justify-content: center; font-size:0.86em}
header .social .address{font-weight:300;margin-left:5px;padding-top:12px}
header .social .link{display:block;margin-top:10px}
header .social p{letter-spacing: 0;font-size: 1.02em;line-height: 1.429em;color: #222;}


header .phone{

  flex-basis: 0;
  flex-grow: 1;
  text-align: right;
  min-width: 204px;
}
header .phone img{padding-right: 5px; vertical-align: bottom}
header .phone a{

  font-weight: 600;
  font-size: 20px;
  line-height: 20px;   
  text-align: right;
  color: #242424;
}
header .calc-btn{padding: 10px 15px; margin-left: 30px }


header nav {position: relative;z-index: 1; text-align: center}
header .shadow {box-shadow: 0px 10px 20px 0px #c9a169;  color: #fff; border:1px solid #fff; margin: -2px 0 0; position: relative; z-index: 0;}
header nav a{color: #676767; font-size: 16px; line-height: 43px;}
header nav ul{word-spacing: -1em;}
header nav li{display: inline-block;word-spacing:normal; margin-right: 60px; height: 43px;}
header nav li:last-of-type{ margin:0px}
header nav li:hover, .header-nav li:focus,.header-nav li:active{border-bottom: 2px solid #f39105;}

.btn-green{border:1px solid #7e993c ;background-color:#9BBA5B;color:#fff;padding:10px 15px;; transition: .3s ease;display:block; font-weight:bold; font-size:14px}
.btn-green:hover{border:1px solid #7e993c;background-color: #7e993c;}

.intro .row {
  
 display:flex; 
 justify-content: space-between;
  background-size: cover;
  position: relative;

}
.intro h1{
  font-weight: 800;
  font-size: 48px;
  line-height: 60px;
  text-transform: uppercase; 
    max-width: 70%
 
}


.intro .sepa{ background-color: #7e993c; width: 150px; height: 4px; border-radius: 2px; margin: 15px 0}
.intro h3{ color:#000; font-weight: 300; font-size: 24px; margin-top: 20px;  width: 50%; line-height: normal; margin-bottom: 15px }

.intro .sale{margin-top: 50px; display: inline-block}
.intro .left{width:60%}
.intro .right{
    position: absolute;
    right: 0px;
    top: 80px;
    max-width: 40%;
}
.intro .right img{}
.intro .main_banner_item img{ vertical-align:top; margin-right:15px; float:left}
.intro .main_banner_items{display:flex; flex-wrap:wrap; justify-content: space-between; margin-top: 75px;}
.intro .main_banner_items .main_banner_item{ width:50%; margin-bottom: 50px; padding-right: 10px}
.intro .btn-green{margin:30px 0 0;}

.intro.service  h2{margin-top: 50px}
.intro.service .main_banner_items{padding-right: 15px}
.intro.service ul li {
    margin-bottom: 12px;
    font-size: 16px;
    position: relative;
    padding-left: 30px;
}
.intro.service ul li:before {
    background: url(/assets/images/checkmark.svg)no-repeat;
    color: #fff;
    content: " ";
    left: 0;
    height: 18px;
    position: absolute;
    width: 18px;
}



.intro.goods  h2{margin-top: 50px}
.intro.goods .main_banner_items{padding-right: 15px}
.intro.goods ul li {
    margin-bottom: 12px;
    font-size: 16px;
    position: relative;
    padding-left: 30px;
}
.intro.goods ul li:before {
    background: url(/assets/images/checkmark.svg)no-repeat;
    color: #fff;
    content: " ";
    left: 0;
    height: 18px;
    position: absolute;
    width: 18px;
}
.intro.goods .right img{width: 100%}


.gallery .row div {
    display: block;
    flex-grow: 1;
    min-width: 0;
    width: 25%;
    max-width: 25%;
    aspect-ratio: 3/4;
    padding: 8px;
    
}
.gallery .row div a {
    display: block;
    width: 100%;
    height: 100%;
    padding: 15px 10px
    
}
.gallery .row div a span{color: #7e993c; background: #fff; border-radius: 7px; padding: 3px 5px; font-weight: bold}

/*************** ABOUT *******************/
.about{}

/*************** ABOUT_SEPA *******************/
.about-sepa .row{justify-content: space-between;  align-items: center;}
.about-sepa .row div{height: 266px;flex-basis: 0; flex-grow: 1;}
.about-sepa .row .sepa1{ background: url(/assets/images/sepa1.jpg) no-repeat center;background-size: cover;}
.about-sepa .row .sepa2{ background: url(/assets/images/sepa2.jpg) no-repeat center;background-size: cover;}
.about-sepa .row .sepa3{ background: url(/assets/images/sepa3.jpg) no-repeat center;background-size: cover;}
.about-sepa .row .sepa4{ background: url(/assets/images/sepa4.jpg) no-repeat center;background-size: cover;}

/*************** advantage *******************/

.advantage-block .col {
    flex-basis: 0;
    flex-grow: 1;
    min-width: 0;
    max-width: 50%;
    margin-right: 30px;
    margin-bottom: 30px;
}
.advantage-block .text {
    font-size: 16px;
    line-height: 24px;
    color: #494848;
}
.advantage-block .title {
    font-weight: 600;
    font-size: 16px;
    line-height: 22px;
    margin: 10px 0;
    text-transform: uppercase;
   
}
.advantage-block .sepa{ background-color: #a7917a; width: 100px; height: 3px; border-radius: 2px; margin: 5px 0 15px}

/*************** advantage *******************/
.selection  {}
.selection .sepa{ background-color: #a7917a; width: 150px; height: 3px; border-radius: 2px; margin: 0px auto 30px auto}
.selection .subtitle{font-weight: 300; font-size: 22px; line-height: 28px; text-align: center; margin:15px auto 30px auto; width: 70%;}
.selection h3  { font-size: 20px; margin-top: 20px; margin-bottom: 30px; font-weight: 600 }
.selection .col {
    flex-basis: 0;
    flex-grow: 1;
    min-width: 0;
   
    margin-right: 30px;
    
}
.selection p{font-size: 16px}
.width .col.left{max-width: 41%}

.selection.width{background-color: #ebebeb; }
.selection.type img{ display: block; margin-bottom: 30px}
.selection strong{font-weight: bold}
.selection .relative{position: relative}
.selection .absolute{position: absolute;
    bottom: 0;
    padding: 15px;
    background: rgba(255,255,255,0.6);
    font-size: 16px;
    font-style: italic;
}

/*************** calculator *******************/

.calculator.calc .wrapper{padding-bottom: 15px}
.calculator.order {background-color: #ebebeb}
.calculator.order .wrapper{padding-top: 15px}

.calculator .sepa{ background-color: #a7917a; width: 150px; height: 3px; border-radius: 2px; margin: 0px auto 30px auto}
.calculator .subtitle{font-weight: 300; font-size: 22px; line-height: 28px; text-align: center; margin:15px auto 15px auto; width: 70%;}


.calculator .form-calculator{width: 460px; max-width: 100%; margin: 30px auto 0 auto}
.calculator label{display: block; margin: 25px 0 10px; font-size: 16px; font-weight: bold}

.btn.orange {
    background-color: #f48951;
    border: 1px  solid #eee;
    color: #fff;
    padding: 12px 0px;
    font-family: Open Sans;
    font-style: normal;
    font-size: 16px;
    line-height: 22px;
    text-align: center;
    letter-spacing: 0.02em;
    box-shadow: 0px 4px 10px rgb(17 55 100 / 20%);
    border-radius: 5px;
    width: 49%;
    opacity: 0.9
}
.calculator .btn.width{width: 24.1%; padding: 12px 0; background-color:#979797}



.calculator .btn:enabled:active, .calculator .btn.active {
    box-shadow: inset 0px 6px 6px rgb(0 0 0 / 20%);
    border: 1px  solid #777;
    opacity: 1
}
.calculator .btn img{display: none}
.calculator .btn.active img{display: inline}
.calculator .btn:disabled {
  opacity: 0.5;
}

.calculator .btn.hide{display: none}


.calculator input{
  border-radius: 5px;
  border: none;
 
  padding:15px 15px 15px 15px;
  font-size: 16px;
  line-height: 20px;
  color: #676767;
  box-shadow: inset 0px 4px 4px rgb(0 0 0 / 10%);
  background: #E9E8E8;
}

.calculator input.size{ width: 100%; display: block}
.calculator input.phone{ width: 100%; background-color: #fff;}
.calculator .btn.red{width: 100%; display: block; margin-top:30px }

.calculator .result{ font-size: 18px; font-weight: 300; margin: 15px 0 25px;}
#preloader,#preloader-quiz{display: none}
.calculator .oldprice{text-decoration: line-through; }
.calculator .realprice{font-size: 22px; font-weight: bold; color:#009B20}
.calculator #calc-error{color:#F13F3F; font-weight: 400}
.calculator input.errorphone {border: 1px solid #F13F3F;}
.error-msg{font-size: 12px; color:#F13F3F; }
.calculator .btn.recalc{height: 100%; padding: 12px 15px; line-height: 22px; background-color: #f48951}
.calculator .btn.recalc img{display: block; margin: 5px auto 0 auto; width:25px }

.calculator .col{
    flex-basis: 0;
    flex-grow: 1;
    min-width: 0;
    padding: 0px 2px;
}


.calculator .small{font-size: 14px; margin-top: 18px; line-height: 18px; color: #777 }


/*************** quiz *******************/
.quiz{background:#ebebeb; border-bottom: 3px solid #fff }

.quiz .sepa{ background-color: #a7917a; width: 150px; height: 3px; border-radius: 2px; margin: 0px auto 30px auto}
.quiz .subtitle{font-weight: 300; font-size: 22px; line-height: 28px; text-align: center; margin:15px auto 30px auto; width: 70%;}

.quiz #step-quiz{margin-top:25px; }
.quiz .step-app > .step-steps{margin:0;padding:0;display:flex;border-radius:3px 3px 0 0;overflow:hidden}
.quiz .step-app > .step-steps > li{list-style:none;flex:1}
.quiz .step-app > .step-steps > li:last-child a{border:none}
.quiz .step-app > .step-steps > li > a{display:block;padding:10px;color:#fff;background-color:#979797;text-decoration:none;border-right:2px solid #fff; border-radius: 5px 5px 0 0}
.quiz .step-app > .step-steps > li > a > .number{background:#fff;padding:0 8px;display:inline-block;text-align:center;margin-right:15px;border-radius:3px;color:#aaa}
.quiz .step-app > .step-steps > li > a:hover{background-color:#909090}
.quiz .step-app > .step-steps > li.active a{background-color:#f48951;color:#fff}
.quiz .step-app > .step-steps > li.error a{background-color:#F95D51;color:#fff}
.quiz .step-app > .step-steps > li.done a{background-color:#ffc180;color:#fff}
.quiz .step-app > .step-content{border:1px solid #e5e5e5;border-radius: 0 0 5px 5px;padding:30px 30px 0 ;background-color:#fff;-webkit-box-shadow: 2px 2px 10px 0px rgba(50, 50, 50, 0.75);
-moz-box-shadow:    2px 2px 10px 0px rgba(50, 50, 50, 0.75);
box-shadow:         2px 2px 10px 0px rgba(50, 50, 50, 0.75);}
.quiz .step-app > .step-content > .step-tab-panel{display:none}
.quiz .step-app > .step-content > .step-tab-panel.active{display:block}
.quiz .step-app > .step-footer{margin-top:15px;position:relative}
.quiz .step-app > .step-footer .text-error{top:0;left:50%;width:400px;margin-left:-200px;position:absolute}
.quiz .step-app > .step-footer > .step-btn{ border: none;width:120px;height:40px;display:inline-block;font-size:18px;color:#fff;line-height:35px;text-decoration:none;margin-top:15px;font-weight:500;-webkit-box-shadow: 2px 2px 5px 0px rgba(50, 50, 50, 0.75);
-moz-box-shadow:    2px 2px 5px 0px rgba(50, 50, 50, 0.75);
box-shadow:         2px 2px 5px 0px rgba(50, 50, 50, 0.75);border-radius:3px;}
.quiz .step-app > .step-footer > .step-btn.prev{ margin-right:23px;float:left;background:#fe9900;background:-moz-linear-gradient(top,#fe9900 0%,#ff8201 100%);background:-webkit-linear-gradient(top,#fe9900 0%,#ff8201 100%);background:linear-gradient(to bottom,#fe9900 0%,#ff8201 100%);}
.quiz .step-app > .step-footer > .step-btn.prev::hover{background:#ff8201;background:-moz-linear-gradient(top,#ff8201 0%,#fe9900 100%);background:-webkit-linear-gradient(top,#ff8201 0%,#fe9900 100%);background:linear-gradient(to bottom,#ff8201 0%,#fe9900 100%)}
.quiz .step-app > .step-footer > .step-btn.next{background:#6cc514;background:-moz-linear-gradient(top,#6cc514 0%,#56ae00 100%);background:-webkit-linear-gradient(top,#6cc514 0%,#56ae00 100%);background:linear-gradient(to bottom,#6cc514 0%,#56ae00 100%)}
.quiz .step-app > .step-footer > .step-btn.next:hover{background:#56ae00;background:-moz-linear-gradient(top,#56ae00 0%,#6cc514 100%);background:-webkit-linear-gradient(top,#56ae00 0%,#6cc514 100%);background:linear-gradient(to bottom,#56ae00 0%,#6cc514 100%)}
.quiz .step-app > .step-footer > .step-btn.finish{float:right;background:#ff4d4d;background:-moz-linear-gradient(top,#ff4d4d 0%,#ff1901 100%);background:-webkit-linear-gradient(top,#ff4d4d 0%,#ff1901 100%);background:linear-gradient(to bottom,#ff4d4d 0%,#ff1901 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff4d4d',endColorstr='#ff1901',GradientType=0);}
.quiz .step-app > .step-footer > .step-btn.finish:hover{background:#e00b0b}
.quiz .step-app > .step-content .answer p{margin-left:40px;font-size:16px}
.quiz .step-app > .step-content .question{font-size:22px;margin-bottom:20px;display:block}
.quiz .step-app > .step-content .description{font-size:16px;margin-top:20px;margin-bottom:6px}
.quiz .button-red{font-weight:700;width:300px;max-width:100%;display:block;margin:28px auto;padding:17px 0;font-size:18px}
.quiz .success-quiz{display:none;font-size:30px;color:#ff8201;padding:35px;text-align:center;margin-top:25px;border:2px solid #ff8201}
.quiz .button-block p{text-align:center;color:#999}
.quiz .checkmark{position:absolute;top:0;left:0;height:25px;width:25px;background-color:#eee}
.quiz .checkmark-container{display:block;position:relative;margin-bottom:12px;cursor:pointer;font-size:22px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.quiz .checkmark-container input{position:absolute;opacity:0;cursor:pointer;height:0;width:0}
.quiz .checkmark-container:hover input ~ .checkmark{background-color:#ccc}
.quiz .checkmark-container input:checked ~ .checkmark{background-color:#2196F3}
.quiz .checkmark:after{content:"";position:absolute;display:none}
.quiz .checkmark-container input:checked ~ .checkmark:after{display:block}
.quiz .checkmark-container .checkmark:after{left:9px;top:3px;width:7px;height:17px;border:solid #fff;border-width:0 2px 3px 0;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}
.quiz .checkmark-container .checkmark2{left:9px;top:3px;width:7px;height:17px;border:solid #2196F3;border-width:0 3px 3px 0;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}
.quiz .place-error{min-height: 36px; margin-top: 15px}
.quiz .text-error{text-align:center;font-size:16px;font-weight:300;background:#F95D51;color:#fff;display:none;padding:10px 15px;    margin: 0px -30px 0; border-radius: 0 0 5px 5px;}
input{
    border-radius: 5px;
    border: none;
    padding: 15px 15px 15px 50px;
    font-size: 16px;
    line-height: 20px;
    color: #676767;
    box-shadow: inset 0px 4px 4px rgb(0 0 0 / 10%);
    background: #E9E8E8;
    max-width: 100%;
    width: 390px;
    margin-bottom: 12px;
}
.lead label input.username {
    background: #E9E8E8 url(/assets/images/username.svg) no-repeat center left 18px;
    box-shadow: inset 0px 4px 4px rgb(0 0 0 / 10%);
}
.lead label input.userphone.errorphone {
    background: #E9E8E8 url(/assets/images/userphone-error.svg) no-repeat center left 18px;
    border: 1px solid #F13F3F;
}

.lead label input.userphone {
    background: #E9E8E8 url(/assets/images/userphone.svg) no-repeat center left 18px;
    box-shadow: inset 0px 4px 4px rgb(0 0 0 / 10%);
}


.quiz .finish {width: 390px; max-width: 100%}
.quiz input#quiz_size_x{background: #E9E8E8 url(/assets/images/ruler-2.png) no-repeat center left 18px;}
.quiz input#quiz_size_y{background: #E9E8E8 url(/assets/images/ruler-1.png) no-repeat center left 18px;}
.quiz .phone-info input{background: #E9E8E8 url(/assets/images/phone.png) no-repeat center left 18px;}
.quiz .phone-info{display: flex; align-items: baseline;} 
.quiz .phone-info .col{min-width: 30px}
.quiz .phone-info img {
    vertical-align: middle;
}
.quiz .result {
    margin-bottom: 30px;
    background-color: #ebebeb;
    padding: 15px;
    font-size: 15px;
    border-radius: 5px;
}
.quiz .result li {font-weight: 700; display: flex; flex-wrap: wrap;}

.quiz .result li:not(:last-of-type){margin-bottom: 8px;
    border-bottom: 1px solid #cdcdcd;
    padding-bottom: 8px}
.quiz .result strong{font-weight: 300; display: block;  flex-basis: 0;
    flex-grow: 1;
    min-width: 0;
    max-width: 50%;}
.quiz .result span{display: block;  flex-basis: 0;
    flex-grow: 1;
    min-width: 0;
    max-width: 50%;}
.quiz .result i{display: none}
.quiz .result i.visible{display:inline}

.quiz .oldprice {
    text-decoration: line-through; font-weight: 300;
}
.quiz .realprice {
    font-size: 18px;
    font-weight: bold;
    color: #009B20;
}
.clr {
    clear: both;
}
/*************** delivery *******************/
.delivery { background-color: #ebebeb}
.delivery .col{
    flex-basis: 0;
    flex-grow: 1;
    min-width: 0;
    max-width: 50%;
    
}
.delivery .row:not(:last-of-type){margin-bottom: 30px;}
.delivery .row .col:not(:last-of-type){
    margin-right: 15px;
}
.delivery .row .col:last-of-type{
    margin-left: 15px;
}
.delivery .num {
    font-size: 70px;
    color: #fff;
}
.delivery .sepa {
    background-color: #a7917a;
    width: 100px;
    height: 3px;
    border-radius: 2px;
    margin: 5px 0 15px;
}
.delivery .title {
    font-weight: 600;
    font-size: 18px;
    line-height: 22px;
    margin: 10px 0;
}
.delivery .desc {
    font-size: 16px;
    line-height: normal;    
}
.delivery a, .subtitle a{color: #f39105; text-decoration: underline}
.delivery a:hover, .subtitle a:hover{text-decoration: none}
/*************** faq *******************/
.faq .question{background-color: #ebebeb; margin-bottom: 3px; padding: 25px 30px 25px 30px; }
.faq .question .title{font-size: 16px; line-height: 20px; font-weight: 600; color: #000000; cursor: pointer;position: relative; padding-right: 35px }
.faq .question .answer{ max-height: 0; opacity: 0; font-size: 1px;}
.faq .question .answer ul{margin-left: 30px;list-style: inside;}
.faq .question .answer li{line-height: normal; margin-bottom: 12px}
.faq .question.opened .answer{margin-top: 30px; font-size: 16px; display: block; opacity: 1; max-height:none;-webkit-transition: max-height ease-in-out 0.5s,opacity ease-in-out 0.5s;
-o-transition: max-height ease-in-out 0.5s,opacity ease-in-out 0.5s;
transition: max-height ease-in-out 0.5s,opacity ease-in-out 0.5s}
.faq .question .icon {
  position: absolute;
  top: 0;
  right: 2px;
  width: 24px;
  height: 24px;
  display: inline-block;
  transition: all ease-in-out 0.3s;
}
.faq .question.opened .icon {
  z-index: 1;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  transition: all ease-in-out 0.3s;
}
/**********************comments***********************/
section.comments{border-bottom: 3px solid #ebebeb}
/**********************calatog***********************/
.catalog .row{
    align-items: baseline;
    justify-content: space-between;
    
}
.catalog .wrapper{ padding-bottom: 0}

.catalog .col.item{
    margin-bottom: 30px;
    font-size: 16px;
    padding: 30px;
    max-width: 350px;
    width: 22.6%;
    background: #F6F6F6;
    -webkit-box-shadow: 0 0 5px 0 rgb(50 50 50 / 50%);
    -moz-box-shadow: 0 0 5px 0 rgba(50,50,50,0.5);
    box-shadow: 0 0 5px 0 rgb(50 50 50 / 50%);
}
.catalog .col.item a{ color: #56391E}
.catalog .col.item:hover{-webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.3);
    box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.3);}
.catalog .item_name{font-size: 18px; font-weight: 600; margin: 15px 0; text-transform: uppercase}
.catalog .item_name span{ display: block; margin-top: 4px; text-transform: lowercase; font-size: 16px; font-weight: 300}
.catalog .img{position: relative}
.catalog .glass-thickness{position: absolute; top: 15px; right: 15px; background-color:#F13F3F; color: #fff; border: 2px solid #fff; width: 50px; height: 50px; font-size: 14px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 600; padding: 5px}
.catalog .glass-type{position: absolute; top: 15px; left: 15px; background-color: transparent; color: #F13F3F; border: 1px solid #F13F3F;  font-size: 14px; text-transform: uppercase;  display: flex; align-items: center; justify-content: center; font-weight: 500; padding: 5px 10px}
.catalog .product-stars {
    position: absolute;
    bottom: 15px;
    left: 15px;
    display: flex;
    flex-direction: row;
    align-items: center;
}
.catalog .product-stars__item svg {
    vertical-align: middle; 
}
.catalog .product-stars li {
    width: 17px;
    height: 17px;
}

.catalog select{
  border-radius: 5px;
  border: none;
  padding:10px 5px;
  font-size: 16px;
  line-height: 20px;
  color: #676767;
  box-shadow: inset 0px 4px 4px rgb(0 0 0 / 10%);
  background: #EBEBEB;
      width:100%;
}
.catalog .size{justify-content: space-between; align-items:center}
.catalog .size small{font-size: 14px}
.catalog .size div{ flex-basis:0; flex-grow:1;min-width: 0; max-width: 145px;}
.catalog .size div.x{max-width: 30px; text-align: center;}
.catalog .price{margin: 15px 0 0 0; align-items: flex-end;}
.catalog .price div{ display: inline-block}
.catalog .price .real{font-size: 20px;font-weight: 600; color: #7e993c;}
.catalog .price .real span{font-size: 16px}
.catalog .price .old{color:#797878; font-size: 18px; font-weight: bold; text-decoration:line-through; margin-left: 15px}
.catalog .price .real span{font-size: 16px}


.catalog .addtocart div{width: 130px;}
.catalog .addtocart .btn{width: 100%; padding: 8px 5px; font-size: 16px}
.catalog .addtocart .btn.add{ background-color: #009B20}
.catalog .addtocart .btn.detail{ background-color: #f48951}
.catalog .addtocart div:first-of-type{padding-right: 15px}
.catalog .addtocart div:last-of-type{padding-left: 15px}


.front-text{background:url(/assets/images/bcg-call.jpg) no-repeat; height:150px;position: relative;
    z-index: 2;
    margin-top: 38px;background-position: right;}

.front-text .wrapper{padding:0}
.front-text p{color:#fff; line-height: 1.6em; margin-bottom: 0; padding:50px}
.front-text.pages button { margin: 0 auto}

.front-service{display:flex}
.front-service p{line-height:24px; margin-bottom:24px}
.front-service h2{padding: 0px 0px  15px;  margin: 30px 0 30px; text-align: left; position: relative}
.front-service h2:after {background: #7e993c; content: "";position: absolute;top: 100%;left: 0px;width: 150px;height: 3px;}
.front-service .woocommerce-loop-product_title{position: absolute;bottom: 0px; left:0px; width:100%;background: #7e993c;color: #fff;padding: 10px;font-weight: 500;}
.front-service .text{flex-basis: 35%;}
.front-service .woocommerce {flex-basis: 65%; padding-left:30px; margin-top: 30px}
.front-service ul {display: flex;  justify-content: space-between;
  flex-wrap: wrap;}
.front-service ul li{flex-basis: 50%; padding-bottom: 30px;}
.front-service ul li img{ width: 100%}
.front-service ul li a{position: relative; display: block}
.front-service ul li:nth-child(odd) { padding-right: 15px;}
.front-service ul li:nth-child(even) { padding-left: 15px;}



.row-work-steps{background:#f4f3f3;}
.row-work-steps h2{padding: 0px 0px  15px;  margin: 30px 0 30px; text-align: center; position: relative}

.row-work-steps .work-steps-inner{position:relative;padding:0 30px}
.row-work-steps .cont-steps-tabs{margin-left:auto;margin-right:auto;padding-bottom:3rem}
.row-work-steps .cont-switches{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center}
.row-work-steps .tab-switch{margin-left:20px;margin-right:20px; cursor: pointer}
.row-work-steps .tab-switch:after{content:"";display:block;margin-left:auto;margin-right:auto;margin-top:.5em;text-align:center ; border: solid black;  border-width: 0 3px 3px 0;  padding: 3px;   transform: rotate(-135deg); width: 5px; opacity: 0;  -webkit-transform: rotate(-135deg);}
.row-work-steps .tab-switch.active:after{opacity:1}
.row-work-steps .tab-content{display:none}
.row-work-steps .tab-content.active{display:block}
.row-work-steps .tab-switch.active .switch-ico{border-color:#56391E;background-color:#56391E}
.row-work-steps .tab-switch.active .switch-ico svg path{fill:#fff}
.row-work-steps .switch-ico{display:block;width:104px;height:104px;padding:22px;border-radius:50%;background-color:#fff;border:1px solid #ddd;-webkit-transition:all .3s;transition:all .3s}
.row-work-steps .switch-ico svg{max-width:100%;height:auto}
.row-work-steps .switch-ico svg path{-webkit-transition:all .3s;transition:all .3s}
@media screen and (min-width:768px) {
.row-work-steps .switch-ico.switch-smaller{padding:28px}
.row-work-steps .switch-ico.switch-project{padding-left:26px;padding-right:18px}
}
.row-work-steps .tab-content{padding:22px 2.9% 1.5rem;border-bottom:2px solid #56391E;position:relative}
.row-work-steps .tab-content:after,.row-work-steps .tab-content:before{content:"";position:absolute;bottom:0;width:2px;height:30px;background-color:#56391E}
.row-work-steps .tab-content:before{left:0}
.row-work-steps .tab-content:after{right:0}
.row-work-steps .tab-descr-title{margin-bottom:1em;font-size:16px;font-weight:600;text-transform:uppercase}
.row-work-steps .tab-descr-text{font-size:16px;line-height:1.5;font-weight:300}


.about-me p:first-of-type {
    
    padding: 30px;
    background-color: rgba(126, 153, 60, 0.2);
    
    margin-bottom: 30px;
}

/********************footer*****************************/
footer{background: #333;color: #fff;}
footer .wrapper{padding-top: 30px; padding-bottom: 30px;}

footer .row {align-items: flex-start;   }
footer .logo img{vertical-align: middle;}
footer .row .col{
 /* flex-basis: 0;*/
  flex-grow: 1;
}
footer .row .col.right{

  text-align: right;
}

footer .small span {display: block; margin-bottom: 8px}
footer .small{font-size: 14px;  color: #ebebeb; margin-top: 15px}
footer .small a{ color: #cdcdcd; text-decoration: underline;}
footer .small a:hover{text-decoration: none;}
footer .phone{font-size: 24px; font-weight: 600; margin-bottom: 15px}
footer .phone a{color: #ebebeb}
footer .messengers a {margin-right: 15px;}
footer .address{font-size: 14px;  color: #ebebeb; margin-top: 20px}

footer .btn{padding: 10px 15px; margin-bottom: 30px }
footer nav a{color: rgba(126, 153, 60,1); display: block; margin-bottom: 7px }


/****** done ********/
.done-page {

  background: url(/assets/images/done-bg.webp) no-repeat center #000;
  background-size: cover;
  position: relative;
  text-align: center;
  min-height: calc(100vh);
  color: #dfdfdf;

}
.done-page .bg {
  
  width: 100%;
  background-color: #000;
 
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.done-page h1{
  font-weight: bold;
  font-size: 40px;
  line-height: 54px;
  text-transform: uppercase;
  margin-top: 30px;
  margin-bottom: 30px;
}
.done-page .subtitle{
  font-size: 26px;
  line-height: 35px;
  text-align: center;
 
  margin: 30px auto;
}
.done-page .normal{
  font-size: 16px;
  line-height: 22px;
  text-align: center;
  letter-spacing: 0.02em;

  
}
.done-page .red-btn{display: inline-block; margin: 40px 0;}
.done-page .phones{
  justify-content: center;
  margin-top: 20px;
}
.done-page .phones a{
    display: block;
    font-weight: 600;
    font-size: 22px;
    line-height: 24px;
    text-align: right;
    color: #dfdfdf;
}
.done-page .phones .ico {

  width: 24px;
  margin-right: 10px;
}
.done-page .btn{display:block;margin:40px auto; width: 200px}

/*****modal*******/
.modal-window{display:none; position: relative; z-index: 20; }
.popup-window{max-height:100vh;padding:25px;position:fixed;z-index:13;top:0;left:0;right:0;bottom:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;overflow:auto;-webkit-box-sizing:border-box;box-sizing:border-box}
.popup-background{position:absolute;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.5)}
.popup-back{cursor:pointer;font-size:14px}
.popup-close{transition:box-shadow .2s ease;position:absolute;top:0px;right:0px;width:37px;height:37px;background:#fff;display:block;cursor:pointer;z-index:11;border:none;padding:0;min-width:0;min-height:0}
.popup-close:after,.popup-close:before{transition:transform .3s ease;content:'';display:block;position:absolute;top:15px;right:15px;bottom:0;width:calc(37px / 2);height:4px;background:#7a7a7a;transform-origin:center;transform:rotate(45deg);margin:auto}
.popup-close:before{transform:rotate(-45deg)}
.popup-header{position:relative;background:#fff;align-items:baseline; height: 30px;}
.popup-holder{max-width:450px;height:auto;margin:0 auto;background: #fff;overflow-y:auto;-webkit-box-shadow:0 8px 40px rgba(0,0,0,.32);box-shadow:0 8px 40px rgba(0,0,0,.32);position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;width:100%; border-radius: 10px;}
.popup-content{height:100%;padding-left:30px;padding-right:30px;padding-bottom:30px; padding-top: 15px; -webkit-box-sizing:border-box;box-sizing:border-box;overflow-y:auto;background:#fff;}
.popup-holder .btn{max-width: 100%; width: 390px }
/*.popup-content label { display: block; margin-top: 28px;}
.popup-content label:last-of-type{margin-top:60px}
.popup-content .input-text input { width:100%; box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none;}
.popup-content button{width:100%; bottom:50px}
*/

.popup-content h3{
  font-weight: bold;
  font-size: 22px;
  line-height: 32px;
  text-transform: uppercase;
    text-align: center
}
.popup-content p{
  font-size: 16px;
  line-height: 22px;
  color: #2B2A2A;
  margin: 15px 0 20px;
    text-align: center;
}
.popup-content label,.popup-content button{
  width: 320px;
}
.popup-content .col{
  min-width: 0;
  max-width: 50%;
  text-align: start;
}


.popup-content .result {
    margin-bottom: 15px;
     border:2px solid #ebebeb;
    padding: 15px;
    font-size: 15px;
    border-radius: 5px;
}
.popup-content .result li {font-weight: 700; display: flex; flex-wrap: wrap; text-align: left}

.popup-content .result li:not(:last-of-type){margin-bottom: 8px;
    border-bottom: 1px solid #cdcdcd;
    padding-bottom: 8px}
.popup-content .result strong{font-weight: 300; display: block;  flex-basis: 0;
    flex-grow: 1;
    min-width: 0;
    max-width: 50%;}
.popup-content .result span{display: block;  flex-basis: 0;
    flex-grow: 1;
    min-width: 0;
    max-width: 50%;}

.popup-content .result i.visible{display:inline}
.popup-content .result .realprice {
    font-size: 18px;
    font-weight: bold;
    color: #009B20;
}
.popup-content .result .oldprice {
    text-decoration: line-through;
    font-weight: 300;
}
.popup-content .row{justify-content: flex-start; margin: 15px 0; align-items: center; border:2px solid #ebebeb}

.popup-content .row .image{text-align: left; width: 130px; max-width: 40%; border-radius: 5px; padding: 15px}
.popup-content .row .image img{ border: 2px solid #ebebeb; }
.popup-content .row .name{ font-weight: 700; font-size: 18px; min-width: 0; max-width: 80%; flex-grow: 1; flex-basis: 0; text-align: left; padding-right: 15px}
    

#error-popup{min-height: 30px; text-align:center;font-size:16px;font-weight:300;background:#F95D51;color:#fff;display:none;padding:10px 15px;    margin: 5px 0px; border-radius: 0 0 5px 5px;}

/******************/
#preloader2{display:none;position:fixed;left:0;top:0;width:100%;height:100%;z-index:21}
#preloader2 p{position:absolute;width:100%;line-height:100px;font-size:20px;text-align:center;top:50%;margin-top:-50px;z-index:12;color:#fff;font-weight:500}
#preloader2-background{position:absolute;left:0;top:0;width:100%;height:100%;background:#000;z-index:12;opacity:.7}

.callback-bt{background:rgba(243,145,5,1);border:2px solid rgba(243,145,5, 0.4);border-radius:50%;box-shadow:0 8px 10px rgba(243,145,5,0.3);cursor:pointer;height:80px;text-align:center;width:80px;position:fixed;bottom:75px;right:75px;z-index:9;transition:.3s;-webkit-animation:hoverWave linear 1s infinite;animation:hoverWave linear 1s infinite}
.callback-bt .text-call{height:80px;width:80px;border-radius:50%;position:relative;overflow:hidden}
.callback-bt .text-call span{ display:block; width:80px; text-align:center;color:rgba(243,145,5,1);opacity:0;position:absolute;top:24px;line-height:16px; font-size:13px;text-transform:normal;transition:opacity .3s linear}
.callback-bt .text-call:hover span{opacity:1;}
.callback-bt:hover svg{display:none;transition:.3s}
.callback-bt:hover{z-index:9;background:#fff;color:transparent;transition:.3s}
.callback-bt svg{transition:.5s ease-in-out;margin:20px auto}
.callback-bt i{animation:1200ms ease 0 normal none 1 running shake;animation-iteration-count:infinite;-webkit-animation:1200ms ease 0 normal none 1 running shake;-webkit-animation-iteration-count:infinite}
@-webkit-keyframes hoverWave {
0%{box-shadow:0 8px 10px rgba(243,145,5,0.3),0 0 0 0 rgba(243,145,5,0.2),0 0 0 0 rgba(243,145,5,0.2)}
40%{box-shadow:0 8px 10px rgba(243,145,5,0.3),0 0 0 15px rgba(243,145,5,0.2),0 0 0 0 rgba(243,145,5,0.2)}
80%{box-shadow:0 8px 10px rgba(243,145,5,0.3),0 0 0 30px rgba(243,145,5,0),0 0 0 26.7px rgba(243,145,5,0.067)}
100%{box-shadow:0 8px 10px rgba(243,145,5,0.3),0 0 0 30px rgba(243,145,5,0),0 0 0 40px rgba(243,145,5,0.0)}
}
@keyframes hoverWave {
0%{box-shadow:0 8px 10px rgba(243,145,5,0.3),0 0 0 0 rgba(243,145,5,0.2),0 0 0 0 rgba(243,145,5,0.2)}
40%{box-shadow:0 8px 10px rgba(243,145,5,0.3),0 0 0 15px rgba(243,145,5,0.2),0 0 0 0 rgba(243,145,5,0.2)}
80%{box-shadow:0 8px 10px rgba(243,145,5,0.3),0 0 0 30px rgba(243,145,5,0),0 0 0 26.7px rgba(243,145,5,0.067)}
100%{box-shadow:0 8px 10px rgba(243,145,5,0.3),0 0 0 30px rgba(243,145,5,0),0 0 0 40px rgba(243,145,5,0.0)}
}
@keyframes shake {
0%{-ms-transform:rotateZ(0deg);-webkit-transform:rotateZ(0deg);transform:rotateZ(0deg);}
10%{-ms-transform:rotateZ(-30deg);-webkit-transform:rotateZ(-30deg);transform:rotateZ(-30deg)}
20%{-ms-transform:rotateZ(15deg);-webkit-transform:rotateZ(15deg);transform:rotateZ(15deg);}
30%{-ms-transform:rotateZ(-10deg);-webkit-transform:rotateZ(-10deg);transform:rotateZ(-10deg);}
40%{-ms-transform:rotateZ(7.5deg);-webkit-transform:rotateZ(7.5deg);transform:rotateZ(7.5deg);}
50%{-ms-transform:rotateZ(-6deg);-webkit-transform:rotateZ(-6deg);transform:rotateZ(-6deg);}
60%{-ms-transform:rotateZ(5deg);-webkit-transform:rotateZ(5deg);transform:rotateZ(5deg);}
70%{-ms-transform:rotateZ(-4.28571deg);-webkit-transform:rotateZ(-4.28571deg);transform:rotateZ(-4.28571deg);}
80%{-ms-transform:rotateZ(3.75deg);-webkit-transform:rotateZ(3.75deg);transform:rotateZ(3.75deg);}
90%{-ms-transform:rotateZ(-3.33333deg);-webkit-transform:rotateZ(-3.33333deg);transform:rotateZ(-3.33333deg);}
100%{-ms-transform:rotateZ(0deg);-webkit-transform:rotateZ(0deg);transform:rotateZ(0deg);}
}
@-webkit-keyframes shake {
0%{-ms-transform:rotateZ(0deg);-webkit-transform:rotateZ(0deg);transform:rotateZ(0deg);}
10%{-ms-transform:rotateZ(-30deg);-webkit-transform:rotateZ(-30deg);transform:rotateZ(-30deg);}
20%{-ms-transform:rotateZ(15deg);-webkit-transform:rotateZ(15deg);transform:rotateZ(15deg);}
30%{-ms-transform:rotateZ(-10deg);-webkit-transform:rotateZ(-10deg);transform:rotateZ(-10deg);}
40%{-ms-transform:rotateZ(7.5deg);-webkit-transform:rotateZ(7.5deg);transform:rotateZ(7.5deg);}
50%{-ms-transform:rotateZ(-6deg);-webkit-transform:rotateZ(-6deg);transform:rotateZ(-6deg);}
60%{-ms-transform:rotateZ(5deg);-webkit-transform:rotateZ(5deg);transform:rotateZ(5deg);}
70%{-ms-transform:rotateZ(-4.28571deg);-webkit-transform:rotateZ(-4.28571deg);transform:rotateZ(-4.28571deg);}
80%{-ms-transform:rotateZ(3.75deg);-webkit-transform:rotateZ(3.75deg);transform:rotateZ(3.75deg);}
90%{-ms-transform:rotateZ(-3.33333deg);-webkit-transform:rotateZ(-3.33333deg);transform:rotateZ(-3.33333deg);}
100%{-ms-transform:rotateZ(0deg);-webkit-transform:rotateZ(0deg);transform:rotateZ(0deg);}
}