.humburger{
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 700;
    height: 24px;
    width: 24px;
    cursor: pointer;
}
.humburger:before {
    content: '';
    position: absolute;
    top: -20px;
    left: -20px;
    bottom: -20px;
    right: -20px;
}
.humburger span,
.top-menu>ul>li>a:before,
.top-menu>ul>li>span:before {
    background: #ff020f;
}
.humburger span {
    position: absolute;
    display: block;
    width: 100%;
    height: 2px;
    background: #ff020f;
    right: 50%;
    margin-right: -12px;
    -webkit-transition: background-color .3s,opacity .3s,-webkit-transform .3s;
    transition: background-color .3s,opacity .3s,-webkit-transform .3s;
    -o-transition: transform .3s,background-color .3s,opacity .3s;
    transition: transform .3s,background-color .3s,opacity .3s;
    transition: transform .3s,background-color .3s,opacity .3s,-webkit-transform .3s;
}
.humburger span:first-child {
    top: 0;
}
.humburger span:nth-child(2) {
    top: 50%;
    margin-top: -1px;
}
.humburger span:last-child {
    bottom: 0;
}
.humburger.open span:last-child {
    -webkit-transform: translateY(-7px) rotate(
            -45deg
    ) translateZ(0);
    transform: translateY(-7px) rotate(
            -45deg
    ) translateZ(0);
}
div.content img{
    max-width: 100%;
    height: auto;
}
.humburger.open span:first-child {
    -webkit-transform: translateY(14px) rotate(
            45deg
    ) translateZ(0);
    transform: translateY(14px) rotate(
            45deg
    ) translateZ(0);
}
.humburger.open span:nth-child(2) {
    opacity: 0;
}
#mobile-menu{
    padding: 0;
    margin: 0;
    list-style: none;
    background: #ff020f;
}
#mobile-menu li{

}
#mobile-menu li a{
    color: white;
    padding: 15px;
    display: table;
    width: 100%;
 }
#mobile-menu > li.active,
#mobile-menu > li:hover{
    background: white;
    text-decoration: none;
}
#mobile-menu > li.active a,
#mobile-menu > li:hover a{
    color: #ff020f;
}
@media (min-width: 576px) {
    section,
    header,
    footer{
        max-width: 320px;
    }
    .product-item > div{
        padding: 20px;
    }
}
@media (min-width: 600px) {
    section,
    header,
    footer{
        max-width: 720px;
    }
}
@media (min-width: 768px) {
    section,
    header,
    footer{
        max-width: 720px;
    }
    .product-item > div{
        padding: 20px;
    }
}
@media (min-width: 992px) {
    section,
    header,
    footer{
        max-width: 960px;
    }
}

@media (min-width: 1200px) {
    section,
    header,
    footer{
        max-width: 1190px;
    }

}
@media(min-width: 1300px){
    section,
    header,
    footer{
        max-width: 1210px;
    }
    .product-item > div{
        padding: 40px 60px 25px;
        display: table;
        margin: 0 auto;
    }
}
@media(min-width: 1400px) {
    section,
    header,
    footer{
        max-width: 1371px;
    }
}
@media (min-width: 900px) {
    .humburger{
        display: none;
    }
}
@media (max-width: 1400px) {
    div.content .page-item-attributes img{
        max-width: 600px;
    }
    .page-item.kachestvo .block_description{
        padding: 0;
    }
}
@media (max-width: 1200px) {
    .content .block_description{
        width: 100%;
    }
}
@media (max-width: 1000px) {
    #page_about .bottom-block{
        flex-wrap: wrap;
    }
    #page_about .bottom-block > {
        flex-basis: 100%;
    }
    #map-contact-block{
        position: relative;
        width: auto;
        right: 0;
        top: 0;
    }
}
@media (max-width: 900px) {
    #about_image div{
        text-align: center;
    }
    div.content .page-item-attributes img{
        max-width: 100%;
    }
    #properties-block{
        margin: 0 auto;
        text-align: center;
    }
    ul#menu{
        display: none;
    }
    #news_image{
        display: none;
    }
    .news-item{
        flex-basis: 100%;
        margin-bottom: 30px;
    }
    #main_page_news .news-item > div:nth-child(2){
        min-height: auto;
    }
    #news a.all_news{
        margin-top: 0;
    }
    #main_page_about{
        width: 100%;
        text-align: center;
        padding: 0;
    }
    #main_page_about h1{
        font-size: 35px;
    }
    #main_slider > div{
        text-align: center;
    }
    footer{
        padding: 50px 20px;
    }
    footer > div div{
        flex-basis: 100%;
        margin: 0 auto;
        display: table;
        text-align: center;
    }
    footer > div > div:last-child{
        text-align: center;
        max-width: 50%;
        margin-top: 50px;
    }
    footer > div div.social{
        flex-basis: 100%;
        margin-bottom: 10px;
    }
}
@media (max-width: 800px) {
    section#page-title-block{
        padding-left: 0;
    }
    .category.with_calendar aside{
        display: none;
    }
    .category.with_calendar .left-block{
        flex-basis: 100%;
    }
    section.oborud > ul li{
        flex-basis: 100%;
    }
}
@media (max-width: 600px){
    #about_image div{
        font-size: 20px;
        position: relative;
        bottom: 0;
        color: black;
        text-align: center;
        left: 0;
    }
    #page_about .bottom-block{
        flex-wrap: wrap;
    }
    #main_slider{
        margin-top: 20px;
        /*display: none;*/
    }
    #main_slider > div{
        display: none;
    }
    footer > div{
        padding: 0;
    }
    #news{
        padding: 0;
    }
    section.oborud h2{
        width: 100%;
        text-align: center;
    }
    section.oborud ul{
        padding: 0;
        flex-basis: 100%;
        text-align: center;
    }
}
@media (max-width: 576px) {

    .product-item{
        width: 100%;
        flex-basis: 100%;
        text-align: center;
    }
    .product-item > div{
        padding: 10px;
    }
    section,
    header,
    footer{
        max-width: 320px;
    }
}
@media (max-width: 500px) {
    #main_page_about h1{
        font-size: 25px;
    }
    footer{
        padding: 0;
    }
    section{
        max-width: 350px;
    }
    footer > div{
        padding: 30px 10px;
    }
    header{
        max-width: 350px;
    }
    header > div{
        padding: 10px;
    }
}
@media (max-width: 450px) {
    header img{
        max-width: 200px;
    }
}