/*** Overall Page & Relative Sizing (REM) ***/
html {
    /*Root scaling - Original 62.5% - 0.520833333vw*/
    font-size: 0.520833333vw;
    background-color: var(--main-background-color);
    font-family: var(--main-font-family);
    color: var(--main-color);
    overflow-x: hidden;
    scroll-behavior: smooth !important;
}

body {
    font-size: 1.4rem;
    overflow-x: hidden;
    scroll-behavior: smooth !important;
}

/* Scaling the Font for Small/Phone Layout */
@media only screen and (max-width: 59.375em)
{
    html {
        font-size: 2.777778vw;
    }    
}

/*** Basic Styles ***/
.noscroll {
    overflow: hidden !important;
}

.alert {
    color: var(--alert-color) !important;
}

/*** Base Elements ***/
a:hover {
    color: var(--high-highlight-color);
}

    a:active {
        color: var(--main-highlight-color);
    }

    a.highlight {
        color: var(--main-highlight-color);
    }

        a.highlight:hover {
            color: var(--high-highlight-color);
        }


        a.highlight:active {
            color: var(--subdued-color);
        }

    /* Subdetail Anchor */
    a.subdetail {
        color: var(--subdetail-color);
        text-decoration: underline;
    }

        a.subdetail:hover {
            color: var(--subdued-color);
        }

        a.subdetail:active {
            color: var(--subdued-hightlight-color);
        }

    /*** Alternative Links ***/
    a.link-prominent {
        color: var(--main-highlight-color);
        text-decoration: underline;
    }

        a.link-prominent:hover {
            color: var(--high-highlight-color);
        }

        a.link-prominent:active {
            color: var(--main-highlight-color-dimmed);
        }

    /*** Utility Classes ***/
    .no-outline:focus {
        outline: none;
    }

    /*** Buttons ***/
    a.button, a.button:link, a.button:visited {
        font-size: 2.2rem;
        font-weight: 500;
        height: 6.8rem;
        letter-spacing: 0.2rem;
        border: 0.2rem solid var(--main-highlight-color);
        color: var(--main-highlight-color);
        /*background-color: var(--main-background-color);*/
        background-color: transparent;
        white-space: nowrap;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        text-align: center;
        padding: 0 2.5rem;
        border-radius: 0.6rem;
        text-decoration: none;
    }

        a.button:hover {
            color: var(--main-highlight-color);
            background-color: var(--main-highlight-color-transparent);
            text-decoration: none;
        }

        a.button:active {
            color: var(--inverted-color);
            background-color: var(--main-highlight-color);
            text-decoration: none;
        }

        a.button.filled, a.button.filled:link, a.button.filled:visited {
            color: var(--inverted-color);
            background-color: var(--main-highlight-color);
        }

            a.button.filled:hover {
                color: var(--inverted-color);
                background-color: var(--high-highlight-color);
                border-color: var(--high-highlight-color);
                text-decoration: none;
            }

            a.button.filled:active {
                color: var(--main-highlight-color);
                background-color: var(--main-background-color);
                text-decoration: none;
            }

        button.button, button.button:link, button.button:visited {
            font-size: 2.2rem;
            font-weight: 500;
            height: 6.8rem;
            letter-spacing: 0.2rem;
            border: 0.2rem solid var(--main-highlight-color);
            color: var(--main-highlight-color);
            /*background-color: var(--main-background-color);*/
            background-color: transparent;
            white-space: nowrap;
            display: flex;
            flex-direction: row;
            justify-content: center;
            align-items: center;
            text-align: center;
            padding: 0 2.5rem;
            border-radius: 0.6rem;
            text-decoration: none;
        }

            button.button:hover {
                color: var(--main-highlight-color);
                background-color: var(--main-highlight-color-transparent);
                text-decoration: none;
            }

            button.button:active {
                color: var(--inverted-color);
                background-color: var(--main-highlight-color);
                text-decoration: none;
            }

            button.button.filled, button.button.filled:link, button.button.filled:visited {
                color: var(--inverted-color);
                background-color: var(--main-highlight-color);
            }

                button.button.filled:hover {
                    color: var(--inverted-color);
                    background-color: var(--high-highlight-color);
                    border-color: var(--high-highlight-color);
                    text-decoration: none;
                }

                button.button.filled:active {
                    color: var(--main-highlight-color);
                    background-color: var(--main-background-color);
                    text-decoration: none;
                }

    a.button-overlay, a.button-overlay:link, a.button-overlay:visited {
        font-size: 2.2rem;
        font-weight: 500;
        height: 6.8rem;
        letter-spacing: 0.2rem;
        color: var(--main-extra-subdued-color);
        background-color: var(--main-background-color);
        white-space: nowrap;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        padding: 0 2.5rem;
        border-radius: 3.4rem;
        text-decoration: none;
    }

        a.button-overlay:hover {
            color: var(--high-highlight-color);
            background-color: var(--main-background-color-dimmed);
            text-decoration: none;
        }

        a.button-overlay:active {
            color: var(--high-highlight-color);
            background-color: var(--main-background-color-dimmed);
            text-decoration: none;
        }

        a.button-overlay span {
            color: var(--main-highlight-color);
            margin-right: 1.5rem;
        }

a.button.small {
    font-size: 1.7rem;
    height: 3.0rem !important;
}
@media only screen and (max-width: 59.375em) {
    a.button.small {
        font-size: 1.1rem;
        height: 2.2rem !important;
    }
}

a.button-utility, a.button-utility:link, a.button-utility:visited {
    font-size: 2.2rem;
    font-weight: 500;
    height: 6.8rem;
    letter-spacing: 0.2rem;
    color: var(--subdetail-color);
    background-color: var(--strong-background-color);
    white-space: nowrap;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    padding: 0 2.5rem;
    border-radius: 0.6rem;
    text-decoration: none;
}

        a.button-utility:hover {
            color: var(--main-highlight-color);
            background-color: var(--strong-highlight-background-color);
            text-decoration: none;
        }

        a.button-utility:active {
            color: var(--high-highlight-color);
            background-color: var(--main-background-color);
            text-decoration: none;
        }

        a.button-utility span {
            margin-right: 1.5rem;
        }

    @media only screen and (max-width: 59.375em) {
        a.button-utility span {
            margin-right: 1rem;
        }
    }

    /*** Text Elements ***/
    h1.major-banner-title {
        font-size: 4.2vw;
        font-weight: 500;
        letter-spacing: 0.7rem;
        line-height: 1.5;
    }

    h1.page-title {
        font-size: 6.0rem;
        font-weight: 500;
        letter-spacing: 0.1em;
        line-height: 1.3;
    }

    h1.major-banner-title-smaller {
        font-size: 2.1vw;
        font-weight: 600;
        letter-spacing: normal;
        line-height: 1.5;
    }

    h5.tiny-banner-subtitle {
        font-size: 1.1vw;
        font-weight: 300;
        letter-spacing: 0rem;
        line-height: 1.5;
    }

    h2.page-info-title {
        font-size: 6.0rem;
        font-weight: 500;
        letter-spacing: 0.1em;
        line-height: 1.3;
    }

    h2.page-section-title {
        font-size: 3.5rem;
        font-weight: 600;
        letter-spacing: 0;
        line-height: 1.3;
    }

    @media only screen and (max-width: 59.375em) {
        h2.page-section-title {
            font-size: 1.8rem !important;
        }
    }

    h5.page-info-tiny-subtitle {
        font-size: 1.6rem;
        font-weight: 300;
        letter-spacing: 0.2rem;
        line-height: 2.0;
    }

    h5.page-info-subtitle {
        font-size: 2.1rem;
        font-weight: 300;
        letter-spacing: 0.2rem;
        line-height: 2.0;
    }

@media only screen and (max-width: 59.375em) {
    h1.major-banner-title {
        font-size: 5.2vw;
        font-weight: 500;
        letter-spacing: 0.3rem;
        line-height: 1.5;
    }

    h1.page-title {
        font-size: 3.0rem;
    }

    h1.major-banner-title-smaller {
        font-size:3.5vw;
        font-weight: 600;
    }

    h5.tiny-banner-subtitle {
        font-size: 4.1vw;
        font-weight: 300;
        letter-spacing: 0rem;
        line-height: 1.5;
    }

    h2.page-info-title {
        font-size: 2.2rem;
        font-weight: 500;
        letter-spacing: 0.1em;
        line-height: 1.3;
    }

    h2.page-section-title {
        font-size: 2.8rem;
    }

    h5.page-info-tiny-subtitle {
        font-size: 1.1rem;
        font-weight: 300;
        letter-spacing: 0rem;
        line-height: 2.0;
        padding: 0 0.5rem;
    }

    h5.page-info-subtitle {
        font-size: 1.1rem;
        font-weight: 300;
        letter-spacing: initial;
        line-height: 1.8;
    }
}

    /*** Gradient Overlays ***/
    .blend-to-strong-background-overlay {
        background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(3,3,3,0.16) 25%, rgba(39,39,39,1) 100%);
    }

    .blend-to-main-background-overlay {
        background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(21,21,21,1) 100%);
    }

    /*** Custom Scrollbar ***/
    /* Works on Firefox */
    .custom-scrollbar {
        scrollbar-width: thin;
        scrollbar-color: var(--high-highlight-color) var(--subdued-color);
    }

        /* Works on Chrome, Edge, and Safari */
        .custom-scrollbar::-webkit-scrollbar {
            width: 1.2rem; /*12px;*/
        }

        .custom-scrollbar::-webkit-scrollbar-track {
            background: var(--subdued-color);
        }

        .custom-scrollbar::-webkit-scrollbar-thumb {
            background-color: var(--high-highlight-color);
            border-radius: 2.0rem; /*20px*/
            ;
            /*border: .1rem solid var(--highlighted-background-border-color);*/
        }

    /*** Toggle Switch (Slider Checkbox) ***/
    .toggle-switch {
        position: relative;
        display: inline-block;
        /*width: 6.0rem;*/
        height: 3.0rem;
    }

        .toggle-switch input {
            opacity: 0;
            width: 0;
            height: 0;
        }

    .toggle-slider {
        position: absolute;
        cursor: pointer;
        top: 0;
        left: 0;
        bottom: 0;
        width: 6.0rem;
        height: 3.0rem;
        background-color: var(--subdetail-color);
        -webkit-transition: .4s;
        transition: .4s;
        border-radius: 1.5rem;
    }

        .toggle-slider:before {
            position: absolute;
            content: "";
            height: 2.4rem;
            width: 2.4rem;
            left: 0.3rem;
            bottom: 0.3rem;
            background-color: var(--strong-background-color);
            -webkit-transition: .4s;
            transition: .4s;
            border-radius: 50%;
        }

    .toggle-text {
        position: absolute;
        cursor: pointer;
        top: 0;
        left: 7rem;
        bottom: 0;
        right: 0;
        color: var(--subdetail-color);
        display: flex;
        flex-direction: row;
        align-items: center;
        font-size: 2.8rem;
    }

    .toggle-switch input:checked + .toggle-slider + .toggle-text {
        color: var(--main-highlight-color);
        background-color: green;
    }

    .toggle-switch input:checked + .toggle-slider {
        background-color: var(--main-highlight-color);
    }

    .toggle-switch input:focus + .toggle-slider {
        box-shadow: 0 0 0.1rem var(--main-highlight-color);
    }

    .toggle-switch input:checked + .toggle-slider:before {
        -webkit-transform: translateX(3.0rem);
        -ms-transform: translateX(3.0rem);
        transform: translateX(3.0rem);
    }

    /*** Toggle Switch (Slider Checkbox) - Viewport Sized ***/
    .toggle-switch-viewport {
        position: relative;
        display: inline-block;
        /*width: 6.0rem;*/
        height: 1.5625vw;
    }

        .toggle-switch-viewport input {
            opacity: 0;
            width: 0;
            height: 0;
        }

    .toggle-slider-viewport {
        position: absolute;
        cursor: pointer;
        top: 0;
        left: 0;
        bottom: 0;
        width: 3.125vw;
        height: 1.5625vw;
        background-color: var(--subdetail-color);
        -webkit-transition: .4s;
        transition: .4s;
        border-radius: 0.78125vw;
    }

        .toggle-slider-viewport:before {
            position: absolute;
            content: "";
            height: 1.25vw;
            width: 1.25vw;
            left: 0.15625vw;
            bottom: 0.15625vw;
            background-color: var(--strong-background-color);
            -webkit-transition: .4s;
            transition: .4s;
            border-radius: 50%;
        }

    .toggle-text-viewport {
        position: absolute;
        cursor: pointer;
        top: 0;
        left: 3.645833vw;
        bottom: 0;
        right: 0;
        color: var(--subdetail-color);
        display: flex;
        flex-direction: row;
        align-items: center;
        font-size: 1.45833vw;
    }

    .toggle-switch-viewport input:checked + .toggle-slider-viewport + .toggle-text-viewport {
        color: var(--main-highlight-color);
        background-color: green;
    }

    .toggle-switch-viewport input:checked + .toggle-slider-viewport {
        background-color: var(--main-highlight-color);
    }

    .toggle-switch-viewport input:focus + .toggle-slider-viewport {
        box-shadow: 0 0 0.1rem var(--main-highlight-color);
    }

    .toggle-switch-viewport input:checked + .toggle-slider-viewport:before {
        -webkit-transform: translateX(1.5625vw);
        -ms-transform: translateX(1.5625vw);
        transform: translateX(1.5625vw);
    }

    /*** Navigation ***/
    .main-nav {
        display: block;
        height: 11.6rem;
        max-height: 11.6rem;
    }

        .main-nav ul {
            height: 100%;
            list-style: none;
            padding-left: 0;
            display: flex;
            flex-direction: row;
            justify-content: space-evenly;
            align-items: center;
        }

        .main-nav .logo {
            width: 36.5rem;
            height: 5.8rem;
        }

        .main-nav .main-nav-spacer {
            width: 30.0rem;
            height: 1.0rem;
        }

        .main-nav a.text-menu, .main-nav a.text-menu:link, .main-nav a.text-menu:visited {
            font-size: 1.8rem;
            font-weight: 400;
            letter-spacing: 0.3rem;
            color: var(--main-color);
            text-decoration: none;
        }

            .main-nav a.text-menu:hover {
                color: var(--high-highlight-color);
                text-decoration: underline;
            }

            .main-nav a.text-menu.active {
                color: var(--main-highlight-color);
                text-decoration: underline;
            }

        .main-nav div.search {
            width: 28.3rem;
            height: 5.6rem;
            border-width: 0.2rem;
            border-color: var(--subdued-color);
            border-radius: 1.0rem;
            /*border-style: solid;*/
            display: flex;
            flex-direction: row;
            justify-content: space-between;
            align-items: center;

            /*Remove to readd search*/
            border-style: none;
        }

            .main-nav div.search input {
                font-size: 1.6rem;
                border: none;
                background-color: transparent;
                color: var(--subdued-color);
                margin-left: 1.0rem;

                /*Remove to readd search*/
                display: none;
            }

                .main-nav div.search input:active {
                    border: none;
                }

    #menu-user-account {
        width: 3.1rem;
        height: 3.4rem;
        display: block;
    }

        #menu-user-account svg {
            width: 3.1rem;
            height: 3.4rem;
            fill: var(--main-highlight-color); /*original = rgba(212,175,55,1);*/
        }

        #menu-user-account:hover svg {
            fill: var(--high-highlight-color);
        }

        #menu-user-account:active svg {
            fill: var(--subdued-color);
        }

    #menu-user-login {
        width: 3.1rem;
        height: 3.4rem;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

        #menu-user-login svg {
            width: 3.1rem;
            height: 3.4rem;
            fill: var(--main-highlight-color); /*original = rgba(212,175,55,1);*/
        }

        #menu-user-login:hover svg {
            fill: var(--high-highlight-color);
        }

        #menu-user-login:active svg {
            fill: var(--subdued-color);
        }

    #button-keyword-search {
        /*display: inline-block;*/
        width: 3.0rem;
        height: 3.2rem;
        margin: 0 1.5rem;
        /*Remove to readd search*/
        display: none;
    }

        #button-keyword-search path {
            fill: var(--subdued-color);
            stroke: var(--subdued-color);
            stroke-width: 0.1rem;
            stroke-linejoin: miter;
            stroke-linecap: butt;
            stroke-miterlimit: 4;
            shape-rendering: auto;
        }

        #button-keyword-search:hover path {
            fill: var(--subdued-hightlight-color);
            stroke: var(--subdued-hightlight-color);
        }

        #button-keyword-search:active path {
            fill: var(--inverted-color);
            stroke: var(--inverted-color);
        }

/* Navigation Small / Phone Layout*/
.phone-nav {
    display: none;
    height: 6rem;
    background-color: var(--main-background-color);
    overflow: hidden;
}

    .phone-nav .phone-nav-bar {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        height: 6rem;
    }

    .phone-nav .logo-link {
        height: 3.5rem;
        margin: 1.25rem 2rem;
    }

    .phone-nav .logo {
        height: 100%;        
    }

    .phone-nav .phone-nav-menu-button {
        margin: 0 2rem;
        font-size: 2.8rem;
    }

    .phone-nav .phone-nav-menu {
        display: none;
        overflow-y: scroll;
        position: absolute;
        left: 0;
        top: 6rem;
        right: 0;
        bottom: 0;
        scrollbar-width: thin;
        scrollbar-color: #999 #333;
    }

        .phone-nav .phone-nav-menu::-webkit-scrollbar {
            width: 0.5rem;
            height: 0.5rem;
        }

        .phone-nav .phone-nav-menu::-webkit-scrollbar-thumb { /* Foreground */
            background: #999;
        }

        .phone-nav .phone-nav-menu::-webkit-scrollbar-track { /* Background */
            background: #333;
        }

        .phone-nav .phone-nav-menu .phone-nav-menu-area {
        }

        .phone-nav .phone-nav-menu .phone-nav-menu-login {
            display: flex;
            flex-direction: row;
            justify-content: space-evenly;
        }

            .phone-nav .phone-nav-menu .phone-nav-menu-login .button {
                width: 16rem;
                height: 5.6rem;
                font-size: 2.0rem;
            }

                .phone-nav .phone-nav-menu .phone-nav-menu-login .button span {
                    margin-right: 1.8rem;
                }

    .phone-nav div.search {
        margin: 2rem 2rem;
        width: 32rem;
        /*height: 5.6rem;*/
        border-width: 0.2rem;
        border-color: var(--subdued-color);
        border-radius: 1.0rem;
        /*border-style: solid;*/
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;

        /*Remove to readd search*/
        border-style: none;
        height: 0rem;
    }

        .phone-nav div.search input {
            font-size: 1.6rem;
            border: none;
            background-color: transparent;
            color: var(--subdued-color);
            margin-left: 1.0rem;

            /*Remove to readd search*/
            display: none;
        }

            .phone-nav div.search input:active {
                border: none;
            }

        /*Remove to readd search*/
        .phone-nav div.search a {
            display: none;
        }

    .phone-nav ul {
        margin-left: 2.5rem;
    }

        .phone-nav ul li {
            margin-bottom: 1.2rem;
        }

    .phone-nav a.text-menu, .phone-nav a.text-menu:link, .phone-nav a.text-menu:visited {
        font-size: 1.8rem;
        font-weight: 400;
        letter-spacing: 0.3rem;
        color: var(--main-color);
        text-decoration: none;
    }

        .phone-nav a.text-menu:hover {
            color: var(--high-highlight-color);
            text-decoration: underline;
        }

        .phone-nav a.text-menu:active {
            color: var(--subdued-color);
            text-decoration: underline;
        }

        .phone-nav a.text-menu.active {
            color: var(--main-highlight-color);
            text-decoration: underline;
        }

    .phone-nav .menu-divider {
        margin: 1.5rem 0;
        border: 0;
        border-top: 0.2rem solid var(--highlighted-background-border-color);
    }

    .phone-nav .account-icon {
        width: 3.1rem;
        height: 3.4rem;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        margin-left: 2rem;
        margin-bottom: 2rem;
    }

        .phone-nav .account-icon svg {
            width: 3.1rem;
            height: 3.4rem;
            fill: var(--main-highlight-color);
        }

    .phone-nav.active {
        position: fixed;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        height: auto;
        z-index: 1000;
    }

        .phone-nav.active .phone-nav-menu {
            display: block;
        }

@media only screen and (max-width: 59.375em) {
    /*Hide Text Menu*/
    .main-nav {
        display: none;
    }

    .phone-nav {
        display: block;
    }
}

    /***Spacers***/
    .section-spacer-small {
        margin-top: 4.0rem;
    }

    .section-spacer-moderate {
        margin-top: 9.0rem;
    }

    .section-spacer-large {
        margin-top: 16.0rem;
    }

    .section-spacer-moderate-seperator {
        margin-top: 4.5rem;
        margin-bottom: 4.5rem;
        border-top: 0.2rem solid var(--border-color);
    }

@media only screen and (max-width: 59.375em) {
    .section-spacer-small {
        margin-top: 0;
        height: 3.0rem;
    }

    .section-spacer-moderate {
        margin-top: 4.0rem;
    }

    .section-spacer-large {
        margin-top: 8.0rem;
    }

    .section-spacer-moderate-seperator {
        margin-top: 2.5rem;
        margin-bottom: 2.5rem;
        border-top: 0.2rem solid var(--border-color);
    }
}

    /*** Footer ***/
    footer.footer-root {
    }

        footer.footer-root .footer-divider {
            border: 0;
            border-top: 0.2rem solid var(--highlighted-background-color);
        }

        footer.footer-root .footer-symbol {
            margin-top: 8.0rem;
            display: flex;
            flex-direction: row;
            justify-content: center;
        }

            footer.footer-root .footer-symbol img {
                width: 12.9rem;
                height: 12.9rem;
            }

        footer.footer-root .footer-links {
            margin-top: 6.0rem;
            display: flex;
            flex-direction: row;
            justify-content: center;
            column-gap: 5.5rem;
        }

            footer.footer-root .footer-links a {
                font-size: 1.8rem;
            }

        footer.footer-root .footer-copyright {
            margin-top: 2.0rem;
            margin-bottom: 2.0rem;
            text-align: center;
        }

        footer.footer-root .footer-terms {
            margin-top: 1.2rem;
            display: flex;
            flex-direction: row;
            justify-content: center;
        }

        footer.footer-root .footer-social {
            margin-top: 2.0rem;
            display: flex;
            flex-direction: row;
            justify-content: center;
            column-gap: 1.5rem;
        }

            footer.footer-root .footer-social .social-link {
                background-color: var(--main-color);
            }

                footer.footer-root .footer-social .social-link:hover {
                    background-color: var(--high-highlight-color);
                }

                footer.footer-root .footer-social .social-link:active {
                    background-color: var(--main-highlight-color);
                }

                footer.footer-root .footer-social .social-link.facebook {
                    mask: url(/img/vector/facebook.svg) no-repeat center;
                    -webkit-mask: url(/img/vector/facebook.svg) no-repeat center;
                    mask-size: cover;
                    -webkit-mask-size: cover;
                    width: 1.0rem;
                    height: 3.0rem;
                    margin-right: 0.7rem;
                }

                footer.footer-root .footer-social .social-link.instagram {
                    mask: url(/img/vector/instagram.svg) no-repeat center;
                    -webkit-mask: url(/img/vector/instagram.svg) no-repeat center;
                    mask-size: cover;
                    -webkit-mask-size: cover;
                    width: 2.0rem;
                    height: 3.0rem;
                }

                footer.footer-root .footer-social .social-link.tiktok {
                    mask: url(/img/vector/tiktok.svg) no-repeat center;
                    -webkit-mask: url(/img/vector/tiktok.svg) no-repeat center;
                    mask-size: cover;
                    -webkit-mask-size: cover;
                    width: 2.2rem;
                    height: 3rem;
                }

                footer.footer-root .footer-social .social-link.youtube {
                    mask: url(/img/vector/youtube.svg) no-repeat center;
                    -webkit-mask: url(/img/vector/youtube.svg) no-repeat center;
                    mask-size: cover;
                    -webkit-mask-size: cover;
                    width: 2.0rem;
                    height: 3.0rem;
                }

@media only screen and (max-width: 59.375em) {
    footer.footer-root {
    }

        footer.footer-root .footer-divider {
        }

        footer.footer-root .footer-symbol {
            margin-top: 3.0rem;
        }

            footer.footer-root .footer-symbol img {
                width: 7rem;
                height: 7rem;
            }

        footer.footer-root .footer-links {
            flex-direction: column;
            justify-content: flex-start;
            align-items: center;
            margin-top: 3.0rem;
            column-gap: 0;
            row-gap: 2rem;
        }

            footer.footer-root .footer-links a {
                font-size: 1.8rem;
            }

        footer.footer-root .footer-copyright {
            font-size: 1.5rem;
        }

        footer.footer-root .footer-terms {
            margin-top: 2.5rem;
            font-size: 1.8rem;
        }

        footer.footer-root .footer-social {
            margin-top: 2.5rem;
            column-gap: 2.5rem;
        }

            footer.footer-root .footer-social .social-link {
            }

                footer.footer-root .footer-social .social-link:hover {
                }

                footer.footer-root .footer-social .social-link:active {
                }

                footer.footer-root .footer-social .social-link.facebook {
                    width: 2.0rem;
                    height: 4.0rem;
                    margin-right: 0.7rem;
                }

                footer.footer-root .footer-social .social-link.instagram {
                    width: 4.0rem;
                    height: 4.0rem;
                }

                footer.footer-root .footer-social .social-link.tiktok {
                    width: 4.4rem;
                    height: 4.4rem;
                }

                footer.footer-root .footer-social .social-link.youtube {
                    width: 4.0rem;
                    height: 4.0rem;
                }
}

@media only screen and (max-width: 59.375em) {

    .moreless-button {
        margin-bottom: 1rem;
        font-size: 1.5rem;
        float: left;
        border-bottom: 0.1rem solid;
    }

        .moreless-button .less {
            display: none;
        }

    .moretext {
        height: 20vh;
        overflow: hidden;
        padding-bottom: 1rem;
        -webkit-mask-image: linear-gradient(0deg, transparent 1.6rem, black 6.6rem);
        padding-bottom: 1rem;
    }

        .moretext.show-all {
            height: auto;
            overflow: unset;
            -webkit-mask-image: none;
        }
}



.modal {
    background: #FFF;
    width: 80%;
    height: 80%;
    text-align: center;
    box-shadow: 0 0 4.0rem 1.0rem rgba(0,0,0,0.5);
    -moz-box-shadow: 0 0 4.0rem 1.0rem rgba(0,0,0,0.5);
    -webkit-box-shadow: 0 0 4.0rem 1.0rem rgba(0,0,0,0.5);
    position: fixed;
    line-height: 2.5rem;
    z-index: 99;
    transform: translate(-50%, -50%);
    left: 50%;
    top: 50%;
    background: var(--highlighted-background-color);
    display: flex;
    justify-content: center;
    align-items: center;
}

    .modal .close {
        position: absolute;
        right: 1.5rem;
        top: 1.5rem;
        font-size: 2.4rem;
    }

.modal-bg {
    background: #151515;
    zoom: 1;
    opacity: 0.8;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 9;
}


.main-nav div#nav {
    position: relative;
}

    .main-nav div#nav .dropdown-toggle {
        padding: 0;
    }


/**** ****/
    .main-nav div#nav ul.dropdown {
        display: none;
        position: absolute;
        padding: 0.5rem 3.0rem 0.5rem 3.0rem;
        height: auto;
        right: 0;
        z-index: 100;
        top: 7.0rem;
        min-width: 28.0rem;
        background: #151515 0% 0% no-repeat padding-box;
        box-shadow: 0 0.3rem 0.6rem #00000080;
    }

    .main-nav div#nav ul.dropdown li {
        list-style-type: none;
        margin: 2.5rem 0;
    }

    .main-nav div#nav ul.dropdown li a {
        text-decoration: none;
        display: block;
        font-size: 1.6rem;
        letter-spacing: 0.22rem;
        color: #ECEEEF;
        text-transform: uppercase;
    }

    .main-nav div#nav ul.dropdown li a:hover {
        color: #D4AF37;
    }


.ydl {
    background: white;
    color: #000000;
}

.ydl .main-nav {
    background: #FAFAFA 0% 0% no-repeat padding-box;
    box-shadow: 0 0.3rem 2.0rem #00000029;
    display: flex;
    align-content: center;
}

    .ydl .main-nav .container {
        margin-bottom: 0;
    }

    .ydl .main-nav .logo-link {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        height: 100%;
        display: flex;
        align-items: center;
    }

    .ydl .main-nav .main-nav-links {
        height: 100%;
    }

    .ydl .main-nav .main-nav-links ul li {
        margin-right: 5.0rem;
    }

    .ydl .main-nav .main-nav-links.left {
        float: left;
    }

    .ydl .main-nav .main-nav-links.right {
        float: right;
    }

    .ydl .main-nav a.text-menu, .ydl .main-nav a.text-menu:link,
    .ydl .main-nav a.text-menu:visited {
        color: #000000;
    }

        .ydl .main-nav a.text-menu.active {
            text-decoration: none;
            color: #79146A;
        }

        .ydl .main-nav a.text-menu:hover {
            text-decoration: none;
            color: #79146A !important;
        }

.ydl #menu-user-account svg {
    fill: #79146a;
}

.ydl #button-keyword-search:hover path {
    fill: #79146a;
    stroke: #79146a;
}

.ydl a.button,
.ydl a.button:link,
.ydl a.button:visited {
    border-color: #79146A;
    color: #79146A;
}

    .ydl div.top-major-banner {
        color: #fff;
    }

    .ydl a.button:hover {
        background: rgba(121,20,106, 0.2);
    }

    .ydl .slide-arrow-down .slide-arrow-down-icon,
    .ydl .slide-arrow-down .slide-arrow-down-icon:link,
    .ydl .slide-arrow-down .slide-arrow-down-icon:visited,
    .ydl .slide-arrow-right .slide-arrow-right-icon,
    .ydl .slide-arrow-right .slide-arrow-right-icon:link,
    .ydl .slide-arrow-right .slide-arrow-right-icon:visited,
    .ydl .slide-arrow-left .slide-arrow-left-icon,
    .ydl .slide-arrow-left .slide-arrow-left-icon:link,
    .ydl .slide-arrow-left .slide-arrow-left-icon:visited {
        background-color: #79146A;
    }

    .ydl a.button.filled:hover {
        border-color: #79146A;
    }

        .ydl .slide-arrow-down .slide-arrow-down-icon:hover,
        .ydl .slide-arrow-right .slide-arrow-right-icon:hover,
        .ydl .slide-arrow-left .slide-arrow-right-icon:hover {
            background-color: #A15A96;
        }


    .ydl div.join-now-options {
        background: #ECE9ED
    }

        .ydl div.join-now-options .join-now-options-2 {
            background: #695A74;
            color: #fff;
        }

        .ydl div.join-now-options .button.filled {
            background: #79146A 0% 0% no-repeat padding-box;
            border: 0.4rem solid #79146A;
            color: #fff;
        }

    .ydl div.interior-major-banner {
        color: #fff;
    }

    .ydl div.instructors-list .instructors-list-item .instructors-list-detail,
    .ydl div.text-banner {
        background: #F6F5F9;
    }

    .ydl div.articles-list .articles-list-item .articles-list-detail,
    .ydl div.articles-list .articles-list-item .articles-list-subdetail {
        background: #262626;
        color: #fff;
    }

    .ydl div.articles-list .articles-list-item .articles-list-date {
        color: #79146A;
    }

    .ydl a:hover {
        color: #79146A;
    }

    .ydl footer .footer-links-list {
        float: right;
    }

    .ydl footer .footer-links-list li {
        display: block;
        float: left;
        margin-right: 5.0rem;
        font-size: 1.6rem;
    }

        .ydl footer .footer-links-list li:last-child {
            margin-right: 0;
        }

    .ydl footer.footer-root .footer-social .social-link {
        background-color: #79146A;
    }

    .ydl footer.footer-root .footer-social {
        justify-content: right;
        margin-top:0;
    }