.animated{
    -webkit-animation-fill-mode:both;
    -moz-animation-fill-mode:both;
    -ms-animation-fill-mode:both;
    -o-animation-fill-mode:both;
    animation-fill-mode:both;
    -webkit-animation-duration:1s;
    -moz-animation-duration:1s;
    -ms-animation-duration:1s;
    -o-animation-duration:1s;
    animation-duration:1s;
}


@-webkit-keyframes slideInLeft {
    from {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
        visibility: visible;
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes slideInLeft {
    from {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
        visibility: visible;
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.slideInLeft {
    -webkit-animation-name: slideInLeft;
    animation-name: slideInLeft;
}

@-webkit-keyframes fadeOutLeft {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
}

@keyframes fadeOutLeft {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
}

.fadeOutLeft {
    -webkit-animation-name: fadeOutLeft;
    animation-name: fadeOutLeft;
}

.on-mobile {
    display: none;
}

@media all and (min-width: 1280px) {
    body .ontop:before {right: 100px}
}

@media all and (max-width: 1280px) {
    /* main menu */
    body header nav.main a {padding: 10px}
    /* banners */
    body ul.advantages li {padding-right: 0; width: 30%; margin-right: 5%}
    body ul.advantages li:last-child {margin-right: 0}
    body ul.advantages li:after {display: none}
    body ul.advantages li img {width: 100%; height: auto}
    /* categories */
    body .main_categories li:after, body main ul.dots li:after {display: none}
    /* subscription */
    body footer .subscription .title span {display: none;}
    body footer .subscription .form_wrapper {margin-left: 340px}
    /* footer menu */
    footer nav > ul > li {margin-left: 50px; max-width: 200px}
}

@media all and (max-width: 1100px) {
    /* main menu */
    body header nav.main {padding-top: 17px; padding-left: 310px}
    body header nav.main a {height: 20px; line-height: 20px}
    body header nav.main > ul > li:first-child > a {padding-left: 10px;}
    /* header elements */
    body header .top p {display: none}
    body header .top nav.user {float: none; text-align: center}
    body header .top nav.user ul li {display: inline-block; float: none}
    /* search */
    body header .search {margin-right: 200px}
    /* banners */
    body #banner, body #banner > div > div > a, body #banner .sl_a, body #banner .sl_a > div, body #banner .sl_a > div > a {height: 434px;}
    body #banner img {width: 100%; position: absolute;}
    body ul.advantages li {height: 140px}
    /* footer menu */
    footer nav {line-height: 20px; height: 340px; overflow: hidden; padding-top: 40px; max-width: 250px}
    body footer nav > ul > li {margin-left: 0; max-width: 100%; float: none}
    body footer nav > ul > li span {height: auto; line-height: 20px}
    #content #shop_goods .show_hide_filters {right: 31px; top: -19px;}
}

@media all and (max-width: 860px) {
    /* header elements */
    body header .top nav.user ul li {padding: 0 10px;}
    body header .top nav.user ul li:after {display: none}
    /* banners */
    body #banner, body #banner > div > div > a, body #banner .sl_a, body #banner .sl_a > div, body #banner .sl_a > div > a {height: 341px;}
    body ul.advantages {padding-top: 0}
    body ul.advantages li {float: none; margin: 0 auto 20px auto; padding-right: 0; width: 270px; height: 170px}
    body ul.advantages li:last-child {margin: 0 auto;}
    /* goods */
    body .goods_wrapper {margin-left: 0}
    body .goods {width: 100%; margin-left: 0; min-width: 200px;}
    /* goods set at main page */
    body section.goods_set .more, body section.last_reviews .more {display: none}
    /* search */
    body header .search {display: none}
    /* unisiter link */
    body footer .unisiter {display: none}
    #content #shop_goods {margin: 69px 0 0 0;}
    #content #shop_goods .sorting p { position: absolute; top: -24px;}
}

@media all and (max-width: 720px) {
    /* main menu */
    body header nav.main {padding-left: 220px}
    /* header elements */
    body header .top nav.user ul li.phone, body header .top nav.user ul li.mail {display: none}
    /* banners */
    body #banner, body #banner > div > div > a, body #banner .sl_a, body #banner .sl_a > div, body #banner .sl_a > div > a {height: 291px;}
    /* main*/
    body section.about {width: 100%;}
    body #content .text-main .left_col {width: 470px; margin: 0 auto; float: none;}
    body #content .text-main .right_col {width: auto;}
}

@media all and (max-width: 640px) {
    /* general */
    body #content {padding: 40px 0 453px 0;}
    body .container .container {margin: 0 10px;}
    body #content .left_col {display: none;}
    body #content .text-main .left_col {display: block; width: 100%;}
    body .has_left_col main {margin-left: 0;}
    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 form.forms div.item {margin-top: 8px}
    body form.forms .item .hint, body form.forms .item .title {height: 20px}
    body #shop_goods, body #shop_goods div.nav {margin-left: 0; margin-right: 24px}
    body #content h1 {font-size: 26px; line-height: 26px; margin-bottom: 12px; padding-bottom: 12px; padding-right: 24px}
    body h2, body h4 {font-size: 20px; padding-top: 20px; margin-bottom: 20px}
    html, body {font-size: 12px;}
    body section.about h2 {line-height: 26px;}
    body main div.nav {padding-bottom: 20px;}
    body #cart {min-height: 30px;}
    body .header_lines {display: none;}
    body.main #content {padding-top: 40px;}
    /* mobile menu */
    body header nav.main {border-top: none}
    body header nav.main, body header nav.main ul {position: unset; height: unset; line-height: unset; text-align: unset;}
    body header nav.main li {display: block; height: unset}
    body #mobile_nav .mobile-menu-header nav.main ul li:last-of-type a:after, body #mobile_nav ul.category li:last-of-type a:after {content: " "; display: block; position: absolute; left: 5%; bottom: 0; width: 90%; height: 1px; background-color: #eee;}
     /* mobile head */
    body header:before {display: none}
    body header div, body header nav, body header a {display: none}
    body header, #mobile_nav ul.panel {height: 50px; background-color: #ddd;}
    body #cart:before {display: none}
    /* banners */
    body #banner {padding-top: 49px;}
    body #banner, body #banner > div > div > a, body #banner .sl_a, body #banner .sl_a > div, body #banner .sl_a > div > a {height: 200px;}
    body #banner .sliderBullets {bottom: 20px}
    /* cart page */
    body #shopping_cart_table .features {display: none}
    #formOrdering .devider {display: none}
    /* goods card */
    body #shop_goods .goods-card .gallery {float:none; margin: 0 auto 20px auto; padding: 0}
	/*body #shop_goods .goods-card .gallery img{height: 300px}*/
    body #shop_goods .similar-goods {margin-left: -12px}
    body #shop_goods .similar-goods h4 {margin-left: 12px; margin-bottom: 20px;}
    body #shop_goods div.nav {margin-top: -60px; margin-right: 0; width: 100%}
    body #shop_goods div.nav:before {content: ""; display: block; float: right; width: 50px; height: 18px;} /* чтобы текст не перекрывал элементы управления: сортировку и фильтры */
    body #shop_goods ul.goods_slider li.next {right: 0}
    body #shop_goods .goods-card .small, body #zoom {display: none}
    body #shop_goods .goods-card div.qt input {width: 48px;}
    body #shop_goods .goods-card div.qt {width: 102px; margin-right: 10px;}
    body #buy_btn_cont input, body #buy_btn_cont a.button {width: 97px;}
    body .one_click_buy {margin-left: 220px; margin-top: -29px;}
    /* goods list */
    body .goods_set {margin: 0;}
    body .goods a:first-of-type {width: unset; height: unset;}
    body .goods_wrapper {margin-left: -12px;}
    body .goods {display: block; float: left; width: calc(50% - 14px); min-width: 0; margin: 0 0 24px 12px; border: 1px solid #eee; border-radius: 8px; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.05); height: 384px;}
    body .list .goods {float: none; width: calc(100% - 2px); min-width: 0; margin: 0 0 12px 0; height: 156px;}
    body .goods a, body .list .goods a {width: 100%; height: auto}
    body .goods:after {display: none}
    body .goods img {margin: 0 auto 8px auto; width: 100%; max-width: 180px; height: auto; float: none; border: none}
    body .list .goods img {width: 40%; height: auto; float: left; margin: 0}
    body .goods .name {font-size: 14px; line-height: 16px; margin: 8px; padding: 0; height: 48px; overflow: hidden; display: block; max-width: 100%}
    body .list .goods span.name {position: absolute; left: 45%; top: 34px; margin: 0; padding: 0; height: 48px; line-height: 16px; overflow: hidden; display: block; max-width: 100%}
    body .goods span.info {position: absolute; left: 18%; top: 8px; line-height: 21px; font-size: 10px; background: #9a9a9e; color: #fff;}
    body .list .goods span.info {left: 45%; top: 8px; padding: 4px 6px; height: 8px;}
    body .goods .price {left: 8px; right: auto; top: 304px;}
    body .list .goods .price {right: 16px; top: unset; bottom: 57px; left: unset;}
    body .list .goods.goods_btn_no .price {bottom: 25px;}
    body .goods a.buy {right: 8px; bottom: 8px; width: 34px; height: 34px}

    body .goods .buttons, body #shop_goods .goods .buttons {bottom: 12px; width: 170px; margin-left: -85px; left: 50%;}
    body .list .goods .buttons, body #shop_goods .list .goods .buttons {left: unset; right: 0; bottom: 0; top: unset; width: 176px; height: 67px;}
    body .list .goods a.buy, body .list .goods input.buy {right: 8px; margin-right: 0; top: unset; bottom: 10px;}
    body .list .goods.goods_btn_one a.buy, body .list .goods.goods_btn_one input.buy {top: unset;}
    body .goods .buttons a.buy, body .goods .buttons input.buy,  body .goods a.buy {width: 85px; font-size: 10px; right: 0;}
    body .goods .buttons .qt {width: 81px; margin: 0; position: relative; left: 0;}
    body .goods .buttons .qt input {width: 27px;}
    body .goods .qt input, body #shop_goods .goods .qt input {font-size: 14px}
    body .goods input.buy, body .goods .buttons a.buy {left: 83px; right: 8px;}
    body #shop_goods .goods input.buy {left: unset; right: 7px;}
    body #shop_goods .goods .buttons a.buy {right: 14px;}
    body .goods .buttons a.buy, body #shop_goods .goods .buttons a.buy, body .goods a.buy {width: 79px;}
    body .goods a.buy {display: block; bottom: 13px; right: 50%; margin-right: -40px;}
    body .goods .qt, body #shop_goods .goods .qt {width: 76px; border-radius: 4px; margin-left: 0}
    body .list .goods .buttons .qt, body .list #shop_goods .goods .qt {top: 19px; right: unset; left: unset; border-radius: unset}
    body .goods .buttons a, body #shop_goods .goods .buttons a {width: 26px;}
    body .goods .qt input, body #shop_goods .goods .qt input {width: 26px;}
    body .goods.goods_btn_no {height: 330px;}
    body .list .goods:after {display: none;}
    body #view_switcher {top: -100px;}
    /* viewed goods list */
    body .container-view-products .container.products {margin: 0}
    body .goods_viewed {height: 370px;}
    body .goods_viewed .title {margin-bottom: 20px;}
    body .goods_viewed > div {margin-left: -12px;}
    body .goods_viewed .item {width: calc(50% - 14px); min-width: 0; margin: 0 0 12px 12px; border: 1px solid #eee; border-radius: 8px; height: 308px; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.05)}
    body .goods_viewed .item a {height: auto; text-decoration: none}
    body .goods_viewed .item img {margin: 0 auto 8px auto; width: 100%; max-width: 180px; height: auto; float: none; border-radius: 8px;}
    body .goods_viewed .item .name {position: relative; width: auto; left: auto; top: auto; font-size: 14px; line-height: 16px; margin: 8px; padding: 0; height: 48px; overflow: hidden; font-weight: 600;}
    body .goods_viewed .item:not(:first-of-type) {margin-left: 12px;}
    /* goods list switcher */
    body #view_switcher div { position: absolute; right: 0;z-index: 2}
    body #view_switcher div:before {opacity: 0}
    body #view_switcher div.list {padding-right: 0;}
    body #view_switcher div.list.selected, body #view_switcher div.dots.selected{z-index:1}
    body #view_switcher div.dots.selected:before, body #view_switcher div.list.selected:before {opacity: 1; z-index:1}
    /* subscription */
    body footer .subscription .title {color: transparent; font-size: 1px; width: 0; overflow: hidden; height: 60px}
    body footer .subscription .form_wrapper {margin-left: 50px}
    /* blog */
    body #content ul.news_list li img {width: 100%; height: auto;}
    body #content ul.news_list a.img {width: 88%; height: auto; padding: 5%;}
    body.main #content ul.news_list li img {height: unset;}
    body.main #content ul.news_list a.img {width: unset; height: unset; padding: unset;}
    /* FOOTER: general styles */
    body footer {margin-top: -451px;}
    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: block; 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 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}
    /* main page */
    body section.goods_set_wrapper ul.tabs {height: auto;}
    body section.goods_set_wrapper ul.tabs li:before {display: none}
    body section.goods_set_wrapper ul.tabs li {margin: 6px; background-color: #f5f5f5; padding: 4px 6px;}
    /* filters */
    body #shop_goods .filters .values {margin-bottom: 8px; padding-left: 8px;}
    body #shop_goods .filters {padding: 0 8px 0 108px; height: 100%;}
    body #shop_goods .filters:before, body #shop_goods .filters:after {content: " "; display: block; position: relative; width: 100%; height: 8px;}
    body #content #shop_goods .show_hide_filters {right: 30px; top: -61px; font-size: 0; border: none;) 0 0 no-repeat; background-size: 100%}
    body #content #shop_goods .show_hide_filters:before {content: "\e911"; display: block; float: left; font-family: 'Unisiter-Icons'; font-size: 20px; color: #000000;}
    /* sorting */
    body #shop_goods .sorting {top: -61px; right: 0; width: 20px;}
    body #content #shop_goods .sorting p {display: none;}
    body #shop_goods .sorting select {display: block; margin: 0; width: 20px; height: 20px; border: none; padding-top: 20px; position: absolute; background-color: transparent; top: 0;appearance: none !important; webkit-appearance: none; -moz-appearance: none; -ms-appearance: none;}
    body #shop_goods .sorting:before {content: "\e915"; display: block; float: right; font-family: 'Unisiter-Icons'; font-size: 20px; color: #000000;}
}

@media all and (max-width: 480px) {
    /* general */
    body #shopping_cart_table .img {display: none}
    body .on-mobile {display: block}
    body .ontop:before {right: 10px;}
    /* banners */
    body #banner, body #banner > div > div > a, body #banner .sl_a, body #banner .sl_a > div, body #banner .sl_a > div > a {height: 143px;}
    body ul.advantages li {float: none; margin: 0 auto 20px auto; padding-right: 0; width: 270px; height: 170px}
    body ul.advantages li:last-child {margin: 0 auto;}
    /* categories */
    body .main_categories ul, body main ul.dots, body .cats_with_goods #shop_cats ul {margin-left: -12px; padding: 0; box-sizing: border-box;}
    body .main_categories li, body main ul.dots li, body .cats_with_goods #shop_cats ul li {width: calc(33.3% - 14px); margin: 0 0 12px 12px; position: relative; height: 246px; border: 1px solid #eee; border-radius: 8px; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.05)}
    body .main_categories li img, body ul.dots li img {width: 100%; height: auto; margin: 0 auto; border: none; border-radius: 0}
    body .main_categories li a, body ul.dots li a {width: 100%; height: 100%}
    body .main_categories li .name, body ul.dots li .name {width: 100%; height: 41px; top: unset; font-size: 10px; line-height: 1.2; bottom: 12px}
    /* categories with goods */
    body #shop_cats .devider {display: none}
    /* categories as a list */
    body #shop_cats {width: 100%}
    body #shop_cats ul {width: calc(100% - 2px);}
    body #shop_cats ul li {width: 96%; padding: 6px 2%;}
    /* goods */
    body .goods span.info {left: 12%;}
    body .goods .name {font-size: 11px;}
    body .goods .price {left: 0;}
    /* main page features */
    body section.main_features ul {margin-left: 0}
    body section.main_features li {float: none; margin: 0 auto 50px auto}
    /* search */
    body header .search {margin: 0; position: absolute}
    body #search_form_input {box-shadow: inset 0 0 1px #aaa;}
}

@media all and (max-width: 414px) {
    /* banners */

    body .main_categories li, body main ul.dots li {height: 220px;}
    /* goods buy buttons */
    body .goods input.buy,
    body .goods .buttons a.buy,
    body #shop_goods .goods input.buy,
    body #shop_goods .goods .buttons a.buy {padding-left: 0; background-image: none; width: 70px}
    body .goods .buttons a.buy, body .goods .buttons input.buy {width: 78px; top: 41px; left: unset;}
    body .goods .buttons a.buy {margin-right: -8px; left: unset}
    body .goods {height: 420px;}
    body .goods.goods_btn_one {height: 360px;}
    body .list .goods.goods_btn_one {height: 167px;}
    body .goods .buttons, body #shop_goods .goods .buttons {width: 81px; margin-left: -40px; height: 80px;}
    body .goods.goods_btn_one {height: 382px;}
    body .main_categories li .name, body ul.dots li .name {font-size: 8px;}
    body .reducedIndent{display: none;}
    body .right_col h3{
        height: unset!important;
        line-height: 30px!important;
    }
}

@media all and (max-width: 400px) {
    body .goods {padding-top: 0;}
    body .goods .name {height: 48px;}
    body .goods .price {top: 303px;}
    body .goods span.info {left: 8px;}
    /* list */
    /*body .list .goods {height: 250px;}*/
    body .list .goods .price {left: unset; right: 12px;}
    body #shop_goods .list .goods_wrapper .buttons {width: 160px; left: unset; right: 12px;}
    body .list .goods .buttons a.buy {position: absolute; left: unset; right: 0;}
}

@media all and (max-width: 375px) {
    /* banners */
    body .main_categories li, body main ul.dots li {height: 200px;}
    body .list .goods { height: 165px;}
    body .goods_viewed {height: 343px;}
    body .goods_viewed .item {height: 283px;}
    /* subscription */
    body section.subscribe form input[type=email] {line-height: 30px; height: 26px;}
    body section.subscribe form input[type=submit] {right: -2px; top: 60px;}
}

@media all and (max-width: 352px) {
    /* banners */
    body #banner, body #banner .sl_a, body #banner .sl_a > div, body #banner .sl_a > div > a {height: 196px;}
    body .goods .name {height: 80px;}
}