.fontlt{
    font-size:clamp(21px, 5vw, 50px);
    /*font-family: 'Flama Condensed';*/

}

.fontltb{
    font-size:clamp(21px, 5vw, 40px);
    /*font-family: 'Flama Condensed Basic';*/
}
.fontltc {
    font-size: clamp(16px, 2.3vw, 30px);
    line-height:20px;
    /*font-family: 'Flama Condensed Basic';*/
}

.fontsub{
font-size:clamp(18px, 5vw, 48px);
    /*font-family: 'Flama Condensed Basic';*/
}

.fontsubb{
font-size:clamp(18px, 5vw, 48px);
    /*font-family: 'Flama Condensed';*/
}

.fontbtn {
    font-size: clamp(18px, 5vw, 20px);
}
.fontthanks {
    font-size: clamp(36px, 3.633vw, 80px);
}

.fontthanksb {
    font-size: clamp(24px, 3.633vw, 40px);
}

.fontthanksc {
    font-size: clamp(20px, 3.633vw, 30px);
}

.fontbaristaa {
    font-size: clamp(13px, 3.633vw, 20px);
    color: #1a326d !important;
}

.fontbaristab {
    font-size: clamp(12px, 1.4vw, 20px);
    line-height: 120%;
    color: #fff !important;
    letter-spacing:-0.5px;
}
.fontbaristac {
    font-size: clamp(12px, 2vw, 20px);
    line-height: 120%;
    color: #182e5f !important;
    font-weight:600;
}
.daysa {
    font-family: 'Flama Condensed Basic';
    font-size: clamp(18px, 2vw, 30px);
    font-weight: 600;
    color: #1c2f5c !important;
}

.days {
    font-family: 'Flama Condensed';
    font-size: clamp(28px, 7vw, 80px);
    font-weight: 700;
    color: #1c2f5c !important;
    margin-top: -20px;
}

.month {
    font-family: 'Flama Condensed Basic';
    font-size: clamp(12px, 5vw, 50px);
    font-weight: 500;
    color: #1c2f5c !important;
    /*color: #00ace6 !important;*/
    margin-top: -35px;
}

.time {
    font-size: clamp(12px, 2vw, 22px);
    font-weight: 600;
    color: #1c2f5c !important;
}

.timedo {
    font-size: clamp(12px, 2vw, 20px);
    font-weight: 600;
    color: #00ace6 !important;
}

.accordion-button {
    border-radius: 10px !important;
}
.accordion-header {
    border-radius: 10px !important;
}
.accordion-item {
    border-radius: 10px !important;
    margin-top:10px;
}
.accordion-button:focus {
    box-shadow: none !important; /* Remove the focus outline */
    border-color: #fff !important; /* Set border color to white on focus */
}
.accordion-button:not(.collapsed) {
    background-color: #fff !important; /* Set background to white when active */
    color: #000 !important; /* Adjust text color if needed, e.g., black for contrast */
    box-shadow: none !important; /* Remove the default blue shadow/outline */
    border-color: #fff !important; /* Set border color to white when active */
}

/* Arrow CSS Only - Using CSS content property for Font Awesome 5 */

.accordion-button {
    /* Ensure there's space for the icon on the right */
    padding-right: 2.5rem !important; /* Adjust as needed, default is often 1.25rem */
    position: relative; /* Needed for positioning the ::after pseudo-element */
}

    /* Style and position the Font Awesome icon using ::after */
    .accordion-button::after {
        /* Hide Bootstrap's default background-image arrow and use Font Awesome */
        background-image: none !important;
        font-family: "Font Awesome 5 Free"; /* Specify Font Awesome font */
        font-weight: 900; /* For 'fas' (Solid) icons */
        content: "\f078"; /* Unicode for fa-chevron-down (Font Awesome 5 Solid) */
        position: absolute;
        right: 1.25rem; /* Adjust positioning from the right */
        top: 50%; /* Center vertically */
        transform: translateY(-50%) rotate(0deg); /* Initial position, vertically centered */
        font-size: 1.25rem; /* Adjust icon size */
        color: #007bff; /* Desired blue color for the arrow */
        transition: transform 0.2s ease-in-out; /* Smooth rotation transition */
    }

    /* Rotate the Font Awesome icon when the accordion is open */
    .accordion-button:not(.collapsed)::after {
        transform: translateY(-50%) rotate(180deg); /* Rotate to point up when open */
    }

.offcanvas-backdrop {
    background-color: rgba(0, 0, 0, 0.8) !important;
    opacity: 1 !important;
}