/*Element colours*/
.bkst-col-primary-green {
    color: #275D38;
}

.bkst-col-primary-gold {
    color: #F2CD00;
}

.bkst-col-secondary-orange{
    color:#F68D23;
}

.bkst-col-digital-white{
    color:#F5F5F5;
}

.bkst-col-black{
    color:#2B292A;
}

/*Background colours*/
.bkst-bkgd-col-primary-green {
    background-color: #275D38;
}

.bkst-bkgd-col-primary-gold {
    background-color: #F2CD00;
}

.bkst-bkgd-col-light-orange{
    background-color:#FDCEA2;
}

.bkst-bkgd-col-light-yellow{
    background-color:#FBEFB2;
}

.bkst-bkgd-col-black{
    background-color:#2B292A;
}

.bkst-bkgd-col-secondary-teal-tint{
    background-color:#E1F2EF;
}

.bkst-bkgd-col-secondary-blue-tint{
    background-color:#d3ddf1;
}

.bkst-bkgd-col-2026-planner-pink{
    background-color:#F2BFC1;
}

/*Buttons*/
.bkst-banner-button-green {
    font-size:18px;
    letter-spacing:0.15rem;
    font-weight:500;
    border:2px solid;
    border-color:#275D38;
    color:#275D38 !important;
    background-color:transparent;
    text-transform:uppercase !important;
    width:auto;
    padding: 13px 20px;
}

.bkst-banner-button-green:hover{
    background-color:#275D38 !important;
    color:white !important;
    border:2px solid transparent;
}

.bkst-banner-button-gold {
    font-size:18px;
    letter-spacing:0.15rem;
    font-weight:500;
    border:2px solid;
    border-color:#F2CD00;
    color:#F2CD00 !important;
    background-color:transparent;
    text-transform:uppercase !important;
    width:auto;
    padding: 13px 20px;
}

.bkst-banner-button-gold:hover{
    background-color:#F2CD00 !important;
    color:#275D38 !important;
    border:2px solid transparent;
}

.bkst-banner-button-orange {
    font-size:18px;
    letter-spacing:0.15rem;
    font-weight:500;
    border:2px solid;
    border-color:#F68D23;
    color:#275D38;
    background-color:transparent;
    text-transform:uppercase !important;
    width:auto;
    padding: 13px 20px;
}

.bkst-banner-button-orange:hover{
    background-color:#F68D23 !important;
    color:#275D38;
    border:2px solid transparent;
}

/*Background patterns*/
.bkst-bkgd-pattern-confetti-gold {
    background-color: #F2CD00;
    background-image: url("/site/homepage-images/bkst-gold-confetti-background.png");
    background-size: cover;
    background-repeat: no-repeat;
}

.fph-bkgd-pattern-light-orange{
    background-color: #FDCEA2;
    background-image: url("/site/homepage-images/fph-background-pattern-light-orange.png");
    background-size: cover;
    background-repeat: no-repeat;
}

.bkst-bkgd-pattern-gold-dots{
    background-color: #F2CD00;
    background-image: url("/site/homepage-images/bkst-gold-dots-bkgd.png");
    background-size: cover;
    background-repeat: no-repeat;
}

.bkst-bkgd-pattern-falling-leaves{
    background-color: #FFEDCE;
    background-image: url("/site/homepage-images/bkst-falling-leaves-bkgd.jpg");
    background-size: cover;
    background-repeat: no-repeat;
}

.bkst-bkgd-pattern-snowflakes{
    background-color: #CAE3DE;
    background-image: url("/site/homepage-images/bkst-snowflakes-bkgd.jpg");
    background-size: cover;
    background-repeat: no-repeat;
}

.bkst-bkgd-pattern-snowflakes-dkr-blue{
    background-color:#D2DDF1;
    background-image: url("/site/homepage-images/bkst-snowflakes-bkgd-secondary-blue-tint.jpg");
    background-size: cover;
    background-repeat: no-repeat;
}

/*BANNER TYPOGRAPHY*/
/*Top tag and breakpoints*/
.bkst-banner-top-tag {
    font-family: "Roboto", Helvetica, Arial, Helvetica, sans-serif !important;
    font-weight: 700 !important;
    font-size: 24px;
    text-transform: uppercase;
    letter-spacing: -0.48px;
    width: fit-content;
    padding: 9px 18px 9px 60px;
    margin-bottom: 30px;
    text-align: left;
}

@media(max-width:800px) {
    .bkst-banner-top-tag {
        font-size: 16px;
        padding: 9px 18px 9px 30px;
        margin-bottom: 20px;
    }
}

@media(max-width:540px) {
    .bkst-banner-top-tag {
        text-align: center;
        padding: 9px 18px 9px 18px;
    }
}

/*Header and breakpoints*/
h1.bkst-banner-heading {
    font-family: "Roboto Slab", "Roboto", Helvetica, Arial, Helvetica, sans-serif !important;
    font-weight: 700 !important;
    font-size: 48px !important;
    text-align: left;
    margin-bottom: 20px !important;
}

@media(max-width:800px) {
    h1.bkst-banner-heading {
        font-size: 32px !important;
        margin-bottom: 15px !important;
    }
}

@media(max-width:540px) {
    h1.bkst-banner-heading {
        /*font-size: 24px !important;*/
        text-align: center;
        /*margin-bottom: 10px;*/
    }
}

/*Paragraph and breakpoints*/
p.bkst-banner-copy {
    font-family: "Roboto", Helvetica, Arial, Helvetica, sans-serif !important;
    font-weight: 500 !important;
    font-size: 20px;
    text-transform: none;
    /*color: #275D38;*/
    margin-bottom: 30px !important;
}

@media(max-width:800px) {
    p.bkst-banner-copy {
        font-size: 16px;
        margin-bottom: 20px;
    }
}

@media(max-width:540px) {
    p.bkst-banner-copy {
        margin-bottom: 15px;
    }
}

/*BANNER CONTAINERS*/
/*Main banner container and breakpoints*/
.bkst-banner-container {
    max-width: 1629px;
    height: 457px;
    display: flex;
    align-items: center;
    margin-bottom: 30px;
}

@media(max-width:800px) {
    .bkst-banner-container {
        max-width: 800px;
        height: 420px;
    }
}

@media(max-width:540px) {
    .bkst-banner-container {
        max-width: 540px;
        height: auto;
        display:flex;
        flex-direction: column-reverse;
    }
}

@media(max-width:320px) {
    .bkst-banner-container {
        max-width: 320px;
        height:auto;
    }
}

/*top-level copy container and breakpoints*/
.bkst-banner-copy-container {
    max-width: 50%;
    text-align: left;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items:flex-start;
    height: 100%;
}

@media(max-width:540px) {
    .bkst-banner-copy-container {
        max-width: 100%;
        text-align: center !important;
        height: auto;
        align-items: center;
        padding: 30px;
    }
}

@media(max-width:320px) {
    .bkst-banner-copy-container {
        padding: 15px;
    }
}


/*inset container for main copy below tag*/
.bkst-banner-inset-copy {
    padding: 0 60px;
}

@media(max-width:800px) {
    .bkst-banner-inset-copy {
        padding: 0 30px;
    }
}

/*banner image container and breakpoints*/
.bkst-banner-image-container {
    height: 457px;
    padding:0;
    overflow:hidden;
    flex-grow: 1;
}

.bkst-banner-image-container img{
    width:100%;
    height:100%;
    object-fit:cover;
}

@media(max-width:800px){
    .bkst-banner-image-container{
        height:420px; 
    }

    .bkst-banner-image-container img{
        width:100%;
        height:100%;
        object-fit:cover;
    }
}

@media(max-width:540px){
    .bkst-banner-image-container{
        /* UPDATED: Changed from fixed 250px to responsive 40vh */
        height: 40vh; 
    }

    .bkst-banner-image-container img{
        width:100%;
        height:100%;
        object-fit:cover;
    }
}

/* --- NEW BREAKPOINT ADDED FOR 320PX SCREEN SIZE --- */
@media(max-width:320px){
    .bkst-banner-image-container{
        height: 35vh;
    }
}

/*ADDITIONAL STYLES FOR OSD EVENTS BANNER*/
/*Italic sub-caption - added for TRW events banner*/
p.bkst-banner-italics-caption{
    font-style:italic !important;
    font-weight:500 !important;
    font-size: 20px !important;
}

@media(max-width:800px){
    p.bkst-banner-italics-caption{
    font-size:16px !important;
}}

/*Event listing event name - added for TRW events banner*/
.bkst-banner-events-name-bolder{
    font-weight:700!important;
    text-transform:uppercase !important;
}

/*Event banner headings*/
h1.bkst-event-banner-heading {
    font-family: "Roboto Slab", "Roboto", Helvetica, Arial, Helvetica, sans-serif !important;
    font-weight: 700 !important;
    font-size: 32px !important;
    text-align: left;
    margin-bottom: 20px !important;
}

@media(max-width:800px) {
    h1.bkst-event-banner-heading {
        font-size: 24px !important;
        margin-bottom: 15px !important;
    }
}

@media(max-width:540px) {
    h1.bkst-event-banner-heading {
        /*font-size: 24px !important;*/
        text-align: center;
        /*margin-bottom: 10px;*/
    }
}


p.bkst-banner-copy-narrower-margin {
    font-family: "Roboto", Helvetica, Arial, Helvetica, sans-serif !important;
    font-weight: 500 !important;
    font-size: 18px;
    text-transform: none;
    color: #275D38;
    margin-bottom: 18px !important;
}

@media(max-width:800px) {
    p.bkst-banner-copy-narrower-margin {
        font-size: 16px;
        margin-bottom: 16px;
    }
}

@media(max-width:540px) {
    p.bkst-banner-copy-narrower-margin {
        margin-bottom: 10px;
    }
}