/*Agile Center Centre*/
html {
    scroll-behavior: smooth;
    max-width: 100%;
    overflow-x: hidden;
}

/* Hero */

.hero {
    background-color: var(--brightYellow);
    background-size: cover;
    background-repeat: no-repeat;
}

.hero-item {
    display: flex;
    align-items: center;
}

.hero-logo {
    max-width:500px;
}

.hero-graphic {
    width: 200px;
}

.checkerboard {
    position: relative;
    top: 2.91em;
    right:31em;
}

/* Callouts */

.checkerboard-callout {
    position: relative;
    top:2.95em;

}

.section-two {
    position: relative;
    top: 2.9em;

}

.recordings-callout li {
    padding-bottom: 20px;
}

/* Buttons */

.btn-product {
    min-width: 97% !important;
}

.disabled-link {
    pointer-events: none;
}

.container-cc-narrow {
    width: 85%;
    max-width: 55em;
    margin: 0 auto;
}

p {
    margin-bottom: 1.5rem;
}

.topquote {
    font-size: 1.15rem;
    max-width: 700px;
    display: flex;
    align-items: center;
}

/* Products */

.price {
    color: #8c9b28;
    letter-spacing: 1px;
}
.pricing-img {
    width: 100%;
}

.box-head-ticket {
    display: flex;
    gap: 10px;
}

.box-head-ticket .icon {
    width: 30px;
}

.date {
    max-width: 200px;
}

/* Media query for screens smaller than 768px (typically mobile devices) */
@media only screen and (max-width: 48em) {
    /* Override margin-left for mobile */
    .hero-text {
      margin-left: 0 !important;
    }
}

/* Define a class for the hero text */
.hero-text-2 {
    padding-bottom: 0px;
    margin-left: 8em; /*Default margin-left */
    flex-wrap: wrap;
    align-items: center;
}

/* Media query for screens smaller than 768px (typically mobile devices) */
@media only screen and (max-width: 48em) {
    /* Override margin-left for mobile */
    .hero-text-2 {
        margin-left: 0 !important;
    }
}


@media only screen and (max-width: 54em) {
    .date {
        margin: 0 auto;
    }

    .mobile-view {
        margin: 0px !important;
        width: 100%;
    }

    .mobile-view h2,
    .mobile-view h3,
    .mobile-view p,
    .mobile-view ul {
        padding-left: 25px;
        padding-right: 25px;
    }

  .hero-item {
        display: flex;
        align-items: flex-start;
        flex: 1
    }
    .topquote h3 {
        font-size: 1.25em;
    }



}

@media only screen and (max-width: 48em) {
    .hero-item h2 {
        font-weight: 00;
        
    }

    .mobile-no-pb.py-3 {
        padding-bottom: 0;
    }

    .mobile-no-px {
        padding-left: 0;
        padding-right: 0;
    }

    .mobile-no-pl {
        padding-left: 0;
    }

    .mobile-py-2 {
        padding-left: 2em;
        padding-right: 2em;
    }
}

.divider {
    border-right: 2px solid white;
}

.testimonial-title h4 {
    font-size: 1.4em;
    letter-spacing: 1.5px;
    font-weight: normal;
    padding-bottom: 20px;
}

.testimonial-title h4::before {
    width: 15px;
    height: 15px;
    content: url('/images/quotes.png');
    zoom: 3%;
    margin-right: 5px;
}

@media only screen and (max-width: 48em) {
    .hero-item h2 {
        font-weight: 400;
    }

    .mobile-no-pb.py-3 {
        padding-bottom: 0;
    }
}

@media only screen and (max-width: 48em) {
    
    .divider {
        border-right: 0px solid white;
        border-bottom: 2px solid white;
    }

    .testimonial .pr-3, .testimonial .pl-3 {
        padding-right: 0em !important;
        padding-left: 0em !important;
    }
}

@media (max-width: 48em) {
    .flex-row {
        flex-direction: column;
    }
}