/* ===========================
   Global Base Styles
=========================== */

:root {
    --text-color-main : #12100B;
    --text-color-white: #fff;
    --bg-main         : #FBBA00;
    --bg-dark         : #12100B;
}

* {
    box-sizing: border-box;
    margin    : 0;
    padding   : 0;
}

html,
body {
    font-family     : "Gentium Book Plus", serif;
    background-color: #F8F3F0;
    color           : var(--text-color-main);
    font-size       : 16px;
    line-height     : 1.5;
    overflow-x      : hidden;
}

/* ===========================
   Typography Styles
=========================== */
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Gentium Book Plus", serif;
    color      : var(--text-color-main);
    font-weight: 700;
}

h1 {
    font-size  : 60px;
    font-weight: 700;
    line-height: 73px;
}

h2 {
    font-size  : 40px;
    font-weight: 700;
    line-height: 100%;
}

h2.font-50 {
    font-size  : 50px;
    line-height: 68px;
}

h3 {
    font-size  : 34px;
    font-weight: 700;
    line-height: 100%;
}

p {
    font-family        : "Karla", sans-serif;
    font-optical-sizing: auto;
    font-size          : 18px;
    line-height        : 28px;
    color              : var(--text-color-main);
}

.btn:active,
.btn:focus {
    border    : none;
    box-shadow: none;
}

.form-group label {
    font-weight  : 500;
    font-size    : 16px;
    font-family  : "Karla", sans-serif;
    margin-bottom: 5px;
}

.form-control,
.form-select {
    padding         : 12px 18px;
    background-color: #fff;
    border          : 1px solid #12100B33;
    font-weight     : 400;
    font-size       : 16px;
    border-radius   : 0;
    font-family     : "Karla", sans-serif;
    margin-bottom   : 30px;
}

.form-control:focus,
.form-select:focus,
.form-control:active,
.form-select:active {
    box-shadow  : none;
    border-color: var(--bg-main);
}

.bootstrap-select {
    display      : block !important;
    width        : 100% !important;
    margin-bottom: 30px !important;
}

.bootstrap-select>.dropdown-toggle {
    padding         : 10px 16px;
    background-color: #fff;
    border          : 1px solid #12100B33;
    font-weight     : 400;
    font-size       : 16px;
    border-radius   : 0;
    font-family     : "Karla", sans-serif;
    color           : var(--text-color-main) !important;
}

.bootstrap-select>.dropdown-toggle:focus,
.bootstrap-select>.dropdown-toggle:active {
    outline         : 0px !important;
    background-color: #ffff;
}

.bootstrap-select>.dropdown-menu {
    padding                   : 0;
    border-radius             : 0;
    transform                 : scale(0.95) !important;
    opacity                   : 0;
    transition                : all 150ms ease-in-out;
    display                   : block;
    visibility                : hidden;
    top                       : 101% !important;
    border-bottom-left-radius : 12px;
    border-bottom-right-radius: 12px;
    max-height                : 250px !important;
    min-height                : auto !important;
}

.bootstrap-select>.dropdown-menu.show {
    transform : scale(1) !important;
    opacity   : 1;
    visibility: visible;
}

.bootstrap-select>.dropdown-menu.show .inner {
    min-height: auto !important;
    max-height: 250px !important;
}

.bootstrap-select .dropdown-menu.inner {
    max-height: 250px;
    overflow-y: auto;
}

.bootstrap-select>.dropdown-menu ul li a {
    font-weight: 400;
    font-size  : 16px;
    font-family: "Karla", sans-serif;
    padding    : 10px 20px;
}

.bootstrap-select>.dropdown-menu ul li a:hover {
    background-color: var(--bg-dark);
    color           : var(--text-color-white);
}

.bootstrap-select>.dropdown-menu ul li a.active {
    background-color: var(--bg-main);
    color           : var(--text-color-main)
}

.bootstrap-select>.dropdown-menu .form-control {
    margin-bottom: 0 !important;
}

.bootstrap-select .no-results {
    padding: 5px 10px;
    margin : 0;
}

.form-control::placeholder {
    text-transform: capitalize;
}


@media (max-width: 1200px) {
    h1 {
        font-size  : 50px;
        line-height: 60px;
    }

    h2.font-50 {
        font-size  : 35px;
        line-height: 55px;
    }
}

@media (max-width: 992px) {
    h2 {
        font-size: 30px;
    }

    p {
        font-size  : 16px;
        line-height: 24px;
    }

    h2.font-50 {
        font-size  : 30px;
        line-height: 50px;
    }
}

@media (max-width: 767px) {
    h1 {
        font-size  : 40px;
        line-height: 40px;
    }

    h2 {
        font-size: 25px;
    }

    h2.font-50 {
        font-size  : 24px;
        line-height: 35px;
    }

    h3 {
        font-size: 24px;
    }
}

/* ===========================
   Utility Style
=========================== */

.pt-50 {
    padding-top: 50px !important;
}

.pt-100 {
    padding-top: 100px !important;
}

.pb-50 {
    padding-bottom: 50px !important;
}

.pb-100 {
    padding-bottom: 100px !important;
}

.py-50 {
    padding-top   : 50px !important;
    padding-bottom: 50px !important;
}

.pb-65 {
    padding-bottom: 65px !important;
}

.py-32 {
    padding-top   : 32px !important;
    padding-bottom: 32px !important;
}

.py-30 {
    padding-top   : 30px !important;
    padding-bottom: 30px !important;
}

.pb-30 {
    padding-bottom: 30px !important;
}

.btn.btn-main {
    background-color: var(--bg-main);
    border-color    : var(--bg-main);
    color           : var(--text-color-main);
    text-transform  : uppercase;
    font-family     : "Karla", sans-serif;
    font-weight     : 600;
    padding         : 6px 6px 6px 20px;
    display         : flex;
    align-items     : center;
    justify-content : center;
    gap             : 16px;
    width           : fit-content;
    position        : relative;
    overflow        : hidden;
    z-index         : 1;
}

.btn.btn-main::after {
    content          : '';
    position         : absolute;
    top              : 0;
    left             : 0;
    width            : 100%;
    height           : 100%;
    background-color : var(--bg-dark);
    transition       : 0.2s ease;
    transform        : translateX(-110%);
    -webkit-transform: translateX(-110%);
    z-index          : -1;
}

.btn.btn-main:hover {
    color: var(--text-color-white)
}

.btn.btn-main:hover::after {
    transform: translateX(0);
}

.btn.btn-main-dark {
    background-color: var(--bg-dark);
    border-color    : var(--bg-dark);
    color           : var(--text-color-white);
    text-transform  : uppercase;
    font-family     : "Karla", sans-serif;
    font-weight     : 600;
    padding         : 6px 6px 6px 20px;
    display         : flex;
    align-items     : center;
    justify-content : center;
    gap             : 16px;
    width           : fit-content;
    position        : relative;
    overflow        : hidden;
    z-index         : 1;
}

.btn.btn-main-dark::after {
    content          : '';
    position         : absolute;
    top              : 0;
    left             : 0;
    width            : 100%;
    height           : 100%;
    background-color : var(--bg-main);
    transition       : 0.2s ease;
    transform        : translateX(-110%);
    -webkit-transform: translateX(-110%);
    z-index          : -1;
}

.btn.btn-main-dark:hover {
    color: var(--text-color-main);
}

.btn.btn-main-dark:hover::after {
    transform: translateX(0);
}

.btn.btn-main span,
.btn.btn-main-dark span {
    width          : 43px;
    height         : 43px;
    border-radius  : 50%;
    display        : flex;
    align-items    : center;
    justify-content: center;
    background     : #F8F3F0;
    color          : var(--text-color-main);
    font-size      : 18px;
    transition     : 0.2s ease;
}

.btn.btn-main span .bi::before,
.btn.btn-main-dark span .bi::before {
    vertical-align: middle;
}

.btn.btn-main:hover span,
.btn.btn-main-dark:hover span {
    transform        : rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}

.btn.btn-main.cartBtn:hover span,
.btn.btn-main-dark.cartBtn:hover span {
    transform: none;
}

.btn-main.btn-inner {
    padding: 18px 20px;
}

.btn-main.full,
.btn-main-dark.full {
    width        : 100%;
    border-radius: 0;
    padding      : 12px 20px !important;
}

.ecophysis-content section .section-title {
    font-family   : "Karla", sans-serif;
    font-weight   : 700;
    font-size     : 18px;
    line-height   : 100%;
    letter-spacing: 1.4px;
    text-transform: uppercase;
    margin-bottom : 30px;
}

.ecophysis-content section h2 {
    margin-bottom: 30px;
}

.ecophysis-content section .section-pra {
    margin-bottom: 40px;
    font-weight  : 500;
}

.ecophysis-content.inner-content {
    background-color: #fff;
}

.btn:active,
.btn:focus,
button:active,
button:focus,
.navbar-toggler:focus {
    outline   : none;
    box-shadow: none;
}

@media (max-width: 992px) {
    .pt-100 {
        padding-top: 60px !important;
    }

    .pb-50 {
        padding-bottom: 30px !important;
    }

    .py-50 {
        padding-top   : 30px !important;
        padding-bottom: 30px !important;
    }

    .ecophysis-content section h2 {
        margin-bottom: 25px;
    }

    .ecophysis-content section .section-pra {
        margin-bottom: 30px;
    }

    .btn.btn-main-dark,
    .btn.btn-main {
        padding  : 4px 4px 4px 15px;
        gap      : 12px;
        font-size: 14px;
    }

    .btn.btn-main-dark span,
    .btn.btn-main span {
        width    : 25px;
        height   : 25px;
        font-size: 14px;
    }

    .btn-main.full {
        width        : 100%;
        border-radius: 0;
        padding      : 10px 16px;
    }

    .pb-65 {
        padding-bottom: 35px !important;
    }
}

/* ===========================
   Header Top Style
=========================== */

.header {
    position: fixed;
    top     : 0;
    left    : 0;
    width   : 100%;
    z-index : 9999;
}

.header-top {
    background-color: var(--bg-dark);
    padding         : 10px 0px;
    font-family     : 'karla', sans-serif;
    font-size       : 14px;
    font-weight     : 700;
    color           : var(--text-color-white);
    line-height     : 100%;
}

.header-top .bi {
    color: var(--bg-main);
}

.header-top .btn.btn-member {
    font-size     : 14px;
    font-weight   : 700;
    color         : var(--text-color-white);
    text-transform: uppercase;
}

.header-top .btn.btn-member:hover {
    opacity: 0.8;
}

.header-buttons .cart-btn {
    width           : 44px;
    height          : 44px;
    display         : flex;
    align-items     : center;
    justify-content : center;
    border-radius   : 50%;
    background-color: var(--text-color-white);
    box-shadow      : 0px 2px 7px 0px #00000029;
    position        : relative;
}

.header-buttons .cart-btn span.cart-badge {
    position        : absolute;
    top             : -8px;
    right           : -8px;
    width           : 26px;
    height          : 26px;
    font-size       : 10px;
    display         : flex;
    align-items     : center;
    justify-content : center;
    border-radius   : 50%;
    background-color: #D42419;
    color           : var(--text-color-white);
    font-weight     : 700;
    font-size       : 13px;
    letter-spacing  : 0;
    text-align      : center;
    font-family     : 'karla', sans-serif;
}

.header-buttons .cart-btn:hover {
    background-color: var(--bg-dark);
}

.header-buttons .cart-btn:hover svg path {
    fill: var(--text-color-white) !important;
}

.header-buttons .contact-btn-mob {
    width           : 36px;
    height          : 36px;
    display         : flex;
    align-items     : center;
    justify-content : center;
    border-radius   : 50%;
    background-color: var(--text-color-white);
    box-shadow      : 0px 2px 7px 0px #00000029;
    position        : relative;
    color           : var(--text-color-main);
    font-size       : 18px;
}

.header-buttons .contact-btn-mob i::before {
    vertical-align: -3px;
}

.header-buttons .contact-btn-mob:hover {
    background-color: var(--bg-dark);
    color           : var(--text-color-white);
}

.header-top .language-select span.language-icon {
    color    : var(--bg-main);
    font-size: 18px;
}

.header-top .language-select .bootstrap-select {
    margin-bottom: 0 !important;
}

.header-top .language-select .dropdown-toggle {
    background-color: transparent;
    border          : none;
    padding         : 5px 10px;
    font-family     : 'karla', sans-serif;
    font-size       : 14px;
    font-weight     : 700;
    color           : var(--text-color-white) !important;
    text-transform  : uppercase;
}

.header-top .language-select .bootstrap-select .filter-option {
    margin-right: 10px;
}

@media (max-width: 992px) {
    .header-top {
        padding  : 12px 0px;
        font-size: 12px;
    }

    .header-buttons .cart-btn span.cart-badge {
        top  : -12px;
        right: -12px;
    }

    .main-navbar .navbar {
        padding: 16px 0;
    }
}

/* ===========================
   Navbar Main Top Style
=========================== */

.main-navbar {
    padding-top   : 0;
    padding-bottom: 0;
}

.main-navbar.home-navbar {
    background-color: transparent;
    transition      : background-color 0.3s ease;
}

.main-navbar.inner-navbar,
.header.scroll .main-navbar.home-navbar {
    background-color: var(--bg-main);
}

.main-navbar .navbar .navbar-brand {
    width : 180px;
    height: auto;
}

.main-navbar .navbar .navbar-brand img {
    width  : 100%;
    height : auto;
    display: none;
}

.main-navbar.home-navbar .navbar .navbar-brand img.logo-white {
    display: block;
}

.header.scroll .main-navbar.home-navbar .navbar .navbar-brand img.logo-white {
    display: none;
}

.main-navbar.inner-navbar .navbar .navbar-brand img.logo-dark {
    display: block;
}

.header.scroll .main-navbar.home-navbar .navbar .navbar-brand img.logo-dark {
    display: block;
}

.main-navbar .navbar .navbar-nav .nav-item {
    padding: 12px 0;
}

.main-navbar .navbar .navbar-nav .nav-item .nav-link {
    font-family   : 'karla', sans-serif;
    font-weight   : 700;
    font-size     : 16px;
    line-height   : 100%;
    text-transform: uppercase;
    padding       : 18px 12px;
    margin        : 0px 8px;
    border-radius : 6px;
}

.main-navbar.home-navbar .navbar .navbar-nav .nav-item .nav-link {
    color: var(--text-color-white);
}

.main-navbar.home-navbar .navbar .navbar-nav .nav-item .nav-link:hover,
.main-navbar.home-navbar .navbar .navbar-nav .nav-item.active .nav-link {
    background-color: var(--bg-main);
    color           : var(--text-color-main);
}

.main-navbar.inner-navbar .navbar .navbar-nav .nav-item .nav-link,
.header.scroll .main-navbar.home-navbar .navbar .navbar-nav .nav-item .nav-link {
    color: var(--text-color-main);
}

.main-navbar.inner-navbar .navbar .navbar-nav .nav-item .nav-link:hover,
.main-navbar.inner-navbar .navbar .navbar-nav .nav-item.active .nav-link,
.main-navbar.inner-navbar .navbar .navbar-nav .nav-item.current-page-ancestor .nav-link,
.header.scroll .main-navbar.home-navbar .navbar .navbar-nav .nav-item.active .nav-link,
.header.scroll .main-navbar.home-navbar .navbar .navbar-nav .nav-item .nav-link:hover {
    background-color: var(--bg-dark);
    color           : var(--text-color-white) !important;
}

.main-navbar .navbar .navbar-nav .nav-item .dropdown-menu {
    border-radius   : 10px;
    padding         : 0;
    border          : 0;
    top             : 25px;
    left            : 10px;
    opacity         : 0;
    visibility      : hidden;
    transition      : 0.3s all;
    display         : block;
    box-shadow      : var(--bs-box-shadow);
    overflow        : hidden;
    background-color: var(--bg-dark);
}

.main-navbar .navbar .navbar-nav .nav-item .dropdown-menu li.nav-item {
    padding-top   : 0;
    padding-bottom: 0;
}

.main-navbar .navbar .navbar-nav .nav-item:hover .dropdown-menu {
    opacity   : 1;
    visibility: visible;
    top       : 101%;
}

.main-navbar .navbar .navbar-nav .nav-item .dropdown-menu li a {
    border-radius   : 0;
    width           : 100%;
    margin          : 0;
    color           : var(--text-color-white) !important;
    background-color: var(--bg-dark) !important;
}

.main-navbar .navbar .navbar-nav .nav-item .dropdown-menu li a:hover {
    color           : var(--text-color-white) !important;
    background-color: #3c3c3c !important;
}

.main-navbar .navbar .navbar-nav .nav-item .dropdown-menu li.active a {
    background-color: var(--bg-main) !important;
    color           : var(--text-color-main) !important;
}

.main-navbar .navbar .navbar-toggler {
    display        : flex;
    align-items    : center;
    justify-content: center;
}

.hamburger {
    width        : 30px;
    height       : 3px;
    background   : var(--text-color-main);
    position     : relative;
    transition   : 0.5s;
    border-radius: 50px;
}

.main-navbar.home-navbar .hamburger {
    background: var(--text-color-white);
}

.header.scroll .main-navbar.home-navbar .hamburger {
    background: var(--text-color-main);
}

.hamburger-three:before,
.hamburger-three:after {
    content      : '';
    position     : absolute;
    width        : 22px;
    height       : 3px;
    background   : var(--text-color-main);
    transition   : 0.5s;
    border-radius: 50px;
    right        : 0;
}

.main-navbar.home-navbar .hamburger-three:before,
.main-navbar.home-navbar .hamburger-three:after {
    background: var(--text-color-white);
}

.header.scroll .main-navbar.home-navbar .hamburger-three:before,
.header.scroll .main-navbar.home-navbar .hamburger-three:after {
    background: var(--text-color-main);
}

.hamburger:before {
    top: -6px;
}

.hamburger:after {
    top: 6px;
}

.main-navbar .navbar .navbar-toggler.active .hamburger {
    background: rgba(0, 0, 0, 0) !important;
}

.main-navbar .navbar .navbar-toggler.active .hamburger:before {
    transform        : rotate(135deg);
    -webkit-transform: rotate(135deg);
    top              : 0;
}

.main-navbar .navbar .navbar-toggler.active .hamburger:after {
    transform        : rotate(225deg);
    -webkit-transform: rotate(225deg);
    top              : 0;
}

.main-navbar .navbar .navbar-collapse .time-bar {
    background-color: #F8F3F0;
    padding         : 8px 10px;
    font-size       : 14px;
    line-height     : 18px;
    letter-spacing  : 0;
    font-weight     : 600;
    font-family     : 'karla', sans-serif;
}

@media (max-width: 1200px) {
    .main-navbar .navbar .navbar-brand {
        max-width: 120px;
    }

    .main-navbar .navbar .navbar-nav .nav-item .nav-link {
        padding  : 15px 8px;
        font-size: 14px;
        margin   : 0px 4px;
    }

    .main-navbar .btn.btn-main-dark {
        gap      : 12px;
        font-size: 14px;
    }

    .main-navbar .btn.btn-main-dark span {
        width    : 30px;
        height   : 30px;
        font-size: 15px;
    }

    .header-buttons .cart-btn {
        width : 36px;
        height: 36px;
    }

    .header-buttons .cart-btn img {
        width : 12px;
        height: auto;
    }
}

@media (max-width: 992px) {
    .main-navbar .navbar .navbar-collapse {
        background-color: var(--bg-main);
        position        : relative;
    }

    .main-navbar.home-navbar .navbar .navbar-collapse {
        top: 15px;
    }

    .header.scroll .main-navbar.home-navbar .navbar .navbar-collapse {
        top        : 0;
        padding-top: 15px;
    }

    .main-navbar:not(.home-navbar) .navbar .navbar-collapse {
        padding-top: 15px;
    }

    .main-navbar .navbar .navbar-collapse ul li.nav-item a.nav-link {
        border-radius   : 0;
        margin          : 5px 0px;
        padding         : 15px 20px;
        /* color        : var(--text-color-white) !important; */
        position        : relative;
    }

    .main-navbar .navbar .navbar-collapse ul li.nav-item a.nav-link::after {
        content            : '';
        position           : absolute;
        top                : 50%;
        right              : 20px;
        transform          : translateY(-50%);
        width              : 15px;
        height             : 14px;
        background-image   : url('data:image/svg+xml,%3Csvg%20width%3D%228%22%20height%3D%2214%22%20viewBox%3D%220%200%208%2014%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M0.292893%2013.7071C-0.0976311%2013.3166%20-0.0976311%2012.6834%200.292893%2012.2929L5.58579%207L0.292893%201.7071C-0.0976311%201.31658%20-0.0976311%200.683415%200.292893%200.292892C0.683417%20-0.0976334%201.31658%20-0.0976334%201.70711%200.292892L7.60104%206.18683C8.05014%206.63593%208.05015%207.36407%207.60104%207.81317L1.70711%2013.7071C1.31658%2014.0976%200.683417%2014.0976%200.292893%2013.7071Z%22%20fill%3D%22%2312100B%22%2F%3E%3C%2Fsvg%3E');
        background-position: center;
        background-repeat  : no-repeat;
        background-size    : inherit;
        vertical-align     : middle;
        margin-left        : 8px;
        transition         : 0.2s all;
        border             : 0;
    }

    .main-navbar.home-navbar .navbar .navbar-collapse ul li.nav-item a.nav-link:hover {
        background-color: var(--bg-dark);
        color           : var(--text-color-white);
    }

    .main-navbar .navbar .navbar-collapse ul li.nav-item a.nav-link:hover::after,
    .main-navbar .navbar .navbar-collapse ul li.nav-item.active a.nav-link::after {
        background-image: url('data:image/svg+xml,%3Csvg%20width%3D%228%22%20height%3D%2214%22%20viewBox%3D%220%200%208%2014%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M0.292893%2013.7071C-0.0976311%2013.3166%20-0.0976311%2012.6834%200.292893%2012.2929L5.58579%207L0.292893%201.7071C-0.0976311%201.31658%20-0.0976311%200.683415%200.292893%200.292892C0.683417%20-0.0976334%201.31658%20-0.0976334%201.70711%200.292892L7.60104%206.18683C8.05014%206.63593%208.05015%207.36407%207.60104%207.81317L1.70711%2013.7071C1.31658%2014.0976%200.683417%2014.0976%200.292893%2013.7071Z%22%20fill%3D%22%23ffffff%22%2F%3E%3C%2Fsvg%3E');
    }

    .main-navbar .navbar .navbar-nav .nav-item {
        padding: 0px 0px;
    }

    .main-navbar .navbar .navbar-nav .nav-item .dropdown-menu {
        visibility   : visible;
        opacity      : 1;
        top          : 102%;
        border-radius: 0;
    }

    .main-navbar .navbar .navbar-nav .nav-item .dropdown-menu a.nav-link::after {
        background-image: url('data:image/svg+xml,%3Csvg%20width%3D%228%22%20height%3D%2214%22%20viewBox%3D%220%200%208%2014%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M0.292893%2013.7071C-0.0976311%2013.3166%20-0.0976311%2012.6834%200.292893%2012.2929L5.58579%207L0.292893%201.7071C-0.0976311%201.31658%20-0.0976311%200.683415%200.292893%200.292892C0.683417%20-0.0976334%201.31658%20-0.0976334%201.70711%200.292892L7.60104%206.18683C8.05014%206.63593%208.05015%207.36407%207.60104%207.81317L1.70711%2013.7071C1.31658%2014.0976%200.683417%2014.0976%200.292893%2013.7071Z%22%20fill%3D%22%23ffffff%22%2F%3E%3C%2Fsvg%3E');
    }
}

/* ===========================
   Carousel Style
=========================== */

.carousel-top .carousel-item {
    height             : 100vh;
    min-height         : 400px;
    background-size    : cover;
    background-position: center;
    position           : relative;
}

.carousel-top .carousel-caption {
    top      : 50%;
    transform: translateY(-50%);
    bottom   : auto;
    max-width: 890px;
    margin   : auto;
}

.carousel-top .carousel-caption h6 {
    letter-spacing: 2px;
    text-transform: uppercase;
    color         : var(--bg-main);
    font-family   : "Karla", sans-serif;
    line-height   : 32px;
    margin-bottom : 40px;
}

.carousel-top .carousel-caption h1 {
    color        : var(--text-color-white);
    margin-bottom: 40px;
}

.carousel-top .carousel-caption p {
    font-size    : 22px;
    font-weight  : 500;
    color        : var(--text-color-white);
    margin-bottom: 40px;
}

.carousel-top .btn-learn {
    margin-top   : 20px;
    padding      : 10px 30px;
    border-radius: 30px;
}

.carousel-top .carousel-control-prev,
.carousel-top .carousel-control-next {
    top             : 50%;
    transform       : translateY(-50%);
    background-color: transparent;
    padding         : 0;
    width           : 48px;
    height          : 48px;
    display         : flex;
    align-items     : center;
    justify-content : center;
    border-radius   : 2px;
    border          : 1px solid var(--bg-main);
    color           : var(--bg-main);
}

.carousel-top .carousel-control-prev {
    left: 5%;
}

.carousel-top .carousel-control-next {
    right: 5%;
}

.carousel-top .carousel-control-prev:hover,
.carousel-top .carousel-control-next:hover {
    background-color: var(--bg-main);
    color           : #12100B;
}

.carousel-top .carousel-control-prev .bi::before,
.carousel-top .carousel-control-next .bi::before {
    vertical-align: middle !important;
}

@media (max-width: 992px) {
    .carousel-top .carousel-item {
        height: 80vh;
    }
}

@media (max-width: 767px) {
    .carousel-top .carousel-caption p {
        font-size    : 18px;
        margin-bottom: 30px;
    }

    .carousel-top .carousel-caption h6 {
        margin-bottom: 20px;
    }

    .carousel-top .carousel-control-prev,
    .carousel-top .carousel-control-next {
        width : 32px;
        height: 32px;
    }
}

/* ===========================
   Welcome Section
=========================== */

.welcome {
    position           : relative;
    background-image   : url('../images/backgrounds/beeTop-bg.png'), url('../images/backgrounds/honeyBg-right.png');
    background-repeat  : no-repeat, no-repeat;
    background-position: top left 10%, top 40% right;
    background-size    : 20%, 8%;
}

@media (max-width: 992px) {
    .welcome {
        background-size    : 45%, 30%;
        background-position: top left -20%, top 30% right;
    }
}


/* ===========================
   Activities Style
=========================== */

.activities .ectivities-top h2 {
    width        : 100%;
    max-width    : 640px;
    margin       : auto;
    margin-bottom: 30px;
}

.activities .activity-sec .container {
    position: relative;
    z-index : 1;
}

.activities .activity-sec .img-sec {
    -webkit-mask-image: url('../images/masks/mask-large.png');
    mask-image        : url('../images/masks/mask-large.png');
    mask-repeat       : no-repeat;
    mask-size         : 100%;
    position          : relative;
    z-index           : 1;
}

.activities .activity-sec .img-container {
    position: relative;
    z-index : 1;
}

.activities .activity-sec .img-container::after {
    content          : '';
    position         : absolute;
    top              : 13px;
    width            : 100%;
    height           : 100%;
    background-repeat: no-repeat;
    background-size  : 100%;
    z-index          : -1;
}

.activities .activity-sec.beeKeaper .img-container::after,
.activities .activity-sec.honeyPastry .img-container::after,
.activities .activity-sec.candleMaking .img-container::after,
.activities .activity-sec.honeySoap .img-container::after,
.activities .activity-sec.honeyDoc .img-container::after,
.activities .activity-sec.honeyTour .img-container::after {
    left: 17px;
}

.activities .activity-sec.profession .img-container::after,
.activities .activity-sec.familyDay .img-container::after,
.activities .activity-sec.Burekia .img-container::after,
.activities .activity-sec.bodyBam .img-container::after,
.activities .activity-sec.herbsPickups .img-container::after,
.activities .activity-sec.honeyFood .img-container::after {
    left: -17px;
}

.activities .activity-sec.activity-sec.beeKeaper .img-container::after {
    background-image: url('../images/masks/mask-large.png');
}

.activities .activity-sec.activity-sec.activity-sec.honeyPastry .img-container::after {
    background-image: url('../images/masks/pastry-mask.png');
}

.activities .activity-sec.activity-sec.profession .img-container::after {
    background-image: url('../images/masks/profession-mask.png');
}

.activities .activity-sec.activity-sec.activity-sec.familyDay .img-container::after {
    background-image: url('../images/masks/family-mask.png');
}

.activities .activity-sec .img-sec img {
    transform        : scale(1);
    -webkit-transform: scale(1);
    transition       : 0.2s all;
}

.activities .activity-sec .img-sec:hover img {
    transform        : scale(1.2);
    -webkit-transform: scale(1.2);
}

.activities .activity-sec .container::after {
    content      : '';
    position     : absolute;
    width        : 78%;
    height       : 100%;
    border-radius: 40px;
    top          : 0;
    z-index      : -1;
}

.activities .activity-sec.left .container::after {
    left: 0;
}

.activities .activity-sec.right .container::after {
    right: 0;
}

.activities .activity-sec.beeKeaper .container::after {
    background: #CCEFB1;
}

.activities .activity-sec.profession .container::after {
    background: #D5EFE9;
}

.activities .activity-sec.honeyPastry .container::after {
    background: #FFDDB1;
}

.activities .activity-sec.familyDay .container::after {
    background: #E9E9E9;
}

.activities .activity-sec.Burekia .container::after {
    background: #FFDDB1;
}

.activities .activity-sec.candleMaking .container::after {
    background: #E7D4BB;
}

.activities .activity-sec.bodyBam .container::after {
    background: #E8DFD3;
}

.activities .activity-sec.honeySoap .container::after {
    background: #F9DA82;
}

.activities .activity-sec.herbsPickups .container::after {
    background: #EFCABC;
}

.activities .activity-sec.honeyDoc .container::after {
    background: #F0E7CB;
}

.activities .activity-sec.honeyFood .container::after {
    background: #E8DFD3;
}

.activities .activity-sec.honeyTour .container::after {
    background: #FFDCB9;
}

.activities .ectivities-top .section-pra {
    width    : 100%;
    max-width: 1090px;
    margin   : auto;
}

.activity-card .card {
    width           : 100%;
    border-radius   : 10px;
    padding         : 30px 20px;
    background-color: transparent;
}

.activity-card .card .card-body {
    padding: 100px 10px;
    width  : 100%;
}

.activity-card .card .card-body h2 {
    margin-bottom: 20px;
    line-height  : 54px;
}

.activity-card .card .card-body h2 span {
    font-weight: 400;
    font-style : italic;
}

.activity-card .card .card-body p.content-pra {
    font-style   : italic;
    font-weight  : 400;
    font-size    : 22px;
    line-height  : 28px;
    margin-bottom: 40px;
}

.activity-card .card .card-body .key-point {
    display       : flex;
    flex-direction: column;
    gap           : 12px;
    font-family   : "Karla", sans-serif;
    font-size     : 18px;
    line-height   : 28px;
    margin-bottom : 40px;
    font-weight   : 500;
}

.activity-card .card .card-body .key-point .kp-row {
    display       : flex;
    flex-direction: row;
    align-items   : flex-start;
    gap           : 12px;
}

.activity-card .card .card-body .key-point .kp-row img {
    width : 20px;
    height: auto;
}

.activity-card .card .card-body .family-header {
    display      : flex;
    align-items  : center;
    gap          : 20px;
    margin-bottom: 20px;
    flex-wrap    : wrap;
}

.activity-card .card .card-body .family-header .fh-col {
    display    : flex;
    align-items: center;
    gap        : 10px;
    font-family: "Karla", sans-serif;
    font-size  : 18px;
    line-height: 24px;
    color      : var(--text-color-main);
}

.activity-card .card .card-body .family-header .fh-col .bi {
    font-size: 15px;
}

.activity-card .card .card-body .family-header .fh-col .bi::before {
    vertical-align: middle;
}

.activities.all-activities .activity-sec .img-container::after {
    background-image: url('../images/masks/allActivities-mask.png') !important;
}

.activities .activity-sec.beeKeaper {
    background-image   : url('../images/backgrounds/flower-first.png');
    background-repeat  : no-repeat;
    background-position: top 20px left;
    background-size    : 5%;
}

.activities .activity-sec.activity-sec.profession,
.activities .activity-sec.activity-sec.honeyPastry {
    position: relative;
    z-index : 1;
}

.activities .activity-sec.activity-sec.profession::before {
    content          : url('');
    position         : absolute;
    top              : -15%;
    right            : 0;
    background-image : url('../images/backgrounds/flower-after.png');
    background-repeat: no-repeat;
    width            : 5%;
    height           : 25%;
    background-size  : 100%;
    z-index          : -1;
}

.activities .activity-sec.activity-sec.honeyPastry {
    background-image   : url('../images/backgrounds/bee-round-b.png');
    background-repeat  : no-repeat;
    background-position: top left;
    background-size    : 10%;
}

.activities.all-activities .activity-sec.beeKeaper {
    background-image   : url('../images/backgrounds/flyBee-left.png');
    background-repeat  : no-repeat;
    background-position: bottom left;
    background-size    : 10%;
}

.activities.all-activities .activity-sec.profession::before {
    display: none;
}

.activities.all-activities .activity-sec.profession::after {
    content          : url('');
    position         : absolute;
    bottom           : -15%;
    right            : 0;
    background-image : url('../images/backgrounds/flower-after.png');
    background-repeat: no-repeat;
    width            : 5%;
    height           : 25%;
    background-size  : 100%;
}

.activities.all-activities .activity-sec.honeyPastry {
    background-image: none;
}

.activities.all-activities .activity-sec.Burekia {
    position           : relative;
    background-image   : url('../images/backgrounds/Beefly-right.png');
    background-repeat  : no-repeat;
    background-position: bottom right;
    background-size    : 10%;
}

.activities.all-activities .activity-sec.Burekia::before {
    content            : '';
    position           : absolute;
    left               : 0;
    top                : -50%;
    width              : 10%;
    height             : 100%;
    background-image   : url('../images/backgrounds/polygon-left-bg.png');
    background-repeat  : no-repeat;
    background-position: center;
    background-size    : 100%;
}

.activities.all-activities .activity-sec.candleMaking {
    position           : relative;
    background-image   : url('../images/backgrounds/flower-first.png');
    background-repeat  : no-repeat;
    background-position: bottom left;
    background-size    : 5%;
}

.activities.all-activities .activity-sec.honeySoap {
    position           : relative;
    background-image   : url('../images/backgrounds/flyBee-left.png');
    background-repeat  : no-repeat;
    background-position: bottom left;
    background-size    : 10%;
}

.activities.all-activities .activity-sec.honeySoap::after {
    content            : '';
    position           : absolute;
    right              : 0;
    top                : -50%;
    width              : 10%;
    height             : 100%;
    background-image   : url('../images/backgrounds/polygon-right-bg.png');
    background-repeat  : no-repeat;
    background-position: center;
    background-size    : 100%;
}

.activities.all-activities .activity-sec.honeyDoc {
    position: relative;
}

.activities.all-activities .activity-sec.honeyDoc::before {
    content          : url('');
    position         : absolute;
    top              : -15%;
    right            : 0;
    background-image : url('../images/backgrounds/flower-after.png');
    background-repeat: no-repeat;
    width            : 5%;
    height           : 25%;
    background-size  : 100%;
}

.activities.all-activities .activity-sec.honeyFood {
    position           : relative;
    background-image   : url('../images/backgrounds/Beefly-right.png');
    background-repeat  : no-repeat;
    background-position: bottom right;
    background-size    : 10%;
}

.activities.all-activities .activity-sec.honeyFood::before {
    content            : '';
    position           : absolute;
    left               : 0;
    top                : -50%;
    width              : 10%;
    height             : 100%;
    background-image   : url('../images/backgrounds/polygon-left-bg.png');
    background-repeat  : no-repeat;
    background-position: center;
    background-size    : 100%;
}

.activities.all-activities .activity-sec.honeyTour {
    position           : relative;
    background-image   : url('../images/backgrounds/flower-first.png');
    background-repeat  : no-repeat;
    background-position: bottom 10% left;
    background-size    : 5%;
}

@media (max-width: 1200px) {

    .activity-card .card .card-body {
        padding: 30px 15px;
    }

    .activity-card .card .card-body h2 {
        line-height: 34px;
        font-size  : 30px;
    }

    .activity-card .card .card-body p.content-pra {
        font-size    : 18px;
        line-height  : 24px;
        margin-bottom: 30px;
    }

    .activity-card .card .card-body .key-point {
        font-size    : 16px;
        line-height  : 24px;
        margin-bottom: 30px;
    }
}

@media (max-width: 992px) {

    .activity-card .card {
        padding: 10px 20px;
    }

    .activity-card .card .card-body {
        padding: 10px 10px;
    }

    .activity-card .card .card-body h2 {
        line-height  : 28px;
        font-size    : 24px;
        margin-bottom: 15px;
    }

    .activity-card .card .card-body p.content-pra {
        font-size    : 16px;
        line-height  : 22px;
        margin-bottom: 20px;
    }

    .activity-card .card .card-body .key-point {
        font-size  : 14px;
        line-height: 20px;
    }

    .activity-card .card .card-body .key-point .kp-row img {
        width : 14px;
        height: auto;
    }
}

@media (max-width: 767px) {
    .activities .activity-sec .container::after {
        width            : 90%;
        left             : 50% !important;
        right            : 50% !important;
        transform        : translateX(-50%);
        -webkit-transform: translate(-50%);
        height           : 75%;
        bottom           : 0;
        top              : auto;
    }

    .activities .activity-sec .img-sec {
        mask-size: 100%;
    }

    .activities .activity-sec .img-container::after {
        top   : 9px;
        width : 100%;
        height: 100%;
    }

    .activities .activity-sec.beeKeaper .img-container::after,
    .activities .activity-sec.honeyPastry .img-container::after,
    .activities .activity-sec.candleMaking .img-container::after,
    .activities .activity-sec.honeySoap .img-container::after,
    .activities .activity-sec.honeyDoc .img-container::after,
    .activities .activity-sec.honeyTour .img-container::after {
        left: 9px;
    }

    .activities .activity-sec.profession .img-container::after,
    .activities .activity-sec.familyDay .img-container::after,
    .activities .activity-sec.Burekia .img-container::after,
    .activities .activity-sec.bodyBam .img-container::after,
    .activities .activity-sec.herbsPickups .img-container::after,
    .activities .activity-sec.honeyFood .img-container::after {
        left: -9px;
    }

    .activities .activity-sec.beeKeaper,
    .activities .activity-sec.activity-sec.honeyPastry {
        background-size: 20%;
    }

    .activities .activity-sec.activity-sec.profession::before {
        width : 15%;
        height: 35%;
        top   : 0;
    }
}


/* ===========================
   Expolore Banner
=========================== */

.explore-banner .container {
    border-radius : 20px;
    padding-top   : 32px;
    padding-bottom: 32px;
    position      : relative;
    background    : linear-gradient(272.96deg, rgba(251, 186, 0, 0.2) 1.81%,
            rgba(251, 186, 0, 0.05) 48.75%,
            rgba(251, 186, 0, 0.05) 54.85%, rgba(251, 186, 0, 0.2) 98.09%);

}

.explore-banner .container::before {
    content            : '';
    position           : absolute;
    top                : 0;
    left               : 0;
    width              : 200px;
    height             : 100%;
    background-image   : url('../images/backgrounds/explore-before.png');
    background-repeat  : no-repeat;
    background-position: center;
    background-size    : cover;
}

.explore-banner .container::after {
    content            : '';
    position           : absolute;
    top                : 0;
    right              : 0;
    width              : 200px;
    height             : 100%;
    background-image   : url('../images/backgrounds/explore-after.png');
    background-repeat  : no-repeat;
    background-position: center;
    background-size    : cover;
}

.explore-banner p.section-pra {
    font-style  : italic;
    font-weight : 400;
    font-size   : 22px;
    width       : 100%;
    max-width   : 80%;
    margin-right: auto;
    margin-left : auto;
    text-align  : center;
}

@media (max-width: 1200px) {
    .explore-banner p.section-pra {
        width    : 100%;
        max-width: 60%;
    }
}

@media (max-width: 767px) {
    .explore-banner .container {
        max-width   : 90%;
        margin-left : auto;
        margin-right: autos;
    }

    .explore-banner p.section-pra {
        max-width: 90%;
        font-size: 18px;
    }

    .explore-banner .container::before,
    .explore-banner .container::after {
        display: none;
    }
}

/* ===========================
   Video Banner
=========================== */

.video-banner {
    position: relative;
    z-index : 1;
}

.video-banner::after {
    content          : url('');
    position         : absolute;
    top              : -15%;
    right            : 0;
    background       : url('../images/backgrounds/flower-after.png');
    background-repeat: no-repeat;
    width            : 5%;
    height           : 25%;
    background-size  : 100%;
    z-index          : -1;
}

.video-banner .container {
    position     : relative;
    border-radius: 20px;
}

.video-banner .container .video-btn {
    width            : 100px;
    height           : 100px;
    border-radius    : 50%;
    display          : flex;
    align-items      : center;
    justify-content  : center;
    padding          : 0;
    margin           : 0;
    position         : absolute;
    top              : 50%;
    left             : 50%;
    background       : #FFFFFF4D;
    backdrop-filter  : blur(16px);
    transform        : translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    color            : #fff;
    font-size        : 50px;
    border           : 0;
}

.video-banner .container .video-btn:active,
.video-banner .container .video-btn:focus,
.video-banner .container .video-btn:hover {
    background: #ffffff17;
}

.video-banner .container img.banner-video {
    object-fit: cover;
    height    : 100%;
    width     : 100%;
}

@media (max-width: 767px) {
    .video-banner .container {
        max-width   : 90%;
        margin-left : auto;
        margin-right: auto;
    }

    .video-banner::after {
        width : 15%;
        height: 35%;
    }
}

/* ===========================
   BeeProduct Banner
=========================== */

.beeProducts {
    position: relative;
    z-index : 1;
}

.beeProducts .container {
    border-radius      : 20px;
    padding            : 70px 70px;
    background-image   : url('../images/backgrounds/beeProduct-bg.png');
    background-position: center;
    background-repeat  : no-repeat;
    background-size    : cover;
}

.beeProducts .container p.section-pra {
    font-size  : 20px;
    font-weight: 400;
    line-height: 22px;
}

.beeProducts::before {
    content            : url('');
    position           : absolute;
    top                : -50%;
    left               : 0;
    height             : 100%;
    width              : 7%;
    background-image   : url('../images/backgrounds/bee-round-b.png');
    background-repeat  : no-repeat;
    background-position: left center;
    background-size    : contain;
    z-index            : -1;
}

@media (max-width: 767px) {
    .beeProducts .container {
        max-width   : 90%;
        margin-left : auto;
        margin-right: auto;
        padding     : 30px 20px;
    }

    .beeProducts .container p.section-pra {
        font-size  : 18px;
        line-height: 20px;
    }

    .beeProducts::before {
        width: 20%;
        top  : -30%;
    }
}

/* ===========================
   Product-categories
=========================== */

.product-categories {
    position           : relative;
    background-image   : url('../images/backgrounds/honeyBg-left.png');
    background-position: bottom 10% left;
    background-repeat  : no-repeat;
    background-size    : 5%;
    z-index            : 1;
}

.product-categories::after {
    content            : url('');
    position           : absolute;
    bottom             : -30%;
    right              : 0;
    width              : 10%;
    height             : 100%;
    background-image   : url('../images/backgrounds/cirleBee-single.png');
    background-repeat  : no-repeat;
    background-position: center;
    background-size    : 100%;
    z-index            : -1;
}

.product-categories .categories-nav li a {
    display        : flex;
    flex-direction : column;
    align-items    : center;
    justify-content: center;
    gap            : 18px;
    margin-bottom  : 40px;
    width          : 315px;
    text-align     : center;
}

.product-categories .categories-nav li a .product-img {
    overflow    : hidden;
    position    : relative;
    cursor      : pointer;
    margin      : auto;
    width       : 290px;
    aspect-ratio: 1 / 1;
    transform   : rotate(90deg);
    clip-path   : polygon(45% 1.33975%, 46.5798% .60307%, 48.26352% .15192%, 50% 0%, 51.73648% .15192%, 53.4202% .60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
}

.product-categories .categories-nav li a .product-img img {
    position  : absolute;
    inset     : 0;
    width     : 100%;
    height    : 100%;
    object-fit: cover;
    transform : rotate(-90deg);
    transition: transform 0.5s ease;
}

.product-categories .categories-nav li a:hover .product-img img {
    transform: rotate(-90deg) scale(1.2);
}

.product-categories .categories-nav li a .product-name {
    font-weight: 700;
    font-size  : 24px;
    line-height: 32px;
    text-align : center;
    color      : var(--text-color-main);
    width      : 300px;
}

@media (max-width: 992px) {
    .product-categories .categories-nav li a {
        width        : 265px;
        margin-bottom: 30px;
        gap          : 10px;
    }

    .product-categories .categories-nav li a .product-img {
        width: 220px;
    }

    .product-categories .categories-nav li a .product-name {
        font-size  : 20px;
        line-height: 26px;
        width      : 250px;
    }
}

@media (max-width: 767px) {
    .product-categories {
        background-size: 20%;
    }

    .product-categories::after {
        width: 30%;
    }
}

/* ===========================
   Partner Section
=========================== */

.partner {
    background-color: var(--text-color-white);
    position        : relative;
}

.partner ul.partner-nav {
    margin-bottom: 40px;
    gap          : 10px;
}

.partner ul.partner-nav .partner-link {
    text-decoration: none;
    position       : relative;
    width          : 220px;
    height         : 260px;
    margin         : 10px 0px;
    display        : block;
    overflow       : hidden;
}

.partner ul.partner-nav .partner-link .shape {
    width : 220px;
    height: auto;
}

.partner ul.partner-nav .partner-link .pl-inner {
    position         : absolute;
    width            : 100%;
    height           : 60%;
    left             : 0;
    top              : 50%;
    transform        : translateY(-50%);
    -webkit-transform: translateY(-50%);
    display          : flex;
    align-items      : center;
    justify-content  : center;
    padding          : 0px 15px;
    overflow         : hidden;
}

.partner ul.partner-nav .partner-link .pl-inner .partner-logo {
    width     : auto;
    height    : 105px;
    transition: 0.2s all;
    transform : scale(1);
}

.partner ul.partner-nav .partner-link:hover .pl-inner .partner-logo {
    transform: scale(1.1);
}

.partner p.section-pra {
    width       : 100%;
    max-width   : 1180px;
    margin-left : auto;
    margin-right: auto;
    font-weight : 700;
    font-size   : 28px;
    line-height : 38px;
    font-style  : italic;
}

@media (max-width: 1200px) {
    .partner ul.partner-nav .partner-link {
        width : 180px;
        height: 190px;
    }

    .partner ul.partner-nav .partner-link .shape {
        width : 160px;
        height: auto;
    }

    .partner ul.partner-nav .partner-link .pl-inner {
        height: 60%;
    }

    .partner ul.partner-nav .partner-link .pl-inner .partner-logo {
        height: 75px;
    }

    .partner p.section-pra {
        font-size  : 22px;
        line-height: 28px;
    }
}

@media (max-width: 992px) {
    .partner p.section-pra {
        font-size  : 18px;
        line-height: 24px;
    }
}

/* ===========================
   Comment Carousel Section
=========================== */
.comment-carousel {
    position: relative;
    z-index : 1;
}

.comment-carousel .comment-container {
    position     : relative;
    background   : #fff;
    margin-bottom: 80px;
    border-radius: 20px;
}

.comment-carousel .comment-container .carousel-after {
    position        : absolute;
    top             : -8%;
    left            : 28%;
    width           : 85px;
    height          : 85px;
    border-radius   : 50%;
    display         : flex;
    align-items     : center;
    justify-content : center;
    background-color: #fff;
    box-shadow      : 0px 2.91px 7.27px 0px #0000001A;
}

.comment-carousel .comment-container .carousel-after img {
    width : 30px;
    height: auto;
}

.comment-carousel .comment-container .carousel {
    overflow     : hidden;
    border-radius: 20px;
}

.comment-carousel .comment-container .carousel-img {
    width : 100%;
    height: 100%;
}

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

.comment-carousel .comment-container .carousel-text {
    padding : 65px 40px;
    position: relative;
}

.comment-carousel .comment-container .carousel-text .carousel-pra {
    font-family  : "Karla", sans-serif;
    font-size    : 32px;
    line-height  : 40px;
    margin-bottom: 20px;
    font-style   : italic;
    min-height   : 170px;
}

.comment-carousel .comment-container .carousel-text .customer-name {
    width      : 100%;
    text-align : right;
    font-family: "Karla", sans-serif;
    font-size  : 24px;
    line-height: 30px;
    font-weight: 700;
}

.comment-carousel .carousel-navigation .carousel-nav .carousel-btn {
    margin          : 0;
    padding         : 0;
    display         : flex;
    align-items     : center;
    justify-content : center;
    width           : 48px;
    height          : 48px;
    border-radius   : 50%;
    background-color: #fff;
    border          : 0;
    box-shadow      : 0px 4px 14px 0px #00000014;
    font-size       : 24px;
    color           : var(--text-color-main);
}

.comment-carousel .carousel-navigation .carousel-nav .carousel-btn .bi::before {
    vertical-align: -4px;
}

.comment-carousel .carousel-navigation .carousel-nav .carousel-btn:hover {
    background-color: var(--bg-dark);
    color           : var(--text-color-white);
}

.comment-carousel .carousel-navigation .carousel-nav .progress-wrapper {
    background   : #12100B1A;
    border-radius: 3px;
    overflow     : hidden;
    width        : 150px;
    height       : 10px;
}

.comment-carousel .carousel-navigation .carousel-nav .progress-wrapper .progress-bar {
    height    : 100%;
    width     : 0;
    background: #f5c542;
    transition: width 0.4s ease;
}

@media (max-width: 1200px) {
    .comment-carousel .comment-container .carousel-text {
        padding : 50px 30px;
        position: relative;
    }

    .comment-carousel .comment-container .carousel-text .carousel-pra {
        font-size  : 26px;
        line-height: 32px;
        min-height : 150px;
    }

    .comment-carousel .comment-container .carousel-text .customer-name {
        font-size  : 20px;
        line-height: 24px;
    }

    .comment-carousel .comment-container .carousel-after {
        width : 60px;
        height: 60px;
    }

    .comment-carousel .comment-container .carousel-after img {
        width: 25px;
    }
}

@media (max-width: 992px) {
    .comment-carousel .comment-container {
        margin-bottom: 40px;
    }

    .comment-carousel .comment-container .carousel-text {
        padding: 30px 20px;
    }

    .comment-carousel .comment-container .carousel-text .carousel-pra {
        font-size  : 20px;
        line-height: 26px;
        min-height : 120px;
    }

    .comment-carousel .comment-container .carousel-text .customer-name {
        font-size  : 16px;
        line-height: 20px;
    }

    .comment-carousel .comment-container .carousel-after {
        top : -10%;
        left: 27%;
    }
}

@media (max-width: 767px) {

    .comment-carousel .comment-container .carousel-img {
        height: 35vh;
    }

    .comment-carousel .comment-container .carousel-after {
        display: none;
    }
}

/* ===========================
   Activities Page Style
=========================== */

.activity-banner {
    width              : 100%;
    position           : relative;
    height             : calc(100vh - 150px);
    display            : flex;
    align-items        : center;
    justify-content    : center;
    flex-direction     : row;
    background-image   : url('../images/backgrounds/activity-bg.png');
    background-repeat  : no-repeat;
    background-position: center;
    background-size    : cover;
}

.activity-banner h1 {
    color         : var(--text-color-white);
    text-transform: capitalize;
}

.visitor-information {
    position           : relative;
    background         : url('../images/backgrounds/flower-first.png');
    background-repeat  : no-repeat;
    background-position: top 40% left;
    background-size    : 4%;
}

.visitor-information::after {
    content            : '';
    position           : absolute;
    right              : 0;
    bottom             : -50%;
    width              : 10%;
    height             : 100%;
    background-image   : url('../images/backgrounds/polygon-right-bg.png');
    background-repeat  : no-repeat;
    background-position: center;
    background-size    : 100%;
}

.visitor-information .container {
    width           : 100%;
    border-radius   : 20px;
    box-shadow      : 0px 4px 20px 0px #00000026;
    font-family     : "Karla", sans-serif;
    padding         : 50px 30px;
    background-color: #fff;
}

.visitor-information .container .info-box {
    margin-bottom: 50px;
    position     : relative;
    border-right : 1px solid #12100B33;
}

.visitor-information .container .row .col-md-6:last-child .info-box {
    border-right: none;
}

.visitor-information .container .info-box .info-header {
    display        : flex;
    align-items    : center;
    justify-content: center;
    gap            : 10px;
    font-weight    : 700;
    font-size      : 28px;
    line-height    : 28px;
    margin-bottom  : 30px;
}

.visitor-information .container .info-box .info-text {
    font-weight  : 500;
    font-size    : 18px;
    line-height  : 28px;
    margin-bottom: 10px;
}

@media (max-width: 1200px) {
    .activity-banner {
        height: calc(100vh - 350px);
    }

    .visitor-information .container .info-box .info-header {
        font-size    : 22px;
        line-height  : 24px;
        margin-bottom: 20px;
    }

    .visitor-information .container .info-box .info-text {
        font-size  : 16px;
        line-height: 24px;
    }
}

@media (max-width: 992px) {
    .activity-banner {
        height: calc(100vh - 450px);
    }

    .visitor-information .container .row .col-md-6:nth-child(2) .info-box {
        border-right: none;
    }

    .visitor-information {
        background-size: 20%;
    }
}

@media (max-width: 767px) {
    .activity-banner {
        height : auto;
        padding: 70px 0px;
    }

    .visitor-information .container {
        width       : 90%;
        margin-left : auto;
        margin-right: auto;
    }

    .visitor-information .container .info-box {
        border-right: 0px;
    }
}

/* ===========================
   Book Activity Styles
=========================== */

.book-activity .container {
    background-color: #fff;
    padding         : 40px 40px;
    border-radius   : 10px;
}

.book-activity .container .activity-details .activity-detail-heading {
    padding      : 10px 0px;
    border-bottom: 1px solid #00000033;
    margin-bottom: 30px;
    font-family  : 'karla', sans-serif;
    font-weight  : 700;
    font-size    : 18px;
    line-height  : 36px;
}

.book-activity .container .activity-details .ad-list li {
    font-family        : 'karla', sans-serif;
    font-weight        : 400;
    font-size          : 18px;
    line-height        : 36px;
    margin-bottom      : 13px;
    padding-left       : 30px;
    background-image   : url('../images/svgs/list-style.svg');
    background-repeat  : no-repeat;
    background-position: top 10px left;
}

.book-activity .container .food-details li {
    font-family  : 'karla', sans-serif;
    font-weight  : 500;
    font-size    : 18px;
    line-height  : 26px;
    margin-bottom: 13px;
}

.book-activity .container .book-card {
    background-color: #fff;
    box-shadow      : 0px 4px 20px 0px #00000026;
    border-radius   : 20px;
    width           : 100%;
    display         : flex;
    flex-direction  : column;
    gap             : 30px;
    padding         : 20px;
}

.book-activity .container .book-card .bookCard-header {
    background    : #F8F3F0;
    padding       : 10px 20px;
    width         : 100%;
    border-radius : 10px;
    font-family   : 'karla', sans-serif;
    font-weight   : 700;
    font-size     : 20px;
    line-height   : 36px;
    text-transform: uppercase;
}

.book-activity .container .book-card .bookingInfo-text {
    font-family: 'karla', sans-serif;
    font-weight: 400;
    font-size  : 16px;
    line-height: 25px;
}

.book-activity .container .book-card .btn-main {
    width  : 100%;
    padding: 18px 22px;
}

.book-activity .container .booking-form h3 {
    font-size    : 30px;
    margin-bottom: 25px;
}

.book-activity .container .booking-form .form-group label {
    margin-bottom: 0;
}

.book-activity .container .booking-form .form-group label span {
    color: #FF0000;
}

.book-activity .container .booking-form .form-group .form-control,
.book-activity .container .booking-form .form-group .form-select {
    padding         : 10px 16px;
    background-color: #fff;
    font-weight     : 500;
    font-size       : 16px;
    margin-bottom   : 20px;
}

.book-activity .container .booking-form .form-group .form-control {
    border-radius: 6px;
}

.book-activity .container .booking-form .form-group .activity-date {
    position     : relative;
    width        : 100%;
    border       : 1px solid #12100B33;
    border-radius: 6px;
    padding      : 5px 10px;
}

.book-activity .container .booking-form .form-group .add-person {
    border          : 1px solid #12100B33;
    background-color: #fff;
    border-radius   : 6px;
    padding         : 11px 13px;
    display         : flex;
    align-items     : center;
    justify-content : space-between;
    flex-direction  : row;
    font-family     : 'karla', sans-serif;
}

.book-activity .container .booking-form .form-group .add-person .label-area {
    display       : flex;
    flex-direction: column;
    gap           : 5px;
    font-weight   : 400;
    font-size     : 14px;
    line-height   : 100%;
    letter-spacing: -1px;
    color         : #12100B80;
}

.book-activity .container .booking-form .form-group .add-person .label-area .title {
    font-weight: 500;
    color      : var(--text-color-main);
}

.book-activity .container .booking-form .form-group .add-person .person-count {
    display    : flex;
    align-items: center;
    gap        : 15px;
}

.book-activity .container .booking-form .form-group .add-person .person-count .btn-count {
    width           : 16px;
    height          : 16px;
    border-radius   : 50%;
    display         : flex;
    align-items     : center;
    justify-content : center;
    background-color: #fff;
    border          : 1px solid var(--text-color-main);
    font-size       : 12px;
    font-weight     : 500;
    padding         : 0;
}

.book-activity .container .booking-form .form-group .add-person .person-count .btn-count.disabled {
    opacity: 0.3;
}

.book-activity .container .booking-form .form-group .add-person .person-count .counter-value {
    font-weight: 700;
    font-size  : 20px;
    line-height: 100%;
    color      : var(--text-color-main)
}

.book-activity .container .booking-form .form-group .add-person .price {
    font-weight   : 400;
    font-size     : 16px;
    line-height   : 22px;
    letter-spacing: -1px;
    color         : var(--text-color-main);
}

.book-activity .container .booking-form .form-group .time-btn {
    border          : 1px solid var(--text-color-main);
    color           : var(--text-color-main);
    background-color: transparent;
    font-family     : 'karla', sans-serif;
    font-weight     : 500;
}

.book-activity .container .booking-form .form-group .time-btn:hover,
.book-activity .container .booking-form .form-group .time-btn.active {
    background-color: var(--text-color-main);
    color           : var(--text-color-white);
}

.book-activity .container .short-recipt {
    background-color: #F8F3F0;
    width           : 100%;
    border-radius   : 6px;
    padding         : 23px 25px;
    margin-top      : 24px;
}

.book-activity .container .short-recipt .receipt-sec {
    display       : flex;
    align-items   : center;
    gap           : 16px;
    font-family   : 'karla', sans-serif;
    font-weight   : 400;
    font-size     : 24px;
    line-height   : 22px;
    letter-spacing: -1px;
}

.book-activity .container .short-recipt .receipt-sec .icon img {
    width : 30px;
    height: auto;
}

.book-activity .container .short-recipt .receipt-sec .receipt-value {
    font-weight: 700;
}

.book-activity .container .short-recipt .row .col-md-4 {
    border-right: 1px solid #00000066;
}

.book-activity .container .short-recipt .row .col-md-4:last-child {
    border-right: none;
}

.book-activity .container .short-recipt .row .col-md-4:nth-child(2) .receipt-sec {
    justify-content: center;
}

.book-activity .container .short-recipt .row .col-md-4:last-child .receipt-sec {
    justify-content: flex-end;
}

.Rr-success-modal .modal-content .modal-body {
    gap            : 16px;
    display        : flex;
    align-items    : center;
    justify-content: center;
    text-align     : center;
    padding        : 40px 70px;
    flex-direction : column;
}

.Rr-success-modal .modal-dialog {
    max-width: 600px !important;
}

.Rr-success-modal .modal-content .modal-body .Rs-modal-heading {
    font-family  : 'Karla', sans-serif;
    font-weight  : 600;
    font-size    : 18px;
    line-height  : 32px;
    margin-bottom: 16px;
}

.Rr-success-modal .modal-content .modal-body p.section-pra {
    font-family  : 'Karla', sans-serif;
    font-weight  : 400;
    margin-bottom: 50px;
}

@media (max-width: 1200px) {
    .book-activity .container .short-recipt .receipt-sec {
        font-size  : 18px;
        line-height: 20px;
        gap        : 10px;
    }
}

@media (max-width: 992px) {

    .book-activity .container {
        padding: 20px 15px;
    }

    .book-activity .container .short-recipt {
        padding   : 17px 20px;
        margin-top: 18px;
    }

    .book-activity .container .short-recipt .receipt-sec {
        font-size  : 12px;
        line-height: 18px;
        gap        : 5px;
    }

    .book-activity .container .short-recipt .receipt-sec .icon img {
        width : 20px;
        height: auto;
    }

    .book-activity .container .book-card {
        margin-bottom: 30px;
    }

    .book-activity .container .food-details.pb-30 {
        padding-bottom: 20px !important;
        margin-bottom : 0;
    }
}

@media (max-width: 767px) {
    .book-activity .container .short-recipt .receipt-sec {
        text-align     : left !important;
        justify-content: flex-start !important;
    }

    .book-activity .container .short-recipt .row .col-md-4 {
        border-right: 0;
    }

    .book-activity .container .short-recipt .receipt-sec {
        font-size  : 14px;
        line-height: 22px;
        gap        : 8px;
    }

    .Rr-success-modal .modal-content .modal-body {
        padding: 20px 30px;
    }
}

/* ===========================
   About Us Section
=========================== */

.about-banner {
    padding-top        : 145px;
    padding-bottom     : 124px;
    background-image   : url('../images/backgrounds/aboutBanner.png');
    background-repeat  : no-repeat;
    background-position: center;
    background-size    : cover;
}

.about-banner h1 {
    color         : var(--text-color-white);
    text-transform: capitalize;
}

.comment-area .comment-area-pra {
    font-weight  : 400;
    font-style   : italic;
    font-size    : 36px;
    line-height  : 46px;
    margin-bottom: 30px;
    width        : 100%;
    max-width    : 800px;
}

.comment-area .comment-border {
    width           : 100px;
    margin-right    : auto;
    margin-left     : auto;
    background-color: var(--bg-main);
    height          : 2px;
    margin-bottom   : 30px;
}

.comment-area .author-name {
    font-weight  : 500;
    font-size    : 18px;
    line-height  : 28px;
    font-family  : 'Karla', sans-serif;
    margin-bottom: 30px;
}

.section-img {
    width         : 100%;
    height        : 100%;
    padding-bottom: 20px;
}

@media (max-width: 1200px) {
    .about-banner {
        padding-top   : 100px;
        padding-bottom: 80px;
    }
}

@media (max-width: 992px) {
    .comment-area .comment-area-pra {
        font-size  : 26px;
        line-height: 34px;
    }

    .comment-area .author-name {
        font-size    : 16px;
        line-height  : 24px;
        margin-bottom: 20px;
    }
}

@media (max-width: 767px) {
    .comment-area .comment-area-pra {
        font-size  : 22px;
        line-height: 28px;
    }
}


/* ===========================
   FAQs Styles
=========================== */

.faqs {
    padding-top        : 45px;
    padding-bottom     : 120px;
    background-image   : url('../images/backgrounds/bee-flower.png'), url('../images/backgrounds/bee-flower.png');
    background-repeat  : no-repeat, no-repeat;
    background-position: top 120px left, bottom 150px right;
    background-size    : 20%, 20%;
}

.faqs .accordion {
    position: relative;
}

.faqs .accordion::before {
    content            : '';
    position           : absolute;
    top                : 5%;
    right              : -20%;
    width              : 50px;
    height             : 37px;
    background-image   : url('../images/backgrounds/bee.png');
    background-repeat  : no-repeat;
    background-position: center;
    background-size    : contain;
}

.faqs .accordion .accordion-item {
    margin-bottom: 10px;
    border       : 1px solid #0000001A;
    border-radius: 0;
}

.faqs .accordion .accordion-item h2.accordion-header {
    margin-bottom: 0;
}

.faqs .accordion .accordion-item .accordion-header .accordion-button {
    font-family  : "Karla", sans-serif;
    font-weight  : 500;
    font-size    : 18px;
    line-height  : 100%;
    padding      : 20px 20px;
    padding-right: 55px;
    border-radius: 0;
    border-bottom: none;
    box-shadow   : none;
}

.faqs .accordion .accordion-item .accordion-header .accordion-button::after {
    background-color   : var(--bg-main);
    border-radius      : 50%;
    width              : 30px;
    height             : 30px;
    background-size    : 16px;
    background-repeat  : no-repeat;
    background-position: center;
    position           : absolute;
    top                : 15px;
    right              : 20px;
}

.faqs .accordion .accordion-item .accordion-header .accordion-button:not(.collapsed) {
    background-color: #F8F3F0;
    color           : var(--text-color-main);
}

.faqs .accordion .accordion-item .accordion-body {
    padding         : 20px;
    padding-top     : 0;
    font-family     : "Karla", sans-serif;
    font-weight     : 400;
    font-size       : 16px;
    line-height     : 24px;
    background-color: #F8F3F0;
}

/* ===========================
   Contact Us Styles
=========================== */

.contactUs {
    padding-top   : 50px;
    padding-bottom: 150px;
    position      : relative;
}

.contactUs .contact-location {
    position           : relative;
    background-image   : url('../images/backgrounds/bee-flower.png');
    background-repeat  : no-repeat;
    background-position: bottom right;
    background-size    : 40%;
}

.contactUs .contact-location .contact-heading {
    font-weight   : 700;
    font-size     : 22px;
    line-height   : 32px;
    letter-spacing: -1px;
    color         : #383854;
}

.contactUs .contact-location .contact-pra,
.contactUs .contact-location .contact-pra a {
    font-family  : "Karla", sans-serif;
    font-weight  : 400;
    font-size    : 18px;
    line-height  : 28px;
    width        : 100%;
    max-width    : 220px;
    margin-bottom: 40px;
}

.contactUs .contact-location .contact-pra a {
    color          : var(--text-color-main);
    text-decoration: none;
}

.contactUs .contact-form {
    border-radius   : 6px;
    border          : 1px solid #12100B1A;
    background-color: #F8F3F0;
    padding         : 30px 40px 53px 40px
}

.contactUs .contact-form .form-group label {
    font-weight  : 500;
    font-size    : 16px;
    font-family  : "Karla", sans-serif;
    margin-bottom: 13px;
}

.contactUs .contact-form .form-control {
    padding         : 16px 18px;
    background-color: #fff;
    border          : 1px solid #12100B33;
    font-weight     : 400;
    font-size       : 16px;
    border-radius   : 0;
    font-family     : "Karla", sans-serif;
    margin-bottom   : 30px;
}

.contactUs .contact-form .btn-main {
    padding: 18px 20px;
    float  : right;
}

@media (max-width: 992px) {
    .contactUs .contact-form {
        padding: 20px 30px 40px 30px;
    }

    .contactUs .contact-form .form-control {
        padding      : 10px 14px;
        margin-bottom: 20px;
    }
}

/* ===========================
   Store Styles
=========================== */

.store-banner {
    position              : relative;
    /* padding-top        : 125px;
    padding-bottom        : 120px;
    background-image      : url('../images/backgrounds/shop-banner.webp');
    background-repeat     : no-repeat;
    background-position   : center;
    background-size       : cover; */
}

.store-banner .Sbanner-content {
    width         : 100%;
    max-width     : 560px;
    display       : flex;
    flex-direction: column;
    gap           : 30px;
}

.store-banner h1,
.store-banner p {
    color: var(--text-color-main);
}

.store-banner p {
    font-family: "Karla", sans-serif;
}

.store-conditions {
    background-color: #fff;
    position        : relative;
    padding         : 20px 0px;
}

.store-conditions .service-guarantee {
    display        : flex;
    align-items    : center;
    justify-content: space-between;
    font-family    : "Karla", sans-serif;
}

.store-conditions .service-guarantee .sg-col {
    display    : flex;
    align-items: center;
    gap        : 20px;
    color      : var(--text-color-main);
}

.store-conditions .service-guarantee .sg-col .sg-img img {
    width : 60px;
    height: auto;
}

.store-conditions .service-guarantee .sg-col .title {
    font-weight   : 700;
    font-size     : 20px;
    line-height   : 100%;
    letter-spacing: 0;
    text-transform: uppercase;
}

.store-conditions .service-guarantee .sg-col .descp {
    font-weight: 400;
    font-size  : 14px;
    line-height: 20px;
    max-width  : 200px;
}

.shop-listing {
    position        : relative;
    padding         : 60px 0px;
    background-color: #F8F3F0;
}

.shop-listing.shop-by-type {
    background-image   : url('../images/backgrounds/honeyBg-right.png'), url('../images/backgrounds/bee-round-b.png');
    background-repeat  : no-repeat, no-repeat;
    background-position: bottom right, bottom left;
    background-size    : 15%, 10%;
}

.shop-listing.shop-health-benifits {
    background-image   : url('../images/backgrounds/flyBee-left.png');
    background-repeat  : no-repeat;
    background-position: bottom 40% left;
    background-size    : 10%;
}

.porduct-ceteogiry-listing .col-6 {
    padding-right: 15px;
    padding-left : 15px;
    margin-bottom: 30px;
}

.shop-listing .card.shop-card {
    border        : none;
    border-radius : 10px;
    background    : linear-gradient(99.56deg, #F2D175 0.39%, #FFEEBF 52.14%, #F2D175 105.91%);
    flex-direction: row;
    gap           : 20px;
    align-items   : center;
    font-family   : "Karla", sans-serif;
    padding       : 34px 20px;
    cursor        : pointer;
}

.shop-listing .card.shop-card .product-info {
    width         : 60%;
    display       : flex;
    flex-direction: column;
    gap           : 30px;
}

.shop-listing .card.shop-card .product-info .product-name {
    font-weight   : 500;
    font-size     : 22px;
    line-height   : 28px;
    letter-spacing: -0.2px;
}

.shop-listing .card.shop-card .product-info .shop-btn {
    background-color: #fff;
    color           : var(--text-color-main);
    border-radius   : 10px;
    padding         : 10px 20px;
    font-weight     : 500;
    font-size       : 14px;
    letter-spacing  : -0.2px;
    width           : fit-content;
}

.shop-listing .card.shop-card .product-img {
    width          : 40%;
    text-align     : center;
    display        : flex;
    align-items    : center;
    justify-content: center;
}

.shop-listing .card.shop-card:hover {
    box-shadow: 0px 4px 20px 0px #00000026;
}

.shop-listing .card.shop-card:hover .shop-btn {
    background-color: var(--bg-dark);
    color           : var(--text-color-white);
}

.shopCustomer-carousel {
    position           : relative;
    padding            : 0px 0px 120px 0px;
    background-color   : #F8F3F0;
    background-image   : url('../images/backgrounds/bee-round-right.png');
    background-repeat  : no-repeat;
    background-position: top right;
    background-size    : 10%;
}

.shopCustomer-carousel h1 {
    font-size  : 40px;
    line-height: 73px;
}

.shopCustomer-carousel .overall-ratting-row {
    display        : flex;
    align-items    : center;
    justify-content: center;
    gap            : 30px;
    margin-bottom  : 50px;
}

.shopCustomer-carousel .overall-ratting-row .title {
    font-family   : "karla", sans-serif;
    font-weight   : 400;
    font-size     : 24px;
    line-height   : 30px;
    letter-spacing: 0;
}

.shopCustomer-carousel .overall-ratting-row .title .rating-points {
    font-weight: 700;
    line-height: 30px;
    font-size  : 30px;
}

.shopCustomer-carousel .overall-ratting-row .title .rating-points .total-points {
    font-size: 24px;
}

.shopCustomer-carousel .overall-ratting-row .rating-icons ul.star-icons {
    gap: 2px;
}

.shopCustomer-carousel .overall-ratting-row .rating-icons ul.star-icons li i {
    color    : var(--bg-main);
    font-size: 20px;
}

.shopCustomer-carousel .shop-comment-card {
    border          : none;
    background-color: #fff;
    border-radius   : 20px;
    padding         : 24px 24px;
    height          : 100%;
    display         : flex;
    flex-direction  : column;
    gap             : 16px;
    font-family     : "karla", sans-serif;
    font-weight     : 400;
    font-size       : 18px;
    line-height     : 30px;
    letter-spacing  : 0;
    margin          : 20px 20px;
}

.shopCustomer-carousel .shop-comment-card ul.rating-star {
    gap: 5px;
}

.shopCustomer-carousel .shop-comment-card ul.rating-star li i {
    font-size: 16px;
    color    : var(--bg-main);
}

.shopCustomer-carousel .shop-comment-card .customer-name {
    font-weight: 700;
    font-size  : 16px;
}

.shopCustomer-carousel .swiper-wrapper .swiper-slide {
    perspective: 1000px;
    transform  : perspective(1000px);
    width      : auto !important;
    height     : auto !important;
}

.shopCustomer-carousel .carousel-control-area {
    display        : flex;
    align-items    : center;
    justify-content: center;
    gap            : 15px;
    margin-bottom  : 50px;
}

.shopCustomer-carousel .carousel-control-area .btn.btn-cc {
    padding         : 0;
    border          : 0;
    width           : 48px;
    height          : 48px;
    border-radius   : 50%;
    display         : flex;
    align-items     : center;
    justify-content : center;
    background-color: #fff;
    box-shadow      : 0px 4px 14px 0px #00000014;
    font-size       : 22px;
}

.shopCustomer-carousel .carousel-control-area .btn.btn-cc:hover {
    background-color: var(--bg-main);
}

.shopCustomer-carousel .carousel-control-area .btn.btn-cc.slick-disabled:hover {
    background-color: #fff;
    color           : var(--text-color-main);
}

.shopCustomer-carousel .carousel-control-area .btn.btn-cc.slick-disabled i {
    opacity: 0.2;
}

.shopCustomer-carousel .carousel-control-area .progress-wrapper {
    background   : #12100B1A;
    border-radius: 2px;
    overflow     : hidden;
    width        : 150px;
    height       : 5px;
}

.shopCustomer-carousel .carousel-control-area .progress-wrapper .progress-bar {
    height    : 100%;
    width     : 0;
    background: #f5c542;
    transition: width 0.4s ease;
}

.store-content {
    padding            : 30px 0px 100px 0px;
    background-color   : #F8F3F0 !important;
    font-family        : "Karla", sans-serif;
    background-image   : url('../images/backgrounds/flower-after.png'), url('../images/backgrounds/bee-round-b.png');
    background-repeat  : no-repeat, no-repeat;
    background-position: top 20% right, left bottom 30%;
    background-size    : 5%, 10%;
}

.store-content .filter-categories-sec {
    border-radius: 12px;
    overflow     : hidden;
    border-bottom: 1px solid #12100B1A;
    font-family  : "Karla", sans-serif;
    font-weight  : 400;
    margin-bottom: 30px;
}

.store-content .filter-categories-sec .fcs-header {
    background-color: var(--bg-dark);
    color           : var(--text-color-white);
    font-weight     : 500;
    padding         : 8px 16px;
}

.store-content .filter-categories-sec .accordion-item .accordion-header .accordion-button {
    padding      : 18px 16px;
    font-size    : 14px;
    font-weight  : 500;
    border       : 0;
    border-bottom: 1px solid #12100B1A;
    gap          : 40px;
}

.store-content .filter-categories-sec .accordion-item .accordion-header .accordion-button::after {
    background-image   : url('../images/svgs/plus-ic.svg') !important;
    width              : 16px;
    height             : 16px;
    background-size    : 100%;
    transition         : none;
    transform          : none;
    background-position: center;
}

.store-content .filter-categories-sec .accordion-item .accordion-header .accordion-button:not(.collapsed) {
    background-color: #fff !important;
}

.store-content .filter-categories-sec .accordion-item .accordion-header .accordion-button:not(.collapsed)::after {
    background-image: url('../images/svgs/minus-ic.svg') !important;
}

.store-content .filter-categories-sec .accordion-item .accordion-header .accordion-button:hover,
.store-content .filter-categories-sec .accordion-item .accordion-header .accordion-button:active,
.store-content .filter-categories-sec .accordion-item .accordion-header .accordion-button:focus {
    box-shadow: none;
    outline   : none;
}

.store-content .filter-categories-sec .accordion-item .accordion-body {
    background-color: #fff;
    padding         : 12px 0px;
}

.store-content .filter-categories-sec .accordion-item .accordion-body .form-check {
    padding    : 12px 16px;
    margin     : 0;
    display    : flex;
    align-items: center;
    gap        : 10px;
}

.store-content .filter-categories-sec .accordion-item .accordion-body .form-check .form-check-input {
    float        : none;
    margin       : 0;
    border       : 1px solid #000000;
    border-radius: 2px;
    cursor       : pointer;
}

.store-content .filter-categories-sec .accordion-item .accordion-body .form-check .form-check-input:checked {
    background-color   : #fff;
    background-image   : url('../images/svgs/check-ic.svg');
    background-position: center;
    background-size    : 12px;
}

.store-content .filter-categories-sec .accordion-item .accordion-body .form-check .form-check-input:focus {
    box-shadow: none;
    outline   : none;
}

.store-content .filter-categories-sec .accordion-item .accordion-body .form-check:has(.form-check-input:checked) {
    background-color: #FFEEBF;
}

.store-content .filter-categories-sec .accordion-item .accordion-body .form-check .form-check-label {
    font-size  : 14px;
    line-height: 100%;
}

.store-content .filter-categories-sec .accordion-item .accordion-body .form-check .form-check-label span {
    margin-left: 10px;
}


.porduct-listing .product-listing-header {
    padding         : 16px 16px;
    background-color: var(--bg-main);
    margin-bottom   : 20px;
    border-radius   : 6px;
}

.porduct-listing .product-listing-header .plh-row .p-label {
    font-weight   : 500;
    font-size     : 16px;
    letter-spacing: -1px;
    white-space   : nowrap;
}

.porduct-listing .product-listing-header .plh-row input.form-control {
    width              : 100%;
    border             : 1px solid #12100B33;
    border-radius      : 12px;
    padding            : 8px 40px 8px 12px;
    letter-spacing     : -1px;
    color              : var(--text-color-main);
    margin-bottom      : 0;
    border-radius      : 12px;
    background-image   : url('../images/svgs/search-ic.svg');
    background-repeat  : no-repeat;
    background-position: center right 14px;
}

.porduct-listing .product-listing-header .plh-row input.form-control::placeholder {
    color: #12100B80;
}

.porduct-listing .product-listing-header .plh-row input.form-control:focus,
.porduct-listing .product-listing-header .plh-row input.form-control:active {
    background-image: none;
}

.porduct-listing .product-listing-header .plh-row .bootstrap-select {
    margin-bottom: 0 !important;
}

.porduct-listing .product-listing-header .plh-row .bootstrap-select .dropdown-toggle {
    padding      : 8px 15px;
    border-radius: 12px;
    width        : 100%;
}

.porduct-listing .current-product-status {
    font-weight   : 500;
    font-size     : 16px;
    letter-spacing: -1px;
    white-space   : nowrap;
}

.filter-navbar {
    width        : 100%;
    margin-bottom: 20px;
}

.filter-navbar .nav {
    gap        : 10px;
    align-items: center;
}

.filter-navbar .nav li {
    background-color: #fff;
    border          : 1px solid #FBBA00;
    padding         : 6px 12px;
    display         : flex;
    align-items     : center;
    justify-content : center;
    gap             : 12px;
    font-size       : 14px;
    font-weight     : 400;
    border-radius   : 8px;
}

.filter-navbar .nav li button.clear-filter {
    font-size       : 16px;
    margin          : 0;
    padding         : 0;
    background-color: transparent;
    border          : none;
}

.filter-navbar .nav li button.clear-filter .bi::before {
    vertical-align: middle;
}

.filter-navbar .nav li.clear-nav {
    border          : 0;
    background-color: transparent;
}

.filter-navbar .nav li.clear-nav button.clear-navBtn {
    padding      : 0;
    border       : 0;
    border-bottom: 1px solid var(--text-color-main);
    margin       : 0;
    border-radius: 0;
}

.filter-navbar .nav li.clear-nav button.clear-navBtn:hover,
.filter-navbar .nav li button.clear-filter:hover {
    color: #676767;
}

.prodcuct-card {
    border-radius : 6px;
    border        : none;
    padding       : 16px 12px;
    transition    : 0.2s all;
    transform     : scale(1);
    height        : 100%;
    padding-bottom: 20%;
}

.prodcuct-card a {
    text-decoration: none;
    color          : var(--text-color-main);
}

.prodcuct-card:hover {
    box-shadow: 0px 4px 20px 0px #00000026;
}

.prodcuct-card .card-img {
    width        : 100%;
    border-radius: 6px;
    overflow     : hidden;
    margin-bottom: 12px;
    position     : relative;
}

.prodcuct-card .card-img.off-badge .offBadge {
    font-weight     : 700;
    font-size       : 14px;
    background-color: var(--bg-main);
    border-radius   : 10px;
    padding         : 4px 10px;
    display         : flex;
    align-items     : center;
    justify-content : center;
    position        : absolute;
    top             : 13px;
    right           : 13px;
}

.prodcuct-card .card-img img {
    width     : 100%;
    height    : 100%;
    object-fit: contain;
}

.prodcuct-card .card-content {
    display       : flex;
    flex-direction: column;
    gap           : 8px;
    font-family   : "Karla", sans-serif;
}

.prodcuct-card .card-content .product-name {
    font-size     : 20px;
    font-weight   : 600;
    line-height   : 24px;
    letter-spacing: -0.5px;
}

.prodcuct-card .card-content .rating-nav {
    gap          : 4px;
    margin-bottom: 8px;
    align-items  : center;
}

.prodcuct-card .card-content .p-rating li {
    color: var(--bg-main);
}

.prodcuct-card .card-content .rating-nav li span {
    color         : #12100BCC;
    font-size     : 14px;
    line-height   : 24px;
    letter-spacing: -0.5px;
    margin-left   : 10px;
}

.prodcuct-card .card-content .p-price .price-nav {
    align-items: center;
    gap        : 15px;
}

.prodcuct-card .card-content .p-price .price-nav li {
    font-weight: 700;
    font-size  : 20px;
}

.prodcuct-card .card-content .p-price .price-nav li span del {
    color: #12100B33;
}

.prodcuct-card .card-content .btn-main {
    width            : 100%;
    border-color     : #12100B33;
    background-color : transparent;
    position         : absolute;
    bottom           : 10px;
    left             : 50%;
    width            : 90%;
    transform        : translateX(-50%);
    -webkit-transform: translateX(-50%);
}

.prodcuct-card .card-content .btn-main:hover {
    color       : var(--text-color-main);
    border-color: var(--bg-main);
}

.prodcuct-card .card-content .btn-main::after {
    background-color: var(--bg-main);
}

.pagination-nav {
    padding-top    : 40px;
    padding-bottom : 20px;
    gap            : 10px;
    align-items    : center;
    justify-content: center;
}

.pagination-nav li .nav-btn {
    width           : 50px;
    height          : 50px;
    border-radius   : 50%;
    display         : flex;
    align-items     : center;
    justify-content : center;
    background-color: #fff;
    padding         : 0;
    margin          : 0;
    font-weight     : 600;
    font-family     : "Karla", sans-serif;
    border          : 1px solid #E4E7E9;
    color           : var(--text-color-main);
    transition      : 0.2s all;
}

.pagination-nav li .nav-btn:hover,
.pagination-nav li .nav-btn.active {
    background-color: var(--bg-main);
    border-color    : var(--bg-main);
}

.pagination-nav li .nav-btn .bi {
    font-size: 26px;
}

.pagination-nav li .nav-btn .bi::before {
    vertical-align: -5px;
}

.pagination-nav li .nav-btn.disabled,
.pagination-nav li .nav-btn.disabled:hover {
    background-color: #CBC9C8;
    border-color    : #CBC9C8;
    color           : #fff;
    cursor          : not-allowed;
}

.cart-banner {
    background-image   : url('../images/backgrounds/aboutBanner.png');
    background-repeat  : no-repeat;
    background-position: center;
    background-size    : cover;
    padding            : 120px 0px;
}

.cart-banner h1 {
    color: #fff;
}

@media (max-width: 1200px) {
    .store-conditions .service-guarantee .sg-col {
        gap: 10px;
    }

    .store-conditions .service-guarantee .sg-col .sg-img img {
        width: 50px !important;
    }

    .store-conditions .service-guarantee .sg-col .title {
        font-size: 18px;
    }

    .store-conditions .service-guarantee .sg-col .descp {
        font-size  : 13px;
        line-height: 16px;
    }

    .porduct-ceteogiry-listing .col-6 {
        padding-right: 10px;
        padding-left : 10px;
        margin-bottom: 20px;
    }
}

@media (max-width: 992px) {
    /* .store-banner {
        padding-top   : 70px;
        padding-bottom: 70px;
    } */

    .store-conditions .container {
        max-width: 90% !important;
    }

    .store-conditions .service-guarantee .sg-col .title {
        font-size: 16px;
    }

    .store-conditions .service-guarantee .sg-col .sg-img img {
        width: 40px !important;
    }

    .shopCustomer-carousel .overall-ratting-row {
        margin-bottom: 30px;
    }

    .shop-listing .card.shop-card .product-info .product-name {
        font-size  : 18px;
        line-height: 22px;
    }

    .shopCustomer-carousel {
        padding: 0px 0px 80px 0px;
    }

    .shopCustomer-carousel h1 {
        font-size  : 30px;
        line-height: 45px;
    }

    .store-content .filter-categories-sec .accordion-item .accordion-header .accordion-button {
        padding  : 12px 14px;
        font-size: 14px;
        gap      : 30px;
    }

    .porduct-listing .product-listing-header {
        margin-bottom: 13px;
    }

    .filter-navbar {
        margin-bottom: 16px;
    }

    .filter-navbar .nav li {
        padding  : 3px 8px;
        gap      : 8px;
        font-size: 12px;
    }

    .prodcuct-card .card-content .product-name {
        font-size  : 17px;
        line-height: 22px;
    }

    .prodcuct-card .card-content .rating-nav {
        margin-bottom: 4px;
    }

    .prodcuct-card .card-content .p-price .price-nav li {
        font-size: 16px;
    }

    .cart-banner {
        padding: 60px 0px;
    }

    .porduct-ceteogiry-listing .col-6 {
        padding-right: 8px;
        padding-left : 8px;
        margin-bottom: 12px;
    }
}

@media (max-width: 767px) {

    /* .store-banner {
        padding-top   : 40px;
        padding-bottom: 40px;
    } */

    .store-banner img {
        height    : 25vh;
        object-fit: cover;
    }

    .cart-banner {
        padding: 40px 0px;
    }

    .shop-listing .card.shop-card {
        flex-direction : column;
        text-align     : center;
        gap            : 10px;
        padding        : 18px 12px;
        justify-content: space-between;
    }

    .shop-listing .card.shop-card .product-info {
        width: 100%;
        gap  : 15px;
    }

    .shop-listing .card.shop-card .product-img,
    .shop-listing .card.shop-card .product-info .shop-btn {
        width: 100%;
    }

    .shop-listing .card.shop-card .product-info .product-name {
        font-weight: 600;
        font-size  : 16px;
        line-height: 20px;
    }

    .store-conditions .service-guarantee {
        gap        : 10px;
        align-items: flex-start;
    }

    .store-conditions .service-guarantee .sg-col {
        flex-direction: column;
        text-align    : center;
        gap           : 10px;
    }

    .store-conditions .service-guarantee .sg-col .title {
        font-size    : 14px;
        margin-bottom: 6px;
    }

    .store-conditions .service-guarantee .sg-col .descp {
        font-size  : 12px;
        line-height: 14px;
    }

    .shop-listing {
        padding: 30px 0px;
    }

    .shopCustomer-carousel {
        padding: 0px 0px 50px 0px;
    }

    .shopCustomer-carousel h1 {
        font-size  : 25px;
        line-height: 40px;
    }

    .shopCustomer-carousel .overall-ratting-row {
        flex-direction: column;
        gap           : 15px;
        margin-bottom : 20px;
    }

    .shopCustomer-carousel .overall-ratting-row .title {
        font-size  : 20px;
        line-height: 26px;
    }

    .shopCustomer-carousel .overall-ratting-row .title .rating-points {
        font-size  : 24px;
        line-height: 26px;
    }

    .store-content {
        padding        : 30px 0px 50px 0px;
        background-size: 15%, 10%;
    }

    .prodcuct-card {
        padding-bottom: 30%;
    }

    .prodcuct-card .card-content {
        gap       : 5px;
        text-align: center;
    }

    .prodcuct-card .card-content .product-name {
        font-size  : 15px;
        line-height: 20px;
    }

    .prodcuct-card .card-content .p-rating li {
        font-size: 12px;
    }

    .prodcuct-card .card-content .rating-nav,
    .prodcuct-card .card-content .p-price .price-nav {
        justify-content: center;
    }

    .porduct-ceteogiry-listing .col-6 {
        padding-right: 6px;
        padding-left : 6px;
        margin-bottom: 12px;
    }

    .porduct-listing .row.card-row .col-6 {
        padding-right: 3px;
        padding-left : 3px;
        margin-bottom: 6px !important;
    }

    .prodcuct-card a {
        display        : flex;
        flex-direction : column;
        justify-content: space-between;
        height         : 100%;
    }

    .shop-listing.shop-by-type {
        background-size: 25%, 20%;
    }
}

/* ===========================
   Single Product Details Styles
=========================== */

.pd-content {
    padding         : 30px 0px 100px 0px;
    background-color: #F8F3F0 !important;
    font-family     : "Karla", sans-serif;
}

.breadcrumb-navbar ol li,
.breadcrumb-navbar ol li a {
    text-decoration: none;
    color          : #77878F;
    font-size      : 14px;
    font-weight    : 400;
}

.breadcrumb-navbar ol li.active {
    color      : var(--text-color-main);
    font-weight: 500;
}

.breadcrumb-navbar ol li.active::before {
    content: "\203A";
}

.product-detail .col.custom-col.first {
    max-width: 600px;
}

.product-carousel {
    display       : flex;
    flex-direction: column;
    gap           : 20px;
}

.product-carousel .main-carousel {
    height: 530px;
    width : 530px;
}

.product-carousel .main-carousel .carousel-inner .carousel-item {
    height          : 100%;
    background-color: #d0ccba;
}

.product-carousel .main-carousel .carousel-inner .carousel-item img {
    width            : 100%;
    max-width        : 530px;
    height           : auto;
    max-height       : 530px;
    position         : absolute;
    top              : 50%;
    left             : 50%;
    transform        : translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
}

.product-carousel .main-carousel .carousel-control-prev,
.product-carousel .main-carousel .carousel-control-next {
    width           : 50px;
    height          : 50px;
    top             : 50%;
    transform       : translateY(-50%);
    background-color: #191C1F;
    border-radius   : 2px;
    display         : flex;
    align-items     : center;
    justify-content : center;
    opacity         : 1;
}

.product-carousel .main-carousel .carousel-control-prev.disabled,
.product-carousel .main-carousel .carousel-control-next.disabled {
    pointer-events: none;
    opacity       : 0.3;
}

.product-carousel .thumbnail-carousel {
    width          : 100%;
    max-width      : 530px;
    overflow-y     : hidden;
    overflow-x     : auto;
    display        : flex;
    align-items    : center;
    justify-content: flex-start;
    gap            : 15px;
}

/* Hide scrollbar (cross browser) */
.product-carousel .thumbnail-carousel::-webkit-scrollbar {
    display: none;
}

.product-carousel .thumbnail-carousel {
    -ms-overflow-style: none;
    /* IE & Edge */
    scrollbar-width   : none;
    /* Firefox */
}

.product-carousel .thumbnail-carousel .thumb {
    cursor       : pointer;
    margin-bottom: 10px;
    border       : 2px solid transparent;
    border-radius: 0;
    overflow     : hidden;
    position     : relative;
    width        : 80px;
    height       : 80px;
    flex         : 0 0 auto;
}

.product-carousel .thumbnail-carousel .thumb img {
    width  : 100%;
    height : 100%;
    display: block;
}

.product-carousel .thumbnail-carousel .thumb.active::before {
    content         : '';
    position        : absolute;
    top             : 0;
    left            : 0;
    width           : 100%;
    height          : 100%;
    background-color: #00000080;
}

.sp-detail-sec {
    font-family: "Karla", sans-serif;
    font-weight: 400;
    line-height: 24px;
}

.sp-detail-sec .name {
    margin-bottom : 24px;
    font-size     : 30px;
    letter-spacing: -1px;
}

.sp-detail-sec .product-type {
    line-height  : 20px;
    color        : #000;
    margin-bottom: 24px;
}

.sp-detail-sec .product-type .title {
    color: #5F6C72;
}

.sp-detail-sec .product-text {
    color    : #000000B2;
    font-size: 16px;
}

.sp-detail-sec .discount-badge {
    background-color: #C9E5B1;
    padding         : 12px 20px;
    font-weight     : 500;
    font-size       : 18px;
    text-align      : center;
    margin-bottom   : 30px;
    border-radius   : 6px;
}

.sp-detail-sec .price-tag {
    margin-bottom: 30px;
    font-family  : "Gentium Book Plus", serif;
}

.sp-detail-sec .price-tag .actual-price {
    font-weight: 700;
    font-size  : 34px;
    line-height: 30px;
}

.sp-detail-sec .price-tag .old-price {
    color      : #FF635A;
    font-size  : 18px;
    line-height: 100%;
}

.sp-detail-sec .price-tag .old-price span {
    color: #929292;
}

.sp-detail-sec .varient-row {
    margin-bottom: 30px;
}

.sp-detail-sec .varient-row label {
    line-height   : 22px;
    font-weight   : 500;
    letter-spacing: -0.5px;
    margin-bottom : 5px;
}

.sp-detail-sec .varient-row ul.varient-btns li .varient-btn {
    border          : 1px solid #12100B33;
    padding         : 12px 12px;
    font-weight     : 500;
    border-radius   : 6px;
    letter-spacing  : -0.3px;
    background-color: #fff;
    color           : var(--text-color-main);
    min-width       : 60px;
}

.sp-detail-sec .varient-row ul.varient-btns li .varient-btn.active,
.sp-detail-sec .varient-row ul.varient-btns li .varient-btn:hover {
    background-color: var(--bg-dark);
    color           : #fff;
    border          : 1px solid var(--bg-dark);
}

.sp-detail-sec .varient-row .bootstrap-select {
    margin-bottom: 10px !important;
    max-width    : 415px;
}

.sp-detail-sec .varient-row .bootstrap-select .dropdown-toggle {
    border        : 1px solid #12100B33;
    padding       : 13px 15px;
    line-height   : 22px;
    font-weight   : 500;
    letter-spacing: -0.5px;
    border-radius : 6px;
    max-width     : 415px;
}

.sp-detail-sec .varient-row .bootstrap-select .sp-detail-sec .varient-row .stock-status {
    letter-spacing: -0.5px;
    line-height   : 20px;
    color         : #5F6C72;
}

.sp-detail-sec .varient-row .stock-status .inStock {
    font-weight: 600;
    color      : #2DB224;
}

.sp-detail-sec .varient-row .stock-status .outStock {
    font-weight: 600;
    color      : #FA4A3F;
}

.sp-detail-sec .gift-switch .form-check-label {
    font-weight   : 500;
    font-size     : 16px;
    line-height   : 22px;
    letter-spacing: -0.3px;
}

.sp-detail-sec .gift-switch .form-check-input {
    margin: 0;
    float : none;
    width : 36px;
    height: 20px;
    cursor: pointer;
    border: 1px solid var(--bg-dark);
}

.sp-detail-sec .gift-switch .form-check-input:checked {
    background-color: var(--bg-dark);
    border          : 1px solid var(--bg-dark);
}

.sp-detail-sec .gift-switch .form-check-input:focus {
    box-shadow: none;
    outline   : none;
}

.sp-detail-sec .packing-option .packing-btn {
    border          : 2px solid #12100B33;
    padding         : 13px 12px;
    width           : 220px;
    position        : relative;
    display         : flex;
    flex-direction  : column;
    gap             : 10px;
    cursor          : pointer;
    color           : var(--text-color-main);
    background-color: #fff;
    letter-spacing  : -0.3px;
    border-radius   : 12px;
}

.sp-detail-sec .packing-option .packing-btn .title {
    font-weight: 500;
    font-size  : 16px;
    line-height: 100%;
}

.sp-detail-sec .packing-option .packing-btn .price {
    font-weight: 700;
    font-size  : 20px;
    line-height: 24px;
    font-family: "Gentium Book Plus", serif;
}

.sp-detail-sec .packing-option .packing-btn .radio-btn {
    position        : absolute;
    top             : 12px;
    right           : 12px;
    width           : 20px;
    height          : 20px;
    border-radius   : 50%;
    border          : 1px solid #12100B33;
    background-color: #fff;
    display         : flex;
    align-items     : center;
    justify-content : center;
}

.sp-detail-sec .packing-option .packing-btn .radio-btn span {
    width            : 13px;
    height           : 13px;
    border-radius    : 50%;
    background-color : var(--bg-dark);
    position         : absolute;
    top              : 50%;
    left             : 50%;
    transform        : translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    display          : none;
}

.sp-detail-sec .packing-option .packing-btn.disabled {
    cursor : not-allowed;
    opacity: 0.5;
}

.sp-detail-sec .packing-option .packing-btn:hover,
.sp-detail-sec .packing-option .packing-btn.active {
    border: 2px solid var(--bg-dark);
}

.sp-detail-sec .packing-option .packing-btn.disabled:hover {
    border-color: #12100B33;
}

.sp-detail-sec .packing-option .packing-btn.active .radio-btn {
    border-color: var(--bg-dark);
}

.sp-detail-sec .packing-option .packing-btn.active .radio-btn span {
    display: block;
}

.sp-detail-sec .quantity-controler {
    border          : 1px solid #12100B33;
    width           : 150px;
    padding         : 12px 16px;
    border-radius   : 6px;
    background-color: #fff;
}

.sp-detail-sec .quantity-controler .qc-btn {
    width           : 23px;
    height          : 23px;
    display         : flex;
    align-items     : center;
    justify-content : center;
    background-color: transparent;
    border          : none;
    color           : #12100B99;
    font-size       : 22px;
    padding         : 0;
    margin          : 0;
}

.sp-detail-sec .quantity-controler .qc-input {
    padding        : 2px 5px;
    display        : flex;
    align-items    : center;
    justify-content: center;
    font-weight    : 600;
    font-size      : 18px;
}

.product-tab ul .nav-item .nav-link {
    font-weight   : 700;
    color         : #00000099;
    padding       : 10px 10px;
    border-radius : 0%;
    margin        : 0px 5px;
    border        : 0;
    text-transform: uppercase;
}

.product-tab ul .nav-item .nav-link.active {
    background-color: transparent;
    border          : 0;
    border-bottom   : 2px solid var(--bg-main);
    color           : #000;
}

.product-tab .tab-content .tab-pane {
    padding-top   : 50px;
    padding-bottom: 20px;
}

.product-tab .tab-content .tab-pane .tab-pra {
    font-weight: 400;
    font-size  : 16px;
    line-height: 24px;
    color      : #000000;
}

.country-modal .modal-body {
    padding   : 40px 30px;
    background: linear-gradient(272.96deg, rgba(251, 186, 0, 0.2) 1.81%, rgba(251, 186, 0, 0.05) 48.75%, rgba(251, 186, 0, 0.05) 54.85%, rgba(251, 186, 0, 0.2) 98.09%);

}

.country-modal .modal-body .btn-close {
    position        : absolute;
    top             : 15px;
    right           : 15px;
    width           : 30px;
    height          : 30px;
    border-radius   : 50%;
    background-color: var(--bg-dark);
    padding         : 0;
    display         : flex;
    align-items     : center;
    justify-content : center;
    font-size       : 16px;
    border          : none;
    color           : #fff;
    box-shadow      : 0px 4px 84px 0px #0000004D;
    opacity         : 1;
    font-size       : 26px;
}

.country-modal .modal-body .btn-close .bi::before {
    vertical-align: -4px;
}

.country-modal .modal-body .btn-close:hover {
    opacity: 0.8;
}

.country-modal .modal-body h1 {
    font-size     : 34px;
    line-height   : 100%;
    letter-spacing: 0;
    margin-bottom : 36px;
}

.country-modal .modal-body .dropdown.bootstrap-select {
    margin-bottom: 25px !important;
    width        : 100%;
}

.country-modal .modal-body .btn.dropdown-toggle {
    border-radius: 6px;
}

.country-modal .modal-body .btn.btn-dark {
    text-transform: uppercase;
    font-weight   : 600;
    font-family   : "Karla", sans-serif;
    letter-spacing: 0;
    padding       : 15px 20px;
}

.country-modal .modal-body .helping-text {
    text-align : center;
    margin-top : 30px;
    font-weight: 500;
    line-height: 22px;
    font-family: "Karla", sans-serif;
}

.country-modal .modal-body .helping-text a {
    text-decoration: none;
    color          : #0567CA;
    font-weight    : 600;
}

.country-modal .modal-body .helping-text a:hover {
    text-decoration: underline;
}

.review-sec .btn-dark:hover,
.review-sec .btn-dark:active,
.review-sec .btn-dark:focus {
    border-color    : #000;
    color           : #000;
    background-color: transparent;
}

.rh-top h2 {
    font-family   : "Karla", sans-serif;
    font-weight   : 700;
    font-size     : 32.3px;
    line-height   : 45.22px;
    letter-spacing: 0.81px;
    text-transform: uppercase;
    margin-bottom : 0 !important;
}

.add-review {
    border-top      : 1px solid #E0E0E0;
    background-color: #fff;
    border-radius   : 10px;
    margin-bottom   : 40px;
    padding         : 20px 20px;
    display         : none;
}

.add-review .rating-btns {
    margin-bottom: 20px;
}

.add-review .rating-btns li {
    width           : 40px;
    height          : 40px;
    border-radius   : 50%;
    display         : flex;
    align-items     : center;
    justify-content : center;
    border          : 1px solid #D2D2D2;
    background-color: #D2D2D2;
    cursor          : pointer;
}

.add-review .rating-btns li i {
    font-size: 20px;
    color    : #fff;
}

.add-review .rating-btns li.active {
    background-color: var(--bg-main);
}

.add-review form .form-group label span {
    color: red;
}

.add-review form .form-group input.form-control {
    margin-bottom: 20px;
}

.add-review form .form-group .form-check {
    margin-bottom: 30px;
}

.add-review form .form-group .form-check .form-check-input:checked {
    background-color: #000000 !important;
}

.review-card {
    border          : 1px solid #12100B1A;
    background-color: #fff;
    margin-bottom   : 24px;
    padding         : 24px 24px;
    border-radius   : 16px;
    position        : relative;
}

.review-card .rc-header {
    margin-bottom: 20px;
}

.review-card .rc-header .user-name {
    font-weight: 600;
    font-size  : 18px;
    line-height: 25px;
    color      : #12100B;
}


.review-card .rc-header .review-star ul li i {
    color    : #FBBA00;
    font-size: 12px;
}

.review-card .review-content .title {
    font-weight  : 600;
    font-size    : 20px;
    line-height  : 25px;
    color        : #12100B;
    margin-bottom: 10px;
}

.review-card .review-content p {
    font-size  : 18px;
    line-height: 27px;
}

@media (max-width: 1200px) {
    .product-detail .col.custom-col.first {
        max-width: 450px;
    }

    .product-carousel {
        gap: 10px;
    }

    .product-carousel .main-carousel {
        height: 400px;
        width : 400px;
    }

    .product-carousel .thumbnail-carousel {
        gap: 10px;
    }

    .product-carousel .thumbnail-carousel .thumb {
        width        : 60px;
        height       : 60px;
        margin-bottom: 0;
    }
}

@media (max-width: 992px) {

    .product-detail .col.custom-col {
        flex: 0 0 auto;
    }

    .product-detail .col.custom-col.first {
        max-width: 100%;
    }

    .product-carousel .main-carousel .carousel-inner .carousel-item {
        text-align: center;
    }

    .product-carousel .main-carousel .carousel-inner .carousel-item img {
        position         : relative;
        top              : auto;
        left             : auto;
        transform        : none;
        -webkit-transform: none;
    }

    .product-carousel {
        flex-direction: column;
        gap           : 10px;
    }

    .product-carousel .main-carousel {
        width : 100%;
        height: auto;
    }

    .product-carousel .thumbnail-carousel {
        width      : 100%;
        max-height : none;
        margin-left: 0;
        overflow-y : hidden;
        overflow-x : auto;
        display    : flex;
        gap        : 10px;
    }

    .product-carousel .thumbnail-carousel .thumb {
        flex         : 0 0 auto;
        margin-right : 0;
        margin-left  : 0;
        margin-bottom: 0;
        width        : 70px;
        height       : 70px;
    }

    .product-carousel .thumbnail-carousel .thumb img {
        width : 100% !important;
        height: 100% !important;
    }

    .sp-detail-sec .quantity-controler {
        padding: 5px 10px;
        width  : 120px;
    }

    .sp-detail-sec .name {
        font-size     : 25px;
        letter-spacing: -.5px;
        line-height   : 100%;
    }

    .sp-detail-sec .product-type {
        flex-direction: column;
        align-items   : flex-start !important;
    }

    .product-tab .tab-content .tab-pane {
        padding-top   : 30px;
        padding-bottom: 20px;
    }
}

@media (max-width: 767px) {

    .pd-content {
        background-size: 30%, 30%;
    }

    .product-tab ul .nav-item .nav-link {
        font-weight: 600;
        padding    : 6px 5px;
        font-size  : 12px;
        margin     : 0px 2px
    }

    .product-tab .tab-content .tab-pane {
        padding-top   : 20px;
        padding-bottom: 10px;
    }

    .sp-detail-sec .varient-row .bootstrap-select .dropdown-toggle {
        padding  : 7px 10px;
        max-width: 100%;
    }

    .rh-top h2 {
        font-size     : 26px;
        line-height   : 34px;
        letter-spacing: 0;
    }

    .review-card .rc-header .user-name {
        font-size  : 16px;
        line-height: 22px;
    }

    .review-card .rc-header .review-date {
        font-size: 14px;
    }

    .review-card .review-content .title {
        font-size  : 18px;
        line-height: 22px;
    }

    .review-card .review-content p {
        font-size  : 16px;
        line-height: 24px;
    }
}

/* ===========================
   Cart Page Styles
=========================== */

.cart-details {
    font-family: "Karla", sans-serif;
}

.cart-details .cart-table {
    margin-bottom: 37px;
}

.cart-details .cart-table tr th {
    font-weight   : 700;
    font-size     : 20px;
    padding       : 13px 10px;
    vertical-align: middle;
    border-bottom : 1px solid #12100B;
}

.cart-details .cart-table tr td {
    font-weight   : 500;
    font-size     : 20px;
    padding       : 16px 10px;
    vertical-align: middle;
    border-bottom : 1px solid #F8F3F0;
    white-space   : nowrap;
}

.cart-details .cart-table tr.with-gift-wrap td {
    border: 0;
}

.cart-details .cart-table tr.gift-wrap-row td span.total-wrap {
    width     : 130px;
    display   : block;
    text-align: center;
}

.cart-details .cart-table tr td .quantity-controler {
    background-color: #F8F3F0;
    padding         : 6px 14px;
    border          : 1px solid #12100B33;
    width           : 130px;
}

.cart-details .cart-table tr td .quantity-controler .qc-btn {
    padding         : 2px 5px;
    background-color: transparent;
    border          : none;
    margin          : 0;
    font-size       : 20px;
    line-height     : 15px;
}

.cart-details .cart-table tr td .quantity-controler .qc-input {
    padding        : 2px 5px;
    display        : flex;
    align-items    : center;
    justify-content: center;
    font-weight    : 600;
    font-size      : 18px;
}

.cart-details .cart-table tr:last-child td {
    border: 0;
}

.cart-details .cart-table tr td .icon-btn {
    padding         : 5px;
    background-color: transparent;
    border          : none;
    margin          : 0;
    font-size       : 20px;
}

.cart-details .cart-table tr td ul.cart-product li .p-image {
    width   : 64px;
    height  : 64px;
    overflow: hidden;
}

.cart-details .cart-table tr td ul.cart-product li .p-image img {
    width : 100%;
    height: 100%;
}

.cart-controll .form-control {
    padding       : 12px 20px;
    text-transform: uppercase;
    margin-bottom : 0;
}

.cart-controll .btn-main {
    border-radius: 0;
    height       : 100%;
    padding      : 12px 20px;
}

.cart-totals .cart-total-row {
    padding      : 30px 0px;
    font-size    : 20px;
    font-weight  : 500;
    border-bottom: 1px solid #CBC9C8;
    align-items  : center;
    font-family  : 'Karla', sans-serif;
}

.cart-totals .cart-total-row.col-md-4 {
    padding-left: 0;
}

.cart-totals .cart-total-row .title {
    font-weight: 700;
}

.cart-totals .row .btn-main {
    padding       : 12px 20px;
    border-radius : 0;
    text-transform: uppercase;
}

.cartOffcanvas {
    width: 536px !important;
}

.cartOffcanvas .offcanvas-header {
    padding      : 20px 30px;
    border-bottom: 1px solid #12100BB2;
    position     : relative;
}

.cartOffcanvas .offcanvas-header .clearBtn {
    text-decoration  : none;
    color            : var(--text-color-main);
    font-family      : "Karla", sans-serif;
    font-size        : 20px;
    font-weight      : 700;
    position         : absolute;
    top              : 50%;
    right            : 20%;
    padding          : 3px 5px;
    transform        : translateY(-50%);
    -webkit-transform: translateY(-50%);
}

.cartOffcanvas .offcanvas-header h5 {
    font-size: 24px;
}

.offcanvas-body {
    font-family: "Karla", sans-serif;
    font-weight: 500;
    font-size  : 18px;
    line-height: 100%;
    padding    : 35px 30px;
    overflow-x : hidden;
    overflow-y : auto;
}

.offcanvas-body .cart-summary {
    display       : flex;
    flex-direction: column;
    gap           : 20px;
    margin-bottom : 25px;
}

.offcanvas-body .cart-summary .product-row .cart-product {
    width          : 70%;
    text-align     : left;
    justify-content: flex-start;
}

.offcanvas-body .cart-summary .product-row .cart-product .product-img {
    width   : 65px;
    height  : 65px;
    overflow: hidden;
}

.offcanvas-body .cart-summary .product-row .cart-product .product-img img {
    width : 100%;
    height: 100%;
}

.offcanvas-body .cart-summary .product-row .price-side {
    font-weight    : 600;
    width          : 30%;
    text-align     : right;
    justify-content: flex-end;
}

.offcanvas-body .cart-summary .product-row .price-side .icon-btn {
    color: #929FA5;
}

.offcanvas-body .cart-summary .product-row .cart-product .p-name {
    font-weight: 700;
}

.offcanvas-body .cart-summary .product-row .cart-product .quantity-controler {
    width           : 120px;
    padding         : 9px 13px;
    background-color: #F8F3F0;
    border          : 1px solid #12100B33;
    font-size       : 18px;
    font-weight     : 600;
}

.offcanvas-body .cart-summary .product-row .cart-product .quantity-controler .qc-btn {
    padding         : 0px 3px;
    font-size       : 22px;
    margin          : 0;
    border          : 0;
    background-color: transparent;
    color           : var(--text-color-main);
}

.offcanvas-body .cart-total {
    padding       : 16px 0px;
    margin-bottom : 50px;
    display       : flex;
    flex-direction: column;
    gap           : 24px;
    border-top    : 1px solid #12100B33;
}

.offcanvas-body .cart-total .title {
    color          : #12100BB2;
    font-weight    : 600;
    width          : 60%;
    text-align     : left;
    justify-content: flex-start;
}

.offcanvas-body .cart-total .value {
    font-weight    : 600;
    width          : 40%;
    text-align     : right;
    justify-content: flex-end;
}

.cartOffcanvas .offcanvas-body .EmptyCart {
    padding-top    : 100px;
    padding-bottom : 50px;
    display        : flex;
    align-items    : center;
    justify-content: center;
    flex-direction : column;
    gap            : 30px;
    font-size      : 20px;
    font-weight    : 500;
    text-align     : center;
}

.cartOffcanvas .offcanvas-body .EmptyCart .btn-main {
    width  : fit-content;
    padding: 12px 20px;
}

.cartOffcanvas .offcanvas-body .cartInner .btn-main.full {
    position: relative;
}

.cartOffcanvas .offcanvas-body .cartInner .btn-main.full svg {
    position         : absolute;
    top              : 53%;
    right            : 20px;
    transform        : translateY(-50%);
    -webkit-transform: translateY(-50%);
    transition       : 0.2s all;
}

.cartOffcanvas .offcanvas-body .cartInner .btn-main.full:hover svg {
    right: 15px;
}

.cartOffcanvas .offcanvas-body .cartInner .btn-main.full:hover svg path {
    fill: #fff !important;
}

@media (max-width: 992px) {
    .cartOffcanvas .offcanvas-header {
        padding: 14px 20px;
    }

    .cartOffcanvas .offcanvas-header h5 {
        font-size: 18px;
    }

    .cartOffcanvas .offcanvas-header .clearBtn {
        font-size: 14px;
    }

    .offcanvas-body {
        font-size: 15px;
        padding  : 24px 20px;
    }

    .offcanvas-body .cart-summary .product-row .cart-product .product-img {
        width : 50px;
        height: 50px;
    }

    .offcanvas-body .cart-summary .product-row .cart-product .quantity-controler {
        padding        : 6px 8px;
        font-size      : 16px;
        font-weight    : 500;
        justify-content: center;
    }

    .cartOffcanvas .offcanvas-body .EmptyCart {
        padding-top   : 50px;
        padding-bottom: 30px;
        gap           : 20px;
        font-size     : 18px;
    }

    .cart-details .cart-table tr th {
        font-size: 16px;
        padding  : 10px 6px;
    }

    .cart-details .cart-table tr td {
        font-size: 16px;
        padding  : 10px 6px;
    }

    .cart-details .cart-table tr td ul.cart-product li .p-image {
        width : 50px;
        height: 50px;
    }

    .cart-details .cart-table tr td .quantity-controler {
        padding: 3px 8px;
        width  : 120px;
    }

    .cart-details .cart-table tr.gift-wrap-row td span.total-wrap {
        width: 120px;
    }

    .cart-details .cart-table tr td .quantity-controler .qc-input {
        font-size: 14px;
        padding  : 2px 3px;
    }

    .cart-controll .btn-main.apply-coupon-btn {
        height : 100%;
        padding: 3px 6px;
    }

    .cart-totals .cart-total-row {
        padding  : 20px 0px;
        font-size: 18px;
    }
}

/* ===========================
   Checkout Page Styles
=========================== */

.checkout-inner .copen-area {
    margin-bottom: 60px;
    font-family  : "Karla", sans-serif;
    font-weight  : 700;
    font-size    : 16px;
    line-height  : 100%;
}

.checkout-inner .copen-area .copen-banner {
    background-color: #F8F3F0;
    border-top      : 2px solid #FBBA00;
    padding         : 19px 18px;
    margin-bottom   : 22px;
}

.checkout-inner .copen-area .copen-banner span {
    color       : #12100BB2;
    margin-right: 10px;
}

.checkout-inner .copen-area .copen-banner .copen-btn {
    border          : 0;
    background-color: transparent;
    padding         : 0;
    margin          : 0;
    border-bottom   : 1px solid;
}

.checkout-inner .copen-area .copen-banner .copen-btn:hover {
    color: var(--bg-main);
}

.checkout-inner .copen-area .copen-code {
    background-color: #F8F3F0;
    padding         : 30px 30px;
    margin-bottom   : 24px;
}

.checkout-inner .copen-area .copen-code .title {
    margin-bottom: 24px;
}

.checkout-inner .copen-area .copen-code .copen-code-row {
    display    : flex;
    align-items: center;
    gap        : 22px;
}

.checkout-inner .copen-area .copen-code .copen-code-row .form-control {
    width        : 540px;
    margin-bottom: 0;
}

.checkout-inner .copen-area .copen-code .copen-code-row .btn-main.full {
    width  : fit-content;
    padding: 12px 12px;
}

.checkout-inner .copen-area .copen-code-success,
.product-detail .copen-code-success {
    background-color: #fff;
    border-left     : 8px solid #7BB82E;
    padding         : 16px 28px;
    letter-spacing  : -0.5px;
    box-shadow      : 0px 3px 20px 0px #0000000F;
}

.checkout-inner .copen-area .copen-code-success .cc-success-content,
.product-detail .copen-code-success .cc-success-content {
    display    : flex;
    align-items: center;
    gap        : 12px;
}

.checkout-inner .copen-area .copen-code-success .bi,
.product-detail .copen-code-success .bi {
    color    : #7BB82E;
    font-size: 28px;
}

.checkout-form .form-group .bootstrap-select .dropdown-toggle {
    padding: 12px 16px;
}

.card.os-card {
    background-color: #F8F3F0;
    border          : none;
    border-radius   : 0;
}

.os-card .os-card-body {
    padding    : 34px 34px;
    color      : #000000;
    font-family: "Karla", sans-serif;
    font-size  : 16px;
    font-weight: 600;
    line-height: 24px;
}

.os-card .os-card-body .os-card-header {
    font-size    : 30px;
    font-weight  : 700;
    color        : var(--text-color-main);
    font-family  : "Gentium Book Plus", serif;
    margin-bottom: 25px;
}

.os-card .os-card-body .os-product-columns {
    display       : flex;
    flex-direction: column;
    gap           : 12px;
}

.os-card .os-card-body .os-product-columns .osc-products {
    padding-top   : 12px;
    padding-bottom: 24px;
}

.os-card .os-card-body .ic-btn {
    padding         : 0;
    margin          : 0;
    border          : none;
    background-color: transparent;
    font-size       : 20px;
}

.os-card .os-card-body .os-product-columns .osc-product-img img {
    width   : 50px;
    height  : 50px;
    position: relative;
    top     : 5px;
}

.os-card .os-card-body .os-product-columns .p-quantity {
    font-size: 14px;
    color    : #12100B99;
}

.os-card .os-card-body .osc-row {
    padding    : 16px 0px;
    border-top : 1px solid #CBC9C8;
    gap        : 15px;
    line-height: 20px;
}

.os-card .os-card-body .osc-row .osc-title {
    width: 60%
}

.os-card .os-card-body .osc-row .product-price {
    width          : 40%;
    text-align     : right;
    justify-content: flex-end;
}

.os-card .os-card-body .osc-row.top {
    border-top: 0;
}

.os-card .os-card-body .ic-btn.remove-coupen {
    color    : #E80C0C;
    font-size: 16px;
}

.os-card .os-card-body .osc-row-bottom {
    padding: 23px 0px;
}

.os-card .os-card-body .form-check .form-check-input:checked {
    background-color: var(--bg-dark);
    border-color    : var(--bg-dark);
}

.checkout-success-container {
    box-shadow   : 0px 1px 19.6px 0px #00000012;
    border-radius: 20px;
    padding      : 20px 20px;
}

.checkout-succes-msg {
    display        : flex;
    align-items    : center;
    justify-content: center;
    gap            : 25px;
    font-family    : "Karla", sans-serif;
    flex-direction : column;
    text-align     : center;
}

.checkout-succes-msg .success-heading {
    font-size  : 24px;
    font-weight: 600;
    line-height: 32px;
}

.checkout-succes-msg .section-pra {
    color      : #5F6C72;
    max-width  : 450px;
    font-weight: 600;
}

.checkout-succes-msg .section-pra span {
    color: var(--text-color-main);
}

.checkout-succes-msg .btn-main.full {
    width    : 100%;
    max-width: 310px;
}

.checkout-success-container .os-card {
    border-radius: 20px;
}

.checkout-success-container .os-card .os-card-body .os-card-header {
    font-family  : "Karla", sans-serif;
    font-size    : 24px;
    margin-bottom: 30px;
}

.os-card.os-success .os-product-columns .product-lists .osc-products {
    position: relative;
}

.os-card.os-success .os-product-columns .product-lists .osc-products.gift-wrap::after {
    content         : '';
    position        : absolute;
    bottom          : 0;
    right           : 0;
    width           : 90%;
    height          : 1px;
    background-color: #00000033;
}

.os-card.os-success .os-product-columns .product-lists .osc-products:last-of-type::after {
    display: none;
}

@media (max-width: 992px) {
    .checkout-inner .copen-area .copen-code .copen-code-row .form-control {
        max-width: 400px;
    }
}

@media (max-width: 767px) {
    .checkout-inner .copen-area {
        margin-bottom: 40px;
    }

    .checkout-inner .copen-area .copen-code .copen-code-row {
        gap           : 10px;
        flex-direction: column;
        align-items   : flex-start;
    }

    .checkout-inner .copen-area .copen-code .copen-code-row .form-control {
        width: 100%;
    }

    .checkout-inner .copen-area .copen-code .copen-code-row .btn-main.full {
        padding: 10px 16px;
    }

    .checkout-inner .copen-area .copen-code-success {
        max-width: 95%;
        padding  : 16px 20px;
    }

    .checkout-inner .checkout-form .form-group .form-control {
        margin-bottom: 20px;
        padding      : 6px 13px;
    }

    .checkout-form .form-group .bootstrap-select {
        margin-bottom: 20px !important;
    }

    .checkout-form .form-group .bootstrap-select .dropdown-toggle {
        padding: 6px 13px;
    }

    .os-card .os-card-body .os-card-header {
        font-size    : 22px;
        margin-bottom: 16px;
    }

    .os-card .os-card-body {
        padding    : 25px 20px;
        font-size  : 14px;
        line-height: 20px;
    }

    .os-card .os-card-body .os-product-columns .osc-products {
        padding-top   : 8px;
        padding-bottom: 8px;
    }

    .os-card .os-card-body .os-product-columns .osc-product-img img {
        width : 40px;
        height: 40px;
    }

    .os-card .os-card-body .osc-row {
        padding: 10px 0px;
    }

    .os-card .os-card-body .osc-row-bottom {
        padding: 15px 0px;
    }

    .checkout-success-container {
        max-width: 95%;
        padding  : 14px 14px;
    }

    .checkout-succes-msg {
        gap: 20px;
    }

    .checkout-succes-msg .success-heading {
        font-size  : 20px;
        line-height: 24px;
    }

    .checkout-succes-msg p.section-pra {
        margin-bottom: 0px;
        font-size    : 14px;
        line-height  : 22px;
    }

    .checkout-success-container .os-card .os-card-body .os-card-header {
        font-size    : 20px;
        margin-bottom: 23px;
    }
}

/* ===========================
  Member Area Style
=========================== */

.memberArea.loginSignup {
    background-image   : url('../images/backgrounds/bee-flower.png');
    background-repeat  : no-repeat;
    background-position: top 120px left;
    background-size    : 20%;
}

.login-signup-section {
    display        : flex;
    align-items    : center;
    justify-content: center;
    gap            : 30px;
}

.login-signup-section .login-signup-form {
    background-color: #F8F3F0;
    border          : 1px solid #12100B1A;
    padding         : 40px 40px;
    height          : 460px;
    width           : 470px;
}

.login-signup-section .login-signup-form .lsf-header {
    font-weight  : 700;
    font-size    : 28px;
    line-height  : 100%;
    margin-bottom: 35px;
}

.login-signup-section .login-signup-form .form-group .form-control,
.login-signup-section .login-signup-form .btn-main {
    margin-bottom: 24px;
}

.login-signup-section .login-signup-form .btn-text {
    padding      : 2px 1px;
    color        : var(--text-color-main);
    font-weight  : 500;
    font-size    : 16px;
    border-radius: 0;
    font-family  : 'karla', sans-serif;
    border-bottom: 1px solid var(--text-color-main);
}

.login-signup-section .login-signup-form .btn-text:hover {
    border-bottom: 1px solid transparent;
}

.login-signup-section .login-signup-form p.content-pra {
    font-weight  : 500;
    font-size    : 16px;
    line-height  : 22px;
    margin-bottom: 24px;
}

.login-signup-section .middle-title {
    font-size     : 16px;
    font-weight   : 700;
    text-transform: uppercase;
    font-family   : 'karla', sans-serif;
    height        : 100%;
}

.login-signup-section .login-signup-form.forgot-password .lsf-header {
    margin-bottom: 16px;
}

.login-signup-section .login-signup-form p {
    font-weight  : 500;
    font-size    : 14px;
    line-height  : 20px;
    margin-bottom: 35px;
}

.reset-modal .modal-dialog .modal-content .modal-body {
    position: relative;
    padding : 30px 30px;
}

.reset-modal .modal-dialog .modal-content .modal-body .btn-close {
    position        : absolute;
    top             : 18px;
    right           : 20px;
    width           : 30px;
    height          : 30px;
    padding         : 0;
    border-radius   : 50%;
    background      : #000;
    opacity         : 1;
    background-image: none;
    color           : #fff;
    font-size       : 22px;
}

.reset-modal .modal-dialog .modal-content .modal-body .btn-close:hover {
    background-color: rgb(66, 66, 66);
}

.reset-modal .modal-dialog .modal-content .modal-body h2 {
    font-size     : 28px;
    line-height   : 100%;
    letter-spacing: 0;
    margin-bottom : 0;
}

.reset-modal .modal-dialog .modal-content .modal-body p {
    font-weight   : 500;
    font-size     : 14px;
    line-height   : 20px;
    letter-spacing: -0.2px;
}

@media (max-width: 992px) {
    .login-signup-section {
        flex-direction: column;
    }
}

@media (max-width: 500px) {
    .login-signup-section .login-signup-form {
        width  : 100%;
        padding: 20px 20px;
        height : 420px;
    }

    .login-signup-section .login-signup-form .lsf-header {
        font-size    : 24px;
        line-height  : 100%;
        margin-bottom: 20px;
    }
}

.dashboard .dashboard-sidebar {
    width           : 100%;
    background-color: #fff;
    border          : 1px solid #E4E7E9;
    box-shadow      : 0px 8px 40px 0px #00000014;
    border-radius   : 4px;
}

.dashboard .dashboard-sidebar ul {
    width  : 100%;
    padding: 16px 0px;
}

.dashboard .dashboard-sidebar ul li.nav-item a.nav-link {
    width      : 100%;
    display    : flex;
    align-items: center;
    gap        : 12px;
    padding    : 10px 24px;
    font-weight: 500;
    font-family: 'karla', sans-serif;
    color      : var(--text-color-main);
}

.dashboard .dashboard-sidebar ul li.nav-item a.nav-link:hover,
.dashboard .dashboard-sidebar ul li.nav-item a.nav-link.active {
    background-color: var(--text-color-main);
    color           : var(--text-color-white);
}

.dashboard .dashboard-sidebar ul li.nav-item a.nav-link:hover i,
.dashboard .dashboard-sidebar ul li.nav-item a.nav-link.active i {
    color: var(--bg-main);
}

.dashboard .dashboard-body {
    font-family: 'karla', sans-serif;
    font-size  : 14px;
    font-weight: 500;
    line-height: 20px;
}

.dashboard .dashboard-body .dashboard-header {
    font-weight  : 600;
    font-size    : 20px;
    line-height  : 28px;
    margin-bottom: 18px;
}

.dashboard .dashboard-body .dashboard-content {
    margin-bottom: 18px;
}

.dashboard .dashboard-body .dashboard-content a {
    color          : #0863EB;
    text-decoration: none;
}

.dashboard .dashboard-body .dashboard-cards .d-card {
    width      : 100%;
    height     : 100%;
    padding    : 16px;
    display    : flex;
    gap        : 16px;
    line-height: 20px;
    color      : #475156;
}

.dashboard .dashboard-body .dashboard-cards .d-card .icon-box {
    background-color: #fff;
    width           : 56px;
    height          : 56px;
    display         : flex;
    align-items     : center;
    justify-content : center;
}

.dashboard .dashboard-body .dashboard-cards .d-card .icon-box img {
    width : 32px;
    height: auto;
}

.dashboard .dashboard-body .dashboard-cards .d-card .content-box {
    display       : flex;
    flex-direction: column;
    gap           : 5px;
}

.dashboard .dashboard-body .dashboard-cards .d-card .content-box .c-value {
    color      : var(--text-color-main);
    font-size  : 20px;
    font-weight: 600;
}

.dashboard .dashboard-body .dashboard-cards .d-card.total-order {
    background-color: #EAF6FE;
}

.dashboard .dashboard-body .dashboard-cards .d-card.panding-order {
    background-color: #FFF3EB;
}

.dashboard .dashboard-body .dashboard-cards .d-card.complete-order {
    background-color: #EAF7E9;
}

.oh-body {
    border          : 1px solid #E4E7E9;
    background-color: #fff;
    font-family     : 'karla', sans-serif;
    border-radius   : 4px;
    overflow        : hidden;
}

.oh-body .oh-header {
    padding       : 16px 24px;
    font-size     : 14px;
    font-weight   : 600;
    line-height   : 20px;
    text-transform: uppercase;
}

.oh-body .table tr th {
    text-transform  : uppercase;
    font-weight     : 500;
    font-size       : 12px;
    color           : #475156;
    background-color: #E4E7E9;
    padding         : 12px 24px;
    border          : 0;
    vertical-align  : middle;
    white-space     : nowrap;
}

.oh-body .table tr td {
    font-weight   : 500;
    font-size     : 14px;
    padding       : 12px 24px;
    border        : 0;
    vertical-align: middle;
    white-space   : nowrap;
}

.oh-body .table tr td span.status {
    text-transform: uppercase;
    font-weight   : 600;
}

.oh-body .table tr td span.status.completed {
    color: #2DB224;
}

.oh-body .table tr td span.status.inprogress {
    color: #FA8232;
}

.oh-body .table tr td span.status.cancled {
    color: #EE5858;
}

.oh-body .table tr td .text-btn {
    color          : #0863EB;
    display        : flex;
    align-items    : center;
    justify-content: center;
    gap            : 5px;
    font-weight    : 600;
}

.od-body {
    padding-top: 0;
    border     : 0;
}

.od-body .od-header .btn-text {
    display        : flex;
    align-items    : center;
    justify-content: center;
    gap            : 5px;
    font-weight    : 500;
    font-size      : 18px;
    color          : var(--text-color-main);
    width          : fit-content
}

.od-body .od-header .btn-text i {
    font-size: 20px;
}

.od-body .od-header .btn-text span {
    color: #5F6C72;
}

.od-body .order-status-bar {
    font-weight    : 500;
    font-size      : 14px;
    color          : #475156;
    display        : flex;
    align-items    : center;
    justify-content: space-between;
    gap            : 15px;
    margin-bottom  : 20px;
    margin-top     : 10px;
    padding        : 24px 24px;
    border-radius  : 4px;
}

.od-body .order-status-bar .order-number {
    font-weight: 400;
    font-size  : 20px;
    line-height: 28px;
    color      : var(--text-color-main);
}

.od-body .order-status-bar .btn-main-dark {
    padding: 6px 12px;
}

.od-body .order-status-bar .order-price {
    font-weight: 600;
    font-size  : 28px;
    line-height: 32px;
    color      : var(--text-color-main);
}

.od-body .order-status-bar.success {
    border    : 1px solid #BDD2BC;
    background: #E5FFE3;
}

.od-body .order-status-bar.failed {
    border    : 1px solid #EE5858;
    background: #EE585833;
}

.od-body .order-status-bar.inprogress {
    border    : 1px solid #D0B4A0;
    background: #FFDFCA;
}

.oh-body .table tr td .product-row {
    display    : flex;
    align-items: center;
    gap        : 16px;
    width      : 380px;
}

.oh-body .table tr td .product-row .product-img {
    width   : 64px;
    height  : 64px;
    overflow: hidden;
}

.oh-body .table tr td .product-row .product-img img {
    width : 100%;
    height: 100%;
}

.oh-body .table tr td .product-row .product-decp .name {
    font-weight: 600;
    font-size  : 12px;
}

.oh-body .table tr td .product-row .product-decp .p-detail {
    color: #5F6C72;
}

.od-body .delivery-details {
    border     : 1px solid #E4E7E9;
    padding    : 32px 24px;
    margin-top : 30px;
    color      : #5F6C72;
    font-size  : 14px;
    line-height: 20px;
}

.od-body .delivery-details .title {
    font-weight  : 500;
    font-size    : 18px;
    line-height  : 24px;
    color        : var(--text-color-main);
    margin-bottom: 24px;
}

.od-body .delivery-details .title-small {
    font-weight  : 500;
    font-size    : 14px;
    line-height  : 20px;
    color        : var(--text-color-main);
    margin-bottom: 8px;
}

.od-body .delivery-details .title-small span {
    color: #5F6C72;
}

.od-body .delivery-details .detail-content {
    margin-bottom: 12px;
}

.oh-body .form-section {
    padding         : 24px 24px;
    background-color: #F8F3F0;
}

.oh-body .form-section .form-group .form-control {
    border-radius: 2px;
}

.oh-body .form-section .form-group .btn.btn-main.full {
    border-radius: 6px;
}

@media (max-width: 992px) {

    .oh-body .table tr th,
    .oh-body .table tr td {
        padding: 10px 16px
    }

    .oh-body .table tr td .product-row {
        width: 250px;
    }

    .od-body .delivery-details .title {
        margin-bottom: 16px;
    }
}

@media (max-width: 767px) {
    .od-body .order-status-bar {
        flex-wrap: wrap;
        gap      : 5px;
        padding  : 18px 18px;
        font-size: 12px;
    }

    .od-body .order-status-bar .order-number {
        font-size  : 16px;
        line-height: 22px;
    }

    .od-body .order-status-bar .order-price {
        font-size  : 20px;
        line-height: 26px;
    }
}

/* ===========================
   Footer Style Section
=========================== */

.footer {
    background-color   : var(--bg-main);
    padding            : 110px 0px 100px 0px;
    position           : relative;
    background-image   : url('../images/backgrounds/footerBg.png');
    background-repeat  : repeat-x;
    background-position: bottom center;
    background-size    : inherit;
}

.footer .footer-heading {
    font-weight  : 700;
    font-size    : 22px;
    line-height  : 100%;
    margin-bottom: 24px;
}

.footer .footer-pra {
    font-family  : "Karla", sans-serif;
    font-weight  : 400;
    font-size    : 16px;
    line-height  : 22px;
    margin-bottom: 30px;
}

.footer .footer-nav {
    gap: 20px;
}

.footer .footer-nav .nav-item .contact-detail {
    display    : flex;
    align-items: flex-start;
    gap        : 12px;
}

.footer .footer-nav .nav-item .contact-detail span,
.footer .footer-nav .nav-item .contact-detail span a {
    font-size      : 16px;
    font-weight    : 500;
    font-family    : "Karla", sans-serif;
    color          : var(--text-color-main);
    text-decoration: none;
}

.footer .footer-nav .nav-item .contact-detail span a {
    text-transform: lowercase;
}

.footer .footer-nav .nav-item a,
.footer .footer-nav .menu-item a {
    text-decoration: none;
    color          : var(--text-color-main);
    text-transform : uppercase;
    font-size      : 16px;
    font-weight    : 500;
    font-family    : "Karla", sans-serif;
    padding        : 0;
}

.footer .subcribe-form .form-control {
    padding         : 16px 18px;
    background-color: #fff;
    border          : 1px solid #fff;
    font-weight     : 400;
    font-size       : 16px;
    border-radius   : 6px;
    font-family     : "Karla", sans-serif;
}

.footer .subcribe-form .form-control::placeholder {
    color         : var(--text-color-main);
    text-transform: capitalize;
}

.footer .subcribe-form .btn-main-dark {
    padding      : 16px 20px;
    border-radius: 6px;
    color        : var(--bg-main);
    width        : 100%;
}

.footer .subcribe-form .btn-main-dark:hover {
    color: var(--text-color-main);
}

.footer .footer-bottom {
    margin-top: 25px;
    border-top: 1px solid #12100B33;
    padding   : 25px 0px;
}

.footer .footer-bottom ul.social-nav {
    gap: 10px;
}

.footer .footer-bottom ul.social-nav li .social-link {
    width           : 42px;
    height          : 42px;
    display         : flex;
    align-items     : center;
    justify-content : center;
    background-color: var(--text-color-main);
    color           : var(--bg-main);
    border          : 1px soldi var(--text-color-main);
}

.footer .footer-bottom ul.social-nav li .social-link:hover {
    background-color: var(--text-color-white);
    color           : var(--text-color-main);
}

.footer .footer-bottom ul.social-nav li .social-link.facebook:hover svg path,
.footer .footer-bottom ul.social-nav li .social-link.linkedin:hover svg path, 
.footer .footer-bottom ul.social-nav li .social-link.twitter:hover svg path, 
.footer .footer-bottom ul.social-nav li .social-link.youtube:hover svg path.video-ic {
    fill: var(--text-color-main) !important;
}

.footer .footer-bottom ul.social-nav li .social-link.instagram:hover svg path, 
.footer .footer-bottom ul.social-nav li .social-link.youtube:hover svg path {
    stroke: var(--text-color-main) !important;
}

.footer .footer-bottom p.section-pra a {
    color: var(--text-color-main);
}

.footer .footer-logo {
    width           : 135px;
    height          : 135px;
    border-radius   : 50%;
    display         : flex;
    align-items     : center;
    justify-content : center;
    position        : absolute;
    top             : -42px;
    left            : 50%;
    transform       : translateX(-50%);
    background-color: var(--bg-main);
}

.footer .footer-logo img {
    width : 65px;
    height: auto;
}

@media (max-width: 767px) {
    .footer {
        padding: 60px 0px 60px 0px;
    }

    .footer .footer-logo {
        width : 100px;
        height: 100px;
        top   : -30px;
    }

    .footer .footer-logo img {
        width: 50px;
    }

    .footer .subcribe-form .form-control {
        padding      : 12px 14px;
        margin-bottom: 20px;
    }

    .footer .subcribe-form .btn-main-dark {
        padding: 12px 16px;
    }

    .footer .footer-heading {
        margin-bottom: 16px;
    }

    .footer .footer-nav {
        gap: 15px;
    }
}

/* ===========================
   Swipper Carousel Style
=========================== */

.creative-fullpage--slider {
    background-color: #ffffff;
    z-index         : 2;
    width           : 100%;
    position        : relative;
    flex-direction  : column;
    height          : 100vh;
    font-size       : 16px;
    display         : flex;
    clip-path       : none !important;
}

.creative-fullpage--slider .slider-inner {
    background: #000;
    height    : 100vh;
    position  : relative;
}

.creative-fullpage--slider .swiper-slide {
    position       : relative;
    display        : flex;
    justify-content: center;
    text-align     : left;
    flex-direction : column;
    overflow       : hidden;
}

.creative-fullpage--slider .swiper-slide .slider-inner img {
    object-fit       : cover;
    width            : 100%;
    height           : 100vh;
    transform        : scale(1.1);
    -webkit-transform: scale(1.1);
    animation        : kenburns 8s ease-in-out infinite alternate;
    -webkit-animation: kenburns 8s ease-in-out infinite alternate;
}

/* Ken Burns Keyframes */
@keyframes kenburns {
    0% {
        transform: scale(1.1) translate(0, 0);
    }

    100% {
        transform: scale(1.25) translate(-5%, -5%);
    }
}

.creative-fullpage--slider .swiper-slide .slider-inner video {
    object-fit: cover;
    width     : 100%;
    height    : 100%;
}

.creative-fullpage--slider .swiper-slide .slider-inner .swiper-content {
    position       : absolute;
    top            : 0;
    left           : 0;
    z-index        : 1;
    width          : 100%;
    height         : 100%;
    display        : flex;
    align-items    : center;
    justify-content: center;
    flex-direction : column;
    text-align     : center;
}

.creative-fullpage--slider .swiper-slide .slider-inner::after {
    content            : "";
    position           : absolute;
    width              : 101%;
    height             : 100%;
    top                : 0;
    left               : -1px;
    background-color   : #0000005c;
    /* background-image: radial-gradient(at center right, #FFFFFF00 50%, #00000096 100%); */
}

.swiper-slide .slider-inner .swiper-content .title-area .tag {
    letter-spacing: 2px;
    text-transform: uppercase;
    color         : var(--bg-main);
    font-family   : "Karla", sans-serif;
    line-height   : 32px;
    margin-bottom : 40px;
}

.swiper-slide .slider-inner .swiper-content .title-area .title {
    color        : var(--text-color-white);
    margin-bottom: 40px;
    max-width    : 850px;
}

.swiper-slide .slider-inner .swiper-content p.disc {
    font-size    : 22px;
    font-weight  : 500;
    color        : var(--text-color-white);
    margin-bottom: 40px;
    max-width    : 850px;
    text-align   : center;
}

.creative-fullpage--slider .swiper-container-h .swiper-button-next,
.creative-fullpage--slider .swiper-container-h .swiper-button-prev {
    top             : 50%;
    bottom          : unset;
    transform       : scale(1);
    transition      : all 0.4s;
    background-color: #FFFFFF00;
    backdrop-filter : blur(20px);
    height          : 60px;
    width           : 60px;
    line-height     : 60px;
    border-radius   : 2px;
    transition      : all 0.4s;
    transform       : translateY(-50%);
    transform       : translateY(-50%);
    border          : 1px solid var(--bg-main);
}

.creative-fullpage--slider .swiper-container-h .swiper-button-next {
    right: 50px;
}

.creative-fullpage--slider .swiper-container-h .swiper-button-prev {
    left: 50px;
}

.swiper-container-h .slider-pagination-area {
    display        : flex;
    align-items    : center;
    justify-content: center;
    position       : absolute;
    top            : unset;
    right          : unset;
    bottom         : 80px;
    left           : 50% !important;
    transform      : translateX(-50%);
    width          : 500px;
    z-index        : 1;
}

.swiper-container-h .slider-pagination-area .slide-range {
    font-size  : 16px;
    font-weight: 500;
    margin     : 0 15px;
    color      : #ffffff;
    line-height: 0;
    position   : absolute;
    font-size  : 20px;
}

.swiper-container-h .slider-pagination-area .slide-range.one {
    left: -50px;
}

.swiper-container-h .slider-pagination-area .slide-range.three {
    right: -50px;
}

.swiper-container-h .slider-pagination-area .swiper-pagination {
    bottom: 0 !important;
    width : 500px !important;
}

.swiper-container-h .slider-pagination-area .swiper-pagination .swiper-pagination-progressbar-fill {
    background: #ffffff;
}

.swiper-container-h .swiper-button-next::after {
    content    : "\f061";
    font-family: var(--fa-style-family, "Font Awesome 6 Free");
    font-weight: var(--fa-style, 900);
    background : none;
    color      : #ffffff;
    font-size  : 30px;
}

.swiper-container-h .swiper-button-prev::after {
    content    : "\f060";
    font-family: var(--fa-style-family, "Font Awesome 6 Free");
    font-weight: var(--fa-style, 900);
    background : none;
    color      : #ffffff;
    font-size  : 30px;
}

.swiper-container-h .swiper-button-next:hover,
.swiper-container-h .swiper-button-prev:hover {
    background-color: var(--bg-main);
}

.swiper-container-h .swiper-button-next:hover::after,
.swiper-container-h .swiper-button-prev:hover::after {
    color: var(--text-color-main);
}


/* ====================== Responsive Ipad =============================== */
@media (max-width: 991px) {

    .creative-fullpage--slider,
    .creative-fullpage--slider .slider-inner,
    .creative-fullpage--slider .swiper-slide .slider-inner img {
        height: 80vh;
    }


    .creative-fullpage--slider .swiper-slide .slider-inner .swiper-content {
        width     : 100%;
        text-align: center;
        left      : 0;
    }

    .swiper-slide .slider-inner .swiper-content .title-area .title {
        max-width: 650px;
    }

    .swiper-slide .slider-inner .swiper-content p.disc {
        max-width: 550px;
    }

    .swiper-container-h .slider-pagination-area {
        width: 200px !important;
    }

    .swiper-container-h .swiper-button-next::after,
    .swiper-container-h .swiper-button-prev::after {
        font-size: 25px;
    }

    .creative-fullpage--slider .swiper-container-h .swiper-button-next,
    .creative-fullpage--slider .swiper-container-h .swiper-button-prev {
        height           : 50px;
        width            : 50px;
        line-height      : 50px;
        bottom           : 5%;
        top              : unset;
        transform        : translateY(-5%);
        -webkit-transform: translateY(-5%);
    }

    .swiper-container-h .slider-pagination-area .swiper-pagination {
        bottom: 0 !important;
        width : 200px !important;
    }
}

/* ====================== Responsive Iphone =============================== */
@media screen and (max-width: 767px) {

    .swiper-slide .slider-inner .swiper-content .title-area .tag {
        margin-bottom: 0px;
    }

    .swiper-slide .slider-inner .swiper-content p.disc {
        margin   : 20px auto 20px auto;
        font-size: 16px;
        width    : 95%;
    }

    .swiper-container-h .slider-pagination-area {
        bottom: 5%;
        height: 40px;
    }

    .swiper-container-h .slider-pagination-area,
    .swiper-container-h .slider-pagination-area .swiper-pagination {
        width: 100px !important;
    }

    .swiper-container-h .slider-pagination-area .swiper-pagination-progressbar.swiper-pagination-horizontal {
        top      : 50%;
        transform: translateY(-50%);
    }

    .creative-fullpage--slider .swiper-container-h .swiper-button-next,
    .creative-fullpage--slider .swiper-container-h .swiper-button-prev {
        height     : 40px;
        width      : 40px;
        line-height: 40px;
    }

    .swiper-container-h .swiper-button-next::after,
    .swiper-container-h .swiper-button-prev::after {
        font-size: 18px;
    }

    .creative-fullpage--slider .swiper-container-h .swiper-button-prev {
        left: 20px;
    }

    .creative-fullpage--slider .swiper-container-h .swiper-button-next {
        right: 20px;
    }
}


/* ==== Filter Offcanvas ==== */

.offcanvas {
    z-index: 9999;
}

.product-listing-header.mob {
    background-color: transparent;
    padding         : 0;
}

.product-listing-header.mob input.form-control {
    margin-bottom      : 12px;
    border-radius      : 6px;
    border             : 1px solid #12100B33;
    background-image   : url('../images/svgs/search-ic.svg');
    background-repeat  : no-repeat;
    background-position: center right 14px;
    padding            : 12px 50px 12px 12px;
}

.product-listing-header.mob input.form-control:focus,
.product-listing-header.mob input.form-control:active {
    box-shadow      : none;
    background-image: none;
}

.product-listing-header.mob .row .col-6:nth-child(odd) {
    padding-right: calc(var(--bs-gutter-x) * .5);
}

.product-listing-header.mob .btn-main-dark {
    padding        : 10px 15px;
    display        : flex;
    align-items    : center;
    justify-content: flex-start;
    gap            : 14px;
}

.product-listing-header.mob .btn-main-dark:hover,
.product-listing-header.mob .btn-main-dark:active {
    background-color: var(--bg-dark);
    color           : var(--text-color-white);
    border-color    : var(--bg-dark);
}

.product-listing-header.mob .btn-main-dark::after {
    display: none;
}

.product-listing-header.mob .btn-main-dark span {
    background-color : transparent;
    color            : #fff;
    transform        : none;
    width            : auto;
    height           : auto;
    position         : absolute;
    top              : 50%;
    right            : 20px;
    transform        : translateY(-50%);
    -webkit-transform: translateY(-50%);
}

.product-listing-header.mob .bootstrap-select {
    margin-bottom: 0 !important;
}

.product-listing-header.mob .bootstrap-select .dropdown-toggle {
    padding         : 8px 15px;
    border-radius   : 6px;
    background-color: var(--bg-dark);
    color           : var(--text-color-white) !important;
    border-color    : var(--bg-dark);
}

.filter-offcanvas {
    max-width: 320px;
}

.filter-offcanvas .offcanvas-header {
    border-bottom   : transparent;
    padding         : 22px 16px;
    background-color: #F8F3F0;
}

.filter-offcanvas .offcanvas-header h5 {
    display       : flex;
    align-items   : center;
    gap           : 13px;
    font-family   : "karla", sans-serif;
    font-weight   : 600;
    font-size     : 18px;
    line-height   : 22px;
    letter-spacing: -0.3px;
}

.filter-offcanvas .offcanvas-header .btn-close {
    padding         : 0;
    border          : none;
    background      : transparent;
    font-size       : 24px;
    color           : var(--text-color-white);
    background-color: var(--bg-dark);
    width           : 32px;
    height          : 32px;
    display         : flex;
    align-items     : center;
    justify-content : center;
    border-radius   : 50%;
    opacity         : 1;
    background-image: none;
}

.filter-offcanvas .offcanvas-header .btn-close .bi-x::before {
    vertical-align: -4px;
}

.filter-offcanvas .offcanvas-body {
    padding    : 0;
    font-family: "karla", sans-serif;
}

.filter-offcanvas .offcanvas-body .filter-type-header {
    width           : 100%;
    padding         : 10px 20px;
    text-align      : center;
    background-color: var(--bg-main);
    color           : var(--text-color-main);
    font-weight     : 700;
    letter-spacing  : 0;
    line-height     : 100%;
    text-transform  : uppercase;
}

.filter-offcanvas .offcanvas-body.store-content .filter-categories-sec {
    border-radius: 0;
    border-bottom: 0;
    margin-bottom: 0;
}

.filter-offcanvas .offcanvas-body.store-content .filter-categories-sec .accordion-item .accordion-header .accordion-button {
    font-weight  : 500;
    font-size    : 16px;
    padding      : 16px 20px;
    border-radius: 0;
}