  /*JOY BG CIRCLE*/
 @media (max-width: 576px) {
     .u-bgCircle-large::before {
         display: none;
    }
}
/*PRIMARY EVENTS 1 REM GAP*/
 @media (min-width:768px) {
     .imageBanner {
         margin-bottom: 0.5rem;
    }
}
 @media (max-width: 767px) {
     .imageBanner {
         margin-bottom: 0;
    }
}
/*PRIMARY EVENT HEIGHT */
 .imageBanner-image {
     height: 97vh;
}
 @media (max-width: 767px) {
     .imageBanner-image {
         height: 70vh;
         background-position: top;
         margin-bottom: 225px;
    }
}
/*IMAGEBANNER-CONTENT MARGIN*/
 .imageBanner-content {
     margin: 0;
     padding: 0;
}
 .imageBanner-content .container {
     margin-left: 6rem;
     margin-right: 6rem;
     margin-bottom: 4rem;
     padding: 0;
     max-width: none;
     width: auto;
}
 @media (min-width: 768px) and (max-width: 1199px) {
     .imageBanner-content .container {
         margin-left: 3rem;
         margin-right: 3rem;
    }
}
 @media (max-width: 767px) {
     .imageBanner-content .container {
         margin: 0;
    }
}
 .right-align .container {
     display: flex;
     justify-content: flex-end;
}
/*EVENT-DESCRIPTION STYLES*/
 @media (min-width: 768px){
     .imageBanner-content .event-description {
         padding-top: 1.5rem;
         padding-bottom: 1.5rem;
    }
}
 @media (min-width: 1200px) {
     .imageBanner-content .event-description {
         width: 40rem;
    }
}
/*LEFT-ALIGNED EVENT-DESCRIPTION PADDING*/
 .left-align .imageBanner-content .event-description {
     padding-left: 2rem;
     padding-right: 9rem;
}
 @media (min-width: 768px) and (max-width: 1199px) {
     .left-align .imageBanner-content .event-description {
         padding-left: 2rem;
         padding-right: 7.5rem;
         width: 30.6rem;
    }
}
 @media (max-width: 767px) {
     .left-align .imageBanner-content .event-description {
         padding: 1.5rem;
         margin: 0;
         width: 100%;
    }
}
/*RIGHT-ALIGNED EVENT-DESCRIPTION PADDING*/
 .right-align .imageBanner-content .event-description {
     padding-left: 9rem;
     padding-right: 2rem;
}
 @media (min-width: 768px) and (max-width: 1199px) {
     .right-align .imageBanner-content .event-description {
         padding-left: 2rem;
         padding-left: 7.5rem;
         width: 30.6rem;
    }
}
 @media (max-width: 767px) {
     .right-align .imageBanner-content .event-description {
         padding: 1.5rem;
         margin: 0;
         width: 100%;
    }
}
/*FLOATING CIRCLES*/
 .primary-circle {
     position: relative;
}
 .primary-circle-float {
     border-radius: 50%;
     border: 9px solid var(--gfColors-navyAccent);
     object-fit: cover;
     background-repeat: no-repeat;
     background-size: 100%;
     aspect-ratio: 1 / 1;
}
 @media (max-width: 767px){
     .primary-circle-float {
         float: right;
         width: 10rem;
         height: 10rem;
         shape-outside: circle(50% at 50% 50%);
         shape-margin: 1rem;
         clip-path: circle(50% at 50% 50%);
         margin-left: 1rem;
         margin-bottom: 1rem;
         position: static;
    }
}
 @media (max-width: 767px){
     .imageBanner-content :first-child img {
         margin-top: -5.75rem;
    }
}
 @media (min-width: 768px) and (max-width: 1199px){
     .imageBanner-content :first-child img {
         margin-top: -0.25rem;
         margin-bottom: 0;
    }
}
 @media (min-width: 1200px) {
     .imageBanner-content :first-child img {
         margin-top: -2rem;
         margin-bottom: 0;
    }
}
 @media (min-width: 768px) {
     .primary-circle-float {
         position: absolute;
         width: 36%;
    }
}
/*LEFT ALIGNED FLOATING CIRCLES*/
 @media (min-width: 768px) {
     .left-align .primary-circle-float {
         width: 36%;
         right: -18%;
    }
}
/*RIGHT ALIGNED PRIMARY CIRCLES FLOAT*/
 @media (min-width: 768px) {
     .right-align .primary-circle-float {
         position: absolute;
         width: 36%;
         left: -18%;
    }
}
/*SECONDARY EVENTS*/
 @media (min-width:450px) {
     .gold-arrow-doodle {
         position: relative;
    }
     .gold-arrow-doodle::after {
         position: absolute;
         content: "";
         width: 5.6rem;
         height: 8rem;
         bottom: -3.5rem;
         background-image: url(/__template/t1/images/doodle-illustrations/gold-arrow-twisted.png);
         background-repeat: no-repeat;
         background-position: center;
         background-size: 80%;
         transform: rotate(-19deg);
         z-index: 1;
    }
}
 .secondary-events {
     border-bottom: 1px solid var(--gfColors-slate45);
     display: grid;
     grid-template-columns: 1fr 1fr;
     column-gap: 2.5rem;
     margin-block: 2rem;
     padding-bottom: 2rem;
     align-items: center;
     margin-top: 0;
}
 @media (max-width: 767px) {
     .secondary-events {
         grid-template-columns: 1fr;
         padding-bottom: 0;
         border: none;
    }
}
 @media(min-width:768px) {
     #more-events_component h2 {
         margin-bottom: 2.5rem;
    }
}
 .secondary-events:last-child {
     border-bottom: none;
}
 .secondary-image {
     aspect-ratio:5/3;
     position:relative;
     align-self: start;
}
 @media (min-width: 768px) {
     .secondary-events h3 {
         margin-block-start:0;
         font-weight: 500;
    }
}
 @media (max-width: 767px) {
     .secondary-events h3 {
         margin-top: 0.75em;
    }
}
 @media (max-width: 991px){
     .secondary-events img.u-floatRight {
         display: none;
    }
}
 @media (min-width: 1200px) {
     .basketball-doodle {
         position: relative;
    }
     .basketball-doodle::after {
         position: absolute;
         content: "";
         width: 5rem;
         height: 5rem;
         left: 13.5rem;
         top: -1.5rem;
         background-image: url(/__template/t1/images/doodle-illustrations/basketball-doodle.svg);
         background-repeat: no-repeat;
         background-position: center;
         background-size: 80%;
         z-index: 1;
         overflow: hidden;
    }
     .music-doodle {
         position: relative;
    }
     .music-doodle::after {
         position: absolute;
         content: "";
         width: 7rem;
         height: 7rem;
         left: 18rem;
         top: 12rem;
         background-image: url(/__template/t1/images/doodle-illustrations/music-doodle.svg);
         background-repeat: no-repeat;
         background-position: center;
         background-size: 80%;
         z-index: 1;
         overflow: hidden;
    }
}
 @media (max-width: 767px) {
     #only-the-beginning_component .u-autoPro--uppercase{
         font-size: 1.75rem;
    }
     #only-the-beginning_component .u-thirstySoftExtraBold{
         font-size: 2.5rem;
    }
}
/*GET INVOLVED*/
 .gold-ribbon-doodle {
     position: relative;
}
 .gold-ribbon-doodle::after {
     position: absolute;
     content: "";
     width: 15.6rem;
     height: 8rem;
     right: -2rem;
     bottom: -7.5rem;
     background-image: url(/__template/t1/images/doodle-illustrations/gold-loop-horizontal.svg);
     background-repeat: no-repeat;
     background-position: center;
     background-size: 80%;
     transform: rotate(46deg);
     z-index: 1;
     overflow: hidden;
}
 @media (max-width: 1200px) {
     .gold-ribbon-doodle::after {
         display: none;
    }
}
 #get-involved_component .involved-border {
     border: 5px solid var(--gfColors-slate45);
     padding: 3rem;
}
 @media (max-width: 767px) {
     #get-involved_component .involved-border {
         padding: 1.5rem;
    }
}
 @media (min-width: 1200px) {
     #get-involved_component .gold-ribbon-doodle img {
         margin-right: 4rem;
    }
}
/*BOTTOM MARGIN*/
 .ctaButtons {
     margin-top: 3rem;
}
