/* main theme stylesheet by Richard Dominguez */

/* smooth scrolling anchor links (that cooperate with the sticky nav) */
* {
    scroll-margin-top: 6rem;
    scroll-behavior: smooth;
}

.scrolly-video video { object-fit: cover; object-position: center; }

/* don't show disabled links as clickable */
a[aria-disabled=true] { cursor: initial; }

/* don't wrap phone number links */
a[href^="tel:"] { white-space: nowrap; }

/* buttons should show pointer on hover */
button { cursor: pointer; }

/* FIXME: remove the actual html later */
.entry-meta { display: none; }

/* accessibility helpers */
/* *:focus:not(video) {
    border: 0.125rem solid #ff0000;
} */

/* typography */
body {
    font-family: "Poppins", sans-serif;
}

h1, h2, h3, h4, h5, h6, button {
    font-family: "Orbitron", sans-serif;
    letter-spacing: -0.01em;
    text-wrap: balance;
}

p, li, blockquote {
    text-wrap: pretty;
}

.poppins {
    font-family: "Poppins", sans-serif;
}

.orbitron {
    font-family: "Orbitron", sans-serif;
    letter-spacing: -0.01em;
}

.heading-small {
    font-family: "Poppins", sans-serif;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    margin: 0 0 1rem;
}

.heading-large {
    font-family: "Orbitron", sans-serif;
    line-height: 1.2;
    margin: 0 0 1rem;
    letter-spacing: -0.01em;
    font-size: 2.2rem;
}

.heading-large--home-hero {
    line-height: 1.25;
    font-size: 2.75rem;
    font-weight: 900;
    margin-bottom: 4rem;
}

.nested-copy a {
	color: #f00f00;
}

.nested-copy h1,
.nested-copy h2,
.nested-copy h3,
.nested-copy h4,
.nested-copy h5,
.nested-copy h6 {
	font-size: 1.75rem;
	line-height: 1.25;
	margin: 2rem 0 0.75rem;
}

@media(min-width: 46rem) {
	.nested-copy h1,
	.nested-copy h2,
	.nested-copy h3,
	.nested-copy h4,
	.nested-copy h5,
	.nested-copy h6 {
		font-size: 2rem;
	}
}


.nested-copy p,
.nested-copy li,
.nested-copy ul,
.nested-copy blockquote {
    margin-top: 0;
    margin-bottom: 1rem;
}

.nested-copy ul,
.nested-copy ol {
    padding-left: 1.0em;
}

.nested-copy :first-child {
    margin-top: 0rem;
}

.nested-copy :last-child {
    margin-bottom: 0rem;
}

/* responsive typography styles */
@media(min-width: 46rem) {
    .heading-large {
        font-size: 3rem;
    }
    .heading-large--home-hero {
        line-height: 1.05;
        font-size: 3.5rem;
    }
}

@media(min-width: 62rem) {
    .heading-large--home-hero {
        font-size: 4.375rem;
        margin-bottom: 8rem;
    }
}

@media(min-width: 78rem) {
    .heading-large--home-hero {
        font-size: 5.375rem;
        margin-bottom: 11.5rem;
    }
}

/* main wrapper */

.wrap {
    padding-left: 1rem;
    padding-right: 1rem;
    margin-left: auto;
    margin-right: auto;
}
.wrap--rightwards {
    margin-right: 0;
}

@media(min-width: 30rem) {
    .wrap {
        padding-left: 2rem;
        padding-right: 2rem;
    }
    .wrap, .mw-wrap-xs {
        max-width: 38rem;
    }
    .wrap--rightwards {
        padding-right: 0;
        max-width: calc(19rem + 50%);
    }
}

@media(min-width: 46rem) {
    .wrap, .mw-wrap-s {
        max-width: 46rem;
    }
    .wrap--rightwards {
        max-width: calc(23rem + 50%);
    }
}

@media(min-width: 62rem) {
    .wrap, .mw-wrap-m {
        max-width: 62rem;
    }
    .wrap--rightwards {
        max-width: calc(31rem + 50%);
    }
}

@media(min-width: 78rem) {
    .wrap, .mw-wrap-l {
        max-width: 78rem;
    }
    .wrap--rightwards {
        max-width: calc(39rem + 50%);
    }
}

@media(min-width: 94rem) {
    .wrap, .mw-wrap-xl {
        max-width: 94rem;
    }
    .wrap--rightwards {
        max-width: calc(47rem + 50%);
    }
}


/* buttons */

.btn,
.nested-form input[type=submit] {
    line-height: 1.5rem;
    padding: 0.625rem 1.875rem;
    border: 1.5px solid rgba(255,255,255,0.2);
    border-bottom-width: 4px;
    color: white;
    background-color: #000;
    text-decoration: none;
    display: inline-block;
    transition: background-color 0.4s, border-color 0.4s, color 0.4s;
    text-wrap: balance;
}

.btn:hover, a:hover .btn {
    color: #f00f00;
    border-color: rgba(255,255,255,0.3);
}

.btn--alt,
.nested-form input[type=submit] {
    color: #000;
    background-color: #fff;
    border-color: #c7c7c7c7;
}

.btn--alt:hover,
a:hover .btn--alt,
.nested-form input[type=submit]:hover {
    color: #fff;
    background-color: #f00f00;
    border-color: #600600;
}

.btn--red,
.btn--active {
    color: #fff;
    background-color: #f00f00;
    border-color: #600600;
    font-weight: 600;
}

.btn--red:hover,
.btn--active:hover {
    color: #fff;
    border-color: #600600;
    background-color: #C00C00;
}

.btn--header {
    min-height: 3rem;
    padding: 0.5rem 1rem;
    text-align: center;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

@media(min-width: 62rem) {
    .btn--header {
        min-height: 2rem;
        padding: 0.25rem 1rem;
    }
}

.btn--translucent {
    background-color: rgba(0, 0, 0, 0.6);
    border-color: rgba(255,255,255,0.2);
}

.btn--translucent:hover, a:hover .btn--translucent {
    background-color: #000;
}

.btn--chevron {
    border: none;
    background: transparent;
    position: relative;
    padding-right: 2rem;
    padding-left: 0.25rem;
}

.btn--chevron:hover, a:hover .btn--chevron {
    color: #fff;
    text-decoration: underline;
}

.btn--chevron::after {
    content: "";
    background-image: url(../images/glyph-chevron-right.svg);
    background-size: cover;
    display: inline-block;
    position: absolute;
    right: 0;
    top: calc(50% - 15px);
    width: 30px;
    height: 30px;
}

.btn--sparkle {
    position: relative;
}

.btn--sparkle::before {
    content: "";
    display: block;
    position: absolute;
    top: -47px;
    right: -22px;
    width: 54px;
    height: 98px;
    background-image: url(../images/gfx-sparkle.svg);
}


@media(min-width: 62rem) {
    .btn--sparkle::before {
        right: initial;
        top: -49px;
        left: -33px;
    }
}

/* unfortunately we have to hack this bit */
.header-buttons > ul > li:nth-child(2) {
    display: none;
}

@media(min-width: 78rem) {
    .header-buttons > ul > li:nth-child(2) {
        display: inline-block;
    }
}

/* genesis */
/* correct issue with negative margins overflowing the box at times */
.site-inner {
    overflow-x: clip;
    overflow-y: visible;
}

/* this is necessary to enable a fixed background hack on mobile */

/* sticky header */
.site-header {
    position: sticky;
    top: 0;
    z-index: 3;
}

/* take into account the WordPress admin bar */
.admin-bar .site-header {
    top: 32px;
}

@media(max-width: 782px) {
    .admin-bar .site-header {
        top: 46px;
    }
}

@media(max-width: 600px) {
    .admin-bar .site-header {
        top: 0;
    }
}

/* misc utilities */

@media(min-width: 126rem) {
    .absolute-xxxl {
        position: absolute;
    }
}

.tww { text-wrap: wrap; }
.twb { text-wrap: balance; }
.twp { text-wrap: pretty; }

.w-0 { width: 0%; }

.mh-100 { max-height: 100%; }

.ph2\.5 {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
}

.nh2\.5 {
    margin-left: -0.75rem;
    margin-right: -0.75rem;
}

.overflow-clip { overflow: clip; }

.b--bright-red { border-color: #f00f00; }

.lh-subcopy { line-height: 1.4; }

.charcoal { color: #0A0A0A; }

.ash { color: #1A1A1A; }

.silver-chalice { color: #c7c7c7; }

.bright-red { color: #f00f00; }

.burnt-red { color: #600600; }

.bg-bright-red { background-color: #f00f00; }

.bg-burnt-red { background-color: #600600; }

.bg-charcoal { background-color: #0A0A0A; }

.bg-ash { background-color: #1A1A1A; }

.bg-steel-gradient {
    background: linear-gradient(131deg, var(--Color-Thunder-Darker, #0D0D0D) 13.38%, var(--Color-Thunder, #212121) 85.19%);
}

.bg-light-steel-gradient {
    background: linear-gradient(354deg, var(--Color-Silver-Chalice-Light, #C7C7C7) 2.37%, var(--Color-White, #FFF) 78.74%);
}

.hover-bright-red:hover { color: #f00f00; }

.sticky { position: sticky; }

.object-cover { object-fit: cover; }

.hover-fade .hover-fade-child {
    transition: opacity 0.5s;
}
.hover-fade:hover .hover-fade-child {
    opacity: 0;
}
.hover-reveal .hover-reveal-child {
    opacity: 0;
    transition: opacity 0.5s;
}
.hover-reveal:hover .hover-reveal-child {
    opacity: 1;
}

@media(min-width: 46rem) {
    .h-initial-s {
        height: initial;
    }
}

.hover--red-gradient-pseudo::before {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    height: 0%;
    width: 100%;
    transition: height 0.4s, background-color 0.4s, opacity 0.6s;
    opacity: 0;
    background: rgba(255, 15, 0, 0.60);
}
.hover--red-gradient-pseudo:hover::before {
    height: 100%;
    opacity: 1;
    background: linear-gradient(180deg, rgba(10, 9, 9, 0.00) 77.36%, rgba(10, 9, 9, 0.80) 100%), rgba(255, 15, 0, 0.60);
}

.show-on-scroll {}

.show-on-scroll__child {
	transition: opacity 0.6s, transform 0.6s;
    opacity: 0.001;
    transform: translateY(8rem);
}

.show-on-scroll--shown .show-on-scroll__child {
    transform: translateY(0);
    opacity: 1;
}

.hover--grow-arrow .arrow {
    transition: transform 0.3s;
    transform-origin: top right;
}
.hover--grow-arrow:hover .arrow {
    transform: scale(1.15);
}
.hover--grow-arrow--slight:hover .arrow {
    transform: scale(1.08);
}
.hover--grow-child .hover__child {
    transition: transform 0.5s;
}
.hover--grow-child:hover .hover__child {
    transform: scale(1.08);
}


@media(min-width: 62rem) {
    .w-50vw-50-m { width: calc(50vw + 50%); }
    .w--46-m { width: 46rem; }
}

@media(min-width: 78rem) {
    .w-50vw-50-l { width: calc(50vw + 50%); }
}

/* section specific */

.bg--product-hero-rs {
    background-size: auto 120%;
    background-position: bottom 0% right 50%;
}

.h--product-mobile-carousel { height: 21.25rem; }

.nt--icon-grid-row-rs {}

.w--click-thumb-rs { width: 4rem; }

.w--click-thumb-gallery-rs { width: 4rem; }

.mw--product-rs { max-width: 18rem; }

.h--header-logo-rs { height: 2.5rem; }

.pv--home-hero-rs { padding-top: 6rem; padding-bottom: 6rem; }

.top--scrolling-cards-rs { top: 18rem; }

.pt--scrolling-video-rs { padding-top: 14rem; }

.mr--scrolling-video-rs { margin-right: 7.6rem; }

.h--product-hero-rs { height: 100%; }

@media(min-width: 30rem) {}

@media(min-width: 38rem) {
    .h--header-logo-rs { height: 3rem; }
}

@media(min-width: 46rem) {
    .pv--home-hero-rs { padding-top: 8rem; padding-bottom: 4rem; }
    .h--product-hero-rs {}
}

@media(min-width: 62rem) {
    .h--product-hero-rs { height: 24rem; }
    .bg--product-hero-rs {
        background-position: center;
        background-size: cover;
    }
    .h--product-gallery-rs { height: 29rem; }
    .w--product-thumbnails-rs { width: 10rem; }
    .w--product-slider-rs { width: calc(100% - 10rem); }
    .nt--icon-grid-row-rs { margin-top: -7rem; }
}

@media(min-width: 78rem) {
    .pv--home-hero-rs { padding-top: 9.5rem; padding-bottom: 4rem; }

    /* gallery */
    .h--product-hero-rs { height: 34rem; }
    .w--click-thumb-rs { width: 6rem; }
    .w--product-thumbnails-rs { width: 15rem; }
    .w--product-slider-rs { width: calc(100% - 15rem); }
}

/* product grid (the responsive is fairly nuanced, so it gets its own section) */
.product-grid-item {
    width: 100%;
    border-width: 0.125rem;
    border: 1px solid #0A0A0A;
}

@media(min-width: 30rem) {
    .product-grid-item {
        width: 50%;
    }
}

.product-grid-item--3outof3,
.product-grid-item--5outof5 {
    width: 100%;
}

@media(min-width: 62rem) {
    .product-grid-item--outof3,
    .product-grid-item--outof5 {
        width: 33.3333%;
    }
    .product-grid-item--4outof5,
    .product-grid-item--5outof5 {
        width: 50%;
        border-bottom-color: transparent;
    }
}

@media(min-width: 78rem) {
    .product-grid-item {
        border-bottom: none;
    }
    .product-grid-item--outof4 {
        width: 25%;
    }
    .product-grid-item--outof5 {
        width: 20%;
    }
}

/* 
 * hero with odd responsive behavior. has the following requirements:
 * 1. place it in wrap
 * 2. place the wrap in a relatively positioned full-width div
 */
.flex-hero {}

.flex-hero__left {}

.flex-hero__right {
    width: calc(50% + 50vw); /* escape the wrap rightwards */
}

@media(min-width: 62rem) {
    .flex-hero {
        display: flex;
        align-items: flex-end;
        width: calc(50% + 50vw); /* escape the wrap rightwards */
    }
    .flex-hero__left, .flex-hero__right {
        flex-shrink: 0;
    }
    .flex-hero__left {
        width: 34rem;
    }
    .flex-hero__right {
        width: 67rem; /* reset rightwards escape (handled by parent) */
    }
}

@media(min-width: 78rem) {
    .flex-hero__left {
        width: 46rem;
    }
}

@media(min-width: 126rem) {
    .flex-hero__right {
        position: absolute;
        right: 0;
        bottom: 0;
    }
}

/**
 * the financing half page requires some peculiar proportions & specific
 * iframe handling... a lot of magic numbers here are hacks to handle the
 * iframe content's container behavior and top/bottom margins
 */
.table-half-page {}
.table-half-page__left {
    max-width: 30rem;
    margin: 0 auto 30px;
    text-align: center;
}
.table-half-page__right {
    margin: 0 auto;
}
.table-half-page__right__iframe-wrapper {
    position: relative;
    /* height of body within iframe, minus top margin, plus 1px border... */
    height: calc(384px - 0.5rem + 1px);
}
.table-half-page__right__iframe-wrapper__iframe {
    position: absolute;
    top: calc(-0.5rem + 1px); /* negate top margin within iframe */
    left: 0;
    height: calc(437px + 0.5rem + 1px); /* height of content + bottom margin */
    border: none;
    width: calc(100% + 21px);
    margin: 0 -10.5px;
}
@media(min-width: 46rem) {
    .table-half-page__left {
    }
    .table-half-page__right {
        width: 519px; /* width of iframe container minus left/right padding */
    }
    .table-half-page__right__iframe-wrapper {
        height: calc(370px - 0.5rem + 1px);
    }
    .table-half-page__right__iframe-wrapper__iframe {
        width: 576px; /* bootstrap breakpoint */
        margin: 0 -28.5px; /* cancel left/right margin/padding */
    }
}
@media(min-width: 62rem) {
    .table-half-page {
        display: flex;
        margin: -2.5rem;
        align-items: center;
    }
    .table-half-page__left,
    .table-half-page__right {
        margin: 0;
        padding: 2.5rem;
    }
    .table-half-page__left {
        width: auto;
        max-width: none;
        text-align: left;
        width: calc(100% - 519px - 5rem);
    }
    .table-half-page__right {
        width: calc(519px + 5rem);
    }
}
@media(min-width: 78rem) {
    .table-half-page__right__iframe-wrapper__iframe {
        width: 768px; /* bootstrap breakpoint */
        margin: 0 -34px;
    }
    .table-half-page__left {
        width: calc(100% - 700px - 5rem);
    }
    .table-half-page__right {
        width: calc(700px + 5rem);
    }
}

/* accordions */
.accordion {
    background-color: rgba(0, 0, 0, 0.8);
    padding: 1.4rem 1.5rem 1.5rem;
    cursor: pointer;
    color: #fff;
    transition: background-color 0.5s, padding 0.5s;
}
.accordion__title {
    display: flex;
    justify-content: space-between;
    font-family: inherit;
    align-items: center;
    margin: 0;
    transition: padding 0.5s;
}
.accordion__title__cross::before,
.accordion__title__cross::after {
    background-color: #fff;
    content: "";
    display: block;
    position: absolute;
    transition: transform 0.5s;
}
.accordion__title__cross::before {
    width: 1.5rem;
    height: 0.125rem;
    left: 0;
    bottom: 0.6875rem;
    transform: rotate(-180deg);
}
.accordion__title__cross::after {
    width: 0.125rem;
    height: 1.5rem;
    top: 0;
    left: 0.6875rem;
    transform: rotate(-90deg);
}
.accordion__title__text {
    width: calc(100% - 2rem);
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 1.5;
}
.accordion__title__cross {
    background-color: transparent;
    border: none;
    transition: transform 0.5s;
    transform: rotate(0deg);
    width: 1.5rem;
    height: 1.5rem;
    position: relative;
}
.accordion__text {
    overflow: hidden;
    cursor: auto;
    font-weight: 400;
    line-height: 1.5;
    padding-top: 1rem;
    transition: padding-top 0.5s;
    font-size: 1rem;
}
.accordion--collapsed {
    background-color: #000;
    padding-bottom: 1.5rem;
}
.accordion--collapsed .accordion__title {
    padding-bottom: 0;
}
.accordion--collapsed .accordion__title__cross::before,
.accordion--collapsed .accordion__title__cross::after {
    transform: rotate(0deg);
}
.accordion--collapsed .accordion__text {
    padding-top: 0;
    height: 0;
}

/* owl carousel */

/* ugly hack to prevent the arrows from showing (shouldn't the options take care of this...?) */
.js-gallery-app__carousel .owl-nav,
.js-gallery-app__mobile-carousel .owl-nav { display: none; }

.owl-dot {
    margin-right: 0.5rem;
}

.owl-dot:last-child {
    margin-right: 0;
}

.owl-dot {
    font-size: 0;
    border: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 9999px;
    color: #fff;
    opacity: 0.2;
    padding: 0;
}

.owl-stage {
    display: flex;
}

.owl-dot.active {
    opacity: 1;
}

.owl-nav.disabled {
    display: none;
}

.owl-prev, .owl-next {
    width: 48px;
    height: 48px;
    border: none;
    background: #343434;
    background-size: 24px;
    background-position: center;
    background-repeat: no-repeat;
    font-size: 0;
    transition: background-color 0.3s;
}

.owl-prev:hover,
.owl-next:hover {
    background-color: #f00f00;
}

.owl-prev {
    background-image: url(../images/glyph-arrow-left.svg);
    margin-right: 16px;
}

.owl-next {
    background-image: url(../images/glyph-arrow-right.svg);
}

/* this is being activated for unclear reasons */
.owl-rtl {
    direction: ltr !important;
}

/* this is being shown for unclear reasons */
.owl-product .owl-nav {
    display: none;
}

.owl-product .owl-dot {
}

/* realized that owl carousel just isnt that good so the product hero uses swiper */

.swiper-pagination {
    position: static;
}

.swiper-pagination-bullet {
    background-color: #c7c7c7;
    opacity: 1;
}

.swiper-pagination-bullet-active {
    background-color: #f00f00;
}

.swiper-button-prev, .swiper-button-next {
    position: absolute;
    height: 100%;
    top: 0;
    margin: 0;
    background: #fff;
    border: none;
}

.swiper-button-prev {
    left: 0;
}

.swiper-button-next {
    right: 0;
}

.swiper-button-prev::after,
.swiper-button-next::after {
    color: rgba(0,0,0,.3);
}

/* forms */

.nested-form form {
    background-color: #0A0A0A;
    color: #fff;
    padding: 2rem;
}

.nested-form label {
    display: block;
    width: 100%;
}

/* contact form 7 adds these */
.nested-form p {
    margin: 0;
}

.nested-form input:not([type=checkbox]):not([type=radio]):not([type=submit]),
.nested-form select,
.nested-form textarea {
    margin-top: 0.5rem; /* push the label upwards */
    display: block;
    width: 100%;
    margin-bottom: 1.5rem;
    -webkit-appearance: none;
    appearance: none;
    border: none;
    padding: 0.75rem;
}

.nested-form select {
    background-image: url(../images/glyph-chevron-down.svg);
    background-repeat: no-repeat;
    background-position: calc(100% - 0.5em) 50%;
}

/* pretty cf7 error messages */
.wpcf7 form.sent .wpcf7-response-output,
.wpcf7 form.invalid .wpcf7-response-output {
    margin-left: 0;
    margin-right: 0;
    background-color: #fff;
    color: #333;
    border: none;
    padding: 1rem 1.5rem 1.1rem 4rem;
    position: relative;
    border-left: 3px solid #4cc853;
}

.wpcf7 form.invalid .wpcf7-response-output {
    border-left-color: #ff0416;
}

.wpcf7-response-output::before {
    font-family: boxicons;
    content: "\ea46";
    position: absolute;
    top: calc(50% - 1rem);
    left: 1rem;
    height: 100%;
    font-size: 2rem;
    color: #4cc853;
    font-weight: 900;
    line-height: 1;
}

.wpcf7 form.invalid .wpcf7-response-output::before {
    color: #f00f00;
    content: "\eac5";
}

/* tab list */

.tablist {
    background: linear-gradient(131deg, var(--Color-Thunder-Darker, #0D0D0D) 13.38%, var(--Color-Thunder, #212121) 85.19%);
}

.tablist__tabs {
    display: flex;
}

.tablist__tabs__tab {
    color: #fff;
    background-color: #0d0d0d;
    -webkit-appearance: none;
    -moz-appearance: none;
    border: none;
    border-right: 1px solid #464646;
    border-bottom: 1px solid #464646;
    padding: 2.5rem 0;
    background-clip: padding-box;
    font-family: Orbitron;
    font-size: 0.625rem;
}

.tablist__tabs__tab:first-child {
    border-left: none;
}

.tablist__tabs__tab:last-child {
    border-right: none;
}

.tablist__tabs__tab--active {
    background-color: transparent;
    border-bottom: none;
    font-weight: 700;
}

.tablist__panel {
    display: none;
}

.tablist__panel--active {
    display: block;
}

.tablist__panel::before,
.tablist__panel::after {
    display: table;
    clear: both;
    content: "";
}

@media(min-width: 30rem) {
    .tablist__tabs__tab {
        font-size: 0.875rem;
    }
}

@media(min-width: 46rem) {
    .tablist__tabs__tab {
        padding: 1.5rem;
        font-size: 1rem;
    }
}

@media(min-width: 62rem) {
    .tabslist__tabs__tab {
        font-size: 1.25rem;
    }
}

/* WordPress & Genesis styles */

.menu, .sub-menu {
    padding: 0;
    margin: 0;
    list-style-type: none;
}

.menu a {
    color: inherit;
    text-decoration: none;
}

.menu-footer li {
	font-weight: 700;
}

.menu-footer li li {
	font-weight: initial;
}

.menu-footer a {
    transition: color 0.15s ease-in;
}

.menu-footer a:not([aria-disabled=true]):hover {
    color: #f00f00;
}

.menu-footer {
	margin-top: -1rem;
}

.menu-footer li {
    margin-top: 1rem;
}

.menu-footer-utility a {
    text-decoration: underline;
    transition: color 0.15s ease-in;
}

.menu-footer-utility a:not([aria-disabled=true]) {
    color: #f00f00;
}

@media(min-width: 46rem) {
	.menu-footer {
		margin-top: -2rem;
	}

	.menu-footer li {
		margin-top: 2rem;
	}
}

/* mobile menu styles */
@media(max-width: 61.9999rem) {
    .menu-header {
        position: absolute;
        top: 100%;
        background-color: #fff;
        color: #000;
        left: 0; 
        width: 100%;
        text-align: center;
        font-size: 1.25rem;
        height: 0;		
		max-height: calc(100vh - 6rem);
		overflow: scroll;
    }

    .menu-header li {
		display: block;	  
		text-align: left;
        padding: 0 1rem;
    }

    .menu-header li:last-child {
        border-bottom: none;
    }

    .menu-header li a {
        padding: 1.125rem 0;
        display: inline-block;
        font-size: 1rem;
    }

    .menu-header .sub-menu {
        height: 0;
        overflow: hidden;
		margin: 0 -1rem;
    }

    .menu-header .sub-menu a {
        font-size: 0.875rem;
    }

    .menu-header .menu-item-has-children {
        direction: rtl; /* put the chevron at the end */
    }

    .menu-header .menu-item-has-children a {
        vertical-align: middle;
		direction: ltr;
    }

    .menu-header .menu-item-has-children::before {
		font-family: boxicons;
		content: '\ea4a';
		vertical-align: middle;
		font-size: 1.4em;
    }

	.menu-header .menu-item-has-children.menu-item-expanded::before {
		content: '\ea57';
	}

    .menu-header .sub-menu {
        font-size: 0.7em;
    }

    .menu-header .sub-menu li {
        background-color: #c7c7c7;
        border-bottom: none;
    }

    .menu-header .sub-menu .sub-menu li {
        background-color: #e7e7e7;
    }

    .menu-item-expanded::before {
        transform: rotate(90deg);
    }
}

/* desktop menu styles */
@media(min-width: 62rem) {
    .menu-header {
        display: inline-flex;
        position: relative;
        margin: 0 -0.5rem;
    }
    .menu-header li {
        display: inline-block;
        position: relative;
    }
    .menu-header li a {
        display: flex;
        position: relative;
        height: 6rem;
        align-items: center;
    }
    .menu-header li a span {
        display: block;
    }
    .menu-header > li > a {
        padding: 0 0.5rem;
    }
    .menu-header:hover > li > a::after,
    .menu-header:hover > li > a > span {
        opacity: 0.5;
        transition: opacity 0.3s;
    }
    .menu-header > li:hover > a::after,
    .menu-header > li:hover > a > span {
        opacity: 1;
    }
    .menu-header > .menu-item-has-children > a::before {
        opacity: 0;
        content: "";
        height: 0.25rem;
        position: absolute;
        width: 100%;
        bottom: 0;
        left: 0;
        background-color: #f00f00;
        transition: opacity 0.3s;
    }
    .menu-header > .menu-item-has-children:hover > a::before {
        opacity: 1;
    }
    .menu-header .sub-menu {
        display: none;
        position: absolute;
        padding: 0;
		top: calc(100%);
        left: 0;
        width: auto;
        min-width: 18.75rem;
        background-color: transparent;
        color: #000;
        z-index: 99;
        margin-right: -99999px;
    }
    .menu-header .sub-menu a {
        height: auto;
        margin: 0;
        display: inline-block;
        padding: 1rem 0;
        vertical-align: middle;
    }
    .menu-header .sub-menu a:not([aria-disabled=true]):hover  {
        background-color: #efefef;
    }
    .menu-header .menu-item-has-children > a::after {
		font-family: boxicons;
		content: '\ea4a';
        font-size: 1.5rem;
        margin-left: 0.25rem;
    }
    .menu-header .sub-menu .sub-menu {
        left: 100%;
        top: 0;
    }
    .menu-header .sub-menu li {
        display: block;
        margin: 0;
		border: none;
        position: relative;
		background-color: #fff;
    }
    .menu-header .sub-menu li a {
        padding: 1rem 1rem;
        width: 100%;
    }
    .menu-header li:hover > .sub-menu {
        display: inline-block;
    }
    .current-menu-item > a > span {
        color: #f00f00;
    }
}

@media(min-width: 78rem) {
    .menu-header {
        margin: 0 -1rem;
    }
    .menu-header > li > a {
        padding: 0 1rem;
    }
}

li::marker {
	color: red;
}

.video-container {
  position: relative;
  width: 100%;
  height: auto;
}

.dark-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 1;
}

.text-overlay {
	z-index:5;
}