﻿:root {
        --msq-blue: #005C9F;
        /* 0,92,159*/
        --msq-sky: #0094CF;
        /* 0,148,207 */
        --msq-grape: #5C62AC;
        /* 92,98,167 */
        --msq-teal: #00838B;
        /* 0,131,139 */
        --msq-green: #00893A;
        /* 0,137,58 */
        --msq-berry: #902B8A;
        /* 144,43,138 */
        --msq-rose: #BF57A0;
        /* 191,87,160 */

        --msq-navy: #1A3865;
        --msq-gold: #ffce00;
        --msq-sky-dark: #0A71A6;
        --msq-grape-dark: #4D4F8C;
        /* no dark versions of teal or green */
        --msq-berry-dark: #802A7B;
        --msq-rose-dark: #9A3C77;
        --msq-sky-light: #6AC0EB;
        --msq-grape-light: #6F7BBB;
        --msq-teal-light: #53C4C6;
        --msq-green-light: #AAD269;
        --msq-berry-light: #AC4C9C;
        --msq-rose-light: #F179AF;
        --msq-gray-8: #8a8E96;
        --msq-gray-5: #B6B8BE;
        --msq-gray-2: #D7D9DE;
        --msq-bright: #F3F5FB;
        --bart-blue: #0176b8;
        --bart-blue-light: #83badb;
        --bart-navy: #002256;
        --bart-green: #46833d;
        --bart-green-dark: #37652F;
        --bart-green-light: #9db38b;
        --bart-celadon: #e4e7e3;
        --bart-sky: #e6f1f8;
        --bart-straw: #edf3ec;
}

/* Typography */
/* @import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,600;1,700;1,800;1,900&display=swap');*/

@font-face {
        font-family: 'Nunito Sans';
        font-style: italic;
        font-weight: 300;
        font-stretch: 100%;
        font-display: swap;
        src: local('Nunito Sans'), url(https://fonts.gstatic.com/s/nunitosans/v15/pe0RMImSLYBIv1o4X1M8cce4OdVisMz5nZRqy6cmmmU3t2FQWEAEOvV9wNvrwlNstMKW3Y6K5WMwd-laLQ.woff2) format('woff2');
        unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
        font-family: 'Nunito Sans';
        font-style: italic;
        font-weight: 400;
        font-stretch: 100%;
        font-display: swap;
        src: local('Nunito Sans'), url(https://fonts.gstatic.com/s/nunitosans/v15/pe0RMImSLYBIv1o4X1M8cce4OdVisMz5nZRqy6cmmmU3t2FQWEAEOvV9wNvrwlNstMKW3Y6K5WMwd-laLQ.woff2) format('woff2');
        unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
        font-family: 'Nunito Sans';
        font-style: italic;
        font-weight: 600;
        font-stretch: 100%;
        font-display: swap;
        src: local('Nunito Sans'), url(https://fonts.gstatic.com/s/nunitosans/v15/pe0RMImSLYBIv1o4X1M8cce4OdVisMz5nZRqy6cmmmU3t2FQWEAEOvV9wNvrwlNstMKW3Y6K5WMwd-laLQ.woff2) format('woff2');
        unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
        font-family: 'Nunito Sans';
        font-style: italic;
        font-weight: 700;
        font-stretch: 100%;
        font-display: swap;
        src: local('Nunito Sans'), url(https://fonts.gstatic.com/s/nunitosans/v15/pe0RMImSLYBIv1o4X1M8cce4OdVisMz5nZRqy6cmmmU3t2FQWEAEOvV9wNvrwlNstMKW3Y6K5WMwd-laLQ.woff2) format('woff2');
        unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
        font-family: 'Nunito Sans';
        font-style: italic;
        font-weight: 800;
        font-stretch: 100%;
        font-display: swap;
        src: local('Nunito Sans'), url(https://fonts.gstatic.com/s/nunitosans/v15/pe0RMImSLYBIv1o4X1M8cce4OdVisMz5nZRqy6cmmmU3t2FQWEAEOvV9wNvrwlNstMKW3Y6K5WMwd-laLQ.woff2) format('woff2');
        unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
        font-family: 'Nunito Sans';
        font-style: normal;
        font-weight: 300;
        font-stretch: 100%;
        font-display: swap;
        src: local('Nunito Sans'), url(https://fonts.gstatic.com/s/nunitosans/v15/pe0TMImSLYBIv1o4X1M8ce2xCx3yop4tQpF_MeTm0lfGWVpNn64CL7U8upHZIbMV51Q42ptCp7t1R-s.woff2) format('woff2');
        unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
        font-family: 'Nunito Sans';
        font-style: normal;
        font-weight: 400;
        font-stretch: 100%;
        font-display: swap;
        src: local('Nunito Sans'), url(https://fonts.gstatic.com/s/nunitosans/v15/pe0TMImSLYBIv1o4X1M8ce2xCx3yop4tQpF_MeTm0lfGWVpNn64CL7U8upHZIbMV51Q42ptCp7t1R-s.woff2) format('woff2');
        unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
        font-family: 'Nunito Sans';
        font-style: normal;
        font-weight: 600;
        font-stretch: 100%;
        font-display: swap;
        src: local('Nunito Sans'), url(https://fonts.gstatic.com/s/nunitosans/v15/pe0TMImSLYBIv1o4X1M8ce2xCx3yop4tQpF_MeTm0lfGWVpNn64CL7U8upHZIbMV51Q42ptCp7t1R-s.woff2) format('woff2');
        unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
        font-family: 'Nunito Sans';
        font-style: normal;
        font-weight: 700;
        font-stretch: 100%;
        font-display: swap;
        src: local('Nunito Sans'), url(https://fonts.gstatic.com/s/nunitosans/v15/pe0TMImSLYBIv1o4X1M8ce2xCx3yop4tQpF_MeTm0lfGWVpNn64CL7U8upHZIbMV51Q42ptCp7t1R-s.woff2) format('woff2');
        unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
        font-family: 'Nunito Sans';
        font-style: normal;
        font-weight: 800;
        font-stretch: 100%;
        font-display: swap;
        src: local('Nunito Sans'), url(https://fonts.gstatic.com/s/nunitosans/v15/pe0TMImSLYBIv1o4X1M8ce2xCx3yop4tQpF_MeTm0lfGWVpNn64CL7U8upHZIbMV51Q42ptCp7t1R-s.woff2) format('woff2');
        unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

html,
body,
button,
input,
optgroup,
select,
textarea,
.is-family-primary,
.is-family-sans-serif {
        font-family: 'Helvetica Neue', Helvetica, Arial, 'Lucida Grande', sans-serif !important;
}

/* fills the available vertical space */
html {
        background: var(--msq-gray-8);
        display: flex;
        flex-direction: column;
        min-height: 100%;
}

body {
        background: #fff;
        display: flex;
        flex-direction: column;
        flex-grow: 1;
        justify-content: stretch;
        margin: 0 auto;
        max-width: 1366px;
        padding: 2rem;
        scroll-behavior: smooth;
}

#main {
        flex-grow: 1;
        display: flex;
        flex-direction: column !important;
        margin: 0;
}

/* fills the navy background */
#main-content {
        display: flex;
        flex-direction: column;
        flex-grow: 1;
}

/* end vertical fill */
header,
main,
footer {
        clear: both;
}

.content {
        padding: 3rem !important;
}

h1,
h2,
h3,
h4,
h5,
.content h1,
.content h2,
.content h3,
.content h4,
.content h5 {
        color: #ffffff;
        font-family: "Avenir Next Pro", "Nunito Sans", Helvetica, Arial, sans-serif;
}

img {
        max-height: 100%;
}

sup {
        line-height: 0.75;
}

/* site header */
header {
        background: #fff;
        /*
  margin: 0 auto; */
        max-width: 1344px;
}

header .buttons {
        display: none;
}

header .button {
        background: var(--bart-navy);
}

header .navbar:first-child {
        color: var(--bart-navy);
        padding: 2rem;
}

.navbar-brand,
.navbar-menu {
        box-shadow: none;
}

.navbar a:not(.button) {
        text-decoration: none !important;
}

.navbar-item img.site-logo {
        max-height: 90px;
}

.navbar-item.site-name {
        align-items: flex-start;
        flex-direction: column;
        flex-shrink: 4;
}

.quicklinks .button {
        background: var(--bart-blue);
        color: #f2f2f2;
        margin-right: 0 !important;
}

.quicklinks a.button[href^='tel:']:active,
.quicklinks a.button[href^='tel:']:focus,
.quicklinks a.button[href^='tel:']:hover {
        color: var(--bart-blue) !important;
        border: none !important;
}

.quicklinks a.button:not([href^='tel:']):active,
.quicklinks a.button:not([href^='tel:']):focus,
.quicklinks a.button:not([href^='tel:']):hover {
        background: var(--bart-navy) !important;
        border: none !important;
}

.main-navigation,
.main-navigation .navbar-menu {
    background: var(--bart-navy) !important;
}

.main-navigation,
.main-navigation > .navbar-item {
  flex-shrink: 1;
  flex-grow: 1;
  justify-content: center;
}

.navbar-link.is-active,
.navbar-link:focus,
.navbar-link:focus-within,
.navbar-link:hover,
a.navbar-item.is-active,
a.navbar-item:focus,
a.navbar-item:focus-within,
a.navbar-item:hover,
.navbar-item.is-hoverable:active,
.navbar-item.is-hoverable:focus,
.navbar-item.is-hoverable:hover {
        background-color: var(--bart-blue) !important;
        color: #fff;
}

.navbar-dropdown {
        box-shadow: none;
}

.navbar-dropdown .navbar-item:not(:last-child) {
        border-bottom: 1px solid #f2f2f2;
}

.navbar-dropdown a.navbar-item:focus,
.navbar-dropdown a.navbar-item:hover,
.navbar-dropdown a.navbar-item:active {
        background-color: var(--bart-blue);
        color: #fff;
}

.site-name .title {
        font-size: 1.5rem;
}

.site-name .subtitle {
        font-size: 1rem;
}

/* quick links */
.quicklinks .buttons {
        flex-direction: column;
}

.quicklinks a.button[href^='tel:'] {
        background: transparent !important;
        border: none;
        color: var(--bart-navy) !important;
        padding: 0;
}

.navbar {
        z-index: 101;
}

.navbar .navbar-item svg {
        fill: #f2f2f2;
        padding: 0;
}

.navbar-link.is-active,
.navbar-link:focus,
.navbar-link:focus-within,
.navbar-link:hover,
a.navbar-item.is-active,
a.navbar-item:focus,
a.navbar-item:focus-within,
a.navbar-item:hover {
    background: var(--bart-navy);
    color: var(--bart-blue-light);
}

.navbar-link.is-active svg path,
.navbar-link:focus svg path,
.navbar-link:focus-within svg path,
.navbar-link:hover svg path,
a.navbar-item.is-active svg path,
a.navbar-item:focus svg path,
a.navbar-item:focus-within svg path,
a.navbar-item:hover svg path {
    fill: var(--bart-blue-light);
}

.navbar-brand a.navbar-item:focus, .navbar-brand a.navbar-item:hover {
  background: transparent !important;
}

.main-navigation .navbar-brand .button {
        border: none;
        border-radius: 0;
        margin-left: 0.75rem;
        padding: 0.5rem 1.5rem !important;
}

.main-navigation a.button.is-active,
.main-navigation a.button:active .button:focus,
.main-navigation a.button:focus-within,
.main-navigation a.button:hover {
        background: var(--bart-blue-light) !important;
        color: #f2f2f2;
}

.navbar-brand {
        flex-shrink: 1;
        align-items: center;
}

.main-navigation {
        align-items: stretch;
}

.main-navigation.navbar-menu {
        background: var(--bart-navy);
        box-shadow: none;
}

.main-menu .navbar-item.has-dropdown .navbar-dropdown a.navbar-item {
        margin-left: 0.5rem;
        padding-left: 0.25rem;
}

.navbar-burger {
        color: #f2f2f2;
        margin-left: 0;
        margin-right: auto;
}

a.navbar-burger:focus,
a.navbar-burger:hover,
a.navbar-burger:active {
        color: #f2f2f2 !important;
}

.navbar-burger span {
        height: 2px;
        width: 36px;
}

.navbar-burger span:first-child {
        top: calc(50% - 8px);
}

.navbar-burger span:nth-child(2) {
        top: calc(50% - 0px);
}

.navbar-burger span:last-child {
        top: calc(50% + 8px);
}

/* main menu */
.main-menu {
        font-size: 1.2rem;
        justify-content: space-between;
        padding: 0 0.5rem;
}

.navbar .main-menu a:not(.button) {
        color: #f2f2f2;
        font-weight: 600;
}

/* Mega menu main navigation */
.navbar-item.is-mega {
        position: static;
}

.is-mega-menu-title {
        font-weight: 700;
        text-transform: uppercase;
}

.breadcrumb {
        color: #aaaaaa;
        font-size: 0.75rem;
        padding: 0.5rem 1rem;
}

.breadcrumb li+li::before {
        color: #aaaaaa;
        content: "\0003e";
}

.breadcrumb a,
.breadcrumb a:link:not(.button),
.breadcrumb a:visited:not(.button) {
        color: #aaaaaa;
        outline: none;
        text-decoration: underline;
}

.preface {
        margin: 2rem auto;
}

/* Buttons */
button,
.button {
        background: var(--bart-blue);
        border: none;
        color: #f2f2f2;
        font-weight: 600;
        height: auto;
        text-decoration: none;
        white-space: normal;
}

.button:link,
.button:visited {
        background: var(--bart-blue);
        color: #f2f2f2;
}

.button.is-focus,
.button:focus {
        background: var(--bart-navy);
        color: #f2f2f2;
}

.button.is-hover,
.button:hover {
        background: var(--bart-navy);
        border: none;
        color: #ffffff;
}

.button.is-active,
.button:active {
        background: var(--bart-navy);
        color: #ffffff;
}

button.green,
.button.green,
.button.green:link,
.button.green:visited {
        background: var(--bart-green);
}

button.green:active,
button.green.is-active,
button.green:hover,
button.green.is-hover,
button.green:focus,
button.green.is-focus,
.button.green:active,
.button.green.is-active,
.button.green:hover,
.button.green.is-hover,
.button.green:focus,
.button.green.is-focus {
        background: var(--bart-green-dark);
}


/*.content a:not(.card-footer-item),*/
#anchor-buttons a:not(.card-footer-item) {
        border: none;
        color: #f2f2f2 !important;
        text-decoration: underline;
}

/*
.content a:not(.card-footer-item).is-focus,
.content a:not(.card-footer-item):focus {
    border: none;
    color: var(--bart-blue-light) !important;
    text-decoration: none;
}

.content a:not(.card-footer-item).is-hover,
.content a:not(.card-footer-item):hover {
    border: none;
    color: var(--bart-blue-light) !important;
    text-decoration: none;
}

.content a:not(.card-footer-item).is-active,
.content a:not(.card-footer-item):active {
    border: none;
    color: var(--bart-blue-light) !important;
    text-decoration: none;
}
*/
#anchor-buttons a:not(.card-footer-item).is-focus,
#anchor-buttons a:not(.card-footer-item):focus {
        border: none;
        color: var(--bart-blue-light) !important;
        text-decoration: none;
}

#anchor-buttons a:not(.card-footer-item).is-hover,
#anchor-buttons a:not(.card-footer-item):hover {
        border: none;
        color: var(--bart-blue-light) !important;
        text-decoration: none;
}

#anchor-buttons a:not(.card-footer-item).is-active,
#anchor-buttons a:not(.card-footer-item):active {
        border: none;
        color: var(--bart-blue-light) !important;
        text-decoration: none;
}

/* Body Text */
h1.title,
main,
strong,
.preface,
.postscript {
        color: #f2f2f2;
}

main p {
        margin: 0 0 1rem;
}

/* Links ------------------------------------------------------------------------------ */
a,
a:link:not(.button),
a:visited:not(.button) {
        color: var(--bart-navy);
        outline: none;
        text-decoration: underline;
}

a:focus:not(.button),
a:hover:not(.button),
a:active:not(.button) {
 color: var(--bart-blue);
 text-decoration: none;
}

.skiplink {
        display: block;
        padding: 0.5rem;
        position: absolute;
        transform: translateY(-500%);
}



/* MSQ hero images */
.hero {
        margin: 0 0 3rem;
}

.hero-body {
        padding: 0;
}

.hero h1.title {
        font-size: 2.5rem;
}

.hero-title, .hero .subtitle {
    color: #fefefe;
}




.hero-wrapper {
        background-size: cover;
}

#main-content {
        background: var(--bart-navy);
}

#main-content>.columns>.column {
        padding: 0;
}


.content a:link:not(.button),
.content a:visited:not(.button) {
        color: #f2f2f2;
        outline: none;
        text-decoration: underline !important;
}

.content a:focus:not(.button),
.content a:hover:not(.button),
.content a:active:not(.button) {
        color: #ffffff;
}


/* ribbon card */
.card {
        background: transparent;
}

.ribbon-card strong {
        color: #444;
}

.ribbon-card .box {
        background: #fff;
        color: #222;
        padding: 0;
        position: relative;
}

.ribbon-card .ribbon {
        color: #f2f2f2 !important;
        font-size: 1.2rem;
        font-weight: bold;
        padding: 1.25em 1.5em;
}

.ribbon-card h2.ribbon {
        font-size: 1.5rem;
}

.ribbon-card a:link:not(.button),
.ribbon-card a:visited:not(.button) {
        color: var(--bart-navy);
}

.ribbon-card h2.ribbon a:hover:not(.button),
.ribbon-card h2.ribbon a:active:not(.button) {
        color: var(--bart-blue);
}

.ribbon-card h2.ribbon a {
        align-items: center;
        display: flex;
        justify-content: space-between;
        width: 100%;
}

.ribbon-card h2.ribbon a:link:not(.button),
.ribbon-card h2.ribbon a:visited:not(.button) {
        color: #f2f2f2 !important;
        text-decoration: none !important;
}

.ribbon-card h2.ribbon a:hover:not(.button),
.ribbon-card h2.ribbon a:active:not(.button) {
        color: #fff !important;
}

.ribbon-card h2.ribbon a:after {
        content: '❯';
        display: inline-block;
        height: 1rem;
        line-height: 1rem;
        margin-right: 0.25rem;
        transform: rotate(-0.25turn);
        width: 1rem;
}

.ribbon-card.is-expanded h2.ribbon a:after {
        transform: rotate(0.25turn);
}

.ribbon-card.blue .box {
        background: var(--bart-sky);
}

.ribbon-card.green .box {
        background: var(--bart-celadon);
}

.ribbon,
.ribbon.blue {
        background: var(--bart-blue);
}

.ribbon-card.green .ribbon {
        background: var(--bart-green-dark);
}

.ribbon-card .button {
        background: var(--bart-blue);
        border: none;
        color: #f2f2f2 !important;
}

.ribbon-card .button.is-transparent {
        background: transparent !important;
        border: none;
        box-shadow: none !important;
        color: var(--bart-navy) !important;
        font-size: 1.75rem !important;
        text-align: left;
        padding: 0;
}

.ribbon-card .button.is-transparent:active,
.ribbon-card .button.is-transparent:hover {
        color: var(--bart-blue) !important;
        border: none;
}

.ribbon-card a.button.is-transparent:link:not(.button),
.ribbon-card a.button.is-transparent:visited:not(.button) {
        color: var(--bart-navy);
}

.ribbon-card.green .button {
        background: var(--bart-green);
        border: none;
}

.ribbon-card .card:hover .card-footer .button,
.ribbon-card .button:hover,
.ribbon-card .button:active {
        background: var(--bart-navy);
        border: none;
}

.ribbon-card.green .card:hover .card-footer .button,
.ribbon-card.green .button:hover,
.ribbon-card.green .button:active {
        background: var(--bart-green-dark);
        border: none;
}

.ribbon-card a:not(.button) {
        color: var(--bart-blue);
        text-decoration: underline;
}

.ribbon-card a:active:not(.button),
.ribbon-card a:hover:not(.button) {
        color: var(--bart-navy);
        text-decoration: none;
}

.ribbon-card a:link:not(.button),
.ribbon-card a:visited:not(.button) {
        color: var(--bart-navy);
}

/* ribbon card icons */
.card-image figure.icon {
        border: 4px solid var(--bart-blue);
        border-radius: 100%;
}

.ribbon-card .card:hover figure.icon,
.card-image figure.icon:hover {
        border-color: var(--bart-navy);
        transition: 0.2s;
}

.ribbon-card.green .card-image figure.icon {
        border: 4px solid var(--bart-green);
        border-radius: 100%;
}

.ribbon-card.green .card:hover figure.icon,
.ribbon-card.green .card-image figure.icon:hover {
        border-color: var(--bart-green-dark);
        transition: 0.2s;
}

.ribbon-card .card:hover figure.icon img,
.ribbon-card figure.icon img:hover {
        filter: brightness(0) saturate(100%) invert(13%) sepia(18%) saturate(7500%) hue-rotate(200deg) brightness(91%) contrast(106%);
}

.ribbon-card.green figure.icon img {
        filter: brightness(0) saturate(100%) invert(41%) sepia(38%) saturate(613%) hue-rotate(66deg) brightness(98%) contrast(91%);
}

.ribbon-card.green figure.icon .card:hover img,
.ribbon-card.green figure.icon img:hover {
        filter: brightness(0) saturate(100%) invert(32%) sepia(12%) saturate(1970%) hue-rotate(65deg) brightness(98%) contrast(89%);
}

/* ribbon card collapsing behavior */
.ribbon-card .card {
        display: block;
}

.ribbon-card .columns {
        display: flex;
        padding: 0 0.75rem;
}

.ribbon-card.is-expanded .columns,
.ribbon-card.is-expanded .card {
        display: none;
}

.ribbon-card .box.is-expanded .ribbon a:after {
        transform: rotate(-0.25turn);
}

.ribbon-card .card-footer-item {
        height: 3.5rem;
        font-size: 0.9rem !important;
}

/* icon cards */
.card .card-image figure.icon {
        margin: 0 auto 1rem;
        background: #ffffff;
}

.card .card-content {
        line-height: 1.2;
}

/* slideshow */
/* ResponsiveSlides.js styles ------------------------------ */
.rslides_container {
        clear: both;
        margin: 0 auto;
        overflow: hidden;
        position: relative;
        z-index: 100;
}

.rslides_container .caption {
        display: none;
        /*    background: rgba(0, 0, 0, 0.5);
    bottom: 0;
    color: #fff;
    font-size: 120%;
    min-height: 25px;
    overflow: hidden;
    padding: 10px 10px 10px 20px;
    position: absolute;
    width: 100%;
    z-index: 500; */
}

/* .rslides_container .caption a {
    color: #FFFFFF;
}

.rslides_container .caption h1 span {
    color: #FFFFFF;
}

.rslides_container.caption p {
    display: none;
    font-size: 100%;
    line-height: 0px;
    margin-bottom: 10px;
} */

.rslides_container .featureTabs {
        display: none;
        visibility: hidden;
}

.rslides {
        list-style: none;
        margin: 0 auto !important;
        overflow: hidden;
        padding: 0 !important;
        position: relative;
        width: 100%;
}

.rslides li {
        display: none;
        left: 0;
        max-height: 480px;
        padding: 0 !important;
        position: absolute;
        top: 0;
        width: 100% !important;
}

.rslides li:first-child {
        display: block;
        float: left;
        position: relative;
}

.rslides img {
        display: block;
        float: left;
        height: auto;
        width: 100%;
}

ul#slides1 {
        background-color: #052946;
        max-width: 100%;
}

#buttonContainer {
        position: absolute;
        top: 40%;
        width: 100%;
}

.rslides1_nav {
        height: 75px;
        overflow: hidden;
        position: absolute;
        text-decoration: none;
        text-indent: -9999px;
        top: calc(50% - 38px);
        width: 50px;
        z-index: 1000;
}

.rslides1_nav.prev {
        background: url("https://www.missionsq.org/prebuilt/images/slides/arrow-prev-wh.png") no-repeat scroll left top;
        left: 0;
}

.rslides1_nav.next {
        background: url("https://www.missionsq.org/prebuilt/images/slides/arrow-next-wh.png") no-repeat scroll right top;
        right: 0;
}

.caption a {
        color: #ffffff;
}

.rslides1_tabs {
        display: none;
}

.caption {
        clear: both;
        line-height: 1em;
        padding: 10px;
}

.caption h1 {
        margin-bottom: 0px;
}

.caption>p {
        margin: 0 !important;
}

/* tables */
.content table,
.content table th,
.content table td {
        border: 1px solid var(--bart-blue);
}

.content table th,
.content table td {
        color: #f2f2f2;
}

.ribbon-card table th,
.ribbon-card table td {
        color: #333;
}

/* search */
.bart.page-x30755 h2 {
  font-size: 125%;
}

#search {
        display: flex;
        align-items: center;
}

.searchField {
        margin-right: 1vw;
}

.searchField #q {
        width: 300px;
        font-size: larger;
}

#searchResults a:link,
#searchResults a:visited {
  color: #f2f2f2;
}
#searchResults a:hover,
#searchResults a:active {
  color: #fff;
}


/* back to top button */
#back-to-top {
        position: fixed;
        bottom: 20px;
        right: 20px;
        background-color: #707070;
        color: #fff;
        border: none;
        border-radius: 5px;
        padding: 10px 20px;
        cursor: pointer;
        display: none;
        margin-right: 15%;
}

/* footer */
footer.footer {
        background: var(--bart-navy);
        color: #f2f2f2;
        font-size: 0.75rem;
}

footer.footer a,
footer.footer a:link:not(.button),
footer.footer a:visited:not(.button) {
        color: #f2f2f2;
        text-decoration: underline;
}

footer.footer a:hover:not(.button),
footer.footer a:active:not(.button) {
        color: #fff;
        text-decoration: none;
}

/* MOBILE STYLES 
------------------------------------------------------------------------------ */
@media only screen and (max-width:768px) {
        .navbar {
                padding: 0.5rem;
        }

        .navbar.main-navigation {
                padding: 0;
        }

        .quicklinks {
                display: none !important;
        }

        .navbar:not(.main-navigation) {
                display: flex;
                justify-content: center;
        }

        .navbar-item.site-name {
                padding: 0.5rem;
        }

        .navbar-item.site-name .title a {
                font-size: 1rem;
                color: var(--bart-blue);
        }

        .navbar-item.site-name .title a:active,
        .navbar-item.site-name .title a:focus,
        .navbar-item.site-name .title a:hover {
                color: var(--bart-navy);
        }

        .navbar-item.site-name .subtitle {
                font-size: 0.75rem;
        }

        .navbar-item img.site-logo {
                max-height: 4.5rem;
        }

        .breadcrumb ul {
                display: none;
        }

        .searchField #q {
                width: 70vw;
        }

}

/* TABLET - DESKTOP STYLES
-------------------------------------------------------------------------------------------------------------------*/
@media only screen and (min-width:769px) {

        .site-name .title {
                font-size: 2rem;
        }

        .site-name .subtitle {
                font-size: 1.25rem;
        }

        .navbar-item.has-dropdown.is-active .navbar-link,
        .navbar-item.has-dropdown:focus .navbar-link,
        .navbar-item.has-dropdown:hover .navbar-link {
                background: var(--bart-blue);
        }

        .navbar-dropdown {
                background: var(--bart-navy) !important;
        }

        header .navbar .navbar-menu a:link {
                color: #f2f2f2;
        }

        #main-content>.columns>.column {
                padding: 0.75rem;
        }

        #main-content {
                padding: 3rem;
        }

        .hero {
                margin: 1rem 3rem;
        }

        /* ribbon card */
        .ribbon {
                padding: 0.5em 1.25em;
        }

        .ribbon-card {
                padding: 1rem 1rem !important;
        }

        .ribbon-card.is-expanded {
                height: 100%;
        }

        /* ribbon card collapsing behavior */
        .ribbon-card .card,
        .ribbon-card .columns {
                display: none;
        }

        .ribbon-card.is-expanded .card {
                display: block;
        }

        .ribbon-card.is-expanded .columns {
                display: flex;
        }

        .ribbon-card h2.ribbon a:after {
                transform: rotate(0.25turn);
        }

        .ribbon-card.is-expanded h2.ribbon a:after {
                transform: rotate(-0.25turn);
        }

        .ribbon-card .box {
                background: #fff;
                color: #333;
                padding: 3.5rem 1rem 1.5rem;
                position: relative;
        }

        .ribbon-card.is-expanded .box {
                padding: 5.5rem 1rem 1.5rem;
        }

        .ribbon-card .columns {
                padding-left: -0.75rem;
                padding-right: -0.75rem;
        }

        .ribbon-card.service-line.is-expanded .box {
                background: var(--bart-straw) url(https://www.missionsq.org/prebuilt/micro/bart/images/home_tollfreeserviceline.png) no-repeat right bottom;
                background-size: contain;
                height: 100%;
        }

        .ribbon-card .ribbon {
                --f: 0.5rem;
                /* fold width past edge */
                --h: 3rem;
                /* ribbon height */

                clip-path: polygon(0% 0%, 100% 0%, 100% var(--h), calc(100% - var(--f)) calc(var(--h) + var(--f)), calc(100% - var(--f)) var(--h), var(--f) var(--h), var(--f) calc(var(--f) + var(--h)), 0% var(--h));
                inset: 0.5rem calc(-1*var(--f)) 0 calc(-1*var(--f));
                padding: 0.75rem calc(2 * var(--f));
                position: absolute;
                top: 1rem;
                width: calc(100% + 2 * var(--f) + 1px);
        }

        .ribbon,
        .ribbon-card.blue .ribbon {
                background: #003a5d;
                box-shadow: 0 var(--h) 0 inset var(--bart-blue);
        }

        .ribbon-card.green .ribbon {
                background: var(--bart-green-dark);
                box-shadow: 0 var(--h) 0 inset var(--bart-green);
        }

        .navbar:not(.main-navigation),
        .navbar:not(.main-navigation) .navbar-brand {
                display: flex;
        }

        .navbar:not(.main-navigation) .navbar-brand {
                flex-shrink: 4;
                padding: 0.5rem 0;
        }

        .navbar:not(.main-navigation) .navbar-end {
                display: flex;
                padding: 0.5rem;
        }
}

@media only screen and (max-width:1023px) {
        body {
                padding: 0;
        }

        #main-content {
                padding: 1.25rem;
        }

        .content {
                padding: 0 !important;
        }

        .navbar:not(.main-navigation) .buttons {
                display: none;
        }

        .navbar:not(.main-navigation) .site-name {
                background-color: #ffffff;
        }

        .main-navigation {
                flex-direction: column;
        }

        .main-navigation .navbar-brand {
                width: 100%;
        }

        .navbar-burger.is-active span:first-child {
                top: calc(50% - 6px);
        }

        .navbar-burger.is-active span:nth-child(3) {
                top: calc(50% + 4px);
        }

        .main-menu a,
        .navbar-dropdown .navbar-item {
                border-bottom: 1px solid #f2f2f2;
                line-height: 21px;
                padding-left: 0.75rem;
                padding-right: 0.25rem;
        }

        .main-menu a:not(.button) {
                border-bottom: 1px solid #f2f2f2;
                color: #f2f2f2;
                font-weight: 600;
        }

        .main-menu div.navbar-item.is-hoverable {
                padding: 0;
        }

        .main-menu .navbar-dropdown {
                padding: 0;
        }

        .main-menu .navbar-item.has-dropdown .navbar-dropdown a.navbar-item {
                margin-left: 1.5rem;
                padding-left: 0rem;
        }

        /* Remove border on last displayed child */
        .main-menu .navbar-item.is-hoverable.has-dropdown:nth-last-child(2) .navbar-dropdown a:last-child {
                border: none;
        }

        /* hides the search button */
        .main-menu>div.is-hoverable:last-child {
                display: none;
        }

        /* Adjust the padding on the tablet/mobile viewport */
        .columns.is-desktop.is-variable.is-0-tablet {
                padding-bottom: 0 !important;
                padding-top: 0 !important;
                margin-bottom: 0 !important;
                margin-top: 0 !important;
        }

        .columns.is-variable>.column {
                padding-bottom: 0 !important;
                padding-top: 0 !important;
                margin-bottom: 0 !important;
                margin-top: 0 !important;
        }

        .ribbon-card {
                margin-top: 0;
                margin-bottom: 1rem;
        }

        .ribbon-card h2.ribbon {
                font-size: 1.2rem;
        }
}

@media only screen and (min-width:1024px) {
        body {
                width: calc(100% - 4rem);
        }

        .navbar:not(.main-navigation) .buttons {
                align-items: end;
                display: flex;
        }

        .navbar-dropdown {
                border-top: none;
        }

        .navbar.main-menu .navbar-brand {
                display: none;
        }

        .navbar.main-menu .navbar-start {
                margin-left: 1rem;
        }

        .navbar.main-menu .navbar-start .navbar-item {
                padding-left: 1.0em;
                padding-right: 1.0em;
        }

        .navbar-dropdown {
                box-shadow: 0 8px 8px rgba(10, 10, 10, .5);
        }

        .main-navigation .navbar-brand a.navbar-item:nth-child(2) {
                display: none;
        }

        .main-navigation .navbar-brand a.navbar-item:nth-child(3) {
                display: none;
        }

        .main-navigation .navbar-brand a:last-child {
                display: none;
        }


}

/* WIDESCREEN STYLES
-------------------------------------------------------------------------------------------------------------------*/
@media only screen and (min-width:1216px) {
        .rslides img {
                min-height: 240px;
        }
}


/* FULLHD STYLES
-------------------------------------------------------------------------------------------------------------------*/
@media only screen and (min-width:1408px) {

        /* hack to address smaller images */
        .rslides img {
                min-height: 480px;
        }

        .ribbon-card.service-line.is-expanded .box {
                background-size: cover;
        }
}
