@import url(TwoPane/desktop.css) (min-width: 1537px) and (min-aspect-ratio: 12/10);
@import url(TwoPane/tablet_portrait.css) (min-width: 768px) and (max-aspect-ratio: 12/10);
@import url(TwoPane/tablet_portrait.css) (max-width: 1536px) and (orientation: landscape);
@import url(TwoPane/mobile_portrait.css) (max-width: 767px) and (orientation: portrait);
@import url(TwoPane/mobile_landscape.css) (max-width: 767px) and (orientation: landscape);

a.bar:hover {
    background-color: #304080;
    color: #ffffff;
    text-decoration: none;
}

/* Benefits page: stack panes vertically and let the page scroll
   instead of restricting each pane to a fixed viewport height. */
body.highlight_benefits #two_pane_layout_container_wrapper {
    overflow: visible;
}

body.highlight_benefits #two_pane_layout_container,
body.highlight_benefits #two_pane_layout_container > div {
    display: block;
    width: 100%;
    height: auto;
}

body.highlight_benefits #main_pane,
body.highlight_benefits #secondary_pane {
    display: block;
    width: 100%;
    height: auto;
    min-height: 0;
    max-height: none;
    overflow: visible;
    box-sizing: border-box;
}


/* Benefits page desktop: restore side-by-side table layout */
@media (min-width: 1537px) and (min-aspect-ratio: 12/10) {
    body.highlight_benefits #two_pane_layout_container {
        display: table;
        height: 73.38551859vh;
    }
    body.highlight_benefits #two_pane_layout_container > div {
        display: table-cell;
        vertical-align: top;
    }
    body.highlight_benefits #two_pane_layout_container > div:first-child {
        width: 100%;
    }
    body.highlight_benefits #main_pane {
        display: table;
        width: 100%;
        height: 100%;
        overflow: auto;
        min-height: unset;
        max-height: unset;
        box-sizing: border-box;
    }
    body.highlight_benefits #secondary_pane {
        width: 25vw;
        height: 100%;
        overflow: auto;
        min-height: 73.38551859vh;
        max-height: unset;
        box-sizing: content-box;
    }
}

/* Standard keyboard focus indicator for yellow buttons (and labels styled as such) across the app */
.btn-yellow:focus,
.btn-yellow:focus-visible,
.btn-send:focus,
.btn-send:focus-visible,
.btn-selection-blue:focus,
.btn-selection-blue:focus-visible {
    outline: 3px solid rgba(28, 39, 90, 0.8);
    outline-offset: 3px;
}
