/* Responsive styles
================================================== */

/* Large Devices, Wide Screens */

@media (min-width: 1200px) {
    /* Header */
    .navbar-nav li:hover .dropdown-menu {
        display: block;
    }

    .navbar-collapse {
        padding-right: 0;
    }

    .nav-style-boxed .navbar-collapse {
        padding-left: 15px;
    }

    .header.header-menu .mega-menu-content {
        min-width: 1095px;
        margin-left: -27px;
    }
}

@media (min-width: 1400px) and (max-width:1600px) {
    #menu-main {
        background-size: 10% !important;
    }
}

@media (min-width: 1200px) and (max-width:1380px) {
    #menu-main, .main {
        min-height: 450px;
        _background: url(/images/so-bg.png) no-repeat top left !important;
        background-size: 12% !important;
        sbackground-position: top left !important;
    }

    .container-home {
        min-height: 400px;
        _background: url(/images/img_right.png) no-repeat top right !important;
        background-size: 50% !important;
        padding-left: 9rem !important;
        background-position: top right !important;
    }

    .text-uppercase {
        font-size: 2rem !important;
        padding-top: 15px !important;
    }
}
/* Medium Devices, Desktops */

@media (min-width: 992px) and (max-width:1199px) {
    /* Header */
    .navbar-nav li:hover .dropdown-menu {
        display: block;
    }

    ul.navbar-nav > li {
        padding: 0 6px;
    }

        ul.navbar-nav > li > a {
            padding: 0px;
        }

        ul.navbar-nav > li > a,
        .dropdown-menu li a {
            font-size: 12px;
        }

    .header.header-menu .mega-menu-content {
        min-width: 1095px;
        margin-left: -11px;
    }

    .featured-slider .item {
        min-height: 473px;
    }
    /* Projects */
    .project-item-title {
        font-size: 18px;
    }
    /* Clients */
    .clients-logo {
        margin-bottom: 20px;
    }
    /* Subscribe */
    .newsletter-form input {
        min-width: 340px;
    }
    /* Action box */
    .action-box-text {
        font-size: 13px;
    }
    /* Footer */
    .footer-social ul li {
        margin: 0 3px 0 0;
    }

    .footer-menu {
        float: none;
    }

    #back-to-top.affix {
        bottom: 35px;
    }

    #back-to-top {
        right: 15px;
    }

    .mega-menu-content {
        max-width: 940px;
    }
}

@media (min-width: 1024px) and (max-width:1199px) {
    #menu-main {
        min-height: 450px;
        _background: url(/images/so-bg.png) no-repeat top left !important;
        background-size: 12% !important;
        background-position: top left !important;
    }

    .container-home {
        min-height: 400px;
        _background: url(/images/img_right.png) no-repeat top right !important;
        background-size: 50% !important;
        padding-left: 9rem !important;
        background-position: top right !important;
    }

    .text-uppercase {
        font-size: 2rem !important;
        padding-top: 15px !important;
    }

    ul.navbar-nav > li {
        padding: 0;
    }

    #question-questions {
        height: auto !important;
    }
}
/* Small Devices, Tablets */
@media (min-width: 768px) and (max-width: 800px) {

    /*homepage*/
    header img {
        float: right;
    }

    .navbar {
        top: -70px;
    }

    ul.navbar-nav > li {
        padding: 10px 0;
        border-bottom: 1px solid #fff;
    }

    ul.navbar-nav li a {
        border-top: none !important;
    }

    .navbar-light .navbar-nav .nav-link {
        border-right: 0;
    }

    ul.navbar-nav > li.active, ul.navbar-nav > li:hover {
        background-image: none;
    }

    .text-uppercase {
        font-size: 1.8rem !important;
        padding-top: 0px !important;
    }

    #menu-main {
        background: #fff !important;
        /*height: 510px;*/
    }

    .container-home {
        _background: url(/images/img_right.png) no-repeat top right !important;
        background-size: 50% !important;
        background-position: top right !important;
    }

    .home-text-1 {
        position: relative;
        top: 0px;
    }

    .button-group {
        position: relative;
        top: 0px;
        margin: 0 auto;
        text-align: center;
    }

    .pl-5, .px-5 {
        padding-left: 1rem !important;
    }

    /*Cau hoi*/
    .main {
        background: #fff !important;
    }

    .title-question-1 {
        text-align: center;
        border-right: none;
        border-bottom: 1px solid #fff;
    }

    #question-answer a {
        margin-bottom: 10px;
        padding: 5px 15px !important;
    }

    .question {
        min-height: 100% !important;
    }

        .question .offset-md-3 {
            display: flex !important;
            max-width: 100% !important;
        }

    .offset-2 {
        margin-left: 0;
    }
    /*ketqua*/
    .bg-section .offset-3 {
        margin-left: 0px !important;
    }

    .bg-section .mr-5 {
        margin-right: 0px !important;
    }

    #question-questions {
        height: auto !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    /* top info */
    ul.top-info li {
        padding-right: 12px;
    }
    /* Header */
    .navbar-fixed {
        position: relative;
        animation: none;
        box-shadow: none;
    }

    .logo {
        padding: 13px 0;
    }

        .logo img {
            height: 40px;
        }
    /* Navigation breakpoint */
    .navbar-toggle {
        display: block;
        z-index: 1;
    }

    .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    }

        .navbar-collapse.collapse.show {
            display: block;
        }

    ul.navbar-nav {
        float: none !important;
        margin-top: 7.5px;
    }

        ul.navbar-nav > li {
            float: none;
            display: block;
        }

    .collapse.in {
        display: block !important;
    }
        .container-home {
        _background: url(/images/img_right.png) no-repeat top right !important;
        background-size: 50% !important;
        background-position: top right !important;
    }
    .navbar-collapse.in {
        overflow-y: auto;
    }

    ul.nav li.dropdown:hover ul.dropdown-menu {
        display: none;
    }

    ul.nav li.dropdown.open ul.dropdown-menu {
        display: block;
    }

    .navbar-nav .open .dropdown-menu {
        position: static;
        float: none;
        width: auto;
        margin-top: 0;
        background-color: transparent;
        border: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }
    /* Navigation */
    .navbar-collapse {
        background: none;
        width: 100%;
    }

    ul.navbar-nav > li:hover > a:after,
    ul.navbar-nav > li.active > a:after {
        content: '';
    }

    ul.navbar-nav > li > a:before {
        border-bottom: 0;
    }

    .navbar-nav .open .dropdown-menu > li {
        padding-left: 0;
    }

        .navbar-nav .open .dropdown-menu > li > a,
        .navbar-nav .open .dropdown-menu .dropdown-header {
            padding: 5px 15px 10px 10px;
        }

    ul.navbar-nav > li,
    .nav-style-boxed ul.navbar-nav > li {
        display: block;
    }

    .navbar-nav .open .dropdown-menu > li > a {
        line-height: 30px;
    }

    ul.navbar-nav > li.nav-search,
    ul.navbar-nav > li.header-get-a-quote {
        display: none;
    }

    ul.navbar-nav {
        padding: 0 0 10px;
    }

        ul.navbar-nav li {
            float: none;
        }

            ul.navbar-nav li a {
                line-height: normal !important;
                color: #333;
                border-top: 1px solid #f1f1f1 !important;
                border-bottom: 0;
                padding: 10px 0;
                display: block;
                min-width: 350px;
            }

        ul.navbar-nav .dropdown-menu {
            float: none;
            position: relative;
            border: 0;
            margin: 0;
            padding: 0;
        }

            ul.navbar-nav .dropdown-menu li a {
                padding-left: 20px !important;
            }

        ul.navbar-nav li.dropdown ul.dropdown-menu li.dropdown-submenu .dropdown-menu {
            left: 0;
            position: relative;
        }

            ul.navbar-nav li.dropdown ul.dropdown-menu li.dropdown-submenu .dropdown-menu a {
                padding-left: 50px;
            }

        ul.navbar-nav li.dropdown ul.dropdown-menu li.dropdown-submenu a i {
            margin-top: -22px;
        }

        ul.navbar-nav li.dropdown ul.dropdown-menu li.dropdown-submenu .dropdown-menu li a {
            padding-left: 35px !important;
        }

        ul.navbar-nav .dropdown-menu {
            box-shadow: none;
            border-top: 0;
            background: none;
        }

        ul.navbar-nav li a i,
        .dropdown-submenu > a:after {
            background: #f5f5f5;
            float: right;
            width: 36px;
            height: 28px;
            line-height: 28px;
            margin-top: -5px;
            text-align: center;
            color: #000;
        }

    .dropdown-submenu > a:after {
        margin-right: 0;
    }

    .navbar-nav > li > .dropdown-menu.mega-menu-content {
        display: none !important;
    }
    /* Featured area */
    .featured-post-area .pad-r {
        padding-right: 15px;
    }

    .featured-post-area .pad-l {
        padding-left: 15px;
    }
    /* Sidebar */
    .sidebar-right {
        margin-top: 50px;
    }

        .sidebar-right .widget {
            margin-left: 0;
        }

    .block.color-aqua,
    .block.color-violet {
        margin-top: 40px;
    }
    /* Footer */
    .footer-widget {
        display: inline-block;
        margin-bottom: 30px;
    }

    .newsletter-form input {
        width: 90%;
    }

    .footer-info-content {
        padding: 50px 100px 0;
    }

    #back-to-top.affix {
        bottom: 78px;
    }

    #question-questions {
        height: auto !important;
    }

}

/* Small Devices Potrait */

@media (max-width: 767px) {
    .boxed-layout .body-inner {
        margin: 0 auto;
    }
    /* Top bar */
    .ts-date {
        padding: 0;
        border-right: 0;
        display: block;
    }

    .top-bar {
        text-align: center;
    }

    .top-social {
        float: none;
        text-align: center;
        display: inline-block;
    }
    /* Header */
    .navbar-fixed {
        position: relative;
        animation: none;
        box-shadow: none;
    }

    /* Navigation breakpoint */
    .navbar-toggle {
        display: block;
        z-index: 1;
    }

    .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    }

        .navbar-collapse.collapse.show {
            display: block;
        }

        .navbar-collapse.collapse:after {
            display: block;
            content: "";
            clear: both;
        }

    .navbar-collapse,
    .site-nav-inner {
        background: none;
        width: 100%;
    }

    ul.navbar-nav > li:hover > a:after,
    ul.navbar-nav > li.active > a:after {
        content: '';
    }

    ul.navbar-nav > li > a:before {
        border-bottom: 0;
    }

    .navbar-nav .open .dropdown-menu > li > a,
    .navbar-nav .open .dropdown-menu .dropdown-header {
        padding: 10px 15px 10px 10px;
    }

    ul.navbar-nav > li {
        display: block;
    }

    .navbar-nav .open .dropdown-menu > li > a {
        line-height: 30px;
    }

    ul.navbar-nav > li.nav-search,
    ul.navbar-nav > li.header-get-a-quote {
        display: none;
    }

    ul.navbar-nav {
        width: 100%;
        padding: 0 0 10px;
    }

        ul.navbar-nav > li {
            float: none;
        }

        ul.navbar-nav li a {
            line-height: normal !important;
            color: #333;
            border-top: 1px solid #f1f1f1 !important;
            border-bottom: 0;
            padding: 10px 0;
            display: block;
        }

        ul.navbar-nav .dropdown-menu > li > a {
            padding-left: 15px;
        }

        ul.navbar-nav .dropdown-menu {
            float: none;
            position: relative;
            border: 0;
            margin: 0;
            padding: 0;
        }

        ul.navbar-nav li.dropdown ul.dropdown-menu li.dropdown-submenu .dropdown-menu {
            left: 0;
            position: relative;
        }

        ul.navbar-nav li.dropdown ul.dropdown-menu li.dropdown-submenu a i {
            margin-top: -22px;
        }

        ul.navbar-nav li.dropdown ul.dropdown-menu li.dropdown-submenu .dropdown-menu li a {
            padding-left: 20px;
        }

        ul.navbar-nav .dropdown-menu {
            box-shadow: none;
            border-top: 0;
            background: none;
            padding-left: 15px;
        }

        ul.navbar-nav li a i,
        .dropdown-submenu > a:after {
            background: #f5f5f5;
            color: #333;
            float: right;
            width: 36px;
            height: 28px;
            line-height: 28px;
            margin-top: -5px;
            text-align: center;
        }

    .dropdown-submenu > a:after {
        margin-right: 0;
    }

    .navbar-nav > li > .dropdown-menu.mega-menu-content {
        display: none !important;
    }

    .featured-slider .item {
        min-height: 250px;
    }

    .gap-40 {
        width: 100%;
    }
    /* Dart bg */
    .main-nav.dark-bg {
        margin-bottom: 20px;
    }

        .main-nav.dark-bg > .container > .row {
            padding: 0 20px;
        }

        .main-nav.dark-bg ul.navbar-nav > li.active,
        .main-nav.dark-bg ul.navbar-nav > li:hover {
            background: none;
        }

        .main-nav.dark-bg ul.navbar-nav li a {
            color: #fff;
        }
    /* Search */
    .nav-search {
        position: absolute;
        top: 15px;
        right: 20px;
    }

    .search-block {
        width: 220px;
    }

    .header.header-menu {
        position: relative;
        margin-bottom: 20px;
    }

    .search-area {
        position: absolute;
        right: 0;
        top: 50px;
    }
    /* Featured area */
    .featured-post-area .pad-r,
    .pad-r-small {
        padding-right: 15px;
        padding-right: 15px;
    }

    .featured-post-area .pad-l,
    .pad-l-small {
        padding-left: 15px;
    }

    .post-title {
        font-size: 18px;
        line-height: 26px;
    }
    /* Block */
    .block.color-orange .post-overaly-style.last {
        margin-top: 40px;
    }
    /* Sidebar */
    .sidebar-right {
        margin-top: 50px;
    }

        .sidebar-right .widget {
            margin-left: 0;
        }

    .block.color-aqua,
    .block.color-violet {
        margin-top: 40px;
    }

    .social-icon li a i {
        margin-bottom: 10px;
    }

    .post-block-style.post-float-half .post-thumb img {
        max-width: 100%;
        min-height: 100%;
        margin-bottom: 20px;
    }
    /* Footer */
    .footer-widget {
        display: inline-block;
        margin-bottom: 30px;
    }

    .newsletter-form input {
        width: 90%;
    }

    .footer-info-content {
        padding: 50px 20px 0;
    }

    .footer-social li a i {
        margin-bottom: 10px;
    }

    #back-to-top.affix {
        bottom: 78px;
    }
    /* Copyright */
    .copyright-info {
        text-align: center;
    }

    .footer-menu {
        float: none;
        text-align: center;
    }

        .footer-menu .nav {
            display: inline-block;
        }

    #back-to-top {
        bottom: 0;
        right: 20px;
    }
    /* Block title */
    .block-title {
        font-size: 11px;
    }

        .block-title > span {
            padding: 9px 10px;
        }

    .featured-tab .nav-tabs > li > a {
        font-size: 12px;
    }
    /* Category style */
    .category-style2 .post-thumb {
        margin-bottom: 20px;
    }

    .chu-highlight {
        width: 100%;
    }

    #question-time.clsmobile {
        padding: 0px 207px !important;
    }

    #question-questions-image {
        flex: 100%;
        max-width: 100%;
    }

        #question-questions-image img {
            max-width: 100% !important;
        }
    /*homepage*/
    header img {
        float: right;
    }

    .navbar {
        top: -70px;
    }

    ul.navbar-nav > li {
        padding: 10px 0;
        border-bottom: 1px solid #fff;
    }

    ul.navbar-nav li a {
        border-top: none !important;
    }

    .navbar-light .navbar-nav .nav-link {
        border-right: 0;
    }

    ul.navbar-nav > li.active, ul.navbar-nav > li:hover {
        background-image: none;
    }

    .text-uppercase {
        font-size: 2rem !important;
        padding-top: 0px !important;
    }

    #menu-main {
        background: #fff !important;
        /*height: 650px;*/
    }

    .container-home {
        _background: url(/images/img_right.png) no-repeat top right !important;
        background-size: contain !important;
        background-position: top right !important;
    }
        .containerInvoice {
     width:100%;
    }
    .home-text-1 {
        position: relative;
        top: 385px;
    }

    .button-group {
        position: relative;
        top: 375px;
        margin: 0 auto;
        text-align: center;
    }

    .pl-5, .px-5 {
        padding-left: 1rem !important;
    }

    /*Cau hoi*/
    .main {
        background: #fff !important;
    }

    .title-question-1 {
        text-align: center;
        border-right: none;
        border-bottom: 1px solid #fff;
    }

    #question-answer a {
        margin-bottom: 10px;
        padding: 5px 15px !important;
    }

    .question {
        min-height: 100% !important;
    }

        .question .offset-md-3 {
            display: flex !important;
            max-width: 100% !important;
        }

    .offset-2 {
        margin-left: 0;
    }

    #question-questions {
        height: auto !important;
    }
    /*ketqua*/
    .bg-section .offset-3 {
        margin-left: 0px !important;
    }

    .bg-section .mr-5 {
        margin-right: 0px !important;
    }
}

/* Extra Small Devices, Phones */

@media (max-width: 479px) {

    #question-time.clsmobile {
        padding: 0px 127px !important;
    }

    #question-questions-image {
        flex: 100%;
        max-width: 100%;
    }

        #question-questions-image img {
            max-width: 100% !important;
        }
    /*homepage*/
    header img {
        float: right;
    }

    .navbar {
        top: -70px;
    }

    ul.navbar-nav > li {
        padding: 10px 0;
        border-bottom: 1px solid #fff;
    }

    ul.navbar-nav li a {
        border-top: none !important;
    }

    .navbar-light .navbar-nav .nav-link {
        border-right: 0;
    }

    ul.navbar-nav > li.active, ul.navbar-nav > li:hover {
        background-image: none;
    }

    .text-uppercase {
        font-size: 1.8rem !important;
        padding-top: 0px !important;
    }

    #menu-main {
        background: #fff !important;
        /*height: 100%;*/
    }
    .dx-designer {
        height:80%!important;
    }
    #divReport {
        height:60%;
    }
    .container-home {
        _background: url(/images/img_right.png) no-repeat top right !important;
        background-size: contain !important;
        background-position: top right !important;
    }

    .containerInvoice {
        width: 100%;
    }

    .home-text-1 {
        position: relative;
        top: 220px;
    }

    .button-group {
        position: relative;
        top: 230px;
        margin: 0 auto;
        text-align: center;
    }

    .pl-5, .px-5 {
        padding-left: 1rem !important;
    }

    /*Cau hoi*/
    .main {
        background: #fff !important;
    }

    .title-question-1 {
        text-align: center;
        border-right: none;
        border-bottom: 1px solid #fff;
    }

    #question-answer a {
        margin-bottom: 10px;
        padding: 5px 15px !important;
    }

    .question {
        min-height: 100% !important;
    }

        .question .offset-md-3 {
            display: flex !important;
            max-width: 100% !important;
        }

    .offset-2 {
        margin-left: 0;
    }

    #question-questions {
        height: auto !important;
    }
}

/* Custom, iPhone Retina */

@media (min-width: 320px) and (max-width: 340px) {

    .text-uppercase {
        font-size: 1.6rem !important;
        padding-top: 0px !important;
    }

    .containerInvoice {
        width: 100%;
    }

    .home-text-1 {
        top: 160px;
    }

    .button-group {
        top: 160px;
    }

    #menu-main {
        /*height: 800px;*/
    }
}
