@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif:ital,wght@0,100..900;1,100..900&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css");

:root {
    --bg-lighter: #0466C8;
    --bg-light: #0071AE;
    --bg-dark: #153C51;
    --bg-white: #fff;
    --bg-offwhite: #DCE1E6;
    --bg-orange: #F18724;
    --bg-gold: #d1a76d;
    --bg-blue: #0472acf7;
    --bg-gray: #dde1e5;

    --bg-btn-disabled: #153c519e;
    --bg-btn-outline-disabled: #00000026;


    --text-dark: #153C51;
    --text-light: #fff;
    --text-orange: #F18724;

    --text-blue: #1d4155;
    --text-light-blue: #0974b1;

    --checkbox-hover: #e1e0e0;

    --arrow-img: url("data:image/svg+xml;charset=utf-8;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAxNiAxNicgZmlsbD0nbm9uZScgc3Ryb2tlPScjMjEyNTI5JyBzdHJva2UtbGluZWNhcD0ncm91bmQnIHN0cm9rZS1saW5lam9pbj0ncm91bmQnPjxwYXRoIGQ9J00yIDVMOCAxMUwxNCA1Jy8+PC9zdmc+");
}

* {
    padding: 0;
    margin: 0;
    font-family: "Open Sans", serif;
}


/**
 * Headings
 * */
.heading-primary {}

.heading-teritary {
    font-family: "Noto Serif", serif;
}


/**
 * Top Banner
 **/
.slim-banner {
    background: var(--bg-light);
    color: #fff;
    padding: 6px 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.slim-banner__controls {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 1000px;
}

.slim-banner__arrow--left svg,
.slim-banner__arrow--right svg {
    vertical-align: middle;
    width: 30px;
    height: 30px;
    cursor: pointer;
}

.slim-banner__text {
    position: absolute;
    left: 0;
    right: 0;
    text-align: center;
    opacity: 0;
    font-weight: 400;
    font-size: 13px;
    transition: 500ms ease-in-out all;
}

.slim-banner__text--active {
    opacity: 1;
}

/**
 * Header
 **/

header {
    position: sticky;
    top: 0;
    background: #fff;
    z-index: 1111;
}

.nav--active {
    display: block !important;
}

.mobile-nav {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 111;
    background: #fff;
}

.mobile-nav--active {
    display: block !important;
}

.mobile-nav .nav__header {
    background: #eee;
    padding: 15px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-shadow: 4px 5px 13px #1c1b1b45;
}

.mobile-nav .nav__header img {
    width: 150px;
}

.mobile-nav .nav__header a {
    color: #000;
}

.mobile-nav .nav__items {
    padding: 15px 20px;
    position: relative;
}

.mobile-nav .nav__items .nav__item {
    padding: 15px 0;
    border-bottom: 1px solid #eee;
}

.mobile-nav .nav__items a {
    font-size: 22px;
    text-decoration: none;
    color: #000;
}

.mobile-nav .nav__items .nav__item .nav__item__details {
    display: none;
    position: absolute;
    background: #fff;
    top: 15px;
    left: 0px;
    right: 0px;
}

.mobile-nav .nav__items .nav__item .nav__item__details .links .nav-links {
    height: 55vh;
    overflow-y: auto;
}


.mobile-nav .nav__items .nav__item .nav__item__details .links a:first-child {
    font-size: 14px;
    font-weight: 100;
    display: flex;
    align-items: center;
    margin-bottom: 15px;
}

.mobile-nav .nav__items .nav__item .nav__item__details .links a:first-child i {
    margin-right: 5px;
    font-size: 20px;

}

.mobile-nav .nav__items .nav__item .nav__item__details .links p {
    font-size: 18px;
    margin: 10px 5px;
    display: block;
    padding: 10px 15px;
    font-weight: 500;
    border-bottom: 1px solid #153c511a;
}

.mobile-nav .nav__items .nav__item .nav__item__details .links a {
    font-size: 18px;
    margin-bottom: 5px;
    display: block;
    padding: 5px 25px;
    font-weight: 100;
}

.mobile-nav .nav__items .nav__item .nav__item__details .featured__link {
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    align-items: start;
    padding: 0px 25px;
}

.mobile-nav .nav__items .nav__item .nav__item__details .featured__link img {
    width: 280px;
    margin-bottom: 10px;
}

.mobile-nav .nav__items .nav__item .nav__item__details .featured__link p {
    font-size: 14px;
    width: 300px;
}

nav {
    display: flex;
    flex-direction: column;
    padding: 20px 25px 6px 25px;
    border-bottom: 1px solid var(--bg-offwhite);
}

nav .nav__primary {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

nav .nav__primary .nav__hamburger {
    display: none;
}

nav .nav__primary .nav__hamburger a {
    color: #000;
    font-size: 30px;
}

nav .nav__secondary {
    display: flex;
    align-items: center;
}

nav .nav__secondary .nav__item .nav__menu {
    position: absolute;
    background: var(--bg-offwhite);
    max-width: 85%;
    top: 100%;
    z-index: 111111;
    max-height: 0;
    padding: 10px 40px;
    border-radius: 10px;
    transition: max-height 0.15s ease-out, visibility 0.15s ease-out;
    left: 0;
    right: 0;
    margin: 0 auto;
    overflow: hidden;
    visibility: hidden;
    box-sizing: border-box;
}

nav .nav__secondary .nav__item:hover .nav__menu {
    max-height: 500px;
    transition: max-height 0.25s ease-in, visibility 0.25s ease-in;
    visibility: visible;
}

.nav__menu:hover {
    max-height: 500px;
    transition: max-height 0.25s ease-in, visibility 0.25s ease-in;
    visibility: hidden;

}

nav .nav__secondary .nav__item .nav__menu h1 {
    font-weight: 700;
    text-transform: uppercase;
    font-size: 25px;
    border-bottom: 1px solid #d1cfcf;
    padding: 10px 0;
}

.nav__menu .nav__menu-body {
    display: flex;
    align-items: start;
    padding: 15px 0;
    width: 100%;
}

.nav__menu .nav__menu-body .nav__menu-column {
    display: flex;
    flex-direction: column;
    width: 15%;
    margin-right: 10px;
}


.nav__menu .nav__menu-body .nav__menu-column h4 {
    margin-bottom: 10px;
    ;
}

.nav__menu .nav__menu-body .nav__menu-column a {
    text-decoration: none;
    color: #000;
    margin-bottom: 8px;
    font-weight: 100;
}

.nav__menu .nav__menu-body .nav__menu-center {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    width: 40%;
}


.nav__menu .nav__menu-body .nav__menu-center img {
    width: 350px;
    border-radius: 5px;
}

.nav__menu .nav__menu-body .nav__menu-center p {
    margin-top: 10px;
    font-size: 13px;
    width: 350px;
}

.nav__menu .nav__menu-body .nav__menu-center a {
    margin-top: 10px;
    color: var(--text-dark);
    text-decoration: none;
    font-weight: 600;
}

.nav__menu .nav__menu-body .nav__menu-right {
    display: flex;
    flex-direction: column;
    width: 30%;
    margin-left: 30px;
}

nav .nav__actionbar {
    display: flex;
    align-items: center;
    font-size: 20px;
    z-index: 111;
    cursor: pointer;
}

nav .nav__actionbar>a {
    padding: 0 10px;
    text-decoration: none;
    color: #000;
}

nav .nav__location-selector {
    border-radius: 10px;
    font-size: 15px;
    font-weight: 300;
    position: relative;
    cursor: pointer;
    margin-right: 10px;
}

nav .nav__location-selector span b {
    font-weight: 600;
}

.nav__item--special a {
    color: var(--bg-orange) !important;
    font-weight: 500 !important;
}

nav .nav__phone a {
    font-size: 15px;
    font-weight: 400;
    margin: 0;
    text-decoration: none;
    color: var(--text-dark);
    z-index: 111;
    position: relative;
}

nav .nav__phone p i {
    margin-right: 5px
}

nav .nav__primary .nav__logo {
    width: 100%;
    text-align: center;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    text-decoration: none;
    color: var(--text-dark);
}

nav .nav__primary .nav__logo h1 {
    font-size: 25px;
    font-weight: 700;
    text-transform: uppercase;
}

nav .nav__primary .nav__logo img {
    width: 200px;
}

nav .nav__secondary {
    display: flex;
    justify-content: center;
    padding: 10px;
    position: relative;
}

nav .nav__secondary .nav__item a:first-child {
    color: #000;
    text-decoration: none;
    padding: 10px 0;
    font-weight: 300;
    letter-spacing: 1px;
    border-radius: 10px;
    transition: 500ms ease-in-out all;
    margin-right: 25px;
    position: relative;
}

nav .nav__secondary a::before {
    content: '';
    position: absolute;
    background: var(--bg-dark);
    height: 0px;
    left: 0;
    right: 0;
    bottom: 0;
    transition: 500ms ease-in-out all;
    width: 100%;
}

nav .nav__secondary a:hover::before {
    height: 4px;
}



.location-selector {
    position: absolute;
    top: 100%;
    background: #eee;
    right: 0;
    width: 300px;
    border-radius: 10px;
    margin-top: 4px;
    padding: 20px 25px;
    z-index: 11111111;
    max-height: 0;
    overflow: hidden;
    visibility: hidden;
    transition: max-height 0.15s ease-out, visibility 0.15s ease-out;
}

nav .nav__location-selector:hover .location-selector {
    max-height: 350px;
    visibility: visible;
    transition: max-height 0.25s ease-in, visibility 0.25s ease-in;
}

.nav__cart {
    position: relative;
}

.nav__cart .nav__cart__count {
    position: absolute;
    top: -6px;
    right: -1px;
    background-color: #000;
    color: white;
    font-size: 0.7rem;
    border-radius: 50%;
    line-height: 1;
    font-weight: bold;
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 18px;
    height: 18px;
}

.location-selector input[type="text"] {
    padding: 10px 15px;
    width: 100%;
    box-sizing: border-box;
    border-radius: 10px;
    border: none;
    margin-bottom: 15px;
}

.location-selector .title {
    text-transform: uppercase;
    font-weight: 700;
    border-bottom: 1px solid #d8d8d8;
    padding-bottom: 5px;
    font-size: 19px;
}

.location-selector span {
    padding: 15px 0;
    display: block;
}

.location-selector span #store-name {
    font-size: 24px;
    font-weight: 700;
    text-transform: uppercase;
}

.location-selector span #store-timing {
    font-size: 15px;
    line-height: 9px;
    font-weight: 100;
}

.location-selector #get-direction {
    margin-top: 5px;
}

.location-selector #details p {
    padding: 5px 0;
    font-weight: 100;
}

.location-selector__item {
    color: #000;
    padding: 15px 8px;
    border-bottom: 1px solid #bcbcbc8c;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: 500ms ease-in-out all;
    cursor: pointer;
}

.location-selector__item span:nth-child(1) {
    font-size: 17px;
    font-weight: 400;
    text-transform: uppercase;
}

.location-selector__item span:nth-child(2) {
    font-size: 15px;
    font-weight: 300;
}

.location-selector__item:hover {
    background: #e1e1e1;
}

.product-search {
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    z-index: 11;
    height: 0px;
    background: var(--bg-offwhite);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 500ms ease-in-out all;
    overflow: hidden;
}

.product-search form {
    width: 40%;
}

.product-search form input[type="text"] {
    width: 100%;
    height: 45px;
    padding: 0 30px;
    font-size: 15px;
    border-radius: 10px;
    border: none;
}

.product-search__close {
    border: 0;
    background: transparent;
    color: #fff;
    font-size: 40px;
    position: absolute;
    right: 35px;
    top: 50%;
    transform: translateY(-50%);
    font-weight: 100;
    text-transform: uppercase;
}

.product-search__close i {
    color: var(--text-dark);
}

.product-search--open {
    height: 100px;
}

/**
 * Main Banner
 **/
.main-banner {
    height: 750px;
    position: relative;
}

.main-banner .main-banner__bg {
    background: url('/images/main-header.png');
    background-size: cover;
    background-position: center;
    position: absolute;
    transform: translate(-46%, -50%);
    z-index: 0;
    object-fit: cover !important;
    top: 50%;
    left: 50%;
    max-width: 100%;
    max-height: 100%;
    min-width: 90%;
    min-height: 100%;
}

.main-banner .main-banner__content {
    max-width: 700px;
    position: absolute;
    top: 0;
    bottom: 0;
    font-size: 25px;
    color: #fff;
    left: 10%;
    padding: 50px 60px;
    background: rgba(21, 60, 81, 0.92);
    text-align: center;
    box-shadow: 0px 2px 5px 1px rgba(26, 27, 41, 0.20);
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.main-banner .main-banner__content h1 {
    font-size: 100px;
    font-weight: 800;
    line-height: 100%;
    color: var(--text-light);
    text-align: center;
    z-index: 111;
}

.main-banner .main-banner__content p {
    padding: 20px 0;
    font-size: 17px;
    font-weight: 300;
    color: #aaaaaa;
}

.main-banner .main-banner__image {
    max-width: 600px;
    max-height: 500px;
}

.main-banner .main-banner__actions {
    display: flex;
    column-gap: 10px;
    justify-content: center;
    z-index: 1;
    margin-top: 30px;
}

/**
 * Promo Banner
 **/
.promo-banner .promo-alert {
    padding: 10px;
    background: var(--bg-dark);
    color: var(--text-light);
    text-align: center;
}

.promo-banner .promo-alert p {
    font-weight: 400;
    font-size: 15px;
}

.promo-banner .promo-guarantees {
    padding: 25px 10px;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    background: var(--bg-orange);
    column-gap: 45px;
}

.promo-guarantees .promo__item {
    font-size: 18px;
    font-weight: 700;
    display: flex;
    align-items: center;
    color: var(--text-light);
    text-decoration: none;
}

.promo-guarantees .promo__item svg {
    width: 60px;
}

.promo-guarantees .promo__item span {
    margin-left: 15px;
}

.promo-guarantees .promo__item span h4 {
    text-transform: uppercase;
    font-size: 20px;
}

.promo-guarantees .promo__item span p {
    font-weight: 100;
    font-size: 18px;
    line-height: 20px;
}

.promo-guarantees .promo__item i {
    margin-right: 10px;
    font-size: 40px;
}

/**
 * Categories
 **/
.featured-categories {
    padding: 10px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.featured-categories h1 {
    text-align: center;
}

.featured__items {
    max-width: 1000px;
    display: grid;
    margin-top: 30px;
    grid-column-gap: 30px;
    grid-row-gap: 25px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.featured__items .featured__item {
    text-align: center;
    text-decoration: none;
    color: #000;
    transition: 500ms ease-in-out all;
}

.featured__items .featured__item:hover {
    transform: translateY(-10px);
}

.featured__items .featured__item h4 {
    font-size: 18px;
    font-weight: 400;
}

.featured__items .featured__item img {
    max-width: 100%;
    height: auto;
    border-radius: 5px;
    object-fit: contain;
    margin-bottom: 5px;
}

/**
 * Featured Fold
 **/
.featured-fold {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 500px;
}

.featured-fold .featured-fold__image img {
    border-radius: 10px;
    width: 300px;
}

.featured-fold .featured-fold__content {
    padding: 20px 50px;
}

.featured-fold .featured-fold__content h1 {
    font-size: 30px;
    font-weight: 600;
}

.featured-fold .featured-fold__content p {
    font-weight: 100;
    margin: 5px 25px;
    font-size: 12px;
}

.featured-fold .featured-fold__content tl {
    display: flex;
    flex-direction: column;
}

.featured-fold .featured-fold__content tl ti {
    padding: 15px 0;
    border-bottom: 1px solid #ffffff24;
}

.featured-fold .featured-fold__content tl ti a {
    font-size: 18px;
    color: #fff;
    text-decoration: none;
    
}

.featured-fold .featured-fold__content tl ti i {
    margin-right: 5px;
    color: var(--text-orange);
}

/**
 * Top Brands
 **/
.top-brands {
    text-align: center;
    padding-bottom: 50px;
}

.top-brands>h1 {
    margin-bottom: 0px !important;
}

.top-brands .brands {
    display: grid;
    justify-content: center;
    grid-template-columns: repeat(5, 1fr);
    padding: 50px 300px;
    gap: 1rem;
    align-items: center;
}

.top-brands .brands img {
    width: 200px;
    object-fit: scale-down;
}

/**
 * Testimonial
 **/
.testimonial {
    width: 350px;
    background: #fff;
    color: #000;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    min-height: 535px;
}


.testimonial img {
    width: 350px;
    height: 300px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    object-fit: cover;
}

.testimonial .testimonial__content {
    padding: 20px 25px;
}

.testimonial .testimonial__content .testimonial__rating i {
    color: var(--bg-gold);
}

.testimonial .testimonial__content .testimonial__title {
    font-weight: 400;
    text-transform: uppercase;
}

.testimonial .testimonial__content .testimonial__text {
    font-weight: 300;
    padding: 11px 0;
    font-size: 14px;
    color: #7b7b7b;
}

.testimonial .testimonial__content hr {
    border-color: #ffffff7d;
    margin-bottom: 15px;
}

.testimonial .testimonial__customer {
    display: flex;
    align-items: center;
}

.testimonial .testimonial__customer .icon i {
    color: #32907a;
    font-size: 20px;
}

.testimonial .testimonial__customer .details {
    display: flex;
    flex-direction: column;
    margin-left: 8px;
}

.testimonial .testimonial__customer .details span:nth-child(1) {
    font-size: 15px;
    line-height: 1;
}

.testimonial .testimonial__customer .details span:nth-child(2) {
    font-size: 12px;
    text-transform: uppercase;
    color: #939393;
}

/**
 * Featured Products
 **/

.product__list {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    row-gap: 30px;
    column-gap: 25px;
    place-items: start;
    max-width: 2000px;
}

.product__list--featured {
    grid-template-columns: repeat(5, minmax(0, 250px));
    place-content: center;
}


.product__item,
.featured-products__item {
    position: relative;
    background: var(--bg-dark);
    color: #fff;
    border-radius: 5px;
    transition: 200ms ease-out transform;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    text-decoration: none;
}

.product__item .badge,
.featured-products__item .badge {
    position: absolute;
    top: 15px;
    left: 15px;
    padding: 0.4em 1em;
    border-radius: 999px;
    background-color: var(--bg-orange);
    color: white;
    font-weight: bold;
    font-size: 1rem;
    white-space: nowrap;
    transition: all 0.2s ease;
}

.product__item:hover,
.featured-products__item:hover {
    transform: translateY(-5px);
    transition: 500ms ease-in transform;
}

.product__item img,
.featured-products__item img {
    width: 100%;
    height: 250px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.product__content,
.featured-products__content {
    padding: 10px 25px;
}

.product__content .product__name,
.featured-products__content .product__name {
    text-decoration: none;
    color: var(--text-dark);
}

.product__content h1,
.featured-products__content h1 {
    font-size: 18px;
    font-weight: 300;
}

.product__content p,
.featured-products__content p {
    color: #939393;
    font-size: 13px;
    text-transform: uppercase;
}

.product__rating i,
.featured-products__rating i {
    color: var(--bg-gold);
    font-size: 23px;
    margin-bottom: 5px;
}

.product__currency,
.featured-products__currency {
    display: flex;
    padding: 10px 15px;
    background: #fafafa1c;
    margin-top: 10px;
}

.product__currency--single,
.featured-products__currency--single {
    justify-content: center;
}

.product__currency .current,
.featured-products__currency .current {
    display: flex;
    align-items: center;
    width: 60%;
    justify-content: center;
}

.product__currency--single .current--on-sale,
.featured-products__currency--single .current--one-sale {
    border-right: 1px solid #ffffff30;
}

.product__currency .current span:nth-child(1),
.featured-products__currency .current span:nth-child(1) {
    font-size: 10px;
    text-transform: uppercase;
    font-weight: 300;
    margin-right: 6px;
}

.product__currency .current span:nth-child(2),
.featured-products__currency .current span:nth-child(2) {
    font-size: 25px;
    font-weight: 300;
}

.product__currency .old,
.featured-products__currency .old {
    display: flex;
    align-items: center;
    color: #777575;
    justify-content: center;
    width: 40%;
}

.product__currency .old span:nth-child(1),
.featured-products__currency .old span:nth-child(1) {
    font-size: 10px;
    text-transform: uppercase;
    font-weight: 300;
    margin-right: 6px;
}

.product__currency .old span:nth-child(2),
.featured-products__currency .old span:nth-child(2) {
    text-decoration: line-through;
    font-size: 20px;
}

.product__quickview {
    position: absolute;
    left: 10px;
    right: 10px;
    bottom: 40%;
    opacity: 0;
    transition: 500ms ease-out opacity;
}

.product__quickview a:hover {
    background: var(--bg-dark);
    color: var(--text-light);
    transition: 200ms ease-in all;
}

.product__item:hover .product__quickview {
    opacity: 1;
    transition: 200ms ease-in opacity;
}

.product__quickview a {
    box-sizing: border-box;
    text-decoration: none;
    color: #000;
    border: 2px dashed #000;
    border-radius: 5px;
    display: inline-block;
    width: 100%;
    text-align: center;
    padding: 8px 0;
    text-transform: uppercase;
    font-size: 15px;
    letter-spacing: 2px;
    transition: 500ms ease-out all;
    background-color: var(--bg-offwhite);
}

.product__item--variant {
    background: transparent;
    width: 100%;
    color: var(--text-dark);
    max-height: 420px;
    cursor: pointer;
}

.product__item--variant img {
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    margin-bottom: 10px;
    border-radius: 5px;
}

.product__item--variant .product__content {
    padding: 0px;
}

.product__item--variant .product__content .product__rating {
    margin-bottom: 5px;
}


.product__item--variant .product__content h1 {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 5px;
}

.product__item--variant .product__currency {
    display: flex;
    padding: 0px;
    background: #fafafa1c;
    margin-top: 0px;
    flex-direction: column;
    align-items: unset;
}

.product__item--variant .product__currency .current {
    display: block;
    color: var(--bg-dark);
}

.product__item--variant .product__currency .current span:nth-child(1) {
    font-size: 10px;
    text-transform: uppercase;
    font-weight: 500;
    margin-right: 6px;
}

.product__item--variant .product__currency .current span:nth-child(2) {
    font-size: 25px;
    font-weight: 500;
}


.product__item--variant .product__currency .old {
    display: block;
    margin-left: 10px;
}

.product__item--variant .product__currency .old span:nth-child(1) {
    font-size: 10px;
    text-transform: uppercase;
    font-weight: 400;
    margin-right: 6px;
}

.product__item--variant .product__currency .old span:nth-child(2) {
    text-decoration: line-through;
    font-size: 16px;
    font-weight: 400;
}

.bought-together {
    margin: 50px 0;
}

.bought-together>h1 {
    font-weight: 400;
    margin-bottom: 30px;
    text-align: center;
}

/**
 * Find Stores
 **/
.find-stores {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
}

.find-stores__content h1 {
    font-size: 30px;
    font-weight: 400;
}

.find-stores__content h4 {
    font-weight: 200;
    font-size: 30px;
}

.find-stores__image img {
    width: 800px;
}

.find-stores__content a {
    margin-top: 15px;
}

.find-stores__content .store-list {
    padding: 20px 0px;
    text-align: center;
}

.find-stores__content .action {
    display: flex;
    align-items: center;
    justify-content: center;
}

.find-stores__content .action a {
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 20px;
    font-size: 30px;
    font-weight: 300;
    width: 75%;
}

.find-stores__content .store-list .grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}

.find-stores__content .store-list p {
    padding: 10px 0px;
    font-size: 18px;
    font-weight: 100;
}

.find-stores__content .store-list h3 {
    margin-bottom: 5px;
    font-size: 24px;
    font-weight: 400;
}

.find-stores__content .store-list ul {
    margin-left: 30px;
}

.find-stores__content .store-list ul li {
    font-size: 18px !important;
}

/**
 * Help & Support 
 **/
.support-help {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    background: linear-gradient(to right, #DCE1E6, #B8C3CC);
    padding: 50px;
    border-radius: 15px;
    box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.1);
}

.support-help__image img {
    width:650px;
    border-radius: 15px;
    box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.1);
}

.support-help__content {
    width: 50%;
    max-width: 600px;
    text-align: left;
}

.support-help__content h1 {
    font-weight: 700;
    font-size: 24px;
    margin-bottom: 15px;
    color: #153C51;
}

.support-help__content p {
    color: #153C51;
    line-height: 1.6;
    font-size: 18px;
}

.support-help__buttons {
    margin-top: 25px;
}

.support-help__button-primary,
.support-help__button-secondary {
    text-decoration: none;
    padding: 12px 30px;
    display: inline-block;
    border-radius: 8px;
    margin-right: 15px;
    font-weight: 500;
    transition: all 0.3s ease;
    font-size: 16px;
    border: none;
    cursor: pointer;
}

.support-help__button-primary {
    background: #0071AE;
    color: #fff;
    box-shadow: 0 4px 10px rgba(0, 113, 174, 0.3);
}

.support-help__button-primary:hover {
    background: #153C51;
}

.support-help__button-secondary {
    background: #fff;
    color: #0071AE;
    border: 2px solid #0071AE;
}

.support-help__button-secondary:hover {
    background: #0071AE;
    color: #fff;
    border-color: #F18724;
}

/**
 * Brand Guarantee
 **/
.brand-guarantee__items {
    display: flex;
    align-items: flex-start;
    justify-content: space-evenly;
}

.brand-guarantee__item {
    width: 15%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.brand-guarantee__item svg {
    width: 120px;
    margin-bottom: 15px;
}

.brand-guarantee__item i {
    font-size: 55px;
    color: var(--text-orange);
}

.brand-guarantee__item h1 {
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 3px;
    text-align: center;
}

.brand-guarantee__item p {
    font-weight: 200;
    text-align: center;
    color: #beb9b9;
    font-size: 12px;
}

/**
 * Sign Up
 **/

.signup {
    padding: 50px 150px;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
}

.signup h1 {
    font-weight: 500;
    font-size: 30px;
}

.signup__form input[type="text"] {
    padding: 19px;
    width: 300px;
    background: var(--bg-offwhite);
    border: 1px solid #00184530;
    border-radius: 10px;
    font-size: 16px;
}

.signup__form button[type="submit"] {
    border-radius: 10px;
    background: var(--bg-light);
    color: #fff;
    border: 1px solid #00184536;
    text-transform: uppercase;
    font-size: 17px;
    height: 65px;
    width: 200px;
    cursor: pointer;
    margin-left: 5px;
}

.signup--dark {
    background: var(--bg-dark);
    color: var(--text-light);
}

.signup--dark .signup__form button[type="submit"] {
    background: var(--bg-orange);
}

/**
 * Footer
 **/
footer {
    background: var(--bg-offwhite);
}

footer .footer__columns {
    display: flex;
    align-items: self-start;
    justify-content: space-between;
    padding: 90px;
    border-bottom: 2px solid #e4e2e2;
}

footer .footer__column {
    display: flex;
    flex-direction: column;
}

footer .footer__column .footer__links {
    display: flex;
    flex-direction: column;
}

footer .footer__column h4 {
    text-transform: uppercase;
    font-weight: 600;
    padding: 10px 0;
    border-bottom: 1px solid #dddddd;
    margin-bottom: 10px;
}

footer .footer__column h3 {
    font-weight: 600;
    margin-bottom: 10px;
    width: 500px;
    font-size: 25px;
}

footer .footer__column .footer__links a {
    text-decoration: none;
    color: #616161;
    padding: 6px 0;
    font-size: 15px;
}

footer .footer__support {
    display: flex;
    flex-direction: column;
    padding: 0 20px;
}

footer .footer__support a {
    text-decoration: none;
    color: #000;
    padding: 10px 0px;
    font-size: 18px;
}

footer .footer__end {
    padding: 30px 100px;
    border-top: 1px solid #163c5129;
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

footer .footer__end h4 {
    font-size: 22px;
    font-weight: 500;
    margin: 15px 0;
    text-align: left;
    color: #333;
}

footer .footer__end p {
    font-size: 14px;
    font-weight: 400;
    color: #555;
}

footer .footer__end .social {
    display: flex;
    align-items: center;
    column-gap: 15px;
    font-size: 22px;
    margin-bottom: 10px;
}

footer .footer__end .social a {
    color: #333;
    transition: color 0.3s ease;
}

footer .footer__end .social a:hover {
    color: #0077b5;
}

footer .footer__end .bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

footer .footer__end .bottom p {
    flex: 1;
    text-align: left;
}

footer .footer__end .bottom .payment-methods {
    display: flex;
    column-gap: 15px;
    align-items: center;
    justify-content: flex-end;
}

footer .footer__end .bottom .payment-methods img {
    height: 24px;
    transition: transform 0.3s ease;
}

footer .footer__end .bottom .payment-methods img:hover {
    transform: scale(1.1);
}

/**
 * Discount Banner
 **/
.discount-banner {
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-dark);
}

.discount-banner__content h1 {
    font-size: 28px;
    font-weight: 600;
    color: var(--text-light);
    font-family: "Noto Serif", serif;
}

/**
 * Content ( Layout )
 **/
.content__section {
    padding: 20px 0px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    /* align-items: center; */
    max-width: 1256px;
    margin: 0 auto;
}

.content__section--special {
    padding: 0px 400px;
}

.content__section__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
    border-bottom: 1px solid #eee;
    padding: 25px 0;
    width: 100%;
}

.content__section__header h1 {
    font-weight: 400;
    font-size: 35px;
    text-transform: capitalize;
}

.content__section__action {
    text-align: center;
    padding: 40px 0;
}

.content__section__body .no-results {
    padding: 80px 0;
    text-align: center;
}

.content__section__body .no-results img {
    margin-bottom: 20px;
}

.content__section__body .no-results a {
    text-decoration: none;
}

.content__section__body .no-results h1 {
    font-weight: 100;
    font-size: 35px;
}

.content__section__body .search__section {
    margin-bottom: 20px;
    border-bottom: 1px solid #eee;
    padding: 25px 0;
    width: 100%;
}

.content__section__body .search__section h1 {
    font-size: 40px;
    font-weight: 200;
}

/**
 * Modal
 **/
.modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 50%;
    border-radius: 5px;
    opacity: 0;
    transition: 200ms ease-out opacity;
    z-index: -1111;
}

.modal--active {
    opacity: 1;
    z-index: 1111;
    transition: 500ms ease-in opacity;
}

.modal--lg {
    max-width: 65% !important;
}

.modal .modal__close-btn {
    position: absolute;
    right: 20px;
    top: 20px;
}

.modal .modal__close-btn a svg {
    width: 25px;
    height: 25px;
}

.modal .modal__body {
    position: relative;
    background: var(--bg-white);
    padding: 35px 30px;
    border-radius: 5px;
    height: 700px;
    overflow-y: scroll;
}

.modal-bg {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #0000009c;
    backdrop-filter: blur(5px);
    opacity: 0;
    transition: 200ms ease-out opacity;
    z-index: -1111;
}

.modal-bg--active {
    opacity: 1;
    z-index: 111;
    transition: 500ms ease-in opacity;
}

.carousel.splide__slide {
    display: flex;
    justify-content: center;
}

.carousel .splide__slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/**
 * Quickview ( Modal )
 **/
.productview {
    display: grid;
    grid-template-columns: 40% 60%;
    grid-column-gap: 20px;
    place-content: center;
    padding: 20px 0;
    width: 100%;
}

.productview__info--fullview {
    padding: 0 20px;
}

.productview__info--quickview h1 {
    font-size: 27px !important;
    font-weight: 600 !important;
}

.productview .product__rating {
    font-size: 23px;
    margin-bottom: 5px;
}

.productview__info .description {
    padding: 6px 0;
    font-weight: 100;
}

.productview__info>h1 {
    font-size: 35px;
    font-weight: 500;
}

/* .productview__info>p { */
/*     margin-bottom: 5px; */
/* } */

.productview__info>p b {
    font-weight: 500;
    font-size: 15px;
    color: #5c5b5b;
}

.productview .details {
    padding: 0 20px;
    display: flex;
    flex-direction: column;
}

.productview .currency {
    margin: 15px 0;
}

.productview .currency--quickview {
    margin: 0;
    margin-bottom: 20px;
}

.productview .currency .badge {
    background: var(--bg-orange);
    padding: 5px 10px;
    font-size: 15px;
    color: #fff;
    border-radius: 5px;
}

.productview .currency .current {
    display: flex;
    align-items: baseline;
}

.productview .product__pointers {
    margin: 15px 0;
}

.productview .currency .current span:nth-child(1) {
    font-size: 30px;
    color: var(--text-orange);
    font-weight: 400;
    margin-top: 5px;
}

.productview .currency .current span:nth-child(2) {
    font-size: 30px;
    font-weight: 600;
    color: var(--text-orange);
    letter-spacing: -1px;
}

.productview .currency .old {
    display: flex;
    align-items: baseline;
    line-height: 10px;
}

.productview .currency .old span:nth-child(1) {
    text-transform: uppercase;
    font-weight: 400;
    font-size: 12px;
    color: #787878;
}

.productview .currency .old span:nth-child(2) {
    text-decoration: line-through;
    font-weight: 300;
    font-size: 15px;
    margin-left: 5px;
    color: #787878;
}

.productview .variation {
    margin-bottom: 15px;
}

.productview .variation .variation__title {
    text-transform: uppercase;
    margin-bottom: 10px;
}

.productview .variation .variation__list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-column-gap: 30px;
    grid-row-gap: 10px;
}


.productview .variation .variation__list .variation__item label {
    display: block;
    background: #eee;
    border-radius: 5px;
    text-align: center;
    padding: 15px 0;
    transition: 500ms ease-in-out all;
    cursor: pointer;
}

.productview .variation .variation__list .variation__item input {
    display: none;
}

.productview .variation .variation__list .variation__item input[type="radio"]:checked+label {
    background: var(--bg-orange);
}

.productview .variation .variation__list .variation__item label:hover {
    background: var(--bg-orange);
    color: var(--text-dark);
    cursor: pointer;
}

.productview .variation .variation__list .variation__item p:nth-child(1) {
    font-weight: 600;
}

.productview .variation .variation__list .variation__item p:nth-child(2) {
    color: #757575;
    font-weight: 400;
    font-size: 15px;
}

.productview .information {
    height: 100%;
    overflow-y: scroll;
    margin: 15px 0;
    max-height: 250px;
}

.productview .actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    column-gap: 10px;
}

.productview .overview {
    font-size: 30px;
    font-weight: 500;
    margin: 30px 0px 10px 0;
}

.productview .support {
    background: #eee;
    padding: 20px;
    border-radius: 5px;
    border: 1px solid #d0d0d0;
}

.productview .support .support__content {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}

.productview .support .support__content img {
    width: 100px;
    height: 100px;
    border-radius: 100px;
    object-fit: cover;
}

.productview .support .support__content div {
    margin-left: 15px;
}

.productview .support .support__content div h1 {
    font-weight: 400;
}

.productview .support .support__actions {
    display: flex;
    column-gap: 10px;
}

.productview .highlights {
    border: 1px solid var(--bg-dark);
    border-radius: 5px;
    padding: 25px;
}

.productview .highlights h1 {
    font-size: 25px;
    font-weight: 400;
}

.productview .highlights .highlight__items {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    padding: 25px 0;
    row-gap: 20px;
    column-gap: 10px;
}

.productview .highlights .highlight__items .highlight__item {
    display: flex;
    align-items: center;
    font-size: 17px;
    font-weight: 300;
}

.productview .highlights .highlight__items .highlight__item i {
    font-size: 25px;
    margin-right: 15px;
}

.product__reviews {
    margin-top: 45px;
    width: 100%;
}

.product__reviews .review__header h4 {
    font-size: 36px;
    font-weight: 300;
    margin-bottom: 15px;
    text-align: center;
    padding: 35px 0;
}

.product__reviews .review__header .total__rating .rating-item {
    display: flex;
    width: 400px;
    align-items: center;
    justify-content: space-between;
    padding: 5px 0;
}

.product__reviews .review__header .total__rating .rating-item p {
    font-weight: 200;
    font-size: 14px;
}

.product__reviews .review__header .total__rating .rating-item .rating-progress {
    background: var(--bg-offwhite);
    display: block;
    width: 300px;
    padding: 6px 0px;
    border-radius: 10px;
    overflow: hidden;
    position: relative;
}

.product__reviews .review__header .total__rating .rating-item .rating-progress .progress {
    background: var(--bg-gold);
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    width: 73%;
}

.product__reviews .review__header {
    border-bottom: 1px solid #d2d2d2;
    padding: 35px 0px;
}

.product__reviews .review__header .col {
    display: flex;
    justify-content: center;
    column-gap: 90px;
}

.product__reviews .review__header .avg__rating h5 {
    font-size: 25px;
    font-weight: 100;
}

.product__reviews .review__header .avg__rating .rating__details {
    display: flex;
    align-items: center;
    column-gap: 20px;
}

.product__reviews .review__header .avg__rating .rating__details h1 {
    font-size: 60px;
}

.product__reviews .review__header .avg__rating .rating__details .rating .stars {
    font-size: 20px;
    color: var(--bg-gold);
}

.product__reviews .review__sentiment {
    text-align: center;
    padding: 40px 0;
    background: #eee;
}

.product__reviews .review__sentiment .rating__types {
    padding: 15px 0;
    display: flex;
    justify-content: center;
    column-gap: 60px;
}

.product__reviews .review__sentiment .rating__types .rating__type p {
    font-weight: 100;
    margin-bottom: 7px;
}

.product__reviews .review__sentiment .rating__types .rating__type .rating-progress {
    background: var(--bg-offwhite);
    padding: 7px;
    width: 200px;
    mask: linear-gradient(90deg, rgb(0, 0, 0) 96%, rgba(0, 0, 0, 0) 0px) 0px center / 20%;
    position: relative;
}

.product__reviews .review__sentiment .rating__types .rating__type .rating-progress .progress {
    background: var(--bg-gold);
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 54%;
}

.product__reviews .review__filter {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 25px 0;
    border-bottom: 1px solid #d2d2d2;
}

.product__reviews .review__filter p {
    font-size: 15px;
    font-weight: 100;
}

.product__reviews .review__filter .filter__actions {
    display: flex;
    column-gap: 15px;
}

.product__reviews .review__filter .filter__actions .input-group input {
    width: 400px;
    padding: 0px 10px;
}

.product__reviews .customer__review {
    display: flex;
    justify-content: space-between;
    padding: 35px 0;
    border-bottom: 1px solid #d2d2d261;
}

.product__reviews .customer__review .details {
    width: 700px;
}

.product__reviews .customer__review .details .rating {
    color: var(--bg-gold);
}

.product__reviews .customer__review .details .review__title {
    font-size: 20px;
    margin-bottom: 7px;
}

.product__reviews .customer__review .details .review__author {
    font-weight: 600;
}

.product__reviews .customer__review .details .review__duration {
    font-weight: 100;
    margin-bottom: 10px;
    font-size: 13px;
}

.product__reviews .customer__review .details .review__comment {
    font-weight: 300;
    font-size: 16px;
}

.product__reviews .customer__review .details .review__recommended {
    padding: 15px 0;
}

.product__reviews .customer__review .customer__ratings {
    width: 400px;
    background: #eee;
    border-radius: 5px;
    padding: 25px 45px;
}

.product__reviews .customer__review .customer__ratings .customer__rating {
    margin-bottom: 15px;
}

.product__reviews .customer__review .customer__ratings .customer__rating p {
    font-weight: 100;
    margin-bottom: 5px;
    font-size: 14px;
}

.product__reviews .customer__review .customer__ratings .customer__rating div {
    display: flex;
    align-items: center;
}

.product__reviews .customer__review .customer__ratings .customer__rating span {
    margin-left: 10px;
    font-size: 13px;
}


.product__reviews .customer__review .customer__ratings .rating-progress {
    background: var(--bg-offwhite);
    padding: 7px;
    width: 70%;
    mask: linear-gradient(90deg, rgb(0, 0, 0) 96%, rgba(0, 0, 0, 0) 0px) 0px center / 20%;
    position: relative;
}

.product__reviews .customer__review .customer__ratings .rating-progress .progress {
    background: var(--bg-gold);
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 54%;
}

.product__reviews .review__actions {
    text-align: center;
    margin: 20px;
}


/**
 * Offcanvas
 **/
.offcanvas {
    position: fixed;
    top: 0;
    background: #fff;
    bottom: 0;
    width: 20%;
    z-index: 1111111;
    overflow-y: auto;
}

.offcanvas--right {
    right: -1000px;
    transition: 550ms ease-out right;
}

.offcanvas--left {
    left: -1000px;
    transition: 550ms ease-out left;
}

.offcanvas .offcanvas__body .header {
    padding: 10px 0;
}

.offcanvas .offcanvas__body .content {
    height: 100vh;
    overflow-y: scroll;
}

.offcanvas--left.offcanvas--active {
    left: 0;
    transition: 500ms ease-in left;
}

.offcanvas--right.offcanvas--active {
    right: 0;
    transition: 500ms ease-in right;
}

.offcanvas .offcanvas__close-btn {
    position: absolute;
    right: 15px;
    top: 15px;
    z-index: 11111;
}


.offcanvas .offcanvas__close-btn a svg {
    width: 20px;
    height: 20px;
}

.offcanvas .offcanvas__body {
    padding: 10px 20px;
    height: 97vh;
    display: flex;
    flex-direction: column;
}

.offcanvas__body .title {
    text-transform: uppercase;
    font-size: 25px;
    letter-spacing: 0px;
}

/**
 * Cart
 **/
.empty-cart {
    display: flex;
    height: 100%;
    justify-content: center;
    text-align: center;
    flex-direction: column;
    align-items: center;
}

.empty-cart img {
    width: 150px;
}

.empty-cart h1 {
    font-weight: 100;
    margin-bottom: 20px;
}

.empty-cart a {
    text-decoration: none;
}

.cart {
    padding: 120px 20px !important;
}

.cart .content {
    overflow-y: unset !important;
}

.cart .header {
    padding: 10px 0;
    position: fixed;
    background: #fff;
    top: 0;
    width: 350px;
}

.cart--isEmpty {
    padding: 0px 15px !important
}

.cart .header .title {
    margin-bottom: 10px;
}

.cart .header .header__actions {
    display: flex;
    align-items: center;
    column-gap: 7px;
}

.cart .cart-total {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 10px 0;
}

.cart .cart-total p:nth-child(2) {
    font-weight: 600;
}

.cart .content {
    height: auto !important;
}

.cart .cart-items {
    display: flex;
    flex-direction: column;
    row-gap: 15px;
    margin-bottom: 30px;
}

.cart .cart-item {
    display: flex;
    column-gap: 10px;
}

.cart .cart-item img {
    width: 80px;
    height: 80px;
    border-radius: 5px;
}

.cart .cart-item .cart-item__details {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
}

.cart .cart-item .cart-item__details .upper {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
}

.cart .cart-item .cart-item__details .upper a {
    text-decoration: none;
    color: var(--text-dark);
}

.cart .cart-item .cart-item__details .upper .price {
    font-size: 15px;
    font-weight: 500;
    color: #f18724;
}

.cart .cart-item .cart-item__details .upper h4 {
    font-weight: 500;
}

.cart .cart-item .cart-item__details .upper p {
    font-size: 14px;
    font-weight: 200;
}

.cart .cart-item .cart-item__details .lower {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.cart .cart-item .cart-item__details .lower p {
    font-weight: 600;
    font-size: 17px;
    color: #0171ae;
}

/**
 * Cart Review
 **/
.review-cart__body {
    display: flex;
    justify-content: center;
    column-gap: 50px;
    padding: 20px 0;
    background: #f4f2f2;
}

.review-cart__body .summary .summary__body {
    background: #fff;
    padding: 10px 25px;
    border-radius: 5px;
    position: sticky;
    top: 20px;
    width: 100%;
}

.review-item {
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 20px;
    max-width: 800px;
    margin-bottom: 10px;
    background-color: #fff;
}

.review-item__info {
    display: flex;
    gap: 20px;
}

.review-item .image-section {
    position: relative;
    flex: 1;
}

.review-item .image-section img {
    max-width: 160px;
    border-radius: 8px;
}

.review-item .hot-price {
    position: absolute;
    bottom: 0;
    left: 0;
    background-color: #8c1d1d;
    color: white;
    padding: 4px 8px;
    border-radius: 4px 4px 0 0;
    font-size: 12px;
}

.review-item .details-section {
    flex: 3;
}

.review-item .details-section .details-section__split {
    display: flex;
}

.review-item .details-section .details-section__split .left {
    flex: 1;
}

.review-item .details-section .details-section__split .right .price {
    display: flex;
    flex-direction: column;
    align-items: self-end;
}

.review-item .details-section .details-section__split .right .price .subtotal {
    font-size: 25px;
    font-weight: 600;
    color: #f18723;
}

.review-item .details-section .details-section__split .right .price .discount {
    font-size: 13px;
    font-weight: 400;
    color: #929292;
}

.review-item .details-section .details-section__split .right .price .discount span {
    text-decoration: line-through;
}

.review-item .details-section .details-section__split .right .price .peritem {
    font-size: 15px;
    font-weight: 500;
    color: #163c51;
}

.review-item .details-section h2 {
    margin: 0;
    font-size: 20px;
    margin-bottom: 10px;
}

.review-item .details-section p {
    font-size: 13px;
}

.review-item .rating {
    color: #b3881e;
    margin: 5px 0;
}

.review-item .price {
    margin: 10px 0;
}

.review-item .current-price {
    color: #8c1d1d;
    font-weight: bold;
    font-size: 20px;
    margin-right: 10px;
}

.review-item .original-price {
    text-decoration: line-through;
    color: #888;
    margin-right: 10px;
}

.review-item .savings {
    color: green;
    font-weight: 600;
}

.review-item .quantity-control {
    display: flex;
    align-items: center;
    margin: 10px 0;
    gap: 10px;
}

.review-item .quantity-btn {
    width: 30px;
    height: 30px;
    font-size: 18px;
    border: 1px solid #aaa;
    border-radius: 50%;
    background: white;
    cursor: pointer;
}

.review-item .quantity-value {
    min-width: 20px;
    text-align: center;
}

.review-item .extend-protection {
    background-color: #f4f4f4;
    padding: 10px;
    border-radius: 6px;
    margin: 15px 0;
}

.review-item .delivery-section {
    margin-top: 15px;
}

.review-item .delivery-date {
    font-weight: bold;
    color: green;
}

.review-item .unavailable {
    margin-top: 10px;
    color: #999;
}

.review-item .remove-btn {
    display: block;
    margin-top: 10px;
    color: #3366cc;
    text-decoration: none;
    font-size: 14px;
    text-align: end;
}

.review-cart__body .cart__checkout {
    width: 100%;
    height: 50px;
    background: var(--bg-light);
    border-radius: 5px;
    border: none;
    font-size: 18px;
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

/**
 * Accordion
 **/

.accordion {
    margin: 15px 0;
}

.accordion .accordion__item {
    margin-bottom: 5px;
    cursor: pointer;
}

.accordion .accordion__item .accordion__header {
    padding: 15px 20px;
    background: #eee;
    display: flex;
    justify-content: space-between;
    font-size: 17px;
    font-weight: 500;
    position: relative;
}

.accordion .accordion__item .accordion__header::after {
    content: "";
    position: absolute;
    right: 20px;
    background-image: var(--arrow-img);
    width: 20px;
    height: 20px;
    transform: rotate(0deg);
}

.accordion .accordion__item.active .accordion__header::after {
    transform: rotate(-180deg);
}

.accordion .accordion__item .accordion__content {
    background: #f8f8f8;
    font-size: 17px;
    font-weight: 300;
    overflow: hidden;
    max-height: 0px;
    transition: max-height 400ms ease-out;
    padding: 0 15px;
}

.accordion .accordion__item .accordion__content p,
.accordion .accordion__item .accordion__content div:first-child {
    padding: 15px 0;
}

.accordion .accordion__item.active .accordion__content {
    max-height: 1000px;
    transition: max-height 500ms ease-in;
}

.accordion .accordion__item .accordion__content ul {
    padding: 10px 20px;
    font-size: 15px;
}

.filter-list .input-group label {
    font-size: 15px;
}

/**
 * Utilities
 **/
.overflow-hidden {
    overflow: hidden;
}

.section>h1:first-of-type {
    text-align: center;
    font-size: 30px;
    font-weight: 700;
    margin-bottom: 30px;
}

.section .section__actions {
    padding-top: 130px;
    text-align: center;
}

.section .section__actions p {
    color: #ababab;
    font-size: 13px;
    margin-top: 20px;
}

.section--special {
    padding: 90px 50px;
}

.section--spacing {
    padding: 50px 200px;
}

.section--dark {
    background: var(--bg-dark);
    color: #fff;
}

.btn {
    padding: 15px 40px;
    font-size: 17px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
    text-align: center;
    box-sizing: border-box;

    background: #fff;
    color: #000;
}

.btn:disabled {
    background-color: var(--bg-btn-disabled);
    cursor: not-allowed;
}

.btn--dark {
    background: var(--bg-dark);
    color: var(--text-light);
}

.btn--orange {
    background: var(--bg-orange);
    color: var(--text-light);
}

.btn--outline {
    border: 2px solid #000;
}

.btn--outline:disabled {
    background: var(--bg-btn-outline-disabled);
    border: 2px solid var(--bg-btn-outline-disabled);
    cursor: not-allowed;
}

.btn--block {
    width: 100% !important;
}

/**
 * Form
 **/
.input-group {
    width: 100%;
    position: relative;
}

.input-group .invalid-feedback {
    margin-bottom: 15px;
}

.input-group input {
    display: block;
    width: 100%;
    height: 45px;
    background: #eee;
    padding: 5px 10px;
    border-radius: 5px;
    border: 1px solid #e3e3e3;
    box-sizing: border-box;
}

.input-group select {
    width: 100%;
    background-color: white;
    border-radius: 4px;
    display: block;
    font: inherit;
    line-height: 1.5em;
    padding: 0.5em 3.5em 0.5em 1em;
    margin: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image:
        linear-gradient(45deg, transparent 50%, gray 50%),
        linear-gradient(135deg, gray 50%, transparent 50%),
        linear-gradient(to right, #ccc, #ccc);
    background-position:
        calc(100% - 20px) calc(1em + 2px),
        calc(100% - 15px) calc(1em + 2px),
        calc(100% - 2.5em) 0.5em;
    background-size:
        5px 5px,
        5px 5px,
        1px 1.5em;
    background-repeat: no-repeat;
}

.input-group select:focus {
    background-image:
        linear-gradient(45deg, green 50%, transparent 50%),
        linear-gradient(135deg, transparent 50%, green 50%),
        linear-gradient(to right, #ccc, #ccc);
    background-position:
        calc(100% - 15px) 1em,
        calc(100% - 20px) 1em,
        calc(100% - 2.5em) 0.5em;
    background-size:
        5px 5px,
        5px 5px,
        1px 1.5em;
    background-repeat: no-repeat;
    border-color: green;
    outline: 0;
}

.custom-checkbox {
    display: block;
    position: relative;
    padding-left: 30px;
    cursor: pointer;
    font-size: 16px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    margin-bottom: 5px;
    font-weight: 300;
}

.custom-checkbox input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

.checkbox {
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: #eee;
    border: 1px solid var(--bg-dark);
    border-radius: 5px;
}


.custom-checkbox:hover input~.checkbox {
    background-color: var(--checkbox-hover);
}

.custom-checkbox input:checked~.checkbox {
    background-color: var(--bg-dark);
}

/**
 * Product Details
 **/
.product-details {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 20px;
}


/**
 * Filter List
 **/
.filter {
    display: flex;
    flex-direction: column;
    height: 100%;
    position: relative;
}

.filter form {
    margin: 15px 0;
    height: 85%;
    overflow: hidden;
    overflow-y: auto;
}

.filter .filter__actions {
    display: flex;
    flex-direction: column;
    position: fixed;
    bottom: 0;
    left: -1000px;
    background: #fff;
    width: 342px;
    padding: 0 20px;
    transition: left 550ms ease-out;
}

.actions--active {
    left: 0 !important;
    transition: left 500ms ease-in;
}

.filter .filter__actions a {
    text-align: center;
    padding: 10px 0;
}

.filter-list .custom-checkbox {
    margin-left: 20px;
}

/**
 * Range Silder
 **/
.filter .range {
    margin-top: 20px;
}

.filter .range p:first-child {
    margin-bottom: 15px;
    font-size: 17px;
    font-weight: 500;
}

.range-slider {
    height: 5px;
    position: relative;
    background-color: #e1e9f6;
    border-radius: 2px;
}

.range-selected {
    height: 100%;
    left: 0%;
    right: 0%;
    position: absolute;
    border-radius: 5px;
    background-color: #153C51;
}

.range-input {
    position: relative;
}

.range-input input {
    position: absolute;
    width: 100%;
    height: 5px;
    top: -6px;
    background: none;
    pointer-events: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.range-input input::-webkit-slider-thumb {
    height: 20px;
    width: 20px;
    border-radius: 50%;
    border: 3px solid #153C51;
    background-color: #fff;
    pointer-events: auto;
    -webkit-appearance: none;
}

.range-input input::-moz-range-thumb {
    height: 15px;
    width: 15px;
    border-radius: 50%;
    border: 3px solid #153C51;
    background-color: #fff;
    pointer-events: auto;
    -moz-appearance: none;
}

.range-price {
    margin: 30px 0;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.range-price div {
    position: relative;
}

.range-price label {
    position: absolute;
    top: 110%;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 100%;
    text-align: center;
    text-transform: uppercase;
    font-size: 15px;
    font-weight: 600;
}

.range-price input {
    text-align: center;
    background: #eee;
    border: 1px solid #d1d1d1;
    border-radius: 5px;
    font-size: 15px;
    width: 60px;
    padding: 5px 10px;
}

/**
 * Checkout Page
 **/

.checkout-page__header {
    background: #dce1e663;
    padding: 20px 15px;
    text-align: center;
    color: var(--text-dark);
}

.checkout__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.checkout__header img {
    width: 250px;
}

.checkout__header a {
    color: var(--text-dark);
}

.checkout-page__body {
    display: flex;
    justify-content: center;
    column-gap: 50px;
    padding: 20px 0;
    background: #f4f2f2;
}

.checkout-page__body .checkout {
    width: 35%;
}

.checkout__title {
    font-weight: 100;
    font-size: 40px;
    text-transform: uppercase;
}

.checkout__form {
    margin-bottom: 25px;
}

.checkout__form .form__header {
    padding: 10px 0;
}

.checkout__form .form__header h1 {
    font-size: 40px;
    font-weight: 400;
}

.checkout__form .form__header h1 span {
    font-size: 17px;
    margin-left: 10px;
    font-weight: 200;
}

.checkout__form .form__section {
    padding: 20px 0px;
    border-radius: 5px;
}

.checkout__form .form__section h2 {
    font-weight: 400;
    font-size: 20px;
    margin-bottom: 5px;
    color: #000;
    padding: 10px 0px;
    border-radius: 3px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.checkout__form .form__section h2 i {
    color: var(--text-orange);
}


.checkout__form .form__section .form__fields .field-box {
    display: flex;
    column-gap: 10px;
}

.checkout__form .form__section .form__fields input[type="text"],
.checkout__form .form__section .form__fields select,
.summary__discount input[type="text"] {
    display: block;
    box-sizing: border-box;
    width: 100%;
    height: 56px;
    background: #f8f8f882;
    border: 1px solid #163c5126;
    padding: 0 20px;
    border-radius: 2px;
    border-bottom: 2px solid #153C51;
    font-size: 15px;
    margin-bottom: 10px;
    transition: border-bottom 200ms ease-out;
}

.checkout__form .form__section .form__fields input[type="text"]::placeholder,
.checkout__form .form__section .form__fields select::placeholder,
.summary__discount input[type="text"]::placeholder {
    color: #adadad;
    font-weight: 600;
}

.checkout__form .form__section .form__fields select:focus,
.checkout__form .form__section .form__fields input:focus {
    outline: none;
    border-bottom: 4px solid #153C51;
    transition: border-bottom 100ms ease-in;
}

.checkout-page__body .summary {
    width: 25%;
}

.checkout-page__body .summary .summary__body {
    background: #fff;
    padding: 10px 25px;
    border-radius: 5px;
    position: sticky;
    top: 20px;
}

.summary__body .summary__title {
    font-weight: 600;
    padding: 15px 0;
}

.summary__body .summary__offer {
    background: #f4f2f2;
    padding: 13px;
    border-radius: 5px;
    text-align: center;
}

.summary__items {
    margin: 15px 0;
}

.summary__items .cart-item {
    display: flex;
    width: 100%;
    column-gap: 10px;
    margin-bottom: 10px;
}

.summary__items .cart-item img {
    width: 56px;
    height: 56px;
}

.summary__items .cart-item .cart-item__details {
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: space-between;
}

.summary__items .cart-item .cart-item__details .details h4 {
    font-size: 15px;
    font-weight: 300;
}

.summary__items .cart-item .cart-item__details .details p {
    font-size: 13px;
    font-weight: 200;
}

.summary__items .cart-item .cart-item__details .price p {
    font-weight: 100;
    font-size: 19px;
}

.summary__discount {
    padding: 20px 0;
}

.summary__discount div {
    display: flex;
    column-gap: 15px;
    width: 100%;
}

.summary__discount p {
    margin-bottom: 6px;
}

.summary__discount button {
    width: 25%;
    height: 56px;
    border: none;
    background: var(--bg-dark);
    color: #fff;
    border-radius: 5px;
}

.summary__discount input[type="text"] {
    margin-bottom: 0px;
}

.summary__details {
    margin: 15px 0;
}

.summary__details .detail {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: 300;
    font-size: 18px;
    margin-bottom: 10px;
}



.summary__details .detail .shipping-listing {
    display: flex;
    font-size: 13px;
    column-gap: 10px;
    flex-direction: column;
    align-items: self-start;
    justify-content: center;
}

.summary__details .detail .shipping-listing .shipping-listing__item {
    display: flex;
    align-items: center;
    justify-content: space-around;
    column-gap: 5px;
}

.summary__details .detail h4 {
    font-weight: 600;
    font-size: 15px;
}

.summary__details .total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 17px;
    padding-top: 15px;
    font-weight: 700;
    border-top: 2px solid #163c51;
    margin-top: 20px;
}

.checkout__pay {
    width: 100%;
    height: 50px;
    background: var(--bg-light);
    border-radius: 5px;
    border: none;
    font-size: 18px;
    color: #fff;
    cursor: pointer;
}

.checkout__pay:disabled {
    background-color: #0071aea6;
}

.payment-method h3 {
    padding: 10px 15px;
    border: 1px solid #0171ae;
    border-radius: 2px;
    background: #1182c07a;
}

.payment-method .payment-fields {
    margin-top: 10px
}

.payment-section h2 {
    font-size: 20px;
    margin-bottom: 10px;
}

.payment-section p {
    font-size: 14px;
    color: #666;
    margin-bottom: 20px;
}

.payment-option {
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 15px;
    margin-bottom: 10px;
    display: flex;
    justify-content: start;
    align-items: center;
    cursor: pointer;
}

.payment-option__details {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.payment-option.active {
    border-color: #0070f3;
    background-color: #f0f8ff;
}

.payment-option input {
    margin-right: 10px;
}

.payment-option svg {
    width: 90px;
}

.credit-card-form {
    /* display: flex; */
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
}

.credit-card-form input {
    flex: 1;
    width: auto !important;
    margin-bottom: 0px !important;
}

.credit-card-form input:focus {
    border-color: #0070f3;
    outline: none;
}

.billing-checkbox {
    display: flex;
    align-items: center;
    margin: 15px 0;
}

.billing-checkbox input {
    margin-right: 8px;
}

.payment-logo {
    display: flex;
    align-items: center;
    gap: 5px;
}

.payment-logo img {
    height: 24px;
}

#main-carousel img {
    border-radius: 5px;
}

#thumbnail-carousel .splide__list {
    justify-content: center;
}

.checkout-page__footer {
    height: 140px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.checkout-page__footer img {
    width: 200px;
    margin-bottom: 10px;
}

.checkout-page__footer p {
    font-size: 14px;
    font-weight: 100;
}

/**
 * Breadcrumbs
 **/
.breadcrumb {
    list-style: none;
    display: flex;
    padding: 10px;
    border-radius: 5px;
    width: 100%;
}

.breadcrumb li {
    display: flex;
    align-items: center;
    font-size: 14px;
}

.breadcrumb li a {
    text-decoration: none;
    color: #0000007d;
    padding: 5px 10px;
    font-size: 14px;
    text-transform: capitalize;
}

.breadcrumb li a:hover {
    text-decoration: underline;
}

.breadcrumb li:not(:last-child)::after {
    content: ">";
    padding: 0 10px;
    color: #0000007d;
}

/**
 * Custom Select
 **/
.custom-select {
    position: relative;
    display: inline-block;
    width: 100%;
}

.select-button {
    font-size: 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 0.675em 1em;
    border: 1px solid #caced1;
    border-radius: 0.25rem;
    background-color: white;
    cursor: pointer;
}

.arrow {
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 6px solid #000;
    transition: transform ease-in-out 0.3s;
}

.select-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    width: 94%;
    border: 1px solid #caced1;
    border-radius: 0.25rem;
    background-color: white;
    list-style: none;
    padding: 10px;
    margin: 5px 0 0;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
    max-height: 200px;
    overflow-y: auto;
    z-index: 1111;
}

.select-dropdown::-webkit-scrollbar {
    width: 7px;
}

.select-dropdown::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 25px;
}

.select-dropdown::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 25px;
}

.select-dropdown li {
    padding: 10px;
    cursor: pointer;
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

/* Highlight the selected option */
.select-dropdown li.selected {
    background-color: #f2f2f2;
    border-radius: 4px;
    font-weight: bold;
}

.select-dropdown li:hover,
.select-dropdown li:focus {
    background-color: #f2f2f2;
    border-radius: 4px;
}

.select-dropdown.hidden {
    display: none;
}

.select-button[aria-expanded="true"] .arrow {
    transform: rotate(180deg);
}

/**
 * Info Page
 **/
.info-page {
    padding: 80px 50px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.info-page h1 {
    font-weight: 100;
    font-size: 70px;
    margin-bottom: 10px;
}

.info-page p {
    font-size: 15px;
    font-weight: 100;
    margin-bottom: 10px;
}

.info-page .links {
    display: flex;
    align-items: center;
    justify-content: space-between;
    column-gap: 10px;
}

.info-page .links a {
    border-radius: 5px;
    text-decoration: none;
    font-size: 17px;
    background: var(--bg-offwhite);
    padding: 10px 40px;
    color: var(--text-dark);
    font-weight: 100;
}

.checkout__success .message {
    text-align: center;
}

.checkout__success .message h2 {
    font-size: 40px;
    margin-bottom: 20px;
}

.checkout__success .message p {
    font-size: 20px;
    margin-bottom: 30px;
    width: 900px;
}

/**
 * Shipping Details
 **/
.shipping-details .input-group {
    margin-bottom: 10px;
}

/**
 * Page
 **/
.page .main-fold {
    position: relative;
    height: 70vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #eee;
}

.page .main-fold--column {
    flex-direction: column;
}

.page .main-fold .bg-split {
    background: url(/images/header.jpg);
    background-size: cover  !important;
    background-position: center !important;
    background-repeat: no-repeat;
    height: 50%;
    width: 100%;
}

.page .main-fold .bg-cover {
    z-index: 1;
    background: #00000069;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    backdrop-filter: blur(3px);
}

.page .main-fold .text-top {
    z-index: 1;
    border-radius: 5px;
    position: absolute;
    left: 0;
    right: 0;
    top: 8%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.page .main-fold .text-top h1 {
    font-size: 54px;
    color: var(--text-blue);
    font-weight: 400;
    text-align: center;
}

.page .main-fold .text-top p {
    font-size: 28px;
    color: var(--text-blue);
    font-weight: 100;
}

.page .main-fold .header-content-box-white {
    z-index: 1;
    border-radius: 15px;
    position: absolute;
    top: 30%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background: #fcfbfbcc;
    width: 30%;
    height: 25%;
    padding: 20px;
}

.page .main-fold .header-content-box-white--right {
    left: unset;
    right: 15%;
}

.page .main-fold .header-content-box-white--left {
    left: 15%;
    right: unset;
}

.page .main-fold .header-content-box-white--left h1 {
    font-size: 48px !important;
}

.page .main-fold .header-content-box-white--left p {
    font-size: 24px !important;
}

.page .main-fold .header-content-box-white h1 {
    font-size: 42px;
    color: var(--text-blue);
    font-weight: 400;
    text-align: center;
}

.page .main-fold .header-content-box-white p {
    font-size: 25px;
    color: var(--text-blue);
    text-align: center;
    font-weight: 100;
}

.page .main-fold .header-content-box-white ul li {
    font-size: 30px;
    color: var(--text-blue);
    font-weight: 100;
}

.page .main-fold .box-text-center {
    z-index: 1;
    position: absolute;
    left: 20%;
    top: 35%;
    right: 20%;
    bottom: 40%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background: #1784beb8;
    height: 135px;
}

.page .main-fold .box-text-center h1 {
    font-size: 100px;
    color: var(--text-light);
    font-weight: 400;
    text-align: center;
}

.page .main-fold .box-text-left {
    z-index: 1;
    border-radius: 5px;
    position: absolute;
    left: 0;
    top: 35%;
    bottom: 40%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background: #fcfbfbb5;
    padding: 20px 80px;
}

.page .main-fold .box-text-left--blue {
    background: #2787b8;
}

.page .main-fold .box-text-left--blue h1 {
    color: var(--text-light) !important;
}

.page .main-fold .box-text-left h1 {
    font-size: 48px;
    color: var(--text-blue);
    font-weight: 400;
    text-align: center;
}

.page .main-fold .header-text-left {
    z-index: 1;
    border-radius: 5px;
    position: absolute;
    left: 0%;
    right: 45%;
    top: 0;
    bottom: 0;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.page .main-fold .header-text-left h1 {
    font-size: 48px;
    color: var(--text-blue);
    font-weight: 500;
    text-align: right;
}

.page .main-fold .header-text-left p {
    font-size: 24px;
    color: var(--text-blue);
    text-align: right;
}

.page .main-fold .header-content-box {
    z-index: 1;
    border-radius: 15px;
    position: absolute;
    left: 15%;
    top: 30%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background: #355567d1;
    width: 40%;
    height: 40%;
}

.page .main-fold .header-content-box h1 {
    font-size: 42px;
    color: var(--text-light);
    font-weight: 600;
    text-align: center;
}

.page .main-fold .header-content-box p {
    font-size: 36px;
    color: var(--text-light);
}

.page .main-fold .header-content-full-box {
    z-index: 1;
    border-radius: 5px;
    position: absolute;
    left: 0;
    right: 0;
    top: 35%;
    bottom: 35%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background: #dcdee0c9;
}

.page .main-fold .header-content-full-box h1 {
    font-size: 42px;
    color: var(--text-blue);
    font-weight: 500;
    text-align: center;
}

.page .main-fold .header-content-full-box p {
    font-size: 18px;
    color: var(--text-blue);
    font-weight: 100;
}

.page .main-fold .split-box {
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background: #2787b8;
    height: 300px;
    width: 100%;
}

.page .main-fold .split-box h1 {
    font-size: 60px;
    color: var(--text-light);
    font-weight: 400;
    text-align: center;
}

.page .main-fold .split-box p {
    font-size: 30px;
    color: var(--text-light);
    font-weight: 100;
}

.page .main-fold .content {
    z-index: 1;
    border-radius: 5px;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.page .main-fold .content h1 {
    font-size: 70px;
    color: var(--text-light);
    font-weight: 600;
    width: 60%;
    text-align: center;
}

.page .main-fold .content p {
    font-size: 30px;
    color: var(--text-light);
}


.page .main-fold .bg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url(/images/header.jpg);
    background-size: 100% 100% !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

.page .page-fold {
    padding: 80px 17vw;
    display: flex;
    flex-direction: column;
    color: var(--text-blue);
}

.page .page-fold a {
    text-decoration: none;
    font-size: 20px;
    color: var(--text-light-blue);
}

.page .page-fold--split {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    column-gap: 50px;
    color: var(--text-blue);
}

.page .page-fold--split .col {
    flex: 1 1 0;
}

.page .page-fold--split .col img {
    width: 600px;
}

.page .page-fold--light {
    background: var(--bg-gray);
    color: var(--text-blue);
}

.page .page-fold p {
    font-size: 18px;
    font-weight: 100;
    margin-bottom: 20px;
    line-height: 35px;
    color: var(--text-blue);
}

.page .page-fold h1 {
    font-size: 30px;
    margin-bottom: 5px;
    font-weight: 400;
}

.page .page-fold ul,
.page .page-fold ol {
    padding: 20px 80px;
}

.page .page-fold .fold-image {
    width: 600px;
}

.page .page-fold ol li,
.page .page-fold ul li {
    font-size: 18px;
    font-weight: 100;
    margin-bottom: 15px;
}

.page .page-fold .help {
    text-align: center;
    margin: 0;
    font-size: 30px;
    font-weight: 400;
}

.page .page-fold .help a {
    text-decoration: none;
    font-size: 30px;
    color: var(--text-light-blue);
}

.page .page-fold .plans {
    display: flex;
    justify-content: space-around;
    flex-direction: column;
}

.page .page-fold .plans .call-plan,
.page .page-fold .plans .email-plan {
    color: var(--text-dark);
    background: var(--bg-offwhite);
    padding: 25px 70px;
    margin-bottom: 10px;
    border-radius: 10px;
    width: 500px;
    display: flex;
    align-items: center;
    column-gap: 20px;
    padding: 25px 20px;
}

.page .page-fold .plans .call-plan span,
.page .page-fold .plans .email-plan span {
    font-size: 50px;
    padding: 20px;
}

.page .page-fold .plans .call-plan .contacts-list p:nth-child(1) {
    margin: 0;
    font-weight: 400;
    font-size: 24px;
}

.page .page-fold .plans .call-plan .contacts-list p,
.page .page-fold .plans .email-plan .emails-list p {
    margin: 0;
}

.page .page-fold .plans .email-plan .emails-list p:nth-child(1) {
    margin: 0;
    font-weight: 400;
    font-size: 25px;
}

.page .page-fold .plans div h1 {
    font-size: 27px;
    margin-bottom: 0px;
}

.page .page-fold .plans div ul {
    padding: 12px 0px;
    margin-left: 40px;
}

.page .page-fold .contacts {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    row-gap: 60px;
}

.page .page-fold .contacts .col {
    text-align: center;
}

.page .page-fold .contacts .col h2 {
    font-size: 24px;
    font-weight: 400;
}

.page .page-fold .contacts .col p {
    margin-bottom: 0px;
    font-size: 18px;
}

.page .page-fold .contacts .col p:nth-child(3) {
    color: var(--text-light-blue);
    font-size: 20px;
}

.contact-hours p {
    font-weight: 400 !important;
    padding: 0;
    margin: 0 !important;
}

.purchase-plans {
    display: flex;
    column-gap: 20px;
}

.purchase-plans div {
    color: var(--text-dark);
    background: var(--bg-offwhite);
    border-radius: 10px;
    width: 500px;
    display: flex;
    column-gap: 20px;
    padding: 25px 40px;
    flex-direction: column;
}

.purchase-plans div h1 {
    font-size: 24px !important;
}

.financing-plans {
    display: flex;
    column-gap: 20px;
}

.financing-plans div {
    color: var(--text-dark);
    background: var(--bg-offwhite);
    border-radius: 10px;
    width: 500px;
    display: flex;
    column-gap: 20px;
    padding: 25px 40px;
    flex-direction: column;
}

.financing-plans div ul li {
    font-size: 20px !important;
    margin-bottom: 5px !important;
}

.financing-plans div h1 {
    font-size: 24px !important;
}

.price-perks {
    display: flex;
    justify-content: space-between;
    margin-top: 40px;
    align-items: center;
}

.price-perks div span {
    font-size: 60px;
    display: block;
    margin-bottom: 10px;
}

.price-perks div p {
    font-size: 24px !important;
}

/**
 * Blog
 **/
.blog {
    padding: 40px 200px;
    display: flex;
    flex-direction: column;
    row-gap: 15px;
}

.blog-post {
    display: flex;
    column-gap: 30px;
    align-items: center;
    justify-content: center;
}

.blog-post .blog-post__info {
    display: flex;
    justify-content: space-between;
    margin-top: 10px;
}

.blog-post .blog-post__info p {
    font-size: 15px;
    font-weight: 100;
}

.blog-post .blog-post__info a {
    text-decoration: none;
}

.blog-post .blog-post__image img {
    width: 300px;
    height: 200px;
}

.blog-post .blog-post__content {
    width: 700px;
}

.blog-post .blog-post__content>a:first-of-type {
    font-size: 30px;
    text-decoration: none;
    color: #000;
    font-weight: 700;
}

.blog article h1 {
    font-size: 30px;
}

.blog article {
    font-size: 20px;
    font-weight: 100;
}

.blog article p,
.blog article ul {
    margin-bottom: 10px;
}

.blog h1,
.blog h2 {
    background-color: rgb(255, 255, 255);
    color: rgb(22, 24, 33);
    padding: 12px 0px;
    font-weight: 400;
}

.blog h3,
.blog h4,
.blog h5,
.blog h6 {
    font-weight: 300;
    margin-bottom: 10px;
}

.blog ol, .blog ul {
    margin-left: 50px;
}

.blog ol li, .blog ul li {
    margin-bottom: 5px;
}

.blog table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.5em 0;
  font-size: 1rem;
  line-height: 1.6;
  background-color: #fff;
  color: #333;
}

.blog th,
.blog td {
  padding: 0.75em 1em;
  border: 1px solid #ddd;
  text-align: left;
  vertical-align: top;
}

.blog thead {
  background-color: #f5f5f5;
}

.blog tbody tr:nth-child(even) {
  background-color: #f9f9f9;
}

.blog table caption {
  caption-side: bottom;
  font-size: 0.9em;
  color: #777;
  margin-top: 0.5em;
}


/**
 * Locations ( All )
 **/
#location-search {
    display: flex;
    width: 100%;
}

#location-search input[type='text'] {
    padding: 15px 25px;
    border: 0;
    background: #e4e2e2;
    font-size: 15px;
    width: 100%;
    border-radius: 5px;
}

#location-search button {
    padding: 15px 20px;
    background: var(--bg-dark);
    border: 0;
    color: var(--text-light);
    border-radius: 5px;
    font-size: 15px;
    margin-left: 10px;
}

.locations-list {
    margin-top: 15px;
    height: 500px;
    overflow: hidden;
    overflow-y: scroll;
}

.location-list__item {
    border-bottom: 1px solid #eee;
    padding-bottom: 20px;
    margin-bottom: 30px;
}

.location-list__item .header {
    display: flex;
    align-items: center;
}

.location-list__item .header h3 {
    font-size: 18px;
    color: var(--text-dark);
}

.location-list__item .header p {
    margin: 0;
    margin-left: 20px;
    font-size: 14px;
}

.location-list__item .status {
    margin-top: 5px;
    display: flex;
    align-items: center;
}

.location-list__item .status .text {
    padding: 5px 10px;
    border-radius: 50px;
    color: var(--text-light);
    display: inline-block;
    font-size: 14px;
}

.location-list__item .status .open {
    background: var(--bg-orange);
    color: var(--text-light);
}

.location-list__item .status .closed {
    background: var(--bg-offwhite);
    color: #8a8a8a;
}

.location-list__item .status .time {
    margin-left: 10px;
    font-size: 14px;
    font-weight: 400;
}

.location-list__item .details {
    display: flex;
    flex-direction: column;
    margin-top: 10px;
}

.location-list__item .details .phone {
    font-size: 14px;
    font-weight: 100;
}

.location-list__item .details .address {
    width: 250px;
    margin-top: 5px;
    font-size: 14px;
}

.location-list__item .details .locate {
    text-decoration: none;
    color: var(--text-dark);
    font-size: 15px;
    margin-top: 10px;
    cursor: pointer;
}

.store-page h1 {
    font-size: 24px !important;
}

.store__details {
    display: flex;
    flex-direction: column;
}

.store__details a {
    font-size: 24px !important;
}

.gmap-wrapper {
    position: relative;
    width: 55%;
}

/**
 * Helpers
 **/
.d-none {
    display: none !important;
}

.text-center {
    text-align: center;
}

.invalid-feedback {
    color: #df1f30;
    font-size: 13px;
}

.error-message {
    padding: 15px 20px;
    background: #f8d7da;
    border-radius: 5px;
    margin-bottom: 10px;
    color: #721c24;
    text-align: center;
}

.fw-bold {
    font-weight: 600 !important;
}

.d-flex {
    display: flex;
}

.align-items-center {
    align-items: center;
}

.justify-space-between {
    justify-content: space-between;
}

.justify-space-around {
    justify-content: space-around;
}

.flex-column {
    flex-direction: column;
}

.col-gap-50 {
    column-gap: 50px;
}

.mb-20 {
    margin-bottom: 20px !important;;
}

/**
 * Icons
 **/
.icon-lowest-price {
  -webkit-mask: url(/images/lowest-price.svg) no-repeat center;
  mask: url(/images/lowest-price.svg) no-repeat center;
}