@charset "UTF-8";
@import url(https://fonts.googleapis.com/css?family=Nunito:300,400,500,600,700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Alex+Brush&display=swap);
@import url(https://fonts.googleapis.com/css2?family=EB+Garamond:wght@400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Work+Sans:wght@300&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Kaushan+Script&display=swap);

*,
::after,
::before {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 0 solid #e5e7eb;
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    --tw-pan-x: ;
    --tw-pan-y: ;
    --tw-pinch-zoom: ;
    --tw-scroll-snap-strictness: proximity;
    --tw-gradient-from-position: ;
    --tw-gradient-via-position: ;
    --tw-gradient-to-position: ;
    --tw-ordinal: ;
    --tw-slashed-zero: ;
    --tw-numeric-figure: ;
    --tw-numeric-spacing: ;
    --tw-numeric-fraction: ;
    --tw-ring-inset: ;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgb(59 130 246 / 0.5);
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    --tw-blur: ;
    --tw-brightness: ;
    --tw-contrast: ;
    --tw-grayscale: ;
    --tw-hue-rotate: ;
    --tw-invert: ;
    --tw-saturate: ;
    --tw-sepia: ;
    --tw-drop-shadow: ;
    --tw-backdrop-blur: ;
    --tw-backdrop-brightness: ;
    --tw-backdrop-contrast: ;
    --tw-backdrop-grayscale: ;
    --tw-backdrop-hue-rotate: ;
    --tw-backdrop-invert: ;
    --tw-backdrop-opacity: ;
    --tw-backdrop-saturate: ;
    --tw-backdrop-sepia:
}

#topnav {
    position: fixed;
    inset-inline-start: 0px;
    inset-inline-end: 0px;
    top: 0;
    z-index: 999;
    border-width: 0;
    background-color: rgb(34, 197, 94);
    -webkit-transition-duration: .5s;
    transition-duration: .5s
}

#topnav .logo {
    --tw-text-opacity: 1 !important;
    color: rgb(22 28 45 / var(--tw-text-opacity)) !important
}

:is([dir=ltr] #topnav .logo) {
    float: left !important
}

:is([dir=rtl] #topnav .logo) {
    float: right !important
}

:is(.dark #topnav .logo) {
    --tw-text-opacity: 1 !important;
    color: rgb(255 255 255 / var(--tw-text-opacity)) !important
}

#topnav .logo .l-dark {
    display: none
}

#topnav .logo .l-light {
    display: inline-block
}

#topnav .logo:focus {
    outline: transparent solid 2px;
    outline-offset: 2px
}

#topnav .has-submenu {
    position: relative
}

#topnav .has-submenu.active a {
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity))
}

:is(.dark #topnav .has-submenu.active a) {
    --tw-text-opacity: 1;
    color: rgb(15 23 42 / var(--tw-text-opacity))
}

#topnav .has-submenu.active .submenu li.active>a {
    --tw-text-opacity: 1 !important;
    color: rgb(34 197 94 / var(--tw-text-opacity)) !important
}

:is(.dark #topnav .has-submenu.active .submenu li.active > a) {
    --tw-text-opacity: 1 !important;
    color: rgb(34 197 94 / var(--tw-text-opacity)) !important
}

#topnav .has-submenu.active.active .menu-arrow {
    --tw-border-opacity: 1;
    border-color: rgb(34 197 94 / var(--tw-border-opacity))
}

:is(.dark #topnav .has-submenu.active.active .menu-arrow) {
    --tw-border-opacity: 1;
    border-color: rgb(34 197 94 / var(--tw-border-opacity))
}

#topnav .has-submenu .submenu .submenu-arrow {
    border-width: 0 .125rem .125rem 0;
    position: absolute;
    inset-inline-end: 1.25rem;
    top: 15px;
    display: inline-block;
    border-radius: .5px;
    --tw-border-opacity: 1;
    border-color: rgb(22 28 45 / var(--tw-border-opacity));
    padding: 2px
}

:is([dir=ltr] #topnav .has-submenu .submenu .submenu-arrow) {
    --tw-rotate: -45deg;
    -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

:is([dir=rtl] #topnav .has-submenu .submenu .submenu-arrow) {
    --tw-rotate: 135deg;
    -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

:is(.dark #topnav .has-submenu .submenu .submenu-arrow) {
    --tw-border-opacity: 1;
    border-color: rgb(255 255 255 / var(--tw-border-opacity))
}

#topnav .has-submenu .submenu .has-submenu:hover>.submenu-arrow {
    --tw-border-opacity: 1;
    border-color: rgb(34 197 94 / var(--tw-border-opacity))
}

:is(.dark #topnav .has-submenu .submenu .has-submenu:hover > .submenu-arrow) {
    --tw-border-opacity: 1;
    border-color: rgb(34 197 94 / var(--tw-border-opacity))
}

#topnav .has-submenu .submenu .has-submenu .submenu .has-submenu:hover .submenu-arrow {
    --tw-border-opacity: 1;
    border-color: rgb(34 197 94 / var(--tw-border-opacity))
}

:is(.dark #topnav .has-submenu .submenu .has-submenu .submenu .has-submenu:hover .submenu-arrow) {
    --tw-border-opacity: 1;
    border-color: rgb(34 197 94 / var(--tw-border-opacity))
}

#topnav .has-submenu .submenu .has-submenu .submenu .has-submenu:hover>.submenu-arrow {
    --tw-border-opacity: 1;
    border-color: rgb(34 197 94 / var(--tw-border-opacity))
}

:is(.dark #topnav .has-submenu .submenu .has-submenu .submenu .has-submenu:hover > .submenu-arrow) {
    --tw-border-opacity: 1;
    border-color: rgb(34 197 94 / var(--tw-border-opacity))
}

#topnav .navigation-menu>li .submenu li {
    position: relative;
    -webkit-margin-start: 0px;
    margin-inline-start: 0
}

#topnav .navbar-toggle {
    position: relative;
    margin: 0;
    cursor: pointer;
    border-width: 0;
    padding: 0
}

#topnav .navbar-toggle .lines {
    position: relative;
    margin-top: 30px;
    -webkit-margin-end: 0;
    margin-inline-end: 0;
    margin-bottom: 26px;
    -webkit-margin-start: 10px;
    margin-inline-start: 10px;
    display: block;
    height: 18px;
    width: 25px
}

#topnav .navbar-toggle span {
    -webkit-transition: -webkit-transform .5s;
    transition: transform .5s;
    transition: transform .5s, -webkit-transform .5s;
    margin-bottom: 5px;
    display: block;
    height: 2px;
    width: 100%;
    --tw-bg-opacity: 1;
    background-color: rgb(22 28 45 / var(--tw-bg-opacity))
}

:is(.dark #topnav .navbar-toggle span) {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity))
}

#topnav .navbar-toggle span:last-child {
    margin-bottom: 0
}

#topnav .navbar-toggle.open span {
    position: absolute
}

#topnav .navbar-toggle.open span:first-child {
    top: 6px;
    --tw-rotate: 45deg;
    -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

#topnav .navbar-toggle.open span:nth-child(2) {
    visibility: hidden
}

#topnav .navbar-toggle.open span:last-child {
    top: 6px;
    width: 100%;
    --tw-rotate: -45deg;
    -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

#topnav .navbar-toggle.open span:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(34 197 94 / var(--tw-bg-opacity))
}

#topnav .navbar-toggle .navigation-menu>li>a:hover,
#topnav .navbar-toggle:focus,
#topnav .navbar-toggle:hover {
    background-color: transparent
}

#topnav .buy-button {
    line-height: 74px
}

:is([dir=ltr] #topnav .buy-button) {
    float: right
}

:is([dir=rtl] #topnav .buy-button) {
    float: left
}

#topnav .buy-button>li {
    line-height: initial
}

#topnav .buy-button .btn-icon-dark,
#topnav .buy-button .login-btn-primary {
    display: none
}

#topnav .buy-button .btn-icon-light,
#topnav .buy-button .login-btn-light {
    display: inline-block
}

#topnav .buy-button .search-bar .menu-search form {
    position: relative
}

#topnav .buy-button .search-bar .searchform::after {
    pointer-events: none;
    position: absolute;
    inset-inline-end: 14px;
    top: 14px;
    font-size: 1.25rem;
    content: var(--tw-content);
    line-height: 1.25rem
}

#topnav .buy-button .search-bar .searchform input[type=text] {
    display: block !important;
    height: 2.75rem !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    -webkit-padding-end: 42px !important;
    padding-inline-end: 42px !important;
    -webkit-padding-start: 0.75rem !important;
    padding-inline-start: 0.75rem !important;
    font-size: .875rem !important;
    line-height: 1.25rem !important;
    --tw-shadow: 0 0 #0000 !important;
    --tw-shadow-colored: 0 0 #0000 !important;
    -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
    outline: transparent solid 2px !important;
    outline-offset: 2px !important
}

#topnav .buy-button .search-bar .searchform input[type=submit] {
    display: none
}

#topnav .buy-button .search-bar .searchform:after {
    content: "󰍉";
    font-family: "Material Design Icons"
}

#topnav .buy-button .dropdown .dropdown-toggle::after,
#topnav .buy-menu-btn .dropdown .dropdown-toggle::after {
    content: var(--tw-content);
    display: none
}

#topnav .navigation-menu {
    margin: 0;
    list-style-type: none;
    padding: 0
}

#topnav .navigation-menu>li {
    position: relative;
    margin: 0 1px;
    display: block
}

:is([dir=ltr] #topnav .navigation-menu > li) {
    float: left
}

:is([dir=rtl] #topnav .navigation-menu > li) {
    float: right
}

#topnav .navigation-menu>li>a {
    display: block !important;
    background-color: transparent !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    line-height: 1.5rem !important;
    letter-spacing: 1px !important;
    --tw-text-opacity: 1 !important;
    color: rgb(22 28 45 / var(--tw-text-opacity)) !important
}

:is(.dark #topnav .navigation-menu > li > a) {
    --tw-text-opacity: 1 !important;
    color: rgb(255 255 255 / var(--tw-text-opacity)) !important
}

#topnav .navigation-menu>li>a:active,
#topnav .navigation-menu>li>a:hover {
    --tw-text-opacity: 1;
    color: rgb(34 197 94 / var(--tw-text-opacity))
}

#topnav .navigation-menu>li.active>a,
#topnav .navigation-menu>li:hover>a {
    --tw-text-opacity: 1 !important;
    color: rgb(34 197 94 / var(--tw-text-opacity)) !important
}

:is(.dark #topnav .navigation-menu > li.active > a),
:is(.dark #topnav .navigation-menu > li:hover > a) {
    --tw-text-opacity: 1 !important;
    color: rgb(34 197 94 / var(--tw-text-opacity)) !important
}

#topnav .navigation-menu>li .submenu.megamenu li .megamenu-head {
    white-space: nowrap !important;
    padding: 10px 1.25rem !important;
    font-size: .75rem !important;
    line-height: 1rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: .04em !important;
    --tw-text-opacity: 1 !important;
    color: rgb(148 163 184 / var(--tw-text-opacity)) !important
}

#topnav .navigation-menu .has-submenu .menu-arrow {
    border-width: 0 2px 2px 0;
    position: absolute;
    inset-inline-end: 0px;
    top: 2rem;
    display: inline-block;
    --tw-rotate: 45deg;
    -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    border-radius: .5px;
    --tw-border-opacity: 1;
    border-color: rgb(22 28 45 / var(--tw-border-opacity));
    padding: 2px;
    -webkit-transition-duration: .5s;
    transition-duration: .5s
}

:is(.dark #topnav .navigation-menu .has-submenu .menu-arrow) {
    --tw-border-opacity: 1;
    border-color: rgb(255 255 255 / var(--tw-border-opacity))
}

#topnav .navigation-menu .has-submenu:hover .menu-arrow {
    --tw-rotate: 225deg;
    -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

:is([dir=ltr] #topnav .menu-extras) {
    float: right
}

:is([dir=rtl] #topnav .menu-extras) {
    float: left
}

#topnav.scroll {
    border-style: none;
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity));
    --tw-shadow: 0 0 3px rgb(60 72 88 / 0.15);
    --tw-shadow-colored: 0 0 3px var(--tw-shadow-color);
    -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

:is(.dark #topnav.scroll) {
    --tw-bg-opacity: 1;
    background-color: rgb(15 23 42 / var(--tw-bg-opacity))
}

#topnav.scroll .navigation-menu>li>a {
    --tw-text-opacity: 1;
    color: rgb(22 28 45 / var(--tw-text-opacity))
}

:is(.dark #topnav.scroll .navigation-menu > li > a) {
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity))
}

#topnav.scroll .navigation-menu>li>.menu-arrow {
    --tw-border-opacity: 1;
    border-color: rgb(22 28 45 / var(--tw-border-opacity))
}

:is(.dark #topnav.scroll .navigation-menu > li > .menu-arrow) {
    --tw-border-opacity: 1;
    border-color: rgb(255 255 255 / var(--tw-border-opacity))
}

#topnav.scroll .navigation-menu>li.active>a,
#topnav.scroll .navigation-menu>li:hover>a {
    --tw-text-opacity: 1;
    color: rgb(34 197 94 / var(--tw-text-opacity))
}

#topnav.scroll .navigation-menu>li.active>.menu-arrow,
#topnav.scroll .navigation-menu>li:hover>.menu-arrow {
    --tw-border-opacity: 1;
    border-color: rgb(34 197 94 / var(--tw-border-opacity))
}

:is(.dark #topnav.scroll .navigation-menu > li.active > .menu-arrow),
:is(.dark #topnav.scroll .navigation-menu > li:hover > .menu-arrow) {
    --tw-border-opacity: 1;
    border-color: rgb(34 197 94 / var(--tw-border-opacity))
}

#topnav.defaultscroll.dark-menubar .logo {
    line-height: 70px
}

#topnav.defaultscroll.scroll .logo {
    line-height: 62px
}

#topnav.nav-sticky {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity));
    --tw-shadow: 0 0 3px rgb(60 72 88 / 0.15);
    --tw-shadow-colored: 0 0 3px var(--tw-shadow-color);
    -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

:is(.dark #topnav.nav-sticky) {
    --tw-bg-opacity: 1;
    background-color: rgb(15 23 42 / var(--tw-bg-opacity));
    --tw-shadow-color: #1f2937;
    --tw-shadow: var(--tw-shadow-colored)
}

#topnav.nav-sticky .navigation-menu.nav-light>li>a {
    --tw-text-opacity: 1 !important;
    color: rgb(22 28 45 / var(--tw-text-opacity)) !important
}

:is(.dark #topnav.nav-sticky .navigation-menu.nav-light > li > a) {
    --tw-text-opacity: 1 !important;
    color: rgb(255 255 255 / var(--tw-text-opacity)) !important
}

#topnav.nav-sticky .navigation-menu.nav-light>li.active>a {
    --tw-text-opacity: 1 !important;
    color: rgb(34 197 94 / var(--tw-text-opacity)) !important
}

:is(.dark #topnav.nav-sticky .navigation-menu.nav-light > li.active > a) {
    --tw-text-opacity: 1 !important;
    color: rgb(34 197 94 / var(--tw-text-opacity)) !important
}

#topnav.nav-sticky .navigation-menu.nav-light>li.active>.menu-arrow,
#topnav.nav-sticky .navigation-menu.nav-light>li:hover>.menu-arrow {
    --tw-border-opacity: 1 !important;
    border-color: rgb(34 197 94 / var(--tw-border-opacity)) !important
}

#topnav.nav-sticky .navigation-menu.nav-light>li.active>a,
#topnav.nav-sticky .navigation-menu.nav-light>li:hover>a {
    --tw-text-opacity: 1 !important;
    color: rgb(34 197 94 / var(--tw-text-opacity)) !important
}

:is(.dark #topnav.nav-sticky .navigation-menu.nav-light > li.active > a),
:is(.dark #topnav.nav-sticky .navigation-menu.nav-light > li:hover > a) {
    --tw-text-opacity: 1 !important;
    color: rgb(34 197 94 / var(--tw-text-opacity)) !important
}

#topnav.nav-sticky .navigation-menu.nav-light .has-submenu .menu-arrow {
    --tw-border-opacity: 1;
    border-color: rgb(22 28 45 / var(--tw-border-opacity))
}

:is(.dark #topnav.nav-sticky .navigation-menu.nav-light .has-submenu .menu-arrow) {
    --tw-border-opacity: 1;
    border-color: rgb(255 255 255 / var(--tw-border-opacity))
}

#topnav.nav-sticky.tagline-height {
    top: 0 !important
}

#topnav.nav-sticky .buy-button .btn-icon-dark,
#topnav.nav-sticky .buy-button .login-btn-primary {
    display: inline-block
}

#topnav.nav-sticky .buy-button .btn-icon-light,
#topnav.nav-sticky .buy-button .login-btn-light {
    display: none
}

#topnav.nav-sticky .logo .l-dark {
    display: inline-block
}

#topnav.nav-sticky .logo .l-light {
    display: none
}

.logo {
    -webkit-margin-end: 15px;
    margin-inline-end: 15px;
    -webkit-padding-end: 15px;
    padding-inline-end: 15px;
    padding-top: 0;
    padding-bottom: 0;
    font-size: 24px;
    font-weight: 700;
    line-height: 68px;
    letter-spacing: 1px
}

@media (min-width:1025px) {
    #topnav .navigation-menu>li .submenu.megamenu {
        width: 1120px !important
    }
}

@media screen and (max-width:1024px) and (min-width:992px) {
    #topnav .navigation-menu>li .submenu.megamenu {
        width: 936px !important
    }
}

@media (min-width:992px) {
    #topnav .navigation-menu {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }

    #topnav .navigation-menu.justify-end li:last-child {
        -webkit-margin-end: 0;
        margin-inline-end: 0
    }

    #topnav .navigation-menu.justify-end li:last-child .sub-menu-item {
        -webkit-padding-end: 0px !important;
        padding-inline-end: 0px !important
    }

    #topnav .navigation-menu.justify-start>li:first-child {
        -webkit-margin-start: 0px;
        margin-inline-start: 0
    }

    #topnav .navigation-menu.justify-start>li:first-child .sub-menu-item {
        -webkit-padding-start: 0px !important;
        padding-inline-start: 0px !important
    }

    #topnav .navigation-menu>.has-submenu:hover .menu-arrow {
        top: 34px !important
    }

    #topnav .navigation-menu>.has-submenu.active .menu-arrow {
        top: 2rem
    }

    #topnav .navigation-menu>li .submenu {
        -webkit-transition: .2s;
        transition: .2s;
        visibility: hidden;
        position: absolute;
        top: 100%;
        inset-inline-start: 0px;
        z-index: 1000;
        margin-top: 10px;
        min-width: 180px;
        list-style-type: none;
        border-radius: .375rem;
        --tw-bg-opacity: 1;
        background-color: rgb(255 255 255 / var(--tw-bg-opacity));
        padding: 15px 0;
        opacity: 0;
        --tw-shadow: 0 0 3px rgb(60 72 88 / 0.15);
        --tw-shadow-colored: 0 0 3px var(--tw-shadow-color);
        -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
        box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
    }

    :is(.dark #topnav .navigation-menu > li .submenu) {
        --tw-bg-opacity: 1;
        background-color: rgb(15 23 42 / var(--tw-bg-opacity));
        --tw-shadow-color: #1f2937;
        --tw-shadow: var(--tw-shadow-colored)
    }

    #topnav .navigation-menu>li .submenu li {
        position: relative
    }

    #topnav .navigation-menu>li .submenu li a {
        -webkit-transition: .3s;
        transition: .3s;
        clear: both;
        display: block;
        white-space: nowrap;
        padding: 10px 1.25rem;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        line-height: 17px;
        letter-spacing: .04em;
        --tw-text-opacity: 1;
        color: rgb(22 28 45 / var(--tw-text-opacity))
    }

    :is(.dark #topnav .navigation-menu > li .submenu li a) {
        --tw-text-opacity: 1;
        color: rgb(255 255 255 / var(--tw-text-opacity))
    }

    #topnav .navigation-menu>li .submenu li a:hover {
        --tw-text-opacity: 1 !important;
        color: rgb(34 197 94 / var(--tw-text-opacity)) !important
    }

    :is(.dark #topnav .navigation-menu > li .submenu li a:hover) {
        --tw-text-opacity: 1 !important;
        color: rgb(34 197 94 / var(--tw-text-opacity)) !important
    }

    #topnav .navigation-menu>li .submenu li ul {
        margin: 0;
        list-style-type: none;
        -webkit-padding-start: 0px;
        padding-inline-start: 0px
    }

    #topnav .navigation-menu>li .submenu.megamenu {
        position: fixed;
        inset-inline-start: 50%;
        top: auto;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        white-space: nowrap
    }

    :is([dir=ltr] #topnav .navigation-menu > li .submenu.megamenu) {
        --tw-translate-x: -50%;
        -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
    }

    :is([dir=rtl] #topnav .navigation-menu > li .submenu.megamenu) {
        --tw-translate-x: 50%;
        -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
    }

    #topnav .navigation-menu>li .submenu.megamenu>li {
        width: 20%;
        overflow: hidden;
        vertical-align: top
    }

    #topnav .navigation-menu>li .submenu.megamenu>li .submenu {
        inset-inline-start: 100%;
        top: 0;
        -webkit-margin-start: 10px;
        margin-inline-start: 10px;
        margin-top: -1px
    }

    #topnav .navigation-menu>li .submenu>li .submenu {
        inset-inline-start: 101%;
        top: 0;
        -webkit-margin-start: 10px;
        margin-inline-start: 10px;
        margin-top: -1px
    }

    #topnav .navigation-menu>li>a {
        min-height: 62px;
        padding-top: 25px;
        padding-bottom: 25px
    }

    #topnav .navigation-menu>li:hover>.menu-arrow {
        --tw-border-opacity: 1;
        border-color: rgb(34 197 94 / var(--tw-border-opacity))
    }

    :is(.dark #topnav .navigation-menu > li:hover > .menu-arrow) {
        --tw-border-opacity: 1;
        border-color: rgb(34 197 94 / var(--tw-border-opacity))
    }

    #topnav .navigation-menu>li.active>a,
    #topnav .navigation-menu>li:hover>a {
        --tw-text-opacity: 1 !important;
        color: rgb(34 197 94 / var(--tw-text-opacity)) !important
    }

    :is(.dark #topnav .navigation-menu > li.active > a),
    :is(.dark #topnav .navigation-menu > li:hover > a) {
        --tw-text-opacity: 1 !important;
        color: rgb(34 197 94 / var(--tw-text-opacity)) !important
    }

    #topnav .navigation-menu>li.last-elements .submenu {
        inset-inline-start: auto;
        inset-inline-end: 0px
    }

    #topnav .navigation-menu>li.last-elements .submenu::before {
        inset-inline-start: auto;
        content: var(--tw-content);
        inset-inline-end: 10px
    }

    #topnav .navigation-menu>li.last-elements .submenu>li.has-submenu .submenu {
        inset-inline-start: auto;
        inset-inline-end: 100%;
        -webkit-margin-start: 0px;
        margin-inline-start: 0;
        -webkit-margin-end: 10px;
        margin-inline-end: 10px
    }

    #topnav .navigation-menu.nav-light>li>a {
        color: rgb(255 255 255 / .5) !important
    }

    #topnav .navigation-menu.nav-light>li.active>a {
        --tw-text-opacity: 1 !important;
        color: rgb(255 255 255 / var(--tw-text-opacity)) !important
    }

    #topnav .navigation-menu.nav-light>li:hover>.menu-arrow {
        --tw-border-opacity: 1 !important;
        border-color: rgb(255 255 255 / var(--tw-border-opacity)) !important
    }

    #topnav .navigation-menu.nav-light>li:hover>a {
        --tw-text-opacity: 1 !important;
        color: rgb(255 255 255 / var(--tw-text-opacity)) !important
    }

    #topnav .navigation-menu.nav-light .has-submenu .menu-arrow {
        border-color: rgb(255 255 255 / .5)
    }

    #topnav .navigation-menu.nav-light .has-submenu.active .menu-arrow {
        --tw-border-opacity: 1 !important;
        border-color: rgb(255 255 255 / var(--tw-border-opacity)) !important
    }

    #topnav .buy-button {
        -webkit-margin-start: 15px;
        margin-inline-start: 15px;
        -webkit-padding-start: 15px;
        padding-inline-start: 15px
    }

    #topnav .navbar-toggle {
        display: none
    }

    #topnav #navigation {
        display: block !important
    }

    #topnav.scroll {
        top: 0
    }

    #topnav.scroll .navigation-menu>li>a {
        padding-top: 1.25rem;
        padding-bottom: 1.25rem
    }

    #topnav.scroll-active .navigation-menu>li>a {
        padding-top: 25px;
        padding-bottom: 25px
    }
}

@media (max-width:991px) {
    #topnav {
        min-height: 74px;
        --tw-bg-opacity: 1;
        background-color: rgb(255 255 255 / var(--tw-bg-opacity));
        --tw-shadow: 0 0 3px rgb(60 72 88 / 0.15);
        --tw-shadow-colored: 0 0 3px var(--tw-shadow-color);
        -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
        box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
    }

    :is(.dark #topnav) {
        --tw-bg-opacity: 1;
        background-color: rgb(15 23 42 / var(--tw-bg-opacity));
        --tw-shadow-color: #1f2937;
        --tw-shadow: var(--tw-shadow-colored)
    }

    #topnav .logo .l-dark {
        display: inline-block !important
    }

    #topnav .logo .l-light {
        display: none !important
    }

    #topnav .container {
        width: auto
    }

    #topnav #navigation {
        max-height: 400px;
        --tw-shadow: 0 0 3px rgb(60 72 88 / 0.15);
        --tw-shadow-colored: 0 0 3px var(--tw-shadow-color);
        -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
        box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
    }

    #topnav .navigation-menu,
    #topnav .navigation-menu>li {
        float: none !important
    }

    #topnav .navigation-menu>li .submenu {
        margin: 0;
        display: none;
        list-style-type: none;
        -webkit-padding-start: 1.25rem;
        padding-inline-start: 1.25rem
    }

    #topnav .navigation-menu>li .submenu li a {
        -webkit-transition: .3s;
        transition: .3s;
        position: relative !important;
        display: block !important;
        padding: 7px 15px !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        text-transform: uppercase !important;
        letter-spacing: .04em !important;
        --tw-text-opacity: 1 !important;
        color: rgb(22 28 45 / var(--tw-text-opacity)) !important
    }

    :is(.dark #topnav .navigation-menu > li .submenu li a) {
        --tw-text-opacity: 1 !important;
        color: rgb(255 255 255 / var(--tw-text-opacity)) !important
    }

    #topnav .navigation-menu>li .submenu.megamenu li .megamenu-head {
        padding: 7px 15px
    }

    #topnav .navigation-menu>li .submenu.megamenu>li>ul {
        list-style-type: none;
        -webkit-padding-start: 0px;
        padding-inline-start: 0px
    }

    #topnav .navigation-menu>li .submenu.megamenu>li>ul>li>span {
        position: relative;
        display: block;
        padding: 10px 15px;
        font-size: .75rem;
        line-height: 1rem;
        text-transform: uppercase;
        letter-spacing: 2px;
        --tw-text-opacity: 1;
        color: rgb(226 232 240 / var(--tw-text-opacity))
    }

    #topnav .navigation-menu>li .submenu.open {
        display: block
    }

    #topnav .navigation-menu>li .submenu .submenu {
        display: none;
        list-style-type: none
    }

    #topnav .navigation-menu>li .submenu .submenu.open {
        display: block
    }

    #topnav .navigation-menu>li>a {
        padding: 10px 20px;
        --tw-text-opacity: 1;
        color: rgb(22 28 45 / var(--tw-text-opacity))
    }

    #topnav .navigation-menu>li>a::after {
        position: absolute;
        content: var(--tw-content);
        inset-inline-end: 15px
    }

    :is(.dark #topnav .navigation-menu > li > a) {
        --tw-text-opacity: 1;
        color: rgb(255 255 255 / var(--tw-text-opacity))
    }

    #topnav .navigation-menu>li .submenu li a:hover,
    #topnav .navigation-menu>li.has-submenu.open>a,
    #topnav .navigation-menu>li>a:hover {
        --tw-text-opacity: 1;
        color: rgb(34 197 94 / var(--tw-text-opacity))
    }

    #topnav .menu-extras .menu-item {
        --tw-border-opacity: 1;
        border-color: rgb(229 231 235 / var(--tw-border-opacity))
    }

    :is(.dark #topnav .menu-extras .menu-item) {
        --tw-border-opacity: 1;
        border-color: rgb(55 65 81 / var(--tw-border-opacity))
    }

    :is([dir=ltr] #topnav .navbar-header) {
        float: left
    }

    :is([dir=rtl] #topnav .navbar-header) {
        float: right
    }

    #topnav .buy-button .btn-icon-dark,
    #topnav .buy-button .login-btn-primary {
        display: inline-block !important
    }

    #topnav .buy-button .btn-icon-light,
    #topnav .buy-button .login-btn-light {
        display: none
    }

    #topnav .has-submenu .submenu .submenu-arrow {
        position: absolute;
        inset-inline-end: 1.25rem;
        top: .75rem;
        --tw-rotate: 45deg;
        -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
    }

    #topnav .has-submenu.active a {
        --tw-text-opacity: 1;
        color: rgb(34 197 94 / var(--tw-text-opacity))
    }

    #navigation {
        position: absolute;
        top: 74px;
        inset-inline-start: 0px;
        display: none;
        height: auto;
        width: 100%;
        overflow: auto;
        --tw-bg-opacity: 1;
        background-color: rgb(255 255 255 / var(--tw-bg-opacity))
    }

    :is(.dark #navigation) {
        --tw-bg-opacity: 1;
        background-color: rgb(15 23 42 / var(--tw-bg-opacity))
    }

    #navigation.open {
        display: block;
        overflow-y: auto
    }
}

@media (max-width:768px) {
    #topnav .navigation-menu .has-submenu .menu-arrow {
        inset-inline-end: 0.5rem;
        top: 1rem
    }
}

@media (min-width:768px) {
    #topnav .navigation-menu>li.has-submenu:hover>.submenu {
        visibility: visible;
        margin-top: 0;
        opacity: 1
    }

    #topnav .navigation-menu>li.has-submenu:hover>.submenu>li.has-submenu:hover>.submenu,
    #topnav .navigation-menu>li.has-submenu:hover>.submenu>li.has-submenu:hover>.submenu>li:hover>.submenu {
        visibility: visible;
        -webkit-margin-start: 0px;
        margin-inline-start: 0;
        opacity: 1
    }

    .navbar-toggle {
        display: block
    }
}

@media (max-width:425px) {
    #topnav .buy-menu-btn {
        margin: 0 10px !important;
        display: block !important;
        padding: 10px 1.25rem !important
    }

    #topnav .buy-menu-btn .dropdown .dropdown-menu.show {
        -webkit-transform: translate3d(0, -54px, 0) !important;
        transform: translate3d(0, -54px, 0) !important
    }
}

.spa-css #topnav .navigation-menu>li>a {
    padding-left: 12px !important;
    padding-right: 12px !important;
    font-size: 14px !important;
    font-weight: 500 !important
}

.spa-css #topnav .navigation-menu>li .submenu li a {
    font-size: 12px !important;
    font-weight: 500 !important
}

.spa-css #topnav .navigation-menu>li .submenu.megamenu li .megamenu-head {
    font-weight: 500 !important
}

.container {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding-right: 12px;
    padding-left: 12px
}

@media (min-width:540px) {
    .container {
        max-width: 540px
    }
}

@media (min-width:640px) {
    .container {
        max-width: 640px;
        padding-right: 1rem;
        padding-left: 1rem
    }
}

@media (min-width:768px) {
    .container {
        max-width: 730px
    }
}

@media (min-width:1024px) {
    .container {
        max-width: 1024px;
        padding-right: 24px;
        padding-left: 24px
    }
}

@media (min-width:1280px) {
    .container {
        max-width: 1280px;
        padding-right: 2rem;
        padding-left: 2rem
    }
}
 
@media (min-width:1536px) {
    .container {
        max-width: 1536px;
        padding-right: 2px;
        padding-left: 2px
    }
}

.container-filter li.active,
.container-filter li:hover {
    --tw-text-opacity: 1 !important;
    color: rgb(15 23 42 / var(--tw-text-opacity)) !important
}

:is(.dark .container-filter li.active),
:is(.dark .container-filter li:hover) {
    --tw-text-opacity: 1 !important;
    color: rgb(255 255 255 / var(--tw-text-opacity)) !important
}

.container-filter-box li.active,
.container-filter-box li:hover {
    --tw-border-opacity: 1 !important;
    border-color: rgb(34 197 94 / var(--tw-border-opacity)) !important;
    --tw-text-opacity: 1 !important;
    color: rgb(34 197 94 / var(--tw-text-opacity)) !important
}

.container-filter-border-bottom li.active,
.container-filter-border-bottom li:hover {
    --tw-border-opacity: 1 !important;
    border-bottom-color: rgb(15 23 42 / var(--tw-border-opacity)) !important;
    --tw-text-opacity: 1 !important;
    color: rgb(15 23 42 / var(--tw-text-opacity)) !important
}

:is(.dark .container-filter-border-bottom li.active),
:is(.dark .container-filter-border-bottom li:hover) {
    --tw-border-opacity: 1 !important;
    border-bottom-color: rgb(255 255 255 / var(--tw-border-opacity)) !important;
    --tw-text-opacity: 1 !important;
    color: rgb(255 255 255 / var(--tw-text-opacity)) !important
}

.container-filter-white li.active,
.container-filter-white li:hover {
    --tw-border-opacity: 1 !important;
    border-bottom-color: rgb(255 255 255 / var(--tw-border-opacity)) !important;
    --tw-text-opacity: 1 !important;
    color: rgb(255 255 255 / var(--tw-text-opacity)) !important
}

.container-creative li::after {
    position: absolute;
    inset-inline-end: 0px;
    inset-inline-start: 0px;
    bottom: 5px;
    height: 0;
    width: 0;
    border-radius: .375rem;
    background-color: rgb(34 197 94 / .4);
    -webkit-transition-duration: .5s;
    transition-duration: .5s;
    -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    --tw-content: "";
    content: var(--tw-content)
}

.container-creative li.active,
.container-creative li:hover {
    --tw-text-opacity: 1 !important;
    color: rgb(22 28 45 / var(--tw-text-opacity)) !important
}

.container-creative li.active::after,
.container-creative li:hover::after {
    inset-inline-end: auto !important;
    inset-inline-start: 0px !important;
    top: 60% !important;
    height: 5px !important;
    content: var(--tw-content) !important;
    width: 100% !important
}

:is(.dark .container-creative li.active),
:is(.dark .container-creative li:hover) {
    --tw-text-opacity: 1 !important;
    color: rgb(255 255 255 / var(--tw-text-opacity)) !important
}


@media (min-width:1024px) {
    .lg\:container {
        width: 100%;
        margin-right: auto;
        margin-left: auto;
        padding-right: 12px;
        padding-left: 12px
    }

    @media (min-width:540px) {
        .lg\:container {
            max-width: 540px
        }
    }

    @media (min-width:640px) {
        .lg\:container {
            max-width: 640px;
            padding-right: 1rem;
            padding-left: 1rem
        }
    }

    @media (min-width:768px) {
        .lg\:container {
            max-width: 768px
        }
    }

    @media (min-width:1024px) {
        .lg\:container {
            max-width: 1024px;
            padding-right: 45px;
            padding-left: 45px
        }
    }

    @media (min-width:1280px) {
        .lg\:container {
            max-width: 1280px;
            padding-right: 5rem;
            padding-left: 5rem
        }
    }

    @media (min-width:1536px) {
        .lg\:container {
            max-width: 1536px;
            padding-right: 13rem;
            padding-left: 13rem
        }
    }
}

.qs-datepicker-container {
    border-color: inherit;
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity))
}

:is(.dark .qs-datepicker-container) {
    --tw-border-opacity: 1;
    border-color: rgb(31 41 55 / var(--tw-border-opacity));
    --tw-bg-opacity: 1;
    background-color: rgb(15 23 42 / var(--tw-bg-opacity))
}

.qs-datepicker-container .qs-controls {
    --tw-bg-opacity: 1;
    background-color: rgb(249 250 251 / var(--tw-bg-opacity))
}

:is(.dark .qs-datepicker-container .qs-controls) {
    --tw-bg-opacity: 1;
    background-color: rgb(30 41 59 / var(--tw-bg-opacity))
}

.qs-datepicker-container .qs-controls .qs-month-year {
    font-size: 15px;
    font-weight: 600
}

:is(.dark .qs-datepicker-container .qs-controls .qs-month-year) {
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity))
}

.qs-datepicker-container .qs-controls .qs-month-year:hover {
    border-radius: .375rem;
    border-bottom-width: 1px;
    border-color: inherit;
    outline-color: inherit
}

.font-cursive-alex {
    font-family: "Alex Brush", cursive !important
}

.font-cursive-kaushan {
    font-family: "Kaushan Script", cursive !important
}

.font-head-ebgaramond {
    font-family: "EB Garamond", serif !important
}

.font-nunito {
    font-family: Nunito, sans-serif !important
}

.text-2xl {
    font-size: 1.5rem !important;
    line-height: 2rem !important
}

.text-3xl {
    font-size: 1.875rem !important;
    line-height: 2.25rem !important
}

.text-4xl {
    font-size: 2.25rem !important;
    line-height: 2.5rem !important
}

.text-5xl {
    font-size: 3rem !important;
    line-height: 1 !important
}

.text-6xl {
    font-size: 3.75rem !important;
    line-height: 1 !important
}

.text-7xl {
    font-size: 4.5rem !important;
    line-height: 1 !important
}

.text-8xl {
    font-size: 6rem !important;
    line-height: 1 !important
}

.text-9xl {
    font-size: 8rem !important;
    line-height: 1 !important
}

.text-\[10px\] {
    font-size: 10px !important
}

.text-\[12px\] {
    font-size: 12px !important
}

.text-\[13px\] {
    font-size: 13px !important
}

.text-\[14px\] {
    font-size: 14px !important
}

.text-\[15px\] {
    font-size: 15px !important
}

.text-\[16px\] {
    font-size: 16px !important
}

.text-\[18px\] {
    font-size: 18px !important
}

.text-\[20px\] {
    font-size: 20px !important
}

.text-\[22px\] {
    font-size: 22px !important
}

.text-\[26px\] {
    font-size: 26px !important
}

.text-\[28px\] {
    font-size: 28px !important
}

.text-\[30px\] {
    font-size: 30px !important
}

.text-\[40px\] {
    font-size: 40px !important
}

.text-\[45px\] {
    font-size: 45px !important
}

.text-\[48px\] {
    font-size: 48px !important
}

.text-\[50px\] {
    font-size: 50px !important
}

.text-\[56px\] {
    font-size: 56px !important
}

.text-base {
    font-size: 1rem !important;
    line-height: 1.5rem !important
}

.text-lg {
    font-size: 1.125rem !important;
    line-height: 1.75rem !important
}

.text-sm {
    font-size: .875rem !important;
    line-height: 1.25rem !important
}

.text-xl {
    font-size: 1.25rem !important;
    line-height: 1.75rem !important
}

.text-xs {
    font-size: .75rem !important;
    line-height: 1rem !important
}

.font-bold {
    font-weight: 700 !important
}

.font-extrabold {
    font-weight: 800 !important
}

.font-extralight {
    font-weight: 200 !important
}

.font-light {
    font-weight: 300 !important
}

.font-medium {
    font-weight: 500 !important
}

.font-normal {
    font-weight: 400 !important
}

.font-semibold {
    font-weight: 600 !important
}

.font-thin {
    font-weight: 100 !important
}

.uppercase {
    text-transform: uppercase !important
}

.italic {
    font-style: italic !important
}

.tabular-nums {
    --tw-numeric-spacing: tabular-nums !important;
    font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction) !important
}

.bg-dark-footer {
    --tw-bg-opacity: 1 !important;
    background-color: rgb(25 33 50 / var(--tw-bg-opacity)) !important
}

.text-dark-footer {
    --tw-text-opacity: 1 !important;
    color: rgb(25 33 50 / var(--tw-text-opacity)) !important
}

:is(.dark .dark\:bg-dark-footer) {
    --tw-bg-opacity: 1 !important;
    background-color: rgb(25 33 50 / var(--tw-bg-opacity)) !important
}

.swiper-slider-hero .swiper-container .swiper-button-next:before,
.swiper-slider-hero .swiper-container .swiper-button-prev:before {
    font-family: "Material Design Icons"
}

.swiper-slider-hero .swiper-container .swiper-button-prev:before {
    content: "󰅁"
}

.swiper-slider-hero .swiper-container .swiper-button-next:before {
    content: "󰅂"
}

.swiper-slider-hero .swiper-pagination-bullet {
    background-color: transparent;
    --tw-text-opacity: 1;
    color: rgb(249 250 251 / var(--tw-text-opacity))
}

.swiper-slider-hero .swiper-pagination-bullet-active {
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity))
}

.swiper-slider-hero .swiper-container-horizontal>.swiper-pagination-bullets,
.swiper-slider-hero .swiper-pagination-custom,
.swiper-slider-hero .swiper-pagination-fraction {
    bottom: 45px
}

.swiper-slider-hero .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 13px
}

.tns-nav {
    margin-top: .75rem;
    text-align: center
}

.tns-nav button {
    margin: .25rem;
    border-radius: 3px;
    border-width: 0;
    background-color: rgb(34 197 94 / .3);
    padding: 5px;
    -webkit-transition-duration: .5s;
    transition-duration: .5s
}

.tns-nav button.tns-nav-active {
    --tw-rotate: 45deg;
    -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    --tw-bg-opacity: 1;
    background-color: rgb(34 197 94 / var(--tw-bg-opacity))
}

.tns-controls button[data-controls=next],
.tns-controls button[data-controls=prev] {
    position: absolute;
    top: 50%;
    z-index: 10;
    height: 2rem;
    width: 2rem;
    --tw-translate-y: -50%;
    -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    border-radius: 9999px;
    border-width: 0;
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity));
    font-size: 1rem;
    line-height: 1.5rem;
    --tw-text-opacity: 1;
    color: rgb(60 72 88 / var(--tw-text-opacity));
    --tw-shadow: 0 5px 13px rgb(60 72 88 / 0.20);
    --tw-shadow-colored: 0 5px 13px var(--tw-shadow-color);
    -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    -webkit-transition-duration: .5s;
    transition-duration: .5s
}

:is(.dark .tns-controls button[data-controls=next]),
:is(.dark .tns-controls button[data-controls=prev]) {
    --tw-bg-opacity: 1;
    background-color: rgb(15 23 42 / var(--tw-bg-opacity));
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity));
    --tw-shadow-color: #1f2937;
    --tw-shadow: var(--tw-shadow-colored)
}

.tns-controls button[data-controls=next]:hover,
.tns-controls button[data-controls=prev]:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(34 197 94 / var(--tw-bg-opacity));
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity))
}

.tns-controls button[data-controls=prev] {
    inset-inline-start: 0px
}

.tns-controls button[data-controls=next] {
    inset-inline-end: 0px
}