.grid {
    display: grid;
    grid-template-columns: [xl-start] 1fr 1.5rem [md-start] minmax(0, 624px) [md-end] 1.5rem 1fr [xl-end];
}
.grid * {
    grid-column: md;
}
.grid-xl {
    grid-column: xl;
}
@media (max-width: 672px) {
    :root {
        font-size: 90%;
    }
}

.banner {
    background-color: #FFE697;
    color: #6D2825;
}
.sub-banner {
    background-color: burlywood
}
.date {
    font-size: 1.25rem;
    font-weight: bold;
    margin-top: 0.25ex;
    margin-bottom: 0ex;
}
.event {
    font-size: 0.875rem;
    font-weight: normal;
    margin-top: 0.5ex;
    margin-bottom: 0ex;
}
.performer {
    font-size: 1.25rem;
    font-weight: bold;
    margin-top: 0.25ex;
    margin-bottom: 0ex;
}
.performer img {
    height: 175px;
    width: 175px;
}
figure.performer {
    float:right;
}
.time {
    font-size: 0.75rem;
    font-weight: normal;
    margin-top: 0.25ex;
    margin-bottom: 0ex;
}
p.theme {
    font-size: 0.85rem;
    font-weight: normal;
    font-style: italic;
    margin-top: 0.75ex;
    margin-bottom: 0ex;
}
p.theme span {
    font-weight: 600;
}

.caption p {
    margin-top: -.5rem;
}
.header-right-content {
    font-size: 0.9rem;
    margin: 1em 0;
}
.button {
    color: yellow!important;
    background-color: #489080!important;
    text-decoration:none!important;
    font-weight:600;
}
.button a:hover{
    color: yellow!important;
    background-color: #489080!important;
    text-decoration:none!important;
    font-weight:600;
}

.divider {
    color: red;
    background-color: red;
    width: 80%;
    height: 1px;
    margin: 0 auto;
}
.pvfslinks a {
    color: #6D2825!important;
    text-decoration: underline!important;
}

.pvfslinks a:hover {
    color: #6D2825!important;
    text-decoration: none!important;
}
.tba {
    color: #6D2825;
    text-decoration: none;
    font-style: italic;
}

#stay-in-touch {
    border-radius: 6px;
    background-color: #F3F6F9;
}
#stay-in-touch p.card-header-title {
    color: #6D2825!important ;
}
.content-banner {
    width: 408px;
    height: 140px;
    margin: 1rem auto;
}
.content-map {
    max-width: 450px;
    margin: 1rem auto 0;
}
.logo {
    max-width: 203px;
    margin: 1.5rem auto 1rem!important;
}
.decorative-divider {
    filter: invert(15%) sepia(66%) saturate(1308%) hue-rotate(332deg) brightness(101%) contrast(88%);
    width: 200px;
    height: 10ex;
}
.schedule-entries {
    margin-top: -.5rem;
    background-color: #f3f6f9;
    border-radius: 6px;
    box-shadow: 0 2px 3px rgba(10,10,10,.1), 0 0 0 1px rgba(10,10,10,.1);
}
.schedule-head {
    width: 17rem;
}
.headline {
    font-weight: bold;
    color: #264B91;
}