/**
 * [media description]
 * @param  {[type]} max-width: 1199px        [description]
 * @return {[type]}            [description]
 */
@media (max-width: 1199px) {
    #f-banner {width: 550px}
    .pro-list .pro img, .list .pro img {height: 120px}
    .pro-list .pro {width: calc((100% - 60px)/3);}
    .contact, .googlemap {width: 100%;margin-right:0;margin-left: 0}
    .googlemap {margin-top: 0;margin-bottom: 20px}

    .ct-pro {width: 250px}
    .box-sp {width: calc(100% - 270px);}
}
/**
 * [media description]
 * @param  {[type]} max-width: 991px         [description]
 * @return {[type]}            [description]
 */
@media (max-width: 991px) {

    .list_post_big .item:last-child
    {
        display: none;
    }
    #pull img {
        display: block;
        margin: 7px 14px 7px 14px;
    }
    .duan_meta {
        height: 147px;
        overflow: hidden;
    }
    .item_vertiacl p 
    {
        height: 50px;
        overflow: hidden;
    }
    .tempBreadcrumb 
    {
        display: none;
    }
    #single-projec .col-xs-6
    {
        padding-left: 5px;
        padding-right: 5px;
    }
    #main-nav ul{ display:none; position:absolute;top: 50px; left:0; z-index:10001;width: 94%;}
    #main-nav ul li {
        float:none;
        background: rgba(40, 40, 40, 0.9);
        border-bottom: 1px solid rgba(255,255,255,.2);
        width: 100%;
        border-right: none;
    }
    #main-nav ul li a{ display:block; color:#ccc;}
    #main-nav ul ul li {background: rgba(40, 40, 40,.85);}
    #main-nav ul ul {position: static;}
    #main-nav ul ul {width: 100%}
    #logo {
        position: absolute;
        top: 0;
        left: 60px;
        z-index: 99;
    }
    #logo img {text-align: center;height: 49px;display: block;}

    #f-banner {display: none}
    .hotline {
        position: absolute;
        right: 50px;
        z-index: 99;
        top: 15px;
        height: auto;
    }
    .hotline .tit {display: none;}
    .hotline .phone {font-size: 16px;color: #eee;text-shadow: none;}
    .sub-top {height: 0;}
    .left {display: none}
    .right {width: calc(100%);}
    .pro-list .pro {width: calc((100% - 80px)/4);}
    #slide {display: none}

    .ct-pro {width: 300px}
    .box-sp {width: calc(100% - 320px);}
    #main-nav .cart-info {
    right: 15px;
    bottom: 7px;
}
}
/**
 * [media description]
 * @param  {[type]} max-width: 767px         [description]
 * @return {[type]}            [description]
 */
@media (max-width: 767px) {
    .pro-list .pro {width: calc((100% - 60px)/3);}
    .seo {float: none;width: 100%;text-align: center;}
    .r-f {float: none;width: 100%;text-align: center;}
    .g-search {
        margin-left: 0;
        display: none;
    }
    .pro-list .pro img, .list .pro img {height: 110px;}

    .ct-pro {width: 100%;float: none;}
    .box-sp {width: 100%;float: none;}
    .view-block {width: 100px}
    .large_img {width: calc(100% - 120px)}
    .pire-btn a {margin-top:5px;}

    .checkout-form label 
    {
        display: block;
        margin-bottom: 3px;
        width: auto;
    }
    .checkout-form input[type='text'], .checkout-form input[type='tel'], .checkout-form textarea 
    {
        width: calc(100% - 12px);
    }
    #footer .wp40, #footer .wp20
    {
        width: 100%;
        float: none;
    }
    .tamtinh .tt
    {
        margin-top: 30px;
    }
    #da-slider
    {
        height: 200px !important;
    }
    #main-nav
    {        
        background: #000;
    }

    .logo 
    {
        text-align: center;
    }
    .logo img 
    {
        width: 120px;
    }
    .slogan, .form-search
    {
        margin-top: 15px;   
    }
    .form-search
    {
        margin-bottom: 20px;
    }
    .desktop
    {
        display: none !important;
    }
    .mobile
    {
        display: block !important;
    }
    .tencty
    {
        font-size: 14px;
    }
    .car-item .wp10
    {
        width: 15%;
    }
    .car-item .wp10.gia-wp
    {
        width: 30%;
    }
    .car-item .wp30
    {
        width: 50%;
    }
    .tamtinh .wp50
    {
        width: 100%;
        float: none;
    }
    .icon_delete a
    {
        background: none !important
    }
}
/**
 * [media description]
 * @param  {[type]} max-width: 767px         [description]
 * @return {[type]}            [description]
 */
@media (max-width: 567px) {
    .pro-list .pro {width: 100%;}
    .search select {display: none}

    .view-block {width: 100%;}
    .large_img {width: 100%}
    .checkout_box .item img {width: 100%;margin-right: 0 !important;}
    
    .list-sp .pro-list .pro {
        width: calc((100% - 40px)/2);
    }
    .form-loc .wp20, .form-loc .wp30, .form-loc .wp10
    {
        width: 100%;
        margin-top: 10px;
        text-align: left;
    }
    .form-loc .field-f .wp30
    {
        width: 30%;
    }
    .baogia_img {
        width: 35px;
        float: left;
    }
    .text-bg {
     width: calc((100% - 35px));
     float: left;
     font-size: 14px;
    }
    .list_baogia li a {
        margin: 0;
        padding: 20px 5px;     
    }
}
/**
 * [media description]
 * @param  {[type]} max-width: 413px         [description]
 * @return {[type]}            [description]
 */
@media (max-width: 413px) {
    .qc {display: none}
    .contact label {width: 100%;margin-bottom: 3px}
    .contact input[type="text"],.contact input[type="email"],.contact input[type="tel"], .contact textarea {
        width: calc(100% - 12px);
    }
    .navigation {display: none}
    .googlemap {display: none}

    .checkout-right {display: none}
    .checkout-left {width: 100%;}
    .pro-list .pro .ma
    {
        display: none;
    }
    .pro-list .pro img, .list .pro img {
        height: auto;
    }
    .pire h4
    {
        margin-top: 10px;
    }
    #da-slider
    {
        height: 130px !important;
    }
    .pire-btn a {font-size: 14px;}
}
/**
 * [media description]
 * @param  {[type]} max-width: 319px         [description]
 * @return {[type]}            [description]
 */
@media (max-width: 319px) {

}

/* // ------------------------------------- */

/**
 * [media description]
 * @param  {[type]} min-width: 320px         [description]
 * @return {[type]}            [description]
 */
@media (min-width: 320px) {
    .pagewrap {width: 98%}
}
/**
 * [media description]
 * @param  {[type]} min-width: 414px         [description]
 * @return {[type]}            [description]
 */
@media (min-width: 414px) {

}
/**
 * [media description]
 * @param  {[type]} min-width: 600px         [description]
 * @return {[type]}            [description]
 */
@media (min-width: 568px) {

}
/**
 * [media description]
 * @param  {[type]} min-width: 768px         [description]
 * @return {[type]}            [description]
 */
@media (min-width: 768px) {
    .pagewrap {width: 750px;}
}
/**
 * [media description]
 * @param  {[type]} min-width: 992px         [description]
 * @return {[type]}            [description]
 */
@media (min-width: 992px) {
    .pagewrap {width: 970px;}
}
/**
 * [media description]
 * @param  {[type]} min-width: 1200px        [description]
 * @return {[type]}            [description]
 */
@media (min-width: 1200px) {
    .container {width: 1170px;}
    .tempBreadcrumb 
    {
        margin-bottom: 30px;
    }
    .col-md-1 {
      width: 8.33333333%;
    }
    .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
        float: left;
    }
    .col-md-2 {
        width: 16.66666667%;
    }
    .box-full .col-sm-2
    {
        padding: 5px;
    }
   .box-full .product-list .productLoopItem
   {
    margin-top: 0;
   }
    .col-md-3 {
        width: 25%;
    }
    .phobien .col-md-3 , .danhmuc_sp .col-md-3
    {
        padding: 0;
    }
    .sp_moive .col-md-2, .sp_danhrieng .col-md-2
    {
        padding: 5px;
    }
    .product-list .phobien .row_small .productLoopItem .product-name {
        height: 63px;
        max-height: 63px;
    }
    .mobile 
    {
        display: none !important;
    }
    #main-nav ul li ul li 
    {
        position: relative;
    } 
    #main-nav ul li:hover ul
    {
        display: block;
    } 
    #main-nav ul li:hover ul ul 
    {
        display: none;
    }
    #main-nav ul ul li 
    {
        display: block;
    } 
    #main-nav ul ul ul 
    {
        position: absolute;
        left: 100%;
        top:0;
        border-left: 1px solid #fff;
        display: none;
    }
    #main-nav ul ul li:hover ul
    {
        display: block;
    } 
    .table tr td:first-child
    {
        width: 25%;
        text-align: center;
        padding-top: 10px;
    }
    .table img 
    {
        width: 120px;
        margin-top: 10px;
        margin: auto;
    }

}