﻿:root {
    --darkest-grey: #343E46;
    --massage-green: #B8D149;
    --dark-grey: #586A77;
    --dark-grey-30: rgba(88, 106, 119, 0.3);
    --darkest-grey-85: rgba(52, 62, 70, 0.85);
    --light-grey: #E6E5E5;
    --light-grey-50: rgba(230,229,229,0.5);
    --dark-grey-20: rgba(88,106,119,0.2);
    --mid-tone-grey: #798893;
    --massage-green-20: rgba(184, 209, 73, 0.2);
}

/**************************/
/* Events */
/**************************/

.homeEvents .dark-bg {
    background: var(--darkest-grey);
    padding: 55px 0px;
}

.homeEvents .dark-bg .flex-wrapper .border-btm,
.events-wrapper .flex-wrapper .border-btm 
{
    display: flex;
    border-bottom: 2px solid #D9D9D9;
    padding-bottom: 20px;
    margin-bottom: 20px;
    align-items: center;
}

.dark-bg .container .row .flex-wrapper:nth-last-of-type(1) .border-btm {
    border-bottom: none;
    padding-bottom: 0px;
    margin-bottom: 0px;
}

section.homeEvents h2 {
    text-align: center;
    margin-bottom: 30px;
}

section.homeEvents h4, 
section.homeEvents p 
{
    color: white;
}

.homeEvents .dark-bg .flex-wrapper .leftCol,
.events-wrapper .flex-wrapper .leftCol
{
    display: flex;
}

.homeEvents .img-wrapper,
.events-wrapper .img-wrapper {
    margin-right: 35px;
}

.homeEvents .date-wrapper p,
.events-wrapper .date-wrapper p {
    display: flex;
    flex-direction: column;
    margin-bottom: 0px;
}

.homeEvents .date-wrapper span.month-year,
.events-wrapper .date-wrapper span.month-year {
    font-size: 18px;
    line-height: 19px;
}

.homeEvents .date-wrapper span.day,
.events-wrapper .date-wrapper span.day {
    font-size: 49px;
    font-weight: bold;
    margin-top: 5px;
    display: block;
    line-height: 37px;
}

.date-wrapper {
    display: flex;
    align-items: center;
    min-width: 60px;
}

.homeEvents .event-btn,
.events-wrapper .event-btn {
    width: 250px;
    font-size: 23px;
    text-align: center;
}

.homeEvents .event-btn:hover,
.homeEvents .event-btn:focus, 
.events-wrapper .event-btn:hover,
.events-wrapper .event-btn:focus 
{
    background: var(--light-grey)!important;
    color: var(--darkest-grey)!important;
}

.homeEvents .rightCol,
.events-wrapper .rightCol {
    margin-left: auto;
}

.homeEvents .middleCol,
.events-wrapper .middleCol {
    flex: 1;
    padding: 0px 75px;
}

.homeEvents .middleCol .details,
.events-wrapper .middleCol .details {
    display: flex;
    align-items: center;
    gap: 30px;
}

.homeEvents .middleCol .flex-wrapper,
.events-wrapper .middleCol .flex-wrapper {
    display: flex;
    align-items: center;
    gap: 7px;
}

.homeEvents .middleCol .flex-wrapper p,
.events-wrapper .middleCol .flex-wrapper p {
    margin-bottom: 0px;
}

.homeEvents .middleCol .flex-wrapper .icon i,
.events-wrapper .middleCol .flex-wrapper .icon i {
    font-size: 17px;
}

.date-wrapper.mobile {
    display: none;
}

p.bottom-button.mobile {
    display: none;
}

.homeEvents .img-wrapper,
.events-wrapper .flex-wrapper .leftCol .img-wrapper {
    flex: 0 0 clamp(180px, 25vw, 265px);
    width: clamp(180px, 25vw, 265px);
    aspect-ratio: 265 / 140;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px;
    box-sizing: border-box;
    border-radius: 5px;
}

.homeEvents .img-wrapper {
    background: #ffffff;
}

.events-wrapper .flex-wrapper .leftCol .img-wrapper {
    background: var(--light-grey-50);
}

.homeEvents .img-wrapper img,
.events-wrapper .flex-wrapper .leftCol .img-wrapper img {
    width: auto;
    height: auto;
    max-width: 92%;
    max-height: 78%;
    object-fit: contain;
}


@media (min-width: 992px) and (max-width: 1199px) {
    /**************************/
    /* Events */
    /**************************/

    .homeEvents .event-btn,
    .events-wrapper .event-btn {
        width: 120px;
        font-size: 20px;
    }

    .homeEvents .date-wrapper span.day,
    .events-wrapper .date-wrapper span.day {
        font-size: 43px;
        line-height: 31px;
    }

    section.homeEvents h4,
    .events-wrapper h4 {
        font-size: 17px;
        line-height: 21px;
    }

    .homeEvents .middleCol, .events-wrapper .middleCol {
        flex: 1;
        padding: 0px 25px;
    }

    .homeEvents .middleCol .details, 
    .events-wrapper .middleCol .details {
        display: block;
    }

    .homeEvents .middleCol .details .location.flex-wrapper,
    .events-wrapper .middleCol .details .location.flex-wrapper {
        margin-bottom: 12px;
    }

    .homeEvents .middleCol .flex-wrapper, .events-wrapper .middleCol .flex-wrapper {
        align-items: baseline;
    }

    .accordion-bg .padding {
        padding-right: 25px!important;
    }

    .accordion-bg .row {
        align-items: flex-start!important;
    }

    .accordion-bg h3 {
        font-size: 22px;
        line-height: 26px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    /**************************/
    /* Events */
    /**************************/

    .homeEvents .event-btn,
    .events-wrapper .event-btn {
        width: 120px !important;
        font-size: 20px;
        padding: 7px 12px !important;
    }

    .date-wrapper {
        align-items: baseline;
    }

    .homeEvents .date-wrapper span.day,
    .events-wrapper .date-wrapper span.day {
        font-size: 43px;
        line-height: 31px;
    }

    section.homeEvents h4,
    .events-wrapper h4 {
        font-size: 17px;
        line-height: 21px;
    }

    .homeEvents .middleCol,
    .events-wrapper .middleCol {
        flex: 1;
        padding: 0px 20px;
    }

    .homeEvents .img-wrapper,
    .events-wrapper .img-wrapper {
        margin-right: 25px;
        width: 160px !important;
        aspect-ratio: 265 / 210;
    }

    .homeEvents .middleCol .details, 
    .events-wrapper .middleCol .details {
        display: block;
    }

    .homeEvents .middleCol .details .location.flex-wrapper,
    .events-wrapper .middleCol .details .location.flex-wrapper {
        margin-bottom: 12px;
    }

    .homeEvents .dark-bg .flex-wrapper .border-btm, .events-wrapper .flex-wrapper .border-btm {
        align-items: flex-start;
    }

    .homeEvents .middleCol .flex-wrapper, .events-wrapper .middleCol .flex-wrapper {
        align-items: baseline;
    }
}

@media (max-width: 767px) {
    /**************************/
    /* Events */
    /**************************/

    .homeEvents .dark-bg .flex-wrapper .border-btm,
    .events-wrapper .flex-wrapper .border-btm {
        display: block;
    }

    .date-wrapper.desktop {
        display: none;
    }

    .homeEvents .dark-bg .flex-wrapper .leftCol,
    .events-wrapper .flex-wrapper .leftCol {
        display: block;
    }

    .homeEvents .img-wrapper,
    .events-wrapper .img-wrapper {
        margin-right: 0px;
        max-width: 100%!important;
    }

    .homeEvents .img-wrapper img,
    .events-wrapper .img-wrapper img {
        width: 100%;
    }

    .homeEvents .middleCol,
    .events-wrapper .middleCol {
        padding: 0px;
        display: flex;
        flex-wrap: wrap;
        margin: 20px 0px;
    }

    .homeEvents .middleCol .detailsm
    .events-wrapper .middleCol .details {
        width: 100%;
    }

    .date-wrapper.mobile {
        margin-bottom: 20px;
    }

    section.homeEvents h4,
    .events-wrapper h4 {
        padding-left: 37px;
        width: 75%;
        display: flex;
        align-items: center;
    }

    .homeEvents .event-btn {
        width: 150px;
        font-size: 20px;
    }

    .homeEvents .dark-bg .flex-wrapper .border-btm,
    .events-wrapper .flex-wrapper .border-btm {
        padding-bottom: 40px;
        margin-bottom: 50px;
    }

    .events-wrapper .rightCol {
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .events-wrapper .rightCol > * {
        flex:1;
        width: 50% !important;
    }

    .events-wrapper .rightCol p {
        margin-bottom: 0px;
    }

    .date-wrapper.mobile {
        display: block;
    }

    .events-wrapper .event-btn {
        width: 100%;
    }

    .accordion-bg .padding {
        padding-right: 0px !important;
        margin-bottom: 30px !important;
    }

    .accordion-bg .row {
        display: block!important;
    }

    .accordion-bg {
        padding: 30px 20px!important;
    }

    .video-container {
        border-radius: 15px!important;
    }

    .homeEvents .middleCol .details > *,
    .events-wrapper .middleCol .details > * {
        flex: 1;
        align-items: baseline;
    }

    .homeEvents .middleCol .details, .events-wrapper .middleCol .details {
        align-items: baseline;
    }
}