@charset "utf-8";
/*------------------------------------------------------------------------- HOME PAGE BANNER SECTIONS
*/
body::before {
    background: url(/images/home-page-bg.jpg) center top no-repeat;
}
.home-banner {
    position: relative;
    border-bottom: 1px solid rgba(255,255,255,0.5);
}
.home-banner .container {
    display: flex;
    flex-flow: row nowrap;
    color: #fff;
    padding: 0;
}
.home-banner .column {
    flex: 1 0 50%;
    aspect-ratio: 1;
    background-size: 100%;
    position: relative;
    width: 100%;
    max-width: 640px;
    display: flex;
    justify-content: center;
}
.home-banner .intro-container {
    width: 55%;
    display: flex;
    flex-flow: column nowrap;
    font-size: 13px;
}
.home-banner .intro-container p {
    display: block;
}
.home-banner .intro-container a {
    color: var(--c3Yellow);
    display: block;
    margin: 10px 0;
    transition: color 0.25s ease;
}
.home-banner .intro-container a:hover {
    color: #fff;
}
.home-banner .button {
    position: absolute;
    right: 40px;
    bottom: 40px;
}

/*------------------------------------------------------------------------- WAIVERFORM BANNER
*/
#waiverformBanner {
    background: linear-gradient(90deg, #000 50%, #eecd58 50%);
}
#waiverformBanner .column:first-of-type {
    background-image: url(/images/waiverform/wf-banner-left.jpg);
}
#waiverformBanner .column:last-of-type {
    background-image: url(/images/waiverform/wf-banner-right.jpg);
}
#waiverformBanner .intro-container {
    transform: translateY(40%);
}

/*------------------------------------------------------------------------- WSSC BANNER
*/
#websiteSpellChecker {
    background: linear-gradient(90deg, #523e6b 50%, #80929e 50%);
}
#websiteSpellChecker .column:first-of-type {
    background-image: url(/images/wssc/wssc-banner-left.jpg)
}
#websiteSpellChecker .column:last-of-type {
    background-image: url(/images/wssc/wssc-banner-right.jpg);
}
#websiteSpellChecker .intro-container {
    transform: translateY(35%);
    width: 65%;
}

/*------------------------------------------------------------------------- DAILY FORECAST BANNER
*/
#dailyForecast {
    background: linear-gradient(90deg, #1f2030 50%, #f0e6dc 50%);
}
#dailyForecast .column:first-of-type {
    background-image: url(/images/dailyforecast/df-banner-left.jpg)
}
#dailyForecast .column:last-of-type {
    background-image: url(/images/dailyforecast/df-banner-right.jpg);
}
#dailyForecast .intro-container {
    transform: translateY(35%);
    width: 65%;}

/*------------------------------------------------------------------------- MOBILE BANNERS
*/
@media (max-width: 767px)
{
    .home-banner .column {
        max-width: none;
    }
    .home-banner .column:last-of-type {
        display: none;
    }
    #waiverformBanner .column:first-of-type {
        background-image: url(/images/waiverform/wf-banner-mobile.jpg);
    }
    #websiteSpellChecker .column:first-of-type {
        background-image: url(/images/wssc/wssc-banner-left-mobile.jpg);
    }
    #dailyForecast .column:first-of-type {
        background-image: url(/images/dailyforecast/df-banner-left-mobile.jpg);
    }
    .home-banner .intro-container p {
        display: none;
    }
}