﻿@media (max-width:1200px) {
    .container {
        padding-right: 50px;
        padding-left: 50px;
    }
}

@media (max-width:1100px) {
    .container {
        padding-right: 20px;
        padding-left: 20px;
    }
}

@media (max-width:460px) {
    .container {
        padding-right: 5px;
        padding-left: 5px;
    }
}

@media (max-width:768px) {
    .registing-login {
        left: -60px;
    }
}

@media (max-width:460px) {
    .registing-login {
        left: -80px;
    }
}

@media (max-width:350px) {
    .having-login {
        left: -50px;
    }

    .had-login {
        left: -65px !important;
    }

    .hidden-mobile {
        display: none;
    }

    .registing-login {
        left: -140px;
    }

    .ul-top li {
        padding: 0px 0px 0 8px;
    }

    .login-notyet {
        padding-right: 2px !important;
    }

    .ul-top {
        padding: 25px 0px 10px 0;
    }
}

@media(max-width:950px) {
    .top-header, .top-header a {
        font-size: 12px;
    }
}

@media(max-width:900px) {
    .ul-top-sologan .item {
        padding: 0px 50px 0 4px;
    }
}

@media(max-width:992px) {
    #custom-search-form button i {
        color: #327E00;
    }
}

@media(max-width:1297px) {
    .header-bar-top .item-1 {
        width: 30%;
    }

    .header-bar-top .item-2 {
        width: 40%;
    }

    .header-bar-top .item-3 {
        width: 30%;
    }
}

@media(max-width:957px) {
    .header-bar-top .item-1 {
        width: 25%;
        padding-left: 2px;
    }

    .header-bar-top .item-2 {
        width: 40%;
        padding-left: 2px;
    }

    .header-bar-top .item-3 {
        width: 35%;
        padding-left: 2px;
    }
}

.show-912 {
    display: none;
}

.show-637 {
    display: none;
}

.marquee-style {
    width: 85%;
}

@media(max-width:912px) {
    .hidden-912 {
        display: none;
    }

    .show-912 {
        display: inline-flex;
    }
}

@media(max-width:823px) {
    .marquee-style {
        width: 80%;
    }
}

@media(max-width:637px) {
    .show-637 {
        display: inline-flex;
    }

    .hidden-637 {
        display: none !important;
    }

    .marquee-style {
        width: 100%;
    }

    .header-bar-top .span-item {
        padding: 0 10px;
    }

    .header-bar-top {
        border-right: 2px solid #fff;
        border-left: 2px solid #fff;
    }
}

@media(max-width:884px) {
    .menubackgrough {
        font: 600 14px bold;
    }

    .marginmenu > li {
        font: 600 14px bold;
    }

    .products .product-item {
        width: 50%;
    }
}

@media(max-width:768px) {
    .products .product-item {
        padding: 0px;
    }

    .col-right {
        padding-left: 0;
        padding-right: 0;
    }
}

@media(max-width:768px) and (min-width:471px) {


    .products .product-item {
        width: 33.333333%;
    }

    .productslide-hot {
        width: 50%;
        padding-right: 5px;
        float: left;
    }

    .productslide-sale {
        width: 50%;
        padding-left: 5px;
        float: left;
    }
}

@media(max-width:768px) and (min-width:650px) {
    .products .product-item {
        height: 330px;
        padding-left:10px;
    }

        .products .product-item .pro-desc, .products .product-item .pro-desc a, .products .product-item .pro-desc span {
            font-size: 13px;
        }

    .product-item .item-content {
        height: 325px;
    }
}

@media(max-width:650px) {
    .products .product-item {
        width: 50%;
            padding-left: 38px;
    }
}

@media(max-width:540px) and (min-width:400px) {
    .products .product-item {
        height: 330px;
        padding-left:10px;
    }

    .product-item .item-content {
        height: 325px;
    }
}

@media(max-width:470px) {
    .productslide-hot {
        width: 100%;
        padding-left: 0;
        padding-right: 0;
    }

    .productslide-sale {
        width: 100%;
        padding-left: 0;
        padding-right: 0;
    }
}

@media(max-width:400px) and (min-width:340px) {

    .products .product-item {
        width: 100%;
        padding: 25px;
    }
}

@media(max-width:340px) {
    .products .product-item {
        width: 100%;
        padding: 10px;
    }
}

@media(max-width:991px) {
    #modalOrder .modal-dialog {
        width: 95%;
    }
}
