@import url("../../_globals/css/style.min.css");

/*------------------------------------------------------------
    TABLE OF CONTENTS
--------------------------------------------------------------

    GENERAL
        -- VARIABLES
        -- GLOBAL STYLES
        -- TYPOGRAPHY
    ELEMENTS
        -- FORMS & INPUT
        -- DROPDOWNS
        -- ACCORDIONS
        -- PAYMENT METHODS
        -- TRUST LOGOS
        -- GOOGLE TRANSLATE
        -- SIDEBAR
    TEMPLATE
        -- TEMPLATE SKIP NAVIGATION
        -- TEMPLATE PROMOTIONS
        -- TEMPLATE HEADER
        -- TEMPLATE PANE
        -- TEMPLATE BODY
        -- TEMPLATE PAGE HEADER
        -- TEMPLATE BREADCRUMBS
        -- TEMPLATE SUBFOOTER
        -- TEMPLATE FOOTER
        -- TEMPLATE COOKIE POLICY
    PAGE CONTENT
        -- LOGIN
        -- MY ACCOUNT
        -- HERO
        -- HOMEPAGE
        -- EVENTS
        -- WHERE TO FIND
        -- CONTACT
        -- PRODUCT / PRICE
        -- PRODUCT / RATING
        -- PRODUCT / QUANTITY INPUT
        -- PRODUCT LIST
        -- PRODUCT DETAILS
        -- CART
        -- CHECKOUT
        -- BLOG LIST
        -- BLOG SINGLE POST
        -- COMMENTS


------------------------------------------------------------*/

/*------------------------------------------------------------
    -- VARIABLES
------------------------------------------------------------*/

:root {
    /* Font families */
    --font-header: "Montserrat";
    --font-body: "Lora";
    --font-code: "Source Code Pro";
    /* HSL Variants */
    --lightest: 12.5%;
    --lighter: 25%;
    --light: 37.5%;
    --dark: 12.5%;
    --darker: 24%;
    --darkest: 36.5%;
    /* Colors */
    --custom-1-h: 36;
    --custom-1-s: 96%;
    --custom-1-l: 62%;
    --custom-1: hsl(var(--custom-1-h), var(--custom-1-s), var(--custom-1-l));
    --custom-1-light: hsl(
        var(--custom-1-h),
        var(--custom-1-s),
        calc(var(--custom-1-l) + var(--lightest))
    );
    --custom-1-lighter: hsl(
        var(--custom-1-h),
        var(--custom-1-s),
        calc(var(--custom-1-l) + var(--lighter))
    );
    --custom-1-lightest: hsl(
        var(--custom-1-h),
        var(--custom-1-s),
        calc(var(--custom-1-l) + var(--light))
    );
    --custom-1-dark: hsl(
        var(--custom-1-h),
        var(--custom-1-s),
        calc(var(--custom-1-l) - var(--dark))
    );
    --custom-1-darker: hsl(
        var(--custom-1-h),
        var(--custom-1-s),
        calc(var(--custom-1-l) - var(--darker))
    );
    --custom-1-darkest: hsl(
        var(--custom-1-h),
        var(--custom-1-s),
        calc(var(--custom-1-l) - var(--darkest))
    );
    --custom-1-50: hsl(
        var(--custom-1-h),
        var(--custom-1-s),
        var(--custom-1-l),
        50%
    );
    --custom-1-75: hsl(
        var(--custom-1-h),
        var(--custom-1-s),
        var(--custom-1-l),
        75%
    );
    --custom-2-h: 352;
    --custom-2-s: 96%;
    --custom-2-l: 65%;
    --custom-2: hsl(var(--custom-2-h), var(--custom-2-s), var(--custom-2-l));
    --custom-2-light: hsl(
        var(--custom-2-h),
        var(--custom-2-s),
        calc(var(--custom-2-l) + var(--lightest))
    );
    --custom-2-lighter: hsl(
        var(--custom-2-h),
        var(--custom-2-s),
        calc(var(--custom-2-l) + var(--lighter))
    );
    --custom-2-lightest: hsl(
        var(--custom-2-h),
        var(--custom-2-s),
        calc(var(--custom-2-l) + var(--light))
    );
    --custom-2-dark: hsl(
        var(--custom-2-h),
        var(--custom-2-s),
        calc(var(--custom-2-l) - var(--dark))
    );
    --custom-2-darker: hsl(
        var(--custom-2-h),
        var(--custom-2-s),
        calc(var(--custom-2-l) - var(--darker))
    );
    --custom-2-darkest: hsl(
        var(--custom-2-h),
        var(--custom-2-s),
        calc(var(--custom-2-l) - var(--darkest))
    );
    --custom-2-50: hsl(
        var(--custom-2-h),
        var(--custom-2-s),
        var(--custom-2-l),
        50%
    );
    --custom-2-75: hsl(
        var(--custom-2-h),
        var(--custom-2-s),
        var(--custom-2-l),
        75%
    );
    --bs-primary-h: 217;
    --bs-primary-s: 80%;
    --bs-primary-l: 58%;
    --bs-primary: hsl(
        var(--bs-primary-h),
        var(--bs-primary-s),
        var(--bs-primary-l)
    );
    --bs-primary-light: hsl(
        var(--bs-primary-h),
        var(--bs-primary-s),
        calc(var(--bs-primary-l) + var(--lightest))
    );
    --bs-primary-lighter: hsl(
        var(--bs-primary-h),
        var(--bs-primary-s),
        calc(var(--bs-primary-l) + var(--lighter))
    );
    --bs-primary-lightest: hsl(
        var(--bs-primary-h),
        var(--bs-primary-s),
        calc(var(--bs-primary-l) + var(--light))
    );
    --bs-primary-dark: hsl(
        var(--bs-primary-h),
        var(--bs-primary-s),
        calc(var(--bs-primary-l) - var(--dark))
    );
    --bs-primary-darker: hsl(
        var(--bs-primary-h),
        var(--bs-primary-s),
        calc(var(--bs-primary-l) - var(--darker))
    );
    --bs-primary-darkest: hsl(
        var(--bs-primary-h),
        var(--bs-primary-s),
        calc(var(--bs-primary-l) - var(--darkest))
    );
    --bs-primary-50: hsl(
        var(--bs-primary-h),
        var(--bs-primary-s),
        var(--bs-primary-l),
        50%
    );
    --bs-primary-75: hsl(
        var(--bs-primary-h),
        var(--bs-primary-s),
        var(--bs-primary-l),
        75%
    );
    --bs-secondary-h: 208;
    --bs-secondary-s: 7%;
    --bs-secondary-l: 46%;
    --bs-secondary: hsl(
        var(--bs-secondary-h),
        var(--bs-secondary-s),
        var(--bs-secondary-l)
    );
    --bs-secondary-light: hsl(
        var(--bs-secondary-h),
        var(--bs-secondary-s),
        calc(var(--bs-secondary-l) + var(--lightest))
    );
    --bs-secondary-lighter: hsl(
        var(--bs-secondary-h),
        var(--bs-secondary-s),
        calc(var(--bs-secondary-l) + var(--lighter))
    );
    --bs-secondary-lightest: hsl(
        var(--bs-secondary-h),
        var(--bs-secondary-s),
        calc(var(--bs-secondary-l) + var(--light))
    );
    --bs-secondary-dark: hsl(
        var(--bs-secondary-h),
        var(--bs-secondary-s),
        calc(var(--bs-secondary-l) - var(--dark))
    );
    --bs-secondary-darker: hsl(
        var(--bs-secondary-h),
        var(--bs-secondary-s),
        calc(var(--bs-secondary-l) - var(--darker))
    );
    --bs-secondary-darkest: hsl(
        var(--bs-secondary-h),
        var(--bs-secondary-s),
        calc(var(--bs-secondary-l) - var(--darkest))
    );
    --bs-secondary-50: hsl(
        var(--bs-secondary-h),
        var(--bs-secondary-s),
        var(--bs-secondary-l),
        50%
    );
    --bs-secondary-75: hsl(
        var(--bs-secondary-h),
        var(--bs-secondary-s),
        var(--bs-secondary-l),
        75%
    );
    --bs-success-h: 141;
    --bs-success-s: 48%;
    --bs-success-l: 52%;
    --bs-success: hsl(
        var(--bs-success-h),
        var(--bs-success-s),
        var(--bs-success-l)
    );
    --bs-success-light: hsl(
        var(--bs-success-h),
        var(--bs-success-s),
        calc(var(--bs-success-l) + var(--lightest))
    );
    --bs-success-lighter: hsl(
        var(--bs-success-h),
        var(--bs-success-s),
        calc(var(--bs-success-l) + var(--lighter))
    );
    --bs-success-lightest: hsl(
        var(--bs-success-h),
        var(--bs-success-s),
        calc(var(--bs-success-l) + var(--light))
    );
    --bs-success-dark: hsl(
        var(--bs-success-h),
        var(--bs-success-s),
        calc(var(--bs-success-l) - var(--dark))
    );
    --bs-success-darker: hsl(
        var(--bs-success-h),
        var(--bs-success-s),
        calc(var(--bs-success-l) - var(--darker))
    );
    --bs-success-darkest: hsl(
        var(--bs-success-h),
        var(--bs-success-s),
        calc(var(--bs-success-l) - var(--darkest))
    );
    --bs-success-50: hsl(
        var(--bs-success-h),
        var(--bs-success-s),
        var(--bs-success-l),
        50%
    );
    --bs-success-75: hsl(
        var(--bs-success-h),
        var(--bs-success-s),
        var(--bs-success-l),
        75%
    );
    --bs-success-h: 141;
    --bs-success-s: 48%;
    --bs-success-l: 52%;
    --bs-success: hsl(
        var(--bs-success-h),
        var(--bs-success-s),
        var(--bs-success-l)
    );
    --bs-success-light: hsl(
        var(--bs-success-h),
        var(--bs-success-s),
        calc(var(--bs-success-l) + var(--lightest))
    );
    --bs-success-lighter: hsl(
        var(--bs-success-h),
        var(--bs-success-s),
        calc(var(--bs-success-l) + var(--lighter))
    );
    --bs-success-lightest: hsl(
        var(--bs-success-h),
        var(--bs-success-s),
        calc(var(--bs-success-l) + var(--light))
    );
    --bs-success-dark: hsl(
        var(--bs-success-h),
        var(--bs-success-s),
        calc(var(--bs-success-l) - var(--dark))
    );
    --bs-success-darker: hsl(
        var(--bs-success-h),
        var(--bs-success-s),
        calc(var(--bs-success-l) - var(--darker))
    );
    --bs-success-darkest: hsl(
        var(--bs-success-h),
        var(--bs-success-s),
        calc(var(--bs-success-l) - var(--darkest))
    );
    --bs-success-50: hsl(
        var(--bs-success-h),
        var(--bs-success-s),
        var(--bs-success-l),
        50%
    );
    --bs-success-75: hsl(
        var(--bs-success-h),
        var(--bs-success-s),
        var(--bs-success-l),
        75%
    );
    --bs-info-h: 198;
    --bs-info-s: 74%;
    --bs-info-l: 47%;
    --bs-info: hsl(var(--bs-info-h), var(--bs-info-s), var(--bs-info-l));
    --bs-info-light: hsl(
        var(--bs-info-h),
        var(--bs-info-s),
        calc(var(--bs-info-l) + var(--lightest))
    );
    --bs-info-lighter: hsl(
        var(--bs-info-h),
        var(--bs-info-s),
        calc(var(--bs-info-l) + var(--lighter))
    );
    --bs-info-lightest: hsl(
        var(--bs-info-h),
        var(--bs-info-s),
        calc(var(--bs-info-l) + var(--light))
    );
    --bs-info-dark: hsl(
        var(--bs-info-h),
        var(--bs-info-s),
        calc(var(--bs-info-l) - var(--dark))
    );
    --bs-info-darker: hsl(
        var(--bs-info-h),
        var(--bs-info-s),
        calc(var(--bs-info-l) - var(--darker))
    );
    --bs-info-darkest: hsl(
        var(--bs-info-h),
        var(--bs-info-s),
        calc(var(--bs-info-l) - var(--darkest))
    );
    --bs-info-50: hsl(
        var(--bs-info-h),
        var(--bs-info-s),
        var(--bs-info-l),
        50%
    );
    --bs-info-75: hsl(
        var(--bs-info-h),
        var(--bs-info-s),
        var(--bs-info-l),
        75%
    );
    --bs-warning-h: 35;
    --bs-warning-s: 75%;
    --bs-warning-l: 60%;
    --bs-warning: hsl(
        var(--bs-warning-h),
        var(--bs-warning-s),
        var(--bs-warning-l)
    );
    --bs-warning-light: hsl(
        var(--bs-warning-h),
        var(--bs-warning-s),
        calc(var(--bs-warning-l) + var(--lightest))
    );
    --bs-warning-lighter: hsl(
        var(--bs-warning-h),
        var(--bs-warning-s),
        calc(var(--bs-warning-l) + var(--lighter))
    );
    --bs-warning-lightest: hsl(
        var(--bs-warning-h),
        var(--bs-warning-s),
        calc(var(--bs-warning-l) + var(--light))
    );
    --bs-warning-dark: hsl(
        var(--bs-warning-h),
        var(--bs-warning-s),
        calc(var(--bs-warning-l) - var(--dark))
    );
    --bs-warning-darker: hsl(
        var(--bs-warning-h),
        var(--bs-warning-s),
        calc(var(--bs-warning-l) - var(--darker))
    );
    --bs-warning-darkest: hsl(
        var(--bs-warning-h),
        var(--bs-warning-s),
        calc(var(--bs-warning-l) - var(--darkest))
    );
    --bs-warning-50: hsl(
        var(--bs-warning-h),
        var(--bs-warning-s),
        var(--bs-warning-l),
        50%
    );
    --bs-warning-75: hsl(
        var(--bs-warning-h),
        var(--bs-warning-s),
        var(--bs-warning-l),
        75%
    );
    --bs-danger-h: 2;
    --bs-danger-s: 64%;
    --bs-danger-l: 58%;
    --bs-danger: hsl(
        var(--bs-danger-h),
        var(--bs-danger-s),
        var(--bs-danger-l)
    );
    --bs-danger-light: hsl(
        var(--bs-danger-h),
        var(--bs-danger-s),
        calc(var(--bs-danger-l) + var(--lightest))
    );
    --bs-danger-lighter: hsl(
        var(--bs-danger-h),
        var(--bs-danger-s),
        calc(var(--bs-danger-l) + var(--lighter))
    );
    --bs-danger-lightest: hsl(
        var(--bs-danger-h),
        var(--bs-danger-s),
        calc(var(--bs-danger-l) + var(--light))
    );
    --bs-danger-dark: hsl(
        var(--bs-danger-h),
        var(--bs-danger-s),
        calc(var(--bs-danger-l) - var(--dark))
    );
    --bs-danger-darker: hsl(
        var(--bs-danger-h),
        var(--bs-danger-s),
        calc(var(--bs-danger-l) - var(--darker))
    );
    --bs-danger-darkest: hsl(
        var(--bs-danger-h),
        var(--bs-danger-s),
        calc(var(--bs-danger-l) - var(--darkest))
    );
    --bs-danger-50: hsl(
        var(--bs-danger-h),
        var(--bs-danger-s),
        var(--bs-danger-l),
        50%
    );
    --bs-danger-75: hsl(
        var(--bs-danger-h),
        var(--bs-danger-s),
        var(--bs-danger-l),
        75%
    );
    --bs-dark-h: 0;
    --bs-dark-s: 0%;
    --bs-dark-l: 0%;
    --bs-dark: hsl(var(--bs-dark-h), var(--bs-dark-s), var(--bs-dark-l));
    --bs-dark-light: hsl(
        var(--bs-dark-h),
        var(--bs-dark-s),
        calc(var(--bs-dark-l) + var(--lightest))
    );
    --bs-dark-lighter: hsl(
        var(--bs-dark-h),
        var(--bs-dark-s),
        calc(var(--bs-dark-l) + var(--lighter))
    );
    --bs-dark-lightest: hsl(
        var(--bs-dark-h),
        var(--bs-dark-s),
        calc(var(--bs-dark-l) + var(--light))
    );
    --bs-dark-dark: hsl(
        var(--bs-dark-h),
        var(--bs-dark-s),
        calc(var(--bs-dark-l) - (var(--dark) - 5%))
    );
    --bs-dark-darker: hsl(
        var(--bs-dark-h),
        var(--bs-dark-s),
        calc(var(--bs-dark-l) - (var(--darker) - 10%))
    );
    --bs-dark-darkest: hsl(
        var(--bs-dark-h),
        var(--bs-dark-s),
        calc(var(--bs-dark-l) - (var(--darkest) - 7%))
    );
    --bs-dark-50: hsl(
        var(--bs-dark-h),
        var(--bs-dark-s),
        var(--bs-dark-l),
        50%
    );
    --bs-dark-75: hsl(
        var(--bs-dark-h),
        var(--bs-dark-s),
        var(--bs-dark-l),
        75%
    );
    --bs-light-h: 217;
    --bs-light-s: 50%;
    --bs-light-l: 97%;
    --bs-light: hsl(var(--bs-light-h), var(--bs-light-s), var(--bs-light-l));
    --bs-light-dark: hsl(
        var(--bs-light-h),
        var(--bs-light-s),
        calc(var(--bs-light-l) - var(--dark))
    );
    --bs-light-darker: hsl(
        var(--bs-light-h),
        var(--bs-light-s),
        calc(var(--bs-light-l) - var(--darker))
    );
    --bs-light-darkest: hsl(
        var(--bs-light-h),
        var(--bs-light-s),
        calc(var(--bs-light-l) - var(--darkest))
    );
    --bs-light-50: hsl(
        var(--bs-light-h),
        var(--bs-light-s),
        var(--bs-light-l),
        50%
    );
    --bs-light-75: hsl(
        var(--bs-light-h),
        var(--bs-light-s),
        var(--bs-light-l),
        75%
    );
    --bs-borders: #ced4da;
    --bs-borders-50: rgba(206, 212, 218, 0.5);
    /* Sizes */
    --height-header: 6rem;
    --width-sidebar: 15rem;
    --border-radius-sm: 0.25rem;
    --border-radius-md: 0.5rem;
    --border-radius-lg: 0.75rem;
    --border-radius-xl: 1rem;
}

/*------------------------------------------------------------
    -- GLOBAL STYLES
------------------------------------------------------------*/

* {
    outline: 0 !important;
    font-variant-ligatures: none !important;
}

html {
    font-size: 16px;
}

body {
    color: #606060;
    font-family: var(--font-body);
    font-size: 1rem;
    line-height: 1.5;
    background-color: var(--bs-dark-dark);
}

a {
    transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
}

a:focus-visible,
button:focus-visible,
[role="button"]:focus-visible,
[type="submit"]:focus-visible,
[data-bs-toggle]:focus-visible,
.btn:focus-visible,
.nav-link:focus-visible,
input:not(.form-control):not(.form-select):focus-visible,
select:not(.form-control):not(.form-select):focus-visible,
textarea:not(.form-control):not(.form-select):focus-visible {
    outline: 3px solid darkorange !important;
    transition: none !important;
    -webkit-transition: none !important;
    -moz-transition: none !important;
}

code {
    font-family: var(--font-code);
}

hr.hr-theme {
    height: 3px;
    width: 100%;
    max-width: 20rem;
    background-color: var(--bs-primary);
    opacity: 1;
}

section {
    padding-top: 3rem;
    padding-right: 0;
    padding-bottom: 3rem;
    padding-left: 0;
}

@media (min-width: 992px) {
    section {
        padding-top: 5rem;
        padding-right: 0;
        padding-bottom: 5rem;
        padding-left: 0;
    }
}

.container,
.container-fluid,
.container-lg,
.container-md,
.container-sm,
.container-xl,
.container-xxl {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

.sticky-top {
    top: calc(var(--height-header) + 4rem);
}

/*------------------------------------------------------------
    -- TYPOGRAPHY
------------------------------------------------------------*/

h1,
h2,
h3,
h4 {
    margin-bottom: 0.5em;
    color: var(--bs-dark);
    font-family: var(--font-header);
}

h1 span,
h2 span,
h3 span,
h4 span {
    display: block;
    margin-top: 0.5rem;
    color: var(--custom-2);
    font-size: 1.6rem;
    font-weight: 300;
}

h1 {
    font-size: 1.8rem;
    font-weight: 600;
    line-height: 1.2;
}

@media (min-width: 768px) {
    h1 {
        font-size: 2.2rem;
    }
}

h2 {
    font-size: 1.8rem;
    font-weight: 600;
}

h3 {
    font-size: 1.2rem;
    font-weight: 600;
}

h4 {
    color: var(--custom-2);
    font-size: 1.2rem;
    font-weight: 500;
}

.subheader {
    color: var(--bs-primary);
    font-size: 1rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.2em;
}

.underline {
    position: relative;
    margin-bottom: 3rem;
}

.underline:after {
    content: "";
    position: absolute;
    bottom: calc(-1.5rem + -1px);
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    max-width: 20rem;
    height: 0.2rem;
    background-color: #dfdfdf;
}

/*------------------------------------------------------------
    -- ASPECT RATIOS
------------------------------------------------------------*/

.ratio-1x1 {
    aspect-ratio: 1 / 1;
}

.ratio-3x2 {
    aspect-ratio: 3 / 2;
}

.ratio-4x3 {
    aspect-ratio: 4 / 3;
}

.ratio-16x9 {
    aspect-ratio: 16 / 9;
}

.ratio-2x3 {
    aspect-ratio: 2 / 3;
}

.ratio-3x4 {
    aspect-ratio: 3 / 4;
}

.ratio-9x16 {
    aspect-ratio: 9 / 16;
}

/*------------------------------------------------------------
    -- FORMS & INPUT
------------------------------------------------------------*/

/* Verification code */

.verification-code {
    display: flex;
    justify-content: center;
}

.verification-code input {
    margin: 0 0.5rem;
    width: 5rem;
    height: 5rem;
    font-size: 2rem;
    font-weight: 300;
    text-align: center;
}

.verification-code .form-control.is-invalid,
.verification-code .form-control.is-valid,
.verification-code .was-validated .form-control:invalid,
.verification-code .was-validated .form-control:valid {
    padding: 0.375rem 0.75rem;
    background-image: none !important;
}

.verification-code input::-webkit-outer-spin-button,
.verification-code input::-webkit-inner-spin-button {
    margin: 0;
    text-align: center;
    -webkit-appearance: none;
}

/* Color swatches */

.color-swatches {
    padding-bottom: 2px;
}

.color-swatches .check-swatch,
.color-swatches .check-swatch input,
.color-swatches .check-swatch label {
    position: relative;
    width: 2rem;
    height: 2rem;
}

.color-swatches .check-swatch {
    margin-right: 0.5rem;
}

.color-swatches .check-swatch .badge {
    position: absolute;
    top: -7px;
    right: -7px;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1px 0 0 0;
    width: 1.4rem;
    height: 1.4rem;
    color: var(--bs-yellow);
    font-size: 1rem;
}

.color-swatches .check-swatch input {
    position: absolute;
    top: 0;
    left: 0;
    visibility: hidden;
}

.color-swatches .check-swatch label {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10rem;
    box-shadow: 0 0 0 2px transparent;
    -webkit-box-shadow: 0 0 0 2px transparent;
    -moz-box-shadow: 0 0 0 2px transparent;
    border: 2px solid transparent;
    transition: border 0.2s ease, box-shadow 0.2s ease;
    -webkit-transition: border 0.2s ease, box-shadow 0.2s ease;
    -moz-transition: border 0.2s ease, box-shadow 0.2s ease;
}

.color-swatches .check-swatch input:checked + label {
    box-shadow: 0 0 0 2px #202020;
    -webkit-box-shadow: 0 0 0 2px #202020;
    -moz-box-shadow: 0 0 0 2px #202020;
    border: 2px solid #fff;
}

/*------------------------------------------------------------
    -- DROPDOWNS
------------------------------------------------------------*/

.dropdown-menu .dropdown-item:hover {
    color: var(--bs-primary);
    background-color: inherit;
}

.dropdown-menu .dropdown-item:active,
.dropdown-menu .dropdown-item:focus {
    color: var(--bs-primary);
    background-color: var(--bs-light);
}

.dropdown-menu .dropdown-item.active {
    color: #fff;
    text-decoration: none;
    background-color: var(--bs-primary);
}

/*------------------------------------------------------------
    -- ACCORDIONS
------------------------------------------------------------*/

.accordion-item {
    border-width: 0 0 1px;
}

.accordion-button {
    font-weight: 500;
    line-height: 1.5;
}

.accordion-button:focus {
    /* box-shadow: 0 0 0 0.25rem var(--custom-1-25); */
    box-shadow: none;
    border-color: var(--custom-2);
}

.accordion-button:not(.collapsed) {
    color: var(--custom-2);
    background-color: var(--custom-1-25);
}

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

/*------------------------------------------------------------
    -- PAYMENT METHODS
------------------------------------------------------------*/

.payment-methods {
    display: flex;
    margin: 0 -0.2rem;
}

.payment-methods .method-icon {
    margin: 0 0.2rem;
    height: 2rem;
}

/*------------------------------------------------------------
    -- TRUST LOGOS
------------------------------------------------------------*/

.trust-logos {
    margin-top: 1.5rem;
    text-align: center;
}

.trust-logos .row {
    justify-content: space-around;
}

.trust-logos .seal:hover,
.trust-logos .seal:active,
.trust-logos .seal:focus {
    opacity: 0.7;
}

.trust-logos .seal img {
    width: 100%;
    max-width: 10rem;
}

/*------------------------------------------------------------
    -- GOOGLE TRANSLATE
------------------------------------------------------------*/

body > .skiptranslate,
#google-translate .goog-logo-link {
    display: none !important;
}

#google-translate .skiptranslate {
    margin: 1rem 0;
    color: var(--bs-dark-dark);
}

#google-translate .goog-te-gadget .goog-te-combo {
    margin-top: 1rem;
    padding: 0 1rem;
    width: 100%;
    height: 2.5rem;
    color: #fff;
    border: 0;
    background: var(--bs-dark);
    border-radius: 0.25em;
}

#google-translate .skiptranslate > span {
    display: none;
}

/*------------------------------------------------------------
    -- SIDEBAR
------------------------------------------------------------*/

.sidebar .sidebar-link.active {
    color: #ffff !important;
    background-color: var(--custom-1);
}

.sidebar .sidebar-link:after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    right: -10px;
    height: 50%;
    margin-top: -14px;
    border-top: 14px solid transparent;
    border-bottom: 14px solid transparent;
    border-left: 14px solid var(--custom-1);
    opacity: 0;
    transition: all 0.2s ease;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
}

/*------------------------------------------------------------
    -- TEMPLATE SKIP NAVIGATION
------------------------------------------------------------*/

#template-skip-nav {
    position: fixed;
    z-index: 1036;
    top: -3rem;
    display: flex;
    width: 100%;
}

#template-skip-nav a {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 1rem;
    height: 3rem;
    color: #fff;
    text-align: center;
    background: var(--bs-primary-dark);
    transform: translateY(0%);
    transition: transform 0.3s;
    -webkit-transition: transform 0.3s;
    -moz-transition: transform 0.3s;
}

#template-skip-nav a:focus {
    transform: translateY(100%);
}

/*------------------------------------------------------------
    -- TEMPLATE PROMOTIONS
------------------------------------------------------------*/

.promo-show #template-promotions {
    display: flex;
}

#template-promotions {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1033;
    display: none;
    align-items: center;
    justify-content: center;
    width: 100%;
    overflow: hidden;
    color: #fff;
    background-color: var(--bs-dark);
}

#template-promotions .carousel-item {
    align-items: center;
    justify-content: center;
    height: 3rem;
    background-size: cover;
    background-position: 50%;
    background-color: var(--bs-primary);
}

#template-promotions .carousel-item > a {
    display: block;
    text-align: center;
    text-decoration: none;
}

#template-promotions .carousel-content {
    padding: 0.7em 3rem 0.7rem;
}

#template-promotions .btn-close {
    position: absolute;
    top: 0.75rem;
    right: 1rem;
}

#template-promotions .carousel-control > a:hover,
#template-promotions .carousel-control > a:active,
#template-promotions .carousel-control > a:focus {
    opacity: 1;
}

#template-promotions .carousel-control > a:first-of-type {
    left: 4rem;
}

#template-promotions .carousel-control > a:last-of-type {
    right: 4rem;
}

/* Make the carouel scroll vertically */

#template-promotions .carousel-item-next.carousel-item-start,
#template-promotions .carousel-item-prev.carousel-item-end {
    transform: translate3d(0, 0, 0);
}

#template-promotions .carousel-item-next,
#template-promotions .active.carousel-item-end {
    transform: translate3d(0, 100%, 0);
}

#template-promotions .carousel-item-prev,
#template-promotions .active.carousel-item-start {
    transform: translate3d(0, -100%, 0);
}

/*------------------------------------------------------------
    -- TEMPLATE HEADER
------------------------------------------------------------*/

#template-header {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1031;
    display: flex;
    align-items: center;
    padding: 0 2rem;
    width: 100%;
    min-height: var(--height-header);
    background-color: #ffffff;
    box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.1);
    transition: all 0.2s ease;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
}

@media (min-width: 768px) {
    #template-header {
        padding: 0 4rem;
    }
}

.header-trans #template-header {
    background-color: transparent;
}

.header-trans #template-header.fixed {
    background-color: var(--bs-dark);
}

#template-header .navbar {
    position: initial;
}

@media (max-width: 767px) {
    #template-header .navbar #navbarCollapse {
        position: absolute;
        top: var(--height-header);
        left: 0;
        width: 100%;
        background-color: #fff;
        border-top: 1px solid #dfdfdf;
    }
}

#template-header .navbar .navbar-nav {
    justify-content: center;
    align-items: center;
    width: 100%;
}

@media (min-width: 1200px) {
    #template-header .navbar .navbar-nav {
        margin-right: 1rem;
    }
}

.promo-show #template-header {
    top: 3rem;
}

/* Header Logo */

#template-header .navbar-brand {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0px;
    padding: 0px;
    width: 4rem;
}

#template-header .navbar-brand > img {
    width: 100%;
}

/* Social media */

#template-header .social-media span {
    padding-right: 1rem;
}

#template-header .social-media .social-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0 1rem 0 0.2rem;
    width: auto;
    height: auto;
    color: var(--custom-1);
    font-size: 1.2rem;
    text-decoration: none;
}

#template-header .social-media .social-icon:hover,
#template-header .social-media .social-icon:active,
#template-header .social-media .social-icon:focus {
    color: var(--custom-dark);
}

/* Navbar Links & Buttons */

#template-header .navbar {
    height: var(--height-header);
}

#template-header .navbar:first-of-type {
    margin-left: 2rem;
    margin-right: auto;
}

#template-header .navbar .nav-item {
    position: relative;
    width: 100%;
}

@media (min-width: 768px) {
    #template-header .navbar .nav-item {
        width: auto;
    }
}

#template-header .navbar .nav-link,
#template-header .dropdown-item {
    position: relative;
    display: inline-flex;
    align-items: center;
    padding: 1rem 2rem;
    color: #909090;
    width: 100%;
    height: 3rem;
    font-family: var(--font-header);
    font-size: 0.9rem;
    font-weight: 600;
    text-transform: uppercase;
    text-align: center;
    letter-spacing: 0.1em;
    border-radius: var(--border-radius-sm);
    transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
}

@media (min-width: 768px) {
    #template-header .navbar .nav-link,
    #template-header .dropdown-item {
        padding: 0.5rem 1.5rem;
        width: auto;
    }
}

#template-header .navbar .nav-link:hover,
#template-header .navbar .nav-link:active,
#template-header .navbar .nav-link:focus,
#template-header .dropdown-item:hover,
#template-header .dropdown-item:active,
#template-header .dropdown-item:focus {
    color: var(--bs-dark);
}

#template-header .navbar .active .nav-link {
    color: var(--bs-dark);
}

@media (min-width: 768px) {
    #template-header .navbar .nav-item.active:after {
        content: "";
        position: absolute;
        bottom: -1.5rem;
        left: 0;
        display: block;
        width: 100%;
        height: 0.25rem;
        background-color: var(--custom-1);
    }
}

#template-header .navbar .nav-link i {
    font-size: 1.5rem;
}

#template-header .navbar .nav-link .badge {
    position: absolute;
    top: 50%;
    right: -0.5rem;
    transform: translateY(20%);
}

#template-header #primary-nav .nav-item .btn {
    margin: 0 1rem;
    text-transform: uppercase;
}

#template-header .user-photo {
    display: block;
    width: 3rem;
    height: 3rem;
    background-color: var(--bs-dark-light);
    background-position: 50%;
    background-size: cover;
    border: 0;
    border-radius: var(--border-radius-sm);
    transition: all 0.2s ease;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
}

#template-header .user-photo:hover {
    box-shadow: inset 0 0 0 2px var(--bs-primary);
    -webkit-box-shadow: inset 0 0 0 2px var(--bs-primary);
    -moz-box-shadow: inset 0 0 0 2px var(--bs-primary);
}

/* Navbar Primary - Custom toggler */

#template-header .navbar-primary .navbar-toggler {
    position: fixed;
    top: 1.4rem;
    right: 1rem;
    z-index: 1;
    padding: 0;
    border: 0;
    box-shadow: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
}

#template-header .navbar-primary .custom-toggle {
    align-items: center;
    justify-content: center;
    width: 3.5rem;
    height: 3rem;
    text-align: center;
    transform: rotate(0);
    transition: all 0.2s ease;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    cursor: pointer;
}

#template-header .navbar-primary .custom-toggle span {
    display: block;
    position: absolute;
    height: 2px;
    width: 30px;
    background: #9f9f9f;
    opacity: 1;
    left: 10px;
    transform: rotate(0deg);
    transition: all 0.2s ease;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    transition: all 0.2s ease;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
}

.navbar-toggler:hover .custom-toggle span {
    background: #ffffff;
}

#template-header .navbar-primary .custom-toggle span:nth-child(1) {
    top: 17px;
    width: 20px;
}

#template-header .navbar-primary .custom-toggle span:nth-child(2),
#template-header .navbar-primary .custom-toggle span:nth-child(3),
#template-header
    .navbar-primary
    .navbar-toggler[aria-expanded="true"]
    .custom-toggle
    span:nth-child(1),
#template-header
    .navbar-primary
    .navbar-toggler[aria-expanded="true"]
    .custom-toggle
    span:nth-child(4) {
    top: 24px;
}

#template-header .navbar-primary .custom-toggle span:nth-child(4) {
    top: 31px;
    width: 24px;
}

#template-header
    .navbar-primary
    .navbar-toggler[aria-expanded="true"]
    .custom-toggle {
    left: 24.5px;
}

#template-header
    .navbar-primary
    .navbar-toggler[aria-expanded="true"]
    .custom-toggle
    span:nth-child(1) {
    width: 0%;
    left: 50%;
}

#template-header
    .navbar-primary
    .navbar-toggler[aria-expanded="true"]
    .custom-toggle
    span:nth-child(2) {
    transform: rotate(45deg);
}

#template-header
    .navbar-primary
    .navbar-toggler[aria-expanded="true"]
    .custom-toggle
    span:nth-child(3) {
    transform: rotate(-45deg);
}

#template-header
    .navbar-primary
    .navbar-toggler[aria-expanded="true"]
    .custom-toggle
    span:nth-child(4) {
    width: 0%;
    left: 50%;
}

/* Navbar Primary - Dropdown Menu */

#template-header .navbar .nav-link {
}

#template-header .dropdown-item:hover,
#template-header .dropdown-item:active,
#template-header .dropdown-item:focus {
}

/*------------------------------------------------------------
    -- TEMPLATE PANE
------------------------------------------------------------*/

#template-pane {
    position: fixed;
    top: 0;
    right: -100%;
    z-index: 1036;
    display: block;
    width: 100%;
    height: 100vh;
    color: #909090;
    transition: all 0.2s ease;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    background-color: var(--bs-dark-darker);
    box-shadow: 0 0 0 rgb(0 0 0 / 30%);
    -webkit-box-shadow: 0 0 0 rgb(0 0 0 / 30%);
    -moz-box-shadow: 0 0 0 rgb(0 0 0 / 30%);
}

@media (min-width: 992px) {
    #template-pane {
        right: -25rem;
        max-width: 25rem;
    }
}

#template-pane.open {
    right: 0;
    box-shadow: -1rem 0 5rem rgb(0 0 0 / 30%);
    -webkit-box-shadow: -1rem 0 5rem rgb(0 0 0 / 30%);
    -moz-box-shadow: -1rem 0 5rem rgb(0 0 0 / 30%);
}

#template-pane .btn-close {
    position: absolute;
    top: 1rem;
    right: 1rem;
}

#template-pane .pane-content {
    display: flex;
    flex-direction: column;
    height: 100%;
}

#template-pane a:not(.btn) {
    color: rgba(255, 255, 255, 0.7);
}

#template-pane a:not(.btn):hover,
#template-pane a:not(.btn):active,
#template-pane a:not(.btn):focus {
    color: #fff;
}

#template-pane .pane-header .row {
    align-items: center;
}

#template-pane .pane-header .user-photo {
    border-radius: var(--border-radius-md);
}

#template-pane .pane-header {
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    color: #fff;
    font-weight: 600;
    font-size: 1.5rem;
    line-height: 1.2;
    border-bottom: 1px solid rgba(125, 125, 125, 0.2);
}

#template-pane .pane-header small {
    font-size: 0.5em;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    opacity: 0.6;
}

#template-pane .pane-body {
    height: 100%;
    overflow-y: auto;
}

#template-pane .nav-link {
    padding: 0.8rem 0;
    font-size: 1.2rem;
}

#template-pane .nav-link i {
    color: var(--bs-primary);
    font-size: 1.4rem;
}

/* Shopping Cart pane */

#template-pane.cart-pane .line {
    position: relative;
    display: flex;
    margin: 0.5rem 0;
}

#template-pane.cart-pane .line-info {
    padding: 0 2rem 0 1.5rem;
    color: #ffffff;
}

#template-pane.cart-pane .line-thumb {
    position: relative;
    margin: 0;
    padding-top: 4rem;
    width: 4rem;
}

#template-pane.cart-pane .line-qty {
    position: absolute;
    top: 0.6rem;
    right: -0.5rem;
    z-index: 1;
    background-color: var(--bs-primary);
}

#template-pane.cart-pane .line-price {
    color: #a0a0a0;
}

/* User pane */

#template-pane.user-pane .btn {
    width: 228px;
}

/*------------------------------------------------------------
    -- TEMPLATE BODY
------------------------------------------------------------*/

#template-body {
    padding-top: var(--height-header);
    background-color: var(--bs-light);
}

.promo-show:not(.no-header) #template-body {
    padding-top: calc(var(--height-header) + 3rem);
}

.home:not(.no-header) #template-body,
.no-header #template-body {
    padding-top: 0;
}

/*------------------------------------------------------------
    -- TEMPLATE PAGE HEADER
------------------------------------------------------------*/

#template-page-header {
    color: #fff;
    text-align: center;
    background-color: var(--bs-dark);
    background-image: url(../img/bg-hero.webp);
    background-position: 50%;
    background-size: cover;
}

/* #template-page-header .container,
#template-page-header .container-fluid {
    margin-top: var(--height-header);
} */

#template-page-header h1 {
    margin-bottom: 0;
    color: inherit;
}

#template-page-header p {
    margin-bottom: 0;
    color: #afafaf;
}

/* Map header */

#template-map-header,
#template-map-header .container-fluid {
    padding: 0;
}

#template-map-header #map-canvas {
    width: 100%;
    height: 100%;
    min-height: 30rem;
    background-color: var(--bs-secondary);
}

/*------------------------------------------------------------
    -- TEMPLATE BREADCRUMBS
------------------------------------------------------------*/

#template-breadcrumbs {
    display: flex;
    align-items: center;
    padding: 0.2rem 1rem 0;
    height: 2.5rem;
    font-size: 0.9rem;
    background-color: #fff;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

#template-breadcrumbs .container {
    margin-top: 0;
    margin-bottom: 0;
}

#template-breadcrumbs li {
    display: inline-flex;
    list-style: none;
}

#template-breadcrumbs a {
    display: inline-block;
    max-width: 9rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: #a0a0a0;
    text-decoration: none;
}

@media (min-width: 992px) {
    #template-breadcrumbs a {
        max-width: initial;
        overflow: initial;
        white-space: initial;
        text-overflow: initial;
    }
}

#template-breadcrumbs a:hover,
#template-breadcrumbs a:active,
#template-breadcrumbs a:focus {
    color: #606060;
    text-decoration: underline;
    text-decoration: none;
}

#template-breadcrumbs a.active {
    color: #cc0000 !important;
}

#template-breadcrumbs .crumb-divider {
    color: #afafaf;
    margin: 0 0.6rem;
}

#template-breadcrumbs .crumb-divider:last-of-type {
    display: none;
}

/*------------------------------------------------------------
    -- TEMPLATE SUBFOOTER
------------------------------------------------------------*/

#template-subfooter {
    padding: 2rem 0;
    color: #afafaf;
    background-color: var(--bs-dark);
    font-size: 0.8rem;
}

#template-subfooter h5 {
    color: #fff;
}

#template-subfooter .payment-methods .method-icon {
    height: 2.95rem;
}

/*------------------------------------------------------------
    -- TEMPLATE FOOTER
------------------------------------------------------------*/

#template-footer {
    position: relative;
    display: flex;
    align-items: center;
    padding: 3rem 0;
    background-color: var(--bs-dark);
}

#template-footer .container .row > div:not(:last-of-type) {
    border-right: 2px solid #1c1b1c;
}

#template-footer .container .row > div {
    padding: 0 2rem;
}

#template-footer .logo {
    display: block;
    width: 100px;
}

#template-footer h4 {
    margin: 0.5rem 0;
    color: #606060;
    font-family: "Montserrat";
    font-size: 0.8rem;
    font-weight: 300;
    text-transform: uppercase;
    line-height: 1.5;
    letter-spacing: 2px;
}

#template-footer p {
    font-size: 1.3rem;
    color: #afafaf;
}

#template-footer a:not(.btn) {
    color: var(--custom-1);
    text-decoration: none;
}

#template-footer a:hover,
#template-footer a:active,
#template-footer a:focus {
    color: #ffffff;
    text-decoration: none;
}

#template-footer .social-media {
    display: block;
}

#template-footer .social-media .social-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0 1rem 0 0.2rem;
    width: auto;
    height: auto;
    font-size: 1.2rem;
    text-decoration: none;
}

#template-footer a.login {
    position: absolute;
    bottom: 1rem;
    right: 1rem;
    color: #808080;
}

#template-footer a.login:hover,
#template-footer a.login:active,
#template-footer a.login:focus {
    color: #fbaf40;
}

/*------------------------------------------------------------
    -- TEMPLATE COOKIE POLICY
------------------------------------------------------------*/

#template-cookie-policy {
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 1022;
    padding: 2rem;
    width: 100%;
    max-width: 30rem;
    height: auto;
    color: #fff;
    background-color: var(--bs-dark);
    box-shadow: 0 0 10rem rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0 0 10rem rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0 0 10rem rgba(0, 0, 0, 0.5);
}

#template-cookie-policy .cookie-policy-header {
    margin-bottom: 0.5rem;
    font-family: var(--font-header);
    font-size: 1.2rem;
}

/*------------------------------------------------------------
    -- LOGIN
------------------------------------------------------------*/

.logged-in-info {
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
    padding: 1rem;
    background-color: var(--bs-light);
    border: 1px solid var(--bs-borders);
    border-radius: var(--border-radius-sm);
}

.login #template-body {
    height: 100vh;
}

.login section,
.login .container-fluid,
.login .container-fluid .row,
.login .container-fluid .row > div {
    height: 100vh;
}

.login section {
    padding: 0;
    background-color: #fff;
}

.login .row > div:first-child {
    display: flex;
    align-items: center;
    justify-content: center;
}

.login .row > div:last-child {
    display: none;
    background-color: var(--bs-secondary);
    background-image: url(../img/bg-hero-2.webp);
    background-position: 50%;
    background-size: cover;
    background-repeat: no-repeat;
}

@media (min-width: 992px) {
    .login .row > div:last-child {
        display: flex;
    }
}

.login form .logo {
    display: block;
    margin: 0 auto 2rem;
    width: 80%;
}

.login form {
    max-width: 100%;
    width: 20rem;
}

/*------------------------------------------------------------
    -- MY ACCOUNT
------------------------------------------------------------*/

.my-account h1 {
    margin: 0;
    font-size: 1.75rem;
}

.my-account h1 > i {
    margin-right: 1rem;
    color: var(--bs-primary);
}

.my-account .my-code {
    padding: 1rem 2rem;
    background-color: #ffffff;
    border-radius: var(--border-radius-md);
}

/*------------------------------------------------------------
    -- HERO
------------------------------------------------------------*/

#hero {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 8rem;
    padding-bottom: 8rem;
    width: 100%;
    color: #fff;
    text-align: center;
    background-color: var(--bs-dark-dark);
    background-image: url("../img/bg-hero-2.webp");
    background-position: 50%;
    background-size: cover;
    border-bottom: 0.5rem solid var(--custom-1);
    box-shadow: inset 0 1000px rgb(1 20 63 / 60%);
    -webkit-box-shadow: inset 0 1000px rgb(1 20 63 / 60%);
    -moz-box-shadow: inset 0 1000px rgb(1 20 63 / 60%);
}

.home #hero {
    padding: calc(var(--height-header) + 6rem) 3rem 6rem;
}

@media (min-width: 768px) {
    .home #hero {
        padding: calc(var(--height-header) + 12rem) 3rem 12rem;
    }
}

#hero img {
    width: 100%;
    max-width: 25rem;
}

#hero h1 {
    margin: 0;
    color: inherit;
    font-size: 3rem;
}

/*------------------------------------------------------------
    -- HOMEPAGE
------------------------------------------------------------*/

.parallax {
    height: 30rem;
    background-position: center center;
    background-size: cover;
    background-attachment: fixed;
}

.brewcon {
    margin: 0 0.5rem;
    opacity: 0.3;
    pointer-events: none;
}

.brewcon.available {
    opacity: 1;
    pointer-events: initial;
}

/*------------------------------------------------------------
    -- BREWS
------------------------------------------------------------*/

.brew-tabs,
.brew-tabs .nav-link,
.brew-tab-content {
    background: transparent !important;
    border: 0;
}

.brew-tabs {
    align-items: center;
    justify-content: center;
    gap: 5rem;
    border-bottom: 1px solid var(--bs-borders);
}

.brew-tabs .nav-link {
    margin-bottom: -2px;
    padding: 0.5rem;
    color: var(--bs-dark);
    opacity: 0.4;
    border-bottom: 3px solid transparent;
    transition: all 0.2s ease-in-out;
}

.brew-tabs .nav-link:hover {
    opacity: 0.7;
    border-color: var(--bs-dark-50);
}

.brew-tabs .nav-link.active {
    opacity: 1;
    border-color: var(--custom-1);
}

.brew-tabs .nav-link > * {
    margin: 0;
}

.brew-card {
    --brew-image-width: 8rem;
    --brew-image-border-width: 4px;
}

.brew-card .brew-image {
    position: relative;
    top: calc(var(--brew-image-width) * -0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto calc(var(--brew-image-width) * -0.5);
    width: var(--brew-image-width);
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background-color: var(--bs-light);
    border: var(--brew-image-border-width) solid #fff;
    border-radius: 999rem;
}

.brew-card .brew-image > img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: block;
    margin: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.brew-title,
.brew-meta {
    text-align: center;
}

.brew-meta {
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--bs-borders);
}

/*------------------------------------------------------------
    -- EVENTS
------------------------------------------------------------*/

.event-card .card-body {
    position: relative;
}

.event-image {
    width: 100%;
    aspect-ratio: 3 / 4;
}

.event-image > img {
    display: block;
    margin: 0;
    width: 100%;
    height: 100%;
}

.card-body > * {
    margin: 0.5rem 0;
}

.event-meta i,
.event-meta svg {
    color: var(--custom-1);
    fill: var(--custom-1);
}

.event-action {
    font-weight: 600;
}

.event-action i,
.event-action svg {
    margin-left: 0.5rem;
    position: relative;
    left: 0;
    transition: all 0.1s ease-in-out;
}

a.card:hover .event-action i,
a.card:hover .event-action svg {
    position: relative;
    left: 0.5rem;
}

.event-single > .container > .row > div {
    margin: 0.5rem 0;
}

@media (min-width: 992px) {
    .event-single > .container > .row > div {
        margin: 0;
    }
}

@media (min-width: 992px) {
    .event-single > .container > .row > div:nth-child(2) {
        margin-top: 150px;
    }
}

@media (min-width: 768px) {
    .event-single > .container > .row {
        flex-direction: row-reverse;
    }
}

/*------------------------------------------------------------
    -- WHERE TO FIND
------------------------------------------------------------*/

#wheretofind table {
    width: 100%;
}

#wheretofind table tr {
    border: 0;
}

#wheretofind table tr td:last-child {
    text-align: right;
}

/*------------------------------------------------------------
    -- CONTACT
------------------------------------------------------------*/

#google-map {
    padding: 0;
}

#google-map #map-container {
    width: 100%;
    height: 450px;
    background-color: #e0e0e0;
}

#google-map .row > div {
    margin-top: -450px;
}

/*------------------------------------------------------------
    -- PRODUCT / PRICE
------------------------------------------------------------*/

.product-price {
    display: flex;
    align-items: baseline;
    color: #606060;
    font-family: var(--font-header);
}

.product-price:not(.on-sale) > .price-normal {
    font-size: 1.2em;
    font-weight: 600;
}

.product-price.on-sale > .price-normal-strike {
    margin-right: 0.5rem;
    color: #a0a0a0;
    text-decoration: line-through;
}

.product-price > .price-sale {
    color: var(--bs-danger);
    font-size: 1.2em;
    font-weight: 700;
}

.product-price > .price-currency {
    font-size: 0.7em;
    margin-left: 0.2rem;
}

/*------------------------------------------------------------
    -- PRODUCT / RATING
------------------------------------------------------------*/

.product-rating i.empty {
    color: var(--bs-borders);
}

/* .product-rating i.half {
    --fa-primary-color: gold;
    --fa-secondary-color: #efefef;
    --fa-primary-opacity: 1;
    --fa-secondary-opacity: 1;
} */

.product-rating i.full,
.product-rating i.half {
    color: gold;
}

/*------------------------------------------------------------
    -- PRODUCT / QUANTITY INPUT
------------------------------------------------------------*/

.product-quantity {
    display: flex;
}

.product-quantity .input-group {
    margin-right: 0.5rem;
    max-width: 10rem;
}

.product-quantity .input-group > * {
    text-align: center;
    border: 0;
    background-color: var(--bs-light);
}

.product-quantity input:focus {
    box-shadow: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
}

.product-quantity .btn-spinner {
    padding: 0 1rem;
    height: 100%;
    font-size: 1.2rem;
    font-weight: 300;
}

.product-quantity .btn-spinner:hover,
.product-quantity .btn-spinner:active,
.product-quantity .btn-spinner:focus {
    box-shadow: inset 0 5rem 0 rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: inset 0 5rem 0 rgba(0, 0, 0, 0.1);
    -moz-box-shadow: inset 0 5rem 0 rgba(0, 0, 0, 0.1);
}

.product-quantity input::-webkit-outer-spin-button,
.product-quantity input::-webkit-inner-spin-button {
    margin: 0;
    text-align: center;
    -webkit-appearance: none;
}

.product-quantity input[type="number"] {
}

/*------------------------------------------------------------
    -- PRODUCT LIST
------------------------------------------------------------*/

#product-filters {
    display: flex;
    margin-left: auto;
}

#product-filters > * {
    margin-left: 0.5rem;
}

#product-filters button {
    width: 3rem;
    height: 3rem;
    color: #606060;
    background: transparent;
    border: 1px solid var(--bs-borders);
    border-radius: var(--border-radius-sm);
    transition: all 0.2s ease;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
}

#product-filters button:not(:last-child) {
    margin-right: 0.2rem;
}

#product-filters button:hover,
#product-filters button:active,
#product-filters button:focus {
    background-color: var(--bs-light);
}

.product {
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
}

.product .product-tags {
    position: absolute;
    top: 1rem;
    left: 1rem;
    z-index: 1;
    display: flex;
}

.product .product-tags > .badge {
    margin-right: 0.3rem;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1);
}

.product .product-tags > .badge > i {
    margin-right: 0.3rem;
}

.product .product-category {
    color: #afafaf;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.product .product-name {
    margin: 0;
    color: var(--bs-dark);
    font-size: 1.2rem;
    font-weight: 600;
    line-height: 1.3;
}

/* .product .product-shipping {
    color: var(--bs-gray);
    font-size: .8rem;
    letter-spacing: .1em;
} */

.product .product-rating {
    color: #d0d0d0;
    font-size: 0.8em;
}

/*------------------------------------------------------------
    -- PRODUCT DETAILS
------------------------------------------------------------*/

.single-product .product-details {
    background-color: #ffffff;
}

@media (max-width: 991px) {
    .single-product .product-details {
        padding-top: 0;
    }
}

/* Product image gallery */

.single-product .product-gallery {
    margin: 0 -1.75rem;
    border-radius: none;
}

@media (min-width: 992px) {
    .single-product .product-gallery {
        margin: 0;
    }
}

.single-product .product-gallery .thumb {
    border-radius: var(--border-radius-md);
}

.single-product .carousel-indicators {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    width: 100%;
    background: #fff;
}

.single-product .carousel-indicators .thumb {
    display: flex;
    margin: 1rem 0.2rem;
    padding: 1rem;
    width: 6rem;
    height: 2rem;
    background-size: cover;
    border: 2px solid var(--bs-borders);
    border-radius: var(--border-radius-sm);
    transition: border 0.3s ease;
    -webkit-transition: border 0.3s ease;
    -moz-transition: border 0.3s ease;
}

@media (min-width: 768px) {
    .single-product .carousel-indicators .thumb {
        height: 4rem;
    }
}

@media (min-width: 992px) {
    .single-product .carousel-indicators .thumb {
        height: 5rem;
    }
}

@media (min-width: 1200px) {
    .single-product .carousel-indicators .thumb {
        height: 4rem;
    }
}

.single-product .carousel-indicators .thumb.active {
    border-color: var(--bs-info);
}

/* Product meta */

.single-product .product-meta {
    margin-top: 1.5rem;
}

.single-product .product-name {
    color: var(--bs-dark);
    font-family: var(--font-header);
    font-size: 2.5rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.single-product .product-rating {
    margin-bottom: 1rem;
}

.single-product .product-description {
    margin-bottom: 1.5rem;
}

.single-product .product-perks {
    margin-bottom: 1rem;
}

/* Promotional gift selection */

.single-product .promo-gifts .gift-option {
    position: relative;
    display: flex;
    align-items: center;
}

.single-product .promo-gifts .gift-option input {
    position: absolute;
    left: 1.5rem;
    z-index: 2;
}

.single-product .promo-gifts .gift-option label {
    margin-bottom: -2px;
    padding: 1rem 1.5rem 1rem 3.5rem;
    width: 100%;
    background-color: #f8f8f8;
    border: 2px solid #fff;
}

.single-product .promo-gifts .gift-option :checked ~ label {
    z-index: 1;
    background-color: #fff;
    border: 2px solid var(--bs-info);
    border-radius: var(--border-radius-sm);
}

.single-product .promo-gifts .gift-option > *:first-child {
    margin-right: 1rem;
}

.single-product .promo-gifts .twi-block > img.twi-icon {
    margin-top: auto;
    width: 4rem;
}

.single-product .promo-gifts .twi-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    width: 100%;
}

.single-product .promo-gifts .gift-name {
    color: var(--bs-dark);
    font-size: 1.2rem;
}

.single-product .promo-gifts .product-price {
    font-size: 1rem;
}

.single-product .product-add-to-cart {
    margin-bottom: 1rem;
}

/* Stock messages */

.stock-messages .message {
    position: relative;
    display: flex;
    margin: 2px 0;
    padding: 0.5rem 0.5em 0.5em 2.5rem;
    min-height: 2rem;
    color: #fff;
    background-color: var(--bs-info);
    border-radius: var(--border-radius-sm);
}

.stock-messages .message:last-of-type {
    margin-bottom: 1.5rem;
}

.stock-messages .message i {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 2rem;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.15);
}

.stock-messages .message strong {
    margin-right: 0.4em;
}

/* Product perks */

.single-product .product-perks {
    display: flex;
    justify-content: space-around;
    margin-top: 3rem;
}

.single-product .product-perks .perk {
    display: flex;
    flex-direction: column;
    padding: 0 0.5rem;
    font-size: 0.8rem;
    text-transform: uppercase;
    text-align: center;
}

.single-product .product-perks .perk > i {
    margin-bottom: 0.5rem;
    color: var(--bs-primary);
    font-size: 1.7rem;
}

/* Social media buttons */

.single-product .product-details .social-media {
    display: flex;
    justify-content: center;
    margin-top: 1rem;
}

/* Product Tabs */

.product-tabs {
    background-color: #ffffff;
}

.product-tabs .nav-link {
    position: relative;
    padding-bottom: 1rem;
    color: var(--bs-secondary);
    font-size: 1.3rem;
    font-weight: 600;
    border: 0;
    border-radius: 0;
}

.product-tabs .nav-link:hover,
.product-tabs .nav-link:active,
.product-tabs .nav-link:focus {
    color: var(--bs-dark);
}

.product-tabs .nav-link.active {
    color: var(--bs-dark);
    box-shadow: inset 0 -4px 0 var(--bs-primary);
    -webkit-box-shadow: inset 0 -4px 0 var(--bs-primary);
    -moz-box-shadow: inset 0 -4px 0 var(--bs-primary);
}

.product-tabs .nav-link.active:after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    display: block;
    border-top: 10px solid var(--bs-primary);
    border-right: 10px solid transparent;
    border-bottom: 0;
    border-left: 10px solid transparent;
}

.product-reviews {
    background-color: var(--bs-light);
}

/*------------------------------------------------------------
    -- CART
------------------------------------------------------------*/

.shopping-cart-items .cart-empty {
    padding: 4rem;
    font-size: 1.2rem;
    text-align: center;
    border: 1px solid var(--bs-borders);
}

/* Line Items */

.shopping-cart-items .shopping-cart-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.5rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--bs-borders);
}

.shopping-cart-items .line-item {
    display: flex;
    margin-bottom: 2rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid var(--bs-borders);
}

.modal .shopping-cart-items .line-item {
    margin-bottom: 1rem;
    padding: 0 1rem 1rem;
}

.shopping-cart-items .line-item-thumb {
    position: relative;
    margin-right: 1.5rem;
    padding-top: 6rem;
    width: 6rem;
    background-size: 90%;
}

.shopping-cart-items .line-item-inner {
    flex: auto;
}

.shopping-cart-items .line-item-details {
    display: flex;
    align-items: center;
    padding-top: 0.5rem;
    width: 100%;
}

.shopping-cart-items .line-item-name {
    color: var(--bs-dark);
    font-size: 1.2rem;
    font-weight: 800;
}

.shopping-cart-items .line-item-variant {
    font-size: 0.9rem;
    font-style: italic;
}

.shopping-cart-items .product-quantity {
    margin-left: auto;
}

.shopping-cart-items .product-quantity.badge {
    position: absolute;
    top: 0.6rem;
    right: -0.3rem;
    z-index: 1;
    background-color: var(--bs-dark);
}

.shopping-cart-items .line-item-value,
.shopping-cart-items .line-item-extras,
.shopping-cart-items .remove-line-item {
    margin-left: 4rem;
}

.shopping-cart-items .remove-line-item,
.shopping-cart-summary .remove-coupon {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    margin-top: -0.1em;
    width: 1.5rem;
    height: 1.5rem;
    color: var(--bs-danger);
    font-family: initial;
    font-weight: 600;
    font-size: 2rem;
    text-align: center;
    text-decoration: none;
    background: transparent;
    border: 0;
}

.shopping-cart-items .line-warranty {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 1rem;
    padding: 0.5rem 1rem;
    border: 2px dashed var(--bs-borders);
}

/* Cart Summary */

.shopping-cart-summary {
    background-color: var(--bs-light);
}

.shopping-cart-summary .summary-line {
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
}

.shopping-cart-summary .summary-value {
    margin-left: auto;
}

.shopping-cart-summary .remove-coupon {
    margin-right: auto;
    margin-left: 0.5rem;
}

/*------------------------------------------------------------
    -- CHECKOUT
------------------------------------------------------------*/

body.checkout {
    background-color: #fff;
}

.checkout #checkout-form > .row > div:first-child > div {
    position: relative;
}

.checkout .shipmethod-empty {
    padding: 2rem 2rem 1.8rem;
    border: 1px solid var(--bs-borders);
    border-radius: var(--border-radius-sm);
}

.checkout .shipping-method-list.error {
    box-shadow: 0 0 0 2px var(--bs-danger);
    -webkit-box-shadow: 0 0 0 2px var(--bs-danger);
    -moz-box-shadow: 0 0 0 2px var(--bs-danger);
    border-radius: var(--border-radius-sm);
}

.checkout .shipping-method-list .radio {
    position: relative;
    display: flex;
    align-items: center;
    padding: 0.7rem 1rem 0.5rem;
    margin-bottom: -1px;
}

.checkout .shipping-method-list .radio input[type="radio"] {
    margin: 0 1rem 0 0;
}

.checkout .shipping-method-list .radio label {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 1px solid var(--bs-borders);
    cursor: pointer;
}

.checkout .shipping-method-list .radio:first-of-type label {
    border-radius: var(--border-radius-sm) var(--border-radius-sm) 0 0;
}

.checkout .shipping-method-list .radio:last-of-type label {
    border-radius: 0 0 var(--border-radius-sm) var(--border-radius-sm);
}

.checkout .shipping-method-list .radio :checked ~ label {
    z-index: 1;
    border: 1px solid var(--bs-primary);
    box-shadow: 0 0 0 1px var(--bs-primary);
    -webkit-box-shadow: 0 0 0 1px var(--bs-primary);
    -moz-box-shadow: 0 0 0 1px var(--bs-primary);
}

.checkout .shipping-method-list .radio .option-price {
    margin-left: auto;
}

.checkout .payment-methods {
    margin-bottom: 1rem;
}

.checkout .checkout-review {
    margin-top: 0;
}

@media (min-width: 768px) {
    .checkout .checkout-review {
        box-shadow: 56rem 0 0 60rem var(--bs-light);
        -webkit-box-shadow: 56rem 0 0 60rem var(--bs-light);
        -moz-box-shadow: 56rem 0 0 60rem var(--bs-light);
    }
}

/* Checkout Form */

#checkout-form .line-item-thumb {
    position: relative;
    padding-top: 5rem;
    width: 5rem;
}

#checkout-form .line-item-qty {
    position: absolute;
    top: 0.6rem;
    right: -0.3rem;
    z-index: 1;
    background-color: var(--bs-dark);
}

#checkout-form .line-item-name {
    font-size: 1rem;
}

#checkout-form .line-item-value {
    margin: 0;
}

#checkout-form .line-item-secondary {
    display: flex;
    justify-content: space-between;
    padding-bottom: 0.2rem;
}

#checkout-form .line-item-secondary .line-item-value {
    text-align: right;
}

#checkout-form .line-item-secondary .line-item-value small {
    font-size: 0.6em;
}

#checkout-form .grand-total-line {
    margin-top: 0.5rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--bs-borders);
}

#checkout-form .grand-total-line > * {
    font-size: 1.4rem;
}

/*------------------------------------------------------------
    -- BLOG LIST
------------------------------------------------------------*/

.blog-list .blog-post-date,
.blog-list .blog-post-author {
    margin-right: 1rem;
    font-size: 0.9rem;
}

.blog-list .thumb {
    position: relative;
}

.blog-list .blog-post-date {
    position: absolute;
    bottom: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0.5rem 1rem;
    color: #fff;
    font-weight: 600;
    line-height: 1;
    background-color: var(--bs-primary);
}

.blog-list .blog-post-date-m,
.blog-list .blog-post-date-y {
    font-size: 0.8rem;
}

.blog-list .blog-post-date-d {
    font-size: 1.6rem;
}

.blog-list .blog-post-author {
    display: flex;
    align-items: center;
    margin-top: auto;
    padding-top: 1.5rem;
    font-weight: 600;
}

.blog-list .blog-post-author .author-photo {
    display: block;
    margin-right: 0.5rem;
    width: 1.5rem;
    height: 1.5rem;
    background-size: cover;
    background-position: 50%;
    border-radius: 1000rem;
}

/*------------------------------------------------------------
    -- BLOG SINGLE POST
------------------------------------------------------------*/

.single-post .post-header {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    height: 30rem;
    color: #fff;
    background-position: 50%;
    background-size: cover;
    box-shadow: inset 0 0 0 50rem rgb(16 16 16 / 50%);
}

.single-post .post-header h1 {
    color: inherit;
}

.single-post .post-author {
    background: var(--bs-light);
}

@media (min-width: 998px) {
    .single-post .post-author .row {
        align-items: center;
    }
}

.single-post .post-author {
    background: var(--bs-light);
}

.single-post .post-author .thumb {
    width: 100%;
    border-radius: 100rem;
}

.single-post .post-author .author-name {
    color: var(--bs-dark);
    font-weight: 600;
    font-size: 1.4rem;
}

.single-post .post-content,
.single-post .post-comments {
    background-color: #ffffff;
}

/*------------------------------------------------------------
    -- COMMENTS
------------------------------------------------------------*/

/* Parent  comments */

.comment {
    position: relative;
    margin-top: 2rem;
    padding-left: 5rem;
}

.comment .comment-meta {
    display: flex;
    align-items: baseline;
    margin-bottom: 0.5rem;
    padding-top: 0.5rem;
}

.comment .comment-photo {
    position: absolute;
    top: 0;
    left: 0;
    width: 4rem;
    height: 4rem;
    background-color: var(--bs-light);
    background-size: cover;
    background-position: 50%;
    background-repeat: no-repeat;
    border: 0.1rem solid var(--bs-borders);
    border-radius: 100rem;
}

.comment .comment-name {
    font-size: 1.2rem;
    font-weight: 600;
}

.comment .comment-date {
    margin-left: 1rem;
    font-size: 0.8rem;
}

.comment .comment-buttons {
    margin-top: 1rem;
}

/* Child comments */

.comment.reply {
    margin: 0 0 0 7rem;
    padding: 1rem 0 1rem 3rem;
    border-left: 0.1rem solid var(--bs-borders);
}

.comment.reply .comment-photo {
    top: 1rem;
    left: -2rem;
}