/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 02.02.2020, 22:40:55
    Author     : глеб
*/

@media only screen and (max-width: 950px),only screen and  (max-device-width: 950px) {
    div.fixsize {
        width: 90%;
    }
    div.logo {
        width: 30%;
        margin-right: 5%;
    }
    div.topheader div.midle {
        width: 30%;
        margin-right: 5%;
    }
    div.topheader div.topInfo {
        width: 30%;
    }
    div.menu ul.menu li a {
        font-size: 15px;
    }
    div.blockImg {
        width: 30%;
    }
    .blockImg{
        margin-right: 5%;
    }
    .fixleft>.blockImg:last-child{
        margin-right: 0px;
    }
    div.whywe div.whyblokc {
        margin-bottom: 38px;
        display: inline-table;
        width: 45%;
        margin-right: 5%;
    }
    div.whywe>div.whyblokc:nth-child(2n+2){
        margin-right: 0%; 
    }
    .rewBlock .fixInline div.BlockRewInf{
        width: 45%;
        margin-right: 5%;
    }
    .rewBlock .fixInline>div.BlockRewInf:nth-child(2n+2){
        margin-right: 0%;
    }
    div.quest div.leftpart{
        float: none;
        width: 100%;
        text-align: center;
    }
    div.quest ul li:before{
        display: none;
    }
    div.quest div.rightpart {
        width: 80%;
        float: none;
        margin: auto;
    }
}
@media only screen and (max-width: 800px),only screen and  (max-device-width: 800px) {
    .hidden-destop{
        display: block;
    }
    div.menu ul.menu li a {
        font-size: 12px;
        padding: 10px;
    }
    div.BoxCal div.leftpart {
        width: 80%;
        float: none;
        margin: auto;
    }
    div.BoxCal div.rightpart {
        float: none;
        width: 85%;
        margin: auto;
        margin-top: 50px;
    }
    span.h2.calculator_h{
        text-align: center;
    }
    div.BoxCalInner {
        background-size: cover;
    }
    div.sendOrder div.InputBlock{
        display: block;
    }
    .FormBlock {
        display: block;
        text-align: center;
    }
    .FormBlock input[type=submit]{
        margin-left: -20px;
    }
    div.quest div.rightpart {
        width: 100%;
    }
    div.Onlyindex h1 {
        font-size: 30px;
    }
    .header div.imgblock {
        margin-left: 17px;
        margin-bottom: -23px;
        width: 50%;
        height: 360px;
        background: url(../img/man.png) no-repeat bottom/contain;
    }
    .header div.imgblock img{
        width: 100%;
        height: auto;
        display: none;
    }
    div.menu .menu{
        display: none;
    }
    div.menu{
        width: 100%;
        border-radius: 50px;
        padding: 10px;
        padding-right: 20px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
    }
    .menu .btn-menu-mob{
        width: 40px;
        height: 40px;
        display: block;
    }
    .menu .btn-menu-mob{
        padding: 10px;
        border-radius: 10px;
        border:1px solid #fff;
    }
    .menu .btn-menu-mob>span{
        display: block;
        height: 4px;
        background: #fff;
        margin-bottom: 3px;
    }
    .menu-container-mobile-owerlay {
        position: fixed;
        left: 0px;
        right: 0px;
        top: 0px;
        bottom: 0px;
        z-index: 10;
        background: rgba(204, 204, 204, 0.72);
        transition: 0.5s;
        opacity: 0;
        display: none;
    }
    .menu-container-mobile-owerlay.fade{
        display: block;
    }
    .menu-container-mobile-owerlay.fade.in{
        opacity: 1;
    }
    .menu-container-mobile-owerlay .menu-container-mobile {
        position: fixed;
        right: 0px;
        background: #fff;
        top: 0px;
        bottom: 0px;
        width: 50%;
        overflow-y: auto;
        transition: 0.5s;
        opacity: 0;
        transform: translateX(100%);
    }
    .menu-container-mobile-owerlay.fade.in .menu-container-mobile{
        opacity: 1;
        transform: translateX(0%)
    }
    .header-menu{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
    }
    .header-menu .btn-close-menu{
        font-size: 3rem;
        line-height: 2rem;
        display: block;
        width: 40px;
        height: 40px;
        background: #000;
        color: #fff;
        text-decoration: none;
        text-align: center;
    }
    .body-menu {
        padding: 20px;
        margin-top: 40px;
    }
    .body-menu>ul>li>a{
        display: block;
        padding: 10px;
        text-decoration: none;
        color: #000;
    }

}
@media only screen and (max-width: 700px),only screen and  (max-device-width: 700px) {
    div.logo {
        width: 100%;
        margin-right: 0%; 
        background: url(../img/logo.png)no-repeat center/contain;
        margin-bottom: 20px;

    }
    div.topheader div.midle {
        width: 100%;
        margin-right: 0%;
        text-align: center;
        margin-bottom: 20px;
    }
    div.topheader div.midle div.number{
        display: inline-block;
    }
    div.topheader div.topInfo {
        width: 100%;
        text-align: center;
        margin-bottom: 20px;
    }
    div.topheader div.topInfo a.bt.icocall {
        position: relative;
        display: inline-block;
    }
    div.topimgBlokc div.leftpart {
        display: none;
    }
    .header div.imgblock{
        background: none;
    }
    div.topimgBlokc {
    left: 50%;
    transform: translateX(-50%);
}
div.blockOne div.fixsize{
    text-align: center;
}
div.blockOne div.fixsize div.blockImg {
    width: 60%;
    margin-right: 0px;
}
.rewBlock .fixInline div.BlockRewInf {
    width: 100%;
    margin-right: 0%;
}
div.InputBlock.right,
div.InputBlock.left {
    float: none;
}
div.quest div.formbg div.InputBlock input[type=text]{
   width: 100%;
}
div.footer {
    height: 280px;
}
.menu-container-mobile-owerlay .menu-container-mobile {
    width: 80%;
}
}
@media only screen and (max-width: 500px),only screen and  (max-device-width: 500px) {
    div.whywe div.whyblokc {
    width: 100%;
    margin-right: 0%;
}
div.BoxCal div.rightpart div.imgvanny img {
    display: block;
    width: 100%;
}
.bottomBlock {
    display: none;
}
div.footer {
    height: 360px;
}
}
@media only screen and (max-width: 400px),only screen and  (max-device-width: 400px) {
    div.footer {
    height: 420px;
}
}