/*==========  Mobile First Method  ==========*/
/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {
}

/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {
}

@media only screen and (min-width : 568px) {
}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {
}

@media only screen and (min-width : 800px) {
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 1024px) {
}

@media only screen and (min-width : 1400px) {
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
}

@media only screen and (max-width: 1100px) {
    .container {
        width: 100%
    }

    .main-nav>ul>li> a {
        font-size: 1.5rem;
    }

    .book-box .tit {
        margin-right: 7px;
    }

    .about-bg {
        background-position: right 80% top;
    }

    .book-box .btn {
        margin-left: 5px;
    }

    .book-box .form-group.chonphong {
        width: 18%;
    }

    .khunggia .btn {
        position: relative;
        margin: 10px 0;
    }
}

@media only screen and (max-width: 1023px) {
    #w_menu_mobile,#wrap_menu_res {
        display: block;
    }

    .nav-bg {
        display: none;
    }

    .index header {
        position: relative !important;
        background: #4e4a49;
        padding-bottom: 10px;
    }
header {
        position: relative !important;
        
        padding-bottom: 10px;
    }
    .logo-banner:before {
        width: 150px;
        height: unset;
    }

    .book-box .tit {
        display: block;
        float: none;
        text-align: left;
        margin-bottom: 10px;
    }

    .book-box .btn {
    }

    .book-box .tit+ .form-group {
        clear: left;
    }

    .book-box .form-group.songuoi {
        width: 15%;
    }

    .xemthem a {
        font-size: 2rem;
    }

    .dichvu-nb .imgsp {
        width: 45%;
        min-height: 350px;
    }

    .dichvu-nb .info {
        width: 53%;
    }

    .about #main .container, .dichvu #main .container {
        width: 100%;
    }

    .dichvu-page:before {
        display: none;
    }

    .main-tit {
    }

    .fixpanel {
        position: relative;
        top: unset;
    }

    #wrapper_main {
        overflow: hidden;
    }

    .trainghiem-item figure {
        height: 230px;
    }

    .hinh-video-bg:after {
        display: none;
    }

    .pr-box figure img {
        height: 550px;
    }
        header.fixed{
        position: relative !important;
    }
}

@media screen and (min-width: 500px) and (max-width: 1000px) {
}

@media only screen and (max-width: 767px) {
}

@media only screen and (max-width: 670px) {
}

@media only screen and (max-width : 667px) {
    .hotline {
        display: none;
    }

    .book-box .form-group {
        float: none;
        width: 100% !important;
        margin-bottom: 10px;
    }

    .dichvu-nb .imgsp,.dichvu-nb .info {
        float: none !important;
        width: 100%;
        min-height: 250px;
    }

    .thuvien-left,.thuvien-right,.sukien-bg,.tinnb-bg,.sukien-item {
        float: none;
        width: 100%
    }

    .sukien-item {
        margin-bottom: 20px;
    }

    .sukien-first .info {
        position: relative;
    }

    .sukien-first figure {
        height: 200px;
    }

    .thuvien-item {
        height: 200px;
    }

    .logo-banner {
        width: 20%;
    }

    .about-bg .desc {
        max-width: 100%;
    }

    .idx-tit {
        background-position: left bottom;
    }

    .box-price .cur-price {
        font-size: 1.6rem;
    }

    .ngoaingu-it {
        width: 50%;
    }

    .dichvu-item figure {
        width: 100%;
        float: none;
    }

    .dichvu-item .info {
        float: none;
        width: 100%;
    }

    .dichvu-nb:nth-child(even) .info:before {
        display: none;
    }
   
}

@media only screen and (max-width: 500px) {
}

@media only screen and (max-width : 479px) {
    .ngoaingu-it {
        width: 100%;
    }
}

@media only screen and (max-width: 350px) {
}

@media only screen and (max-width: 330px) {
}
