body .container, body .span12, body .row { margin: auto; max-width: 1026px !important; }
.container-fluid { margin: 0px; padding: 0px !important; }
/*Tuấn Anh chỉnh sửa CSS ngày 15/03/2018*/
@font-face { font-family: 'Bebas'; font-style: normal; font-weight: normal; src: url('../fonts/UTMBebas.woff2') format('woff2'), url('../fonts/UTMBebas.woff') format('woff'), url('../fonts/UTMBebas.svg#UTMBebas') format('svg'); }
.header { background: #fff }
.quick-menu li a { color: #000; font-weight: bold; text-transform: uppercase; }
.quick-menu li { padding-right: 0 }
.quick-menu li a:after { color: #000; content: "|"; display: inline-block; margin-left: 15px; }
.quick-menu li:last-child a:after { display: none }
.main-navigationtop { border-bottom: 1px solid #e9e9e9; box-shadow: -1px 0 5px #e9e9e9; margin-bottom: 7px; padding-bottom: 7px; }
.search-box { border: 1px solid #d4d6d9; margin-top: 25px; padding: 5px; }
.search-box .search-input { box-sizing: border-box; float: left; min-width: auto; outline: none; width: calc(100% - 96px); }
.search-box .search-button { border-radius: 3px; float: right; outline: none; }
.logo-text, .logo-text a { color: #003864; font-family: Bebas }
.logo-text h3 { font-size: 30px }
.logo-text h4 { font-size: 23px }
.logo-text { padding-top: 12px }
.menumain { background: #004370 }
.orange-line { display: none }
.trangchu a { font-size: 17px !important }
#linkwebsite { margin-top: 15px }
#linkwebsite .title { border-bottom: solid thin #dfdfdf; color: #4c4c4c; display: block; font-family: Times New Roman; font-size: 24px; margin-bottom: 10px; padding-bottom: 5px; }
#linkwebsite .swiper-slide { float: left; margin-bottom: 10px; margin-right: 20px; width: calc((100% - 20px) / 2); }
#linkwebsite .swiper-slide:nth-child(2n) { margin-right: 0 }
#linkwebsite .swiper-slide:last-child { margin-bottom: 0 }
.slidebanner { float: left; width: 85%; }
.menumain, .list_afterbaner { background: #005180 }
.list_afterbaner { float: right; height: auto; height: 345px; margin: 0; width: 15%; }
.list_afterbaner ul { margin: 0; padding: 0; }
.list_afterbaner ul li { box-sizing: border-box; display: table; height: calc(400px / 7); padding: 0 7px; position: relative; width: 100%; }
.list_afterbaner ul li .item { -moz-transform: translateY(-50%); position: absolute; top: 50%; transform: translateY(-50%); width: 100%; }
.list_afterbaner ul li img { -moz-transform: translateY(-50%); height: auto; left: 0; margin: 0; position: absolute; top: 50%; transform: translateY(-50%); width: 35px !important; }
.list_afterbaner ul li a { box-sizing: border-box; float: right; margin: 0; margin-top: 3px; padding-left: 7px; text-align: left; width: calc(100% - 35px); }
.footer { background: #0067b3 url(footer.png) no-repeat bottom center }
.footer-container .big-logo { border: none; padding: 0; }
.footer-container .big-logo img { width: 100% }
.footer-address { color: #fff; font-size: 13px }
.footleft { margin-top: 40px }
.footer-info .title { border-bottom: 1px solid #dadada; font-weight: bold; padding-bottom: 5px; position: relative }
.footer-info .title:after { background: red; bottom: -1px; content: ""; height: 3px; left: 0; position: absolute; width: 70px; }
.footer-info { font-size: 13px; line-height: 21px }
.footer-info ul li { margin-bottom: 3px }
/*End Tuấn Anh chỉnh sửa CSS ngày 15/03/2018*/
#dongsk { overflow: hidden; }
#dongsk .row { align-items: center; display: flex; height: 40px; overflow: hidden; }
#dongsk .row .datetime { padding-right: 5px; text-align: left; white-space: nowrap; width: 230px; }
#dongsk .row .datetime p { margin: 0 }
#dongsk .row .datetime i { margin-right: 5px; }
#dongsk .row ul { flex: 1; list-style: none; margin: 0; opacity: 1; overflow: hidden; padding: 7px 0; }
#dongsk .row ul li { display: inline-block; margin-right: 20px; }
#dongsk .row ul li:hover a, #dongsk .row ul li:hover i { color: #005180; }
#dongsk .row ul li a { align-items: center; color: #f50d0d; display: flex; }
#dongsk .row ul li i { font-size: 10px; margin-right: 3px; margin-top: -2px; }
#headSite { align-items: center; }
#headSite .search-box { padding: 5px 10px; }
#headSite .search-box input { padding: 0 }
#headSite .search-button { font-size: 13px; }
.item-news .thumb img { max-height: 100%; max-width: 100%; object-fit: cover }
#searchRes { display: none }
#overlay { display: none; position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: rgba(0, 0, 0, 0.7); z-index: 889;}
.openSub, .openList {
    display: none
}
/* Large Devices, Wide Screens */
@media only screen and (max-width: 1200px) {
    .searchPC { display: none }
     
    #searchRes {
        display: block;
        margin-top: 20px;
        width: calc(100% - 40px);
        margin: 10px 20px;
    }
    #headSite {
        align-items: center;
        display: flex;
        padding: 0 20px;
    }

    #headSite .logoSite {
        flex: 1;
    }

    #headSite .logoSite > div {
        align-items: center;
        display: flex;
        flex-wrap: nowrap;
        justify-content: flex-start;
    }

    #headSite .logoSite > div .logo {
        margin: 0
    }

    #headSite .logoSite > div .logo img {
        max-height: none;
        max-width: 100%;
    }

    #headSite .logoSite > div .logo-text {
        padding: 0;
        text-align: left;
    }
    #headSite .openList {
        display: block;
    }
        #headSite .openList a {
            display: flex;
            width: 30px;
            height: 20px;
            margin-left: 20px;
            flex-direction: column;
            justify-content: space-between;
        }

        #headSite .openList hr {
            -moz-transition: 0.5s all ease-in-out;
            background: #000;
            border: none;
            height: 2px;
            margin-top: 0;
            margin-bottom: 0;
            transition: 0.5s all ease-in-out;
            width: 100%;    
        }

        #headSite .openList.ac {
            position: relative;
           /* top: 50px;
            right: 20px;*/
            z-index: 890;
        }

            #headSite .openList.ac hr:nth-child(2) {
                opacity: 0;
            }

            #headSite .openList.ac hr:nth-child(1) {
                -moz-transform: rotate(135deg) translateX(4px) translateY(-6px);
                background: #fff;
                border-color: #fff;
                transform: rotate(135deg) translateX(5px) translateY(-7px);
            }

            #headSite .openList.ac hr:nth-child(3) {
                -moz-transform: rotate(-135deg) translateX(6px) translateY(8px);
                background: #fff;
                border-color: #fff;
                transform: rotate(-135deg) translateX(5px) translateY(7px);
            }

 
    #main-navigation {
        position: static;
        padding: 0.3125rem 0;
        display: block !important;
    }

    #main-navigation ul { 
        position: fixed;
        width: 80vw!important;
        height: 100vh;
        z-index: 890!important;
        background: #0081ce;
        top: 0;
        left: -100%;
        transition: 0.3s all ease-in-out;
        display: block;
        padding: 1.25rem 0;
        flex-direction: column;
        justify-content: flex-start !important;
    }
        #main-navigation ul li.trangchu .text {
            display: block !important; font-size: 12px;
        }
        
        #main-navigation ul li.trangchu i{
            display: none;
        }

    #main-navigation ul .openSub {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 3.125rem;
        font-size: 1.25rem;
    }

    #main-navigation ul .openSub.ac i:before {
        content: "\f106";
    }

    #main-navigation ul li {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }

    #main-navigation ul li a {
        display: flex;
        padding: 0.625rem 1.375rem;
        align-items: center;
        justify-content: flex-start;
        flex-direction: row;
        border-right: none;
        flex: 1;
    }

    #main-navigation ul li a:after {
        display: none;
    }

    #main-navigation ul li a span.icon {
        width: 1.5625rem;
        display: inline-block;
        margin: 0;
        margin-right: 0.625rem;
    }

    #main-navigation ul li a span.icon img {
        display: block;
        margin: auto;
    }

    #main-navigation ul li:hover > ul {
        display: none;
    }

    #main-navigation ul li:hover > a {
        background: transparent;
        color: #fff;
    }

    #main-navigation ul li ul {
        padding: 0;
        padding-left: 1.25rem;
        transition: none;
        height: auto;
        display: none;
        width: 100%;
        position: static;
        background: #0081ce;
    }

    #main-navigation ul li ul li a {
        padding: 0.625rem;
        white-space: normal;
    }

    #main-navigation ul li:last-child {
        display: block !important;
    }

    #main-navigation ul li:last-child a {
        align-items: baseline;
    }

    #main-navigation ul li:last-child a i {
        font-size: 1.25rem;
    }

    #main-navigation a {
        text-align: left;
    }

    #main-navigation .dbTablet-l {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-right: 0.625rem;
        align-items: center;
    }

    #main-navigation.ac ul {
        left: 0;
    }
}
/* Medium Devices, Desktops */
@media only screen and (max-width: 992px) {
    #menu .btn-toggle-left { margin-left: 0px !important; }
    .slidebanner, .gallery-border { height: auto; width: 100%; }
    .footleft { margin-top: 0 }
    .footer-address { margin-top: 40px }
    .center-menu-box { width: 100% }
    #panel { -moz-transform: none !important; transform: none !important; }
    .list_afterbaner ul li img, .list_afterbaner ul li .item { -moz-transform: none; position: static; transform: none; width: auto !important; }
    .list_afterbaner ul li img { height: 35px }
    .list_afterbaner ul li { float: left; width: 50%; }
    .list_afterbaner ul li:nth-child(2n + 1) { clear: both }
    .center-menu-box ul li { padding: 10px 5px; text-align: left; }
    
}
/* Small Devices, Tablets */
@media only screen and (max-width: 768px) {
    .search-box { float: none; margin: auto; width: 366px; }
    .logo { float: none; margin: auto; padding-left: 0px; width: 107px; }
    .swiper2 { padding-left: 5px; padding-right: 5px; }
    .logo-text { float: none; padding: 15px 0px 0px; text-align: center; }
    .logo-text h3 { font-size: 30px; }
    .logo-text h4 { font-size: 23px; }
    .search-box { margin-bottom: 10px; }
    .footer-cat { float: none; margin-top: 15px; text-align: left; }
    .center-menu-box { height: auto; margin: 0px; padding-top: 0px; text-align: center; }
    .center-menu-box ul { padding-left: 0px; }
    .center-menu-box img { width: 25px; }
    .center-menu-box ul li { border-top: dotted thin #1e89c7; display: block; height: auto; padding: 15px 0px 15px 0px; text-align: center; }
    .center-menu-box ul li a { float: none; font-size: 12px; margin: 0px; text-align: center; }
    .center-menu-box ul li a br { display: none; margin-left: 5px; }
    .menumain .navbar-nav { margin: 0 }
    .trangchu { display: none !important }
    .footer-container .big-logo img { display: block; margin: auto; width: auto; }
    .footer-address { margin-top: 10px; padding: 0 }
    .center-menu-box ul li { padding: 10px; }
    .list_afterbaner ul li a { padding-left: 5px }
    .center-menu-box ul li:nth-child(3), .center-menu-box ul li:nth-child(4), .center-menu-box ul li:nth-child(5) { width: 33%; }
    .center-menu-box ul li:nth-child(5) { clear: none; }   
}
/* Extra Small Devices, Phones */
@media only screen and (max-width: 480px) {
    .view-cat { display: none; }
    .list_afterbaner ul li img { height: 21px }
    .center-menu-box ul li { padding: 10px 5px; text-align: left; }
    #headSite .logoSite { width: 100%; margin: 10px 0}
    #headSite .logoSite .logo {width: 100px}
    #headSite { flex-wrap: wrap; padding: 0 10px; justify-content: space-between}
    .logo-text h3 {font-size: 27px}
    .logo-text h4 { font-size: 20px;}
}
/* Custom, iPhone Retina */
@media only screen and (max-width: 320px) {
    .product-block .product-thumb .sale { position: absolute; right: 5%; top: 5%; }
    .search-box { width: 100% }
}