/****** This includes styles for the Tile Carousel ******/
.row:has(.carousel) {
    --bs-gutter-x: 1.5rem; /* overrides default _grid.css .row style, which allows carousel to render on-screen */
}
.carousel {
    padding-bottom: 100px;
}
.carousel a:not(.nav-link):not(.dropdown-item):not(.btn):not(.fc-event):hover {
     text-decoration:none;
}
 .container h1.heading.carouselHeading {
     margin: 0 auto !important;
}
 .carouselHeading {
     color:var(--brand-color4);
}
 .carousel h1,
 .carousel .h1,
 .carousel h2,
 .carousel .h2,
 .carousel h3,
 .carousel .h3,
 .carousel h4,
 .carousel .h4,
 .carousel h5,
 .carousel .h5,
 .carousel h6,
 .carousel .h6 {
     color: var(--brand-color4);
}
.carousel-inner {
    z-index: 1;
    width: 100%;
    display: flex;
    flex-flow: row wrap;
    aspect-ratio: 3 / 2;
}
.carousel>div.carousel-inner>div.carousel-item>img {
    z-index: 1;
    object-fit: cover;
    object-position: center;
    width: 875px;
    height: 575px;
    aspect-ratio: 3 / 2;
}
 .carousel:focus-visible {
     border: 2px solid #000;
}
 .carousel-text {
     color: var(--brand-color4);
}
 .carousel-caption {
     position: absolute;
     right: 0;
     bottom: 30%;
     left: 0;
     padding-top: 0;
     padding-bottom: 0;
     color: var(--brand-color4);
     text-align: center;
}
 .carousel-indicators {
    margin-bottom: 6.25rem;
}
 .carousel-indicators [data-bs-target] {
     width: 5px;
     height: 5px;
}
 .carousel-item {
     background: transparent;
     height: 100%;
}
 .carousel-indicators [data-bs-target] {
     width: 5px;
     height: 5px;
}
 .carousel-caption a:not(.btn) {
     color: white !important;
}
 .carousel-caption a:not(.btn):hover {
     text-decoration: none !important;
}
.carousel-control-buttons {
    bottom: 3rem;
    display: flex;
    justify-content: center;
    position: absolute;
    width: 100%;
}
.carousel-prev {
    order: 0;
}
.carousel-pause-start-button {
    order: 1;
}
.carousel-next {
    order: 2;
}
.carousel-pause-start-button,
.carousel-prev,
.carousel-next {
    background-color: var(--brand-color9);
    border: 4px solid var(--brand-color12);
    color: var(--brand-color4);
    display: inline-block;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    padding: .375rem .5rem;
    text-align: center;
    text-decoration: none;
    transition: color .15s, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    user-select: none;
    vertical-align: middle;
}
.carousel-pause-start-button {
    padding: .375rem .65rem;
}
.carousel .carousel-pause-start-button:is(:focus-visible, :hover),
.carousel .carousel-prev:is(:focus-visible, :hover),
.carousel .carousel-next:is(:focus-visible, :hover) {
    background-color: var(--brand-color13);
    box-shadow: none;
    color: var(--brand-color9);
}
 .carousel-hero {
    position: absolute;
    z-index: 10;
    margin: 0 auto;
    bottom: 5%;
    left: 8%;
    max-width: 86%;
    height: fit-content;
}
.carousel-hero .heading-wrapper {
    position: absolute;
    bottom: 8%;
    display: inline-flex !important;
    flex-flow: row wrap;
    position: relative;
    left: 0;
}
.carousel-hero .caption {
    position: relative;
    background: rgba(var(--brand-color9-rgb), 0.9);
    border-top: 5px solid var(--brand-color10);
    border-left: 0;
    padding: 1.25rem .6875rem;
    color: var(--brand-color4);
    max-width: 100%;
    text-align: left;
    min-height: 150px;
    margin: 0;
    display: inline-flex !important;
    flex: 1;
}
 .carousel-hero .caption h1.heading {
     display: block;
     text-transform: capitalize;
     color: var(--brand-color4);
     font-size: 1.25rem;
     padding: 0;
     margin: 0;
     font-weight: 400;
}
 .carousel-hero .caption .subheading {
     display: block;
     text-transform: capitalize;
     color: var(--brand-color4);
     font-size: 1rem;
     font-weight: 600;
     line-height: 1.2;
     padding-top: .625rem;
}
 .carousel-hero .caption p {
     display: block;
     color: var(--brand-color4);
     font-size: 0.9rem;
     font-weight: 400;
}
 a.carousel-arrow {
     margin: 0;
     background-color: #0a2244;
     border: 3px solid transparent;
     position: relative;
     width: 6rem;
     left: 0;
}
 a.carousel-arrow:hover {
     background-color: var(--brand-color8);
}
 a.carousel-arrow.heading-arrow {
     background-image: url("data:image/svg+xml, <svg viewBox='0 0 16 16' class='bi bi-arrow-right' fill='white' width='50' height='37' xmlns='http://www.w3.org/2000/svg'><path d='M1 8a.5.5 0 0 1 .5-.5h11.793l-3.147-3.146a.5.5 0 0 1 .708-.708l4 4a.5.5 0 0 1 0 .708l-4 4a.5.5 0 0 1-.708-.708L13.293 8.5H1.5A.5.5 0 0 1 1 8'/></svg>");
     background-repeat: no-repeat;
     vertical-align: middle;
     display:grid;
     background-position: center;
     display: flex;
     float: right;
}
a.carousel-arrow.heading-arrow:is(:focus-visible, :hover) {
    background-image: url("data:image/svg+xml, <svg viewBox='0 0 16 16' class='bi bi-arrow-right' fill='%231051c2c' width='50' height='37' xmlns='http://www.w3.org/2000/svg'><path d='M1 8a.5.5 0 0 1 .5-.5h11.793l-3.147-3.146a.5.5 0 0 1 .708-.708l4 4a.5.5 0 0 1 0 .708l-4 4a.5.5 0 0 1-.708-.708L13.293 8.5H1.5A.5.5 0 0 1 1 8'/></svg>");
    border: 3px solid var(--brand-color9);
    
}
 .banner-location-carousel {
     background: transparent;
     margin: 0;
     z-index: 999;
     width: fit-content;
     display: block;
     clear:both;
     width: 100%;
}
 .location-text.white.shadow-text {
     color: var(--brand-color4);
}
 .carousel-button {
     margin: -5rem auto 4.375rem !important;
     z-index: 999;
     display: block;
     position: relative;
     max-width: 1250px;
}
 #tile-carousel {
     max-width: 1230px;
     margin: 0 auto;
}
 #tile-carousel>div>div.carousel-item.active .card {
     background-color: transparent;
     min-height: 180px;
}
 #tile-carousel img {
     max-width: 50px;
     margin: .9375rem auto 0;
     max-height: 50px;
}
 button.btn.btn-sm.btn-primary.pull-left, button.btn.btn-sm.btn-primary.pull-right {
     background-color: transparent;
     color: white;
     font-size: 1rem;
     border: 0;
}
 .card-img-overlay {
     top: 70px;
     border-radius: 0;
     text-align: center;
     margin: 0 auto;
     display: block;
     max-width: 224px;
}
 
 @media (max-width: 991.98px) {
     .carousel_banner_heading, .carousel_banner_heading a {
         font-size: 5rem;
         line-height: 1;
    }
     .carousel-hero .caption {
         margin: 0 auto;
    }
     .carousel-hero .caption h1.heading {
         text-align: center;
    }
     .carousel-hero .caption .subheading {
         text-align: center;
    }
     .carousel-hero .caption p {
         text-align: center;
    }
     .carousel-hero .caption {
         position: relative;
         background: rgba(var(--brand-color9-rgb), 0.9);
         border-top: 5px solid var(--brand-color10);
         border-left: 0;
         padding: 1.25rem .6875rem;
         color: var(--brand-color4);
         max-width: 100%;
         margin: 0 auto;
         text-align: left;
         min-height: 150px;
         margin: 0;
         display: inline-flex!important;
    }
     .carousel-item {
         height: 100%;
    }
     .caption-arrow {
         float: right;
         margin: 0 auto;
         background-color: var(--brand-color1);
         z-index: 1;
         width: 100%;
         height: 100px;
         min-height: 100%;
    }
     .container-fluid .banner-location-carousel {
         top: 10rem;
         left: 8rem;
    }
     a.carousel-arrow {
         background-color: #0a2244;
    }
     a.carousel-arrow .heading-arrow {
         background-image: url("data:image/svg+xml, <svg viewBox='0 0 16 16' class='bi bi-arrow-right' fill='white' width='50' height='37' xmlns='http://www.w3.org/2000/svg'><path d='M1 8a.5.5 0 0 1 .5-.5h11.793l-3.147-3.146a.5.5 0 0 1 .708-.708l4 4a.5.5 0 0 1 0 .708l-4 4a.5.5 0 0 1-.708-.708L13.293 8.5H1.5A.5.5 0 0 1 1 8'/></svg>");
         background-repeat: no-repeat;
         font-size: 2.25rem;
         vertical-align: middle;
         margin: 0 45%;
    }
    /**************carousel*********************/
     .carousel_banner_heading, .carousel_banner_heading a {
         font-size: 5rem;
         line-height: 1;
    }
     .carousel-hero .caption h1.heading {
         text-align: center;
    }
     .carousel-hero .caption .subheading {
         text-align: center;
    }
     .carousel-hero .caption p {
         text-align: center;
    }
     .carousel-item.active {
         display:flex;
         flex-flow: row wrap;
         height: 100%;
    }
}
 @media (max-width: 790px) {
     .carousel>div.carousel-inner>div.carousel-item>img {
         /*top: 0;*/
         /*right: 0;*/
         /*left: 0;*/
         /*object-fit: cover;*/
    }
    .carousel-hero {
        margin: 0 auto;
        left: 10;
        order: 2;
    }
    .carouselHeading {
        font-size: 20px;
        margin-top: 0; 
        margin-bottom: 0;
    }
     .carousel-hero .caption {
         background: var(--brand-color1);
         flex: 1;
    }
     a.carousel-arrow .heading-arrow {
         transform: rotate(270deg);
    }
     a.carousel-arrow {
         background: #0a2244;
    }
}
 @media (max-width: 768px) {
     
    .carousel>div.carousel-inner>div.carousel-item>img {
        object-fit: cover;
        aspect-ratio: 3 / 2;
        width: 540px;
        height: 340px;
    }
     .container-fluid .banner-location-carousel {
         top: 14.5rem;
         left: 2rem;
    }
     .carousel-hero .caption {
         max-width: 100%;
         margin: 0 auto;
         text-align: center;
         min-height: 50px;
         float: none;
    }
     a.carousel-arrow {
         background-color: #0a2244;
         width: 100%;
         padding: 1rem;
         display: block;
    }
     #tile-carousel {
         max-width: 300px;
         margin: 0 auto;
    }
     .carousel-button {
         margin: -5.0625rem auto 3.125rem auto !important;
         max-width: 60%;
    }
     .carousel-caption {
         position: initial;
         padding: 1.875rem .9375rem;
    }
     .carousel-caption h5, .carousel-caption p {
         text-shadow: none;
    }
     .carousel-caption a:not(.btn) {
         color: initial !important;
    }
     .carousel-indicators {
         display: none;
    }
}