@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
:root {
    --primary: #2A55E5;
    --black: #000;
    --white: #FFF;
    --crystal: #EFEFEF;
    --light-grey: #D9D9D9;
    --mercury: #EBE7E7;
    --shadow: #00000040;
    --header-fontsize: 24px;
    --header-color: var(--black);
    --header-lineheight: 35px;
    --header-fontweight :700;
}

::selection {
    background-color: var(--primary);
    color: var(--white);
}

img {
    -webkit-user-drag: none;
    /* Safari */
    -khtml-user-drag: none;
    /* Konqueror */
    -moz-user-drag: none;
    /* Firefox */
    -o-user-drag: none;
    /* Opera */
}

body {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    overflow-x: hidden;
    font-style: normal;
    font-family: "Poppins", sans-serif;
    font-size: 14px;
    text-align: left;
}

* {
    scrollbar-width: auto;
    scrollbar-color: var(--primary) var(--white);
}

/* Start Home page */

/* Start top header */
.btn:focus,
button:focus {
    box-shadow: none !important;
}

.top-header .logo{
    width: 80%;
}

.top-header .form-control {
    background: var(--crystal);
    width: 175%;
    padding: 8px 35px;
    border: 0px;
    height: 2.5rem;
}

.top-header .form-control:focus,
.top-header .form-control:active {
    border: 0px !important;
}

.nav-link:focus-visible {
    outline: none;
}

.text-roll span {
    font-family: "Roboto", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 29.3px;
    opacity: 65%;
}

.top-header .form-control:focus {
    box-shadow: none;
}

.top-header .bi-search {
    top: 10px;
    left: 13px;
}

@keyframes moveUp {
    0% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-10px);
    }

    100% {
        transform: translateY(0);
    }
}

.top-header .notification-badge {
    font-size: 12px;
    background-color: #e2231b;
    left: 15px;
}

.top-header .login-signup {
    background: var(--primary);
    border-radius: 10px;
    font-family: "Roboto", sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 17.44px;
    color: var(--white);
}

.top-header .login-signup:hover,
.top-header .login-signup:focus,
.top-header .login-signup:active {
    color: var(--white);
    background: var(--primary);
}

.show-dropdown {
    left: -2% !important;
}

.top-header .login-dropdown,
.top-header .login-dropdown:hover,
.top-header .login-dropdown:focus,
.top-header .login-dropdown:active {
    background: var(--primary);
    border-radius: 50px;
    font-family: "Roboto", sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 23.44px;
    color: var(--white);
}

.top-header .login-dropdown img {
    width: 34px;
    height: 31px;
    border-radius: 50%;
}

.top-header .login-icon .dropdown-menu {
    background: var(--crystal);
    border: 0px;
    left: 0.5rem;
}

.top-header .login-icon .dropdown-menu li {
    background: var(--white);
    margin: 10px;
    padding: 10px;
    border-radius: 5px;
}

.top-header .login-icon .dropdown-menu .dropdown-item:hover {
    background: transparent;
}

.top-header .login-icon .dropdown-menu li a {
    font-size: 15px;
    font-weight: 400;
    line-height: 22.5px;
    color: var(--primary);
}

.top-header .login-icon .dropdown-toggle::after {
    content: "";
    border: 0px;
}

.top-header .notification-icon .dropdown-menu {
    background: var(--crystal);
    border: 0px;
    left: -20rem;
    padding: 0;
    max-height: 25.5rem;
    overflow: hidden;
    overflow-y: auto;
    scrollbar-width: thin !important;
}

.top-header .notification-icon .dropdown-menu li {
    background: var(--white);
    margin: 10px;
    padding: 10px;
    border-radius: 5px;
    overflow: hidden;
}

.top-header .notification-icon .dropdown-menu li a {
    font-size: 15px;
    font-weight: 400;
    line-height: 22.5px;
    color: var(--white);
}

.top-header .notification-icon .dropdown-menu .card-title {
    font-size: 16px;
    font-weight: 700;
    line-height: 25px;
    text-align: left;
    color: var(--primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.top-header .notification-icon .dropdown-menu .dropdown-item:hover,
.top-header .notification-icon .dropdown-menu li:hover {
    color: var(--white) !important;
    background: var(--primary) !important;
}

.top-header .notification-icon .dropdown-menu li a:hover,
.top-header .notification-icon .dropdown-menu li a:focus {
    color: var(--white) !important;
    background: var(--primary) !important;
}

.top-header .notification-icon .dropdown-menu li:hover .card-title,
.top-header .notification-icon .dropdown-menu li:hover .card-text,
.top-header .notification-icon .dropdown-menu li:hover .card-time {
    color: var(--white) !important;
}
.top-header .notification-icon .see-more-section{
    background-color: var(--primary);
} 

.top-header .notification-icon .dropdown-menu .card-text {
    font-size: 12px;
    font-weight: 500;
    line-height: 20px;
    text-align: left;
    color: var(--black);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.top-header .notification-icon .dropdown-menu .card-time{
    font-size: 10px;
}

.top-header .notification-icon .dropdown-toggle::after {
    content: "";
    border: 0px;
}

.top-header .notification-icon .dropdown-menu img {
    display: block;
    margin-right: 10px;
    border-radius: 5px;
    object-fit: cover;
}

/* Best offers */
.best-offers-menu .nav-item .nav-link {
    /* border: 2px solid var(--primary); */
    width: 100%;
    font-family: 'Roboto';
    font-size: 20px;
    font-weight: 500;
    line-height: 23.44px;
    color: var(--primary);
    padding: 10px;
    text-align: left;
}

.best-offers-menu .nav-pills .nav-link.active,
.best-offers-menu .nav-pills .show>.nav-link {
    color: var(--white);
    background-color: var(--primary);
}

.best-offers-menu .nav-pills .nav-link.active img,
.best-offers-menu .nav-pills .show>.nav-link img {
    filter: invert(148%) sepia(48%) saturate(0%) hue-rotate(22deg) brightness(100%) contrast(263%);
}

.best-offers-menu .card {
    box-shadow: 0px 4px 4px 0px var(--shadow);
    margin: 10px 10px 0 0;
    border-radius: 20px;
    margin-bottom: 1rem;
}

.best-offers-menu .see-more {
    font-family: 'Roboto';
    font-size: 20px;
    font-weight: 700;
    line-height: 28.13px;
    text-align: center;
    color: var(--primary);
}

.best-offers-menu .content-box {
    background: var(--mercury);
    border-radius: 0px 0px 30px 0px;
}

.best-offers-menu .card .card-title {
    font-size: 18px;
    font-weight: 700;
    line-height: 25px;
    color: var(--black) !important;
    margin-bottom: 0px;
}

.best-offers-menu .card .card-text {
    font-size: 15px;
    font-weight: 400;
    line-height: 24px;
    color: var(--black) !important;
}

/* End best offers */
@media only screen and (min-width: 0px) and (max-width: 992px) {
    .top-header .form-control {
        width: 99% !important;
    }

    .top-header .navbar-brand .logo {
        width: 65%;
    }

    .top-header .form-control::placeholder {
        font-size: 13px;
    }

    .top-header .login-signup {
        font-size: 12px;
    }

    footer .top-footer .social-icons {
        display: flex;
        width: 60%;
    }
}

/* Start signup success modal */
.SignupSuccessModals .modal-content {
    border-radius: 10px;
}
.SignupSuccessModals .modal-body{
    background-repeat: no-repeat;
    background-size: cover;
    border-radius:10px;
}
.SignupSuccessModals .name{
    font-size: 20px;
    font-weight: 400;
    line-height: 45px;
    color: var(--primary);
}
.SignupSuccessModals .signupsuccess-title {
    color: var(--primary);
    font-size: 28px;
    font-weight: 700;
    line-height: 20px;
}
.SignupSuccessModals .signupsuccess-desc {
    color: var(--primary);
    font-size: 20px;
    font-weight: 500;
    line-height: 35px;
}
.SignupSuccessModals .profile-img{
    width: 5rem;
    height: 5rem;
    border: 2px solid var(--primary);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    overflow: hidden;
    margin: 0 auto; 
}
.SignupSuccessModals .btn,.SignupSuccessModals .btn:hover,.SignupSuccessModals .btn:focus{
    color: var(--white);
    background: var(--primary);
    font-size: 12px;
    font-weight: 500;
    line-height: 28px;
    border-radius: 10px;
    width: auto;
    height: auto;
    opacity: 100%;
}

.custom-dropdown {
    background-color: var(--primary);
    color: var(--white);
    height: 100vh;
    z-index: 5;
    width: 80%;
    top: 52%;
    padding: 10px 39px;
    transition: left 0.3s ease;
    left: -80%;
    border-radius: 13px 29px 13px 13px;
    box-shadow: 0px 4px 4px 0px var(--shadow);
}

.custom-dropdown .first-card {
    background: var(--primary);
    box-shadow: 0px 4px 10px 0px var(--shadow);
    border-radius: 20px;
}

.custom-dropdown .inner-list {
    align-items: center;
}

.custom-dropdown .icon {
    background: var(--white);
    padding: 10px;
    border-radius: 50%;
}

.custom-dropdown .icon:hover {
    background: #FEC107;
}

.custom-dropdown span {
    font-family: 'Roboto';
    font-size: 15px;
    font-weight: 500;
    line-height: 17.58px;
    color: var(--white);
}
.custom-dropdown .todays-deals {
    margin-top: 90%;
    font-family: 'Roboto';
    font-size: 15px;
    font-weight: 700;
    line-height: 17.58px;
}

.custom-dropdown .heading {
    margin-top: 5%;
    margin-bottom: 15%;
}

.custom-dropdown .heading span {
    font-family: 'Roboto';
    font-size: 30px;
    font-weight: 700;
    line-height: 35.16px;
}

.form-control:focus,
.form-control:active {
    box-shadow: none;
    border: 2px solid var(--primary) !important;
}

.my-error-class {
    color: red;
    margin-bottom: 0.5rem;
}

/* End top header */

/* Start Below header */
.below-header {
    background: var(--primary);
    position: sticky;
    top: -1px;
    z-index: 20;
    box-shadow: 0px 4px 4px 0px var(--shadow);
}

.below-header .logo img {
    width: 190px;
    height: 45px;
}

.below-header .menu-list {
    list-style: none;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 3rem;
    margin-bottom: 0rem;
    padding: 1rem 0rem;
}

.below-header .menu-list li {
    font-family: "Roboto", sans-serif;
    font-size: 20px;
    font-weight: 500;
    line-height: 23.44px;
    color: var(--white);
}

.below-header .logo {
    display: none;
}

.below-header .search {
    display: none;
}

.below-header .scrolled .categories-menu {
    margin: 20% 0% !important;
}

.below-header .scrolled .logo {
    display: block;
}

.below-header .scrolled .search {
    display: block;
}

.below-header .scrolled .partner, .below-header .scrolled .hotels {
    display: none;
}

.below-header .categories-menu li {
    padding: 5px 0px 0px 22px;
}

.below-header .categories-menu {
    border-radius: 0px 0px 30px 30px;
    border: 0px;
    background: var(--white);
    margin: 11% 0% !important;
}

.below-header .categories-menu {
    box-shadow: 0px 5px 10px 0px var(--shadow);
    width: 50rem !important;
}

.below-header .categories-menu .dropdown-item {
    font-family: "Roboto", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 23.44px;
    color: var(--primary);
    padding: 5px 15px;
    text-wrap: wrap;
}

.below-header .categories-menu .dropdown-item:active {
    color: var(--white);
    background: var(--primary);
}

.below-header .categories-menu .dropdown-item:active img {
    filter: invert(148%) sepia(48%) saturate(0%) hue-rotate(22deg) brightness(100%) contrast(263%);
}

.below-header .categories-menu .view-all {
    font-family: "Roboto", sans-serif;
    font-size: 18px;
    font-weight: 800;
    line-height: 21.09px;
    color: var(--primary);
}

/* Stores dropdown */
.below-header .scrolled .stores-menu {
    margin: 30% 0% !important;
}

.below-header .stores-menu li {
    padding: 5px 0px 0px 22px;
}

.below-header .stores-menu {
    border-radius: 0px 0px 30px 30px;
    border: 0px;
    background: var(--white);
    margin: 18% 0% !important;
}

.below-header .stores-menu {
    box-shadow: 0px 5px 10px 0px var(--shadow);
    width: 50rem !important;
}

.below-header .stores-menu .card {
    box-shadow: 3px 4px 4px 1px var(--shadow);
    border-radius: 5px;
    cursor: pointer;
}

.below-header .stores-menu .card .card-title {
    font-family: "Roboto", sans-serif;
    font-size: 12px;
    font-weight: 500;
    line-height: 14.06px;
    color: var(--primary);
    text-align: center;
}

.below-header .card:hover {
    box-shadow: rgba(0, 0, 0, 0.09) 0px 3px 12px;
}

.below-header .stores-menu .view-all {
    font-family: "Roboto", sans-serif;
    font-size: 18px;
    font-weight: 800;
    line-height: 21.09px;
    color: var(--primary);
}

/* End Below header */

/* Start hero section */
.hero .carousel-inner {
    box-shadow: 0px 4px 10px 0px var(--shadow);
    border-radius: 15px;
}
.hero .carousel-inner img{
    box-shadow: 0px 4px 10px 0px var(--shadow);
    border-radius: 15px;
    width: 100%;
}
.lazy-banner{
    height: 465px;
}
.hero .carousel-control-next-icon,
.carousel-control-prev-icon {
    width: 40%;
    height: 100%;
    background-size: contain;
}

.hero .carousel-control-next {
    right: -6rem;
}

.hero .carousel-control-prev {
    left: -6rem;
}

.hero .carousel-control-next,
.hero .carousel-control-prev {
    opacity: 1 !important;
}

.hero .carousel-indicators [data-bs-target] {
    height: 5px;
    opacity: 1;
}

.hero .carousel-indicators .active {
    background-color: var(--primary);
}

.hero .carousel-indicators {
    bottom: -10px;
}

/* End hero section */

/* Start steps section */
.steps-save .steps-save-row {
    background: var(--primary);
    border-radius: 20px;
    box-shadow: 0px 4px 10px 0px var(--shadow);
    padding: 20px;
}

.steps-save .steps-save-text {
    font-size: 25px;
    font-weight: 500;
    line-height: 35px;
    color: var(--white);
}

.steps-save .steps-save-text span {
    font-weight: 700;
}

.steps-save .counter {
    font-size: 40px;
    font-weight: 700;
    line-height: 35px;
    color: #00000033;
}

.steps-save .card {
    background: transparent;
    border: 0px;
    box-shadow: 0px 5px 10px 0px var(--shadow);
    border-radius: 15px;
    background: var(--white);
    transition: all 1s;
}

.steps-save .card:hover {
    transition: all .5s;
    transform: scale(1.2);
    background: var(--white);
    z-index: 5;
}

.steps-save .card img {
    width: 9%;
    height: 20%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 50%;
}

.steps-save .card .card-title {
    font-size: 20px;
    font-weight: 700;
    line-height: 35px;
    color: var(--primary);
}

.steps-save .card .card-text {
    font-size: 15px;
    font-weight: 500;
    line-height: 25px;
    color: var(--black);
}

.steps-save .below-box {
    box-shadow: 0px 5px 10px 0px var(--shadow);
    border-radius: 20px;
    background: var(--white);
    padding: 0rem 0rem;
}

.steps-save .below-box .steps-save-text {
    color: var(--primary);
    font-weight: 700;
    font-size: 20px;
}

.tips .tips-text {
    font-size: 28px;
    font-weight: 700;
    line-height: 35px;
}

/* End Tips */

/* Start Start Trending Stores */
.trending-stores .trending-stores-title {
    font-size: var(--header-fontsize);
    font-weight: var(--header-fontweight);
    line-height: var(--header-lineheight);
    color: var(--header-color);
}

.trending-stores .first-card {
    background: var(--primary) !important;
    box-shadow: 0px 4px 10px 0px var(--shadow);
    border-radius: 20px !important;
    border: none;
}

.trending-stores .first-card .card-body {
    padding: 3rem 1rem;
}

.trending-stores .featured-store {
    font-size: 20px;
    font-weight: 700;
    line-height: 35px;
    color: var(--white);
    text-align: center;
}

.trending-stores .layer {
    top: 13px;
    left: -11px;
    background: #FFFFFFCC;
    opacity: 60%;
    width: 109%;
    height: 4rem;
    border-radius: 13px;
}

.trending-stores .get-coupon-offers-btn,
.trending-stores .get-coupon-offers-btn:focus,
.trending-stores .get-coupon-offers-btn:active {
    font-size: 16px;
    font-weight: 700;
    line-height: 30px;
    text-align: center;
    border-radius: 30px;
    background: var(--white);
    color: var(--primary);
}

.trending-stores .trending-img {
    border-radius: 20px;
    background: var(--white);
    z-index: 2;
    position: relative;
}

.trending-stores .card {
    background: var(--white);
    display: flex;
    flex-direction: column;
    height: 100%;
    box-shadow: 0px 5px 10px 0px var(--shadow);
    justify-content: center;
    align-items: center;
    margin: 10px;
    border-radius: 10px;
    border: 0px;
}

.trending-stores .item {
    padding: 5px;
}

.trending-stores .item img {
    max-width: 100%;
    height: auto;
}

.trending-stores .owl-carousel .owl-prev,
.trending-stores .owl-carousel .owl-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.trending-stores .owl-carousel .owl-prev {
    left: -25px;
}

.trending-stores .owl-carousel .owl-prev img,
.trending-stores .owl-carousel .owl-next img {
    width: 50%;
}

.trending-stores .owl-carousel .owl-next {
    right: -25px;
}

.trending-stores .owl-dots {
    display: flex;
    justify-content: center;
    align-items: center;
}

.trending-stores .owl-dot {
    display: inline-block;
    margin: 0 2px;
}

.trending-stores .owl-dot span {
    display: block;
    width: 11px;
    height: 11px;
    background-color: #eae9e9;
    border-radius: 50%;
    transition: background-color 0.3s ease;
}

.trending-stores .owl-dot.active span {
    background-color: var(--primary);
    width: 15px;
    height: 15px;
}

/* End Start Trending Stores */

/* Start trending deals */
.trending-deals .trending-deals-title {
    font-size: 32px;
    font-weight: 700;
    line-height: 35px;
    color: var(--primary);
}

.trending-deals .slick-next:before {
    content: '';
    background-image: url('/assets/img/trending-deals-arrow.png');
    position: absolute;
    transform: translateY(-50%);
    width: 200%;
    height: 205%;
    right: -15px;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 50%;
    opacity: 1;
}

.trending-deals .card {
    background: var(--white);
    border: 0px;
    box-shadow: 0px 5px 10px 0px var(--shadow);
    border-radius: 10px;
}

.trending-deals .card-title {
    font-size: 30px;
    font-weight: 700;
    line-height: 35px;
    text-align: center;
    color: var(--primary);
}

.trending-deals .card-title p {
    font-family: 'Roboto', sans-serif;
    font-size: 15px;
    font-weight: 700;
    line-height: 35px;
    text-align: center;
}

.trending-deals .card-header {
    border-bottom: none;
    background: transparent;
}

.trending-deals .get-deal,
.trending-deals .get-deal:active {
    background: #FF9800;
    color: var(--white);
    box-shadow: 0px 4px 10px 0px var(--shadow);
    border-radius: 20px;
}

.trending-deals .view-more {
    background-color: var(--primary);
    box-shadow: 0px 4px 10px 0px var(--shadow);
    border-radius: 20px;
    font-size: 18px;
    font-weight: 500;
    line-height: 35px;
    text-align: center;
}

.trending-deals .view-more:hover,
.trending-deals .view-more:focus,
.trending-deals .view-more:active {
    background-color: var(--primary);
    color: var(--white);
}

.trending-deals .view-more a {
    text-decoration: none;
    color: var(--white);
}

.trending-deals .slick-initialized .slick-slide {
    margin: 10px;
}

.trending-deals .slick-next {
    right: 18px;
}

.trending-deals .view-more img {
    width: 20px;
}

/* End trending deals */

/* Start Today’s Top 99 Cashdeals */
.top-cashdeals .top-cashdeals-title {
    font-size: 28px;
    font-weight: 700;
    line-height: 35px;
    color: var(--black);
}

.top-cashdeals .nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
    color: transparent;
    background-color: transparent;
}

.top-cashdeals .nav-pills .nav-link.active span {
    color: var(--primary) !important;
    opacity: 100%;
}

.top-cashdeals .nav-pills .nav-link.active .icon {
    background: var(--white);
}

.top-cashdeals .first-card {
    background: #FEC107;
    box-shadow: 0px 4px 10px 0px var(--shadow);
    border-radius: 20px;
    border: 0px;
}

.top-cashdeals .icon {
    background: #FDD017;
    display: flex;
    opacity: 1;
    justify-content: center;
    width: 22%;
    height: 48px;
    border-radius: 50%;
    align-items: center;
}

.top-cashdeals .icon:hover {
    background: var(--white) !important;
}

.top-cashdeals span:hover {
    color: var(--white);
}

.top-cashdeals span {
    font-size: 18px;
    font-weight: 600;
    line-height: normal;
    color: var(--primary) !important;
    opacity: 50%;
}

.top-cashdeals .offer-cards {
    box-shadow: 0px 4px 10px 0px var(--shadow);
    border-radius: 20px;
}

.top-cashdeals .offer-cards .card-title {
    font-family: 'Roboto', sans-serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 28px;
    color: var(--primary);
}

.top-cashdeals .offer-cards .card-text {
    font-family: Radio Canada;
    color: var(--black);
}

.top-cashdeals .offer-cards .card-subtitle {
    font-family: "Radio Canada", sans-serif !important;
    font-size: 15px;
    font-weight: 700;
    line-height: 35px;
    color: var(--primary) !important;
}

.top-cashdeals .faded-box .card {
    opacity: 0.3;
}

.top-cashdeals .show-more {
    box-shadow: 0px 4px 10px 0px var(--shadow);
    background-color: #FEC107;
    color: var(--primary);
    font-size: 18px;
    font-weight: 600;
    line-height: 25px;
    text-align: center;
    border-radius: 30px;
}

.top-cashdeals .show-more:hover,
.top-cashdeals .show-more:focus,
.top-cashdeals .show-more:active {
    background-color: #FEC107;
    color: var(--primary);
}

/* End Today’s Top 99 Cashdeals */

/* Start offer alerts */

.offer-alerts {
    margin-top: 8rem;
    margin-bottom: 2rem;
    background: var(--primary);
    position: relative;
    padding: 2rem 0rem;
}

.offer-alerts .girl-img {
    position: absolute;
    top: -104px;
    left: 0px;
}

.offer-alerts .voucher-img {
    position: absolute;
    right: 0px;
}

.offer-alerts .offers-title {
    font-size: 50px;
    font-weight: 700;
    line-height: 65px;
    color: var(--white);
}

.offer-alerts .offers-desc {
    font-size: 18px;
    font-weight: 600;
    line-height: 25px;
    color: var(--white);
}

.offer-alerts .form-control {
    width: 409.75px;
    border-radius: 10px;
    background: #D9D0D0;
    padding: 10px 10px 10px 48px;
}

.offer-alerts .form-control::placeholder {
    color: var(--primary);
    font-size: 18px;
    font-weight: 500;
    line-height: 25px;
}

.offer-alerts .btn,
.offer-alerts .btn:focus,
.offer-alerts .btn:active {
    border-radius: 10px;
    box-shadow: 0px 4px 10px 0px var(--shadow);
    background-color: var(--white);
}

.offer-alerts .email-icon {
    top: 5px;
    left: 6px;
}

.subscribeModals .btn-close {
    position: absolute;
    top: 7%;
    right: 4%;
    z-index: 2;
}

.subscribeModals .modal-body {
    padding: 0;
}

.subscribeModals .modal-content {
    border-radius: 30px;
}

.subscribeModals .subscribe-text {
    font-size: 25px;
    font-weight: 700;
    line-height: 35px;
    color: var(--primary);
}

.subscribeModals .col-12 {
    position: relative;
    overflow: hidden;
    /* Ensure the banner stays within the modal */
}

.subscribeModals .subscribe-banner {
    position: absolute;
    top: 0;
    right: 0.7rem;
    bottom: 0;
    max-height: 100%;
}

.subscribeModals .grab-box {
    background-color: var(--primary);
    font-size: 15px;
    font-weight: 700;
    line-height: 35px;
    color: var(--white);
    text-align: left !important;
    border-radius: 0px 0px 30px 30px;
}


/* Start subscribe  */
.subscribe-cont .container {
    background: var(--primary);
    box-shadow: 0px 4px 10px 0px var(--shadow);
    border-radius: 10px;
}

.subscribe-cont .offers-title {
    font-size: 18px;
    font-weight: 700;
    line-height: 20px;
    color: var(--white);
}

.subscribe-cont .subtitle {
    font-size: 28px;
    font-weight: 700;
    line-height: 25px;
    color: var(--white);
}

.subscribe-cont .desc {
    font-size: 14px;
    font-weight: 600;
    line-height: 24px;
    color: var(--white);
}

.subscribe-cont .form-control {
    width: 100%;
    border-radius: 10px;
    background: var(--white);
    height: 3.5rem;
    padding: 10px 11rem 10px 4rem;
}

.subscribe-cont .form-control::placeholder {
    color: var(--black);
    opacity: 25%;
    font-size: 15px;
    font-weight: 500;
    line-height: 25px;
}

.subscribe-cont .email-icon {
    top: 0.7rem;
    left: 1rem;
}

.subscribe-cont .btn,
.subscribe-cont .btn:focus,
.subscribe-cont .btn:active,
.subscribe-cont .btn:hover {
    border-radius: 10px;
    box-shadow: 0px 4px 10px 0px var(--shadow);
    background-color: #FDD017;
    color: var(--primary);
    font-size: 13px;
    font-weight: 700;
    line-height: 25px;
    text-align: center;
    top: 8px;
    right: 5px;
    outline: 0 !important;
    border: 0px !important;
}

.subscribe-cont .more-saving {
    font-weight: 400;
    font-size: 20px;
}

.subscribe-now {
    animation: zoomInOut 2s infinite;
    display: inline-block;
    margin-left: 15px;
}

@keyframes zoomInOut {

    0%,
    100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.2);
    }
}

/* End offer alerts */

/* Start popular categories */
.popular-categories .popular-cat-title {
    font-size: var(--header-fontsize);
    font-weight: var(--header-fontweight);
    line-height: var(--header-lineheight);
    color: var(--header-color);
}

.popular-categories .links-parent {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0rem 2rem;
}

.popular-categories .links-parent a {
    font-size: 16px;
    font-weight: 600;
    line-height: 45px;
    color: var(--black);
    text-decoration: none;
}

.popular-categories .card {
    background: var(--white);
    border: 0px;
    border-radius: 10px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.popular-categories .card:hover {
    background: #FDD017;
}

.popular-categories .card .card-title {
    line-height: 22px;
    color: var(--black);
    font-size: 14px;
}

.popular-categories-card .card .card-title {
    line-height: 22px;
    color: var(--black);
    font-weight: 500 !important;
    font-size: 18px;
}

.popular-categories .deal-card-text {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 3em;
    font-size: 14px;
    line-height: 22px;
}

.popular-categories .item {
    padding: 7px 14px 7px 14px;
}

.popular-categories .item img {
    max-width: 100%;
    height: auto;
}

.popular-categories .owl-carousel .owl-prev,
.popular-categories .owl-carousel .owl-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.popular-categories .owl-carousel .owl-prev {
    left: -70px;
}

.popular-categories .owl-carousel .owl-prev img,
.popular-categories .owl-carousel .owl-next img {
    width: 75%;
}

.popular-categories .owl-carousel .owl-next {
    right: -70px;
}

.popular-categories .owl-dots {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 1rem;
}

.popular-categories .owl-dot {
    display: inline-block;
    margin: 0 2px;
}

.popular-categories .owl-dot span {
    display: block;
    width: 11px;
    height: 11px;
    background-color: #eae9e9;
    border-radius: 50%;
    transition: background-color 0.3s ease;
}

.popular-categories .owl-dot.active span {
    background-color: var(--primary);
    width: 15px;
    height: 15px;
}

.popular-categories .card-desc {
    font-size: 16px;
    font-weight: 500;
    line-height: 25px;
    color: var(--black);
}

.popular-categories .view-all-link {
    font-size: 14px;
    font-weight: 600;
    line-height: 40px;
    color: var(--primary);
}

/* End popular categories */

/* Start copy code section */
.copy-code-section {
    background: var(--primary);
    box-shadow: 0px 4px 10px 0px var(--shadow);
}

.copy-code-section .card-title {
    font-size: 24px;
    font-weight: 700;
    line-height: 35px;
}

.copy-code-section .subtitle {
    font-size: 16px;
    font-weight: 400;
    line-height: 28px;
}

.copy-code-section .code {
    padding: 1rem 3rem;
    border: 2px dashed var(--primary);
    font-family: Roboto, sans-serif;
    font-size: 16px;
    width: 50%;
    text-align: center;
    font-weight: 500;
    line-height: 28.13px;
    color: var(--black);
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.copy-code-section .copy-code,
.copy-code-section .copy-code:hover,
.copy-code-section .copy-code:active,
.copy-code-section .copy-code:focus {
    background: var(--primary);
    padding: 0rem 3rem !important;
    border-radius: 10px;
    font-family: 'Roboto';
    font-size: 18px;
    font-weight: 500;
    line-height: 32.81px;
    color: var(--white);
}

.copy-code-section .view-deal {
    font-size: 18px;
    font-weight: 700;
    line-height: 35px;
    color: var(--primary);
    text-decoration: none;
    text-align: center;
}

.copy-code-section .save-money-text {
    font-size: 16px;
    font-weight: 400;
    line-height: 28px;
    color: var(--black);
    text-align: center;
}

.copy-code-section .ques-btn:active,
.copy-code-section .ques-btn:hover,
.copy-code-section .ques-btn:focus {
    outline: none;
    border: 0px !important;
}

.copy-code-section .btn {
    border: 0px !important;
}

.copy-code-section .title {
    font-size: 18px;
    font-weight: 600;
    line-height: 35px;
    color: var(--black);
}

.copy-code-section .desc {
    font-size: 14px;
    font-weight: 400;
    line-height: 28px;
    color: var(--black);
    height: 250px;
    overflow-y: auto;
}

.copy-code-section .go-back {
    font-size: 18px;
    font-weight: 400;
    line-height: 35px;
    color: var(--black);
}

.copy-code-section .text-logo {
    border-bottom: 2px solid var(--black);
}

.copy-code-section .share-container {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1000;
}

.copy-code-section .share-button {
    border: none;
    color: white;
    cursor: pointer;
}

.copy-code-section .share-options {
    position: absolute;
    top: 3rem;
    right: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.copy-code-section .share-icon {
    background-color: white;
    border-radius: 50%;
    padding: 14px 6px 0px 0px;
    margin-bottom: 10px;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
    transition: transform 0.3s, opacity 0.3s;
    opacity: 0;
    transform: translateY(0);
}

.copy-code-section .share-icon img {
    width: 50%;
}

.copy-code-section .share-options.show .share-icon {
    opacity: 1;
    transform: translateY(50px);
    transition: transform 0.3s, opacity 0.3s;
}

/* End copy code section */

/* Start deal of day */
.deal-day .deal-cat-title {
    font-size: var(--header-fontsize);
    font-weight: var(--header-fontweight);
    line-height: var(--header-lineheight);
    color: var(--header-color);
}

.deal-day .card {
    background: var(--white);
    border: 0px;
    border-radius: 10px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    position: relative;
    cursor: pointer;
}

.deal-day .card:hover {
    background: var(--white);
}

.deal-day .card .btn {
    background: var(--primary);
    color: var(--white);
    box-shadow: 0px 4px 10px 0px var(--shadow);
    font-size: large;
    width: 100%;
}

.deal-day .card .card-title {
    line-height: 22px;
    color: var(--black);
    text-align: left;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 3em;
}

.deal-day .card .card-text {
    font-size: 22px;
    font-weight: 700;
    line-height: 30px;
}

.deal-day .card span {
    font-size: 14px;
    font-weight: 500;
    line-height: 25px;
    color: var(--black);
    opacity: 50%;
}

.deal-day .card .price {
    font-size: 15px;
    font-weight: 500;
    line-height: 30px;
    text-decoration: line-through;
}

.deal-day .card .stores-img,
.products-section .stores-img,
.season-mania .stores-img {
    width: 42% !important;
    height: 20%;
    margin: auto;
}

.deal-day .discount-offer,
.season-mania .discount-offer,
.products-section .discount-offer {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
    width: fit-content;
    height: 33px;
    font-size: 15px;
    font-weight: 700;
    line-height: 35px;
    color: var(--white);
    border-radius: 20px 20px 0 0;
    background-color: var(--primary);
    padding: 0 12px;
}

/* End deal of day */

/* Start footer section */
footer .top-footer {
    background-color: var(--primary);
    padding: 2rem 0rem;
    /* box-shadow: 0px 5px 20px 0px #00000080; */
}

footer .top-footer p {
    font-size: 20px;
    font-weight: 700;
    line-height: 45px;
    text-transform: uppercase;
    color: var(--white);
}

footer .top-footer a {
    font-size: 16px;
    font-weight: 500;
    line-height: 32px;
    color: var(--white);
    text-decoration: none;
}

footer .top-footer .social-icons {
    display: flex;
    width: 80%;
}

footer .top-footer .social-icons li, footer .top-footer .download-us {
    list-style-type: none;
}

footer .top-footer .social-icons li img {
    width: 80%;
}

footer .bottom-footer {
    padding: 10px 0px;
    background-color: var(--primary);
    padding: 1rem 0rem;
    border-top: 2px solid rgba(255, 255, 255, 0.4);
}

footer .grab-deals {
    font-size: 20px;
    font-weight: 700;
    line-height: 30px;
    color: var(--white);
}

footer .best-text {
    font-size: 15px;
    font-weight: 500;
    line-height: 24px;
    text-align: center;
    color: var(--white);
}

footer .bottom-footer p {
    font-size: 18px;
    font-weight: 500;
    color: var(--white);
    margin-bottom: 0px;
}

footer .contact-us,
footer .contact-us:hover,
footer .contact-us:active {
    color: var(--primary) !important;
    box-shadow: 0px 4px 10px 0px var(--shadow);
    border-radius: 10px;
}

footer .hotel_img {
    width: 34px;
}

/* End footer section */
@media only screen and (min-width: 961px) and (max-width: 1200px) {

    .top-header .form-control {
        width: 130%;
    }

    /* Start steps section */
    .steps-save .box::after {
        right: -120px;
    }

    .steps-save .counter {
        font-size: 32px;
    }

    .steps-save .box {
        margin-left: 43px;
    }

    .steps-save .box .card-title {
        font-size: 14px;
        line-height: 25px;
    }

    .steps-save .box .card-text {
        font-size: 13px;
    }

    .tips p::before {
        left: 0%;
    }

    .tips p::after {
        right: 0%;
    }

    .tips p::after {
        width: 30%;
    }

    /* End Tips */

    /* Start Start Trending Stores */
    .trending-stores .owl-carousel .owl-prev,
    .trending-stores .owl-carousel .owl-next {
        position: absolute;
        top: 45%;
        transform: translateY(-50%);
    }

    .trending-stores .owl-carousel .owl-prev {
        left: 0px;
    }

    .trending-stores .owl-carousel .owl-next {
        right: 0px;
    }

    .trending-stores .owl-prev img,
    .trending-stores .owl-next img {
        width: 70%;
    }

    /* End Start Trending Stores */
    .top-cashdeals .show-more {
        font-size: 20px;
    }

    /* Start offer alerts */
    .offer-alerts h2 {
        font-size: 42px;
    }

    .offer-alerts .girl-img {
        top: -48px;
        left: -47px;
    }

    footer .top-footer a {
        font-size: 14px;
    }

    /* End offer alerts */
}

@media only screen and (min-width: 1200px) and (max-width: 1350px) {

    /* Start steps section */
    .steps-save .box::after {
        right: -143px;
    }

    .steps-save .box .card-title {
        font-size: 16px;
        line-height: 25px;
    }

    .tips p::before {
        left: -30%;
    }

    .tips p::after {
        right: 11%;
    }

    .tips p::after {
        width: 18%;
        top: -48%;
    }

    /* End Tips */

    /* Start Start Trending Stores */
    .trending-stores .owl-carousel .owl-prev,
    .trending-stores .owl-carousel .owl-next {
        position: absolute;
        top: 45%;
        transform: translateY(-50%);
    }

    .trending-stores .owl-carousel .owl-prev {
        left: 0px;
    }

    .trending-stores .owl-carousel .owl-next {
        right: 0px;
    }

    .trending-stores .owl-prev img,
    .trending-stores .owl-next img {
        width: 70%;
    }

    /* End Start Trending Stores */

    /* Start offer alerts */
    .offer-alerts .girl-img {
        top: -48px;
        left: -24px;
    }

    /* End offer alerts */
}

/* Start login section */
.modal-backdrop.show {
    opacity: 0.8;
}

#LoginModal .modal-dialog {
    max-width: 1000px;
}

#SignupModal .modal-dialog {
    max-width: 1000px;
}

#LoginModal .modal-content,
#SignupModal .modal-content {
    border-radius: 13px;
}

#LoginModal .modal-body,
#SignupModal .modal-body {
    padding: 2rem;
}

#LoginModal .login-img-section, #SignupModal .signup-img-section{
    background-color: var(--primary);
    border-radius: 10px 0px 0px 10px;
}
#LoginModal .img-content, #SignupModal .img-content, #OTPModal .img-content{
    border-radius: 10px 0px 0px 10px;
}

#LoginModal .loginForm-section{
    padding: 2rem;
}

.btn-close {
    background: transparent url('/assets/img/cross-icon.png') center / 2em auto no-repeat;
}

#SignupModal .signupForm-section{
    padding: 2rem 2.5rem 2rem 1.5rem;
}

#LoginModal .btn-close,
#SignupModal .btn-close {
    position: absolute;
    right: 4%;
    top: 3%;
    background: unset;
    color: var(--primary);
    opacity: 1;
}

#LoginModal .title,
#SignupModal .title {
    font-size: 35px;
    font-weight: 700;
    line-height: 35px;
    color: var(--primary);
}

#LoginModal .buttons .btn,
#SignupModal .buttons .btn {
    width: 100%;
    height: 48px;
    border-radius: 10px;
    background: var(--primary);
    color: var(--white);
}

#LoginModal .buttons img,
#SignupModal .buttons img {
    top: 10px;
    left: 6px;
}

#LoginModal .or,
#SignupModal .or {
    color: var(--primary);
    font-size: 30px;
    font-weight: 700;
    line-height: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
}

#LoginModal .form-control,
#SignupModal .form-control {
    border: 2px solid var(--black);
    border-radius: 10px;
    height: 48px;
    opacity: 0.8;
}

#LoginModal .form-control::placeholder,
#SignupModal .form-control::placeholder {
    font-size: 15px;
    font-weight: 400;
    line-height: 35px;
}

#LoginModal .form-control:focus,
#SignupModal .form-control:active {
    box-shadow: none;
}

#LoginModal .form-check-input[type=checkbox],
#SignupModal .form-check-input[type=checkbox],
#MobileVerificationModal .form-check-input[type=checkbox] {
    border-radius: 6px;
}

#LoginModal .login,
#SignupModal .signup,
#SignupModal .otp {
    width: 100%;
    height: 46px;
    border-radius: 10px;
    font-size: 22px;
    font-weight: 500;
    line-height: 35px;
    text-align: center;
    background: var(--primary);
    color: var(--white);
}

#LoginModal .form-check-input,
#SignupModal .form-check-input,
#MobileVerificationModal .form-check-input {
    border: 2px solid var(--primary);
    width: 20px;
    height: 20px;
}

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

#LoginModal .form-check label,
#SignupModal .form-check label,
#MobileVerificationModal .form-check label {
    font-size: 15px;
    font-weight: 400;
    line-height: 27px;
    text-align: center;
}

#LoginModal .form-check label a,
#SignupModal .form-check label a,
#MobileVerificationModal .form-check label a {
    color: var(--primary);
    text-decoration: none;
}

#LoginModal .form-check .form-check-input,
#SignupModal .form-check .form-check-input,
#MobileVerificationModal .form-check .form-check-input{
    float: none;
}

#LoginModal .form-check-input:checked,
#SignupModal .form-check-input:checked,
#MobileVerificationModal .form-check-input:checked {
    border-color: var(--primary);
}

#LoginModal .signup-text,
#SignupModal .signup-text {
    display: flex;
    justify-content: center;
    font-weight: 400;
    line-height: 35px;
    color: var(--black);
}

#LoginModal .signup-text a,
#SignupModal .signup-text span {
    font-weight: 600;
    text-decoration: none;
    color: var(--black);
}

#LoginModal .sub-heading,
#SignupModal .sub-heading {
    font-size: 20px;
    font-weight: 700;
    line-height: 35px;
    color: var(--primary);
}

.signup-eye {
    right: 0.5rem; 
    top: 50%; 
    transform: translateY(-50%); 
    cursor: pointer;
}

/* End login section */

/* signup modal spinner */
#SignupModal .signup-spinner{
    top: 14px;
    left: 41%;
}

#SignupModal .signup-spinner-txt{
    font-size: 16px;
    top: 5px;
    left: 46%;
}
/* end signup modal spinner */

/* Start set preference modal */
#setPreferencesModal .modal-dialog {
    max-width: 850px;
}
#setPreferencesModal .modal-body{
    padding: 2rem;
}
#setPreferencesModal .title{
    font-size: 30px;
    font-weight: 700;
    line-height: 35px;
    color: var(--primary);
}
#setPreferencesModal .form-check-input[type=checkbox] {
    border-radius: 6px;
}
#setPreferencesModal .form-check-input{
    border: 2px solid var(--primary);
    width: 20px;
    height: 20px;
}
#setPreferencesModal .form-check label{
    font-size: 15px;
    font-weight: 400;
    line-height: 27px;
    text-align: center;
}
#setPreferencesModal .form-check label span{
    color: var(--primary);
}

#setPreferencesModal .form-check .form-check-input{
    float: none;
}
#setPreferencesModal .form-check-input:checked{
    border-color: var(--primary);
}
#setPreferencesModal .skip-preference{
    border-radius: 10px;
    font-size: 18px;
    font-weight: 500;
    line-height: 25px;
    text-align: center;
    background: var(--white);
    color: var(--primary);
    border : 2px solid var(--primary);
    opacity: 100%;
    height: auto;
    width: auto;
}
#setPreferencesModal .apply-preference{
    border-radius: 10px;
    font-size: 18px;
    font-weight: 500;
    line-height: 25px;
    text-align: center;
    background: var(--primary);
    color: var(--white);
}
.set-preferences-section .title{
    font-family: Roboto;
    font-size: 28px;
    font-weight: 500;
    line-height: 41.73px;
    text-decoration: underline;
}
.set-preferences-section .form-check-input[type=checkbox] {
    border-radius: 6px;
}
.set-preferences-section .form-check-input{
    border: 2px solid var(--primary);
    width: 20px;
    height: 20px;
}
.set-preferences-section .form-check label{
    font-size: 15px;
    font-weight: 400;
    line-height: 27px;
    text-align: center;
}
.set-preferences-section .form-check label span{
    color: var(--primary);
}

.set-preferences-section .form-check-input:checked{
    border-color: var(--primary);
}
.set-preferences-section .skip-preference,.set-preferences-section .skip-preference:hover,
.set-preferences-section .skip-preference:focus{
    border-radius: 10px;
    font-size: 18px;
    font-weight: 500;
    line-height: 25px;
    text-align: center;
    background: var(--white);
    color: var(--primary);
    border : 2px solid var(--primary);
    opacity: 100%;
    height: auto;
    width: auto;
}
.set-preferences-section .apply-preference-inside,.set-preferences-section .apply-preference-inside:hover,
.set-preferences-section .apply-preference-inside:focus{
    border-radius: 10px;
    font-size: 18px;
    font-weight: 500;
    line-height: 25px;
    text-align: center;
    background: var(--primary);
    color: var(--white);
    height: 40px;
    width: 9rem;
}
.set-preferences-section .bi-search,.set-preferences-section .bi-x{
    right:12px;
    top: 15px;
}
.set-preferences-section .bi-x{
    top: 6px;
}
#setPreferencesModal .setPreference-spinner{
    top: 10px;
    left: 41%;
}
/* End set preference modal */

/* Start OTP section */
#OTPModal .modal-dialog, #UpdateOTPModal .modal-dialog {
    max-width: 600px;
}

#OTPModal .OTP-section{
    padding: 1rem 2rem 0rem 0rem;
}

#OTPModal .modal-content, #UpdateOTPModal .modal-content {
    border-radius: 13px;
}

#OTPModal .modal-body {
    padding: 2rem;
}

#OTPModal .btn-close {
    color: var(--black);
    background: unset;
    position: absolute;
    opacity: 1;
    right: 2.5%;
    top: 2%;
}

#OTPModal .otp-modal-title, #UpdateOTPModal .otp-modal-title {
    font-size: 16px;
    font-weight: 600;
    line-height: unset;
    margin: 0px;
    color: var(--primary);
}

#OTPModal .sub-heading, #UpdateOTPModal .sub-heading {
    font-size: 14px;
    font-weight: 500;
    line-height: 35px;
    color: var(--primary);
}

#OTPModal .inputs input, #UpdateOTPModal .inputs input {
    width: 40px;
    height: 40px
}

#OTPModal input[type=number]::-webkit-inner-spin-button,
#OTPModal input[type=number]::-webkit-outer-spin-button,
#UpdateOTPModal input[type=number]::-webkit-inner-spin-button,
#UpdateOTPModal input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0
}

#OTPModal .otp, #UpdateOTPModal .verify_otp {
    width: 100%;
    height: 43px;
    border-radius: 10px;
    font-size: 18px;
    font-weight: 500;
    line-height: 31px;
    text-align: center;
    background: var(--primary);
    color: var(--white);
}

#OTPModal .form-control, #UpdateOTPModal .form-control {
    border: 2px solid var(--black);
    border-radius: 10px;
    height: 48px;
    opacity: 0.8;
}

#OTPModal .form-control::placeholder, #UpdateOTPModal .form-control::placeholder {
    font-size: 15px;
    font-weight: 400;
    line-height: 35px;
}

#OTPModal .form-control:focus, #UpdateOTPModal .form-control:focus {
    box-shadow: none;
}

#OTPModal .form-check label, #UpdateOTPModal .form-check label {
    font-size: 15px;
    font-weight: 400;
    line-height: 27px;
    text-align: center;
}

#OTPModal .form-check label span, #UpdateOTPModal .form-check label span {
    color: var(--primary);
}

#OTPModal .signup-text, #UpdateOTPModal .signup-text {
    display: flex;
    justify-content: center;
    font-weight: 400;
    line-height: 35px;
    color: var(--black);
}

#OTPModal .signup-text a, #UpdateOTPModal .signup-text a {
    font-weight: 600;
    text-decoration: none;
    color: var(--black);
}

#OTPModal #editMobileBtn{
    text-decoration: none; 
    padding-left: 0; 
    font-size: 15px;
}

#OTPModal #editMobileInput{
    display: none; 
    width: 97%; 
    height: 38px;
}

#OTPMoal #editMobileInput::placeholder {
    font-size: 0px; 
}

#OTPModal #editedMobileNo{
    display:none; 
    text-decoration: none; 
    padding-left: 9px; 
    font-size: unset; 
    height: 50%; 
    width: 23%; 
    background-color: var(--primary); 
    border-radius: 10px;
}

/* Start MobileVerificationModal modal */
#MobileVerificationModal .mobileVerifyForm-section{
    padding: 2rem 2rem 0rem 1.25rem;
}

#MobileVerificationModal .mobileVerify-img-section{
    background-color: var(--primary);
    border-radius: 10px 0px 0px 10px;    
}

#MobileVerificationModal .modal-dialog {
    max-width: 800px;
}

#MobileVerificationModal .modal-content {
    border-radius: 13px;
}

#MobileVerificationModal .modal-body {
    padding: 2rem;
}

#MobileVerificationModal .btn-close {
    position: absolute;
    right: 4%;
    top: 7%;
}

#MobileVerificationModal .mobile-title {
    font-size: 20px;
    font-weight: 600;
    line-height: normal;
    margin: 0px;
    color: var(--primary);
}

#MobileVerificationModal .mobile-title-below{
    color: var(--primary);
    font-size: 15px;
    line-height: 25px;
    font-weight: 500;
}

#MobileVerificationModal .sub-heading {
    font-size: 20px;
    font-weight: 600;
    line-height: 35px;
    color: var(--primary);
}

#MobileVerificationModal .otp {
    width: 100%;
    height: 43px;
    border-radius: 10px;
    font-size: 18px;
    font-weight: 500;
    line-height: 31px;
    text-align: center;
    background: var(--primary);
    color: var(--white);
}

#MobileVerificationModal .form-control {
    border: 2px solid var(--black);
    border-radius: 10px;
    height: 48px;
    opacity: 0.8;
}

#MobileVerificationModal .form-control::placeholder {
    font-size: 15px;
    font-weight: 400;
    line-height: 35px;
}

#MobileVerificationModal .form-control:focus {
    box-shadow: none;
}

#MobileVerificationModal .form-check label {
    font-size: 15px;
    font-weight: 400;
    line-height: 27px;
    text-align: center;
}

#MobileVerificationModal .form-check label span {
    color: var(--primary);
}

#MobileVerificationModal .send-otp {
    width: 100%;
    height: 46px;
    border-radius: 10px;
    font-size: 18px;
    font-weight: 500;
    line-height: 35px;
    text-align: center;
    background: var(--primary);
    color: var(--white);
}

#MobileVerificationModal .form-text {
    font-size: 15px;
    font-family: 'Poppins';
    color: var(--primary);
    line-height: 35px;
    font-weight: 500;
}

/* End MobileVerificationModal modal */

/* Start UpdateOTPModal */
#UpdateOTPModal .btn-close {
    color: var(--black);
    background: unset;
    position: absolute;
    opacity: 1;
    right: 1%;
    top: 3%;
}
#UpdateOTPModal .updateOTPImg-section{
    background-color: var(--primary);
    border-radius: 10px 0px 0px 10px;
}
#UpdateOTPModal .updateOTP-section{
    padding: 1rem 2rem 1rem 1rem;
}
/* End UpdateOTPModal */

/* End Home page */

/* Start Trending deals page */
.trending-deals-detail .trending-deals-title {
    font-size: 40px;
    font-weight: 700;
    line-height: 35px;
    color: var(--primary);
}

.trending-deals-detail .sub-heading {
    font-size: 25px;
    font-weight: 600;
    line-height: 35px;
    color: var(--primary);
}

.trending-deals-detail .filters {
    background: var(--primary);
    padding: 1rem;
    border-radius: 10px;
    box-shadow: 0px 5px 10px 0px var(--shadow);

}

.trending-deals-detail .filters .content {
    max-height: 900px;
    overflow-y: auto;
    scrollbar-width: thin !important;
    scrollbar-color: var(--white) var(--primary) !important;
    scroll-padding: 0px 10px;
}

.trending-deals-detail .filters .title {
    font-size: 20px;
    font-weight: 700;
    line-height: 20px;
    color: var(--white);
    padding-left: 0.9rem;
}

.trending-deals-detail .filters hr {
    color: var(--white);
    height: 2px;
    opacity: 1;
}

.trending-deals-detail .filters label {
    font-size: 18px;
    font-weight: 500;
    line-height: 28px;
    color: var(--white);
    margin-left: .5rem;
}

.trending-deals-detail .filters .content-title {
    font-size: 20px;
    font-weight: 700;
    line-height: 35px;
    color: var(--white);
}

.trending-deals-detail .filters .content .form-control {
    border-radius: 10px;
    height: 40px;
    padding-right: 35px;
}

.trending-deals-detail .filters .content .form-control::placeholder {
    font-size: 15px;
    font-weight: 600;
    line-height: 35px;
}

.trending-deals-detail .bi-search {
    top: 10px;
    right: 13px;
}

.trending-deals-detail .bi-x {
    cursor: pointer;
    top: 3px;
    right: 8px;
}

.trending-deals-detail .filters .clear-all {
    font-size: 10px;
    font-weight: 700;
    line-height: 35px;
    color: var(--white);
}

.trending-deals-detail .form-check {
    padding-left: 2rem;
}

.trending-deals-detail .form-check-input {
    background: #D9D9D980;
    width: 20px;
    height: 20px;
}

.form-check-input:checked[type=checkbox] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%232A55E5' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
    background-color: var(--white);
    background-repeat: no-repeat;
}

.hot-offers-input:checked[type=checkbox] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23FFFFFF' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
    background-color: #FF0000;
    background-repeat: no-repeat;
}

.warm-offers-input:checked[type=checkbox] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23FFFFFF' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
    background-color: #FFA500;
    background-repeat: no-repeat;
}

.exclusive-offers-input:checked[type=checkbox] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23FFFFFF' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
    background-color: #FDD017;
    background-repeat: no-repeat;
}

.eco-offers-input:checked[type=checkbox] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23FFFFFF' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
    background-color: #90AD1F;
    background-repeat: no-repeat;
}

.loyalty-offers-input:checked[type=checkbox] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23FFFFFF' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
    background-color: #0096FF;
    background-repeat: no-repeat;
}

.premium-offers-input:checked[type=checkbox] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23FFFFFF' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
    background-color: #A020F0;
    background-repeat: no-repeat;
}

.seasonal-offers-input:checked[type=checkbox] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23FFFFFF' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
    background-color: #FF69B3;
    background-repeat: no-repeat;
}

.clearance-offers-input:checked[type=checkbox] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23FFFFFF' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
    background-color: #ABAAA5;
    background-repeat: no-repeat;
}

.trending-deals-detail .show-more {
    font-size: 15px;
    font-weight: 600;
    line-height: 35px;
    text-align: center;
    color: var(--primary);
    box-shadow: 0px 4px 10px 0px var(--shadow);
    border-radius: 20px;
}

.trending-deals-detail .content .card {
    box-shadow: 0px 4px 10px 0px var(--shadow);
    border-radius: 10px;
    padding: 1rem;
    display: flex;
    flex-direction: column;
}

.trending-deals-detail .content .card .product-img {
    padding: 20px 50px;
}

.trending-deals-detail .content .card .card-title {
    font-size: 25px;
    font-weight: 700;
    line-height: 35px;
    color: var(--primary);
}

.trending-deals-detail .content .card .subtitle {
    font-family: 'Roboto', sans-serif;
    font-size: 15px;
    font-weight: 700;
    line-height: 2px;
    color: var(--black);
}

.trending-deals-detail .content .card .get-coupon {
    background: var(--primary);
    color: var(--white);
    box-shadow: 0px 4px 10px 0px var(--shadow);
    border-radius: 20px;
}

.trending-deals-detail .content .card .price {
    font-family: 'Roboto', sans-serif;
    font-size: 12px;
    font-weight: 700;
}

.trending-deals-detail .content .card .offer-price {
    text-decoration: line-through;
    font-weight: 400;
}

.trending-deals-detail .content .card .store-img {
    position: absolute;
    right: 0px;
    top: 5px;
}

.getCouponModal .modal-body {
    padding-right: 2rem;
}

.getCouponModal .modal-content::before {
    content: '';
    width: 80px;
    height: 100%;
    position: absolute;
    left: 0;
    background-color: var(--primary);
    border-radius: 0px 45px 45px 0px;
}

.getCouponModal .modal-content .grab {
    position: absolute;
    top: 50%;
    left: -13%;
    transform: translateY(-50%) rotate(-90deg);
    text-align: center;
    color: var(--white);
    font-size: 28px;
    font-weight: 700;
    line-height: 1;
}

.getCouponModal .btn-close {
    position: absolute;
    right: 3%;
    top: 7%;
}

.getCouponModal .img-box {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0px 0px 0px 41px;
    text-align: center;
}

.getCouponModal .product-title {
    font-size: 30px;
    font-weight: 700;
    line-height: 35px;
    text-align: right;
    color: var(--primary);
}

.getCouponModal .subtitle {
    font-family: 'Roboto', sans-serif;
    font-size: 22px;
    font-weight: 700;
    line-height: 35px;
    text-align: right;
    text-transform: uppercase;
}

.getCouponModal .price {
    font-family: 'Roboto', sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 35px;
    text-align: right;
}

.getCouponModal .offer-price {
    text-decoration: line-through;
    font-weight: 400;
}

.getCouponModal .share-url {
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 35px;
    text-align: right;
    text-transform: uppercase;
}

.getCouponModal .icon-list img {
    width: 5%;
    height: 10%;
}

.getCouponModal .box {
    border: 3px dashed var(--primary);
    border-radius: 20px;
}

.getCouponModal .code {
    font-family: 'Roboto', sans-serif;
    font-size: 12px;
    font-weight: 700;
    line-height: 35px;
    text-align: center;
    padding: 4px 9px 0px 15px;
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.getCouponModal .copy-code {
    height: 44px;
    margin: -3px -5px -3px 0px;
    border-radius: 20px;
    background-color: var(--primary);
    color: var(--white);
    font-family: 'Roboto', sans-serif;
    font-size: 12px;
    font-weight: 700;
    line-height: 35px;
    text-align: center;
    text-transform: uppercase;
}

.getCouponModal .view-deal {
    height: 44px;
    border-radius: 20px;
    background-color: var(--primary);
    color: var(--white);
    font-family: 'Roboto', sans-serif;
    font-size: 12px;
    font-weight: 700;
    line-height: 35px;
    text-align: center;
    text-transform: uppercase;
}

/* End Trending deals page */

/* Start Top cashdeals page */
.top-cashdeals-details .top-cashdeals-details-title {
    font-size: 40px;
    font-weight: 700;
    line-height: 35px;
    color: var(--primary);
}

.top-cashdeals-details .sub-heading {
    font-size: 25px;
    font-weight: 600;
    line-height: 35px;
    color: var(--primary);
}

.top-cashdeals-details .filters {
    background: var(--primary);
    padding: 1rem;
    border-radius: 10px;
    box-shadow: 0px 5px 10px 0px var(--shadow);
}

.top-cashdeals-details .filters .content {
    max-height: 900px;
    overflow-y: auto;
    scrollbar-width: thin !important;
    scrollbar-color: var(--white) var(--primary) !important;
    scroll-padding: 0px 10px;
}

.top-cashdeals-details .filters .coupon-deals-text {
    font-size: 20px;
    font-weight: 700;
    line-height: 20px;
    color: var(--white);
    padding-left: 0.9rem;
}

.top-cashdeals-details .filters hr {
    color: var(--white);
    height: 2px;
    opacity: 1;
}

.top-cashdeals-details .filters label {
    font-size: 18px;
    font-weight: 500;
    line-height: 49px;
    color: var(--white);
    margin-left: .5rem;
}

.top-cashdeals-details .filters .content-title {
    font-size: 20px;
    font-weight: 700;
    line-height: 35px;
    color: var(--white);
}

.top-cashdeals-details .filters .content .form-control {
    border-radius: 10px;
    height: 40px;
    padding-right: 35px;
}

.top-cashdeals-details .filters .content .form-control::placeholder {
    font-size: 15px;
    font-weight: 600;
    line-height: 35px;
}

.top-cashdeals-details .bi-search {
    top: 10px;
    right: 13px;
}

.top-cashdeals-details .bi-x {
    cursor: pointer;
    top: 3px;
    right: 8px;
}

.top-cashdeals-details .filters .clear-all {
    font-size: 10px;
    font-weight: 700;
    line-height: 35px;
    color: var(--white);
}

.top-cashdeals-details .content .card {
    box-shadow: 0px 4px 10px 0px var(--shadow);
    border-radius: 10px;
    padding: 1rem;
    display: flex;
    flex-direction: column;
}

.top-cashdeals-details .content .card .card-title {
    font-size: 23px;
    font-weight: 700;
    line-height: 35px;
    color: var(--black);
}

.top-cashdeals-details .content .card .subtitle {
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
}

.top-cashdeals-details .content .card a {
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 35px;
    color: var(--primary);
}

.top-cashdeals-details .form-check {
    display: flex;
    align-items: center;
}

.top-cashdeals-details .form-check-input {
    background: #D9D9D980;
    width: 225px;
    height: 42px;
    position: absolute;
    left: 15%;
    opacity: 0;
    cursor: pointer !important;
}

.top-cashdeals-details .icon {
    background: var(--white);
    display: flex;
    opacity: 1;
    justify-content: center;
    width: 20%;
    height: 45px;
    border-radius: 50%;
    align-items: center;
}

.top-cashdeals-details .form-check-input:checked[type=checkbox]+.icon,
.top-cashdeals-details .icon:hover {
    background: #FEC107;
}

/* End Top cashdeals page */

.tag {
    display: inline-block;
    background: var(--crystal);
    border-radius: 20px;
    font-size: 12px;
    font-weight: 500;
    line-height: 35px;
    text-align: center;
    color: var(--primary);
    margin-bottom: .5rem;
    margin-right: 0.8rem;
    padding: 0px 0px 0px 15px;
    transition: all 0.3s ease;
    box-shadow: rgba(9, 30, 66, 0.25) 0px 1px 1px, rgba(9, 30, 66, 0.13) 0px 0px 1px 1px;
    text-decoration: none;
}

.tag:hover {
    background: var(--primary);
    color: var(--white) !important;
    box-shadow: rgba(0, 0, 0, 0.15) 0px 2px 8px;
}

/* Get Deal modal */
.getDealModal .modal-body {
    padding-right: 2rem;
}

.getDealModal .modal-content {
    border-radius: 48px;
}

.getDealModal .modal-content .grabbox {
    content: '';
    width: 80px;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    background-color: var(--primary);
    border-radius: 0px 45px 45px 0px;
}

.getDealModal .modal-content .grab {
    position: absolute;
    top: 50%;
    left: -130%;
    transform: translateY(-50%) rotate(-90deg);
    text-align: center;
    color: var(--white);
    font-size: 28px;
    font-weight: 700;
    line-height: 1;
}

.getDealModal .btn-close {
    position: absolute;
    right: 3%;
    top: 7%;
    z-index: 4;
}

.getDealModal .column {
    padding-left: 6rem;
}

.getDealModal .getDealModal-title {
    font-size: 25px;
    font-weight: 700;
    line-height: 35px;
    color: var(--primary);
}

.getDealModal .text {
    font-size: 16px;
    font-weight: 500;
    line-height: 26px;
}

.getDealModal p {
    margin-bottom: 0;
}

.getDealModal .coupon-code {
    font-size: 20px;
    font-weight: 700;
    line-height: 35px;
    color: var(--primary);
}

.getDealModal .offer-activated {
    font-size: 15px;
    font-weight: 700;
    line-height: 35px;
    color: var(--primary);
}

.getDealModal a {
    font-size: 15px;
    font-weight: 600;
    line-height: 35px;
    color: var(--primary);
}

.getDealModal .box {
    border-radius: 20px;
    box-shadow: 0px 4px 10px 0px #00000080;
}

.getDealModal .code {
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 35px;
    text-align: center;
    padding: 4px 9px 0px 15px;
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.getDealModal .copy-code,
.getDealModal .copy-code:focus,
.getDealModal .copy-code:active {
    height: 50px;
    margin: -2px -5px -3px 0px;
    border-radius: 20px;
    background-color: var(--primary);
    color: var(--white);
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 35px;
    text-align: center;
    text-transform: uppercase;
}

.getDealModal .logo {
    position: absolute;
    right: 0px;
    top: 5px;
}

/* End All offers page */

/* Start all categories page */
.all-categories .blue-box {
    background-color: var(--primary);
    color: var(--white);
    text-align: center;
    padding-top: 4rem;
    display: flex;
    flex-direction: column;
    border-radius: 16px;
    height: 400px;
}

.all-categories .blue-box .blue-box-title {
    font-size: 30px;
    font-weight: 700;
    text-transform: uppercase;
}

.all-categories .blue-box span {
    font-size: 15px;
    font-weight: 700;
    line-height: 35px;
}

.all-categories .all-links-box {
    background: var(--crystal);
    border-radius: 10px;
    box-shadow: 0px 4px 10px 0px var(--shadow);
}

.all-categories .accordion-item:not(:first-of-type):not(:last-of-type) .accordion-button {
    border-radius: 0 !important;
}

.accordion-button.no-arrow::after {
    display: none;
}

.accordion-button::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%232A55E5'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

.accordion-button:focus {
    border-color: none !important;
    box-shadow: none !important;
}

.all-categories .accordion-item .accordion-button:hover {
    text-decoration: underline;
}

.all-categories .accordion-body {
    background: #f5f5f5;
    border-bottom: 0.2px solid #bdb9b9;
}

.all-categories .accordion-item {
    border: 0px;
}

.all-categories .accordion-button {
    padding: 12px 20px;
    font-size: 1rem;
    color: var(--primary);
    text-align: left;
    background-color: #F5F5F5;
    font-weight: 600;
}

.accordion-button:not(.collapsed) {
    background: #F5F5F5;
    box-shadow: none;
}

.all-categories .categories-count {
    font-size: 16px;
    font-weight: 700;
    line-height: 20px;
    text-align: center;
    color: var(--primary)
}

.all-categories .all-links-box .box-heading {
    background: var(--primary);
    color: var(--white);
    border-radius: 10px;
    font-size: 16px;
    font-weight: 700;
    line-height: 35px;
    text-align: center;
}

.all-categories .all-links-box a {
    font-size: 16px;
    font-weight: 500;
    line-height: 30px;
    text-decoration: none !important;
    color: var(--primary);
}

.all-categories .all-links-box a:hover {
    text-decoration: underline !important;
}

.more-filters a {
    font-family: 'Poppins';
    font-size: 15px;
    font-weight: 500;
    line-height: 30px;
    text-decoration: none !important;
    color: var(--primary);
}

.more-filters a:hover {
    text-decoration: underline !important;
}

.all-categories .popular-categories .popular-cat {
    font-size: var(--header-fontsize);
    font-weight: var(--header-fontweight);
    line-height: var(--header-lineheight);
    color: var(--primary);
}

.all-categories .popular-categories .card {
    border: 0px;
    border-radius: 10px;
    box-shadow: 0px 4px 10px 0px var(--shadow);
    text-align: center;
    cursor: pointer;
}

.all-categories .popular-categories .card .card-title {
    font-size: 15px;
    font-weight: 600;
    line-height: 25px;
    color: var(--primary);
    display: flex;
    justify-content: center;
    text-align: left;
    align-items: center;
    border-bottom: 2px solid var(--primary);
    padding-bottom: 12px;

}

.all-categories .popular-categories .card .card-title img {
    width: 20%;
    height: 20%;
    object-fit: contain;
    border-radius: 50%;
}

.all-categories .main-box .heading-box-title {
    font-size: var(--header-fontsize);
    font-weight: var(--header-fontweight);
    line-height: var(--header-lineheight); 
    color: var(--primary);
}

.all-categories .main-box span {
    font-size: 18px;
    font-weight: 600;
    line-height: 5px;
    color: var(--primary);
}

.all-categories .main-box .form-select {
    box-shadow: 4px 4px 4px 0px var(--shadow);
    background-color: var(--primary);
    font-size: 12px;
    font-weight: 700;
    line-height: 35px;
    color: var(--white);
    border-radius: 10px;
    border: 0px;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23FFF' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}

.all-categories .main-box option {
    background-color: var(--white);
    color: var(--primary);
    font-family: 'Roboto';
    font-size: 16px;
    font-weight: 500;
    line-height: 23.44px;
}

.all-categories .main-box option:hover {
    background-color: var(--primary) !important;
    color: var(--white);
}

.all-categories .main-box .form-control {
    background-color: var(--crystal);
    border: 0px;
    height: 2.5rem;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
}

.all-categories .main-box .form-control::placeholder {
    font-family: 'Roboto';
    font-size: 16px;
    font-weight: 500;
    line-height: 29.3px;
    color: #00000080;
}

.all-categories .main-box .form-control:focus {
    box-shadow: none;
}

.all-categories .main-box .bi-search {
    top: 10px;
    left: 13px;
    color: #00000080;
}

.all-categories .main-box .bi-x {
    cursor: pointer;
    top: 4px;
    right: 8px;
    color: #00000080;
}

.all-categories .heading-box::after {
    content: '';
    position: absolute;
    width: 100%;
    border: 2px solid var(--primary);
    top: 100%;
}

.all-categories .content-box span,
.all-categories .popular-categories span {
    display: block;
    font-size: 13px;
    font-weight: 600;
    line-height: 35px;
    color: var(--primary);
}

.all-categories .content-box .col-md-9 a,
.all-categories .content-box .col-6 a {
    display: block;
    font-size: 16px;
    font-weight: 600;
    line-height: 35px;
    color: var(--primary);
    cursor: pointer;
}

.all-categories .content-box .col-md-3 .btn,
.all-categories .content-box .col-6 .btn {
    color: var(--primary);
    font-size: 16px;
    font-weight: 600;
    text-align: left;
    cursor: pointer;
}

.all-categories .content-box .col-6 .btn:focus,
.all-categories .content-box .col-6 .btn:active,
.all-categories .content-box .col-md-3 .btn:focus,
.all-categories .content-box .col-md-3 .btn:active {
    border-color: transparent;
}

.all-categories .content-box ul>li {
    font-weight: 400;
    line-height: 18px;
    color: #696969 !important;
}

.all-categories .content-box ul>li a {
    color: #696969 !important;
    font-size: 14px;
}

/* End all categories page */

/* Start categories details page */
.categories-detail .filters {
    background: var(--primary);
    padding: 1rem;
    border-radius: 10px;
    box-shadow: 0px 5px 10px 0px var(--shadow);
    margin-top: 6rem;
}
.categories-detail .share-popup{
    color: var(--primary);
    cursor: pointer;
}
.categories-detail #like-page {
    color: #dddddd;
    cursor: pointer;
}
.categories-detail .favourite {
    color: #ec564a !important;
}
.categories-detail .wishlisted {
    color: var(--primary) !important;
    font-size: 16px;
}
.categories-detail .lists {
    max-height: 12rem;
    overflow-y: auto;
    scrollbar-width: thin !important;
    scrollbar-color: var(--white) #D9D9D999 !important;
    scroll-padding: 0px 0px;
}

.categories-detail .lists::-webkit-scrollbar-thumb {
    width: 50px;
    /* Increase the width as needed */
}

.categories-detail .filters .filters-method {
    font-size: 17px;
    font-weight: 700;
    line-height: 20px;
    color: var(--white);
    padding-left: 0.9rem;
}

.categories-detail .filters hr {
    color: var(--white);
    height: 2px;
    opacity: 1;
}

.categories-detail .filters label {
    font-size: 14px;
    font-weight: 500;
    line-height: 28px;
    color: var(--white);
    margin-left: .5rem;
}

.categories-detail .filters .filters-title {
    font-size: 20px;
    font-weight: 700;
    line-height: 35px;
    color: var(--white);
}

.categories-detail .filters .content .form-control {
    border-radius: 10px;
    height: 40px;
    padding-right: 35px;
}

.categories-detail .filters .content .form-control::placeholder {
    font-size: 15px;
    font-weight: 600;
    line-height: 35px;
}

.categories-detail .bi-search {
    top: 6px;
    right: 13px;
}

.categories-detail .show-more,
.categories-detail .show-more:active {
    color: var(--white);
    background: var(--primary);
    border-radius: 10px;
}

.categories-detail .view-all-offers,
.categories-detail .view-all-offers:active {
    color: var(--white);
    background: #4CAF50;
    border-radius: 10px;
}

.categories-detail .bi-x {
    cursor: pointer;
    top: 6px;
    right: 8px;
}

.categories-detail .filters .clear-all {
    font-size: 10px;
    font-weight: 700;
    line-height: 35px;
    color: var(--white);
    cursor: pointer;
}

.categories-detail .form-check {
    padding-left: 2rem;
}

.categories-detail .form-check-input {
    background: #D9D9D980;
    width: 20px;
    height: 20px;
}

.categories-detail h1 {
    font-size: 34px;
    font-weight: 700;
    color: var(--white);
}

.categories-detail .coupon-offers {
    font-size: 18px;
    font-weight: 400;
    line-height: 18px;
    color: var(--white);
}

.top-bar {
    background-color: var(--primary);
    box-shadow: 0px 4px 10px 0px var(--shadow);

}

.top-bar .badge {
    color: var(--primary);
    font-family: 'Poppins';
    font-size: 10px;
    font-weight: 700;
    text-align: left;
}

.top-bar .icons-box img {
    width: 80%;
}

.categories-detail .nav-tabs {
    background: var(--crystal);
    box-shadow: 0px 4px 10px 0px var(--shadow);
    border-radius: 10px;
    border: 0px;
    display: inline-block;
    padding: 3px 4px 4px 3px;
}

.categories-detail .partner_with_us {
    display: block;
    font-size: 18px;
    font-weight: 600;
    background-color: #FDD017;
    padding: 8px 14px;
    margin-top: 18px;
}

.categories-detail .partner_with_us:hover {
    background-color: #FDD017;
}

.categories-detail .book_hotels {
    display: block;
    font-size: 18px;
    font-weight: 500;
    background-color: var(--primary);
    border-radius: 25px;
    color: white;
    padding: 8px 14px;
    margin-top: 18px;
}

.categories-detail .book_hotels:hover {
    background-color: var(--primary);
    color: white;
}

.categories-detail .bh_img {
    width: 30px;
}

/* .categories-detail .details-and-coupon-offer-col .nav-tabs {
    background: var(--crystal);
    box-shadow: 0px 0px 0px 0px var(--shadow);
    border-radius: 10px;
    border: 0px;
    padding: 3px 4px 4px 3px;
    display: flex;
    align-items: center;
    justify-content: space-around;
} */

.categories-detail .details-and-coupon-offer {
    border: 2px solid;
    border-color: var(--primary);
    border-radius: 10px;
}

.categories-detail .nav-tabs .nav-item {
    display: inline-block;
}

.categories-detail .more-filters {
    color: var(--white);
    box-shadow: 0px 4px 10px 0px var(--shadow);
    border-radius: 10px;
}

.categories-detail .more-filters h2 {
    font-size: 18px;
    font-weight: 700;
    line-height: 30px;
    color: var(--primary);
}

.categories-detail .box-heading {
    background: var(--primary);
    color: var(--white);
    border-radius: 10px;
    font-size: 17px;
    font-weight: 700;
    line-height: 35px;
    text-align: center;
    padding: 8px 2px;
    margin: 8px 2px;
}

.categories-detail .more-filters p,
.categories-detail {
    font-family: 'Poppins';
    font-size: 15px;
    font-weight: 500;
    line-height: 30px;
    color: var(--black);
}

.categories-detail .more-filters hr {
    border: none;
    height: 2px;
    background-color: var(--primary);
    opacity: 1;
}

.categories-detail .nav-tabs .nav-link {
    font-size: 14px;
    font-weight: 600;
    line-height: 24px;
    text-align: center;
    border: 0px;
    color: var(--primary);
}

.categories-detail .nav-tabs .nav-link.active {
    border: 0px;
    background: var(--primary);
    box-shadow: 0px 4px 10px 0px var(--shadow);
    border-radius: 10px;
    color: var(--white);
}

.categories-detail .border_top::before {
    content: '';
    position: absolute;
    width: 100%;
    left: 0px;
    border: 2px solid var(--light-grey);
}

.categories-detail .advertisement_border_top::before {
    content: '';
    position: absolute;
    width: 100%;
    left: 0px;
    border: 2px solid #2b4f8c;
}

.categories-detail .contain-flag {
    position: relative;
}

.categories-detail .warm-offers,
.categories-detail .hot-offers,
.categories-detail .exclusive-offers,
.categories-detail .eco-offers,
.categories-detail .loyalty-offers,
.categories-detail .premium-offers,
.categories-detail .seasonal-offers,
.categories-detail .clearance-offers{
    position: relative;
    top: 12px;
    left: 10px;
    z-index: 1;
    width: 9rem;
    height: 33px;
    font-size: 15px;
    font-weight: 700;
    line-height: 35px;
    color: var(--white);
    padding: 0px 12px;
}

.categories-detail .advertisement-offers{
    position: relative;
    top: 12px;
    left: 10px;
    z-index: 1;
    width: fit-content;
    height: 33px;
    font-size: 15px;
    font-weight: 700;
    line-height: 35px;
    color: var(--white);
    padding: 0px 12px;
}

.categories-detail .exclusive-offers,
.categories-detail .seasonal-offers,
.categories-detail .clearance-offers,
.categories-detail .premium-offers,
.categories-detail .loyalty-offers {
    width: 10rem !important;
}

.categories-detail .clearance-offers {
    width: 11rem !important;
}

.categories-detail .eco-offers {
    width: 12rem !important;
}

.categories-detail .warm-offers,
.categories-detail .card .warm-offers-box {
    background-color: #FFA500 !important;
}

.categories-detail .hot-offers,
.categories-detail .card .hot-offers-box {
    background-color: #FF0000 !important;
}

.categories-detail .exclusive-offers,
.categories-detail .card .exclusive-offers-box {
    background-color: #FDD017 !important;
}

.categories-detail .eco-offers,
.categories-detail .card .eco-offers-box {
    background-color: #90AD1F !important;
}

.categories-detail .loyalty-offers,
.categories-detail .card .loyalty-offers-box {
    background-color: #0096FF !important;
}

.categories-detail .premium-offers,
.categories-detail .card .premium-offers-box {
    background-color: #A020F0 !important;
}

.categories-detail .seasonal-offers,
.categories-detail .card .seasonal-offers-box {
    background-color: #FF69B3 !important;
}

.categories-detail .clearance-offers,
.categories-detail .card .clearance-offers-box {
    background-color: #ABAAA5 !important;
}

.categories-detail .advertisement-offers,
.categories-detail .card .advertisement-offers-box {
    background-color: #2b4f8c !important;
}

.categories-detail .warm-offers:after,
.categories-detail .hot-offers::after,
.categories-detail .exclusive-offers::after,
.categories-detail .eco-offers::after,
.categories-detail .loyalty-offers::after,
.categories-detail .premium-offers::after,
.categories-detail .seasonal-offers::after,
.categories-detail .clearance-offers::after {
    position: absolute;
    left: 119px;
    top: 0px;
    display: block;
    width: 0;
    height: 0;
    border-top: 17px solid transparent;
    border-bottom: 16px solid transparent;
    border-right: 26px solid #ffffff;
    content: '';
}


.categories-detail .advertisemnet-offers:after {
    position: absolute;
    left: 119px;
    top: 0px;
    display: block;
    width: 0;
    height: 0;
    border-top: 17px solid transparent;
    border-bottom: 16px solid transparent;
    border-right: 26px solid #f7f7f7 !important;
    content: '';
}

.categories-detail .advertisement_card{
    background: #f7f7f7 !important;
    border: 1px solid #2b4f8c !important;
    border-left: none !important;
}

.categories-detail .exclusive-offers::after {
    left: 135px !important;
}

.categories-detail .eco-offers::after {
    left: 10.5rem !important;
}

.categories-detail .loyalty-offers::after,
.categories-detail .premium-offers::after,
.categories-detail .seasonal-offers::after,
.categories-detail .clearance-offers::after {
    left: 8.5rem !important;
}

.categories-detail .clearance-offers::after {
    left: 9.5rem !important;
}

.categories-detail .nav-tabs .nav-link:focus,
.categories-detail .nav-tabs .nav-link:hover {
    border-color: transparent;
}

.categories-detail .content-box::before {
    content: '';
    position: absolute;
    width: 100%;
    border: 2px solid var(--primary);
    margin-top: 20px;
}

.categories-detail .card {
    border-radius: 0px;
    box-shadow: 0px 8px 10px 0px #2A55E580;
    border: 0px;
    z-index: 2;
    position: relative;
}

.categories-detail .card:hover {
    box-shadow: 0 10px 20px rgba(0, 0, 0, .12), 0 4px 8px rgba(0, 0, 0, .06);
}

.categories-detail .card .grabbox {
    width: 10px;
    height: 100%;
    position: absolute;
    left: 0;
    z-index: 2;
    background-color: var(--primary);
}

.categories-detail .offers-card::before {
    background: #FC8019 !important;
}

.categories-detail .card-body {
    padding-left: 2rem;
}

.categories-detail .card .grab {
    position: absolute;
    top: 50%;
    left: -100%;
    transform: translateY(-50%) rotate(-90deg);
    text-align: center;
    color: var(--white);
    font-size: 18px;
    font-weight: 700;
    line-height: 1;
}

.categories-detail .card .card-title {
    font-size: 24px;
    font-weight: 500;
    line-height: 26px;
    color: var(--black);
}

.categories-detail .card .card-subtitle {
    font-size: 16px;
    font-weight: 500;
    line-height: normal;
}

.categories-detail .card .card-text {
    font-size: 14px;
    font-weight: 700;
    line-height: 35px;
    color: var(--primary);
    cursor: pointer;
}
.categories-detail .box {
    border: 3px dashed var(--primary);
    border-radius: 8px;
    max-width: 150px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.categories-detail .code {
    max-width: 135px;
    font-family: 'Roboto', sans-serif;
    font-size: 12px;
    font-weight: 700;
    line-height: 30px;
    text-align: center;
    padding: 4px 9px 0px 15px;
    position: absolute;
    left: 3rem;
    margin: -2px;
}

.categories-detail .sub-header a,
.categories-detail .sub-header a:hover {
    font-size: 14px;
    font-weight: 500;
    line-height: 35px;
    color: var(--black);
    cursor: pointer;
    text-decoration: none;
}

.categories-detail .copy-code,
.categories-detail .offer-btn {
    height: 40px;
    margin: -3px -5px -3px 0px;
    border-radius: 8px;
    background-color: var(--primary);
    color: var(--white);
    font-family: 'Roboto', sans-serif;
    font-size: 13px;
    font-weight: 700;
    line-height: 26px;
    text-align: center;
    text-transform: uppercase;
    z-index: 2;
    cursor: pointer;
    position: relative;
    left: 0;
    top: 0;
    max-width: 150px;
    width: 135px;
}

.categories-detail .copy-code:hover,
.categories-detail .copy-code:focus {
    background-color: var(--primary);
    color: var(--white);
}

.categories-detail .icon-list img {
    width: 21%;
    height: auto;
}

.categories-detail .used-verified {
    font-size: 14px;
    font-weight: 500;
    line-height: 35px;
    color: var(--primary);
}

.categories-detail .blank-box {
    background: transparent !important;
}

.categories-detail .detail {
    background: #DCC9C980;
    margin-top: -3%;
    display: none;
    line-height: 25px;
    transition: all 0.5s ease;
    color: var(--primary) !important;
}

.categories-detail .detail .bi-x {
    top: 34%;
    color: var(--primary);
    right: 1%;
}

.categories-detail .detail ol li {
    font-size: 16px;
    color: var(--primary);
    font-weight: 500;
    line-height: 30px;
}

.categories-detail .detail .table thead {
    background: var(--primary);
    color: var(--white);
    font-weight: 700 !important;
}

.categories-detail .detail .table {
    font-size: 16px;
    font-weight: 600;
    line-height: 15px;
    color: var(--primary);
    border-collapse: collapse;
    border-radius: 10px;
    overflow: hidden;
    border: 2px solid var(--primary);
}

.categories-detail .detail .table tr {
    border: 0px;
}

.categories-detail .coupon-deals-title {
    color: var(--primary);
    font-size: 28px;
    font-weight: 600;
}

.jquery-comments i.profile-picture {
    font-size: 2.4em !important;
    text-align: center;
}

.jquery-comments .highlight-font {
    color: var(--primary) !important;
}

.categories-detail .comments-box {
    background: #DCC9C980;
    margin-top: -3%;
    transition: all 0.5s ease;
    color: var(--primary) !important;
    display: none;
}

.getShareModal {
    background-color: var(--white);
    padding: 1rem;
    position: absolute;
    right: -15rem;
    top: 0rem;
    z-index: 5;
    border-radius: 20px;
    box-shadow: 0 1px 9px 0 rgba(0, 0, 0, .32);
    display: none;
}

.getShareModal .btn-close {
    position: absolute;
    right: 5%;
    top: 10%;
}

.getShareModal .product-title {
    font-size: 25px;
    font-weight: 700;
    line-height: 35px;
    color: var(--primary);
}

.getShareModal .share-url {
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 35px;
    text-align: right;
    text-transform: uppercase;
}

.getShareModal a {
    font-size: 16px;
    font-weight: 500;
    line-height: 35px;
    text-align: left;
    color: var(--primary);
    text-decoration: none;
}

.getShareModal a:hover {
    text-decoration: underline;
}

.getShareModal img {
    width: 10%;
    height: 10%;
}

@media only screen and (min-width: 900px) and (max-width: 1450px) {
    .categories-detail .copy-code,
    .categories-detail .offer-btn {
        width: 110px;
    }
}

/* End categories details page */

/* Start all stores page */
.all-stores .popular-cat{
    font-size: var(--header-fontsize);
    font-weight: var(--header-fontweight);
    line-height: var(--header-lineheight);
    color: var(--primary);
}

.all-stores .blue-box {
    background-color: var(--primary);
    color: var(--white);
    text-align: center;
    justify-content: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.all-stores .blue-box .blue-box-title {
    font-size: 35px;
    font-weight: 700;
    line-height: 45px;
    text-transform: uppercase;
}

.all-stores .blue-box span {
    font-size: 15px;
    font-weight: 700;
    line-height: 35px;
}

.all-stores .main-box {
    background: var(--crystal);
    border-radius: 30px 30px 0px 0px;
}

.all-stores .main-box .heading-box .main-box-title {
    font-size: var(--header-fontsize);
    font-weight: var(--header-fontweight);
    line-height: var(--header-lineheight);
    color: var(--primary);
}

.all-stores .main-box .heading-box span {
    font-size: 18px;
    font-weight: 600;
    line-height: 35px;
    color: var(--primary);
}

.all-stores .main-box .form-select {
    box-shadow: 4px 4px 4px 0px var(--shadow);
    background-color: var(--primary);
    font-size: 16px;
    font-weight: 700;
    line-height: 35px;
    color: var(--white);
    border-radius: 10px;
    border: 0px;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23FFF' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}

.all-stores .main-box option {
    background-color: var(--white);
    color: var(--primary);
    font-family: 'Roboto';
    font-size: 16px;
    font-weight: 500;
    line-height: 23.44px;
}

.all-stores .main-box option:hover {
    background-color: var(--primary) !important;
    color: var(--white);
}

.all-stores .main-box .form-control {
    background-color: var(--white);
    border: 0px;
    height: 2.5rem;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
}

.all-stores .main-box .form-control::placeholder {
    font-family: 'Roboto';
    font-size: 16px;
    font-weight: 500;
    line-height: 29.3px;
    text-align: left;
    color: #00000080;
}

.all-stores .main-box .form-control:focus {
    box-shadow: none;
}

.all-stores .main-box .bi-search {
    top: 10px;
    left: 13px;
    color: #00000080;
}

.all-stores .main-box .bi-x {
    cursor: pointer;
    top: 4px;
    right: 8px;
    color: #00000080;
}

.all-stores .heading-box::after {
    content: '';
    position: absolute;
    width: 100%;
    border: 2px solid var(--primary);
    top: 100%;
}

.all-stores .card {
    box-shadow: 0px 4px 4px 0px var(--shadow);
    border-radius: 5px;
    border: 0px;
    cursor: pointer;
}

.all-stores .card .card-title {
    font-family: 'Roboto';
    font-size: 17px;
    font-weight: 700;
    line-height: 19.92px;
    text-align: center;
    color: var(--primary);
}

.all-stores .card:hover {
    box-shadow: rgba(0, 0, 0, 0.09) 0px 3px 12px;
}

/* End all stores page */

/* Rate modal */
#RateModal .btn-close {
    position: absolute;
    top: 2%;
    right: 6%;
    z-index: 2;
}

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

.rate-modal {
    font-size: 14px;
    font-weight: 600;
    line-height: normal;
    cursor: pointer;
}

.rate-modal:hover {
    text-decoration: underline;
}

#RateModal .modal-content {
    border-radius: 30px;
}

#RateModal .rate-title {
    font-size: 23px;
    font-weight: 400;
    line-height: 35px;
    color: var(--primary);
    word-wrap: break-word;
    word-break: break-word;
}

#RateModal .col-12 {
    position: relative;
    overflow: hidden;
}

#RateModal .rate-banner {
    position: absolute;
    top: 0;
    right: 0.7rem;
    bottom: 0;
    max-height: 100%;
    width: auto !important;
}

#RateModal p {
    font-size: 16px;
    font-weight: 600;
    line-height: 22px;
    color: var(--primary);
    text-align: start;
}

#RateModal .grab-box {
    background-color: var(--primary);
    font-size: 15px;
    font-weight: 700;
    line-height: 35px;
    color: var(--white);
    text-align: left !important;
    border-radius: 0px 0px 27px 27px;
}

.rate {
    float: left;
    padding: 0px 0px 0px 6px;
}

.rate:not(:checked)>input {
    position: absolute;
    top: -9999px;
}

.rate:not(:checked)>label {
    float: right;
    width: 1em;
    overflow: hidden;
    white-space: nowrap;
    cursor: pointer;
    font-size: 40px;
    color: #ccc;
}

.rate:not(:checked)>label:before {
    content: "★ ";
}

.rate>input:checked~label {
    color: var(--primary);
}

.rate:not(:checked)>label:hover,
.rate:not(:checked)>label:hover~label {
    color: var(--primary);
}

.rate>input:checked+label:hover,
.rate>input:checked+label:hover~label,
.rate>input:checked~label:hover,
.rate>input:checked~label:hover~label,
.rate>label:hover~input:checked~label {
    color: var(--primary);
}

.rate-container {
    display: flex;
    flex-direction: column;
    align-items: start;
}

/* End rate modal */

/* Search */
.search-container .search-header {
    font-size: 18px;
    font-weight: 400;
    position: relative;
}

.search-container .search-text {
    float: right;
    color: #686868;
    font-size: 18px;
}

.search-container .search-header::after {
    position: absolute;
    bottom: -8px;
    content: " ";
    width: 85px;
    background: var(--primary);
    height: 3px;
    left: 0;
}

.search-container .card .banner {
    border-radius: 6px;
    box-shadow: 0 2px 11px 0 rgba(0, 0, 0, .14);
    max-width: 100%;
    object-fit: cover;
}

.search-container .card .logo {
    width: 100px;
    height: 40px;
    object-fit: cover;
}

.search-container .card .featured-logo {
    width: 75px;
    height: 30px;
    object-fit: cover;
}

.search-container {
    display: none;
    position: fixed;
    z-index: 9999;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: var(--white);
}

.search-container .search-field,
.search-container .search-field:focus,
.search-container .search-field:active {
    border-top: 0px !important;
    border-left: 0px !important;
    border-right: 0px !important;
    border-bottom: 1px solid var(--shadow) !important;
    border-radius: 0px;
    height: 3rem;
    font-size: 36px;
    font-weight: 400;
    color: #b3b4b4;
}

.search-container .search-field::placeholder {
    font-size: 36px;
    font-weight: 400;
    color: #b3b4b4;
}

.search-container .bi-x {
    font-size: 6rem;
    color: #cfcfcf;
    position: absolute;
    right: 0rem;
    top: -8rem;
    cursor: pointer;
}

.search-container .featured-deal .card {
    box-shadow: 0 2px 11px 0 rgba(0, 0, 0, .14);
    border: 0px;
}

.search-container .featured-deal .card .card-title,
.search-container .hottest-now .card .card-title {
    font-size: 14px;
    font-weight: 500;
    line-height: 25px;
    color: var(--primary);
}

.search-container .featured-deal .card .card-text,
.search-container .hottest-now .card .card-text {
    font-size: 13px;
    color: #212529;
}

.search-container .featured-deal a:hover,
.search-container .hottest-now a:hover {
    text-decoration: underline !important;
}

.search-container .featured-deal img {
    box-shadow: none;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.search-open {
    overflow: hidden;
}

/* End search */

/* Start 404 page */
.offer-alerts .title {
    font-size: 40px !important;
    line-height: 50px !important;
}

.offer-alerts .input {
    width: 327.75px;
}

.offer-alerts .vouchers-img {
    position: absolute;
    right: -4rem;
    top: -10rem;
}

.box-404 .msg-404 {
    font-family: 'Roboto';
    font-size: 275px;
    font-weight: 700;
    line-height: 194.27px;
    letter-spacing: 0.05em;
    color: var(--primary);
}

.box-404 img {
    top: 0rem;
    right: 34rem;
}

.box-404-section {
    background-color: var(--crystal);
    height: 18px;
    position: relative;
    width: 100%;
}

.box-404 .not-found-msg {
    font-family: 'Roboto';
    font-size: 35px;
    font-weight: 800;
    line-height: 41.02px;
    letter-spacing: 0.05em;
    color: var(--primary);
}

.box-404 .go-home,
.box-404 .go-home:hover,
.box-404 .go-home:focus {
    font-size: 18px;
    border-radius: 30px;
    font-weight: 600;
    line-height: 25px;
    text-align: center;
    box-shadow: 0px 4px 10px 0px var(--shadow);
    background: var(--primary);
    color: var(--white);
}

@media only screen and (min-width: 960px) and (max-width: 1150px) {
    .offer-alerts .vouchers-img {
        right: -1rem;
        top: 2rem;
    }

    .box-404 img {
        right: 23rem;
    }
}

@media only screen and (min-width: 1150px) and (max-width: 1300px) {
    .offer-alerts .vouchers-img {
        right: -3rem;
    }

    .box-404 img {
        right: 28rem;
    }
}

@media only screen and (min-width: 1300px) and (max-width: 1336px) {
    .offer-alerts .vouchers-img {
        right: -5rem;
    }
}

@media only screen and (min-width: 1336px) and (max-width: 1390px) {
    .offer-alerts .vouchers-img {
        right: -6rem;
    }
}

@media only screen and (min-width: 1390px) and (max-width: 1420px) {
    .offer-alerts .vouchers-img {
        right: -2rem;
    }
}

/* End 404 page */

/* Start products page */
.products-section .blue-box {
    background: var(--primary);
    box-shadow: 0px 4px 10px 0px var(--shadow);
    border-radius: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding: 2rem;
}

.products-section .blue-box .blue-box-title {
    font-size: 26px;
    font-weight: 700;
    line-height: 31px;
    color: var(--white);
}

.products-section .blue-box .blue-box-text {
    font-size: 16px;
    font-weight: 700;
    line-height: 25px;
    color: var(--white);
}

.products-section .popular-categories .popular-cat {
    font-size: var(--header-fontsize);
    font-weight: var(--header-fontweight);
    line-height: var(--header-lineheight);
    color: var(--header-color);
}

.products-section .popular-categories .card {
    border: 0px;
    border-radius: 10px;
    box-shadow: 0px 4px 10px 0px var(--shadow);
    text-align: center;
}

.products-section .popular-categories .card .card-title {
    font-size: 18px;
    font-weight: 600;
    line-height: 25px;
    color: var(--primary);
    display: flex;
    justify-content: center;
    align-items: center;
    border-bottom: 2px solid var(--primary);
    padding-bottom: 12px;
}

.products-section .popular-categories .card .card-title img {
    width: 20%;
    height: 20%;
    object-fit: contain;
    border-radius: 50%;
}

.bg-section {
    background: #D9D9D973;
}

.products-section .trending-heading-deals {
    font-size: 26px;
    font-weight: 700;
    line-height: 35px;
    color: var(--black);
}

.products-section .view-more,
.products-section .view-more:hover {
    background-color: var(--primary);
    box-shadow: 0px 4px 10px 0px var(--shadow);
    border-radius: 5px;
    font-size: 15px;
    font-weight: 500;
    line-height: 35px;
    text-align: center;
}

.products-section .view-more a {
    text-decoration: none;
    color: var(--white);
}

.products-section .view-more img {
    width: 12%;
    transform: rotate(90deg);
}

.products-section .content .card {
    box-shadow: 0px 4px 10px 0px var(--shadow);
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    margin-bottom: 1rem;
}

.products-section .content .card .card-title {
    text-align: left;
    line-height: 22px;
    color: var(--black);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 3em;
}

.products-section .content .card .subtitle {
    font-family: 'Roboto', sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 2px;
    color: var(--black);
    opacity: 80%;
}

.products-section .content .card .get-coupon {
    background: var(--primary);
    color: var(--white);
    box-shadow: 0px 4px 10px 0px var(--shadow);
    font-size: large;
    width: 100%;
}

.products-section .content .card .price {
    font-family: 'Roboto', sans-serif;
    font-size: 12px;
    font-weight: 700;
}

.products-section .content .card .offer-price {
    text-decoration: line-through;
    font-weight: 400;
}

.products-section .content .card .store-img {
    right: 0.4rem;
    top: 0px;
    width: 60%;
    height: 12%;
}

.products-section .start-saving {
    background: var(--primary);
    box-shadow: 0px 4px 10px 0px var(--shadow);
    padding: 1rem;
    border-radius: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.products-section .start-saving .card {
    background: transparent;
    border: none !important;
}

.products-section .start-saving .card .card-title {
    font-size: 13px;
    font-weight: 700;
    line-height: 25px;
    color: var(--white);
}

.products-section .start-saving .form-control {
    background: #EEEEEE;
}

.products-section .start-saving .form-control::placeholder {
    font-size: 13px;
    font-weight: 400;
    line-height: 35px;
    color: var(--primary);
}

.products-section .start-saving .start-saving-btn {
    font-size: 14px;
    font-weight: 600;
    line-height: 25px;
    color: var(--primary);
    box-shadow: 0px 4px 10px 0px var(--shadow);
    background: #EEEEEE;
}

.products-section .shop-store .card {
    box-shadow: 0px 4px 10px 0px var(--shadow);
    border-radius: 5px;
    padding: 1rem;
}

.products-section .show-more,
.products-section .show-more:hover {
    background-color: var(--primary);
    box-shadow: 0px 4px 10px 0px var(--shadow);
    border-radius: 5px;
    font-size: 15px;
    font-weight: 500;
    line-height: 35px;
    text-align: center;
    color: var(--white);
}

.products-section .description .heading {
    font-size: 20px;
    font-weight: 600;
    line-height: 25px;
    color: var(--black);
}

.products-section .description .desc {
    font-size: 15px;
    font-weight: 400;
    line-height: 25px;
    color: var(--black);
}

.products-section .owl-carousel .owl-prev,
.products-section .owl-carousel .owl-next {
    position: absolute;
    top: 45%;
    transform: translateY(-45%);
}

.products-section .owl-carousel .owl-prev {
    left: -80px;
}

.products-section .owl-carousel .owl-prev img,
.products-section .owl-carousel .owl-next img {
    width: 65%;
}

.products-section .owl-carousel .owl-next {
    right: -80px;
}

/* End products page */

/* Start loader */
.loader-box {
    display: inline-block;
    font-size: 30px;
    color: var(--primary);
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    margin-top: 5rem;
    margin-bottom: 0.25em;
    vertical-align: top;
    transition: 0.3s color, 0.3s border, 0.3s transform, 0.3s opacity;
}

.loader-box:hover {
    color: var(--white);
    background-color: rgba(0, 0, 0, 0.1);
    font-size: 0;
    padding: 0;
    border-width: 3px;
    line-height: 200px;
    opacity: 1;
    transform: scale(1.2);
    z-index: 2;
}

.loader {
    display: inline-block;
    width: 1em;
    height: 1em;
    color: inherit;
    vertical-align: middle;
    pointer-events: none;
}

.loader:before,
.loader:after,
.loader {
    border-radius: 50%;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation: loader 1.8s infinite ease-in-out;
    animation: loader 1.8s infinite ease-in-out;
}

.loader {
    color: currentcolor;
    position: relative;
    transform: translateZ(0);
    -webkit-animation-delay: -0.16s;
    animation-delay: -0.16s;
    top: -1em;
}

.loader:before {
    right: 100%;
    -webkit-animation-delay: -0.32s;
    animation-delay: -0.32s;
}

.loader:after {
    left: 100%;
}

.loader:before,
.loader:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    width: inherit;
    height: inherit;
}

@-webkit-keyframes loader {

    0%,
    80%,
    100% {
        box-shadow: 0 1em 0 -1em;
    }

    40% {
        box-shadow: 0 1em 0 -0.2em;
    }
}

@keyframes loader {

    0%,
    80%,
    100% {
        box-shadow: 0 1em 0 -1em;
    }

    40% {
        box-shadow: 0 1em 0 -0.2em;
    }
}

/* Start share and earn */
.share-earn .hero {
    box-shadow: 0px 4px 10px 0px var(--shadow);
    border-radius: 50px;
}

.share-earn .share-earn {
    font-size: 20px;
    font-weight: 600;
    line-height: 68px;
    color: var(--primary);
}

.share-earn .header {
    font-size: 45px;
    font-weight: 700;
    line-height: 60px;
}

.share-earn .sub-header {
    font-size: 22px;
    font-weight: 600;
    line-height: 35px;
    color: var(--primary);
}

.share-earn label {
    font-size: 15px;
    font-weight: 600;
    line-height: 68px;
    opacity: 30%;
    color: var(--black);
}

.share-earn .form-control {
    border-radius: 50px;
    background: #F2F2F2;
    padding: 10px 10px 10px 48px;
    border: 0;
}

.share-earn .form-control::placeholder {
    color: var(--black);
    font-size: 15px;
    font-weight: 700;
    line-height: 25px;
    opacity: 40%;
}

.share-earn .btn,
.share-earn .btn:focus,
.share-earn .btn:active {
    border-radius: 50px;
    background-color: var(--primary);
    color: var(--white);
    font-size: 16px;
    font-weight: 700;
    line-height: 25px;
    text-align: center;
}

.share-earn .user-icon {
    top: 8px;
    left: 11px;
}

/* Start how it works */
.how-work .how-work-title {
    font-size: 28px;
    font-weight: 700;
    line-height: 35px;
}

.how-work .card {
    border: 0;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    border-radius: 50px;
}

.how-work .card .card-title {
    font-size: 24px;
    font-weight: 700;
    line-height: 45px;
}

.how-work .card .card-text {
    font-size: 14px;
    font-weight: 600;
    line-height: 30px;
}

.how-work .card .how-works-signup {
    border: 10px solid #FF0000;
    border-radius: 50px;
}

.how-work .card .how-works-share {
    border: 10px solid #FFA500;
    border-radius: 50px;
}

.how-work .card .how-works-earn {
    border: 10px solid #0096FF;
    border-radius: 50px;
}

.bg-how-work {
    background-size: 100% 100%;
    width: 100%;
    height: 44%;
    top: 30%;
    position: absolute;
    left: 0;
}

/* Calculate earning */
.calc-earning .calc-earning-title {
    font-size: 28px;
    font-weight: 700;
    line-height: 35px;
}

.calc-earning .calc-earning-desc {
    font-size: 20px;
    font-weight: 500;
    line-height: 35px;
}

.calc-earning .card {
    background: var(--primary);
    text-align: center;
    color: var(--white);
    border-radius: 50px;
}

.calc-earning .card .card-title {
    font-size: 25px;
    font-weight: 700;
    line-height: 45px;
}

.calc-earning .card .card-text {
    font-size: 35px;
    font-weight: 700;
    line-height: 45px;
}

.calc-earning .card span {
    font-size: 16px;
    font-weight: 700;
    line-height: 75px;
}

.calc-earning .btn,
.calc-earning .btn:focus,
.calc-earning .btn:active {
    border-radius: 50px;
    background-color: var(--white);
    color: var(--primary);
    font-size: 16px;
    font-weight: 700;
    line-height: 25px;
    text-align: center;
}

.calc-earning .box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    border-radius: 50px;
    padding: 1rem;
    margin-top: 1rem;
}

.calc-earning .box .icon {
    background: #CECECE;
    border-radius: 50%;
}

.calc-earning .box .progress-box p {
    font-size: 20px;
    font-weight: 500;
    line-height: 35px;
}

.calc-earning .price {
    font-size: 25px;
    font-weight: 700;
    line-height: 35px;
    color: var(--primary);
}

.calc-earning input[type="range"] {
    /* -webkit-appearance: none;
    appearance: none; */
    background: transparent;
    cursor: pointer;
    width: 337px;
    height: 3px;
}

.calc-earning input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    background-color: var(--primary);
    height: 24px;
    width: 24px;
    border-radius: 50%;
}

/* Start testimonial */
.testimonial .testimonial-title {
    font-size: 28px;
    font-weight: 700;
    line-height: 35px;
}

.testimonial .testimonial-desc {
    font-size: 20px;
    font-weight: 500;
    line-height: 45px;
}

.testimonial .testimonial-name {
    font-size: 20px;
    line-height: 55px;
}

.testimonial span {
    font-weight: 700;
}

.testimonial .carousel-inner {
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    padding: 2rem;
    border-radius: 50px;
}

.testimonial .carousel-inner .side-img {
    width: 50%;
}

.testimonial .quote {
    position: absolute;
    top: 0rem;
    left: -1rem;
    width: 5%;
}

.carousel-dark .carousel-indicators [data-bs-target] {
    background-color: var(--primary);
    width: 15px;
}

/* Start faq */
.faq .faq-title {
    font-size: var(--header-fontsize);
    font-weight: var(--header-fontweight);
    line-height: var(--header-lineheight);
}

.faq .accordion-button:not(.collapsed),
.faq .accordion-button:focus {
    outline: none;
    border-color: transparent;
    box-shadow: none;
    background-color: transparent;
}

.faq .accordion-item {
    color: var(--bs-accordion-color);
    background-color: transparent;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    margin-bottom: 1.5rem;
    border-radius: 10px !important;
}

.faq .accordion-button::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' fill='%232A55E5' class='bi bi-plus' viewBox='0 0 16 16'%3E%3Cpath d='M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z'/%3E%3C/svg%3E");
}

.faq .accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' fill='%232A55E5' class='bi bi-dash' viewBox='0 0 16 16'%3E%3Cpath d='M4 8a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7A.5.5 0 0 1 4 8z'/%3E%3C/svg%3E");
}

.faq .accordion-item .accordion-header {
    padding: 0.5rem;
}

.faq .accordion-item .accordion-header .accordion-button {
    padding: 0.5rem;
    font-size: 20px !important;
    font-weight: 600 !important;
    line-height: 35px !important;
    color: var(--primary);
}

.faq .accordion-item .accordion-body {
    font-size: 20px;
    font-weight: 500;
    line-height: 35px;
    color: var(--black);
}

.how-work-below {
    background-color: var(--primary);
    border-radius: 131px 131px 0px 0px;
    margin-top: 5rem;
}

.how-work-below .row {
    position: relative;
    top: -6rem;
}

/* End share and earn */

/* Start about us */
.about-us h1 {
    font-size: 35px;
    font-weight: 500;
    line-height: 35px;
    color: var(--primary);
}

.about-us h2 {
    font-size: 25px;
    font-weight: 500;
    line-height: 35px;
    color: var(--primary);
}

.about-us p {
    font-size: 18px;
    font-weight: 400;
    line-height: 25px;
    color: var(--black);
}

/* Start best offer page */
.best-offers .blue-box {
    background-color: var(--primary);
    color: var(--white);
    border-radius: 0px;
    height: auto;
}

.best-offers .blue-box .main-title {
    font-size: 22px;
    line-height: 25px;
    text-transform: capitalize;
    font-weight: 700;
}

.best-offers .blue-box span {
    font-size: 15px;
    line-height: 25px;
    font-size: 10px;
}

.best-offers .all-links-box .box-heading {
    background: var(--primary);
    color: var(--white);
    border-radius: 10px;
    font-size: 16px;
    font-weight: 700;
    line-height: 35px;
    text-align: center;
}

.best-offers .main-box .form-control {
    background-color: var(--crystal);
    border: 0px;
    height: 46px;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
}

.best-offers .main-box .form-control::placeholder {
    font-family: 'Roboto';
    font-size: 12px;
    font-weight: 500;
    line-height: 29.3px;
    color: #00000080;
}

.best-offers .main-box .bi-x {
    cursor: pointer;
    top: 7px;
    right: 8px;
    color: #00000080;
}

.best-offers .main-box .bi-search {
    top: 1rem;
    left: 1rem;
    color: #00000080;
}

.best-offers .card {
    box-shadow: 0px 4px 4px 0px var(--shadow);
    margin: 10px 10px 0 0;
    border-radius: 20px;
    margin-bottom: 1rem;
}

.best-offers .card .img-fluid {
    width: 30%;
    height: 15%;
}

.best-offers .see-more {
    font-family: 'Roboto';
    font-size: 15px;
    font-weight: 700;
    line-height: 28.13px;
    text-align: center;
    color: var(--primary);
}

.best-offers .content-box {
    background: var(--mercury);
    border-radius: 15px;
}

.best-offers .card .card-title {
    font-size: 16px;
    font-weight: 700;
    line-height: 25px;
    color: var(--black) !important;
}

.best-offers .card .card-text {
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
    color: var(--black) !important;
}

.best-offers .icon {
    font-family: 'Roboto';
    padding: 18px;
    background: var(--mercury);
    opacity: 70%;
    border-radius: 50%;
}

.best-offers .icon:hover {
    background: var(--mercury) !important;
    opacity: 100%;
}

.best-offers span:hover,
.best-offers span:active {
    color: var(--primary);
    opacity: 100%;
}

.best-offers span {
    font-size: 10px;
    font-weight: 600;
    line-height: normal;
    color: var(--primary) !important;
    opacity: 50%;
}

.best-offers .nav-pills .nav-link.active,
.best-offers .nav-pills .show>.nav-link {
    background: transparent;
    color: transparent;
}

.best-offers .nav-pills .nav-link.active .icon,
.best-offers .nav-pills .show>.nav-link .icon {
    background: var(--mercury);
    opacity: 100%;
}

.best-offers .owl-carousel .owl-prev,
.best-offers .owl-carousel .owl-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.best-offers .owl-carousel .owl-prev {
    left: 0px;
}

.best-offers .owl-carousel .owl-prev img,
.best-offers .owl-carousel .owl-next img {
    width: 30%;
}

.best-offers .owl-carousel .owl-next {
    right: 0px;
}

.best-offers .nav-pills .nav-link.active span,
.best-offers .nav-pills .show>.nav-link span {
    color: var(--primary);
    opacity: 100%;
}


/* Desktop */
.best-offers-desktop .main-title {
    font-size: var(--header-fontsize);
    line-height: var(--header-lineheight);
    text-transform: capitalize;
    font-weight: var(--header-fontweight);
}

.best-offers-desktop span {
    font-size: 15px;
    line-height: 25px;
    font-size: 10px;
}

.best-offers-desktop .main-box .form-control {
    background-color: var(--crystal);
    border: 0px;
    height: 2.5rem;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
}

.best-offers-desktop .main-box .form-control::placeholder {
    font-family: 'Roboto';
    font-size: 18px;
    font-weight: 500;
    line-height: 29.3px;
    color: #00000080;
}

.best-offers-desktop .main-box .bi-x {
    cursor: pointer;
    top: 4px;
    right: 1rem;
    color: #00000080;
    font-size: 20px;
}

.best-offers-desktop .main-box .bi-search {
    top: 6px;
    left: 1rem;
    color: #00000080;
    font-size: 18px;
}

.best-offers-desktop .card {
    box-shadow: 0px 4px 4px 0px var(--shadow);
    margin: 0px 0px 0 0;
    border-radius: 10px;
    margin-bottom: 1rem;
}

.best-offers-desktop .card .img-fluid {
    width: 35%;
}

.best-offers-desktop .see-more {
    font-family: 'Roboto';
    font-size: 20px;
    font-weight: 700;
    line-height: 28.13px;
    text-align: center;
    color: var(--primary);
}

.best-offers-desktop .content-box {
    background: var(--mercury);
    border-radius: 10px;
}

.best-offers-desktop .card .card-title {
    font-size: 18px;
    font-weight: 700;
    line-height: 21px;
    color: var(--black) !important;
}

.best-offers-desktop .card .card-text {
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    color: var(--black) !important;
}

.best-offers-desktop .icon {
    font-family: 'Roboto';
    padding: 18px;
    background: var(--white);
    border-radius: 50%;
}

.best-offers-desktop .icon:hover {
    background: var(--mercury) !important;
}

.best-offers-desktop span:hover,
.best-offers-desktop span:active {
    color: var(--primary);
}

.best-offers-desktop span {
    font-size: 15px;
    font-weight: 600;
    line-height: normal;
    color: var(--white) !important;
    text-align: left;
}

.best-offers-desktop .nav-pills {
    background-color: var(--primary);
    color: var(--white);
    border-radius: 15px;
}

.best-offers-desktop .nav-pills img {
    filter: invert(148%) sepia(48%) saturate(0%) hue-rotate(22deg) brightness(100%) contrast(263%);
}

.best-offers-desktop .nav-pills .nav-link.active,
.best-offers-desktop .nav-pills .show>.nav-link {
    background: var(--white);
    color: var(--primary);
}

.best-offers-desktop .nav-pills .nav-link.active img {
    filter: unset;
}

.best-offers-desktop .nav-pills .nav-link.active span,
.best-offers-desktop .nav-pills .show>.nav-link span {
    color: var(--primary) !important;
}

/* End best offer page */

/* Start popular categories icon */
.popular-categories-icons .popular-cat-title {
    font-size: 28px;
    font-weight: 700;
    line-height: 35px;
    color: var(--black);
}

.popular-categories-icons .item {
    margin-right: 10px;
}

.horizontal-cat {
    margin: 5px;
    border-radius: 8px;
    background: var(--white);
    border: 0px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px
}

.horizontal-cat:hover {
    background: #FEC107;
}

.popular-categories-icons .icon {
    width: 50%;
    height: 20%;
    padding: 20px;
    margin: 0 auto;
    cursor: pointer;
}

.popular-categories-icons .icon:hover {
    background: #FEC107;
}

.popular-categories-icons .card-title {
    font-family: 'Roboto';
    border-top: 1px solid grey;
    font-size: 18px;
    font-weight: 400;
    line-height: 28.88px;
    text-align: center;
    color: var(--black);
}

.popular-categories-icons .owl-carousel .owl-prev,
.popular-categories-icons .owl-carousel .owl-next {
    position: absolute;
    top: 45%;
    transform: translateY(-45%);
}

.popular-categories-icons .owl-carousel .owl-prev {
    left: -25px;
}

.popular-categories-icons .owl-carousel .owl-prev img,
.popular-categories-icons .owl-carousel .owl-next img {
    width: 50%;
}

.popular-categories-icons .owl-carousel .owl-next {
    right: -25px;
}

.popular-categories-icons .owl-dots {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 2rem 0 0;
}

.popular-categories-icons .owl-dot {
    display: inline-block;
    margin: 0 2px;
}

.popular-categories-icons .owl-dot span {
    display: block;
    width: 11px;
    height: 11px;
    background-color: #eae9e9;
    border-radius: 50%;
    transition: background-color 0.3s ease;
}

.popular-categories-icons .owl-dot.active span {
    background-color: var(--primary);
    width: 15px;
    height: 15px;
}

.popular-categories-icons .categories-mobile {
    gap: 2.2rem;
    overflow-x: auto;
    scroll-behavior: smooth;
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.popular-categories-icons .categories-mobile::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.popular-categories-icons .mobile-icon {
    background: #dcdcdc;
    border-radius: 50%;
    cursor: pointer;
    width: 50px;
    height: 50px;
    align-items: center;
    justify-content: center;
}

.popular-categories-icons .mobile-icon:hover {
    background: #FEC107;
}

.popular-categories-icons .mobile-icon img {
    max-width: 60%;
    max-height: 60%;
    object-fit: contain;
}

/* End popular categories icon */

/* Start season mania */
.season-mania .season-mania-title {
    font-size: var(--header-fontsize);
    font-weight: var(--header-fontweight);
    line-height: var(--header-lineheight);
    color: var(--header-color);
    background-color: white;
    width: fit-content;
    margin-top: 10px;
    margin-left: 26px;
    border-radius: 15px;
}

.season-mania .container {
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    background-size: 100% 100%;
}

.season-mania .card {
    background: var(--white);
    border: 0px;
    border-radius: 12px;
    position: relative;
    cursor: pointer;
    transition: all 0.5s ease;
    transform: scale(1);
}

.season-mania .card .btn {
    background: var(--primary);
    color: var(--white);
    box-shadow: 0px 4px 10px 0px var(--shadow);
    font-size: large;
    width: 100%;
}

.season-mania .card .card-title {
    font-size: 16px;
    font-weight: 400;
    line-height: 26px;
    text-align: left;
    color: var(--black);
}

.season-mania .card .card-text {
    font-size: 22px;
    font-weight: 700;
    line-height: 30px;
}

.season-mania .card span {
    font-size: 12px;
    font-weight: 500;
    line-height: 25px;
    color: var(--black);
    opacity: 50%;
}

.season-mania .item {
    padding: 7px 14px 7px 14px;
}

.season-mania .stores-img {
    border-radius: 5px;
    margin-bottom: 10px;
}

.season-mania .owl-carousel .owl-prev,
.season-mania .owl-carousel .owl-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.season-mania .owl-carousel .owl-prev {
    left: -95px;
}

.season-mania .owl-carousel .owl-prev img,
.season-mania .owl-carousel .owl-next img {
    width: 75%;
}

.season-mania .owl-carousel .owl-next {
    right: -95px;
}


/* Start show coupon modal */
.showCouponModal .modal-content {
    border-radius: 50px;
}

.showCouponModal .btn-close {
    position: absolute;
    top: 7%;
    right: 4%;
    z-index: 2;
}

.showCouponModal .card-title {
    font-size: 24px;
    font-weight: 700;
    line-height: 35px;
}

.showCouponModal .subtitle {
    font-size: 16px;
    font-weight: 400;
    line-height: 28px;
}

.showCouponModal .code {
    padding: 1rem 3rem;
    border: 2px dashed var(--primary);
    font-family: Roboto, sans-serif;
    font-size: 16px;
    width: 75%;
    text-align: center;
    font-weight: 500;
    line-height: 28.13px;
    color: var(--black);
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
}

.showCouponModal .copy-code,
.showCouponModal .copy-code:hover,
.showCouponModal .copy-code:active,
.showCouponModal .copy-code:focus {
    background: var(--primary);
    padding: 0rem 3rem !important;
    border-radius: 10px;
    font-family: 'Roboto';
    font-size: 18px;
    font-weight: 500;
    line-height: 32.81px;
    color: var(--white);
}

.showCouponModal .view-deal {
    font-size: 18px;
    font-weight: 700;
    line-height: 35px;
    color: var(--primary);
    text-decoration: none;
}

.showCouponModal .save-money-text {
    font-size: 16px;
    font-weight: 400;
    line-height: 28px;
    color: var(--black);
}

.showCouponModal .store-img {
    position: relative;
    top: 0px;
    width: 16%;
}

.showCouponModal .ques-btn:active,
.showCouponModal .ques-btn:hover,
.showCouponModal .ques-btn:focus {
    outline: none;
    border: 0px !important;
}

.showCouponModal .title {
    font-size: 18px;
    font-weight: 600;
    line-height: 35px;
    color: var(--black);
}

.showCouponModal .desc {
    font-size: 14px;
    font-weight: 400;
    line-height: 28px;
    color: var(--black);
    height: 10rem;
    overflow-x: hidden;
    scrollbar-width: thin !important;
}

.showCouponModal .btn {
    border: 0px !important;
}

/* Start get deal modal */
.getDealModals .modal-content {
    border-radius: 10px;
}

.getDealModals .btn-close {
    position: absolute;
    top: 7%;
    right: 4%;
    z-index: 2;
}

.getDealModals .card-title {
    font-size: 24px;
    font-weight: 700;
    line-height: 35px;
}

.getDealModals .subtitle {
    font-size: 16px;
    font-weight: 400;
    line-height: 35px;
}

.getDealModals .deal-activated,
.getDealModals .deal-activated:hover,
.getDealModals .deal-activated:active,
.getDealModals .deal-activated:focus {
    background: var(--primary);
    padding: 0.5rem 6rem !important;
    border-radius: 10px;
    font-family: 'Roboto';
    font-size: 18px;
    font-weight: 500;
    line-height: 32.81px;
    color: var(--white);
}

.getDealModals .view-deal {
    font-size: 18px;
    font-weight: 700;
    line-height: 35px;
    color: var(--primary);
    text-decoration: none;
}

.getDealModals .save-money-text {
    font-size: 16px;
    font-weight: 400;
    line-height: 28px;
    color: var(--black);
}

.getDealModals .store-img {
    position: relative;
    top: 0px;
    width: 16%;
}

.getDealModals .ques-btn:active,
.getDealModals .ques-btn:hover,
.getDealModals .ques-btn:focus {
    outline: none;
    border: 0px !important;
}

.getDealModals .btn {
    border: 0px !important;
}

.getDealModals .yes:hover,
.showCouponModal .yes:hover,
.copy-code-section .yes:hover {
    background: #198754 !important;
    color: white !important;
}

.getDealModals .no:hover,
.showCouponModal .no:hover,
.copy-code-section .no:hover {
    background: #dc3545 !important;
    color: white !important;
}

.save-text-box {
    display: flex;
}

.no-issue {
    font-size: 10px;
}

.no-issue:hover {
    background: #dc3545 !important;
    color: white !important;
}

.input-form-box {
    left: 25%;
    width: 50%;
}

.input-form-box .form-control,
.input-form-box .form-control:focus,
.input-form-box .form-control:active {
    border-top: 0px !important;
    border-left: 0px !important;
    border-right: 0px !important;
    border-radius: 0px !important;
}

.input-form-box .btn {
    position: absolute;
    top: 0px;
    right: 0px;
}

/* Start redirection */
.redirection .box {
    display: flex;
    justify-content: center;
    align-items: center;
}

.redirection .card {
    border: 1px solid #000000;
    border-radius: 50px;
    max-width: 42rem;
    margin: auto;
}

.redirection .card .card-title {
    font-size: 34px;
    font-weight: 600;
    line-height: 40px;
    text-align: center;
    color: var(--primary);
}

.redirection .card .card-text {
    font-size: 20px;
    font-weight: 400;
    line-height: 36px;
    text-align: center;
    color: var(--black);
}

.redirection .card .below-text {
    font-size: 18px;
    font-weight: 400;
    line-height: 24px;
    text-align: center;
    color: var(--black);
    border-top: 1px solid var(--black);
}

.redirection-header {
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0px 1px 2px 0px var(--shadow);
}

.redirection .loadings .from-img {
    width: 9%;
    margin-left: 9rem;
}

.redirection .loadings .to-img {
    width: 12%;
    margin-right: 9rem;
}

.redirection .loadings .loaders-img {
    width: 22%;
}

.redirection .loadings {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}

.redirection .loaders {
    display: flex;
    align-items: center;
    justify-content: center;
}

#subscribe_email-error {
    color: var(--white);
}

/* Start search-result */
#search-result .card {
    box-shadow: rgba(0, 0, 0, 0.15) 0px 2px 8px;
    border: 0px;
}

#search-result .card:hover {
    box-shadow: rgba(0, 0, 0, 0.08) 0px 4px 12px;
}

#search-result .card .card-title {
    font-size: 16px;
    color: var(--black);
    font-weight: 600;
}

#search-result .card .card-subtitle {
    font-size: 12px;
    color: var(--black);
    font-weight: 500;
}

/* nav tabs */
.nav-sticky-tabs-desktop {
    position: sticky;
    top: 3.5rem;
    z-index: 10;
    display: none;
}

.nav-sticky-tabs-desktop .categories-detail h1 {
    color: var(--primary) !important;
}

/* Start profile */
.profile .container {
    background: var(--primary);
    box-shadow: 0px 3px 4px 0px var(--shadow);
    border-radius: 12px;
}

.profile .profile-name span {
    font-size: 25px;
    font-weight: 500;
    line-height: 30px;
    color: var(--white);
}

.profile .profile-name p {
    font-size: 30px;
    font-weight: 700;
    line-height: 35px;
    color: var(--white);
}

.profile .btn,
.profile .btn:active,
.profile .btn:focus,
.profile .btn:hover {
    font-family: Roboto;
    font-size: 18px;
    font-weight: 500;
    line-height: 35.16px;
    background: var(--white);
    color: var(--black);
    box-shadow: 0px 1px 8px 0px var(--shadow);
    border-radius: 15px;
}

.profile .btn i {
    color: var(--primary);
}

.profile .avatar-upload {
    position: relative;
    max-width: 205px;
    margin: 50px auto;
}

.profile .avatar-upload .avatar-edit {
    position: absolute;
    right: 12px;
    z-index: 1;
    top: 10px;
}

.profile .avatar-upload .avatar-edit input {
    display: none;
}

.profile .avatar-upload .avatar-edit input+label {
    display: inline-block;
    width: 34px;
    height: 34px;
    margin-bottom: 0;
    border-radius: 100%;
    background: var(--white);
    border: 1px solid transparent;
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.12);
    cursor: pointer;
    font-weight: normal;
    transition: all 0.2s ease-in-out;
}

.profile .avatar-upload .avatar-edit input+label:hover {
    background: #f1f1f1;
    border-color: #d6d6d6;
}

.profile .avatar-upload .avatar-edit input+label:after {
    content: "\f040";
    font-family: "FontAwesome";
    color: var(--primary);
    position: absolute;
    top: 8px;
    left: 0;
    right: 0;
    text-align: center;
    margin: auto;
}

.profile .avatar-upload .avatar-preview {
    width: 192px;
    height: 192px;
    position: relative;
    border-radius: 100%;
    box-shadow: rgba(9, 30, 66, 0.25) 0px 4px 8px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 1px;
}

.profile .avatar-upload .avatar-preview>div {
    width: 100%;
    height: 100%;
    border-radius: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

/* Start sidebar */
.sidebar-user {
    background: var(--primary);
    box-shadow: 0px 3px 4px 0px var(--shadow);
    border-radius: 12px;
    height: fit-content;
    position: sticky;
    top: 5rem;
}

.sidebar-user ul li {
    font-family: Roboto;
    font-size: 19px;
    font-weight: 400;
    line-height: 22.27px;
    list-style-type: none;
    border-radius: 15px;
}

.sidebar-user ul li a {
    color: var(--white);
    text-decoration: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.sidebar-user ul li.active {
    background: var(--white);
    color: var(--primary);
}

.sidebar-user ul li.active a {
    color: var(--primary);
}

.sidebar-user ol li a {
    display: block;
}

/* Start overview */
.overview .content-box,
.submission .content-box,
.edit-profile .content-box {
    background: var(--crystal);
    box-shadow: 0px 3px 4px 0px var(--shadow);
    border-radius: 18px;
    min-height: 30.5rem;
}

.overview .content-box .overview-title,
.submission .content-box .submission-title,
.edit-profile .edit-profile-title {
    font-family: Roboto;
    font-size: 28px;
    font-weight: 500;
    line-height: 52.73px;
    text-decoration: underline;
}

.overview .content-box .card {
    box-shadow: 0px 1px 8px 0px var(--shadow);
    border-radius: 10px;
    margin-bottom: 1rem;
}

.overview .content-box .card .card-title {
    font-family: Roboto;
    font-size: 20px;
    font-weight: 500;
    line-height: 35.16px;
    color: var(--black);
}

.overview .content-box .card .card-text {
    font-family: Roboto;
    font-size: 16px;
    font-weight: 400;
    line-height: 28.13px;
    color: var(--primary);
}

/* Start submission */
.submission .nav-tabs {
    background: var(--white);
    border-radius: 10px;
    border: 0px;
    display: inline-block;
    padding: 6px 10px 6px 7px;
}

.submission .nav-tabs .nav-item {
    display: inline-block;
}

.submission .nav-tabs .nav-link {
    font-size: 16px;
    font-weight: 600;
    line-height: 35px;
    text-align: center;
    border: 0px;
    color: var(--primary);
    padding: 8px 110px !important;
}

.submission .nav-tabs .nav-link.active {
    border: 0px;
    background: var(--primary);
    box-shadow: 0px 4px 10px 0px var(--shadow);
    border-radius: 10px;
    color: var(--white);
}

/* End submission */

/* Start edit-profile */
.edit-profile label {
    font-size: 16px;
    font-weight: 500;
    line-height: 35px;
}
.edit-profile .verify, .edit-profile .verify_email{
    display: flex;
    align-items: center;
    right: 1rem;
    top: 0.2rem;
    background-color: var(--primary);
    color: var(--white);
    border-radius: 7px;
    border: none;
    font-size: 15px;
    font-weight: 400;
    font-family: roboto;
    line-height: 1.5rem;
}
.edit-profile .loader-spin, #SignupModal .loader-spin{
        border: 0.2em dotted currentcolor;
        border-radius: 50%;
        animation: 1s loader-spin linear infinite;
        width: 16px;
        height: 16px;
    }

@keyframes loader-spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

.edit-profile .position-relative{
    position: relative;
}
.edit-profile .selected-flag{
    border-radius: 10px;
}
.edit-profile .mobile-verified, .edit-profile .email-verified{
    top: 3.15rem;
    right: 1.5rem;
    display: flex;
}
.edit-profile .verified-text, .edit-profile .verified-email-text{
    color: #37c737;
    font-weight: 500;
}

.edit-profile .form-control,
.edit-profile .form-select {
    height: 3rem;
    border-radius: 12px;
    border: 1px solid #dfdddd;
    font-size: 16px;

}
.edit-profile input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.form-control:disabled {
    background-color: #e0f0ff;
    opacity: 1;
}
.disabled{
    background-color: #e0f0ff;
    opacity: 1;
}
.edit-profile .save-changes,
.edit-profile .save-changes:hover,
.edit-profile .save-changes:focus,
.edit-profile .save-changes:active {
    background: var(--primary);
    color: var(--white);
    font-size: 12px;
    font-weight: 500;
    line-height: 20px;
}

.form-select:focus {
    box-shadow: none;
}

/* Start coupons / offers saved */

.coupon-offers .content-box {
    background: var(--crystal);
    box-shadow: 0px 3px 4px 0px var(--shadow);
    border-radius: 18px;
    min-height: 30.5rem;
}

.coupon-offers .content-box .coupon-offers-title {
    font-family: Roboto;
    font-size: 28px;
    font-weight: 500;
    line-height: 52.73px;
    text-decoration: underline;
}

.coupon-offers .empty_text{
    font-size: 20px;
}

.coupon-offers .content-box .card {
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    border-radius: 20px;
    margin-bottom: 1rem;
    border: none;
}

.coupon-offers .content-box .card .card-title {
    font-family: Roboto;
    font-size: 18px;
    font-weight: 500;
    line-height: 26.16px;
    color: var(--black);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 3em;
}

.coupon-offers .content-box .card .card-text {
    font-family: Roboto;
    font-size: 15px;
    font-weight: 400;
    line-height: 22.13px;
    color: var(--black);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 3em;
}

.coupon-offers .content-box .card a {
    font-family: Roboto;
    font-size: 15px;
    font-weight: 400;
    line-height: 22.13px;
    color: var(--primary);
}

.coupon-offers .content-box .card:hover {
    box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
}

/* Start contact us */
.contact-us .content-box {
    background: var(--crystal);
    box-shadow: 0px 3px 4px 0px var(--shadow);
    border-radius: 10px;
    min-height: 30.5rem;
}

.contact-us .title {
    font-size: 30px;
    font-weight: 600;
    line-height: 15px;
    color: var(--primary);
}

.contact-us .desc {
    font-family: Roboto;
    font-size: 20px;
    font-weight: 400;
    line-height: 37.5px;
    color: var(--primary);
}

.contact-us label {
    font-size: 14px;
    font-weight: 500;
    line-height: 30px;
    color: var(--primary);
}

.contact-us .form-control,
.contact-us .form-select {
    height: 2.5rem;
    border-radius: 10px;
    border: none;
    font-size: 14px;
    box-shadow: 0px 3px 5px 0px var(--shadow);
}

.contact-us .form-control:focus,
.contact-us .form-control:active {
    border: 0px !important;
}

.contact-us .save-changes,
.contact-us .save-changes:hover,
.contact-us .save-changes:focus,
.contact-us .save-changes:active {
    background: var(--primary);
    color: var(--white);
    font-size: 14px;
    font-weight: 500;
    line-height: 30px;
    border-radius: 10px;
}

.contact-us .my-error-class {
    color: #f13333;
    font-size: 14px;
    line-height: 15px;
}

.contact-us .selected-flag{
    border-radius: 10px;
}

.hr_card {
    margin: 0px;
    opacity: 1;
    width: 100%;
    color: var(--primary);
}

/* Start product listing page */
.breadcrumb {
    font-size: 15px;
    font-weight: 400;
    line-height: 35px;
}

.breadcrumb-item.active {
    font-weight: 500;
}

.breadcrumb a {
    text-decoration: none;
    color: var(--black);
}

.products-listing .product-heading {
    font-size: var(--header-fontsize);
    font-weight: var(--header-fontweight);
    line-height: var(--header-lineheight);
}
.products-listing .table thead{
    background: var(--primary);
    color: var(--white);
}
.products-listing .title{
    font-size: var(--header-fontsize);
    font-weight: var(--header-fontweight);
    line-height: var(--header-lineheight);
}
.products-listing .sroll-table{
    overflow: auto;
    scrollbar-width: thin !important;
    scroll-padding: 0px 0px;
    max-height: 30rem;
}
.products-listing .table td,.products-listing .table th{
    line-height: 30px;
    font-size: 16px;
}
.products-listing .table a{
    color: var(--primary);
    text-decoration: none;
}
.products-listing .table a:hover{
    text-decoration: underline;
}
.products-listing .product-heading span {
    font-weight: 400;
}

.products-listing .filters {
    background: var(--primary);
    padding: 1rem;
    border-radius: 10px;
    box-shadow: 0px 5px 10px 0px var(--shadow);
}

.products-listing .lists {
    max-height: 11rem;
    overflow-y: auto;
    scrollbar-width: thin !important;
    scrollbar-color: var(--white) #D9D9D999 !important;
    scroll-padding: 0px 0px;
}

.products-listing .lists::-webkit-scrollbar-thumb {
    width: 50px;
}

.products-listing .filters .filters-method {
    font-size: 17px;
    font-weight: 700;
    line-height: 20px;
    color: var(--white);
    padding-left: 0.9rem;
}

.products-listing .filters hr {
    color: var(--white);
    height: 2px;
    opacity: 1;
}

.products-listing .filters label {
    font-size: 14px;
    font-weight: 500;
    line-height: 28px;
    color: var(--white);
    margin-left: .5rem;
}

.products-listing .filters .filters-title {
    font-size: 20px;
    font-weight: 700;
    line-height: 35px;
    color: var(--white);
}

.products-listing .filters .content .form-control {
    border-radius: 10px;
    height: 40px;
    padding-right: 35px;
}

.products-listing .filters .content .form-control::placeholder {
    font-size: 15px;
    font-weight: 600;
    line-height: 35px;
}

.products-listing .bi-search {
    top: 10px;
    right: 13px;
}

.products-listing .show-more,
.products-listing .show-more:active {
    color: var(--white);
    background: var(--primary);
    border-radius: 30px;
}

.products-listing .bi-x {
    cursor: pointer;
    top: 3px;
    right: 8px;
}

.products-listing .filters .clear-all {
    font-size: 10px;
    font-weight: 700;
    line-height: 35px;
    color: var(--white);
    cursor: pointer;
}

.products-listing .form-check {
    padding-left: 2rem;
}

.products-listing .form-check-input {
    background: #D9D9D980;
    width: 20px;
    height: 20px;
}

.products-listing .card:hover {
    box-shadow: 0px 2px 30px 0px #0000002E;
}

.products-listing .card {
    box-shadow: 0px 4px 10px 0px var(--shadow) !important;
    border-radius: 10px !important;
}

.products-listing .buy-now {
    border-radius: 5px;
    background: var(--primary);
    font-size: 14px !important;
    font-weight: 600;
    line-height: 28px;
    text-align: center;
    color: var(--white);
}

.products-listing .buy-now:hover {
    box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;
}

.products-listing .detail .bi-x {
    top: 34%;
    color: var(--primary);
    right: 1%;
}

/* End product listing page */

/* start promo banner */
.promo-banner>div {
    position: absolute;
    display: none;
}

.promo-banner.active>div {
    position: absolute;
    display: block ;
}

.bBanner .promo-banner {
    bottom: 90px;
}

.promo-banner.active {
    width: 280px;
    height: 280px;
    border-radius: 0px;
    display: block;
    opacity: 1;
    transition: all .3s ease-out;
    margin-bottom: 68px;
    box-shadow: unset !important;
    background-image: unset;
    bottom: 0px;
}

.promo-banner {
    cursor: pointer;
    position: fixed;
    bottom: 80px;
    left: 12px;
    width: 56px;
    height: 56px;
    box-shadow: 0 5px 8px 0 rgba(17, 52, 16, .43);
    background-image: linear-gradient(to bottom, #2a55e5, #2a55e5);
    border-radius: 50%;
    overflow: hidden;
    text-align: center;
    z-index: 99;
    transition: all .3s ease-out;
}

.promo-banner.active>.pb-wrap {
    transform: translateX(100px) !important;
}

.promo-banner>.pb-wrap {
    width: 52px;
    height: 52px;
    box-shadow: unset;
    background-image: unset;
    border-radius: 50%;
    display: block;
    text-align: center;
    line-height: 73px;
    margin: 6px auto;
}

.promo-banner.active>.pb-wrap {
    width: 52px;
    height: 52px;
    box-shadow: unset;
    background-image: unset;
    border-radius: 50%;
    display: none;
    text-align: center;
    line-height: 52px;
    margin: 6px auto;
}
.promo-banner>.pb-wrap>span {
    width: 38px;
    height: 38px;
    line-height: 38px;
    display: inline-block;
    box-shadow: 0 4px 9px 0 rgba(14, 38, 14, .4);
    background-color: #fff;
    border-radius: 50%;
    overflow: hidden;
}
.promo-banner>.pb-wrap>span>img {
    max-height: 90%;
    max-width: 90%;
    vertical-align: middle;
}
.promo-banner.active>div>span>svg {
    width: 9px;
    height: 9px;
}

.promo-banner.active>div>a>img {
    width: 100%;
}

.promo-banner.active>div>span {
    position: absolute;
    top: 8px;
    left: 8px;
    width: 20px;
    height: 20px;
    background-color: #18210c;
    border-radius: 50%;
    text-align: center;
    display: block;
    line-height: 19px;
}

/* end promo banner */

/* Countdown Timer */
.timer-section {
    background-color: var(--white);
    box-shadow: rgba(0, 0, 0, 0.25) 0px 4px 4px 0px;
}

.timer-section .deal-box {
    background-color: var(--primary);
    border-radius: 5px;
    color: var(--white);
    display: inline-block;
    font-size: 16px;
}

.timer-section .timer-box {
    background-color: var(--primary);
    border-radius: 5px;
    color: var(--white);
}

.timer-section .timer-box p {
    font-size: 16px;
}

.timer-section .timer {
    letter-spacing: 1px;
    font-size: 24px;
    width: 102px;
}

.timer-section img {
    width: 15%;
    transform: rotate(-90deg);
}
/* end promo banner */

.btn-saved-offer {
    background: var(--primary);
    color: var(--white);
    box-shadow: 0px 4px 10px 0px var(--shadow);
    font-size: large;
    width: 100%;
}

.btn-saved-offer:hover {
    background: var(--primary);
    color: var(--white);
    box-shadow: 0px 4px 10px 0px var(--shadow);
    font-size: large;
    width: 100%;
}

/* Career page */
.career-list .vertical-col-data {
    border: 1px solid rgba(0, 0, 0, 0.06);
    background: var(--white);
}

.career-list .vertical-col-data .job-title {
    background: rgba(0, 0, 0, 0.06);
    font-weight: 600;
    line-height: 35px;
    font-size: 20px;
}

.career-list .vertical-col {
    border: 2px solid rgba(0, 0, 0, 0.06);
    background: rgba(0, 0, 0, 0.06);
    padding: 8px;
    height: 500px;
    overflow: auto;
}

.career-list .vertical-col .nav-pills .nav-link {
    font-size: 18px;
    background: var(--white);
    color: var(--black);
    margin: 5px 0px;
    border-left: solid 5px;
    border-color: #adb5bd;
}

.career-list .heading-leading,
#send_resume .heading-leading {
    font-size: 28px;
    font-weight: 600;
    line-height: 35px;
    padding: 0;
}

.career-list .vertical-col .nav-pills .nav-link.active {
    color: var(--primary);
    border-left: solid 5px;
    border-color: var(--primary);
    font-weight: 700;
}

.career-list .btn-apply {
    background-color: var(--primary);
    color: var(--white);
    text-decoration: none;
    border-radius: 8px;
    font-weight: 600;
}

.career-list .btn-apply:hover,
.career-list.btn-apply:focus {
    background: #005ecc;
    color: #FFF;
    box-shadow: #005ecc 0px 1px 4px;
}

#SignupModal .intl-tel-input, #MobileVerificationModal .intl-tel-input, .edit-profile .intl-tel-input ,.contact-us .intl-tel-input {
    display: block !important;
    /* display: block; */
}

#send_resume .right-side {
    border-radius: 10px;
    background: var(--crystal);
    box-shadow: 0px 4px 10px 0px var(--shadow);
}

.career-list .accordion-button:not(.collapsed) {
    background: var(--white) !important;
}

.career-list textarea {
    font-size: 15px;
    box-shadow: none;
    border-radius: 4px;
    padding: 0 12px;
}

.career-list .form-select,
.career-list .form-control {
    font-size: 15px;
    box-shadow: none;
    border-radius: 4px;
    padding: 0 12px;
    height: 3rem;
    color: #212529 !important;
}

.career-list .form-select:focus,
textarea:focus {
    box-shadow: none !important;
}

#send_resume .apply-now {
    background: var(--primary);
    color: var(--white);
}

.feedback_form .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-3 .selected-flag {
    border-bottom-left-radius: 10px;
    border-top-left-radius: 10px;
}

/* Start sitemap */
.sitemap-list .card {
    box-shadow: rgba(9, 30, 66, 0.25) 0px 4px 8px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 1px;
    border: 0px;
}

.sitemap-list .heading {
    font-size: 20px;
    font-weight: 600;
    color: var(--primary);
    line-height: 35px;
}

.sitemap-list a {
    font-size: 16px;
    font-weight: 400;
    color: var(--black);
    line-height: 30px;
}

.sitemap-list a:hover {
    text-decoration: underline !important;
}

/* End sitemap */
/* start tag filter */
.sort_Tag ul li {
    display: inline-block;
    vertical-align: middle;
}

.sort_Tag {
    display: flex;
    align-items: center;
}

.sort_Tag strong {
    margin-right: 4px !important;
}

.sort_Tag ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    align-items: center;
}

#tagFilter {
    /* width: calc(100% - 94px); */
    white-space: nowrap;
    overflow-x: auto;
    margin-left: 2px;
    display: inline-block;
    vertical-align: middle;
    scrollbar-width: none !important;
}

#tagFilter li {
    cursor: pointer;
    color: #2a55e5;
    padding: 2px 8px;
    padding-right: 14px;
    border: .6px solid #2a55e5;
    margin: 0 2px;
    border-radius: 18px;
    font-size: 12px;
    transition: all .3s ease;
    display: inline-block;
    vertical-align: middle;
}

#tag_product_page li{
    cursor: pointer;
    color: #2a55e5;
    padding: 2px 8px;
    padding-right: 14px;
    border: .6px solid #2a55e5;
    margin: 0 0px;
    border-radius: 18px;
    font-size: 12px;
    transition: all .3s ease;
    display: inline-block;
    vertical-align: middle;
}

#tagFilter li:hover {
    background: #2a55e5;
    border-color: #2a55e5;
    color: #fff;
}

#tagFilter li.active {
    background: #2a55e5 !important;
    border-color: #2a55e5 !important;
    color: #fff !important;
}

#tagFilter li.active img {
    filter: invert(100%) sepia(0%) saturate(7493%) hue-rotate(333deg) brightness(103%) contrast(102%);
}


#tagFilter li:hover img {
    filter: invert(100%) sepia(0%) saturate(7493%) hue-rotate(333deg) brightness(103%) contrast(102%);
}
#tagFilter li:hover .categories-svg-image {
    filter: invert(100%) sepia(0%) saturate(7493%) hue-rotate(333deg) brightness(103%) contrast(102%) !important;
}

#tagFilter li.active .sortby {
    filter: unset !important;
}


#tagFilter li:hover .sortby {
    filter: unset !important;
}
/* end tag filter */

/* start store followed */
.store_followed .store_followed-title, .store_followed p, .categories_followed .categories_followed-title, .categories_followed p {
    font-family: Roboto;
    font-size: 28px;
    font-weight: 500;
    line-height: 52.73px;
}
.store_followed .empty_text, .categories_followed .empty_text{
    font-size: 20px;
}

.store_followed .card, .categories_followed .card {
    box-shadow: 0px 1px 8px 0px var(--shadow);
    margin-bottom: 1rem;
    height: 100px;
}

.store_followed .card .card-title,.categories_followed .card .card-title {
    font-family: Roboto;
    font-size: 14px;
    font-weight: 500;
    line-height: 35.16px;
    color: var(--black);
    display: -webkit-box;
    -webkit-line-clamp: 1;
    line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 3em;
}
.store_followed a, .categories_followed a {
    text-decoration: none;
}

.recommendation, .recommend {
    background: var(--crystal);
    box-shadow: 0px 3px 4px 0px var(--shadow);
    border-radius: 18px;
}
.recommendation .recommendation-title, .recommendation-title-sub, .recommend .recommend-title, .recommend-title-sub {
    font-family: Roboto;
    font-size: 28px;
    font-weight: 500;
    line-height: 52.73px;
    text-decoration: underline;
}
.recommendation .card, .recommend .card {
    position: relative;
    box-shadow: 0px 1px 8px 0px var(--shadow);
    margin-bottom: 1rem;
    height: 100px;
}
.recommendation .card .card-title, .recommend .card .card-title {
    font-family: Roboto;
    font-size: 14px;
    font-weight: 500;
    line-height: 35.16px;
    color: var(--black);
}
.recommendation a, .recommend a  {
    text-decoration: none;
}
.recommendation-title-sub{
    text-decoration: none;
}
.store_followed .save_btn, .categories_followed .save_btn  {
    background-color: var(--primary);
    color: var(--white);
    border-radius: 10rem;
    padding-right: 2.5rem;
    padding-left: 2.5rem; 
}
.store_followed .clear_btn, .categories_followed .clear_btn {
    background-color: var(--white);
    color: var(--primary);
    border-radius: 10rem;
    padding-right: 2.5rem;
    padding-left: 2.5rem;
    border-color: var(--primary);
}
.recommendation .lists{
    gap: 1rem;
}
.recommendation .lists p{
    margin-left: 23rem;
}
.recommendation .form-check {
    display: flex;
    align-items: center;
    flex: 1 1 calc(25% - 1rem);
    max-width: calc(25% - 1rem);
}
.recommendation .checkbox_input {
    width: 15px;
    height: 15px;
    margin-right: 0.5rem;
}
.recommendation .form-check-label {
    font-size: 13px;
    font-weight: 500;
    line-height: 1rem;
    margin-top: 4px;
}
.alphabet-search {
    gap: 1.6rem;
    cursor: pointer;
}
.alphabet-search a{
    color: var(--black);
}
.alphabet-filter {
    font-family: Roboto;
    font-size: 16px;
    font-weight: 400;
    line-height: 0;
}
.alphabet-filter:hover, .alphabet-filter.active {
    color: var(--primary);
}
.recommendation .bi-search {
    right: 29.5rem;
    bottom: 0.7rem;
}
.recommendation .detail .bi-x {
    top: 34%;
    color: var(--primary);
    right: 1%;
}
.recommendation .bi-x {
    cursor: pointer;
    right: 29.5rem;
    bottom: 0.3rem;
}
.add-text {
    position: absolute;
    top: 0px;
    right: 0px;
    padding: 2px 5px;
    font-size: 12px;
    color: #999; 
}
.recommendation .form-check-input[type=checkbox] {
    border-radius: 3px;
}
.recommendation .form-check-input{
    border: 1px solid var(--primary);
    width: 15px;
    height: 15px;
}
.recommendation .form-check-input:checked{
    border-color: var(--primary);
}
.recommendation #store-list{
    max-height: 20.4rem;
    overflow-y: auto;
}
/* end store followed */

/* start categories followed  */
.categories_followed .card {
    height: 113px;
}
.categories_followed .card .card-title{
    line-height: 50px;
    font-weight: 500;
}
.recommend .card {
    height: 113px;
}
.recommend .card .card-title {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 3em;
}
/* end categories followed  */

/* new header start*/

.below-header nav {
    z-index: 99;
    width: 100%;
}

.below-header nav .wrapper {
    position: relative;
    /* max-width: 1300px; */
    /* padding: 0px 30px; */
    height: 60px;
    line-height: 22px;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;

}

.below-header .wrapper .nav-links {
    list-style: none;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 3rem;
    margin-bottom: 0rem;
    padding: 1rem 0rem;
    margin-left: 0px !important;
    padding-left: 0px !important;
}

.below-header .wrapper .logo a {
    color: #f2f2f2;
    font-size: 30px;
    font-weight: 600;
    text-decoration: none;
}

.below-header .wrapper .nav-links {
    display: inline-flex;
}

.below-header .nav-links li {
    list-style: none;
}

.below-header .nav-links .dropdown_megabox{
    height: 70px;
    align-items: center;
    display: flex;
}

.below-header .nav-links li a {
    color: #ffffff;
    text-decoration: none;
    font-size: 18px;
    font-weight: 500;
    border-radius: 5px;
    transition: all 0.3s ease;
}

.below-header .nav-links .mobile-item {
    display: none;
}

.below-header .nav-links .drop-menu {
    position: absolute;
    background: #242526;
    width: 180px;
    line-height: 45px;
    top: 85px;
    opacity: 0;
    visibility: hidden;
    box-shadow: 0 6px 10px rgba(0, 0, 0, 0.15);
}

.below-header .nav-links li:hover .drop-menu,
.below-header .nav-links li:hover .mega-box {
    transition: all 0.3s ease;
    top: 60px;
    opacity: 1;
    visibility: visible;
}

.below-header .drop-menu li a {
    width: 100%;
    display: block;
    padding: 0 0 0 15px;
    font-weight: 400;
    border-radius: 0px;
}

.below-header .mega-box {
    position: absolute;
    left: 0;
    width: 100%;
    /* padding: 0 30px; */
    top: 85px;
    opacity: 0;
    visibility: hidden;
}

.below-header .mega-box .content {
    background: #ffffff;
    padding: 20px 20px;
    /* display: flex; */
    width: 100%;
    justify-content: space-between;
    box-shadow: 0 6px 10px rgba(0, 0, 0, 0.15);
    /* color: #000; */
}

.below-header .mega-box .content .row {
    line-height: 45px;
}

/* .content .row img{
    width: 100%;
    height: 100%;
    object-fit: cover;
  } */
  .below-header .content .row header {
    color: #f2f2f2;
    font-size: 20px;
    font-weight: 500;
}

.below-header .content .row .mega-links {
    margin-left: -40px;
    border-left: 1px solid rgba(255, 255, 255, 0.09);
}

.below-header .row .mega-links li {
    padding: 0 20px;
}

.below-header .row .mega-links li:hover {
    padding: 0 20px;
    background-color: #e9ecef;
}

.below-header .row .mega-links li a {
    font-family: "Roboto", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 23.44px;
    color: var(--primary);
    padding: 5px 15px;
    text-wrap: wrap;
}

.below-header .row .mega-links li a:hover {
    font-family: "Roboto", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 23.44px;
    color: var(--primary);
    padding: 5px 15px;
    text-wrap: wrap;
}

.below-header .nav-links li a .card-body .card-title {
    margin-bottom: 0px;
    color: var(--primary);
    text-align: center;
}

.below-header .wrapper .partner,
.below-header .wrapper .hotels {
    list-style-type: none;
}

.below-header .wrapper .partner_btn {
    background-color: #FDD017;
    color: #000000 !important
}

.below-header .wrapper .book_hotels_btn {
    background-color: var(--primary);
    border-color: var(--primary);
    border: 1px solid white;
    border-radius: 25px;
    padding: 3px 13px 3px 7px;
    color: white;

}

.below-header .wrapper .book_img {
    width: 33px;
}

.below-header .wrapper .btn {
    color: #fff;
    font-size: 20px;
    cursor: pointer;
    display: none;
}

.below-header .wrapper .btn.close-btn {
    position: absolute;
    right: 30px;
    top: 10px;
}

.below-header .nav-links li .content .text-end a {
    color: var(--primary);
    font-weight: 800;
}

.below-header .mega-box .content .stores-menu {
    border-radius: 0px 0px 30px 30px;
    border: 0px;
    background: var(--white);
    margin: 0% 0% !important;
    box-shadow: 0px 0px 0px 0px var(--shadow);
    width: 100% !important;
}

.below-header .mega-box .content .best-offers-menu .content-box{
    background: none;
    border-radius: unset;
    background-color: #efefef;
    border-radius: 10px;
}

.below-header .best-offers-dropdown .see-more{
    color: var(--primary);
    font-weight: 800 !important;
}

@media screen and (max-width: 970px) {
    .below-header .wrapper .btn {
        display: block;
    }

    .below-header .wrapper .nav-links {
        position: fixed;
        height: 100vh;
        width: 100%;
        max-width: 350px;
        top: 0;
        left: -100%;
        display: block;
        padding: 50px 10px;
        line-height: 50px;
        overflow-y: auto;
        transition: all 0.3s ease;
    }

    /* custom scroll bar */
    ::-webkit-scrollbar {
        width: 10px;
    }

    .below-header .nav-links li {
        margin: 15px 10px;
    }

    .below-header .nav-links li a {
        padding: 0 20px;
        display: block;
        font-size: 20px;
    }

    .below-header .nav-links .drop-menu {
        position: static;
        opacity: 1;
        top: 65px;
        visibility: visible;
        padding-left: 20px;
        width: 100%;
        max-height: 0px;
        overflow: hidden;
        box-shadow: none;
        transition: all 0.3s ease;
    }

    #showDrop:checked~.drop-menu,
    #showMega:checked~.mega-box {
        max-height: 100%;
    }

    .below-header .nav-links .desktop-item {
        display: none;
    }

    .below-header .nav-links .mobile-item {
        display: block;
        color: #f2f2f2;
        font-size: 20px;
        font-weight: 500;
        padding-left: 20px;
        cursor: pointer;
        border-radius: 5px;
        transition: all 0.3s ease;
    }

    .below-header .drop-menu li {
        margin: 0;
    }

    .below-header .drop-menu li a {
        border-radius: 5px;
        font-size: 18px;
    }

    .below-header .mega-box {
        position: static;
        top: 65px;
        opacity: 1;
        visibility: visible;
        max-height: 0px;
        overflow: hidden;
        transition: all 0.3s ease;
    }

    .below-header .mega-box .content {
        box-shadow: none;
        flex-direction: column;
        padding: 20px 20px 0 20px;
    }

    .below-header .mega-box .content .row {
        margin-bottom: 15px;
        border-top: 1px solid rgba(255, 255, 255, 0.08);
    }

    .below-header .mega-box .content .row:nth-child(1),
    .below-header .mega-box .content .row:nth-child(2) {
        border-top: 0px;
    }

    .below-header .content .row .mega-links {
        border-left: 0px;
        padding-left: 15px;
    }

    .below-header .row .mega-links li {
        margin: 0;
    }

    .below-header .content .row header {
        font-size: 19px;
    }
}

.button_url{
    background: #28538f;
    color: var(--white);
    box-shadow: 0px 4px 10px 0px var(--shadow);
    font-size: large;
    border-radius: 0.375rem;
    border: 0px;
    padding: 8px 17px;
}

.button_url:hover{
    background: #2a55e5;
    color: var(--white);
    box-shadow: 0px 4px 10px 0px var(--shadow);
    font-size: large;
    border-radius: 0.375rem;
    border: 0px;
    padding: 8px 17px;
}

#BackToTopbutton {
    display: inline-block;
    background-color: var(--primary);
    text-decoration: none;
    width: 40px;
    height: 40px;
    text-align: center;
    border-radius: 4px;
    position: fixed;
    bottom: 30px;
    right: 30px;
    transition: background-color .3s, 
        opacity .5s, visibility .5s;
    opacity: 0;
    visibility: hidden;
    z-index: 1000;
}
#BackToTopbutton::after {
    content: "\f077";
    font-family: FontAwesome;
    font-weight: normal;
    font-style: normal;
    font-size: 1em;
    line-height: 45px;
    color: #fff;
}
#BackToTopbutton:hover {
    cursor: pointer;
    background-color: #FDD017;
}
#BackToTopbutton:active {
    background-color: var(--black);
}
#BackToTopbutton.show {
    opacity: 1;
    visibility: visible;
}
/* start email verification page */
.EmailVerify-section{
    height: 30rem;
    background-color: var(--white);
    margin-bottom: 4rem;
}

.EmailVerify-section .email-box{
    margin-top: 3rem;
}

.EmailVerify-section .VerifyMsg{
    margin-top: 2rem;
    height: 22rem;
    width: 35rem;
}

.EmailVerify-section .success_img, .EmailVerify-section .error_img{
    width: 15%;
    margin-top: 5rem;
}

.EmailVerify-section .msg-success, .EmailVerify-section .failed-msg{
    line-height: 10.1rem;
    font-size: 1.5rem;
    font-weight: 500;
    color: #37c737;
}
.EmailVerify-section .failed-msg{
    font-size: 1.3rem;
    color: #ff3333;
}
.EmailVerify-section .home-btn{
    font-size: 18px;
    border-radius: 30px;
    font-weight: 600;
    line-height: 25px;
    text-align: center;
    box-shadow: 0px 4px 10px 0px var(--shadow);
    background: var(--primary);
    color: var(--white);
}

/* Start tabs for delatson */
.details-and-coupon-offer-col .nav-tabs {
    background: var(--white);
    border-radius: 10px;
    border: 0px;
    padding: 6px 10px 6px 7px;
    justify-content: space-evenly; 
    display: flex;
}

.details-and-coupon-offer-col .nav-tabs .nav-item {
    display: inline-block;
}

.details-and-coupon-offer-col .nav-tabs .nav-link {
    font-size: 16px;
    font-weight: 600;
    line-height: 35px;
    text-align: center;
    border: 0px;
    color: var(--primary);
    padding: 8px 10px !important;
}

.details-and-coupon-offer-col .nav-tabs .nav-link.active {
    border: 0px;
    background: var(--primary);
    box-shadow: 0px 4px 10px 0px var(--shadow);
    border-radius: 10px;
    color: var(--white);
}

.details-and-coupon-offer-col .tab-content .tab-pane table{
    width: 100% !important;
    border: 1px solid #ddd;
    margin-bottom: 10px !important;
}

.details-and-coupon-offer-col .tab-content .tab-pane table>tbody>tr>td, .details-and-coupon-offer-col .tab-content .tab-pane table>tbody>tr>th{
    padding: 6px !important;
    vertical-align: middle !important;
    line-height: 18px !important;
    border: 1px solid #ddd;
    font-size: 14px;
}

.details-and-coupon-offer-col .tab-content .tab-pane table>tbody>tr>td{
    font-weight: normal;
}

.details-and-coupon-offer-col .tab-content .tab-pane h1{
    display: block;
    font-size: 25px !important;
    margin-block-start: 0.5em;
    margin-block-end: 0.5em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: 800;
    unicode-bidi: isolate
}

.details-and-coupon-offer-col .tab-content .tab-pane h2{
    display: block;
    font-size: 18px !important;
    margin-block-start: 0.5em;
    margin-block-end: 0.5em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: 700;
    unicode-bidi: isolate
}

.details-and-coupon-offer-col .tab-content .tab-pane h3{
    display: block;
    font-size: 16px !important;
    margin-block-start: 0.5em;
    margin-block-end: 0.5em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: 600;
    unicode-bidi: isolate
}

.details-and-coupon-offer-col .tab-content .tab-pane p{
    font-size: 14px;
    line-height: 20px;
    color: #373737;
    margin: 0 auto 10px;
    font-weight: normal;
}

.details-and-coupon-offer-col .tab-content .tab-pane dl, .details-and-coupon-offer-col .tab-content .tab-pane ol, .details-and-coupon-offer-col .tab-content .tab-pane ul {
    margin-top: 0;
    margin-bottom: 0;
    line-height: 25px;
    padding-left: 2rem;
    font-size: 14px;
    font-weight: normal;
}
/* End tab for delatson */
.categories-detail .product_view_btn a{
    cursor: pointer !important;
    color: #2a55e5 !important;
    padding: 2px 8px;
    padding-right: 14px;
    border: .6px solid #2a55e5 !important;
    margin: 0 2px;
    border-radius: 18px;
    flex-shrink: 0;
    font-size: 13px;
    transition: all .3s ease;
    display: inline-block;
    vertical-align: middle;
    background-color: unset !important;
    font-weight: 500;
}

.categories-detail .product_view_btn a:hover{
    cursor: pointer !important;
    color: white !important;
    padding: 2px 8px;
    padding-right: 14px;
    border: .6px solid #2a55e5 !important;
    margin: 0 2px;
    border-radius: 18px;
    font-size: 13px;
    transition: all .3s ease;
    display: inline-block;
    vertical-align: middle;
    background-color: #2a55e5 !important;
    font-weight: 500;
}

.categories-detail .product_view_btn a:hover img {
    filter: invert(100%) sepia(0%) saturate(7493%) hue-rotate(333deg) brightness(103%) contrast(102%);
}

/* Signup popup on deal/coupon click */
#SignupPopupOnDealCoupon .modal-dialog{
    max-width: 670px;
}
#SignupPopupOnDealCoupon .modal-body {
    position: relative;
    padding: 2rem;
}
#SignupPopupOnDealCoupon .btn-close {
    position: absolute;
    top: 1rem;
    right: 1rem;
}
#SignupPopupOnDealCoupon .title {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--black);
}
#SignupPopupOnDealCoupon .subtitle {
    font-size: 1rem;
    color: var(--black);
    font-weight: 600;
}
#SignupPopupOnDealCoupon .login-signup {
    background-color: var(--primary);
    color: var(--white);
    border-radius: 10px;
    font-size: 1rem;
    font-weight: 600;
}
#SignupPopupOnDealCoupon .modal-footer {
    background-color: var(--primary);
}
#SignupPopupOnDealCoupon .footer-text p {
    margin: 0;
    font-size: 0.875rem;
}
#SignupPopupOnDealCoupon .btn-light {
    background-color: var(--white);
    color: var(--black);
    font-size: 14px;
    border-radius: 0.25rem;
}
#SignupPopupOnDealCoupon .login-signup-skip,#SignupPopupOnDealCoupon .login-signup-skip:focus,
#SignupPopupOnDealCoupon .login-signup-skip:active{
    color: var(--primary);
    border-radius: 10px;
    font-size: 0.8rem;
    font-weight: 600;
    border: 0px;
}

/* Update password */
#PasswordModal .title,#ResetEmail .title{
    font-size: 18px;
    color : var(--black);
    line-height: 35px;
    font-weight :600;
}
#PasswordModal .desc,#ResetEmail .desc{
    font-size: 14px;
    color : var(--black);
    line-height: 20px;
    font-weight :500;
}
#PasswordModal label,#ResetEmail label{
    font-size: 14px;
    color : var(--black);
    line-height: 35px;
    font-weight :600;
}
#PasswordModal .form-control,#ResetEmail .form-control{
    height: 2.5rem;
}
#PasswordModal .btn-close,#ResetEmail .btn-close{
    background: unset;
    color: var(--primary);
    position: absolute;
    right: 1rem;
    top: 1rem;
    opacity: 1;
}
#PasswordModal .update-password,#PasswordModal .update-password:focus,#PasswordModal .update-password:active,
#PasswordModal .update-password:hover,#ResetEmail .reset-password,#ResetEmail .reset-password:focus,#ResetEmail .reset-password:active,
#ResetEmail .reset-password:hover,#change-password .change-password,#change-password .change-password:focus,#change-password .change-password:active,
#change-password .change-password:hover{
    font-size: 14px;
    color: var(--white);
    background: var(--primary);
    font-weight: 500;
    line-height: 22px;
}

#PasswordModal .my-error-class,#ResetEmail .my-error-class{
    color: #f13333 !important;
    font-size: 14px !important;
    line-height: 15px !important;
}

/* start notification page */
.noti-container .notification-header{
    color: var(--primary);
    font-size: var(--header-fontsize);
    line-height: var(--header-lineheight);
    font-weight: var(--header-fontweight);
}

.notification-section .notification-link{
    text-decoration: none;
    color: inherit;
}

.notification-section .notification-item {
    background-color: #fff;
    border-radius: 10px;
    padding: 15px;
    margin-bottom: 15px;
    box-shadow: 0px 1px 8px 0px var(--shadow);
}

.notification-section .notification-image {
    width: 100%;
    height: auto;
    border-radius: 10px;
    object-fit: cover;
}

.notification-section .notification-title {
    color: var(--primary);
    font-size: 22px;
    line-height: 35px;
    margin-bottom: 5px;
}

.notification-section .notification-description {
    margin-bottom: 5px;
    font-size: 18px;
    line-height: 30px;
}

.notification-section .notification-time{
    bottom: 8px;
    right: 14px;
}

.notification-section .no-notification-container {
    border-radius: 8px;
    padding: 20px;
}

.notification-section .no-notification-container .no-noti-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--primary);
}

.notification-section .no-notification-container .no-noti-text {
    font-size: 16px;
    font-weight: 500;
}

.notification-section .no-notification-container .continue-btn {
    background-color: var(--primary);
    font-size: 13px;
}

.jquery-comments .textarea-wrapper .inline-button {
    font-size: 20px !important;
}

@media only screen and (min-width: 1400px) {
    .top-header .notification-icon .dropdown-menu{
        left: -28rem;
    }
}

.form-control:read-only {
    background-color: #e0f0ff;
    opacity: 1;
}

.mobile-price-list ul li a:hover{
    color: var(--primary) !important;
    text-decoration: underline;
}

.best-appliances-price-list ul li a:hover{
    color: var(--primary) !important;
    text-decoration: underline;
}

.categories-detail .store-container {
    display: inline-block;
    width: 100%;
    height: auto;
}

.categories-detail .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgb(255 255 255 / 82%); 
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transition: opacity 0.3s ease;
    border-radius: 5px;
}
.categories-detail .overlay-text {
    color: var(--black);
    font-size: 18px;
    font-weight: 500;
}
.categories-detail .store-container:hover .overlay {
    opacity: 1;
}


@keyframes placeholderShimmer {
    0% {
        background-position: -468px 0;
    }
    100% {
        background-position: 468px 0;
    }
}
.shimmer-animation {
    background-color: #ecedee;
    background-image: linear-gradient(to right, #f6f7f8 0%, #edeef1 20%, #f6f7f8 40%, #f6f7f8 100%);
    background-repeat: no-repeat;
    background-size: 800px 104px;
    animation-duration: 1s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: placeholderShimmer;
    animation-timing-function: linear;
}

.loader-shimmer-banner {
    height: 100%;
    background-size: 100% 100%;
    border-radius: 15px;
}