html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

@media (max-width: 768px) {
    #login {
        height: 130vh;
    }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.form-check {
    min-height: 2rem;
    font-size: 14px;
}

strong {
    color: #282828;
}

.form-check-input:checked {
    background-color: var(--rr-theme-primary);
}

.form-check-input:focus {
    box-shadow: none;
}

#nav-tabContent h2 {
    font-size: var(--rr-fs-h3);
    line-height: var(--rr-lh-h3);
    font-weight: bold;
}

.contact-us__area .contact-us__form-wrapper {
    background: antiquewhite;
    border-radius: 10px;
    padding: 50px 130px;
    margin-bottom: 0;
}

#customQuoteDiv .contact-us__area .contact-us__form-wrapper {
    margin: auto 200px;
    padding: 50px 50px;
}

    .contact-us__area .contact-us__form-wrapper .contact-us__form .contact-us__input input {
        margin-left: 0;
        background: var(--rr-common-white);
        margin-bottom: 18px;
        padding: 7px 20px;
        border-radius: 4px;
        border: 1px solid rgba(0, 29, 8, 0.1);
    }

    .contact-us__area .contact-us__form-wrapper .contact-us__form .contact-us__textarea textarea {
        height: 110px !important;
        margin-left: 0;
        background: var(--rr-common-white);
        border: 1px solid rgba(0, 29, 8, 0.1);
        padding: 8px 20px;
        border-radius: 4px;
    }

    html {
        position: relative;
        min-height: 100%;
    }

    .container {
        --bs-gutter-x: 30px;
        max-width: 1400px;
    }

    .section-space {
        padding-top: 20px;
        padding-bottom: 0px;
    }

    .input-field.error {
        border: 2px solid red !important;
    }

    .formTopPadding {
        padding: 130px 0 10px !important;
    }

    .error {
        border: 1px solid #ff3d00 !important;
        border-color: red;
    }

    .tooltipForError {
        position: absolute;
        background-color: #ffdddd;
        color: #a94442;
        border: 1px solid #a94442;
        padding: 5px 10px;
        border-radius: 4px;
        font-size: 12px;
        white-space: nowrap;
        display: none; /* Hidden by default */
        z-index: 10;
        opacity: 1;
    }

    .scrollbar {
        height: calc(100vh - 310px);
        overflow-y: scroll;
        margin-bottom: 25px;
    }

    .force-overflow {
        min-height: 450px;
    }

    #style-2::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
        border-radius: 10px;
        background-color: #F5F5F5;
    }

.best-deal__title-wrapper-title {
    line-height: 40px;
}
.swiper-slide{
    padding-bottom: 10px;
}
#style-2::-webkit-scrollbar {
    width: 12px;
    background-color: #F5F5F5;
}

    #style-2::-webkit-scrollbar-thumb {
        border-radius: 10px;
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
        background-color: var(--rr-theme-primary);
    }

    .loader-container {
        position: fixed; /* Sticks the loader to the viewport */
        top: 0;
        left: 0;
        width: 100vw; /* Full screen width */
        height: 100vh; /* Full screen height */
        background: rgba(0, 0, 0, 0.5); /* Semi-transparent black background */
        display: flex; /* Flexbox for centering */
        justify-content: center; /* Horizontal centering */
        align-items: center; /* Vertical centering */
        z-index: 9999; /* Ensures loader is on top */
    }

    .invalidFields {
        border: 1px solid #dc3545 !important;
        padding-right: calc(1.5em + .75rem) !important;
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23dc3545' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
        background-repeat: no-repeat;
        background-position: right calc(.375em + .1875rem) center;
        background-size: calc(.75em + .375rem) calc(.75em + .375rem);
    }
    /*
.loader {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: inline-block;
    position: relative;
    border: 3px solid;
    border-color: #FFF #FFF transparent transparent;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
}

    .loader::after,
    .loader::before {
        content: '';
        box-sizing: border-box;
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        margin: auto;
        border: 3px solid;
        border-color: transparent transparent #FF3D00 #FF3D00;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        box-sizing: border-box;
        animation: rotationBack 0.5s linear infinite;
        transform-origin: center center;
    }

    .loader::before {
        width: 32px;
        height: 32px;
        border-color: #FFF #FFF transparent transparent;
        animation: rotation 1.5s linear infinite;
    }

@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

@keyframes rotationBack {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(-360deg);
    }
}
*/

    .form-select {
        color: #717171;
        font-size: 14px !important;
    }
    /* HTML: <div class="loader"></div> */
    .loader {
        width: 40px;
        height: 20px;
        background: orange;
        position: relative;
        animation: l9-0 1.5s infinite linear;
    }

        .loader:before,
        .loader:after {
            content: "";
            position: absolute;
            background: inherit;
            bottom: 100%;
            width: 50%;
            height: 100%;
            animation: inherit;
            animation-name: l9-1;
        }

        .loader:before {
            left: 0;
            transform-origin: bottom left;
            --s: -1;
        }

        .loader:after {
            right: 0;
            transform-origin: bottom right;
        }

    @keyframes l9-0 {
        0%,10% {
            transform: translateY(0%) scaleY(1)
        }

        49.99% {
            transform: translateY(-50%) scaleY(1)
        }

        50% {
            transform: translateY(-50%) scaleY(-1)
        }

        90%,100% {
            transform: translateY(-100%) scaleY(-1)
        }
    }

    @keyframes l9-1 {
        10%,90% {
            transform: rotate(0deg)
        }

        50% {
            transform: rotate(calc(var(--s,1)*180deg))
        }
    }

    .nice-select .list {
        max-height: 400px;
        min-height: 226px;
        overflow-y: auto !important;
    }

.payment-method .accordion-button:not(.collapsed) {
    background: #fff5f1;
    padding-left: 5px;
    margin-bottom: 7px;
}
    .payment-method .accordion-button:not(.collapsed)::after {
        content: "✔";
        margin-left: auto;
        color: green;
        background-image: none;
        right: 11px;
    }

    .checkoutFields {
        background: #ffffff;
        border: 1px solid #E2E2E2;
        border-radius: 4px;
        height: 45px;
        line-height: 45px;
        padding: 0 0 0 20px;
        width: 100%;
        outline: none;
        margin-left: 0;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        -ms-box-shadow: none;
        -o-box-shadow: none;
        box-shadow: none;
    }

    .form-control.is-invalid, .was-validated .form-control:invalid {
        border-color: #dc3545;
        padding-right: calc(1.5em + .75rem) !important;
        background-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23dc3545' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e);
        background-repeat: no-repeat;
        background-position: right calc(.375em + .1875rem) center;
        background-size: calc(.75em + .375rem);
    }

    #payment .form-control {
        padding: .375rem 1rem;
    }

    [type=button]:disabled, [type=reset]:disabled, [type=submit]:disabled, button:disabled {
        cursor: not-allowed !important;
        background-color: #d3d3d3;
        color: #a1a1a1;
        border: 1px solid #ccc;
        opacity: 0.6;
    }

    .form-control:focus, .input:focus, select:focus {
        -webkit-box-shadow: 0px 0px 3px #A5D491 inset;
        -moz-box-shadow: 0px 0px 3px #A5D491 inset;
        -o-box-shadow: 0px 0px 3px #A5D491 inset;
        box-shadow: 0px 0px 3px #A5D491 inset;
    }

    .status_success {
        background: #F0FEE9;
        border-color: #A5D491;
    }

    .cart-area .table-content .table tbody .product-thumbnail__wrapper {
        width: 100%;
    }

        .cart-area .table-content .table tbody .product-thumbnail__wrapper .product-size {
            width: 100%;
        }

    .cart-area .table-content .table tbody .product-quantity {
        padding-right: 50px !important;
    }

    .cart-area .table-content .table tbody .product-thumbnail__wrapper .product-size {
        max-width: none;
    }

    .cart-area .table-content .table tbody .product-remove a {
        width: auto;
        height: auto;
        background: none;
    }

    .cart-area .table-content .table tbody .product-remove i {
        font-size: 18px;
    }

    .checkbox-form .lan-select-6 .nice-select, .checkout-form-list input[type=text], .checkout-form-list input[type=password], .checkout-form-list input[type=email] {
        height: 50px;
        line-height: 50px;
    }
    /* ALert box html start*/
    .popup-container {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: rgba(0, 0, 0, 0.5);
        visibility: hidden;
        opacity: 0;
        transition: visibility 0s, opacity 0.3s;
        z-index: 1111;
    }

        .popup-container.active {
            visibility: visible;
            opacity: 1;
        }

    .popup {
        background: #fff;
        border-radius: 10px;
        padding: 20px;
        width: 410px;
        box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
        text-align: center;
        position: relative;
        animation: popupAnimation 0.3s ease-out;
    }

    @keyframes popupAnimation {
        from {
            transform: scale(0.8);
        }

        to {
            transform: scale(1);
        }
    }

    .popup h2 {
        margin: -20px -20px 0px;
        font-size: 1.5em;
        color: #333;
        line-height: 40px;
        background: #ffdacf;
        border-radius: 6px 6px 0 0;
    }

    .popup p {
        margin: 20px 0 20px;
        font-size: 1em;
        color: #666;
    }

    .popup-buttons {
        display: flex;
        justify-content: center;
    }

    .btn {
        border: none;
        padding: 7px 25px;
        font-size: 1em;
        border-radius: 5px;
        transition: background-color 0.3s;
    }

        .btn.confirm {
            background-color: var(--rr-theme-primary);
            color: #fff;
        }

            .btn.confirm:hover {
                background-color: var(--rr-heading-primary);
            }
    /*Alert box html end*/
    /*Hover fields*/
    .text-base {
        margin: 0;
        padding: 5px 8px;
        border-radius: 6px;
        transition: all .3s;
    }

        .text-base:focus {
            outline: 0;
            border-color: #bbcaf7 !important;
            font-size: 14px;
        }

.text-field {
    position: relative;
}

    .text-field input,
    .text-field textarea {
        display: inline-block;
        padding: 10px;
        font-size: 14px;
    }

        .text-field span {
            position: absolute;
            pointer-events: none;
            left: 16px;
            top: 9px;
            transition: 0.3s;
        }

        .text-field input:focus + span,
        .text-field input:not(:placeholder-shown) + span,
        .text-field textarea:focus + span,
        .text-field textarea:not(:placeholder-shown) + span {
            top: -16px;
            left: 10px;
            font-size: small;
            background-color: #fff;
            padding: 0 5px 0 5px;
        }

        .text-field input:focus:invalid + span,
        .text-field input:not(:placeholder-shown):invalid + span,
        .text-field textarea:focus:invalid + span,
        .text-field textarea:not(:placeholder-shown):invalid + span {
            color: red !important;
        }


        .text-field label {
            position: absolute;
            pointer-events: none;
            left: 16px;
            top: 9px;
            transition: 0.3s;
            font-size: 14px;
        }

        .text-field input:focus + label,
        .text-field input:not(:placeholder-shown) + label,
        .text-field textarea:focus + label,
        .text-field textarea:not(:placeholder-shown) + label {
            top: -16px;
            left: 10px;
            font-size: small;
            background-color: #fff;
            padding: 0 5px 0 5px;
            border-radius: 5px;
        }

        .text-field input:focus:invalid + label,
        .text-field input:not(:placeholder-shown):invalid + label,
        .text-field textarea:focus:invalid + label,
        .text-field textarea:not(:placeholder-shown):invalid + label {
            color: red !important;
        }




        .text-field select:focus + label,
        .text-field select:not(:placeholder-shown) + label,
        .text-field textarea:focus + label,
        .text-field textarea:not(:placeholder-shown) + label {
            top: -16px;
            left: 10px;
            font-size: small;
            background-color: #fff;
            padding: 0 5px 0 5px;
        }

        .text-field select:focus:invalid + label,
        .text-field select:not(:placeholder-shown):invalid + label,
        .text-field textarea:focus:invalid + label,
        .text-field textarea:not(:placeholder-shown):invalid + label {
            color: red !important;
        }

    .g-recaptcha > div {
        width: unset !important;
    }

    .rr-fea-product__title-sm {
        font-size: 18px;
    }

    .prodact-area .bottom-button h5 {
        font-size: 15px;
    }

    .breadcrumb__menu ul li span, .breadcrumb__menu ul li.active span {
        font-size: 14px;
    }

    .main-menu ul li:hover > .submenu {
        top: 70%;
    }

    .main-menu ul li .submenu {
        padding: 25px 0 6px;
    }

    .footer__content {
        color: #000;
    }

    .footer__subscribe li i {
        padding-top: 6px;
    }

    #nav-tabContent {
        background-color: white;
        box-shadow: 0px 0px 30px 0px rgba(23, 19, 4, 0.08);
        padding: 10px 20px 20px 20px;
    }

    .paragraph table th {
        background: #ffd2c3;
        padding-left: 10px;
        font-size: 18px;
        height: 40px;
        color: #313131;
        font-weight: normal;
    }

    .paragraph table td {
        padding-left: 10px;
        height: 34px;
    }

    .paragraph table tr:nth-child(even) {
        min-width: 5px;
        padding-left: 15px;
        background: #f7f7f7;
    }


    .content-page h2 {
        font-size: 23px;
        color: #222;
    }

    .ColorDiv {
        height: 50px
    }

    h1 {
        color: #222;
        font-size: 2rem;
    }

    .content-page ul {
        padding-left: 25px;
    }

    .text-base:disabled {
        background-color: #e6e6e6 !important;
    }

    .banner-home__content .sub-title {
        color: var(--rr-theme-primary);
        font-family: var(--rr-ff-subtitle);
        font-size: var(--rr-fs-h4);
        font-weight: var(--rr-fw-regular);
        line-height: var(--rr-lh-h6);
    }

    .latest-feature__item-content span {
        color: var(--rr-heading-primary);
        font-family: var(--rr-ff-heading);
        font-size: var(--rr-fs-h4);
        font-weight: var(--rr-fw-sbold);
        line-height: var(--rr-lh-h5);
        margin-bottom: 12px;
        font-style: normal;
    }

    @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
        .header__main .header__right .header__action .search-icon {
            display: block !important;
        }

        #popup-search-box .box-inner-wrap form input {
            margin-left: 0px;
        }
    }

@media (max-width: 1230px) {
    .payment-method .accordion-button:not(.collapsed)::after {
        content: "✔";
        margin-left: auto;
        color: green;
        background-image: none;
        right: 11px;
        top: 26%;
    }
}

    @media (max-width: 1100px) {
        #nav-tabContent {
            padding: 0px;
        }

        .contact-us__area .contact-us__form-wrapper {
            margin: auto;
        }
    }

    @media (max-width: 768px) {
        .form-select {
            margin-bottom: 20px !important;
        }

        .ColorDiv {
            height: 61px
        }

        .radioButtonsDiv {
            position: relative;
            top: -9px;
        }

        #customQuoteDiv .contact-us__area .contact-us__form-wrapper {
            margin: inherit;
            padding: 20px;
        }

        #btnSubmitQuote {
            width: 100%
        }

        .col-sm-12 {
            width: 100%;
        }

        .formTopPadding {
            padding: 90px 0 10px !important;
        }

        #popup-search-box .box-inner-wrap .search-close {
            margin-right: 97px;
            top: 9%;
        }
        .product-size .col-3 {
            padding-left: 0;
            padding-right: 0;
        }
        .cart-area{
            padding-top: 15px !important;
        }
    }

.product-name {
    text-transform: capitalize;
}
    .mb-5 {
        margin-bottom: 5px !important;
    }

    @media (min-width: 576px) {
        .d-sm-block {
            display: table-cell !important;
        }
    }

.read_all {
    display: block;
    position: relative;
    top: -6px;
    padding-left: 12px;
    left: 7px;
}