@media (min-width: 1920px) {
    ul.navbar-nav li.nav-item .search-box {
        display: flex !important;
    }
}

@media (min-width: 1441px) and (max-width: 1919px) {
    ul.navbar-nav li.nav-item .search-box {
        display: flex !important;
    }
}

@media (min-width: 1281px) and (max-width: 1440px) {
    ul.navbar-nav li.nav-item .search-box {
        display: flex !important;
    }
}

@media (min-width: 1025px) and (max-width: 1280px) {
    ul.navbar-nav li.nav-item .search-box {
        display: flex !important;
    }

    /* Home Banner */
    .home-banner {
        width: 10%;
    }

    .home-banner.active {
        width: 60%;
    }

    .banners-section .home-banner-container .home-banner:nth-of-type(even) {
        display: none;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {

    /* Navbar */
    ul.navbar-nav:nth-child(1) {
        padding-left: 0 !important;
    }

    .navbar-dark .navbar-toggler-icon {
        background-image: inherit !important;
        color: black !important;
        padding-top: inherit !important;
    }

    .navbar .navbar-brand {
        width: 75px;
        height: 0px;
        top: 4px;
        margin: 0;
        padding: 0;
    }

    .navbar .navbar-brand img {
        width: -webkit-fill-available;
        padding: 4px;
        height: 75px;
    }

    ul.navbar-nav li.nav-item .search-box {
        width: fit-content;
    }

    /* Home Banner */
    .banners-section {
        margin-top: 4em;
    }

    .home-banner {
        width: 10%;
    }

    .home-banner.active {
        width: 60%;
    }

    .banners-section .home-banner-container .home-banner:nth-of-type(even) {
        display: none;
    }

    .books-section-home .swiper.books-slider .swiper-button-prev {
        top: 45px;
    }

    .books-section-home .swiper.books-slider .swiper-button-next {
        top: 45px;
    }

    /* About */
    .about-page-section .about-card {
        height: auto !important;
        margin-top: 10em !important;
    }

    .about-page-section .about-card .about-content {
        margin-top: 13em;
    }

    .about-page-section .about-card .about-card-img {
        /* top: -140px; */
        top: -145px !important;
        width: 50% !important;
    }

    .about-page-section .about-card .language-switch {
        top: 12em !important;
        right: 2em !important;
        left: inherit !important;
    }

    /* .about-page-section .about-card .about-card-img img {
        height: 60%
    } */

}

@media (min-width: 768px) and (max-width: 991px) {

    /* Home Banner */
    .home-banner {
        width: 10%;
    }

    .home-banner.active {
        width: 60%;
    }

    .banners-section .home-banner-container .home-banner:nth-of-type(even) {
        display: none;
    }

    /* About */
    .about-page-section .about-card {
        height: auto !important;
        margin-top: 10em !important;
    }

    .about-page-section .about-card .about-content {
        margin-top: 13em;
    }

    .about-page-section .about-card .about-card-img {
        /* top: -140px; */
        top: -145px !important;
        width: 70% !important;
    }

    .about-page-section .about-card .language-switch {
        top: 12em !important;
        right: 2em !important;
        left: inherit !important;
    }

    /* FAQ  */
    .faq-page-section .main-row {
        flex-direction: column-reverse;
    }
}

@media (min-width: 481px) and (max-width: 767px) {

    /* Navbar */
    ul.navbar-nav:nth-child(1) {
        padding-left: 0 !important;
    }

    .navbar-dark .navbar-toggler-icon {
        background-image: inherit !important;
        color: black !important;
        padding-top: inherit !important;
    }

    .navbar .navbar-brand {
        width: 75px;
        height: 0px;
        top: 4px;
        margin: 0;
        padding: 0;
    }

    .navbar .navbar-brand img {
        width: -webkit-fill-available;
        padding: 4px;
        height: 75px;
    }

    ul.navbar-nav li.nav-item .search-box {
        width: fit-content;
    }

    /* Home Banner */
    .banners-section {
        margin-top: 4em;
    }

    .home-banner {
        width: 10%;
    }

    .home-banner.active {
        width: 60%;
    }

    .banners-section .home-banner-container .home-banner:nth-of-type(even) {
        display: none;
    }

    .books-section-home .swiper.books-slider .swiper-button-prev {
        top: 35px;
    }

    .books-section-home .swiper.books-slider .swiper-button-next {
        top: 35px;
    }

    /* About */
    .about-page-section .about-card {
        height: auto !important;
        margin-top: 10em !important;
    }

    .about-page-section .about-card .about-card-img {
        top: -140px;
        width: 80% !important;
    }

    .about-page-section .about-card .language-switch {
        top: 9em !important;
        right: 2em !important;
        left: inherit !important;
    }

    /* .about-page-section .about-card .about-card-img img {
        height: 40%
    } */

    /* Article Detail */
    .article-detail-page-section .article-details-page-section-container .head-top {
        align-items: center !important;
    }

    .article-detail-page-section .article-details-page-section-container .head-top>div {
        width: inherit !important;
    }

    .article-detail-page-section .article-details-page-section-container .head-top .title {
        text-align: center !important;
        width: -webkit-fill-available;
    }

    /* FAQ  */
    .faq-page-section .main-row {
        flex-direction: column-reverse;
    }
}

@media (min-width: 320px) and (max-width: 480px) {

    /* Navbar */
    ul.navbar-nav:nth-child(1) {
        padding-left: 0 !important;
    }

    .navbar-dark .navbar-toggler-icon {
        background-image: inherit !important;
        color: black !important;
        padding-top: inherit !important;
    }

    .navbar .navbar-brand {
        width: 75px;
        height: 0px;
        top: 4px;
        margin: 0;
        padding: 0;
        background: transparent;
    }

    .navbar .navbar-brand img {
        width: -webkit-fill-available;
        padding: 4px;
        height: 75px;
    }

    ul.navbar-nav li.nav-item .search-box {
        width: fit-content;
    }

    /* Home Banner */
    .banners-section {
        margin-top: 4em;
    }

    .home-banner {
        width: 0%;
    }

    .home-banner.active {
        width: 100%;
    }

    .books-section-home .swiper.books-slider .swiper-button-prev {
        top: 35px;
    }

    .books-section-home .swiper.books-slider .swiper-button-next {
        top: 35px;
    }

    /* About */
    .about-section-home .section[data-section-id="2"] {
        flex-direction: column-reverse;
    }

    .about-page-section .about-card {
        height: auto !important;
        margin-top: 5em !important;
    }

    .about-page-section .about-card .card-content {
        margin-top: 13em !important;
    }

    .about-page-section .about-card .about-card-img {
        top: -60px;
        /* width: 50% !important; */
    }

    .about-page-section .about-card .language-switch {
        top: 12em !important;
        right: 2em !important;
        left: inherit !important;
    }

    /* Article Detail */
    .article-detail-page-section .article-details-page-section-container .head-top {
        align-items: center !important;
    }

    .article-detail-page-section .article-details-page-section-container .head-top>div {
        width: inherit !important;
    }

    .article-detail-page-section .article-details-page-section-container .head-top .title {
        text-align: center !important;
        width: -webkit-fill-available;
    }

    /* FAQ  */
    .faq-page-section .main-row {
        flex-direction: column-reverse;
    }

    /* Question Answer */
    .question-answers-section-home .qa-slider .heading {
        margin-top: 70px !important;
    }
}

@media (min-width: 420px) and (max-width: 480px) {
    .about-page-section .about-card .about-card-img {
        top: -70px !important;
        width: 80% !important;
    }

    .about-page-section .about-card .language-switch {
        top: 12em !important;
        right: 2em !important;
        left: inherit !important;
    }
}