.on-mobile {
    display: none;
}

@media all and (min-width: 1100px) {
    header .mail {left: 40%;}
    header .main {display: block;}
}

@media all and (max-width: 1100px) {
    header .phone {display: block;}
    header .main {display: none;}
    header .mail {right: 0; left: auto; display: block;}
    body div.selection {overflow: hidden; height: auto; padding-bottom: 30px}
    body div.selection form {padding-left: 0;}
    body h2.category_header {width: auto; clear: both;}
    body h2.category_header:first-child {clear: none}
    /*body .one_click_buy {display: none}*/
    body #shop_goods .buttons .price {font-size: 20px;}
    /* footer */
    footer ul.social {top: 69px;}
    body footer .ways_to_pay {display: none}
}

@media all and (max-width: 860px) {
    #line form {display: block;}
    #main_catalog {display: block;}
    #banner {display: block;}
    .banner_line .goods {float: right;}
    #shop_goods .sorting {display: none}
    body footer .subscription {display: none}
}

@media all and (max-width: 720px) {
    #line form {display: none;}
    header .mail {display: none;}
    #main_catalog {display: none;}
    #banner {display: none;}
    .banner_line .goods {float: none;}
    #shopping_cart_table .img {display: table-cell;}

    body header a.whatsapp, body header a.telegram {display: block;}
    body #buy_btn_cont input {float: right; margin-right: 80px;}

    body #shop_goods .goods-card .gallery {float: none; margin: 0 auto 40px auto}
    body #shop_goods .goods-card .small {margin: 0}
    body #shop_goods .goods-card .small img {margin: 0 1% 2px 1%; border-width: 0; width: 31%}

}

@media all and (max-width: 640px) {
    #logo {top: -26px;}
    header .city {top: 40px;}
    footer nav li:first-child {display: inline;}
    #cart {float: right; margin: 0;}
    #shopping_cart_table .img {display: none;}
    #shopping_cart_table td, #shopping_cart_table th {word-break: normal;}
    .goods_hits > a, .goods_sale > a {display: inline;}
    body #shop_goods .filters {float: none; min-height: 0; margin-bottom: 20px; width: auto;}
    body .is_filter {margin-left: 0;}
    body header a.whatsapp, body header a.telegram {top: -4px;}

    body #shop_goods .features {width: 100%; margin-top: 80px}
    body #shop_goods .features > div {padding-right: 0}
    body #shop_goods .buttons {float: none; width: 100%}
    body #shop_goods .buttons .price, body #buy_btn_cont, body #shop_goods .price-label {text-align: center}

    body #goods_desc .tabs li {float: none; border-width: 0}
    body #goods_desc .tabs li:last-child {border-top-right-radius: 0;}

    body .fancybox-nav span {visibility: visible}
    /* FOOTER: general styles */
    body footer, body footer .container {height: auto;}
    body footer ul.contacts {display: block; position: relative; top: auto; padding: 20px 0 0 0; background: transparent; width: auto; max-width: 100%; margin: 0; float: none}
    body footer ul.contacts li, body footer nav > ul > li li {font-size: 14px; line-height: 24px; margin-left: 0;}
    body footer ul.contacts li.title, body footer nav > ul > li.sub span {height: auto; line-height: 40px; font-size: 16px; font-weight: bold}
    body footer ul.contacts a, body footer ul.contacts span {height: auto; line-height: 24px; text-decoration: none}
    body footer nav {display: block; max-width: 100%; padding: 0; position: relative; float: none; height: auto}
    body footer nav > ul > li {float: none; width: auto; margin: 0}
    body footer nav > ul > li ul {list-style-type: none}
    body footer nav a {text-decoration: none}
    body footer ul.social {position: relative; left: auto; top: auto; margin: 0; padding: 16px 0; text-align: center; width: auto; height: auto}
    body footer .bottom {position: relative; top: auto; text-align: center; height: auto; padding: 20px 0; line-height: 24px}
    body footer .ways_to_pay {position: relative; display: block; width: 100%; height: 20px; background-size: contain; background-position: center 0; left: auto; top: auto; bottom: auto; margin: 0 0 20px 0; padding: 0; font-size: 1px; color: transparent;}
    body footer .unisiter {display: none; position: relative; left: auto; right: auto; top: auto}
    body footer .unisiter a {display: inline-block; background-position: 0 -14px}
    body footer .unisiter a:hover {background-position: 0 -64px}
    body footer .copyright {position: relative; left: auto; top: auto; line-height: 24px; margin: 0; height: auto}
    body footer p.description {display: none}
    /* FOOTER: martfor styles */
    body footer .contacts .title {display: block}
    body footer ul.social {padding-bottom: 0; height: 32px}
    /* footer elements */
    body footer nav > ul > li.sub ul {opacity: 0; height: 0; transition: all 0.5s ease; overflow: hidden;}
    body footer nav > ul > li.sub > span:after {content: '\e90a'; display: inline-block; font-family: 'Unisiter-Icons'; font-size: 12px; font-weight: bold;}
    body footer nav > ul > li.show ul {opacity: 1; height: auto}
    body footer nav > ul > li.show > span:after {transform: rotate(180deg);}
    body footer nav > ul > li > span.empty {display: none}
    body .itemAdvantages{width: 100%; max-width: 100%}
    body .has_left_col main{margin-left: unset;}
    body #content .left_col{width: 100%;}
}

@media all and (max-width: 480px) {
    header {height: 114px;}
    header #logo {top: -16px;}
    body header .phone {top: 85px!important; font-size: 20px;}
    body header .container.container-scroll {position: fixed!important; height: 50px; margin: 0 auto; width: 100%; z-index: 1398; background-color: #fff; padding-top: 10px; padding-bottom: 10px; left: 0!important; text-align: center; top: 0px!important; border-bottom: 1px solid #eee;}
    header .city {top: 50px;}
    header .container.container-scroll #logo {left: 14px; background-size: 60%}
    body header .container.container-scroll .phone {left: 174px!important; top: 23px!important;}
    header .top li:first-child {display: inline;}
    #cart {float: left; margin: 0;}
    #shopping_cart_table td, #shopping_cart_table th {word-break: break-all;}
    body #line {margin-bottom: 40px}
    body #line .cat_title {width: 100%;}
    body #cart {position: relative; margin: 0 auto; float: none;}
    body div.selection form {margin: 40px auto 0 auto; width: 100%; padding: 0; text-align: center}
    body div.selection form select {width: 100%; margin-right: 0}
    body div.selection form input {display: inline-block; width: 150px; height: 56px; line-height: 56px;}
    .goods_hits > a, .goods_sale > a {display: none;}
    footer nav {display: none;}
    .main .banner_line {height: auto;}
    .main .goods_hits h4, .main .goods_sale h4 {display: none;}
    .main .goods_hits .goods span.info {display: block;}
    .main .goods_hits, .main .goods_sale {height: auto; margin: 0; overflow: visible;}
    .main .goods {width: 90%; padding: 4.5%; height: 100px; margin-left: 0; float: none;}
    .main .goods a {width: auto}
    .main .goods .buy {display: none}
    .main .goods img {display: block; width: 150px; height: 100px; margin: 0; float: left;}
    .main .goods span.info {line-height: 25px; top: -1px}
    .main .goods span.name {display: block; margin-left: 160px; height: 60px; overflow: hidden; line-height: 15px;}
    .main .goods .price {font-size: 18px; position: absolute; right: 10px; bottom: 10px;}
    body.main .goods .old-price {left: unset; right: 110px!important;}
    /*shop_goods*/
    body #shop_goods .features span.color,
    body #shop_goods .features span.color:hover {width: 80px; height: 60px;}
    body #shop_goods .color div {width: 74px; height: 42px; background-position: center;}


    /* main page type map */
    body ul.type_map {margin-left: 0}
    body ul.type_map li {min-height: 0; margin: 0 0 20px 0; float: none; width: auto;}
    body ul.type_map li li {width: auto}

    /* left side category list */
    body #shop_cats ul.category {display: none}
    body .is_cat {margin: 0}

    body header a.whatsapp, body header a.telegram {top: 19px;}
    body header .top ul li {margin-left: 5px}

    body form.forms .item .title, body form.forms .item .input,  body form.forms .item .textarea, body form.forms .item .hint, body form.forms .item .hinterror {width: 90%}

    body .one_click_buy {width: 60%; padding: 10px 0; left: 20%; text-align: center;
    box-sizing: border-box; text-transform: uppercase;}
    body #buy_btn_cont input {float: none; margin-right: 0; display: inline-block}

    body .banners_for_type {height: 80px}
    body .banners_for_type img {width: 94%;}

    body .spoiler summary {width: calc(100% - 40px);}
}

@media all and (max-width: 400px) {
    body.main .goods img {width: 100px; height: 75px; padding-top: 13px;}
    body.main .goods span.name {margin-left: 115px;}
}

@media all and (max-width: 352px) {
    body .container .container {margin: 0 10px 0 10px;}
    header .top li:first-child {display: none;}
    body header a.whatsapp, body header a.telegram {top: 22px;}
}