@media screen and (max-width:1170px) {
    .container {
        width: 850px
    }

    .banner-header img {
        width: 540px;
    }

    .main-header .container {
        align-content: space-around;
    }

    .header-fixed .header-bottom {
        width: 850px
    }

    .close-nav,
    .header-hotline,
    .show-nav {
        display: block
    }

    .header-hotline {
        color: #fff;
        padding-right: 0;
        font-size: 20px;
        font-weight: 700
    }

    .close-nav {
        position: absolute;
        top: 0;
        left: 0;
        height: 40px;
        line-height: 40px;
        color: #fff;
        width: 100%;
        box-sizing: border-box;
        padding: 0 10px;
        background-color: #002e92;
        cursor: pointer
    }

    .close-nav i {
        margin-right: 10px
    }

    .main-nav {
        position: fixed;
        top: 0;
        left: -250px;
        width: 250px;
        height: 100%;
        z-index: 10000;
        background-color: #333;
        box-shadow: 3px 3px 0 rgba(0, 0, 0, .1);
        opacity: 0;
        visibility: hidden;
        transition: all ease-in-out .3s
    }

    .main-nav-active {
        left: 0;
        opacity: 1;
        visibility: visible
    }

    .main-nav-inner {
        position: absolute;
        top: 40px;
        left: 0;
        width: 100%;
        height: calc(100% - 40px);
        overflow-y: auto
    }

    .main-nav-inner>ul>li {
        float: none;
        width: 100%;
        height: auto !important;
        margin-right: 0 !important;
        border-top: 1px solid #3f3d3d;
        border-bottom: 1px solid #2c2b2b
    }

    .main-nav-inner>ul>li:first-child {
        border-top: none
    }

    .main-nav-inner>ul>li:last-child {
        border-bottom: none
    }

    .main-nav-inner>ul>li>a {
        line-height: 40px !important;
        margin: 0 !important;
        border-radius: 0;
        color: #fff;
        font-size: 15px;
        font-weight: 400;
        padding: 0 10px;
        padding-left: 25px;
        position: relative
    }

    .main-nav-inner>ul>li>a:before {
        position: absolute;
        font-family: fontawesome;
        content: "\f105";
        left: 10px;
        color: #f17e18;
        top: -1px
    }

    .main-nav-inner>ul>li ul {
        position: relative;
        top: 100%;
        opacity: 1;
        visibility: visible;
        width: 100%;
        box-shadow: none;
        line-height: 20px;
        background-color: #f9f9f9
    }

    .main-nav-inner>ul>li ul li {
        border: none
    }

    .main-nav-inner>ul>li ul li:nth-child(n+2) {
        border-top: 1px solid #eee
    }

    .main-nav-inner>ul>li ul li a {
        white-space: normal;
        padding: 9px 10px;
        padding-left: 25px;
        color: #333
    }

    .main-nav-inner>ul>li ul li a:hover {
        background-color: transparent;
        color: #333
    }

    .main-nav-inner>ul>li a:hover,
    .main-nav-inner>ul>li ul li a:hover,
    .main-nav-inner>ul>li.current-menu-item>a,
    .main-nav-inner>ul>li:hover>a {
        background-color: transparent !important
    }

    .featured-home-item {
        height: 300px
    }

    .featured-btn {
        z-index: 1000;
        width: 20px;
        height: 30px;
        line-height: 30px;
        margin-top: -10px;
        font-size: 20px
    }

    .du-an-item {
        width: calc((100% - 20px)/ 2);
        margin-right: 0
    }

    .du-an-item:nth-child(3n+3) {
        float: left;
        margin-right: 0
    }

    .du-an-item:nth-child(2n+2) {
        float: right;
        margin-right: 0
    }

    .du-an-item:nth-child(n+3) {
        margin-top: 20px
    }

    .du-an-item-thumb {
        height: 150px
    }

    .footer-content-left,
    .footer-content-right {
        width: calc((100% - 30px)/ 2)
    }

    .slide-banner .swiper-slide img {
        width: 100%;
        height: 400px;
        object-fit: cover;
    }
}

@media screen and (max-width:1170px) {
    .modal-content {
        position: relative;
        top: 0;
        left: 0;
        max-width: 100%;
        max-height: 100%;
        margin: 0 4%;
    }

    .modal-content img{
        max-width: 100%;
        width: 85%;
        height: 85%;
        margin: 0px auto;
        padding: 0px;
        border-width: initial; 
        border-style: none; 
        display: block; 
        outline: 0px;
    }
}

@media screen and (max-width:870px) {
    .container {
        width: 515px
    }

    .logo {
        width: 100%
    }

    .logo a img {
        margin: 0 auto
    }

    .banner-header {
        display: none
    }

    .header-fixed .header-bottom {
        width: 515px
    }

    .featured-home-item {
        height: 200px
    }

    .primary,
    .sidebar {
        width: 100%
    }

    .sidebar {
        margin-top: 20px
    }

    .block-tax-item:nth-child(n+2) {
        margin-top: 20px;
        padding-top: 0;
        border-top: none
    }

    .du-an-item {
        width: calc((100% - 10px)/ 2);
        margin-right: 0
    }

    .du-an-item:nth-child(2n+2) {
        float: right;
        margin-right: 0
    }

    .du-an-item:nth-child(n+3) {
        margin-top: 20px
    }

    .du-an-item-thumb {
        height: 130px
    }

    .sidebar-fix {
        margin-top: 0;
        display: none
    }

    .doi-tac-title span:after,
    .doi-tac-title span:before {
        display: none
    }

    .footer {
        background: #2c2b3b
    }

    .footer-content-left {
        width: 100%
    }

    .footer-content-right {
        display: block;
        width: 100%;
    }

    .footer .container{
        display: block;
    }

    .slide-banner .swiper-slide img {
        width: 100%;
        //height: 300px;
        object-fit: cover;
    }

    .block-tax-item-head .icon-form .search-form {
        display: none;
    }

    .block-tax-item-head{
        display: grid;
        text-align: center;
    }

}
@media screen and (max-width: 590px) {
    .header-top-left{
        display: none;
    }

    .header-top-right .search-input {
        width: 150px !important;
        transition: all ease-in-out .3s
    }

    .header-top-right .search-input:focus {
        width: 200px !important;
    }
.modal-content {
        position: relative;
        top: 0;
        left: 0;
        max-width: 100%;
        max-height: 100%;
        margin: 0 0;
    }

    .modal-content img{
        max-width: 100%;
        width: 95%;
        height: 95%;
        margin: 0px auto;
        padding: 0px;
        border-width: initial; 
        border-style: none; 
        display: block; 
        outline: 0px;
    }
}
@media screen and (max-width:1170px) {
    .container {
        width: 96%
    }

    .header-top-left {
        font-size: 13px
    }

    .header-top-left ul li a:first-child {
        white-space: nowrap; width: 160px; overflow: hidden; text-overflow: ellipsis;
    }

    .header-top-left ul li:nth-child(n+2) {
        margin-left: 8px
    }

    .header-top-left ul li:nth-child(2) {
        display: none
    }

    /* .search-form {
        position: absolute;
        top: 0;
        right: 0
    } */

    .header-top-right .search-input {
        width: 200px;
        transition: all ease-in-out .3s
    }

    .header-top-right .search-input:focus {
        width: 300px
    }

    .header-fixed .header-bottom {
        width: 100%
    }

    .header-fixed .header-bottom .group-btn-language{
        display: flex;
        left: 8%;
        top: 0;
        position: absolute;
        padding: 6px 7px;
    }

    .header-fixed .header-bottom .group-btn-language button{
        margin-left: 3px;
    }

    .featured-home-item {
        height: 140px
    }

    .du-an-item-thumb {
        height: 110px
    }

    .sidebar-fix {
        margin-top: 0;
        display: none
    }
}