@media screen and (min-width:801px) and (max-width:1250px) {
    html {
        zoom:0.7;
    }
}

@media screen and (max-width:800px) {
    body {
        min-width:360px;
        width:100%;
        max-width:100%;
        
    }
    body > div {
        overflow: hidden;
    }
    .center-box {
    	width:95%;
    	min-height: unset;
    }
    h2 {
        font-size: 24px;
        line-height: 32px;
        padding: 25px 0 25px;
    }
    h3 {
        font-size: 24px;
        line-height: 32px;
        padding: 0;
        margin: 15px 0 0;
        text-transform: unset;
    }
    
    .header .center-box {
        height: auto;
        min-height: auto;
    }
.top-line {
    overflow:hidden;
}    
.topleft {
    float: none;
    margin-right: 0;
    text-align: center;
    margin: 5px 0;
    padding: 7px;
    background: #a59377;
    border: 1px solid #f6f6f6;
}
    .header .logo-box {
        float: none;
        width: 100%;
        height: 80px;
        text-align: center;
        border-bottom: 1px solid #000;
    }
    .header .top-nav {
        float: none;
        width: 100%;
        height: auto;
        margin:10px 0;
    }
    .header .top-nav ul.menu {
        text-align: center;
    }
    .header .top-nav ul.menu li {
        display: none;
    }
.header .top-nav ul.menu li.adv {
    display:none;
} 
.header .top-nav2 {

    display: block;
    margin:0;
    padding:0;

} 
.header .top-nav2 ul.menu {
    display: block;
    margin:0;
    padding:0;

} 
.header .top-nav2 ul.menu li.adv {
    font-size: 18px;
    display: block;
    text-align: center;
    padding: 10px 10px 10px 10px;
    margin: 25px auto;
    width:300px;
    border-bottom: 0;
    border-top: 3px solid red;
    color:red;
    font-weight:bold;
    text-transform:uppercase;
}    
.header .top-nav2 ul.menu li.adv span {
    border-bottom: 0;
    background: #fff;
    padding: 0 10px;
    margin: -20px auto;
    display: block;
    width: 200px;
} 
    
    .header .top-nav ul.menu li.telefon {
        font-size: 21px;
        font-weight: bold;
        display: block;
        text-align: center;
        line-height: normal;
        padding: 5px 0;
    }
.header .top-nav ul.menu li.tf span {
    position: relative;
    bottom: unset;
    display: block;
    right: unset;
}
.header .logo-box .logo {
    display:block;
}
.header .logo-box img {
    display:block;
    margin:0 auto;
    height: 70px;
}
    .header .zvonokbtn-box {
        float: none;
        width: 100%;
        height:auto;
    }
    .header .zvonokbtn-box a {
        margin: 0 0 20px;
    }
    
    .zayavkacatalog-block h2 {
        float: none;
        margin: 10px 0;
        line-height: 28px;
        font-size: 21px;
    }
    .zayavkacatalog-block .kviz-btn {
        float: none;
        padding: 10px 0;
        margin: 0 0 20px;
        line-height: 28px;
        display: inline-block;
        width: 100%;
    }
    .firstscreen .slogan {
        position: relative;
        margin: 0;
        top: unset;
        left: unset;
        text-align: center;
        font-size: 18px;
        padding:10px;
    }
    .firstscreen .vk {
        position: relative;
        margin: 10px 10px 0 auto;
        right: unset;
        top: unset;
        width: 210px;
        padding: 10px 70px 10px 10px;
        text-align: center;
        font-size: 18px;
    }
    .firstscreen .center-box {
        height: auto;
        padding: 50px 0 50px;
        min-height: auto;
        color: #fff;
        position: relative;
    }
    .firstscreen .left-col {
        text-shadow: 0 0 4px #000;
        float: none;
        width: 100%;
        font-size: 18px;
        line-height: 24px;
    }
    .firstscreen .left-col .text2 {
        font-weight: bold;
        font-size: 28px;
        line-height: 36px;
    }
    .firstscreen .right-col {
        float: none;
        width: 100%;
        margin: 20px 0 0;
    }
    
    .topscreen {
        position: relative;
        height:auto;
        padding-bottom:10px;
    }
    .topscreen .slogan {
        position: relative;
        margin: 0;
        top: unset;
        left: unset;
        text-align: center;
        font-size: 18px;
        padding:10px;
    }
    .topscreen .vk {
        position: relative;
        margin: 10px 10px 0 auto;
        right: unset;
        top: unset;
        width: 210px;
        padding: 10px 70px 10px 10px;
        text-align: center;
        font-size: 18px;
    }
    
    .textblock .center-box {
        width:95%;
        margin: 20px auto;
    }
    .examples-block .center-box {
        width: 95%;
    }
    .examples-block .thumb {
        width: 49%;
    }
    .advantages-block img {
        width:100%;
    }
    .fos-box3 .fos-box-text {
        width: 100%;
        margin: 0 auto;
        font-size: 21px;
        line-height: 28px;
    }
    .fos-box3 .fos-box-content {
        margin: 20px auto;
    }
    .fos-box3 .blo input[type="text"] {
        width: 250px;
        display:block;
    }
    
    .catalog-item {
        float: none;
        width: 300px;
        margin: 20px auto;
        padding: 20px;
        border: 1px solid #ddd;
    }
    .fibro .catalog-item {
        float: none;
        width: 300px;
        margin: 20px auto;
        padding: 20px;
        border: 1px solid #ddd;
    }
    .klinker .catalog-item {
        float: none;
        width: 300px;
        margin: 20px auto;
        padding: 20px;
        border: 1px solid #ddd;
    }
    .terras .catalog-item {
        float: none;
        width: 300px;
        margin: 20px auto;
        padding: 20px;
        border: 1px solid #ddd;
    }
    
    .fos-box4 .fos-box-text {
        font-size: 21px;
        line-height: 28px;
        width: 100%;
        margin: 0 auto;
    }
    
    .vidypokritiya-block img {
        width:100%;
    }
    
    .drugieotdelki-block img {
        width:100%;
    }
    .zachtovybirayut-block img {
        width:100%;
    }
    .panelivrazreze-block img {
        width:100%;
    }
    .gdk {
        width:100%; 
        margin:10px auto;
    }
    .prichiny-block img {
        width:100%;
    }
    .kakrabotaem-block img {
        width:100%;
    }
    .map-block .center-box {
        height: auto;
        width: 95%;
        min-height: auto;
        position: relative;
    }
    .map-block .contacts {
        margin: 0;
        left: unset;
        top: unset;
        width: 100%;
        position: relative;
        padding: 20px 10px;
        height: auto;
    }
    .footer .menu-line .logo-box {
        float: none;
        width: 100%;
        height: 80px;
        text-align: center;
    }
    
    .footer .menu-line .top-nav {
        float: none;
        width: 100%;
        height: auto;
    }
    .footer .menu-line  .top-nav ul.menu li {
        display: none;
    }
    .footer .menu-line ul.menu li.telefon {
        font-size: 28px;
        font-weight: bold;
        display: block;
        text-align: center;
        line-height: normal;
        padding: 20px 0;
    }
    .footer .menu-line .zvonokbtn-box {
        float: none;
        width: 100%;
        height:auto;
    }
    .footer .menu-line .zvonokbtn-box a {
        margin: 0 0 20px;
    }
    
.footer .top-nav ul.menu li.tf span {
    position: relative;
    bottom: unset;
    display: block;
    right: unset;
}
    .fos-box5 {
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        margin-left: 0;
        margin-top: 0;
    }
    .fos-box5 .fos-box-title {
        font-size: 21px;
        line-height: 28px;
        width: 100%;
    }
    .fos-box5 .fos-box-text {
        width: 100%;
    }
    .fos-box5 .blo-check {
        width: 100%;
    }
    .fos-box {
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        margin-left: 0;
        margin-top: 0;
    }
    .fos-box .fos-box-title {
        font-size: 21px;
        line-height: 28px;
        width: 100%;
    }
    .fos-box .fos-box-text {
        width: 100%;
    }
    .fos-box .blo-check {
        width: 100%;
    }
    .fos-box6 {
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        margin-left: 0;
        margin-top: 0;
    }
    .fos-box6 .fos-box-title {
        font-size: 21px;
        line-height: 28px;
        width: 100%;
    }
    .fos-box6 .fos-box-text {
        width: 100%;
    }
    .fos-box6 .blo-check {
        width: 100%;
    }
    
    .katalog-item {
        float:none;
        width:100%;
        padding:10px;
        position:relative;
    }
    .katalog-item.double {
        width:100%;
    }
    .katalog-item .title {
        font-size:21px;
        line-height:24px;
    }
    .katalog-item .title img {
        display:block;
        height:110px;
    }
    .katalog-item .title > div {
        font-size:36px;
        line-height:42px;
    }
    .katalog-item .title > div.small {
        font-size:24px;
        line-height:32px;
    }
    .katalog-item .cost {
        font-size:18px;
        line-height:24px;
        height:28px;
    
    }
    .katalog-item .cost strong {
        font-size:21px;
    }
    
    .map-line {
        height:auto;
    }
    .map-block .center-box {
        height: auto;
        width: 100%;
        min-height: auto;
        position: relative;
        top:0;
        left:0;
        margin:0;
    }
     .map-line .map-foto {
        font-size:14px;
        line-height:21px;
    }

.fos_catalog .center-box {
    background: #eee url(/images/foscatalog.png) center top no-repeat;
    padding: 300px 0 20px 0;
    text-align: left;
    background-size: contain;
}
.fos_catalog .blo input[type="text"], .fos_catalog .blo input[type="email"] {
        padding: 15px;
        width: 90%;
        font-size: 18px;
        line-height: 24px;
        margin: 10px auto;
        color: #666;
        border: 1px solid #eee;
    }
    
    .katalog-item {
                    float: none;
                    width: 100%;
                    padding: 0;
                    height: auto;
                    position: relative;
                }
                .katalog-item .container {
                    height: 280px;
                }
                .katalog-item .container:hover {
                    margin: 0;
                    height: 280px;
                    width: 100%;
                    border: 0;
                }
                .katalog-item .container.v1:hover {
                    margin: 0;
                }
                .katalog-item .container.v2:hover {
                    margin: 0;
                }
                .katalog-item .container.v3:hover {
                    margin: 0;
                }
                .katalog-item .container.v4:hover {
                     margin: 0;
                }
                .katalog-item .container.v5:hover {
                    margin: 0;
                }
                .katalog-item .container.v6:hover {
                    margin: 0;
                }
                .katalog-item .container .fonzik {
    
                    opacity:0.1;
                }
    
}