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

    .t228__burger { 

        z-index: 99999;

    }



}



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

#promo .block { 
    margin: 50px auto 20px;}

.certificates .certificates__wrapper { 

    height: auto; 

}



.fon-house__wrapper {  

    -webkit-clip-path: none;

    clip-path: none;  

    padding: 40px 50px 40px 50px;

    text-align: center;

}



.fon-house h1 span { 

    margin: 50px auto;

}

#home .t309__descr { 

    font-size: 20px;

}

#how .row2 {

    margin: 0px auto 0;

}



.fon-house__buttons { 

        margin-top: 50px;

    justify-content: center;

}



.fon-house__buttons .fon-house_button {

    font-size: 20px; 

}



.fon-house__buttons .button-more { 

    padding-right: 45px;

    z-index: 2;

}



.fon-house__buttons .button-price { 

    left: -25px;

    padding-left: 35px;

}



.about .about__text {

    -webkit-box-flex: 0;

    -ms-flex: 0 0 100%;

    flex: 0 0 100%;

    width: 575px;

    padding: 40px 59px 130px 59px; 

    background-image: url(../img/border1.svg);

    background-size: cover;

    background-repeat: no-repeat;

    margin: 0 auto;

    order: 2

}



.about .about__video .about__video_wrapper {

    margin-left: 0;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-orient: vertical;

    -webkit-box-direction: normal;

    -ms-flex-direction: column;

    flex-direction: column;

    margin-top: 0;

    padding: 50px;

}



.about .about__title {

    text-align: center;

    margin: 0 auto 25px;

}



.about .about__video .about__video_container img {

    height: 40%;

    width: 100%;

    cursor: pointer;

}

.about .about__container { 

    flex-direction: column;

}



#how .row11 .col-sm-4:nth-child(1) .wrap::after,

#how .row11 .col-sm-4:nth-child(2) .wrap::after,

#how .row11 .col-sm-4:nth-child(3) .wrap::after,

#how .row11 .col-sm-4:nth-child(4) .wrap::after,

#how .row2 .col-sm-4:nth-child(1) .wrap::after

 {

    content: '';

    background: none; 

}



#how .row11 .col-sm-4:nth-child(2) {

    position: static;  

}



.video .wrap .t1 {

    font-size: 18px; 

    margin: 15px auto 35px;

}

.video .wrap p {

    font-size: 18px;

     margin: 15px auto 35px;

}



svg#play {

    width: 50px;

}



.playbtn {

    top: calc(50% - 225px);

    left: calc(50% - 25px);

    cursor: pointer;

    position: absolute;

}



#allrecords .ytwrap { 

    max-width: 30%;

}



#allrecords .instrwrap { 

    max-width: 30%;

    margin: 25px auto 0;

}

    .block_types div img {

        cursor: pointer;

        max-width: 140px;

        display: block;

        margin: 0 auto;

    }

.block_types div img {

    cursor: pointer;

    max-width: 140px;

    display: block;

    margin: 0 auto;

}

.constructor {

    width: 100%;

    height: 480px;

}



.constructor .bottom_block { }

.constructor .block_wrap {

    max-width: 270px;

        width: 89%;

}

.constructor .klinker_wrap, .constructor .brick_wrap, .constructor .tychok_wrap {

    max-width: 320px;

        width: 89%;

}



#constr1, #constr2 {

    display: block;

    margin: 0px auto 0;

    max-width: 400px;

    position: relative;

    top: -45px;

}



.constructor .block_wrap, .constructor .klinker_wrap, .constructor .brick_wrap {

   z-index: 2;

    position: relative; 

    padding: 5px 10px;

    background-repeat: repeat;

    height: auto;

    margin: 0 8px 190px 3%;

}



    #rec14111424 .col-sm-6 { 

        width: 100%;

    }



    #home h1 { 

            max-width: 100%;

    display: flex;

    flex-direction: column;

    }

    #home .action{    max-width: 110px;

    position: relative;

    top: -11px;

    z-index: 999;

    left: auto;}

    #reason .col-md-4 {

    width: 40%;

    float: left;

 }

    #reason .col-md-6 {

    width: 60%;

    float: left;

 }



 #reason .block {

    padding: 25px 25px 8px;

    max-width: 60%;

    margin: 0 0 25px;

    position: relative;

    outline-offset: -8px;

    left: -35px;

    top: -20px;

    background: url(../img/talk2.png);

    background-repeat: no-repeat;

    background-size: 100% 100%;

}

.grey_after::after { 

    bottom: -9px;}

.grey_after::before { 

    bottom: -9px;}

#rec14960827 .col-sm-4  {width: 50%}

#rec14960827 ._ytwrap .col-sm-4 {width: 33%}

#rec14960827 ._ytwrap .col-sm-4 {width: 33%}

#rec14960827 .instrwrap  .col-sm-4 {width: 33%}

 





footer .soc {

    position: relative;

    left: auto;

}





footer .col-md-2 {text-align: center;}

footer .container p {text-align: center;}

footer .col-md-2 img {    max-width: 200px;

    margin: 0 auto;}

footer .col-md-2 div {text-align: center; margin: 0 auto 50px}

.white_after::after { 

    bottom: -6px; 

}.white_after::before { 

    bottom: -6px; 

}



footer .tar {text-align: center !important} ;

footer .soc {

    position: relative;

    left: auto;

}



footer .t228__list  {max-width: 30%;

    margin: 0 auto 50px;}

.block_gallery img { 

    margin: 25px auto 70px;

}

footer .address {

    text-align: center;

}



}



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



 

.about .about__text { 

    padding: 40px 10px 30px 10px;

    background-image: none;

    background-size: cover;

    background-repeat: no-repeat;

    margin: 0 auto;

    order: 2;

    width: auto;

}



.about .about__text .about__text_wrapper {

    border: 15px solid #fdc500;

    padding: 25px;

}



.fon-house__buttons .fon-house_button {

    font-size: 16px;

}



.constructor .elements {

    width: 50%;

}



.constructor .layouts, .constructor .colors {

    width: 50%;

    margin: 0px auto 150px;

}

 

.constructor .block_wrap {

    max-width: 89%;

        width: 89%;

}



.layouts div { 

    display: block; 

}

    h1 {

        font-size: 24px !important;

    }



#home h1 .action { 

    right: -120px;  

}



.grey_after::after { 

    bottom: -9px;}

.grey_after::before { 

    bottom: -9px;}



#reason .header .text {

    text-align: left;

    font-weight: 500;

    display: inline-block;

}



#reason .block p { 

    font-size: 18px; 

}



svg#play {

    width: 50px;

}

.videowrap .playbtn {

    top: calc(50% - 165px);

    left: calc(50% - 8px);

    cursor: pointer;

    position: absolute;

}

.video .wrap p {

    font-size: 16px; 

    margin: 10px auto 40px;

}



#allrecords .ytwrap { 

    max-width: 50%;

}



#allrecords .instrwrap img {

    max-width: 40px;

}



#allrecords .instrwrap span {

    display: block;

    font-size: 15px;

    font-weight: 300;

}

#allrecords .instrwrap p {

    font-size: 16px;

    font-weight: 500;

    color: #000;

    margin: 0 auto;

    padding: 8px 0;

    line-height: 1.5;

}



#allrecords .instrwrap { 

    max-width: 50%;

    margin: 25px auto 80px;

}

#allrecords .ytwrap span {

    display: block;

    font-size: 15px;

    font-weight: 300;

}



#allrecords .ytwrap p {

    font-size: 16px;

    font-weight: 500;

    color: #000;

    margin: 0 auto;

    padding: 8px 0;

    line-height: 1.3;

}



.white_after::before { 

    bottom: -6px; 

}



.reviews .review img { 

    margin: 0 auto 25px;  

}



footer .col-md-2 {text-align: center;}

footer .container p {text-align: center;}

footer .col-md-2 img {    max-width: 200px;

    margin: 0 auto;}

footer .col-md-2 div {text-align: center; margin: 0 auto 50px}

.white_after::after { 

    bottom: -6px; 

}



footer .tar {text-align: center !important} ;

footer .soc {

    position: relative;

    left: auto;

}



footer .t228__list  {max-width: 30%;

    margin: 0 auto 50px;}

.block_gallery img { 

    margin: 25px auto 70px;

}

footer .address {

    text-align: center;

}



.grey2_after::before { 

    bottom: -8px;

}

.grey2_after::after { 

    bottom: -8px;

}



#reason .block {

    padding: 25px 35px 18px;

    border-radius: 5px;

    max-width: 70%;

    margin: 0 auto;

    position: relative;

    outline-offset: -8px;

    left: auto;

    top: -20px;

    background: url(../img/talk2.png);

    background-repeat: no-repeat;

    background-size: 100% 100%;

}



#reason ul li img {

    max-width: 65px; 

}

#reason .alik { 

    display: none;}



#reason .header .ten {

    font-size: 80px;

    float: none;

    width: auto;

    text-align: left;

    line-height: 1;

    text-shadow: 1px 1px 1px #bbb5b5;

    margin: 0 auto;

    display: inline-block;

}

  .how2 .wrap:after {

    content: "";

    background: none 

    }



    .how1 .wrap:after {

    content: "";

    background: none 

    }



.how1 .wrap { 

    margin: 0 auto 20px;

}

.how2 .wrap { 

    margin: 0 auto 20px;

}



.how1 h2 { 

        padding: 0 25px;

    margin: 45px auto 0;

}

.how2 h2 { 

       padding: 0 25px;

    margin: 45px auto 0;

}







.container h2 {

    font-size: 32px;

}



.how h2 { 

    padding: 0 15px;

}



.container h3 {

    margin-top: 15px!important;

    margin-bottom: 15px!important;

}



.new:before {

    content: '';

    position: absolute;

    top: -11px;

    right: 23px;

    z-index: -9;

    background: url(../img/new.png);

    width: 66px;

    height: 60px;

    background-size: 100%;

    background-repeat: no-repeat;

}





.t-name_sm {

    font-size: 18px;

}





.t-descr_sm {

    font-size: 18px;

    line-height: 1.45;

}

.t-title_md {

    line-height: 1.23;

    font-size: 26px!important;

}





.instr a {

    font-size: 18px; 

}



.vapour { 

    height: 1100px!important; 

    background-size: cover!important;

}





.t-text_sm {

    font-size: 18px;

    line-height: 1.45;

}



.t-descr_xxxl {

    font-size: 32px;  

}



.mainform {

    font-size: 26px!important; 

}



.partners_list .cityName {

    font-size: 18px;

} 



.t-descr_xxl {

    font-size: 18px;

}



.wrap {

    min-height: 165px;

}



footer .soc {

    position: relative;

    left: auto;

}

 

}

  



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

 

 .constructor .price_wrap { 

    font-size: 26px;

    margin: 5px auto 50px;

    z-index: 2;

    position: relative;

}



.fon-house__buttons .fon-house_button {

    font-size: 18px;

    width: 80%;

    margin: 5px auto 5px;

    -webkit-clip-path: none;

    padding: 10px;

    clip-path: none;

        left: auto;

}



.fon-house__buttons { 

    flex-direction: column;

}

    .fon-house__wrapper { 

    padding: 10px; 

    margin: 15px auto;

        padding-bottom: 25px;

}



#constructor #pr, .partners .showlist {

    padding-right: 45px;

    left: auto;

}



.constructor .elements { 

    margin-bottom: 20px;

}



}

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



.constructor .klinker_wrap, .constructor .brick_wrap, .constructor .tychok_wrap {

 

    height: 450px;

}



    .tychok_wrap .block_row:nth-child(2n-1) .block:nth-child(2n) {

 

}

.tychok_wrap .block_row:nth-child(2n) .block:nth-child(2n) {

    width: 42px;

}

.tychok_wrap .block_row:nth-child(2n) .block:nth-child(2n-1) {

   

}





.constructor .type4 {

    width: 85px;

    height: 25px;

}



#how .wrap { 

    margin: 0px auto 15px; 

}



 .constructor .block_wrap, .constructor .klinker_wrap, .constructor .brick_wrap { 

    margin: 0 -2px 190px 0%;

}



#allrecords .ytwrap {

    max-width: 70%;

}

#allrecords .instrwrap {

    max-width: 70%; 

}

.constructor .elements {

    width: 50%;

}



.colors div, .layouts div {

    max-width: 90%;

    margin: 15px auto 15px;

}



.colors p, .elements p { 

    font-size: 15px;

}



.layouts p { 

    font-size: 14px; 

}



.constructor .layouts, .constructor .colors  { 

     width: 50%;

    margin: 0px auto 150px;

}



.constructor .block_wrap { 

    height: 420px;

    margin: -1;

    width: 100%;

    margin-bottom: 80px;

}



.constructor .klinker_wrap, .constructor .brick_wrap {

    height: 480px;

    margin: -1;

    width: 100%;

    margin-bottom: 80px;

}



.constructor .type3 {

    width: 95px;

    height: 26px;

    margin: 1.6px;

}



#reason .block {     max-width: 100%;     margin-bottom: 50px;

}



.constructor .type1 {

    width: 138px;

    height: 66px;

}



.constructor .block_wrap {

    /*max-width: 100%;*/

        max-width: 360px;

    position: relative;

    left: 5px;

        overflow: hidden;

}



.constructor .klinker_wrap, .constructor .brick_wrap {

    /*max-width: 100%;*/

    max-width: 355px;

    position: relative;

    left: 20px;

}



.constructor .type2 {

    width: 97px;

    height: 27px;

}



#reason .header { 

    margin: 0 auto 110px; 

}



#rec14960827 .col-sm-4 {

    width: 100%;

}



#reason {

    margin: 0 auto;

    padding: 140px 0 20px;

}



#allrecords .instrwrap {

    max-width: 60%;

    margin: 25px auto 80px;

}

.videowrap .playbtn {

    top: calc(50% - 130px); 

}



#allrecords .ytwrap {

    max-width: 60%;

        margin: 0 auto;

}

.wrap {

    min-height: 165px;

    margin: 0 auto 50px;

}

.playbtn {

    top: calc(50% - 125px);

    left: calc(50% - 28px);

    cursor: pointer;

    position: absolute;

}



    #reason .col-md-6 {

        width: 100%;

        float: left;

    }



    #reason .header .text { 

    display: inline;

}



#reason .header .ten { 

    display: inline;

}



    #home h1 .action {

        right: 30%;

        top: 290px;

    }

    #constructor #pr, .partners .showlist { 

    left: auto;

    margin: 15px auto;

}



footer .t228__list {

    max-width: 45%;

    margin: 0 auto 50px;

}



}



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



.constructor .tychok_wrap, .constructor .block_wrap, .constructor .klinker_wrap, .constructor .brick_wrap {

    margin: 0 0px 90px;

}



.constructor .type4 {

    width: 80px;

    height: 20px;

}



.constructor .tychok_wrap .grid { 

    height: 79%;}



.tychok_wrap .block_row:nth-child(2n) .block:nth-child(2n) {

    width: 40px;

}



.constructor .type3 {

    width: 84px;

    height: 23px;

}

    .yellowbutton {

    bottom: 0;

}

.constructor .type1 {

    width: 120px;

    height: 66px;

}



.constructor .type2 {

    width: 82px;

    height: 23px;

}





.constructor .klinker_wrap, .constructor .brick_wrap {

    height: 440px; 

        max-width: 320px;

    position: relative; 

}

 

}







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



.tychok_wrap .block_row:nth-child(2n-1) {

    position: relative;

    left: 0px;

}



.tychok_wrap .block_row:nth-child(2n) {

    position: relative;

    left: 20px;

}



 .constructor .tychok_wrap { 

    width: 95%;

}





.constructor .type4 {

    width: 65px;

    height: 23px;

}



 .constructor .tychok_wrap {

    height: 420px;

    margin-bottom: 25px;

}

.tychok_wrap .block_row:nth-child(2n-1) .block:nth-child(2n) {

    width: 30px;

}

.tychok_wrap .block_row:nth-child(2n) .block:nth-child(2n-1) {

    width: 30px;

}



  #reason .header .text p { 

    font-size: 26px;

}  

#reason .block p {

    font-size: 15px;

}



#reason .block { 

    margin: 0 auto 50px; 

}



footer .t228__list {

    max-width: 65%; 

}



.constructor .type1 {

    width: 100px;

    height: 55px;

}



.constructor .block_wrap {

    height: 355px; 

}

.constructor .block_wrap {

    max-width: 93%;

}



.constructor .type2 {

    width: 69px;

    height: 19px;

}

.constructor .klinker_wrap, .constructor .brick_wrap {

    height: 360px;

}

.constructor .type3 {

    width: 64px;

    height: 16px;

    margin: 1.6px;

}



.constructor .klinker_wrap, .constructor .brick_wrap {

    height: 320px;

}



#allrecords .ytwrap {

    max-width: 90%;

}



#allrecords .instrwrap {

    max-width: 90%;

    margin: 25px auto 80px;

}



.colors div, .layouts div { 

    margin: 5px auto 5px;

}



svg#play {

    width: 40px;

}

.playbtn {

    top: calc(50% - 95px); 

}

.videowrap svg#play {

    width: 40px; 

}



.videowrap .playbtn {

    top: calc(50% - 102px);

    left: calc(50% - 22px);

}





}



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

    h1 {

        font-size: 20px !important;

    }



    #home h1 span {

        display: block;

        font-size: 14px;

    }



    #home h1 span span { 

        margin: 0 5px;

        font-size: 30px; 

    }



    

    .yellowbutton a { 

        min-width: 90%;

    }



    .grey_after::before {

        bottom: 0;

    }

    

    .grey_after::after {

        bottom: 0;

    }



    .constructor .type1 {

        width: 67px;

        height: 45px;

    }



    .constructor .block_wrap {

    height: 305px;

}

.constructor .type2 {

    width: 45px;

    height: 16px;

}

.constructor .type3 {

    width: 44px;

    height: 14px;

    margin: 1.6px;

}



.constructor .klinker_wrap, .constructor .brick_wrap {

    height: 288px;

}



#characteristic div { 

    font-size: 9px;

}



.constructor_container .orderbutton { 

    min-width: 90%; 

}



#reason .header .text span { 

    line-height: 1.6;

    text-align: right;

}



#reason .header .text p {

    font-size: 26px; 

    line-height: 1.6;

}



.playbtn {

    top: calc(50% - 65px);

    left: calc(50% - 22px); 

}



.videowrap .playbtn {

    top: calc(50% - 82px);

    left: calc(50% - 14px);

}



.grey2_after::after {

    bottom: 0;

}

.grey2_after::before {

    bottom: 0;

}



.block_gallery {

    margin: 0px auto;

}



#how .wrap { 

    font-size: 14px;

}



.orderbutton { 

    min-width: 90%; 

}

.container h2 {

    font-size: 22px;

}

.t228__list_item a {

    display: inline-block;

    font-size: 10px!important;

}

footer .t228__list_item {

    padding-right: 5px;

    padding-left: 0;

}



.reviews { 

    padding: 70px 0 5px;

}



.constructor .type4 {

    width: 55px;

    height: 22px;

}



.tychok_wrap .block_row:nth-child(2n-1) .block:nth-child(2n) {

    width: 27px;

}



.tychok_wrap .block_row:nth-child(2n) .block:nth-child(2n-1) {

    width: 27px;

}

}