/* Minification failed. Returning unminified contents.
(2798,14): run-time error CSS1030: Expected identifier, found '.'
(2798,42): run-time error CSS1031: Expected selector, found ')'
(2798,42): run-time error CSS1025: Expected comma or open brace, found ')'
(3072,28): run-time error CSS1039: Token not allowed after unary operator: '-Gray-1'
(3082,17): run-time error CSS1039: Token not allowed after unary operator: '-Primary'
(3097,17): run-time error CSS1039: Token not allowed after unary operator: '-Black'
 */
hr {
    border-top: 1px solid #d6d6d6 !important;
}

/*create new class for html element examples*/
.html {
    color: #007A11;
}

/*forces top alignment of table headers*/
.table thead th {
    vertical-align: top !important;
}

/* CSS Document - Custom styles that overwrite the template CSS code*/
.columnImage {
    width: 100%;
}

.red_text {
    color: #C90000;
}

.new_highlight {
    color: #FF0000;
    font-size: 0.8em;
}

/* begin responsive video */
.videoWrapper {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    padding-top: 25px;
    height: 0;
}

.videoWrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
/* end responsive video */

/* begin jQuery expand/collapse behavior */
.question, .question_nested, .collapseAll, .expandAll {
    cursor: pointer;
}

.question, .question_nested {
    color: #333;
    font-size: 1.6em;
    line-height: 1.5em;
}

.question a, .question a:hover, .question a:visited {
    color: #333;
}

.question_nested a, .question_nested a:hover, .question_nested a:visited {
    color: #333;
}

.answer, .answer_nested {
    padding-left: 2.5%;
}
/* end jQuery expand/collapse behavior */

/* begin custom table color to provide alternative for zebra striped table to have darker header matching default table */
.table.table-striped.alt-table-header > thead > tr > th,
.table.table-striped.alt-table-header > thead > tr > td {
    background: #d9d9d9;
    border: 2px solid #fff;
}
/* end custom table color to provide alternative for zebra striped table to have darker header matching default table */

.red-alert {
    border-color: #C90000;
}

.red-alert .panel-heading {
    border-color: #C90000;
    background-color: #C90000;
    color: #fff;
}

.red-alert .panel-heading h4 span[class^="ca-gov-icon-"] {
    color: #fff;
}

.yellow-alert {
    border-color: #FBAD23;
}

.yellow-alert .panel-heading {
    border-color: #FBAD23;
    background-color: #FBAD23;
}

.green-alert {
    border-color: #178300;
}

.green-alert .panel-heading {
    border-color: #178300;
    background-color: #178300;
    color: #fff;
}

.green-alert .panel-heading h4 span[class^="ca-gov-icon-"] {
    color: #fff;
    }

.home-icon {
    color: #333;
}

.opener {
    cursor: pointer;
}

/*-----------------------------------------------------*/
/* Hiding the search menu from the main menu in mobile */
/*-----------------------------------------------------*/
@media (max-width: 768px) {
    button.toggle-search {
        display: none;
    }
}



/*----------------------------------------------*/
/* Adds top margin to tabs panel(office locator */
/* page, maybe other tab panel pages) */
/*----------------------------------------------*/
.tab-group.responsive {
    margin-top: 20px;
}

/*-------------------------------*/
/* This makes the footer and google 
translate stack better in mobile */
/*-------------------------------*/
@media (max-width: 992px) {
    .section.section-impact.p-b-lg div.container .quarter {
        float: left;
        width: 50%;
    }

    .section.section-impact.p-b-lg div.container .quarter a.opener {
        margin-left: 20px;
    }

    /* this section below is for all page footers and manipulates the view disclaimer text for translate*/
    .section.section-impact.p-b-lg div.container .quarter.p-t-sm a.opener {
        margin-left: 20px;
    }
}

@media (max-width: 768px) {
    .section.section-impact.p-b-lg div.container .quarter {
        float: none;
        width: 100%;
    }
}

ul.m-b-md li {
    margin-bottom: 10px;
}

ul.p-b-md li {
    margin-bottom: 10px;
}

/*The following is the jumplink anchors for the accordions. They should be placed directly above the desired accordion.*/
.accordDivider {
    border-bottom: 1px;
    width: 200px;
}

/*targets twitter color issues*/
.Identity-screenName {
    color: #333 !important;
}

/*creating skip-to-chatbot functionality*/
#skip-to-chat {
    position: relative;
    left: 50% !important;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 0;
    height: 0;
    z-index: 999;
}

#skip-to-chat a {
    width: 0;
    height: 0;
    text-align: center;
    position: absolute !important;
    left: 50% !important;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    clip: unset;
    background-color: white;
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
    overflow: hidden;
}

#skip-to-chat a:focus {
    width: 160px;
    height: 27px;
}

i.clickable.reaction_option.si-fb_like, 
i.clickable.reaction_option.si-fb_dislike {
    color: #046B99 !important;
}

/*--Modal overlay formatting--*/
h2.modal-title, 
h3.modal-title, 
h4.modal-title, 
h5.modal-title {
    font-size: 1.5rem !important;
}

div.modal-content {
    color: #000 !important;
}

/* teaser tile corrections. */
.teaser span.title {
    font-size: 1.25rem !important;
}

.teaser h2, .teaser h3, .teaser h4, .teaser h5 {
    font-size: 1.25rem !important;
}

/*creates a gray background for sections*/
.graySectionBg {
    background-color: #eee;
}

/*styling for spanish links on UI redesign pages*/
.spanishLinks {
    float: right;
}

@media (max-width: 768px) {
    .spanishLinks {
        float: none;
    }
}

/*allows for footer text to be smaller, like a subscript would. Use for UI dashboard, etc.*/
.addendum {
    font-size: .9em;
}

/*fixing breadcrumb stack issue */
.breadcrumb li {
    margin: 10px 0px;
    height: 15px !important;
    line-height: 15px !important;
}

/* new yellow border blockquote styling */
.highlight-blockquote {
    padding: 0 1rem;
    margin: 1rem 0;
    border-left: .3rem solid #fdb81e;
    font-weight: 400;
    line-height: 1.7;
}

/* updating button stylings */
button, 
.btn, 
input[type=button], 
input[type=submit], 
input[type=reset] {
    min-width: 80px;
}

.btn-row .btn {
    margin-right: 1rem !important;
}

@media (max-width: 767px) {
    .btn, .btn-row .btn {
        width: 100%;
        margin-left: 0px !important;
        margin-right: 0px !important;
        margin-bottom: 1rem !important;
    }

    .hide {
        display: none;
    }

    .showDashboard {
        display: block;
    }
}

@media (min-width: 768px) {
    .hide {
        display: block;
    }

    .showDashboard {
        display: none;
    }
}

.input-group-addon {
    font-size: 1.5rem !important;
}

.pull-right {
    padding-left: 8px;
}

/*--creating a white background on radio and checkboxes
so that when placed on different color sections, the color
does not bleed through the form controls. --*/
.check-icon-radio, .check-icon-checkbox {
    background-color: #fff;
}

/* capitalize the folders in the dynamic breadcrumbs */
.breadcrumb.dynamic {
    text-transform: capitalize;
}

/* help text icon formatting */
.ca-gov-icon-question-fill {
    color: #046b99;
    margin-left: .5rem;
}

/* creating non-wrapping text for long checkbox labels */
input[type=checkbox], input[type=radio] {
    float: left;
    margin-top: 0.35rem;
    margin-right: 0.5rem;
}

.form-checkbox-item {
    width: 95%;
    display: block;
    float: left;
    margin-left: 0.5rem;
}

form fieldset label.long-label {
    display: block;
    margin-bottom: 5px;
    margin-left: 1.375rem;
}

@media (max-width: 470px) {
    .form-checkbox-item {
        width: 90%;
    }
}

/****Creating text-wrap for numbered items that
are made to look like an ordered list *****/
.col-content, .col-num {
    position: relative;
    width: 100%;
    padding-left: 15px;
}

.col-num {
    flex: 0 0 4.33333%;
    max-width: 4.33333%;
    text-align: right;
}

.col-content {
    flex: 0 0 95.66667%;
    max-width: 95.66667%;
}

.col-content label {
    margin-left: .3rem;
}

@media (max-width: 767px) {
    .col-num {
        flex: 0 0 7.33333%;
        max-width: 7.33333%;
        text-align: right;
    }

    .col-content {
        flex: 0 0 92.66667%;
        max-width: 92.66667%;
    }
}

/*create a consistent font-size for headers */
.h4-font {
    font-size: 1.25rem;
    margin-top: 1.33em;
    margin-bottom: 1em;
}

/******Making the tab headers consistent****/
ul#tabs li a h2, ul#tabs li a h3, ul#tabs li a h4 {
    font-size: 1rem !important;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
    line-height: 1.2 !important;
}

/* create a way to flip an image/icon 180 degrees */
.rotate-180 {
    display: inline-block;
    -webkit-transform: rotateX(180deg);
    transform: rotateX(180deg);
}

.full-width-title {
    position: relative;
    width: 100%;
    min-height: 1px;
    padding-left: 15px;
    padding-right: 15px;
}

a.contact-logo {
    background-image: none !important;
}

/********Feedback Button Styling*********/
#QSIFeedbackButton-btn {
    min-width: 0;
    padding: 10px;
    padding: 3px 5px 3px 5px !important;
    background-color: #E6E8E8 !important;
    border: 1px solid #046B99 !important;
    border-right: none !important;
}

.QSIFeedbackButton div {
    font-size: 1rem !important;
    background-color: #E6E8E8 !important;
    color: #046b99;
}

#QSIFeedbackButton-close-btn-container {
    background-color: transparent !important;
}

#QSIFeedbackButton-close-btn-background {
    top: -3.2px !important;
    right: 26.8px !important;
}
/*******End of Feedback Button Styling***********/
/**** Chatbot ****/
.lex-web-ui-iframe {
    width: 70vw;
    max-width: 375px;
    max-height: 500px;
    min-width: unset;
}
    .lex-web-ui-iframe.lex-web-ui-iframe--minimize {
        z-index: 100000000;
    }

@media screen and (max-width: 556px) {
    .lex-web-ui-iframe {
        width: 100% !important;
        max-width: unset;
        margin-right: 0;
        bottom: 0;
    }

        .lex-web-ui-iframe.lex-web-ui-iframe--minimize {
            margin-right: 2vw;
        }
}

.fake-class {
    background-color: red;
}

/*News Release Header */

.published {
    font-size: 1.1875rem;
}

.news-release-heading {
    font-size: 2.375rem;
    font-weight: 600;
}

.news-release-print-icon-container {
    text-align: right;
}

.news-release-print-icon-container a span {
    margin-left: 4px;
}
/*---------------------------------------------------------------*/
/*  text accents override to pass accessibility color contrast   */
/*---------------------------------------------------------------*/
.text-accent1 {
    color: #65b1e7 !important;
}

.text-accent6 {
    color: #E381ee !important;
}

/*---------------------------------------------------------------------------*/
/* This is to be able to hide a div that needs to be there for accessibility */
/*---------------------------------------------------------------------------*/
.visuallyHidden {
    display: none;
}

/*--Color Accessibility focus fixes--*/
.alert .alert-severe .alert-dismissible .alert-banner .btn:focus {
    outline: solid 2px #483BB2;
}

.utility-header a:focus,
.utility-header .btn:focus,
#skip-to-content a:focus,
#siteSettings .btn:focus,
#siteSettings .close:focus,
.section-impact a:not(.btn):focus,
.card-impact a:not(.btn):focus,
.icon.MinMaxChat.ClickableADA:focus,
.global-footer a:focus {
    outline: solid 2px #dce2ff !important;
}

.branding a:focus,
#navigation a:focus,
#navigation button:focus,
.nav > li > a:focus,
.nav > li > button:focus,
.mobile-controls .toggle-menu:focus,
.main-primary a:focus,
.main-primary .accordion-list li:focus,
.main-primary div.active:focus,
.tabs [role="tabpanel"]:focus,
div.gsc-cursor-page:focus,
.main-primary button:focus,
#chkSameEarning:focus,
input#txtClaimDate:focus,
input.form-control.money:focus,
.tableFocus:focus,
.main-primary select:focus,
#AstuteBotToggleChatContainer:focus,
i.reaction_option:focus,
input.button:focus,
i.ca-gov-icon-check-mark:focus,
.input-group-addon:focus,
input[type=text]:focus {
    outline: solid 2px #9646ff !important;
}

#Search > input:focus,
#Search > textarea:focus,
#Search > button:focus,
#Search > select:focus,
.close-search-btn > button:focus,
.accordionExpand > button:active,
.accordionExpand > button:focus,
.accordionExpand > [role="button"],
.mobile-controls .toggle-search:focus {
    outline: solid 2px #8331C1 !important;
}

#skip-to-content:focus-within {
    z-index: 9999;
}

.gs-visibleUrl {
    color: #008233 !important;
    /*this darkens the color contrast to pass AA WCAG requirements
	for the link text that is returned in the search page. */
}
/*--end of focus field color accessibility fixes--*/

/*--adds outline to the search box when no focus--*/
.search-container.active .search-textfield {
    border-color: #000 !important;
}

.search-container #Search .close-search .ca-gov-icon-close-mark {
    color: #000 !important;
}

#q.w-100.height-50.p-x-sm {
    border-color: #333;
}

button.pos-abs.gsc-search-button.right-0.top-0.width-50.height-50 {
    border-color: #333;
}

/*adjust color of icons to be accessible for color contrast */
.first-level-link > span[class^="ca-gov-icon"] {
    color: #046B99;
}

.nav-item:hover > a > span[class^="ca-gov-icon"], .nav-item:hover > a {
    color: #B55E00;
}
/*---------------------------------------------*/
/*  benefitCalculator                          */
/*---------------------------------------------*/
.calculatorInput input {
    font-family: Arial, Helvetica, sans-serif;
}

.calculatorResult input {
    font-family: Arial, Helvetica, sans-serif;
    border: 0;
    background: none;
    font-weight: bold;
    font-size: 24px;
}

.calculatorMessage input {
    font-family: Arial, Helvetica, sans-serif;
    border: 0;
    background: none;
    font-weight: bolder;
    color: #F00;
}

.CalcTextResult {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 24px;
    font-style: normal;
    font-weight: bold;
}

.CalcTextEnter {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: bold;
}

.calcLeftColumn {
    margin: 0px;
    float: left;
    width: 65%;
}

.calcRightColumn {
    margin: 0px;
    float: right;
    width: 30%;
}
/*---------------------------------------------*/
/*  end benefitCalculator                      */
/*---------------------------------------------*/

#ArticleLinks {
    list-style: none;
    padding-left: 0px !important;
}

ul#ArticleLinks li {
    padding-left: 0px !important;
}

.width-control {
    width: 90%;
    margin: auto;
}

.article-button-width-control {
    width: 87.75%;
    margin: auto;
}

.blog-image {
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
    /* box-shadow: -1px 2px 5px 5px lightgray;*/
    box-shadow: -1px 1px 10px 3px lightgray;
}

.article-button-align {
    float: left;
}

.newsletter-article-title {
    position: relative;
    margin-bottom: 25px;
}

.newsletter-article-link {
    position: absolute;
    left: 15;
    bottom: 0;
}

@media (max-width: 768px) {
    .width-control {
        width: 90%;
    }

    .article-button-width-control {
        width: 100%;
    }

    .article-button-align {
        float: none;
    }
}

/*------------------------------------------------------------------------*/
/* --------Fix for the card headers on the office Locator page.---------- */
/* This allows the link to expand the full width and height of the header */
/*------------------------------------------------------------------------*/
.card-header a {
    padding: 12px 20px !important;
    display: block;
}

/* custom card float class */
.cardFloat {
    float: right;
}

@media (max-width: 576px) {
    .cardFloat {
        float: none;
    }

    .cardFloat .third {
        width: 100% !important;
    }
}

/* custom image float class */
.floatImage {
    float: right;
    clear: both;
    width: 33%;
    padding: 20px;
}

figure.floatImage {
    border: 0px !important;
    background-color: #fff;
}

@media (max-width: 767px) {
    .floatImage {
        float: none;
        width: 100% !important;
    }
}

/* remove gap on card decks on mobile */
@media (max-width: 768px) {
    div.card-deck {
        padding-top: 0px !important;
    }
}

/* trying to create equal card height */
.card-body {
    height: 100%;
}

.card-button-text {
    text-align: center;
    font-size: 1.25rem !important;
}


/*remove rounding of card headers*/
.card-header:first-child {
    border-radius: 1px 1px 0 0 !important;
}

/*adjustments to margins in cards*/
.two-thirds h2:first-child,
div.collapse div.card-body h3:first-of-type,
.card h2,
.card h3,
.card h4,
div.card.card-understated div.card-default.border-dark div.card-block h3,
div.card.card-understated div.card-default div.card-block h2,
div.card.card-understated div.card-default div.card-block h3,
div.card.card-understated div.card-default div.card-block h4 {
    margin-top: 0px;
}

.two-thirds h1:first-of-type {
    clear: both;
    margin-top: 0px;
}

/*new custom cards*/
.card-warning-subtle, .card-warning-subtle div.card-header {
    background-color: #ffe7a4;
}

    .card-warning-subtle div.card-block {
        background-color: #fff2cd;
    }

.card-error {
    border-color: #D24532;
}

    .card-error div.card-header {
        background-color: #D24532;
        color: #fff;
    }

    .card-error div.card-block {
        background-color: #fff;
    }

.card-warning-message {
    border-color: #FDB81E;
}

    .card-warning-message div.card-header {
        background-color: #FDB81E;
        color: #333;
    }

    .card-warning-message div.card-block {
        background-color: #fff;
    }

.card-success-message {
    border-color: #16872E;
}

    .card-success-message div.card-header {
        background-color: #16872E;
        color: #fff;
    }

    .card-success-message div.card-block {
        background-color: #fff;
    }
/*end of custom card section*/

/*adjusting font-sizes in card header tags*/
.card-header h2, .card-header h3, .card-header h4 {
    font-size: 1rem !important;
    margin-bottom: 0px !important;
}

.font-header {
    font-size: 1rem !important;
}

h2.card-title.consistant,
h3.card-title.consistant,
h4.card-title.consistant,
h5.card-title.consistant {
    font-size: 1.25rem !important;
}

h2.card-title.consistent-l,
h3.card-title.consistent-l,
h4.card-title.consistent-l,
h5.card-title.consistent-l {
    font-size: 1.54rem !important;
}

.panel-heading h2,
.panel-heading h3,
.panel-heading h4,
.panel-heading h5 {
    font-size: 1.125rem !important;
}

/*new custom cards*/
.card-warning-subtle, .card-warning-subtle div.card-header {
    background-color: #ffe7a4;
}

    .card-warning-subtle div.card-block {
        background-color: #fff2cd;
    }

.card-error {
    border-color: #D24532;
}

    .card-error div.card-header {
        background-color: #D24532;
        color: #fff;
    }

    .card-error div.card-block {
        background-color: #fff;
    }

.card-warning-message {
    border-color: #FDB81E;
}

    .card-warning-message div.card-header {
        background-color: #FDB81E;
        color: #333;
    }

    .card-warning-message div.card-block {
        background-color: #fff;
    }

.card-success-message {
    border-color: #16872E;
}

    .card-success-message div.card-header {
        background-color: #16872E;
        color: #fff;
    }

    .card-success-message div.card-block {
        background-color: #fff;
    }
/*end of custom card section*/

/*Adding styling for the cardFloat HTML Template*/
.cardFloat {
    margin-bottom: 15px;
    margin-left: 15px;
}

    .cardFloat img {
        box-shadow: 6px 5px 5px 5px #d3d3d3;
    }

.cardFloatImages {
    min-height: 300px;
    background-color: #faf4e8;
    padding: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 25px
}

@media (max-width:992px) {
    .image-remove {
        display: none;
    }

    .cardFloatImages {
        min-height: 200px;
        padding: 20px;
    }
}

@media (max-width:768px) {
    .cardFloat {
        margin-left: 0;
        float: none;
    }

    .cardFloatImages {
        min-height: 0;
        padding: 0;
        background-color: #fff;
    }
}

div.homepageBannerText .cardFloat img {
    box-shadow: none;
}
/*End of cardFloat styling*/
.reset-text {
    display: none;
}

.event-filters-row {
    display: grid;
    grid-template-columns: 1fr;
    padding: 0;
    grid-gap: 1rem;
    padding: 12px 0 0 0;
}

    .event-filters-row ::placeholder {
        color: #333;
        opacity: 1;
    }

.event-search,
.event-type-form,
.event-language-form,
.event-sort-form,
.event-county-form {
    width: 100%;
    height: 25px;
    border-radius: 2px;
    border: 1px solid #767676;
}

.event-filter-reset {
    width: unset !important;
}

.event-filters-heading {
    color: #333;
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 4px;
}

.events-list {
    display: grid;
    row-gap: 1rem;
    grid-template-columns: repeat(1, 1fr);
    margin-top: 8px;
    margin-bottom: 3rem;
    list-style-type: none;
    padding: 0;
}

.event-card {
    padding: 32px 20px;
    border: 1px solid rgba(214, 214, 214, 1);
    transition: box-shadow 500ms, border 500ms;
    color: rgba(51, 51, 51, 1);
    margin-left: 16px !important;
    margin-right: 16px !important;
}

    .event-card:focus-within {
        outline: solid 2px #9646ff !important;
        border: 1px solid rgba(214, 214, 214, 1);
    }

.event-card-title-container {
    display: flex;
    justify-content: flex-start;
    gap: 0.75rem;
    margin-bottom: 16px;
}

.event-card-title {
    color: rgba(51, 51, 51, 1);
    font-weight: 400;
    font-size: 20px;
    line-height: 24px;
    margin-bottom: 0;
}

.event-card-flag-icon {
    min-width: 24px;
}

.event-card .card-header a {
    padding: 6px 0 !important;
    display: block;
}

.event-card-description-text {
    display: inline;
    overflow: hidden;
    text-overflow: ellipsis;
}

.event-details-list {
    list-style-type: none;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    grid-gap: .5rem;
    row-gap: .5rem;
    margin: 6px 0 0 0;
}

.event-detail-page-details-list {
    margin-bottom: 16px;
}

.event-details-list li {
    background-color: rgba(225, 242, 247, 1);
    border-radius: 2px;
    padding: 2px 4px;
    text-transform: capitalize;
}

.event-card-date-time {
    margin: 16px 0;
}

.filter-container {
    display: flex;
    flex-direction: row;
    gap: 3rem;
}

    .filter-container h3 {
        margin-bottom: 8px;
        margin-top: 0;
    }

.description-container {
    margin-bottom: 24px;
}

.card-text {
    display: inline;
}

.read-more {
    display: inline;
    margin-left: 0;
    cursor: pointer;
    color: #046B99 !important;
    font-size: 14px;
    text-decoration-line: underline;
    text-decoration-style: dotted;
    text-decoration-skip-ink: none;
    text-decoration-thickness: 7.5%;
    text-underline-offset: 10%;
}

.events-list-header {
    display: flex;
    align-items: center;
    gap: .5rem;
}

.event-detail-page-flag-icon {
    margin-top: 5px;
}

.event-details-list li {
    display: flex;
    align-items: center;
    gap: .25rem;
}

.event-share-section {
    margin: 40px 0;
}

.event-share-buttons a {
    margin: 0 10px;
    text-decoration: none;
    display: inline-block;
    background: unset;
}

.event-share-buttons .share-button {
    background-image: none !important;
}

#facebook-share {
    margin-left: 0;
}

.event-share-buttons img {
    vertical-align: middle;
    border-radius: 50%;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    transition: transform 0.2s;
}

    .event-share-buttons img:hover {
        transform: scale(1.1);
    }

.event-reset-filter-container-desktop {
    display: none;
}

@media (min-width:768px) {
    .events-list {
        grid-template-columns: repeat(2, 1fr);
    }

    .filter-reset-container {
        display: flex;
        justify-content: space-between;
        align-items: flex-end;
        gap: 1rem;
        margin-bottom: 40px;
    }

    .event-filters-row {
        grid-template-columns: 1fr 1fr;
        grid-template-areas: "event-search-form-container event-search-form-container"
            "virtual-irl-filter-grid event-language-filter-grid"
            "event-county-filter-grid event-sort-grid"
    }

    .event-search-form-container {
        grid-area: event-search-form-container;
    }

    .virtual-irl-filter-grid {
        grid-area: virtual-irl-filter-grid;
    }

    .event-language-filter-grid {
        grid-area: event-language-filter-grid;
    }

    .event-county-filter-grid {
        grid-area: event-county-filter-grid;
    }

    .event-sort-grid {
        grid-area: event-sort-grid;
    }

    .event-reset-filter-container-desktop {
        display: block;
    }

    .event-reset-filter-container-mobile {
        display: none;
    }

    .event-card:hover {
        border: 1px solid rgba(136, 136, 136, 1);
        box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.9);
        cursor: pointer;
    }

    .event-list-page-card-deck-container .card-deck {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 2rem;
    }
}

@media (min-width:992px) {
    .filter-reset-container {
        margin-bottom: 32px;
    }

    .event-filters-row {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }

    .event-filters-row {
        grid-template-columns: 1fr 1fr;
        grid-template-areas: unset;
    }

    .event-search-form-container {
        width: 20%;
    }

    .virtual-irl-filter-grid {
        width: 20%;
    }

    .event-language-filter-grid {
        width: 20%;
    }

    .event-county-filter-grid {
        width: 20%;
    }

    .event-sort-grid {
        width: 20%;
    }

    .event-reset-filter-container {
        margin-top: 0;
    }

    .events-list {
        grid-template-columns: repeat(3, 1fr);
    }

    .events-list {
        margin-top: 0;
    }

    .event-list-page-card-deck-container .card-deck {
        grid-template-columns: 1fr 1fr 1fr;
    }
}

.featured-card-deck {
    margin: 32px 0;
}

.featured-card-deck-header-container {
    display: flex;
    margin-bottom: 16px;
}

.featured-cards-container {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    grid-gap: 2rem;
}

.featured-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    border: 1px solid rgba(214, 214, 214, 1);
}

.featured-card-image-container {
    width: 100%;
    height: 200px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.featured-card-text-container {
    padding: 32px 16px;
    flex-grow: 1;
}

.featured-card-title {
    margin-top: 0;
}

.featured-card-link-container {
    padding: 0 16px 32px;
}

.featured-card-deck-item-arrow {
    font-size:1.15rem;

}

.featured-card-arrow {
    background: none !important;
}

@media screen and (min-width: 992px) {
    .featured-cards-container {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}
.site-footer {
    color: white;
}

.footer-main {
    background-color: #313A45;
    padding: 2rem 0;
}

.footer-columns {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
}

.footer-columns ul {
    list-style: none;
    padding-left: 0;
    margin-bottom: 1rem;
}

.footer-columns ul > li {
    position: relative;
    margin-bottom: 13px;
}

.footer-columns ul > li:last-child {
    margin-bottom: 0;
}

.footer-columns ul a {
    color: #fff;
    font-size: 1.25rem;
}

.footer-columns ul a:hover {
    color: #FDB81D;
}

.footer-columns-translation-heading {
    margin-top: 0;
    font-size: 1.25rem;
}

.footer-translation-disclaimer {
    color: #fff;
}

.footer-translation-disclaimer:hover {
    color: #FDB81D;
}

.footer-utility {
    background-color: #212020;
    padding: 1rem 0;
}

.footer-utility-links {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-gap: 20px;
    column-gap: 8rem;
}

.footer-utility-links p {
    margin-bottom: 0;
}

.footer-utility-links a {
    color: #FFF;
    font-family: "Roboto Flex";
    font-size: 1rem;
    line-height: 1.4;
}

.footer-utility-links a:hover {
    color: #FDB81D;
}

.utility-footer-social-links-container {
    display: flex;
    grid-gap: 1rem;
    font-size: 2rem;
    list-style: none;
    padding: 0;
    margin: 2rem 0 0;
    color: #fff;
}

.utility-footer-social-link a,
.utility-footer-social-link a:hover {
    color: #fff;
    text-decoration: none;
}

.utility-footer-social-icon:hover {
    color: #FDB81D;
}

.footer-columns-translation-container {
    margin-top: 2rem;
}

.footer-legal {
    background-color: #D9D9D9;
    color: #000;
    padding: 0.9375rem;
    font-size: 1rem;
}

.footer-legal .container p {
    margin-bottom: 0;
}

/* Google Translate Font Color */
.goog-te-gadget,
.goog-te-gadget > span > a {
    color: white !important;
}

@media (min-width: 768px) {
    .footer-columns {
        grid-template-columns: repeat(2, 1fr);
        gap: 0 2rem;
    }

    .footer-columns-translation-container {
        margin-top: 0;
    }  
}

@media (min-width: 992px) {
    .footer-columns ul {
        margin-bottom: 0;
    }
    .footer-columns {
        grid-template-columns: repeat(4, 1fr);
        gap: 4rem;
    }

    .utility-footer-social-links-container {
        margin: 0;
        font-size: 1.5rem;
        margin: 0;
    }

    .footer-utility .container {
        display: flex;
        flex-wrap: nowrap;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }

    .footer-utility-links {
        display: grid;
        grid-template-columns: repeat(6, auto);
        grid-template-rows: 1fr;
        column-gap: 1.75rem;
    }
}

@media (min-width: 1200px) {
    .footer-columns {
        gap: 7rem;
    }

    .footer-utility-links {
        column-gap: 3rem;
    }
}

.main-content {
    margin-top: 155px;
}

.alert-banner {
    transition: all 0.4s ease;
}

    .alert-banner[style*="max-height: 0"] {
        height: 0 !important;
        border: none !important;
        line-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

/* UTILITY HEADER */

.site-header {
    position: fixed;
    width: 100%;
    z-index: 999;
    background: white;
}

.site-utility-header {
    height: 50px;
    background-color: #046B98;
    display: flex;
    font-size: 0.875rem;
    transition: height 0.3s ease, padding 0.3s ease;
}

.utility-header-logo {
    height: 25px;
}

.utility-header-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.utility-header-link-container {
    display: flex;
    grid-gap: 4rem;
    margin: 0;
    padding: 0;
}

.utility-header-link {
    display: none;
}

.utility-header-language-resources-link {
    display: block;
}

.language-resources-link {
    display: flex;
    align-items: center;
    color: inherit;
    text-decoration: none;
}

    .language-resources-link .ca-gov-icon-globe {
        font-size: 1.2rem;
        color: #fff;
        margin-right: 0.625rem;
    }

.utility-header-language-resource-icon {
    margin-right: 12px;
}

.utility-header-link-container a,
.utility-header-link-container a:hover {
    color: #fff;
    text-decoration: none;
}

.utility-search {
    display: none;
}

#___gcse_0 {
    width: 302px;
    height: 40px;
}

.utility-search input.gsc-input,
.mobile-search input.gsc-input {
    background: #FFF;
    border-radius: 12px;
    height: 40px !important;
    opacity: unset !important;
    border: 1px solid black !important;
    font-size: 12px !important;
}

.mobile-search input.gsc-input {
    height: 62px !important;
    font-size: 20px !important;
}

.utility-search .gsc-input-box,
.mobile-search .gsc-input-box,
#search-page .gsc-input-box {
    padding: 0 !important;
}

.utility-search td.gsc-search-button::before,
.mobile-search td.gsc-search-button::before {
    display: none;
}

.mobile-search .gsc-clear-button {
    display: none !important;
}

.utility-search button.gsc-search-button,
.mobile-search button.gsc-search-button {
    margin-left: 0 !important;
    height: 40px !important;
    border-radius: 0 12px 12px 0 !important;
    border: 1px solid black !important;
    opacity: 1 !important;
    top: 0 !important;
    right: 0 !important;
    min-width: 40px !important;
    background-color: #D9DEE0 !important;
}

.mobile-search button.gsc-search-button {
    height: 62px !important;
    width: 76px !important;
}

.mobile-search .gsc-search-button .ca-gov-icon-search {
    font-size: 1.78571rem !important;
}

.utility-search .ca-gov-icon-search::before {
    position: absolute;
    top: 0;
    right: 12px;
}

/* Main Nav Search Auto-Complete Results */
.gstl_50 {
    z-index: 10000 !important;
}

/* Mobile Nav Search Auto-Complete Results */
.gstl_51 {
    width: 100% !important;
    left: 0 !important;
}

.utility-header-inner .gsc-clear-button {
    display: none !important;
}

.gsc-completion-container {
    font-family: "Source Sans Pro", sans-serif !important;
}

@media (min-width: 992px) {
    .site-utility-header {
        height: 65px;
    }

        .site-utility-header.shrunk {
            height: 55px;
        }

    .utility-header-link {
        display: flex;
        align-items: center;
    }

    .utility-search {
        display: block;
    }
}

/* MAIN NAV */
.main-header {
    height: 90px;
    border-bottom: 5px solid #323A45;
    transition: height 0.3s ease, padding 0.3s ease;
}

    .main-header.shrunk {
        height: 80px;
    }

.main-header-inner {
    height: 100%;
}

.main-nav-wrapper {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.main-nav-wrapper {
    background: #fff;
}

.main-nav-container {
    height: 100%;
    display: none;
    align-items: center;
    justify-content: space-between;
}

.main-nav-logo img {
    height: 93px;
    max-height: 65px !important;
    transition: height 0.3s ease;
}

.main-header.shrunk .main-nav-logo img {
    height: 50px;
}

.main-nav-menu {
    height: 100%;
}

.main-nav-toggle {
    display: none;
    background: none;
    font-size: 2rem;
    border: none;
    color: #00587C;
}

.main-nav-list {
    height: 100%;
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
}

.main-nav-item {
    position: relative;
    cursor: pointer;
    min-width: 120px;
}

    .main-nav-item button, ul#main-nav-menu li {
        font-size: 1.075rem;
    }

.main-nav-link {
    color: #00587C;
    font-family: "Roboto flex";
    font-size: .875rem;
    font-weight: 400;
    display: flex;
    align-items: center;
    gap: 0.3rem;
    justify-content: space-between;
    width: 100%;
    height: 100%;
    padding: 1rem;
    border: none;
    background: none;
    text-align: left;
    cursor: inherit;
}

.main-nav-item .submenu {
    position: absolute;
    top: 106%;
    left: 0;
    background: #fff;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    margin: 0;
    padding: 0;
    list-style: none;
    z-index: 200;
    column-count: 1;
    column-gap: 0;
    width: max-content;
    max-width: 50vw;
    min-width: 280px;
    /* calculating the max height of the dropdowns (100vh) with the utility/main nav (155px) and some extra padding (16px) */
    max-height: calc(100vh - 155px - 16px);
    overflow-y: auto;
    overflow-x: hidden;
}

    .main-nav-item .submenu.two-column {
        column-count: 2;
        column-fill: auto;
    }

@media (min-width: 60em) {
    .main-nav-item .submenu.two-column {
        column-count: 1;
        column-fill: auto;
    }

        .main-nav-item .submenu.two-column li {
            padding: 10px 20px 10px 20px;
        }
}

@media (max-height: 725px) {
    .main-nav-item .submenu.two-column {
        column-count: 2 !important;
    }
}

.main-nav-item .submenu li {
    break-inside: avoid;
    padding: 10px 35px;
}

    .main-nav-item .submenu li a {
        display: block;
        white-space: normal;
        color: #00587C;
        text-decoration: none;
    }

.main-nav-item.align-submenu-right .submenu {
    left: auto;
    right: 0;
}

.main-nav-item.has-submenu.subnav-open {
    background: #E8E9E9;
}

    .main-nav-item.has-submenu.subnav-open .main-nav-link {
        color: #000;
    }

.chevron svg {
    transition: transform 0.3s ease;
    transform-origin: center;
}

    .chevron svg path {
        transition: fill 0.3s ease;
    }

.main-nav-item.subnav-open .chevron svg {
    transform: rotate(180deg);
    fill: pink;
}

    .main-nav-item.subnav-open .chevron svg path {
        fill: #000 !important;
    }

.submenu li {
    padding: 10px 35px;
    font-size: .875rem;
    font-weight: 400;
}

    .submenu li:hover {
        background-color: #E8E9E9;
    }

    .submenu li a:hover {
        text-decoration: none;
    }

/*MOBILE NAV*/
#mobile-nav {
    display: none;
    flex-direction: column;
    width: 100%;
    background: #fff;
    padding-top: 130px;
    margin-bottom: -146px;
}

    #mobile-nav.open {
        display: flex;
    }

.mobile-nav-toggle {
    border: none;
    background-color: transparent;
}

.hamburger-icon .line {
    stroke: #046B98;
    stroke-width: 7;
    stroke-linecap: round;
    stroke-miterlimit: 10;
    transition: transform 0.3s ease, opacity 0.3s ease;
    transform-origin: center;
    transform-box: fill-box;
}

.hamburger-icon.open .line1 {
    transform: translateY(17.34962px) rotate(45deg);
}

.hamburger-icon.open .line2 {
    opacity: 0;
}

.hamburger-icon.open .line3 {
    transform: translateY(-17.3496px) rotate(-45deg);
}

.mobile-nav-list {
    list-style: none;
    padding: 0;
}

.mobile-nav-item {
    border-bottom: 1px solid #b1b6bc !important;
}

    .mobile-nav-item:hover {
        background-color: #e9e9e9;
    }

.mobile-nav-link {
    font-family: "Roboto flex";
    color: #00587C;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    text-align: left;
    padding: 1.1rem 4rem 1.1rem 2rem;
    background: none;
    border: none;
    font-size: 1.125rem;
}

    .mobile-nav-link.active {
        background: rgba(217, 217, 217, 0.40);
        box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
        color: #323A45;
        /*offset for headers when auto-scrolling to active nav item*/
        scroll-margin-top: 130px;
    }

    .mobile-nav-link svg {
        transition: transform 0.3s ease;
        width: 1rem !important;
        height: 1rem !important;
    }

    .mobile-nav-link.active svg {
        transform: rotate(90deg);
    }

.mobile-submenu {
    padding-left: 1.5rem;
    background: #fff;
    margin-top: 5px;
    padding-top: 1.85rem;
    padding-left: 3.5rem;
    padding-bottom: 2rem;
}

    .mobile-submenu[hidden] {
        display: none;
    }

.mobile-submenu-item {
    list-style: none;
    color: #00587C;
    font-family: "Roboto flex";
    font-size: 1.125rem;
    margin-bottom: 1.5rem;
}

.mobile-search {
    background-color: #323A45;
    height: 120px;
    display: flex;
    justify-content: center;
    align-items: center;
}

#___gcse_1 {
    width: 100%;
}

@media (max-width: 992px) {
    #main-nav-menu, .main-nav-list {
        display: none !important;
    }
}

@media (max-width: 992px) {
    .main-header {
        height: 80px;
    }

    .main-nav-logo img {
        height: 50px;
        max-height: 70px !important;
    }

    .mobile-nav-toggle svg {
        width: 40px !important;
        height: 45px !important;
    }

    .main-content {
        margin-top: 130px;
    }
}

@media (min-width: 992px) {
    .mobile-nav,
    .mobile-nav-toggle {
        display: none !important;
    }

    .main-nav-container {
        display: flex;
    }
}

@media (min-width: 1280px) {
    .main-nav-link {
        gap: 0.5rem;
        padding: 1rem 1.95rem;
    }

    .main-nav-item:last-child button {
        padding-right: 0;
    }

    .utility-header-link-container {
        grid-gap: 5.25rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .site-utility-header.shrunk {
        height: 100px;
    }

    .main-header.shrunk {
        height: 133px;
    }
}

.main-header .main-header-inner .main-nav-wrapper .main-nav-logo img {
    display: block !important;
    border: none !important;
    position: relative !important;
    background: none !important;
}

.thirdNoPad {
    padding-left: 0px !important;
    padding-right: 0px !important;
    height: 241px;
}

.bannerImageFloat {
    width: 100%;
    height: 100%;
    object-fit: cover;
    margin: 0px !important;
}

.benefitsPadding {
    padding: 2.5rem;
}

@media (max-width: 800px) {
    .benefitsPadding {
        padding: 2rem;
    }
}

@media (max-width: 767px) {
    .thirdNoPad {
        height: 0px;
    }

    .bannerImageFloat {
        display: none;
    }
}

.branding .header-organization-banner img {
    width: 171px;
}

@media (min-width: 768px) {
    .fixed.compact .header-organization-banner img {
        width: 150px;
        padding-top: 4px;
        padding-bottom: 2px;
    }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    /* IE10+ CSS */
    /*css for ui-benefits section on home page, newsroom, etc. for Internet Explorer*/
    .thirdNoPad {
        height: 0px !important;
        width: 0px !important;
    }

    .bannerImageFloat {
        display: none !important;
    }

    .benefitsPadding {
        padding: 3rem;
    }

    @media (max-width: 1044px) {
        .benefitsPadding {
            padding: 2.5rem;
        }
    }
}

.img-left {
    margin-bottom: 1rem;
}

@media (max-width: 768px) {
    .homepageBanner {
        height: 400px !important;
    }

    .homepageBannerText p {
        font-size: .9em !important;
    }
}

@media (max-width: 1069px) {
    .heroContent {
        display: block;
    }

    .heroContent p {
        text-align: left !important;
    }

    .homepageBannerText {
        display: none;
    }
}

@media (min-width: 1070px) {
    .heroContent {
        display: none;
    }

    .homepageBannerText {
        display: block;
    }
}

.parentContainer {
    position: relative;
    text-align: center;
    color: white;
}

.homepageBannerText {
    position: absolute;
    top: 16.75%;
    left: 60px;
    padding: .5em 1.5em 1em !important;
}

.section.hero {
    padding-top: 0px;
}

.homepageBannerText h1 {
    font-size: 2.4rem;
    margin-top: 0.2em;
    margin-bottom: 0.55em;
}

.homepageBannerText p {
    font-size: 1.2rem;
}

.homepage-hero-section {
    position: relative;
    min-height: 320px;
    overflow: hidden;
}

.homepage-hero-bg {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    max-width: 1500px;
    height: 100%;
    background-size: cover;
    background-position-x: 75%;
    background-repeat: no-repeat;
    z-index: 0;
}

.homepage-hero-wave {
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 100%;
    line-height: 0;
    z-index: 1;
}

.homepage-hero-wave svg {
    display: block;
    width: 100%;
    height: auto;
    pointer-events: none;
}

.homepage-hero-section .container {
    position: relative;
    z-index: 1;
    padding: 4rem 1.25rem 0rem 1.25rem;
    min-height: 320px;
}

.homepage-hero-text-container {
    max-width: 75%;
}

.homepage-hero-heading {
    display: none;
    color: white;
    font-family: Montserrat, sans-serif;
    font-weight: 700;
}

.homepage-hero-subheading {
    display: block;
    color: #323A45;
    text-align: left;
    font-family: Montserrat;
    font-size: 2rem;
    font-weight: 700;
    margin-top: 0;
}

.homepage-hero-button-container {
    width: 50%;
    position: absolute;
    bottom: -1rem;
}

.homepage-hero-button-container img {
    width: 100%;
}

@media (min-width: 576px) {
    .homepage-hero-bg {
        background-position-x: 100%;
    }

    .homepage-hero-button-container {
        width: 50%;
        position: relative;
    }
}

@media (min-width: 768px) {
    .homepage-hero-section {
        min-height: 382px;
    }

    .homepage-hero-text-container {
        max-width: 50%;
    }

    .homepage-hero-heading {
        display: block;
        font-size: 2.25rem;
    }

    .homepage-hero-subheading {
        display: none;
    }
}

@media (min-width: 992px) {
    .homepage-hero-text-container {
        max-width: 60%;
        padding-left: 3.125rem;
    }

    .homepage-hero-button-container {
        display: block;
        width:30%;
    }
}

@media (min-width: 1200px) {
    .homepage-hero-text-container {
        max-width: 50%;
    }

    .homepage-hero-heading {
        font-size: 3.75rem;
    }
}

.news-inline-blockquote {
    position: relative;
}

.inline-blockquote-group {
    border-top: 4px solid #046B99;
    border-bottom: 4px solid #046B99;
    padding: 2rem 0 2rem;
    margin: 2.5rem 0 2rem;
    color: #333;
}

.inline-blockquote-group::before {
    content: "";
    background: center / contain no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60 39"><path fill="%23046B98" d="M34.0483 26.3653C34.1633 28.9142 35.0074 31.4069 36.4578 33.4741C37.9108 35.5692 39.9414 37.1546 42.2934 38.09C44.6454 39.0255 47.2012 39.2523 49.6682 38.7119C52.1352 38.2022 54.401 36.9558 56.1728 35.1436C57.9447 33.3313 59.1938 31.0374 59.7165 28.5446C60.2392 26.0518 60.0353 23.4469 59.1363 21.0408C58.2374 18.6627 56.6694 16.5956 54.6074 15.0943C52.5742 13.593 50.136 12.7443 47.6376 12.6296C47.6376 8.94902 52.8643 3.31096 54.955 1.41461C55.07 1.30246 55.1588 1.13169 55.2163 0.960918C55.2451 0.790145 55.2163 0.62192 55.1301 0.451147C55.0726 0.308411 54.955 0.196262 54.84 0.11215C54.725 0.0280377 54.5787 0 54.4036 0H54.2285C50.1935 0.876805 46.3885 2.60493 43.0486 5.01359C38.2584 8.55394 33.4655 15.1249 34.0483 26.3679V26.3653Z"/><path fill="%23046B98" d="M0.0551024 26.3653C0.170059 28.9142 1.01395 31.4069 2.46397 33.4741C3.9166 35.5692 5.94664 37.1546 8.29802 38.09C10.6494 39.0255 13.2046 39.2523 15.6709 38.7119C18.1373 38.2022 20.4024 36.9558 22.1738 35.1436C23.9452 33.3313 25.1941 31.0374 25.7166 28.5446C26.2391 26.0518 26.0353 23.4469 25.1366 21.0408C24.2378 18.6627 22.6702 16.5956 20.6088 15.0943C18.5762 13.593 16.1386 12.7443 13.6409 12.6296C13.6409 8.94902 18.8662 3.31096 20.9563 1.41461C21.0713 1.30246 21.1601 1.13169 21.2176 0.960918C21.2463 0.790145 21.2176 0.62192 21.1314 0.451147C21.0739 0.308411 20.9563 0.196262 20.8414 0.11215C20.7264 0.0280377 20.5801 0 20.4051 0H20.2587C16.2248 0.876805 12.4208 2.60493 9.08182 5.01359C4.23274 8.55394 -0.556259 15.1249 0.0524897 26.3679L0.0551024 26.3653Z"/></svg>');
    background-size: contain;
    background-color: white;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: -20px;
    width: 100px;
    height: 38px;
}

.inline-blockquote {
    background-color: unset;
    border: unset;
    line-height: 1.5;
    margin: 0;
    padding: 1rem 2rem;
}

.inline-blockquote-group div > :not(:last-child) .inline-blockquote {
    padding-bottom: 1.5rem;
}

.inline-blockquote-quote {
    border: unset;
    margin: 0;
    padding: 0;
}

.inline-blockquote-quote p {
    margin: 0;
}

.inline-blockquote-attribution {
    margin-top: 1rem;
    font-weight: 600;
    font-size: 1.1875rem;
    color: #333;
    padding: 0;
}

@media screen and (min-width: 768px) {
    .inline-blockquote {
        padding: 1rem 4.75rem;
    }
}
.modern-card-deck-section {
    padding: 4rem 0;
    font-family: "Roboto Flex";
}

.modern-card-deck-section.white {
    background-color: #fff;
}

.modern-card-deck-section.gray {
    background: #EFEFEF;
}

.modern-card-deck-heading {
    color: #000;
    font-family: Montserrat;
    font-size: 34px;
    font-weight: 700;
    margin-bottom: 2rem;
    margin-top: 0;
}

.modern-card-deck-container {
    display: grid;
    grid-gap: 50px;
    justify-items: center;
    list-style: none;
    padding-inline-start: 0;
    align-items: stretch;
}

.modern-card {
    max-width: 400px;
    min-height: 300px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 25px;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.30);
    transition: box-shadow .2s;
    height: 100%;
    flex: 1;
}

.modern-card:focus {
   outline: 2px solid;
   outline-offset: 4px;
}

.modern-card-deck-container li > article {
    height: 100%;
}

.modern-card-image {
    flex: 1 1 40%;
    background-size: cover;
    background-position: top;
    min-height: 186px;
    max-height: 186px;
}

.modern-card-text-container {
    flex: 1 1 60%;
    color: white;
    padding: 1.75rem;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    font-family: "Roboto Flex";
    background-color: #323A45;
}

.modern-card-heading {
    margin: 0 0 0.75rem;
    font-size: 1.5rem;
    font-weight: 600;
}

.modern-card-body-text {
    font-family: "Roboto Flex";
    font-size: 1rem;
    font-weight: 400;
    padding-bottom: .5rem;
}

.modern-card-link-text {
    margin-top: auto;
    font-size: 1.25rem;
    font-weight: 500;
    color: #fff;
    text-align: center;
    padding: 1rem .5rem;
    border-radius: 2rem;
    border: 1px solid #FFF;
    background: #046B99;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
    transition: box-shadow, background .2s;
}

.modern-card-link-text:hover {
    background: #035376;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
}

.modern-card-link-text:focus {
    outline: solid 2px #9646ff;
}

@media (min-width: 768px) {
    .modern-card-deck-container {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 992px) {
    .modern-card-deck-container {
        grid-template-columns: repeat(3, 1fr);
    }

    .modern-card-deck-heading {
        font-size: 42px;
    }

    .modern-card:hover {
        box-shadow: 6px 8px 8px 0px rgba(0, 0, 0, 0.65);
    }
}

.modern-card-text-container.gray {
    background-color: #323A45;
}

.modern-card-text-container.darkgray {
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.20) 0%, rgba(0, 0, 0, 0.20) 100%), #323A45;
}

.utility-header .flex-row .settings-links {
    min-height: 37px;
}

/********CA Logo styling update***/
.header-cagov-logo img {
    top: 0px;
    height: 25px;
}

/*--lowers the z-index of the EDD Logo in the main nav on mobile
so that it does not interfere with things like the date picker--*/
@media (max-width: 767px) {
    .branding .header-organization-banner a {
        z-index: 5 !important;
    }
}

@media screen and (min-width: 768px) {
    .header-organization-banner-mobile {
        display: none;
    }

    .top-level-nav li:nth-child(1),
    .top-level-nav li:nth-child(2) {
        display: none;
    }

    .settings-links {
        margin-right: 12px;
    }

    .setting-links #LanguageOptions {
        margin-right: 0px;
    }
}

.top-level-nav li:nth-child(1) a span,
.top-level-nav li:nth-child(2) a span {
    display: none;
}

@media screen and (max-width: 767px) {
    .header-organization-banner-desktop {
        display: none;
    }

    .settings-links {
        flex-direction: row-reverse;
    }

        .settings-links a:nth-child(3),
        .settings-links a:nth-child(4) {
            display: none;
        }

    .utility-header .flex-row .settings-links a {
        margin-right: 12px;
    }

    .top-level-nav li:nth-child(1),
    .top-level-nav li:nth-child(2) {
        background-color: #F2F2F2;
        border-top: 1px solid #CCC;
        min-height: 60px;
    }

    .top-level-nav li:nth-child(2) {
        border-bottom: 1px solid #CCC;
    }

        .top-level-nav li:nth-child(1) a,
        .top-level-nav li:nth-child(2) a {
            color: #555;
            padding: 18px 0px 18px 5px;
        }
}

@media (max-width: 976px) {
    #LanguageOptions {
        margin-left: 3px !important;
    }
}

/*---------------------*/
/* Custom Print Screen */
/*---------------------*/
@media print {
    #main-content {
        padding-top: 0px !important;
    }

    .main-primary {
        margin-top: 0px !important;
        width: 100% !important;
    }

    body {
        font-size: 1rem !important;
    }

    #header {
        display: none;
        height: 0px;
    }

    .section section-impact p-b-lg {
        display: none;
    }

    .section.section-impact.p-b-lg div.container {
        display: none;
    }

    #footer {
        display: none;
    }
}
@media print and (min-width: 576px) {
    .main-content > .section,
    .two-column .main-content > .section {
        max-width: unset !important;
    }
}
.quote-block {
    position: relative;
    background-color: #114A66;
    padding: 4rem 1rem;
    margin-bottom: -2px;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    min-height: 400px;
    overflow: hidden;
    font-family: Montserrat;
}

.quote-block-container {
    display: flex;
    justify-content: center;
    background-color: #114A66;
}

.quote-block-text {
    font-size: 1.5rem;
    font-weight: 600;
    max-width: 800px;
    border-left: none;
    z-index: 50;
}

.quote-block-attribution {
    color: white;
    display: block;
    margin-top: 1.5rem;
    font-size: 1.25rem;
    font-weight: 700;
    text-align: right;
}

.quote-block-attribution::before {
    content: "\2011 \00A0";
}

.quote-block-top-wave {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    z-index: 0;
    shape-rendering: auto;
    image-rendering: auto;
}

.quote-block-bottom-wave {
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 100%;
    height: auto;
}

@media (max-width: 576px) {
    .quote-block {
        padding-bottom: 3rem;
    }
}

@media (min-width: 768px) {
    .quote-block-text {
        font-size: 1.75rem;
    }

    .quote-block-attribution {
        font-size: 1.5rem;
    }
}

@media (min-width: 992px) {
    .quote-block {
        padding: 4rem 2rem 4rem;
    }

    .quote-block-text {
        font-size: 1.875rem;
        margin-bottom: 4rem;
    }
}

@media (min-width: 1500px) {
    /*.quote-block {
        background-color: #fff;
        background-image: linear-gradient( to bottom, #ffffff 0%, #ffffff 50%, #EFEFEF 50%, #EFEFEF 100% );
    }

    .quote-block-top-wave {
        display: none;
    }

    .quote-block-bottom-wave {
        display: none;
    }

    .quote-block-container {
        border-radius: 60px;
    }*/

    .quote-block-text {
        /*margin-top: 6rem;*/
        margin-bottom: 6rem;
    }
}

.section:has(.responsive-header-container) {
    padding-top: 0;
}

.responsive-header-translate-container {
    margin-bottom: 24px;
}

.responsive-header-container.white .responsive-header-title,
.responsive-header-container.white .responsive-header-subtitle {
    color: #333333;
}

.responsive-header-container {
    margin-bottom: 24px;
}

.responsive-header {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    min-height: 112px;
    display: flex;
    flex-direction: row;
}

.responsive-header-text-container {
    display: none;
}

.responsive-header-desktop-language-toggle-container {
    display: none;
}

.responsive-header-title {
    font-size: 2rem;
    margin-top: 0;
    margin-bottom: 0;
}

.responsive-header-subtitle {
    font-size: 1.625rem;
}

@media screen and (min-width: 768px) {
    .responsive-header {
        min-height: 151px;
    }  
}

@media screen and (min-width: 991px) {
    .responsive-header-container {
        margin-bottom: 24px;
    }

    .responsive-header-mobile-text-container {
        display: none;
    }

    .responsive-header-text-container {
        display: none;
        display: flex;
        grid-gap: .5rem;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        padding-left: 32px;
        padding-right: 16px;
        max-width: 50%;
        margin-top: 32px;
    }

    .responsive-header-title {
        font-size: 3rem;
    }

    .responsive-header-subtitle {
        font-size: 1.9rem;
        margin-bottom: 3rem;
        margin-top: .5rem;
        line-height: 1.95rem;
    }

    .responsive-header {
        min-height: 280px;
    }

    .responsive-header-container.white .responsive-header-title,
    .responsive-header-container.white .responsive-header-subtitle {
        color: #fff;
    }

    .responsive-header-desktop-language-toggle-container {
        display: block;
    }
}

/*
-------------------
Search Page Styles
-------------------
*/
.custom-search .gsc-results-wrapper-visible,
.custom-search .gsc-table-result {
    font-family: "Roboto Flex", sans-serif !important;
}

.custom-search .gsc-result {
    font-size: 16px !important;
    padding: 14px 0 !important;
}

.custom-search .gsc-result-info {
    font-size: 16px !important;
}

.custom-search .gsc-table-result {
    font-size: 16px !important;
}

.custom-search .gs-title {
    margin-bottom: 0.2rem;
    font-size: 16px !important;
    font-weight: 600;
    background: none !important;
}

.custom-search .gsc-result .gs-title a {
    text-decoration: underline !important;
}

.custom-search .gs-title > b {
    font-size: 16px !important;
}

.custom-search .gs-title:hover,
.custom-search .gs-title:hover * {
    color: #02374e !important;
}

.custom-search .gsc-cursor {
    font-size: 20px;
}

.custom-search .gsc-cursor-page {
    margin-right: 0.5rem !important;
    padding: 0 0.5rem;
}

.custom-search .gsc-cursor-current-page {
    background-color: #046B99 !important;
    color: white !important;
    font-weight: normal !important;
    border-radius: 2px;
}

.custom-search .gcsc-more-maybe-branding-root {
    display: none;
}


#search-page.custom-search .gsc-clear-button,
#search-page.custom-search .close-search-btn {
    display: none !important;
}

.custom-search .gsc-result-info-container {
    display: none;
}

.custom-search .gsc-orderby-container {
    text-align: left !important;
}

.custom-search .gsc-above-wrapper-area {
    border: none !important;
}

.custom-search .gsc-orderby > div {
    display: block !important;
}

.custom-search .gsc-orderby-label {
    font-weight: 700 !important;
    font-size: 16px !important;
    color: black !important;
}

.custom-search .gsc-option-menu {
    left: 0 !important;
    max-width: 25%;
}

.custom-search .gsc-above-wrapper-area {
    margin-bottom: 1.5em;
}

.custom-search .gsc-selected-option-container {
    display: block !important;
    max-width: 100% !important;
    text-align: left !important;
    background: none !important;
    color: black !important;
    font-weight: normal !important;
    font-size: 16px !important;
    padding: 5px 28px 5px 6px !important;
    line-height: 17px !important;
}

.custom-search .gsc-option-menu {
    max-width: 100% !important;
}

.custom-search .gsc-option {
    font-size: 16px !important;
}

.custom-search input.gsc-input {
    width: 100% !important;
    height: 50px !important;
    padding-right: 0.5rem !important;
    padding-left: 0.5rem !important;
    border-radius: 0.3rem 0 0 0.3rem !important;
    border: 1px solid #343a40 !important;
}

.custom-search .gsc-input-box {
    border: none !important;
}

.custom-search button.gsc-search-button {
    margin-left: 0 !important;
    width: 50px !important;
    height: 50px !important;
    border-radius: 0 0.3rem 0.3rem 0 !important;
    background-color: #007bff !important;
    border: none !important;
}

.custom-search td.gsc-search-button::before {
    display: none;
}

.custom-search .ca-gov-icon-search::before {
    position: absolute;
    top: 2px;
    right: 21px;
}

.custom-search .gs-visibleUrl {
    color: #323a45 !important;
}

@media (min-width: 576px) {
    .custom-search .gsc-selected-option-container, .custom-search .gsc-option-menu {
        max-width: 50% !important;
    }
}

/*
-------------------------
Search Callout Styles
-------------------------
*/
.search-engine-callout-container {
    display: none;
    flex-direction: column;
    gap: 2rem;
    margin: 16px 0 32px;
}

.search-engine-callout,
.search-engine-callout-2 {
    border-radius: 8px;
    border: 1px solid var(--Gray-1, #888);
    box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.30), 0px 1px 3px 1px rgba(0, 0, 0, 0.15);
    display: flex;
    padding: 24px 16px;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
}

.search-engine-callout-header {
    color: var(--Primary, #056B99);
    font-family: "Roboto Flex", sans-serif !important;
    font-size: 20px;
    font-weight: 600;
    background-image: none !important;
    margin: 0;
    padding-bottom: 8px;
    text-decoration: underline;
}

.search-engine-callout-header-link {
    background-image: none !important;
}

.search-engine-callout-description {
    color: var(--Black, #333);
    font-family: "Roboto Flex", sans-serif !important;
    font-size: 16px;
    font-weight: 400;
    margin: 0;
}

@media screen and (min-width: 768px) {
    .search-engine-callout-container {
        flex-direction: row;
        margin: 0;
    }

    .search-engine-callout,
    .search-engine-callout-2 {
        width: 50%;
        margin: 11px 0 18px;
    }
}

/* -----------------------------------------
 SERVICE TILE - No Panel Drop Down
----------------------------------------- */
.service-tile-no-panel {
    float: left;
    width: 100%;
    /* Need to keep the two column longer than bootstrap has .make-*-column for */
    padding-left: 0;
    padding-right: 0;
    position: relative;
    padding: 0;
    margin: 0;
    cursor: pointer;
    text-align: center;
    outline: none;
    min-height: 240px;
    color: #E1F2F7;
    background: #046B99;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

    .service-tile-no-panel .icon-fallback {
        min-width: 100%;
        line-height: 1;
        position: absolute;
        bottom: 0;
        left: 0;
        vertical-align: middle;
        display: inline-block;
        height: 100%;
        -webkit-transition: opacity .3s;
        transition: opacity .3s;
    }

    .service-tile-no-panel .teaser {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        background: #000;
        background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.6) 30%, #000000 100%);
        background: linear-gradient(to bottom, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.6) 30%, #000000 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cc000000', endColorstr='#000000', GradientType=0);
        color: #fff;
        padding: 10px 0;
    }

        .service-tile-no-panel .teaser .title {
            margin: 5px 0 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            max-width: 100%;
            -webkit-transition: all .3s;
            transition: all .3s;
        }

            .service-tile-no-panel .teaser .title:hover {
                color: #FDB81E;
            }

    .service-tile-no-panel:focus .teaser .title {
        color: #FDB81E;
    }

@media (min-width: 450px) {
    .service-tile-no-panel {
        width: 50%;
    }
}

@media (min-width: 768px) {
    .service-tile-no-panel {
        min-height: 280px;
        float: left;
        width: 50%;
    }
}

@media (min-width: 992px) {
    .service-tile-no-panel {
        min-height: 240px;
        float: left;
        width: 25%;
    }
}

@media (min-width: 1280px) {
    .service-tile-no-panel {
        min-height: 320px;
    }
}

.simple-callout {
    padding: 1.25rem;
    margin: 1.25rem 0 1.5rem 0;
    border-radius: 18px;
    border: none;
    background-color: #EBEBEB;
}

.simple-callout h2 {
    font-size: 1rem;
    margin: 0;
}

.simple-callout-heading {
    font-weight: 700;
}

.simple-callout p {
    margin-bottom: 0;
}

.stats-block-divider-desktop {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 12;
    width: 100%;
    display: none;
}

.stats-block-divider-mobile {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 12;
    width: 100%;
}

.stats-block-section {
    position: relative;
    padding: 0;
}

.stats-block-inner {
    position: relative;
    margin: 0 auto;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    overflow: hidden;
    padding: 15% 0 2rem;
}

    .stats-block-inner::before {
        content: "";
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: #046B99;
        opacity: 0.9;
        z-index: 11;
    }

.stats-block-content {
    position: relative;
    z-index: 11;
}

.stats-block-heading {
    font-size: 2rem;
    margin-bottom: 0;
    font-weight: 700;
    color: white;
}

h3.stats-block-heading {
    font-size: 1.5rem;
}

.stats-list-container-mobile {
    display: grid;
    grid-template-columns: 1fr;
    justify-items: center;
    gap: 2rem;
    margin: 2.6875rem 0;
}

.stats-list-container-desktop {
    display: none;
}

.stat-item {
    color: white;
    text-align: center;
}

.stats-list-container-mobile .stat-item {
    display: flex;
    align-items: center;
    justify-content: center;
    grid-gap: 1.5rem;
    width: 100%;
    flex-wrap: wrap;
}

.stat-circle-container {
    min-width: 160px;
    height: auto;
    aspect-ratio: 1;
    border: 7px solid #FDB81D;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #046B99;
}

.stat-content {
    padding: 0 10px;
}

.stat-number {
    font-family: Montserrat;
    font-size: 2rem;
    font-weight: 700;
}

.stat-description-mobile {
    text-align: left;
    font-size: 1.25rem;
    font-weight: 600;
}

.stats-block-sub-container {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    color: white;
}

.stats-subheading {
    font-size: 1.5rem;
    margin-bottom: 2rem;
}

.stats-link {
    font-size: 1.5rem;
    display: inline-block;
    padding: .9rem;
    border-radius: 30px;
    background: #FFF;
    background-image: none !important;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
    text-decoration: none;
    text-align: center;
    font-weight: 500;
    color: #5E5E6A;
    min-width: 350px;
}

@media (min-width: 370px) {
    .stats-list-container-mobile .stat-item {
        flex-wrap: nowrap;
        justify-content: flex-start;
    }
}

@media (min-width: 768px) {
    .stat-circle-container {
        max-width: 308px;
    }

    .stats-block-inner {
        padding-bottom: 3rem;
    }

    .stats-block-heading {
        font-size: 2rem;
        margin-left: 25px;
    }

    h3.stats-block-heading {
        font-size: 1.25rem;
    }

    .stats-list-container-mobile {
        display: none;
    }

    .stat-description-mobile {
        font-size: 1.5rem;
    }

    .stats-list-container-desktop {
        margin: 2.5rem 0 2rem;
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-gap: 3rem;
    }

    .stat-number {
        font-size: 3.75rem;
        font-weight: 700;
    }

    .stats-subheading {
        font-size: 2.25rem;
        margin-left: 25px;
    }

    .stats-link {
        min-width: 75%;
    }

    .stat-description-desktop {
        font-size: 1.25rem;
    }
}

@media (min-width: 992px) {
    .stats-block-divider-desktop {
        display: block;
    }

    .stats-block-divider-mobile {
        display: none;
    }

    .stats-block-heading {
        font-size: 2.5rem;
    }

    h3.stats-block-heading {
        font-size: 1.75rem;
    }

    .stats-list-container-desktop {
        grid-template-columns: repeat(4, 1fr);
    }

    .stat-number {
        font-size: 2.5rem;
    }

    .stat-description {
        font-size: 0.875rem;
    }

    .stats-link {
        min-width: 0;
        font-size: 1rem;
    }

    .stats-block-sub-container {
        flex-direction: row;
        grid-gap: 2rem;
    }

    .stats-subheading {
        font-size: 1.5rem;
        max-width: 50%;
    }
}

/* =============================================================================
   Tables
   ========================================================================== */
/*overriding for new template that moved table caption to bottom of table - 
    moving back to top so caption can be used as title for accessibility purposes */
caption {
    padding-left: 0.75rem;
    color: #212529;
    text-align: left;
    font-weight: bold;
    caption-side: top;
}

.table_column_10 {
    width: 10%;
}

.table_column_15 {
    width: 15%;
}

.table_column_30 {
    width: 30%;
}

.table_column_sm {
    width: 20%;
}

.table_column_med {
    width: 40%;
}

.table_column_lg {
    width: 60%;
}

.table_column_qtr {
    width: 25%;
}

.table_column_half {
    width: 50%;
}

.table_column_3qtr {
    width: 75%;
}

.center-div-80 {
    margin: auto;
    width: 80%;
}

.center-div-50 {
    margin: auto;
    width: 50%;
}

.tab-panels {
    padding: 2rem 0;
}

.tab-panels .tab-headers {
    list-style: none;
    padding: 0;
    margin: 0 0 2rem;
    display: flex;
    justify-content: space-evenly;
}

.tab-panels .tab-content .tab-panel {
    pointer-events: none;
    user-select: text;
}

.tab-panels .tab-content .tab-panel.active {
    pointer-events: auto;
    z-index: 1;
}

.tab-panels .tab-headers .tab-header {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    margin: 0;
    flex: 1;
    text-align: center;
    border-bottom: 3px solid #FDB81E;
}

.tab-panels .tab-headers .tab-header.active {
    border-bottom: 8px solid #046B99;
}

.tab-panels .tab-headers .tab-header.active button {
    font-weight: 700;
}

.tab-panels .tab-headers .tab-header button {
    background: none;
    border: none;
    padding: 0.5rem 1rem;
    cursor: pointer;
    font-size: 1.625rem;
    color: #000;
    transition: font-weight 0.2s ease-in;
}

.tab-panels .tab-headers .tab-header button:focus {
    outline: 2px solid #00587C;
    outline-offset: 2px;
}

.tab-panels .tab-headers .tab-header button:hover {
    font-weight: 700;
}

.tab-panels .tab-content {
    position: relative;
    min-height: 200px;
}

.tab-panels .tab-content .tab-panel {
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 0.3s ease, transform 0.3s ease;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

.tab-panels .tab-content .tab-panel.active {
    opacity: 1;
    transform: translateY(0);
    position: relative;
}

.tab-panels .tab-content .tab-panel h2 {
    margin-top: 0;
    font-size: 1.75rem;
}

.tab-panel-image {
    max-width: 100%;
    width: 100%;
    height: auto;
    display: block;
}

.accordion-header {
    display: none;
}

.accordion-content {
    display: grid;
    grid-template-columns: 1fr minmax(600px, 0);
    grid-gap: 5rem;
}

.accordion-content .btn-row {
    margin-top: 1.75rem;
}

@media (max-width: 767px) {
    .tab-panel:not(.active) {
        margin-bottom: 2rem;
    }

    .tab-panels .tab-headers {
        display: none;
    }

    .tab-panels .tab-content .tab-panel {
        pointer-events: auto;
        position: static;
        opacity: 1;
        transform: none;
    }

    .accordion-header {
        display: flex;
        align-items: center;
        width: 100%;
        text-align: left;
        font-weight: 700;
        border: none;
        padding: 0.5rem 0;
        font-size: 1.5rem;
        cursor: pointer;
        background: none;
        border-bottom: 8px solid #046B99;
        scroll-margin-top: 8.5rem;
    }

    .accordion-header[aria-expanded="false"] {
        border-bottom: 3px solid #FDB81E;
        font-weight: 400;
    }

    .accordion-icon {
        padding: 10px;
        margin-right: 15px;
    }

    .accordion-icon svg {
        display: none;
        flex-shrink: 0;
        margin-left: 0.5rem;
    }

    .accordion-header[aria-expanded="false"] .icon-closed {
        display: inline-block;
    }

    .accordion-header[aria-expanded="true"] .icon-open {
        display: inline-block;
    }

    .accordion-content {
        display: none;
        max-height: 0;
        opacity: 0;
        overflow: hidden;
        transition: max-height 0.3s ease;
        padding: 1.75rem 1rem;
        margin-top: 1.75rem;
    }

    .tab-panel.active .accordion-content {
        display: block;
        opacity: 1;
        max-height: 3000px;
        padding-top: 0.5rem;
        padding-bottom: 1rem;
    }

    .tab-panel-desktop-header {
        font-size: 1.375rem;
    }

    .accordion-content .btn-row {
        padding: .75rem;
    }
}

@media (max-width: 992px) {
    .accordion-content {
        grid-template-columns: 1fr;
        grid-gap: 1rem;
    }
}

@media (max-width: 1200px) {
    .accordion-content {
        grid-template-columns: 1fr minmax(400px, 0);
        grid-gap: 3rem;
    }
}

@media (max-width: 767px) and (prefers-reduced-motion: no-preference) {
    .accordion-content {
        transition: max-height 0.4s ease, opacity 0.4s ease;
    }
}

@media (prefers-reduced-motion: reduce) {
    .accordion-content {
        transition: none !important;
    }
}