@media (min-width: 375px) and (max-width: 767px) {

    /* Footer */

    .main-wrapper {
        padding: 100px 0 0;
    }

    footer {
        padding: 40px 48px;
        background-image: url(../images/Footer-resp-img.png);
        background-size: 100%;
    }

    footer,
    footer p,
    footer .brand-logo {
        text-align: center;
    }

    footer .findus-section {
        width: auto;
    }

    footer .footer-wrapper {
        margin-bottom: 24px;
        text-align: center;
    }

    footer .bottom-bar {
        flex-direction: column;
        margin-top: 40px;
    }

    footer .footer-wrapper .brand-logo img {
        height: 48px;
        width: 273px;
    }

    body.bg-img footer {
        background-color: var(--black-off);
    }

    /* Footer */

    /* Header */
    button.navbar-toggler {
        border: unset;
        box-shadow: unset;
        padding: 0;
    }

    .navbar-toggler .navbar-toggler-icon {
        background-image: url(../images/hamburger.svg);
        background-repeat: no-repeat;
        width: 24px;
        height: 24px;
    }

    .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon {
        background-image: url(../images/cross.svg);
        background-repeat: no-repeat;
        height: 24px;
        width: 24px;
    }

    .navbar-toggler-icon {
        outline: unset;
        box-shadow: unset;
    }

    header .navbar-toggler:focus-visible {
        outline: unset;
        box-shadow: unset;
    }

    header .navbar-nav {
        justify-content: center;
        align-items: center;
        background: var(--Card-BG, radial-gradient(52.15% 80.07% at 47.19% -0.63%, #20334A 0%, #181F26 100%), linear-gradient(155deg, rgba(25, 43, 72, 0.70) 0%, rgba(24, 41, 69, 0.70) 49.53%, rgba(23, 38, 61, 0.70) 75.72%));
    }

    header .navbar-nav {
        gap: 0;
    }

    header .navbar-nav.nav-open {
        padding: 40px 0px !important;
        position: absolute;
        width: 100%;
        top: 74px;
    }

    header .container {
        padding: 0;
    }

    header .navbar,
    header {
        padding: 0;
    }

    header .resp-header {
        padding: 26px 0;
        border-bottom: 1px solid var(--black-bg);
    }

    header .navbar-toggler {
        padding-right: 24px;
    }

    header .logo img {
        padding-left: 24px;
        height: 23px;
        width: 134px;
    }

    .navbar-toggler:focus {
        box-shadow: none !important;
    }

    header .dropdown .dropdown-menu.show {
        display: flex;
        justify-content: center;
        align-items: center;
        background: unset;
        border: unset;
    }

    header .navbar-nav.nav-open li {
        border-bottom: 1px solid rgb(52, 63, 77, 0.2);
        width: 100%;
    }

    header .navbar-nav.nav-open li a:hover {
        background-color: var(--clr-primary-100);
        width: 100%;
    }

    header.active {
        border-bottom: 1px solid var(--Stroke, #262F35);
        background: var(--BG, #0F1425);
    }

    /* header .navbar-nav.nav-open li:hover {
        background: unset;
    } */

    header .navbar-nav.nav-open li a {
        text-align: center;
        padding: 24px 0 24px 0;

    }

    header .navbar-nav.nav-open li:last-child {
        border-bottom: unset;
    }

    #register.main-wrapper {
        padding: 92px 0 112px;
    }

    #checkout.secure-checkout {
        background-image: url(../images/Register-bg.png);
        padding: 105px 0 0px;
    }

    #checkout .modal-body p {
        color: var(--gray-500) !important;
    }

    #checkout .container .row.pt-75 {
        padding-top: 0;
    }

    #checkout .modal-body {
        padding: 0;
    }

    #checkout #order-successful .order-summary {
        padding-top: 0;
        padding-bottom: 0;
    }

    #checkout .modal.show .modal-dialog {
        width: 100%;
        margin: 0;
    }

    #checkout .checkout-details .detail-form h3 {
        font-size: 28px;
    }

    #order-successful table tr td:first-child {
        padding: 0px 0 24px 24px !important;
    }

    #order-successful table th:last-child {
        text-align: end;
    }

    #checkout .modal-body {
        padding: 0 24px;
    }

    #checkout .modal-body .primary-button {
        padding: 0 !important;
    }

    .section-2 .section {
        min-height: 450px;
    }

    /* Header */

    #checkout .text-center.mb-90 {
        margin-bottom: 45px !important;
    }

    h1,
    .h1 {
        font-size: 32px !important;
    }

    #product-page .modal-body .item-popup {
        flex-direction: column;
        align-items: center;
    }

    #product-page .modal-dialog {
        width: 100%;
        max-width: 100%;
    }

    #product-page .modal-dialog .modal-body {
        padding: 0 12px 40px;
    }

    #product-page .primary-button .btn-primary {
        width: 100%;
    }

    #product-page .primary-button.shop-btn {
        flex-direction: column;
    }

    .btn.btn-main {
        width: 100%;
        padding: 16px 24px;
    }

    #product-page .add-to-cart.btn.btn-primary {
        width: 100%;
        padding: 16px 16px;
    }

    /* login */

    #register .login-section,
    #register .register-section {
        padding: 39px 24px;
        width: 100%;
    }

    .primary-button .btn-primary {
        width: 100%;
    }

    #register .modal-dialog {
        width: 100%;
        margin: 0;
    }

    #register .modal-body {
        padding: 0 20px 43px;
    }

    #nav-tab .nav-sidebar {
        justify-content: space-between;
        align-items: self-start;
        height: 100%;
    }

    #register .left-sec,
    #register .right-sec {
        padding: 0;
    }

    #register .login-row {
        grid-template-columns: repeat(1, 100%);
    }

    #register.main-wrapper .container {
        padding: 0
    }

    #register.main-wrapper .form-input input {
        margin-bottom: 26px;
    }

    #register.main-wrapper .form-input input:last-child {
        margin-bottom: 26px;
    }

    #register.login-form.main-wrapper {
        padding: 78px 0 78px;
    }

    #register .login-row {
        gap: 0;
    }

    #register .right-sec .register-section .form-input input {
        margin-bottom: 26px;
    }

    #register .right-sec .register-section input[type="checkbox"] {
        width: 33px;
    }

    #register.login-form.main-wrapper {
        padding: 78px 0 0;
    }

    #order-successful .order-summary-detail {
        padding: 24px 0 0;
    }

    #checkout .modal-body a {
        padding-bottom: 39px;
    }

    #order-successful.order-detail .order-summary {
        padding-top: 0;
    }

    /* tnc */
    #tnc.terms-conditions {
        padding: 76px 0 0px;
    }

    #tnc.terms-conditions .terms-wrapper {
        padding: 39px 24px;
    }


    #tnc.terms-conditions .terms-wrapper h1 {
        padding-bottom: 0 !important;
    }

    #error.error-page {
        min-height: 82vh;
    }

    #error .error-content h3 {
        font-size: 28px;
        height: 16px;
    }

    #error .error-content h1 {
        margin: 0 0 16px 0;
    }

    #error .error-content p {
        /* margin-bottom: 16px !important; */
    }

    /* Error */

    #error .error-content p.large {
        color: var(--white) !important;
    }

    #error.error-page .error-content {
        background: unset;
        width: 100%;
        padding: 80px 24px 80px;
    }

    #error.error-page {
        background-image: url(../images/404-resp.png);
        padding: 20px 0 0;
    }

    #error.error-page .error-content h3 {
        margin: 0 !important;
    }


    #dashboard .main-account .register-section {
        width: auto;
    }

    /* Reset Password */
    #reset-password .main-section {
        padding: 0;
    }

    #reset-password .resetpassword-section h2,
    #reset-password .resetpassword-section p,
    #reset-password .resetpassword-section .form-input input {
        margin-bottom: 26px !important;
    }

    #reset-password .resetpassword-section .primary-button {
        margin-top: 0 !important;
    }

    #reset-password .resetpassword-section {
        width: auto;
        padding: 39px 24px;
        background-image: unset;
    }

    #reset-password.main-wrapper {
        padding: 35px 0 0;
        min-height: 84vh;
    }

    #register .login-section .form-title h2 {
        margin-bottom: 26px;
    }

    #product-listing .filter-wrapper {
        flex-direction: column;
        width: 100%;
    }

    #product-listing .main-listing-section {
        padding: 0 0;
    }

    #product-listing .filters-section {
        padding: 0 24px;
    }

    #product-listing .container {
        padding: 0;
    }

    #product-listing .product-category-filter .container {
        padding: 0;
    }

    #product-listing .product-category-filter .row {
        gap: 10px;
    }

    #product-listing .multi-collapse .card.card-body {

        left: 0;
        position: absolute;
        top: 77px;
        width: 100%;
        padding: 31px;
    }

    #product-page .product-info .content .info-section .product-type {
        color: var(--white) !important;
    }

    #product-listing .filter-wrapper select {
        text-align: center;
    }

    #order-successful .order-summary {
        flex-direction: column-reverse;
    }

    #order-successful.order-detail .order-image {
        padding-right: 0;
        width: 100%;
        padding-top: 10px;
    }

    #order-successful .order-summary-detail {
        border: unset;
        background: unset;
    }

    #order-successful .title {
        margin-bottom: 45px;
        /* background-image: url(../images/hero-bg.png);
        background-repeat: no-repeat; */
        background-size: 100% 100%;
    }

    #order-successful .total-section p {
        color: var(--white) !important;
    }

    #order-successful .total-section h3 {
        font-size: 28px;
    }

    #order-successful.order-detail.main-wrapper {
        padding: 140px 0 0px;
    }

    #order-successful .summary-detail .primary-button {
        padding: 0 24px;
    }

    #order-successful .title {
        margin-bottom: 45px !important;
    }

    #order-successful.order-detail.main-wrapper {
        background-image: url(../images/mobile-bg.jpeg);
        background-repeat: no-repeat;
        background-size: 100% 105%;
    }

    #checkout .text-input {
        flex-direction: column;
    }

    #checkout .left-section {
        padding: 0;
    }

    #checkout .right-section {
        padding: 0;
    }

    #checkout .checkout-details {
        padding: 39px 24px;
    }

    #checkout #order-successful .order-summary-detail {
        border: 1px solid var(--accent-color);
        background: var(--Card-BG, radial-gradient(52.15% 80.07% at 47.19% -0.63%, #20334A 0%, #181F26 100%), linear-gradient(155deg, rgba(25, 43, 72, 0.70) 0%, rgba(24, 41, 69, 0.70) 49.53%, rgba(23, 38, 61, 0.70) 75.72%));
    }

    #checkout #order-successful table th,
    #checkout #order-successful table tr td,
    #checkout #order-successful .total-section,
    #checkout .coupon-section,
    #checkout .card-payment,
    #checkout .final-total {
        padding: 24px;
    }

    #checkout .final-total {
        flex-direction: column;
        align-items: center;
        gap: 24px;
    }

    #checkout .final-total .total {
        text-align: center;
    }

    #checkout .coupon-code p {
        width: 60%;
    }

    #checkout .modal-title,
    #checkout .modal-body p,
    #checkout .modal-body .primary-button {
        margin-bottom: 26px !important;
    }

    #shopping-cart #checkout .left-section {
        padding-right: 0;
    }

    #shopping-cart .shopping-total .product-item-card {
        border-top: 1px solid var(--Fields, #343F4D);
        border-bottom: 1px solid var(--Fields, #343F4D);
        background: var(--Card-BG, radial-gradient(52.15% 80.07% at 47.19% -0.63%, #20334A 0%, #181F26 100%), linear-gradient(155deg, rgba(25, 43, 72, 0.70) 0%, rgba(24, 41, 69, 0.70) 49.53%, rgba(23, 38, 61, 0.70) 75.72%));
        padding: 24px;
    }

    #shopping-cart.main-wrapper {
        padding: 98px 0 0px;
    }

    #shopping-cart .primary-button {
        padding: 0 24px;
    }

    #shopping-cart .coupon-input .btn-secondary {
        background-color: var(--clr-primary-100);
    }

    #dashboard .dashboard-wrapper {
        width: auto;
        margin-left: 0;
        padding: 0 24px;
    }

    #dashboard .tab-title {
        margin-left: 0;
        text-align: center;
    }

    #dashboard .dashboard-section h1 {
        margin-left: 0 !important;
    }

    #dashboard .dashboard-section {
        text-align: center;
    }

    #dashboard .nav-sidebar {
        display: none;
        /* flex-direction: column-reverse; */
    }

    #dashboard .order-detail-table {
        background: var(--Card-BG, radial-gradient(52.15% 80.07% at 47.19% -0.63%, #20334A 0%, #181F26 100%), linear-gradient(155deg, rgba(25, 43, 72, 0.70) 0%, rgba(24, 41, 69, 0.70) 49.53%, rgba(23, 38, 61, 0.70) 75.72%));
    }

    #nav-tab .nav-sidebar .logout {
        border-radius: 0px 0px 4px 4px;
        border: 1px solid var(--accent-color);
        background: var(--black-bg);
        width: 100%;
    }

    #nav-tab .nav-sidebar .logout button {
        padding: 20px 24px;
    }

    #dashboard .order-list {
        padding: 10px 0px;
    }

    #dashboard .nav-tabs-sec {
        display: block !important;
    }

    #dashboard .order-table tbody tr:nth-child(2n-1) {
        background-color: var(--black-bg);
    }

    #dashboard .container {
        padding: 0;
    }

    #dashboard .register-section {
        margin-left: 0 !important;
    }

    #dashboard .order-table tbody tr td:first-child,
    #dashboard .order-table thead tr th:first-child {
        padding-left: 24px;
    }

    #dashboard .order-table thead tr th {
        padding-top: 11px;
        padding-bottom: 10px;
        padding-right: 20px;
    }

    #dashboard .order-table tbody tr td {
        padding-top: 11px;
        padding-bottom: 10px;
    }

    #dashboard .order-table tbody tr td:last-child,
    #dashboard .order-table thead tr th:last-child {
        padding-left: 24px;
    }

    #dashboard .address-wrapper {
        margin-left: 0;
    }

    #dashboard .address-content p:last-child {
        width: 40vw;
    }

    #dashboard .main-account h1 {
        text-align: center;
    }

    #dashboard .address-wrapper h1 {
        padding: 0 24px;
        text-align: center;
    }

    #dashboard .address-detail {
        flex-direction: column;
        padding: 0 12px 20px;
        gap: 16px;
    }

    #dashboard .tab-content h1 {
        margin-bottom: 26px;
    }

    #dashboard .tab-content .address-maintitle {
        margin-left: 0;
        text-align: center;
    }


    #dashboard.main-wrapper {
        padding: 100px 0 39px;
        min-height: auto;
    }

    #dashboard .dashboard-content h2,
    #dashboard .dashboard-content span {
        font-size: 20px;
    }

    #product-listing .filter-type,
    #product-listing .buttons-filter {
        padding: 0;
    }

    #product-listing .btn.btn-secondary,
    .btn-secondary,
    #product-listing .filter-buttons .btn.btn-primary {
        width: 100%;
        justify-content: center;
    }

    #product-listing .btn-main {
        justify-content: center;
    }

    #product-listing .products-list {
        padding: 0 24px;
    }

    #product-listing .product-category-filter {
        padding: 0;
        border: unset;
    }

    .muti-collapse .btn.btn-secondary,
    .muti-collapse .btn.btn-primary {
        justify-content: center;
        width: 100%;
    }

    #nav-tab .nav-tabs-content {
        height: 435px;
    }

    #dashboard .main-account .register-section {
        padding: 39px 24px;
        background: unset;
        border: unset;
    }

    #contact-us .contact-section {
        padding: 0px 0 40px 0;
    }

    #contact-us .mobile-view-form .login-section h2 {
        font-size: 20px;
    }

    #contact-us .contact-section .row {
        gap: 24px
    }

    #contact-us .login-section {
        padding: 39px 24px;
        width: 100%;
    }

    #contact-us .contact-form {
        padding: 0;
    }

    #contact-us .contact-form .login-section .text-input {
        flex-direction: column;
        gap: 11px;
    }

    #contact-us.listing-page.main-wrapper {
        background-image: url(../images/mobile-bg.jpeg);
        background-size: 100% 53%;
    }

    #checkout.secure-checkout.main-wrapper {
        background: url(../images/mobile-bg.jpeg);
        background-size: 100% 36%;
    }

    /* #product-listing.main-wrapper {
        background-image: url(../images/mobile-bg.jpeg);
        background-size: 100% 53%;
    } */

    #contact-us .captcha {
        display: flex;
        justify-content: center;
    }

    #contact-us .contact-section .col-md-4 {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    #contact-us .mobile-view-form {
        padding: 0;
    }

    #contact-us .primary-button .btn-primary {
        justify-content: center;
    }

    #about-us.main-wrapper {
        padding-top: 200px;
    }

    #about-us .banner-content {
        text-align: center;
        padding-bottom: 20px;

    }

    #about-us .section-2-left {
        background-image: url(../images/about-us-left-mobile.png);
        background-repeat: no-repeat;
    }

    #about-us .learn-with-us {
        padding-left: 0;
        width: 100%;
        text-align: center;
    }

    #about-us .about-us-mobile {
        width: 100%;
        justify-content: center;
        align-items: center;
    }

    #about-us .learn-with-us button {
        width: 100%
    }

    #aboutus .benefits .item {
        margin-bottom: 24px;
    }

    #nav-tab .nav-tab-btn {
        padding: 20px 26px;
        border: unset;
    }

    #nav-tab .nav-tabs-content {
        background: var(--Card-BG, radial-gradient(52.15% 80.07% at 47.19% -0.63%, #20334A 0%, #181F26 100%), linear-gradient(155deg, rgba(25, 43, 72, 0.70) 0%, rgba(24, 41, 69, 0.70) 49.53%, rgba(23, 38, 61, 0.70) 75.72%));
    }

    #product-lisitng .product-category-filter .container {
        padding: 0;
    }

    #product-listing .filter-btn {
        position: fixed;
        bottom: 0;
        padding: 20px 24px;
    }

    #product-page .accordion-section {
        width: auto;
    }

    #shopping-cart.main-wrapper {
        background-image: url(../images/Register-bg.png);
        background-size: 100%;
    }

    #checkout #order-successful .total-section {
        padding: 0 24px 24px 24px;
    }

    #contact-us.main-wrapper {
        padding: 120px 0 0;
    }

    #product-page .product-info .content .info-section .tagline,
    #product-page .product-info .content .info-section .description {
        color: var(--white) !important;
    }

    #product-page .faq-section h2.title {
        padding: 40px 0 24px 0;
    }

    .benefits {
        padding: 40px 24px 32px;
    }

    #product-page .accordion-item .accordion-button {
        color: var(--white) !important;
    }

    #product-page .accordion-button::after {
        margin-left: 30px;
    }

    #product-page .accordion-item .accordion-body {
        padding: 0 40px 24px;
    }

    #product-page .accordion-item {
        padding-top: 16px;
        padding-bottom: 16px;
    }


}

@media (min-width: 1024px) and (max-width: 1250px) {
    header li a.nav-link {
        font-size: 12px;
    }

    #product-page .product-info .content .info-section {
        width: 52.7vw;
        padding: 3.7vw;
    }

    .btn.btn-primary,
    .btn-primary {
        padding: 8px 8px;
        font-size: 12px;
    }

    footer .findus-section {
        width: 15vw;
    }

    #dashboard .dashboard-section h1 {
        margin-left: 60px !important;
    }

    #dashboard .dashboard-wrapper {
        width: 34vw !important;
        margin-left: 60px;
    }


    #dashboard .orders-detail {
        width: 51vw !important;
    }

    #dashboard .address-content p:last-child {
        width: 18vw;
    }

    #register .login-section,
    #register .register-section {
        width: 36vw;
    }

    #contact-us .login-section {
        width: 46vw;
    }

    #product-listing .product-category-filter .row {
        gap: 63px;
    }

    #product-listing .product-category-filter {
        padding: 0 15px;
    }

    #product-listing .filter-type,
    #product-listing .buttons-filter {
        padding: 0 0 0 25px;
    }

    #product-listing .filter-btn {
        align-items: center;
    }

    #product-page .modal-dialog .modal-body {
        padding: 0 35px 56px;
    }

    #product-page .modal-dialog {
        display: flex;
        align-items: center;
        height: 100%;
        width: 52%;
        max-width: 60%;
    }

    #dashboard .tab-title {
        margin-left: 60px;
    }

    #home .best-products .products,
    .best-products .products {
        margin-left: 0;
    }

    #home-page .best-products,
    .best-products {
        padding: 58.5px 50px;
    }
}

@media (min-width: 1251px) and (max-width: 1400px) {

    footer .findus-section {
        width: 13vw;
    }

    #dashboard .tab-title {
        margin-left: 60px;
    }

    #product-page .product-info .content .info-section {
        width: 50.7vw;
    }

    #consultation-advice .advice-form {
        padding-left: 5vw;
        padding-right: 5vw;
    }

    #product-listing .product-category-filter {}

    #error.error-page .error-content {
        width: 45vw;
    }

    #error.error-page {
        padding: 115px 0 112px;
    }

    #register .modal-body {
        padding: 0 35px 43px;
    }

    #product-listing .product-category-filter .row {
        gap: 63px;
    }

    #order-successful .order-image {
        width: 50%;
    }

    #checkout .left-section {
        padding-right: 100px;
    }

    #checkout .right-section {
        padding-left: 20px;
    }

    #dashboard .dashboard-wrapper {
        width: 34vw !important;
    }


    #dashboard .orders-detail {
        width: 51vw !important;
    }

    #dashboard .address-content p:last-child {
        width: 18vw;
    }

    #contact-us .login-section {
        width: 41vw;
    }

    #product-page .modal-dialog {
        display: flex;
        align-items: center;
        height: 100%;
        width: 52%;
        max-width: 60%;
    }

    #home .best-products .products {
        margin-left: 0;
    }

    #home-page .best-products {
        padding: 58.5px 50px;
    }
}


@media (min-width: 1401px) and (max-width: 1550px) {
    footer .findus-section {
        width: 11vw;
    }

    #product-page .product-info .content .info-section {
        width: 50.7vw;
    }

    #product-page .modal-dialog {
        display: flex;
        align-items: center;
        height: 100%;
        width: 52%;
        max-width: 60%;
    }

    #consultation-advice .advice-form {
        padding-left: 4vw;
        padding-right: 4vw;
    }

    #error.error-page .error-content {
        width: 39vw;
    }


    #register .modal-body {
        padding: 0 40px 43px;
    }

    #order-successful .order-summary-detail {
        width: 42vw;
    }

    #order-successful .order-image {
        width: 50%;
    }

    #order-successful table th,
    #order-successful table tr td,
    #order-successful .total-section {
        padding: 24px 34px;
    }

    #dashboard .dashboard-wrapper {
        width: 28vw;
    }

    #dashboard .address-content p:last-child {
        width: 13vw;
    }

    #contact-us .login-section {
        width: 45vw;
    }

    #contact-us .login-section {
        width: 41vw;
    }

    #shopping-cart .container .row {
        padding-top: 75px;
    }


    #home-page .best-products,
    .best-products {
        padding: 58.5px 50px;
    }

    .best-products .products {
        margin-left: 0;
    }
}

@media (min-width: 1551px) and (max-width: 1920px) {

    #order-successful .order-summary-detail {
        width: 28.3vw;
    }

    #shopping-cart #order-successful .order-summary-detail {
        width: 22.3vw;
    }

    footer .footer-wrapper:nth-child(2) {
        padding-left: 100px;
    }

    footer .footer-wrapper:nth-child(3) {
        padding-left: 50px;
    }

    #checkout .modal.show .modal-dialog {
        width: 35%;
        max-width: 50%;
    }

    #shopping-cart .container .row {
        padding-top: 75px;
    }

    .best-products .title-section h2 {
        margin-left: 75px;
    }

    #consultation-advice .advice-form .content .content-wrapper {
        width: 572px;
    }

    #dashboard .orders-detail .order-table thead tr th:nth-child(1) {
        width: 20%;
    }

    #dashboard .orders-detail .order-table thead tr th:nth-child(2) {
        width: 20%;
    }

    #dashboard .orders-detail .order-table thead tr th:nth-child(3) {
        width: 20%;
    }

    #dashboard .orders-detail .order-table thead tr th:nth-child(4) {
        width: 20%;
    }

    #dashboard .orders-detail .order-table thead tr th:nth-child(5) {
        width: 25%;
    }
}