.q1-2019 .junk-area-y-axis .tick text, .q1-2019 .large-area-y-axis .tick text, .q1-2019 .rug-highlight-metro, .q1-2019 .rug-highlight-text, .q1-2020 .map-header--subhed {
    text-shadow: -1px -1px 0 #fff,1px -1px 0 #fff,-1px 1px 0 #fff,1px 1px 0 #fff
}

.closures-092020 .static-image-container img, .coronavirus .static-image-container img, .q2-2020 .static-image-container img, .q3-2020 .static-image-container img, .school-2020 .static-image-container img {
    image-rendering: -webkit-optimize-contrast
}

.q1-2019 #large-area-wrapper p span, .q1-2019 .score-label {
    font-family: 'Roboto Mono',monospace
}

.q1-2019 #large-area-wrapper {
    width: 730px;
    height: 400px;
    max-width: 95vw;
    margin: auto;
    padding: 0 1rem
}

    .q1-2019 #large-area-wrapper h4 {
        font-weight: 800
    }

    .q1-2019 #large-area-wrapper p {
        font-weight: 400
    }

@media only screen and (min-width:1000px) {
    .q1-2019 #large-area-wrapper {
        margin-bottom: 50px
    }

        .q1-2019 #large-area-wrapper h4 {
            font-size: 40px;
            margin: 0 0 5px
        }

        .q1-2019 #large-area-wrapper p {
            font-size: 22px;
            margin: 0 0 10px
        }
}

@media only screen and (min-width:764px) and (max-width:999px) {
    .q1-2019 #large-area-wrapper {
        margin-bottom: 40px
    }

        .q1-2019 #large-area-wrapper h4 {
            font-size: 35px;
            margin: 0 0 5px
        }

        .q1-2019 #large-area-wrapper p {
            font-size: 20px;
            margin: 0 0 10px
        }
}

@media only screen and (max-width:763px) {
    .q1-2019 #large-area-wrapper {
        margin-bottom: 20px
    }

        .q1-2019 #large-area-wrapper h4 {
            font-size: 22px;
            margin: 0 0 5px
        }

        .q1-2019 #large-area-wrapper p {
            font-size: 16px;
            margin: 0 0 10px
        }
}

.q1-2019 #large-area-wrapper .button-container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: start;
    justify-content: start
}

    .q1-2019 #large-area-wrapper .button-container p {
        border: 1px solid #000;
        border-radius: 3px;
        color: #000;
        background: #fff;
        font-weight: 600;
        cursor: pointer
    }

        .q1-2019 #large-area-wrapper .button-container .selected, .q1-2019 #large-area-wrapper .button-container p:hover {
            background: #000;
            color: #fff
        }

@media only screen and (min-width:1000px) {
    .q1-2019 #large-area-wrapper .button-container p {
        font-size: 12px;
        margin-right: 5px;
        padding: 2px 5px
    }
}

@media only screen and (min-width:764px) and (max-width:999px) {
    .q1-2019 #large-area-wrapper .button-container p {
        font-size: 12px;
        margin-right: 5px;
        padding: 2px 5px
    }
}

@media only screen and (max-width:763px) {
    .q1-2019 #large-area-wrapper .button-container p {
        font-size: 10px;
        margin-right: 3px;
        padding: 2px 3px
    }
}

.q1-2019 #large-area-container {
    width: 100%;
    height: 300px;
    position: relative;
    margin-left: 5px
}

    .q1-2019 #large-area-container #loader {
        background: #d32323;
        color: #fff;
        font-weight: 200;
        font-size: 16px;
        padding: 6px 10px;
        border-radius: 4px;
        position: absolute;
        left: 0;
        top: 0;
        -ms-transform: translate(0,0);
        transform: translate(0,0)
    }

        .q1-2019 #large-area-container #loader .lds-ellipsis {
            display: inline-block;
            position: relative;
            width: 30px;
            height: 14px
        }

.q1-2019 .area-axis .domain, .q1-2019 .area-y-axis .tick line, .q1-2019 .large-area-axis .domain, .q1-2019 .large-area-y-axis .tick line {
    display: none
}

.q1-2019 #large-area-container #loader .lds-ellipsis div {
    position: absolute;
    top: 7px;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #fff;
    animation-timing-function: cubic-bezier(0,1,1,0)
}

    .q1-2019 #large-area-container #loader .lds-ellipsis div:nth-child(1) {
        left: 3px;
        animation: lds-ellipsis1 .6s infinite
    }

    .q1-2019 #large-area-container #loader .lds-ellipsis div:nth-child(2) {
        left: 3px;
        animation: lds-ellipsis2 .6s infinite
    }

    .q1-2019 #large-area-container #loader .lds-ellipsis div:nth-child(3) {
        left: 13px;
        animation: lds-ellipsis2 .6s infinite
    }

    .q1-2019 #large-area-container #loader .lds-ellipsis div:nth-child(4) {
        left: 23px;
        animation: lds-ellipsis3 .6s infinite
    }

.q1-2019 .overlay {
    fill: none;
    pointer-events: all
}

.q1-2019 .focus, .q1-2019 .quarter-line {
    pointer-events: none
}

    .q1-2019 .focus circle {
        stroke: #000
    }

.q1-2019 .score-label {
    position: absolute;
    background: #fff;
    box-shadow: rgba(0,0,0,.3) 0 2px 10px;
    color: #000;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    padding: 3px 5px;
    font-size: 12px;
    pointer-events: none
}

.q1-2019 .all-area-wrapper {
    font-family: 'Open Sans',sans-serif;
    margin: 30px 0 50px
}

.q1-2019 #metro-area-wrapper .comp-area-title .sub-header, .q1-2019 .area-axis, .q1-2019 .axis text, .q1-2019 .large-area-axis {
    font-family: 'Roboto Mono',monospace
}

.q1-2019 #comp-area-wrapper {
    margin: auto;
    overflow-y: hidden;
    position: relative;
    padding: 0 10px
}

@media only screen and (min-width:1200px) {
    .q1-2019 #comp-area-wrapper {
        width: 1140px
    }
}

@media only screen and (min-width:1000px) and (max-width:1199px) {
    .q1-2019 #comp-area-wrapper {
        width: 990px
    }
}

@media only screen and (min-width:764px) and (max-width:999px) {
    .q1-2019 #comp-area-wrapper {
        width: 95vw
    }
}

@media only screen and (max-width:763px) {
    .q1-2019 #comp-area-wrapper {
        width: 95vw
    }
}

.q1-2019 .comp-cat-row {
    width: 100%
}

    .q1-2019 .comp-cat-row p {
        font-weight: 800;
        border-bottom: 2px solid #d3d3d3
    }

    .q1-2019 .comp-cat-row .comp-area-row {
        width: 100%;
        position: relative
    }

        .q1-2019 .comp-cat-row .comp-area-row .comp-area-container {
            position: absolute;
            background: #f6f6f6
        }

.q1-2019 .highlighted-comp-area {
    background-color: #f6f6f6 !important;
    box-shadow: rgba(0,0,0,.3) 0 3px 5px
}

@media only screen and (min-width:1000px) {
    .q1-2019 .comp-cat-row {
        margin-bottom: 40px
    }

        .q1-2019 .comp-cat-row p {
            font-size: 18px;
            margin: 0 0 10px
        }

        .q1-2019 .comp-cat-row .comp-area-row {
            height: 140px
        }
}

@media only screen and (min-width:764px) and (max-width:999px) {
    .q1-2019 .comp-cat-row {
        margin-bottom: 40px
    }

        .q1-2019 .comp-cat-row p {
            font-size: 18px;
            margin: 0 0 10px
        }

        .q1-2019 .comp-cat-row .comp-area-row {
            height: 140px
        }
}

@media only screen and (max-width:763px) {
    .q1-2019 .comp-cat-row {
        margin-bottom: 20px
    }

        .q1-2019 .comp-cat-row p {
            font-size: 18px;
            margin: 0 0 10px
        }

        .q1-2019 .comp-cat-row .comp-area-row {
            height: 140px
        }
}

.q1-2019 .comp-cat-row .comp-area-row .comp-area-container .comp-area-title {
    font-size: 16px;
    font-weight: 800;
    position: absolute;
    left: 4px;
    top: 3px
}

    .q1-2019 .comp-cat-row .comp-area-row .comp-area-container .comp-area-title p {
        border-bottom: 0;
        margin: 0
    }

    .q1-2019 .comp-cat-row .comp-area-row .comp-area-container .comp-area-title .header {
        font-size: 14px
    }

    .q1-2019 .comp-cat-row .comp-area-row .comp-area-container .comp-area-title .sub-header {
        font-size: 12px;
        font-weight: 400;
        font-family: 'Roboto Mono',monospace
    }

    .q1-2019 .comp-cat-row .comp-area-row .comp-area-container .comp-area-title .hidden {
        opacity: 0;
        font-size: 8px
    }

.q1-2019 .large-area-axis {
    color: #000;
    fill: #000;
    font-size: 12px
}

.q1-2019 .large-area-y-axis .tick text {
    text-anchor: start
}

.q1-2019 .area-axis {
    color: grey
}

    .q1-2019 .area-axis .tick text {
        font-size: 8px;
        text-anchor: middle
    }

.q1-2019 #metro-area-wrapper {
    width: 960px;
    margin: auto
}

    .q1-2019 #metro-area-wrapper .comp-area-title {
        font-size: 20px;
        font-weight: 800;
        left: 0;
        top: 0
    }

        .q1-2019 #metro-area-wrapper .comp-area-title p {
            border-bottom: 0;
            margin: 0
        }

        .q1-2019 #metro-area-wrapper .comp-area-title .header {
            font-size: 20px
        }

        .q1-2019 #metro-area-wrapper .comp-area-title .sub-header {
            font-size: 16px;
            font-weight: 400
        }

        .q1-2019 #metro-area-wrapper .comp-area-title .hidden {
            opacity: 0;
            font-size: 8px
        }

.q1-2019 #collapse-container {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%
}

.q1-2019 #collapse-gradient {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: #fff;
    opacity: .9
}

.q1-2019 #collapse-button {
    position: absolute;
    top: 100%;
    left: 50%;
    -ms-transform: translate(-50%,-200%);
    transform: translate(-50%,-200%);
    display: inline-block;
    border: 1px solid #000;
    background-color: #fff;
    color: #000;
    font-weight: 600;
    cursor: pointer;
    border-radius: 3px
}

.q1-2019 #scrolly {
    position: relative
}

.q1-2019 #collapse-button:hover {
    background-color: #000;
    color: #fff
}

@media only screen and (min-width:1000px) {
    .q1-2019 #collapse-button {
        padding: 8px;
        font-size: 14px
    }
}

@media only screen and (min-width:764px) and (max-width:999px) {
    .q1-2019 #collapse-button {
        padding: 6px;
        font-size: 14px
    }
}

@media only screen and (max-width:763px) {
    .q1-2019 #collapse-button {
        padding: 6px;
        font-size: 12px
    }
}

.q1-2019 .axis text {
    font-size: 12px;
    fill: #666
}

.q1-2019 #scrolly, .q1-2019 .axis.label, .q1-2019 .extra-area-wrapper, .q1-2019 .rug-label {
    font-family: 'Open Sans',sans-serif
}

@media only screen and (max-width:500px) {
    .q1-2019 .axis text {
        font-size: 10px
    }
}

.q1-2019 .axis path {
    display: none
}

.q1-2019 .axis line {
    stroke: #ddd;
    stroke-dasharray: 2 2;
    pointer-events: none
}

.q1-2019 .axis.label {
    font-size: 14px;
    fill: #000
}

.q1-2019 .voronoi path, .q1-2019 .voronoi-rug path {
    stroke: none
}

.q1-2019 .viz-wrapper h4 {
    font-size: 32px;
    font-weight: 800;
    margin: 0
}

.q1-2019 .viz-wrapper h5 {
    margin: 0 0 20px;
    font-size: 20px;
    font-weight: 400
}

@media only screen and (min-width:764px) and (max-width:999px) {
    .q1-2019 .viz-wrapper h4 {
        font-size: 30px
    }

    .q1-2019 .viz-wrapper h5 {
        margin: 0 0 20px;
        font-size: 18px
    }
}

@media only screen and (max-width:763px) {
    .q1-2019 .viz-wrapper h4 {
        font-size: 22px;
        margin-bottom: 5px
    }

    .q1-2019 .viz-wrapper h5 {
        margin: 0 0 20px;
        font-size: 16px
    }
}

@media only screen and (max-width:500px) {
    .q1-2019 .viz-wrapper h4 {
        font-size: 20px;
        margin-bottom: 5px
    }

    .q1-2019 .viz-wrapper h5 {
        margin: 0 0 20px;
        font-size: 14px
    }
}

.q1-2019 .chart-footnote {
    font-size: .9rem;
    font-style: italic;
    margin-top: 1rem
}

.q1-2019 #scrolly article {
    position: relative;
    padding: 0 0 300px;
    max-width: 20rem;
    margin: 0 auto;
    pointer-events: none
}

.q1-2019 .step {
    margin: 0 auto 2rem
}

    .q1-2019 .step:last-child {
        margin-bottom: 0
    }

    .q1-2019 .step.is-active div {
        opacity: 1
    }

    .q1-2019 .step div {
        font-size: 1.1rem;
        text-align: left;
        line-height: 1.35;
        opacity: 1;
        padding: .8rem;
        box-shadow: 0 0 10px rgba(0,0,0,.1);
        background-color: #fff
    }

        .q1-2019 .step div p {
            color: #000;
            margin: 5px;
            pointer-events: all
        }

.q1-2019 .scrolly-legend {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

    .q1-2019 .scrolly-legend.legend-centered {
        -ms-flex-pack: center;
        justify-content: center
    }

    .q1-2019 .scrolly-legend.legend-left {
        -ms-flex-pack: start;
        justify-content: start
    }

    .q1-2019 .scrolly-legend p {
        margin: 0;
        font-size: 16px;
        font-weight: 200
    }

.q1-2019 #map-legend p {
    margin-right: 10px
}

.q1-2019 #map-legend i {
    font-size: 18px
}

.q1-2019 #map-legend .fas {
    margin-right: 5px
}

.q1-2019 #map-legend .fa-long-arrow-alt-down {
    color: #f46d43
}

.q1-2019 #map-legend .fa-long-arrow-alt-up {
    color: #66bd63
}

.q1-2019 #rug-legend p {
    margin-right: 10px
}

.q1-2019 #rug-legend div {
    border-radius: 50%;
    background: red;
    border: 1px solid #000;
    width: 12px;
    height: 12px;
    margin-right: 4px
}

.q1-2019 #rug-legend .metro-dot {
    background: #c5c6c7;
    border: none
}

.q1-2019 #rug-legend .national-dot {
    background: red;
    border: 1px solid #000
}

.q1-2019 .scrolly-legend.hidden {
    display: none
}

@media only screen and (min-width:764px) and (max-width:999px) {
    .q1-2019 .scrolly-legend p {
        font-size: 14px
    }

    .q1-2019 #map-legend i {
        font-size: 16px
    }

    .q1-2019 #rug-legend div {
        width: 10px;
        height: 10px
    }
}

@media only screen and (max-width:763px) {
    .q1-2019 .scrolly-legend p {
        font-size: 12px
    }

    .q1-2019 #map-legend i {
        font-size: 14px
    }

    .q1-2019 #rug-legend div {
        width: 8px;
        height: 8px
    }
}

@media only screen and (max-width:500px) {
    .q1-2019 .scrolly-legend p {
        font-size: 12px
    }

    .q1-2019 #map-legend i {
        font-size: 14px
    }

    .q1-2019 #rug-legend div {
        width: 8px;
        height: 8px
    }
}

.q1-2019 .rug-label {
    font-size: 16px;
    text-anchor: end
}

.q1-2019 .rug-highlight-metro, .q1-2019 .rug-highlight-text {
    font-size: 14px;
    text-anchor: middle;
    pointer-events: none
}

.q1-2019 .rug-highlight-line {
    fill: none;
    stroke: #000;
    stroke-width: 3;
    opacity: .75;
    pointer-events: none
}

.q1-2019 .rug-highlight-circle {
    stroke: #000;
    stroke-width: 1.5;
    pointer-events: none
}

.q1-2019 .rug-highlight-text {
    font-weight: 600
}

.q1-2019 .rug-highlight-metro {
    font-weight: 800
}

@media only screen and (min-width:764px) and (max-width:999px) {
    .q1-2019 .rug-label {
        font-size: 16px
    }

    .q1-2019 .rug-highlight-line {
        stroke-width: 3
    }

    .q1-2019 .rug-highlight-text {
        font-size: 14px
    }
}

@media only screen and (max-width:763px) {
    .q1-2019 .rug-highlight-metro, .q1-2019 .rug-label {
        font-size: 12px
    }

    .q1-2019 .rug-highlight-line {
        stroke-width: 2
    }

    .q1-2019 .rug-highlight-text {
        font-size: 10px
    }
}

.q1-2019 .rug-circle-average {
    stroke: #000;
    fill: red
}

.q1-2019 #rug-footnote {
    display: none;
    position: absolute;
    left: 10px
}

@media only screen and (max-width:763px) {
    .q1-2019 .annotation text {
        font-size: 10px
    }

    .q1-2019 .map-state-labels {
        display: none
    }
}

.q1-2019 #map-wrapper {
    position: -webkit-sticky;
    position: sticky;
    left: 0;
    width: 100%;
    margin: 0;
    transform: translate3d(0,0,0);
    pointer-events: none
}

    .q1-2019 #map-wrapper .header-container {
        position: absolute;
        width: 100%
    }

        .q1-2019 #map-wrapper .header-container.header-center {
            left: 50%;
            top: 10px;
            -ms-transform: translate(-50%,0);
            transform: translate(-50%,0);
            text-align: center
        }

        .q1-2019 #map-wrapper .header-container.header-left {
            left: 50%;
            -ms-transform: translate(-50%,-100%);
            transform: translate(-50%,-100%);
            text-align: center
        }

        .q1-2019 #map-wrapper .header-container h5 {
            margin-bottom: 10px !important
        }

    .q1-2019 #map-wrapper .button p {
        cursor: pointer
    }

.q1-2019 .map-state-labels {
    font-size: 11px
}

@media only screen and (min-width:764px) and (max-width:999px) {
    .q1-2019 .map-state-labels {
        font-size: 8px
    }
}

.q1-2019 .extra-area-wrapper {
    width: 100%;
    max-width: 95vw;
    margin: 32px auto
}

    .q1-2019 .extra-area-wrapper p span, .q1-2019 .junk-area-axis, .q1-2019 .law-area-title .sub-header {
        font-family: 'Roboto Mono',monospace
    }

    .q1-2019 .extra-area-wrapper h4 {
        font-weight: 800;
        font-size: 32px;
        margin: 0 0 5px
    }

    .q1-2019 .extra-area-wrapper p {
        font-weight: 400
    }

    .q1-2019 .extra-area-wrapper h5 {
        margin: 0 0 20px;
        font-size: 20px;
        font-weight: 400
    }

@media only screen and (min-width:764px) and (max-width:999px) {
    .q1-2019 .extra-area-wrapper h4 {
        font-size: 30px
    }

    .q1-2019 .extra-area-wrapper h5 {
        margin: 0 0 20px;
        font-size: 18px
    }
}

@media only screen and (max-width:763px) {
    .q1-2019 .extra-area-wrapper h4 {
        font-size: 22px;
        margin-bottom: 5px
    }

    .q1-2019 .extra-area-wrapper h5 {
        margin: 0 0 20px;
        font-size: 16px
    }
}

@media only screen and (max-width:500px) {
    .q1-2019 .extra-area-wrapper h4 {
        font-size: 20px;
        margin-bottom: 5px
    }

    .q1-2019 .extra-area-wrapper h5 {
        margin: 0 0 20px;
        font-size: 14px
    }
}

@media only screen and (min-width:1000px) {
    .q1-2019 .extra-area-wrapper {
        margin-bottom: 50px
    }

        .q1-2019 .extra-area-wrapper p {
            font-size: 22px;
            margin: 0 0 10px
        }
}

@media only screen and (min-width:764px) and (max-width:999px) {
    .q1-2019 .extra-area-wrapper {
        margin-bottom: 40px
    }

        .q1-2019 .extra-area-wrapper p {
            font-size: 20px;
            margin: 0 0 10px
        }
}

@media only screen and (max-width:763px) {
    .q1-2019 .extra-area-wrapper {
        margin-bottom: 20px
    }

        .q1-2019 .extra-area-wrapper p {
            font-size: 16px;
            margin: 0 0 10px
        }
}

.q1-2019 .extra-area-wrapper .button-container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: start;
    justify-content: start
}

    .q1-2019 .extra-area-wrapper .button-container p {
        border: 1px solid #000;
        border-radius: 3px;
        color: #000;
        background: #fff;
        font-weight: 600;
        cursor: pointer
    }

        .q1-2019 .extra-area-wrapper .button-container .selected, .q1-2019 .extra-area-wrapper .button-container p:hover {
            background: #000;
            color: #fff
        }

@media only screen and (min-width:1000px) {
    .q1-2019 .extra-area-wrapper .button-container p {
        font-size: 12px;
        margin-right: 5px;
        padding: 2px 5px
    }
}

@media only screen and (min-width:764px) and (max-width:999px) {
    .q1-2019 .extra-area-wrapper .button-container p {
        font-size: 12px;
        margin-right: 5px;
        padding: 2px 5px
    }
}

@media only screen and (max-width:763px) {
    .q1-2019 .extra-area-wrapper .button-container p {
        font-size: 10px;
        margin-right: 3px;
        padding: 2px 3px
    }
}

.q1-2019 #junk-area-container {
    width: 100%;
    height: 300px;
    position: relative;
    margin-left: 5px
}

.q1-2019 .junk-area-axis {
    color: #000;
    fill: #000;
    font-size: 12px
}

    .q1-2019 .junk-area-axis .domain, .q1-2019 .junk-area-y-axis .tick line {
        display: none
    }

.q1-2019 .junk-area-y-axis .tick text {
    text-anchor: start
}

.q1-2019 #lawyer-area-container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.q1-2019 .law-area-container {
    margin-right: 10px;
    margin-bottom: 10px;
    padding: 5px
}

.q1-2020 .flag, .q1-2020 .q12020-footer {
    color: #757481 !important;
    padding-bottom: 20px !important
}

.q1-2019 .law-area-title {
    font-size: 16px;
    font-weight: 800;
    left: 4px;
    top: 3px
}

    .q1-2019 .law-area-title p {
        border-bottom: 0;
        margin: 0
    }

    .q1-2019 .law-area-title .header {
        font-size: 14px;
        font-weight: 800
    }

    .q1-2019 .law-area-title .sub-header {
        font-size: 12px;
        font-weight: 400
    }

.q1-2020 .q12020-footer, .q1-2020 h4 {
    font-family: 'Open Sans',sans-serif
}

.q1-2019 .law-area-title .hidden {
    opacity: 0;
    font-size: 8px
}

@font-face {
    font-family: FontAwesome;
    font-weight: 400;
    font-style: normal;
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?v=4.3.0);
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?#iefix&v=4.3.0) format("embedded-opentype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff2?v=4.3.0) format("woff2"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff?v=4.3.0) format("woff"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.ttf?v=4.3.0) format("truetype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular) format("svg")
}

@font-face {
    font-family: FontAwesome;
    font-weight: 400;
    font-style: normal;
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?v=4.3.0);
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?#iefix&v=4.3.0) format("embedded-opentype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff2?v=4.3.0) format("woff2"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff?v=4.3.0) format("woff"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.ttf?v=4.3.0) format("truetype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular) format("svg")
}

.q1-2020 .flag {
    font-size: 16px !important
}

.q1-2020 .q12020-footer {
    font-size: 14px !important
}

    .q1-2020 .q12020-footer.q12020-footer-centered {
        text-align: center
    }

.q1-2020 h3 {
    margin: 0 0 5px;
    font-size: 28px;
    font-weight: 800
}

.q1-2020 h4 {
    margin: 0 0 20px;
    font-size: 18px;
    font-weight: 400
}

.q1-2020 .fill-red {
    color: #F13D40;
    font-weight: 800
}

.q1-2020 .chart-wrapper {
    margin: auto auto 60px;
    width: 100%;
    max-width: 800px
}

.q1-2020 .report-wrapper {
    position: relative
}

.q1-2020 .full-width-wrapper {
    margin: auto auto 60px;
    padding: 0 30px;
    max-width: 1140px
}

@media only screen and (max-width:600px) {
    .q1-2020 .full-width-wrapper {
        padding: 0 15px
    }
}

.q1-2020 .full-width-wrapper h2 {
    margin-bottom: 20px;
    border-bottom: 2px solid #d3d3d3;
    padding-bottom: 4px;
    line-height: 1.2;
    color: #2B273C;
    font-family: 'Open Sans',sans-serif;
    font-size: 24px;
    font-weight: 700
}

.q1-2020 .dates-container .dates__state-label, .q1-2020 .dates-container .dates__tick-label, .q1-2020 .dates-legend, .q1-2020 .dates-legend--dot-legend .dates__label, .q1-2020 .dates-legend--title, .q1-2020 .full-width-wrapper .line-chart--axis text, .q1-2020 .full-width-wrapper .line-chart--container h3, .q1-2020 .full-width-wrapper .line-chart--label, .q1-2020 .impact-wrapper--container p, .q1-2020 .impact-wrapper--container text, .q1-2020 .impact-wrapper--container-axis text, .q1-2020 .map-header--button, .q1-2020 .map-header--subhed, .q1-2020 .map-wrapper .closures__label, .q1-2020 .map-wrapper .closures__label--small, .q2-2020 .axis text, .q2-2020 .q22020-footer, .q2-2020 .scrolly-wrapper#scrolly article .step .prose p, .q2-2020 .scrolly-wrapper#scrolly figure .hed-wrapper__legend p, .q2-2020 h4 {
    font-family: 'Open Sans',sans-serif
}

.q1-2020 .full-width-wrapper .line-chart--wrapper {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.q1-2020 .full-width-wrapper .line-chart--container {
    margin: 0 32px 32px 0
}

@media only screen and (max-width:764px) {
    .q1-2020 .full-width-wrapper .line-chart--container {
        margin: 0 0 32px
    }
}

.q1-2020 .full-width-wrapper .line-chart--container h3 {
    color: #2B273C;
    font-size: 18px;
    font-weight: 700
}

.q1-2020 .full-width-wrapper .line-chart--axis text {
    font-size: 10px;
    fill: #828282
}

.q1-2020 .full-width-wrapper .line-chart--axis.x text {
    font-weight: 700
}

.q1-2020 .full-width-wrapper .line-chart--axis line {
    stroke: #e0e0e0
}

.q1-2020 .full-width-wrapper .line-chart--axis .domain {
    display: none
}

.q1-2020 .full-width-wrapper .line-chart--path {
    fill: none;
    stroke-width: 2px;
    stroke-linecap: round;
    stroke-linejoin: round
}

.q1-2020 .full-width-wrapper .line-chart--label {
    font-size: 12px
}

.q1-2020 .map-header {
    position: relative;
    text-align: center
}

.q1-2020 .map-header--button-container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 10px
}

.q1-2020 .map-header--button {
    border: 1px solid #2B273C;
    background-color: #fff;
    cursor: pointer;
    padding: 4px 8px;
    width: 160px;
    color: #2B273C;
    font-size: 14px
}

@media only screen and (max-width:764px) {
    .q1-2020 .map-header--button {
        width: 110px;
        font-size: 10px
    }
}

.q1-2020 .map-header--button:first-child {
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px
}

.q1-2020 .map-header--button:last-child {
    border-left: none;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px
}

.q1-2020 .map-header--button:hover {
    background: #F4F4F4
}

.q1-2020 .map-header--button.is-active {
    background: #2B273C;
    color: #fff
}

.q1-2020 .map-header--count-container {
    margin-top: 12px;
    text-align: center
}

.q1-2020 .map-header--count {
    margin: 12px 0 0;
    color: #F13D40;
    font-size: 32px;
    font-weight: 600
}

.q1-2020 .map-header--subhed {
    margin: 0;
    color: #2B273C;
    font-size: 16px
}

.q2-2020 .comp-area-title p, .q3-2020 .comp-area-title p {
    text-shadow: -1px -1px 0 #f6f6f6,1px -1px 0 #f6f6f6,-1px 1px 0 #f6f6f6,1px 1px 0 #f6f6f6
}

@media only screen and (max-width:764px) {
    .q1-2020 .map-header--subhed {
        font-size: 12px
    }
}

.q1-2020 .map-header--subhed-text {
    font-weight: 400
}

.q1-2020 .map-header--subhed-date {
    font-weight: 700
}

.q1-2020 .map-wrapper {
    margin: auto;
    width: 100%
}

    .q1-2020 .map-wrapper svg {
        overflow: visible
    }

        .q1-2020 .map-wrapper svg path {
            stroke-linejoin: round;
            stroke-linecap: round
        }

            .q1-2020 .map-wrapper svg path.us-outline {
                fill: #fff;
                stroke: #2B273C;
                stroke-width: 1px
            }

            .q1-2020 .map-wrapper svg path.state-outline {
                fill: none;
                stroke: #F4F4F4
            }

    .q1-2020 .map-wrapper .closures__label {
        font-size: 12px;
        font-weight: 800;
        text-anchor: middle;
        fill: #2B273C
    }

    .q1-2020 .map-wrapper .closures__label--bg {
        stroke: #fff;
        stroke-width: 4px;
        stroke-linecap: round;
        stroke-linejoin: round
    }

    .q1-2020 .map-wrapper .closures__label--small {
        font-size: 10px;
        text-anchor: middle;
        fill: #757481
    }

    .q1-2020 .map-wrapper .closures__label--small-bg {
        stroke: #fff;
        stroke-width: 3px;
        stroke-linecap: round;
        stroke-linejoin: round;
        text-anchor: middle
    }

.q1-2020 .comp-cat-row p {
    font-size: 24px
}

.q1-2020 .all-area-wrapper {
    margin: 30px 0
}

.q1-2020 .impact-wrapper {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%
}

.q1-2020 .impact-wrapper--container {
    margin: 0 0 100px;
    width: 30%;
    height: 200px
}

@media only screen and (max-width:1000px) {
    .q1-2020 .impact-wrapper--container {
        width: 45%
    }
}

@media only screen and (max-width:600px) {
    .q1-2020 .impact-wrapper--container {
        width: 100%
    }
}

.q1-2020 .impact-wrapper--container p {
    margin: 0
}

.q1-2020 .impact-wrapper--container-hed {
    font-size: 18px;
    font-weight: 800
}

.q1-2020 .impact-wrapper--container-subhed {
    text-transform: capitalize;
    font-size: 14px;
    font-weight: 200
}

.q1-2020 .impact-wrapper--container-date {
    font-size: 12px;
    font-weight: 200;
    color: #BBBAC0
}

.q1-2020 .impact-wrapper--container-axis text {
    font-size: 10px;
    fill: #757481
}

.q1-2020 .impact-wrapper--container-axis.x text {
    font-weight: 700
}

.q1-2020 .dates-legend {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    font-size: 12px
}

.q1-2020 .dates-legend__wrapper {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.q1-2020 .dates-legend--title {
    margin: 0 0 8px;
    font-weight: 700
}

    .q1-2020 .dates-legend--title i {
        color: #828282
    }

.q2-2020 .flag, .q2-2020 .q22020-footer {
    color: #757481 !important;
    padding-bottom: 20px !important
}

.q1-2020 .dates-legend--item {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    margin-right: 16px;
    margin-bottom: 16px;
    cursor: pointer
}

    .q1-2020 .dates-legend--item p {
        margin: 0
    }

    .q1-2020 .dates-legend--item[data-entry=education_closed] .dates-legend--rect {
        background-color: #f2c94c
    }

    .q1-2020 .dates-legend--item[data-entry=non_essential_services_closed] .dates-legend--rect {
        background-color: #f2994a
    }

    .q1-2020 .dates-legend--item[data-entry=stay_at_home_order] .dates-legend--rect {
        background-color: #eb5757
    }

    .q1-2020 .dates-legend--item.is-inactive {
        opacity: .25
    }

.q1-2020 .dates-legend--dot-legend {
    width: 200px;
    height: 40px
}

    .q1-2020 .dates-legend--dot-legend .dates__line {
        fill: none;
        stroke: #2B273C;
        stroke-width: 2px
    }

    .q1-2020 .dates-legend--dot-legend .dates__label {
        font-size: 10px;
        text-anchor: middle
    }

    .q1-2020 .dates-legend--dot-legend .dates__label--start {
        fill: #1a8191
    }

    .q1-2020 .dates-legend--dot-legend .dates__label--end {
        fill: #28a784
    }

    .q1-2020 .dates-legend--dot-legend .dates__circle {
        stroke: #2B273C;
        stroke-width: 2px
    }

    .q1-2020 .dates-legend--dot-legend .dates__circle--start {
        fill: #1a8191
    }

    .q1-2020 .dates-legend--dot-legend .dates__circle--end {
        fill: #28a784
    }

.q1-2020 .dates-legend--rect {
    margin-right: 4px;
    width: 20px;
    height: 16px
}

.q1-2020 .dates-container {
    width: 100%
}

    .q1-2020 .dates-container .dates__tick-label {
        font-size: 10px;
        fill: #828282
    }

    .q1-2020 .dates-container .dates__state-label {
        font-size: 14px;
        font-weight: 700;
        text-anchor: end;
        fill: #2B273C
    }

@media only screen and (max-width:1000px) {
    .q1-2020 .dates-container .dates__state-label {
        font-size: 12px
    }
}

@media only screen and (max-width:764px) {
    .q1-2020 .dates-container .dates__state-label {
        font-size: 10px
    }
}

.q1-2020 .dates-container .dates__day {
    fill: #f8f8f8;
    stroke: #fff;
    stroke-width: 2px
}

.q1-2020 .dates-container .dates__highlighted-day {
    stroke: #fff;
    stroke-width: 2px
}

.q1-2020 .dates-container .dates__week {
    fill: none;
    stroke: #828282;
    stroke-width: 2px
}

.q1-2020 .dates-container .dates__line {
    fill: none;
    stroke: #2B273C;
    stroke-width: 2px
}

.q1-2020 .dates-container .dates__line--bg {
    stroke: #fff;
    stroke-width: 4px
}

.q1-2020 .dates-container .dates__circle {
    stroke: #2B273C;
    stroke-width: 2px
}

.q1-2020 .dates-container .dates__circle--bg {
    stroke: #fff;
    stroke-width: 4px
}

.q1-2020 .dates-container .dates__circle--start {
    fill: #1a8191
}

.q1-2020 .dates-container .dates__circle--end {
    fill: #28a784
}

.q1-2020 .methodology-anchor {
    position: absolute;
    visibility: hidden;
    top: -100px;
    left: 50%;
    height: 1px;
    width: 100px
}

@font-face {
    font-family: FontAwesome;
    font-weight: 400;
    font-style: normal;
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?v=4.3.0);
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?#iefix&v=4.3.0) format("embedded-opentype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff2?v=4.3.0) format("woff2"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff?v=4.3.0) format("woff"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.ttf?v=4.3.0) format("truetype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular) format("svg")
}

.q2-2020 .flag {
    font-size: 16px !important
}

.q2-2020 .q22020-footer {
    font-size: 14px !important
}

.q2-2020 h3 {
    margin: 0 0 5px;
    font-size: 28px;
    font-weight: 800
}

.q2-2020 h4 {
    margin: 0 0 20px;
    font-size: 18px;
    font-weight: 400
}

@media only screen and (max-width:764px) {
    .q2-2020 h4 {
        margin: 0 0 10px
    }
}

.q2-2020 .fill-red {
    color: #F13D40;
    font-weight: 800
}

.q2-2020 .scrolly-wrapper#scrolly {
    position: relative;
    padding: 10px
}

    .q2-2020 .scrolly-wrapper#scrolly figure {
        position: -webkit-sticky;
        position: sticky;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-align: center;
        align-items: center;
        top: 0;
        left: 0;
        width: 100%;
        margin: 0;
        transform: translate3d(0,0,0)
    }

        .q2-2020 .scrolly-wrapper#scrolly figure .wrapper {
            background-color: #fff;
            margin: 110px auto auto;
            width: 100%;
            max-width: 1000px;
            height: calc(100% - 130px)
        }

        .q2-2020 .scrolly-wrapper#scrolly figure .hed-wrapper__legend {
            display: -ms-flexbox;
            display: flex;
            -ms-flex-align: center;
            align-items: center;
            margin-right: 20px;
            -ms-flex-wrap: wrap;
            flex-wrap: wrap
        }

        .q2-2020 .scrolly-wrapper#scrolly figure .hed-wrapper__legend--wrapper {
            display: -ms-flexbox;
            display: flex;
            -ms-flex-align: center;
            align-items: center;
            -ms-flex-wrap: wrap;
            flex-wrap: wrap
        }

        .q2-2020 .scrolly-wrapper#scrolly figure .hed-wrapper__legend p {
            font-size: 12px;
            color: #666;
            margin-right: 5px
        }

        .q2-2020 .scrolly-wrapper#scrolly figure .hed-wrapper__legend div {
            border-radius: 50%;
            background: #666;
            opacity: .6;
            margin-right: 5px
        }

        .q2-2020 .scrolly-wrapper#scrolly figure .hed-wrapper__legend--bubble-small {
            width: 10px;
            height: 10px
        }

@media only screen and (max-width:764px) {
    .q2-2020 .scrolly-wrapper#scrolly figure .hed-wrapper__legend--bubble-small {
        width: 8px;
        height: 8px
    }
}

.q2-2020 .scrolly-wrapper#scrolly figure .hed-wrapper__legend--bubble-medium {
    width: 20px;
    height: 20px
}

@media only screen and (max-width:764px) {
    .q2-2020 .scrolly-wrapper#scrolly figure .hed-wrapper__legend--bubble-medium {
        width: 14px;
        height: 14px
    }
}

.q2-2020 .scrolly-wrapper#scrolly figure .hed-wrapper__legend--bubble-large {
    width: 30px;
    height: 30px
}

@media only screen and (max-width:764px) {
    .q2-2020 .scrolly-wrapper#scrolly figure .hed-wrapper__legend--bubble-large {
        width: 20px;
        height: 20px
    }
}

.q2-2020 .scrolly-wrapper#scrolly figure .hed-wrapper__legend--bubble-red {
    background: #F13D40 !important
}

.q2-2020 .scrolly-wrapper#scrolly figure .hed-wrapper__legend--bubble-teal {
    background: #00838F !important
}

.q2-2020 .scrolly-wrapper#scrolly figure .chart {
    width: 100%;
    position: relative
}

    .q2-2020 .scrolly-wrapper#scrolly figure .chart .scatter-dot {
        fill: #757481;
        opacity: .6;
        stroke: #fff
    }

    .q2-2020 .scrolly-wrapper#scrolly figure .chart .scatter-label {
        text-anchor: middle;
        font-size: 10px
    }

    .q2-2020 .scrolly-wrapper#scrolly figure .chart .voronoi-path {
        fill: none;
        stroke: none;
        cursor: pointer
    }

    .q2-2020 .scrolly-wrapper#scrolly figure .chart .tooltip {
        display: none;
        position: absolute;
        z-index: 1200;
        border: 1px solid #BBBAC0;
        border-radius: 5px;
        box-shadow: 0 0 10px 1px rgba(0,0,0,.25);
        background-color: #fff;
        padding: 5px 10px;
        width: 250px;
        pointer-events: none
    }

        .q2-2020 .scrolly-wrapper#scrolly figure .chart .tooltip h6 {
            margin: 0;
            font-size: 14px
        }

        .q2-2020 .scrolly-wrapper#scrolly figure .chart .tooltip p {
            margin: 5px 0 0;
            text-align: left;
            font-size: 12px;
            font-weight: 400
        }

    .q2-2020 .scrolly-wrapper#scrolly figure .chart .axis line.bold-line {
        stroke-width: 1;
        stroke-dasharray: 0
    }

.q2-2020 .scrolly-wrapper#scrolly article {
    position: relative;
    padding: 0;
    width: 100%;
    max-width: 480px;
    margin: 0 auto 75vh;
    pointer-events: none
}

    .q2-2020 .scrolly-wrapper#scrolly article.wide {
        max-width: 640px
    }

    .q2-2020 .scrolly-wrapper#scrolly article .step {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-align: center;
        align-items: center;
        margin: 0 auto 20px;
        color: #2B273C;
        opacity: .25
    }

        .q2-2020 .scrolly-wrapper#scrolly article .step .prose {
            min-height: 100px;
            padding: 8px 16px;
            background-color: #fff;
            border-radius: 1px;
            box-shadow: 0 0 7px 2px rgba(0,0,0,.25);
            width: 100%
        }

            .q2-2020 .scrolly-wrapper#scrolly article .step .prose p {
                font-size: 18px;
                font-weight: 400;
                line-height: 1.8
            }

        .q2-2020 .scrolly-wrapper#scrolly article .step:last-child {
            margin-bottom: 0;
            width: 320px
        }

            .q2-2020 .scrolly-wrapper#scrolly article .step:last-child .prose {
                min-height: 0
            }

                .q2-2020 .scrolly-wrapper#scrolly article .step:last-child .prose p {
                    font-size: 16px;
                    font-weight: 600;
                    text-align: center
                }

        .q2-2020 .scrolly-wrapper#scrolly article .step.is-active {
            opacity: 1
        }

.q2-2020 .chart-wrapper {
    margin: auto auto 60px;
    width: 100%;
    max-width: 800px
}

.q2-2020 .report-wrapper {
    position: relative
}

.q2-2020 .full-width-wrapper {
    margin: auto auto 60px;
    padding: 0 30px;
    max-width: 1140px
}

@media only screen and (max-width:600px) {
    .q2-2020 .full-width-wrapper {
        padding: 0 15px
    }
}

.q2-2020 .full-width-wrapper h2 {
    margin-bottom: 20px;
    border-bottom: 2px solid #d3d3d3;
    padding-bottom: 4px;
    line-height: 1.2;
    color: #2B273C;
    font-family: 'Open Sans',sans-serif;
    font-size: 24px;
    font-weight: 700
}

.q2-2020 .centered-title--button, .q2-2020 .full-width-wrapper .line-chart--axis text, .q2-2020 .full-width-wrapper .line-chart--container h3, .q2-2020 .full-width-wrapper .line-chart--label, .q3-2020 #arrow-chart-container .arrow-label, .q3-2020 #line-chart-container .tooltip p, .q3-2020 .arrow-legend-entry, .q3-2020 .axis text, .q3-2020 .centered-title--button, .q3-2020 .legend, .q3-2020 .line-chart--axis text, .q3-2020 .line-chart--label, .q3-2020 .map-container .tooltip p, .q3-2020 .q32020-footer, .q3-2020 .slider--years p, .q3-2020 h4 {
    font-family: 'Open Sans',sans-serif
}

.q2-2020 .full-width-wrapper .line-chart--wrapper {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.q2-2020 .full-width-wrapper .line-chart--container {
    margin: 0 32px 32px 0
}

@media only screen and (max-width:764px) {
    .q2-2020 .full-width-wrapper .line-chart--container {
        margin: 0 0 32px
    }
}

.q2-2020 .full-width-wrapper .line-chart--container h3 {
    color: #2B273C;
    font-size: 18px;
    font-weight: 700
}

.q2-2020 .full-width-wrapper .line-chart--axis text {
    font-size: 10px;
    fill: #828282
}

.q2-2020 .full-width-wrapper .line-chart--axis.x text {
    font-weight: 700
}

.q2-2020 .full-width-wrapper .line-chart--axis line {
    stroke: #e0e0e0
}

.q2-2020 .full-width-wrapper .line-chart--axis .domain {
    display: none
}

.q2-2020 .full-width-wrapper .line-chart--path {
    fill: none;
    stroke-width: 2px;
    stroke-linecap: round;
    stroke-linejoin: round
}

.q2-2020 .full-width-wrapper .line-chart--label {
    font-size: 12px
}

.q2-2020 .comp-cat-row p {
    font-size: 24px
}

.q2-2020 #comp-area-wrapper {
    width: 100%;
    padding: 0
}

.q2-2020 .all-area-wrapper {
    margin: 30px 0
}

.q2-2020 .static-image-container {
    width: 100%
}

.q2-2020 .static-image-mobile {
    display: none;
    width: 100%
}

@media only screen and (max-width:600px) {
    .q2-2020 .static-image-mobile {
        display: block
    }
}

.q2-2020 .static-image-tablet {
    display: none;
    width: 100%
}

@media only screen and (min-width:601px) and (max-width:999px) {
    .q2-2020 .static-image-tablet {
        display: block
    }
}

.q2-2020 .static-image-desktop {
    display: none;
    width: 100%
}

@media only screen and (min-width:1000px) {
    .q2-2020 .static-image-desktop {
        display: block
    }
}

.q2-2020 .static-image-container__toggle {
    display: none
}

    .q2-2020 .static-image-container__toggle.is-visible {
        display: block
    }

.q2-2020 .extend-full-width {
    width: calc(100vw - 20px);
    max-width: 1100px;
    margin-left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.q2-2020 .centered-title {
    text-align: left
}

@media only screen and (min-width:1000px) {
    .q2-2020 .centered-title {
        text-align: center;
        width: calc(100vw - 20px);
        max-width: 1100px;
        margin-left: 50% !important;
        -ms-transform: translateX(-50%);
        transform: translateX(-50%)
    }
}

.q2-2020 .centered-title--button-container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 20px 0 30px
}

.q2-2020 .centered-title--button {
    border: 1px solid #2B273C;
    background-color: #fff;
    cursor: pointer;
    padding: 4px 8px;
    width: 160px;
    color: #2B273C;
    font-size: 14px;
    text-align: center
}

@media only screen and (max-width:764px) {
    .q2-2020 .centered-title--button-container {
        -ms-flex-pack: start;
        justify-content: flex-start
    }

    .q2-2020 .centered-title--button {
        width: 110px;
        font-size: 10px
    }

    .q2-2020 .hide__mobile {
        display: none !important
    }
}

.q2-2020 .centered-title--button:first-child {
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px
}

.q2-2020 .centered-title--button:last-child {
    border-left: none;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px
}

.q2-2020 .centered-title--button:hover {
    background: #F4F4F4
}

.q2-2020 .centered-title--button.is-active {
    background: #2B273C;
    color: #fff
}

.q2-2020 .methodology-anchor {
    position: absolute;
    visibility: hidden;
    top: -100px;
    left: 50%;
    height: 1px;
    width: 100px
}

@font-face {
    font-family: FontAwesome;
    font-weight: 400;
    font-style: normal;
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?v=4.3.0);
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?#iefix&v=4.3.0) format("embedded-opentype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff2?v=4.3.0) format("woff2"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff?v=4.3.0) format("woff"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.ttf?v=4.3.0) format("truetype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular) format("svg")
}

.q3-2019 #map-wrapper h4 {
    font-size: 32px
}

@media only screen and (max-width:763px) {
    .q3-2019 #map-wrapper h4 {
        font-size: 24px
    }
}

.q3-2019 .scrolly-legend {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

    .q3-2019 .scrolly-legend.legend-centered {
        -ms-flex-pack: center;
        justify-content: center
    }

    .q3-2019 .scrolly-legend.legend-left {
        -ms-flex-pack: start;
        justify-content: start
    }

    .q3-2019 .scrolly-legend p {
        margin: 0 !important;
        font-size: 16px !important;
        font-weight: 300 !important
    }

.q3-2019 #map-legend p {
    margin-right: 10px !important
}

.q3-2019 #map-legend i {
    font-size: 18px
}

.q3-2019 #map-legend .fas {
    margin-right: 5px
}

.q3-2019 #map-legend .fa-long-arrow-alt-down {
    color: #f46d43
}

.q3-2019 #map-legend .fa-long-arrow-alt-up {
    color: #66bd63
}

.q3-2020 .flag, .q3-2020 .q32020-footer {
    color: #757481 !important;
    padding-bottom: 20px !important
}

.q3-2019 #rug-legend p {
    margin-right: 10px !important
}

.q3-2019 #rug-legend div {
    border-radius: 50%;
    background: red;
    border: 1px solid #000;
    width: 12px;
    height: 12px;
    margin-right: 4px
}

.q3-2019 #rug-legend .metro-dot {
    background: #c5c6c7;
    border: none
}

.q3-2019 #rug-legend .national-dot {
    background: red;
    border: 1px solid #000
}

.q3-2019 .scrolly-legend.hidden {
    display: none
}

@media only screen and (min-width:764px) and (max-width:999px) {
    .q3-2019 .scrolly-legend p {
        font-size: 14px
    }

    .q3-2019 #map-legend i {
        font-size: 16px
    }

    .q3-2019 #rug-legend div {
        width: 10px;
        height: 10px
    }
}

@media only screen and (max-width:763px) {
    .q3-2019 .scrolly-legend p {
        font-size: 12px
    }

    .q3-2019 #map-legend i {
        font-size: 14px
    }

    .q3-2019 #rug-legend div {
        width: 8px;
        height: 8px
    }
}

@media only screen and (max-width:500px) {
    .q3-2019 .scrolly-legend p {
        font-size: 12px
    }

    .q3-2019 #map-legend i {
        font-size: 14px
    }

    .q3-2019 #rug-legend div {
        width: 8px;
        height: 8px
    }
}

.q3-2019 #rug-footnote {
    display: none;
    position: absolute;
    left: 10px
}

@font-face {
    font-family: FontAwesome;
    font-weight: 400;
    font-style: normal;
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?v=4.3.0);
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?#iefix&v=4.3.0) format("embedded-opentype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff2?v=4.3.0) format("woff2"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff?v=4.3.0) format("woff"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.ttf?v=4.3.0) format("truetype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular) format("svg")
}

.q3-2020 .flag {
    font-size: 16px !important
}

.q3-2020 .q32020-footer {
    margin-top: 24px;
    font-size: 14px !important
}

    .q3-2020 .q32020-footer.q32020-footer-centered {
        text-align: center
    }

.q3-2020 h3 {
    margin: 0 0 5px;
    font-size: 28px;
    font-weight: 800
}

.q3-2020 h4 {
    margin: 0 0 20px;
    font-size: 18px;
    font-weight: 400
}

@media only screen and (max-width:764px) {
    .q3-2020 h4 {
        margin: 0 0 10px
    }
}

.q3-2020 .fill-red {
    color: #F13D40;
    font-weight: 800
}

.q3-2020 .chart-wrapper {
    margin: auto auto 60px;
    width: 100%;
    max-width: 800px
}

.q3-2020 .report-wrapper {
    position: relative
}

.q3-2020 .static-image-container {
    width: 100%
}

.q3-2020 .static-image-mobile {
    display: none;
    width: 100%
}

@media only screen and (max-width:600px) {
    .q3-2020 .static-image-mobile {
        display: block
    }
}

.q3-2020 .static-image-tablet {
    display: none;
    width: 100%
}

@media only screen and (min-width:601px) and (max-width:999px) {
    .q3-2020 .static-image-tablet {
        display: block
    }
}

.q3-2020 .static-image-desktop {
    display: none;
    width: 100%
}

@media only screen and (min-width:1000px) {
    .q3-2020 .static-image-desktop {
        display: block
    }
}

.q3-2020 .static-image-container__toggle {
    display: none
}

    .q3-2020 .static-image-container__toggle.is-visible {
        display: block
    }

.q3-2020 .extend-full-width {
    width: calc(100vw - 20px);
    max-width: 1100px;
    margin-left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.q3-2020 .svg--overlay {
    fill: transparent
}

.q3-2020 .centered-title {
    text-align: left
}

@media only screen and (min-width:1000px) {
    .q3-2020 .centered-title {
        text-align: center;
        width: calc(100vw - 20px);
        max-width: 1100px;
        margin-left: 50% !important;
        -ms-transform: translateX(-50%);
        transform: translateX(-50%)
    }
}

.q3-2020 .centered-title--button-container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 20px 0 30px
}

.q3-2020 .centered-title--button {
    border: 1px solid #2B273C;
    background-color: #fff;
    cursor: pointer;
    padding: 4px 8px;
    width: 160px;
    color: #2B273C;
    font-size: 14px;
    text-align: center
}

@media only screen and (max-width:764px) {
    .q3-2020 .centered-title--button-container {
        -ms-flex-pack: start;
        justify-content: flex-start
    }

    .q3-2020 .centered-title--button {
        width: 110px;
        font-size: 10px
    }

    .q3-2020 .hide__mobile {
        display: none !important
    }
}

.q3-2020 .centered-title--button:first-child {
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px
}

.q3-2020 .centered-title--button:last-child {
    border-left: none;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px
}

.q3-2020 .centered-title--button:hover {
    background: #F4F4F4
}

.q3-2020 .centered-title--button.is-active {
    background: #2B273C;
    color: #fff
}

.q3-2020 .methodology-anchor {
    position: absolute;
    visibility: hidden;
    top: -100px;
    left: 50%;
    height: 1px;
    width: 100px
}

.q3-2020 .map-container {
    width: 100%;
    position: relative
}

    .q3-2020 .map-container .country-outline {
        stroke: #757481;
        fill: none
    }

    .q3-2020 .map-container .state-outline {
        stroke: #BBBAC0;
        fill: #fff
    }

    .q3-2020 .map-container .tooltip {
        display: none;
        position: absolute;
        z-index: 99;
        border: 1px solid #BBBAC0;
        border-radius: 5px;
        box-shadow: 0 0 10px 1px rgba(0,0,0,.25);
        background-color: #fff;
        padding: 5px 10px;
        max-width: 360px;
        pointer-events: none
    }

@media only screen and (max-width:900px) {
    .q3-2020 .map-container .tooltip {
        max-width: 260px
    }
}

.q3-2020 .map-container .tooltip h6 {
    margin: 0;
    font-size: 16px
}

.q3-2020 .map-container .tooltip p {
    margin: 0;
    font-size: 14px
}

@media only screen and (max-width:600px) {
    .q3-2020 .map-container .tooltip {
        max-width: 200px
    }

        .q3-2020 .map-container .tooltip h6 {
            font-size: 14px
        }

        .q3-2020 .map-container .tooltip p {
            font-size: 12px
        }
}

.q3-2020 .map-container .tooltip--footnote {
    padding-top: 5px;
    color: #BBBAC0;
    font-size: 12px !important;
    font-style: italic
}

.q3-2020 .play-pause.pause:after, .q3-2020 .play-pause.play:after {
    content: "";
    position: absolute;
    padding: 0
}

.q3-2020 .legend, .q3-2020 .slider--years p {
    font-size: 12px
}

.q3-2020 .slider-play-pause-container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 20px
}

.q3-2020 .play-pause {
    width: 11px;
    height: 12px;
    cursor: pointer;
    margin-right: 15px;
    margin-top: 10px
}

    .q3-2020 .play-pause.play:after {
        width: 0;
        height: 0;
        margin: 0;
        border-bottom: 6px solid transparent;
        border-left: 11px solid #aaa;
        border-top: 6px solid transparent
    }

    .q3-2020 .play-pause.pause:after {
        width: 3px;
        height: 12px;
        margin: 0;
        border-left: 4px solid #aaa;
        border-right: 4px solid #aaa
    }

.q3-2020 .slider {
    width: 250px
}

.q3-2020 .slider--input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 100%;
    height: 2px;
    background: #BBBAC0;
    outline: 0;
    margin: 0
}

    .q3-2020 .slider--input::-webkit-slider-thumb {
        -webkit-appearance: none;
        appearance: none;
        width: 14px;
        height: 14px;
        background: #2B273C;
        border-radius: 50%;
        border: 1px solid #fff;
        cursor: pointer
    }

    .q3-2020 .slider--input::-moz-range-thumb {
        width: 14px;
        height: 14px;
        background: #2B273C;
        border-radius: 50%;
        border: 1px solid #fff;
        cursor: pointer
    }

.q3-2020 .slider--years {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 280px;
    margin-left: -15px
}

    .q3-2020 .slider--years p {
        text-align: center;
        margin: 0;
        width: calc(280px / 6);
        color: #BBBAC0;
        transition: .5s
    }

        .q3-2020 .slider--years p.is-active {
            color: #2B273C;
            font-weight: 600
        }

.q3-2020 .legend {
    margin: 20px auto
}

.q3-2020 .legend--title {
    text-align: center;
    margin: 0 0 3px
}

.q3-2020 .legend--wrapper {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center
}

.q3-2020 .legend--label {
    margin: 0;
    font-weight: 600
}

.q3-2020 .legend--container {
    width: 250px;
    height: 15px;
    margin: 0 5px;
    border: 1px solid #2B273C
}

@media only screen and (max-width:600px) {
    .q3-2020 .legend--container {
        width: 200px;
        height: 12px
    }
}

.q3-2020 .legend #reopenings-legend {
    background: linear-gradient(90deg,#f13d40 0,#fff 50%,#05a882 100%)
}

.q3-2020 .legend #rfnopenings-legend {
    background: linear-gradient(90deg,#fff 0,#00838f 100%)
}

.q3-2020 #line-chart-container {
    width: calc(100vw - 20px);
    max-width: 800px;
    margin-left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    position: relative
}

    .q3-2020 #line-chart-container .voronoi-path {
        cursor: pointer
    }

    .q3-2020 #line-chart-container .tooltip {
        display: none;
        position: absolute;
        z-index: 99;
        border: 1px solid #BBBAC0;
        border-radius: 5px;
        box-shadow: 0 0 10px 1px rgba(0,0,0,.25);
        background-color: #fff;
        padding: 5px 10px;
        width: 200px;
        pointer-events: none
    }

.q4-2018 .highlighted-comp-area, .q4-2018 .score-label {
    box-shadow: rgba(0,0,0,.3) 0 2px 10px
}

.q3-2020 #line-chart-container .tooltip h6 {
    margin: 0;
    font-size: 16px
}

.q3-2020 #line-chart-container .tooltip p {
    margin: 0;
    font-size: 14px
}

@media only screen and (max-width:600px) {
    .q3-2020 #line-chart-container .tooltip h6 {
        font-size: 14px
    }

    .q3-2020 #line-chart-container .tooltip p {
        font-size: 12px
    }
}

.q3-2020 .line-chart--path {
    fill: none;
    stroke: #4f4f4f;
    stroke-width: 2
}

    .q3-2020 .line-chart--path.current {
        stroke: #F13D40;
        stroke-width: 2
    }

    .q3-2020 .line-chart--path.past {
        stroke: #dcdbdb;
        stroke-width: 1
    }

.q3-2020 .line-chart--dot {
    fill: #F13D40
}

.q3-2020 .line-chart--label {
    font-size: 14px;
    fill: #4f4f4f
}

    .q3-2020 .line-chart--label.current {
        font-size: 16px;
        font-weight: 700;
        fill: #F13D40
    }

.q3-2020 .line-chart--axis text {
    font-size: 12px;
    fill: #4f4f4f
}

.q3-2020 .line-chart--axis .domain {
    display: none
}

.q3-2020 .line-chart--axis.y line {
    stroke: #4f4f4f;
    stroke-dasharray: .5 3;
    stroke-linecap: round
}

.q3-2020 .line-chart--axis.y text {
    text-anchor: start;
    -ms-transform: translate(2px,-8px);
    transform: translate(2px,-8px)
}

.q3-2020 .line-chart--axis.y-horiz line {
    stroke: #dcdbdb
}

.q3-2020 .line-chart--axis.y-horiz text {
    text-anchor: start;
    -ms-transform: translate(2px,-8px);
    transform: translate(2px,-8px)
}

.q3-2020 #arrow-chart-container .arrow-label {
    font-size: 14px
}

@media only screen and (max-width:900px) {
    .q3-2020 #arrow-chart-container .arrow-label {
        font-size: 12px
    }
}

@media only screen and (max-width:600px) {
    .q3-2020 #arrow-chart-container .arrow-label {
        font-size: 10px
    }
}

.q3-2020 #arrow-chart-container .arrow-label-bold {
    font-weight: 800
}

.q3-2020 .arrow-legend-container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    margin: 0 0 32px
}

@media only screen and (min-width:769px) {
    .q3-2020 .arrow-legend-container {
        -ms-flex-direction: row;
        flex-direction: row;
        -ms-flex-align: center;
        align-items: center
    }
}

@media only screen and (min-width:1000px) {
    .q3-2020 .arrow-legend-container {
        -ms-flex-pack: center;
        justify-content: center
    }
}

.q3-2020 .arrow-legend-entry {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    margin: 0 24px 8px 0
}

@media only screen and (min-width:769px) {
    .q3-2020 .arrow-legend-entry {
        margin-bottom: 0;
        max-width: 275px
    }
}

.q3-2020 .arrow-legend-entry:last-child {
    margin-right: 0
}

.q3-2020 .arrow-legend-entry-left {
    margin-right: 8px;
    font-size: 12px
}

@media only screen and (min-width:640px) {
    .q3-2020 .arrow-legend-entry-left {
        font-size: 16px
    }
}

.q3-2020 .arrow-legend-entry-right {
    font-size: 12px
}

@media only screen and (min-width:640px) {
    .q3-2020 .arrow-legend-entry-right {
        font-size: 14px
    }
}

.q3-2020 .arrow-legend-entry-outdoors {
    background-color: #05a882;
    width: 18px;
    height: 5px
}

.q3-2020 .full-width-wrapper {
    margin: auto auto 60px;
    padding: 0 30px;
    max-width: 1140px;
    overflow: hidden
}

@media only screen and (max-width:600px) {
    .q3-2020 .full-width-wrapper {
        padding: 0 15px
    }
}

.q3-2020 .full-width-wrapper h2 {
    margin-bottom: 20px;
    border-bottom: 2px solid #d3d3d3;
    padding-bottom: 4px;
    line-height: 1.2;
    color: #2B273C;
    font-family: 'Open Sans',sans-serif;
    font-size: 24px;
    font-weight: 700
}

.q3-2020 .full-width-wrapper .line-chart--wrapper {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.q3-2020 .full-width-wrapper .line-chart--container {
    margin: 0 32px 32px 0
}

@media only screen and (max-width:764px) {
    .q3-2020 .full-width-wrapper .line-chart--container {
        margin: 0 0 32px
    }
}

.q3-2020 .full-width-wrapper .line-chart--container h3 {
    color: #2B273C;
    font-family: 'Open Sans',sans-serif;
    font-size: 18px;
    font-weight: 700
}

.q3-2020 .full-width-wrapper .line-chart--axis text {
    font-family: 'Open Sans',sans-serif;
    font-size: 10px;
    fill: #828282
}

.q3-2020 .full-width-wrapper .line-chart--axis.x text {
    font-weight: 700
}

.q3-2020 .full-width-wrapper .line-chart--axis line {
    stroke: #e0e0e0
}

.q3-2020 .full-width-wrapper .line-chart--axis .domain {
    display: none
}

.q3-2020 .full-width-wrapper .line-chart--path {
    fill: none;
    stroke-width: 2px;
    stroke-linecap: round;
    stroke-linejoin: round
}

.q3-2020 .full-width-wrapper .line-chart--label {
    font-family: 'Open Sans',sans-serif;
    font-size: 12px
}

.q3-2020 .comp-cat-row p {
    font-size: 24px
}

.q3-2020 #comp-area-wrapper {
    width: 100%;
    padding: 0;
    overflow: hidden
}

.coronavirus .chart-wrapper .map-header--subhed, .q4-2019 .map-container .map-region-label, .q4-2019 .map-container .map-state-label {
    text-shadow: -1px -1px 0 #fff,1px -1px 0 #fff,-1px 1px 0 #fff,1px 1px 0 #fff
}

.q3-2020 .all-area-wrapper {
    margin: 30px 0
}

.q4-2018 .large-area-wrapper p span, .q4-2018 .score-label {
    font-family: 'Roboto Mono',monospace
}

.q4-2018 .large-area-wrapper {
    width: calc(100% - 32px);
    height: 400px;
    max-width: 800px;
    margin: 32px auto;
    padding: 16px
}

    .q4-2018 .large-area-wrapper h4 {
        font-weight: 800;
        line-height: 1.1
    }

    .q4-2018 .large-area-wrapper p {
        font-weight: 400
    }

@media only screen and (min-width:1000px) {
    .q4-2018 .large-area-wrapper {
        margin-bottom: 90px
    }

        .q4-2018 .large-area-wrapper h4 {
            font-size: 40px;
            margin: 0 0 5px
        }

        .q4-2018 .large-area-wrapper p {
            font-size: 22px;
            margin: 0 0 10px
        }
}

@media only screen and (min-width:764px) and (max-width:999px) {
    .q4-2018 .large-area-wrapper {
        margin-bottom: 70px
    }

        .q4-2018 .large-area-wrapper h4 {
            font-size: 35px;
            margin: 0 0 5px
        }

        .q4-2018 .large-area-wrapper p {
            font-size: 20px;
            margin: 0 0 10px
        }
}

@media only screen and (max-width:763px) {
    .q4-2018 .large-area-wrapper {
        margin-bottom: 40px
    }

        .q4-2018 .large-area-wrapper h4 {
            font-size: 22px;
            margin: 0 0 5px
        }

        .q4-2018 .large-area-wrapper p {
            font-size: 16px;
            margin: 0 0 10px
        }
}

.q4-2018 .large-area-wrapper .button-container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: start;
    justify-content: start
}

.q4-2018 .area-axis .domain, .q4-2018 .area-y-axis .tick line, .q4-2018 .large-area-axis .domain {
    display: none
}

.q4-2018 .large-area-wrapper .button-container p {
    border: 1px solid #000;
    border-radius: 3px;
    color: #000;
    background: #fff;
    font-weight: 600;
    cursor: pointer
}

    .q4-2018 .large-area-wrapper .button-container .selected, .q4-2018 .large-area-wrapper .button-container p:hover {
        background: #000;
        color: #fff
    }

@media only screen and (min-width:1000px) {
    .q4-2018 .large-area-wrapper .button-container p {
        font-size: 12px;
        margin-right: 5px;
        padding: 2px 5px
    }
}

@media only screen and (min-width:764px) and (max-width:999px) {
    .q4-2018 .large-area-wrapper .button-container p {
        font-size: 12px;
        margin-right: 5px;
        padding: 2px 5px
    }
}

@media only screen and (max-width:763px) {
    .q4-2018 .large-area-wrapper .button-container p {
        font-size: 10px;
        margin-right: 3px;
        padding: 2px 3px
    }
}

.q4-2018 #large-area-container {
    width: 100%;
    height: 300px;
    position: relative
}

.q4-2018 .overlay {
    fill: none;
    pointer-events: all
}

.q4-2018 .focus circle {
    fill: #f46d43;
    stroke: #000
}

.q4-2018 .score-label {
    position: absolute;
    background: #fff;
    color: #000;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    padding: 3px 5px;
    font-size: 12px
}

.q4-2018 #all-area-wrapper {
    font-family: 'Open Sans',sans-serif;
    margin: 30px 0 100px
}

.q4-2018 .area-axis, .q4-2018 .large-area-axis {
    font-family: 'Roboto Mono',monospace
}

.q4-2018 #comp-area-wrapper {
    margin: auto;
    overflow-y: hidden;
    position: relative
}

@media only screen and (min-width:1200px) {
    .q4-2018 #comp-area-wrapper {
        width: 1140px
    }
}

@media only screen and (min-width:1000px) and (max-width:1199px) {
    .q4-2018 #comp-area-wrapper {
        width: 990px
    }
}

@media only screen and (min-width:764px) and (max-width:999px) {
    .q4-2018 #comp-area-wrapper {
        width: 95vw
    }
}

@media only screen and (max-width:763px) {
    .q4-2018 #comp-area-wrapper {
        width: 95vw
    }
}

.q4-2018 .comp-cat-row {
    width: 100%
}

    .q4-2018 .comp-cat-row p {
        font-weight: 800;
        border-bottom: 2px solid #d3d3d3
    }

    .q4-2018 .comp-cat-row .comp-area-row {
        width: 100%;
        position: relative
    }

        .q4-2018 .comp-cat-row .comp-area-row .comp-area-container {
            position: absolute;
            background: #fff;
            margin-left: 3px
        }

@media only screen and (min-width:1000px) {
    .q4-2018 .comp-cat-row {
        margin-bottom: 40px
    }

        .q4-2018 .comp-cat-row p {
            font-size: 18px;
            margin: 0 0 10px
        }

        .q4-2018 .comp-cat-row .comp-area-row {
            height: 140px
        }
}

@media only screen and (min-width:764px) and (max-width:999px) {
    .q4-2018 .comp-cat-row {
        margin-bottom: 40px
    }

        .q4-2018 .comp-cat-row p {
            font-size: 18px;
            margin: 0 0 10px
        }

        .q4-2018 .comp-cat-row .comp-area-row {
            height: 140px
        }
}

@media only screen and (max-width:763px) {
    .q4-2018 .comp-cat-row {
        margin-bottom: 20px
    }

        .q4-2018 .comp-cat-row p {
            font-size: 18px;
            margin: 0 0 10px
        }

        .q4-2018 .comp-cat-row .comp-area-row {
            height: 140px
        }
}

.q4-2018 .comp-cat-row .comp-area-row .comp-area-container .comp-area-title {
    font-size: 16px;
    font-weight: 800;
    position: absolute;
    left: 4px;
    top: 3px
}

    .q4-2018 .comp-cat-row .comp-area-row .comp-area-container .comp-area-title p {
        border-bottom: 0;
        margin: 0
    }

    .q4-2018 .comp-cat-row .comp-area-row .comp-area-container .comp-area-title .header {
        font-size: 12px
    }

    .q4-2018 .comp-cat-row .comp-area-row .comp-area-container .comp-area-title .sub-header {
        font-size: 10px;
        font-weight: 400;
        font-family: 'Roboto Mono',monospace
    }

    .q4-2018 .comp-cat-row .comp-area-row .comp-area-container .comp-area-title .hidden {
        opacity: 0;
        font-size: 8px
    }

.q4-2018 .large-area-axis {
    color: #000;
    fill: #000;
    font-size: 12px
}

.q4-2018 .large-area-y-axis .tick line {
    stroke: #d3d3d3
}

.q4-2018 .large-area-y-axis .tick text {
    text-anchor: start;
    alignment-baseline: baseline
}

.q4-2018 .area-axis {
    color: grey
}

    .q4-2018 .area-axis .tick text {
        font-size: 8px;
        text-anchor: middle
    }

.q4-2018 .swarm-wrapper {
    width: 900px;
    max-width: 95vw;
    font-family: 'Open Sans',sans-serif;
    margin: 30px auto 20px;
    position: relative
}

.q4-2018 .swarm-axis, .q4-2018 .swarm-tooltip .score {
    font-family: 'Roboto Mono',monospace
}

.q4-2018 .swarm-overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0
}

.q4-2018 .swarm-wrapper h4 {
    font-weight: 800;
    margin: 0
}

.q4-2018 .swarm-wrapper .swarm-sub-header span {
    margin: 0 3px 0 0;
    padding: 2px 5px;
    text-transform: uppercase;
    color: #fff;
    font-size: 12px;
    font-weight: 800
}

@media only screen and (min-width:1000px) {
    .q4-2018 .swarm-wrapper h4 {
        font-size: 40px
    }

    .q4-2018 .swarm-wrapper .swarm-sub-header {
        margin: 0 0 20px
    }
}

@media only screen and (min-width:764px) and (max-width:999px) {
    .q4-2018 .swarm-wrapper h4 {
        font-size: 35px
    }

    .q4-2018 .swarm-wrapper .swarm-sub-header {
        margin: 0 0 5px
    }
}

@media only screen and (max-width:763px) {
    .q4-2018 .swarm-wrapper h4 {
        font-size: 22px;
        margin-bottom: 0
    }

    .q4-2018 .swarm-wrapper .swarm-sub-header {
        margin: 0 0 5px
    }

        .q4-2018 .swarm-wrapper .swarm-sub-header span {
            font-size: 10px
        }
}

.q4-2018 .swarm-wrapper p {
    margin: 0
}

.q4-2018 .swarm-wrapper .header {
    font-size: 24px;
    font-weight: 800
}

.q4-2018 .swarm-wrapper .sub {
    font-size: 16px;
    font-weight: 400;
    margin-bottom: 10px
}

@media only screen and (max-width:763px) {
    .q4-2018 .swarm-wrapper .header {
        font-size: 20px;
        font-weight: 800
    }

    .q4-2018 .swarm-wrapper .sub {
        font-size: 15px;
        font-weight: 400;
        margin-bottom: 10px
    }
}

.q4-2018 .swarm-wrapper .sub-header {
    font-size: 14px;
    font-weight: 400;
    margin-bottom: 10px
}

.q4-2018 .swarm-container {
    margin-top: 20px;
    position: relative
}

.q4-2018 .search-plot {
    opacity: 0;
    height: 0
}

.q4-2018 .cells path {
    fill: none;
    pointer-events: all
}

.q4-2018 .swarm-axis path {
    stroke-dasharray: 4px 4px
}

.q4-2018 .swarm-axis text {
    font-size: 16px;
    font-weight: 800
}

.q4-2018 .swarm-tooltip {
    position: absolute;
    left: 100%;
    top: 0;
    -ms-transform: translateX(-100%);
    transform: translateX(-100%);
    display: none;
    pointer-events: none
}

    .q4-2018 .swarm-tooltip p {
        display: inline-block;
        white-space: nowrap;
        line-height: 1.1
    }

    .q4-2018 .swarm-tooltip .region {
        font-weight: 800;
        color: #fff;
        padding: 1px 3px;
        text-transform: uppercase;
        font-size: 10px
    }

    .q4-2018 .swarm-tooltip .city {
        font-weight: 800;
        font-size: 20px
    }

    .q4-2018 .swarm-tooltip .score {
        font-size: 14px
    }

@media only screen and (max-width:763px) {
    .q4-2018 .swarm-tooltip .city {
        font-size: 14px
    }

    .q4-2018 .swarm-tooltip .score {
        font-size: 12px
    }

    .q4-2018 .tooltip-offset-large {
        top: 60px
    }

    .q4-2018 .tooltip-offset-small {
        top: 20px
    }
}

.q4-2018 .search-wrapper {
    position: relative;
    width: 300px
}

    .q4-2018 .search-wrapper input {
        background-position: 10px 12px;
        background-repeat: no-repeat;
        font-size: 16px;
        width: 100%;
        padding: 12px 20px 12px 0;
        border: none;
        border-bottom: 1px solid #ddd;
        margin-bottom: 12px
    }

    .q4-2018 .search-wrapper ul {
        list-style-type: none;
        padding: 0;
        margin: 0 !important;
        position: absolute;
        left: 0;
        top: 50px;
        width: 100%;
        background: #fff;
        border: 1px solid grey;
        max-height: 140px;
        overflow-y: scroll;
        display: none;
        z-index: 998;
        line-height: 1.1 !important
    }

        .q4-2018 .search-wrapper ul li {
            margin-top: 0;
            height: 30px;
            padding: 5px 0 0 10px;
            text-decoration: none;
            font-size: 16px;
            color: #000;
            display: block;
            cursor: pointer;
            font-weight: 800;
            border-bottom: 1px solid grey;
            z-index: 999
        }

            .q4-2018 .search-wrapper ul li:hover {
                background: #ededed
            }

.q4-2018 #metro-area-wrapper {
    width: 960px;
    margin: auto
}

    .q4-2018 #metro-area-wrapper .comp-area-title {
        font-size: 20px;
        font-weight: 800;
        left: 0;
        top: 0
    }

        .q4-2018 #metro-area-wrapper .comp-area-title p {
            border-bottom: 0;
            margin: 0
        }

        .q4-2018 #metro-area-wrapper .comp-area-title .header {
            font-size: 20px
        }

        .q4-2018 #metro-area-wrapper .comp-area-title .sub-header {
            font-size: 16px;
            font-weight: 400;
            font-family: 'Roboto Mono',monospace
        }

        .q4-2018 #metro-area-wrapper .comp-area-title .hidden {
            opacity: 0;
            font-size: 8px
        }

.q4-2018 #collapse-container {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%
}

.q4-2018 #collapse-gradient {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: #fff;
    opacity: .9
}

.q4-2018 #collapse-button {
    position: absolute;
    top: 100%;
    left: 50%;
    -ms-transform: translate(-50%,-200%);
    transform: translate(-50%,-200%);
    display: inline-block;
    border: 1px solid #000;
    background-color: #fff;
    color: #000;
    font-weight: 600;
    cursor: pointer;
    border-radius: 3px
}

    .q4-2018 #collapse-button:hover {
        background-color: #000;
        color: #fff
    }

@media only screen and (min-width:1000px) {
    .q4-2018 #collapse-button {
        padding: 8px;
        font-size: 14px
    }
}

@media only screen and (min-width:764px) and (max-width:999px) {
    .q4-2018 #collapse-button {
        padding: 6px;
        font-size: 14px
    }
}

@media only screen and (max-width:763px) {
    .q4-2018 #collapse-button {
        padding: 6px;
        font-size: 12px
    }
}

.q4-2018 .metro-table-header p {
    margin: 0
}

.q4-2018 .metro-table-header .header {
    font-size: 24px;
    font-weight: 800
}

.q4-2018 .metro-table-header .sub {
    font-size: 16px;
    font-weight: 400;
    margin-bottom: 10px
}

@media only screen and (max-width:600px) {
    .q4-2018 .metro-table-header .header {
        font-size: 20px;
        font-weight: 800
    }

    .q4-2018 .metro-table-header .sub {
        font-size: 15px;
        font-weight: 400;
        margin-bottom: 10px
    }
}

.q4-2018 .metro-table-header {
    width: 900px;
    max-width: 95vw;
    font-family: 'Open Sans',sans-serif;
    position: relative;
    margin: 0 auto 30px;
    padding-right: 15px;
    padding-left: 15px
}

.q4-2019 .df-wrapper#scrolly article .step .inner-step .prose, .q4-2019 .map-container .map-region-label, .q4-2019 .map-container .map-state-label, .q4-2019 .map-header-container .map-legend-wrapper .map-legend-container .map-legend-party, .q4-2019 .map-header-container h4, .q4-2019 .table-container table tbody, .q4-2019 .table-container table tbody td, .q4-2019 .table-container table thead {
    font-family: 'Open Sans',sans-serif
}

@media only screen and (min-width:768px) and (max-width:992px) {
    .q4-2018 .metro-table-header {
        width: 750px;
        text-align: center
    }
}

.q4-2018 .desktop-graphic img, .q4-2018 .tablet-graphic img {
    width: 100%
}

@media only screen and (max-width:767px) {
    .q4-2018 .metro-table-header {
        width: 100%;
        margin: 0 0 30px;
        text-align: left
    }
}

.q4-2018 .desktop-graphic {
    display: block;
    max-width: 1140px;
    margin: 0 auto
}

.q4-2018 .tablet-graphic {
    display: none;
    max-width: 650px;
    margin: 0 auto;
    padding-left: 50px
}

.q4-2018 .mobile-graphic {
    display: none;
    max-width: 300px;
    margin: 0 auto
}

    .q4-2018 .mobile-graphic img {
        width: 100%;
        margin-bottom: 40px
    }

@media only screen and (min-width:600px) and (max-width:992px) {
    .q4-2018 .desktop-graphic {
        display: none
    }

    .q4-2018 .tablet-graphic {
        display: block
    }
}

@media only screen and (min-width:768px) and (max-width:992px) {
    .q4-2018 .tablet-graphic {
        display: block
    }
}

@media only screen and (min-width:600px) and (max-width:768px) {
    .q4-2018 .tablet-graphic {
        display: block;
        max-width: 600px;
        margin: 0;
        padding-left: 15px
    }
}

@media only screen and (max-width:599px) {
    .q4-2018 .desktop-graphic {
        display: none
    }

    .q4-2018 .mobile-graphic {
        display: block;
        margin: 0;
        padding-left: 2.5vw
    }
}

@font-face {
    font-family: FontAwesome;
    font-weight: 400;
    font-style: normal;
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?v=4.3.0);
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?#iefix&v=4.3.0) format("embedded-opentype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff2?v=4.3.0) format("woff2"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff?v=4.3.0) format("woff"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.ttf?v=4.3.0) format("truetype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular) format("svg")
}

.q4-2019 .youtube-video-wrapper {
    width: 600px;
    max-width: 100%;
    margin: 60px auto
}

.q4-2019 .youtube-video-container {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
    box-shadow: 0 2px 8px 1px rgba(0,0,0,.25)
}

.q4-2019 .youtube-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.q4-2019 .republican-fill {
    background: #F13D40;
    fill: #F13D40
}

.q4-2019 .democrat-fill {
    background: #0AB3C9;
    fill: #0AB3C9
}

.q4-2019 .republican-gradient-fill {
    background-image: linear-gradient(to right,#fcd7d7,#F13D40)
}

.q4-2019 .democrat-gradient-fill {
    background-image: linear-gradient(to right,#e6f7f9,#0AB3C9)
}

.q4-2019 .df-wrapper#scrolly {
    position: relative;
    padding: 10px;
    margin-bottom: 60px
}

    .q4-2019 .df-wrapper#scrolly .wrapper {
        width: 100%
    }

    .q4-2019 .df-wrapper#scrolly figure {
        position: -webkit-sticky;
        position: sticky;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-align: center;
        align-items: center;
        top: 0;
        left: 0;
        width: 100%;
        margin: 0;
        transform: translate3d(0,0,0)
    }

        .q4-2019 .df-wrapper#scrolly figure .wrapper.fullwidth {
            max-width: 100%
        }

    .q4-2019 .df-wrapper#scrolly article {
        position: relative;
        padding: 0;
        width: 100%;
        max-width: 480px;
        margin: 0 auto
    }

        .q4-2019 .df-wrapper#scrolly article.wide {
            max-width: 640px
        }

        .q4-2019 .df-wrapper#scrolly article .step {
            display: -ms-flexbox;
            display: flex;
            -ms-flex-align: center;
            align-items: center;
            margin: 0 auto 20px
        }

            .q4-2019 .df-wrapper#scrolly article .step .inner-step {
                background: #fff;
                padding: 20px 30px;
                box-shadow: 0 0 10px rgba(0,0,0,.1);
                border-radius: 3px;
                width: 100%;
                max-width: 480px
            }

                .q4-2019 .df-wrapper#scrolly article .step .inner-step .prose {
                    font-size: 18px;
                    color: #2B273C;
                    font-weight: 400;
                    line-height: 1.8;
                    margin: 20px 0
                }

                    .q4-2019 .df-wrapper#scrolly article .step .inner-step .prose a {
                        text-decoration: none;
                        color: inherit;
                        transition: .3s;
                        border-bottom: 1px solid #F13D40
                    }

                        .q4-2019 .df-wrapper#scrolly article .step .inner-step .prose a:hover {
                            color: #F13D40
                        }

            .q4-2019 .df-wrapper#scrolly article .step:last-child {
                margin-bottom: 0
            }

            .q4-2019 .df-wrapper#scrolly article .step.is-active {
                opacity: 1
            }

.q4-2019 .map-container {
    height: 600px
}

    .q4-2019 .map-container .map-region-label {
        font-size: 20px;
        font-weight: 800;
        text-transform: uppercase
    }

@media only screen and (max-width:764px) {
    .q4-2019 .map-container .map-region-label {
        font-size: 18px
    }
}

@media only screen and (max-width:500px) {
    .q4-2019 .map-container .map-region-label {
        font-size: 16px
    }
}

.q4-2019 .map-container .map-state-label {
    font-size: 12px;
    font-weight: 600
}

@media only screen and (max-width:500px) {
    .q4-2019 .map-container .map-state-label {
        font-size: 10px
    }
}

.q4-2019 .map-header-container {
    text-align: center
}

    .q4-2019 .map-header-container h3 {
        font-size: 32px;
        font-weight: 800;
        margin: 0
    }

    .q4-2019 .map-header-container h4 {
        margin: 0 0 20px;
        font-size: 20px;
        font-weight: 400
    }

@media only screen and (min-width:764px) and (max-width:999px) {
    .q4-2019 .map-header-container h3 {
        font-size: 30px
    }

    .q4-2019 .map-header-container h4 {
        margin: 0 0 20px;
        font-size: 18px
    }
}

@media only screen and (max-width:763px) {
    .q4-2019 .map-header-container h3 {
        font-size: 22px;
        margin-bottom: 5px
    }

    .q4-2019 .map-header-container h4 {
        margin: 0 0 20px;
        font-size: 16px
    }
}

@media only screen and (max-width:500px) {
    .q4-2019 .map-header-container h3 {
        font-size: 20px;
        margin-bottom: 5px
    }

    .q4-2019 .map-header-container h4 {
        margin: 0 0 20px;
        font-size: 14px
    }
}

.q4-2019 .map-header-container .map-legend-wrapper {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center
}

    .q4-2019 .map-header-container .map-legend-wrapper .map-legend-container {
        margin: 0 15px
    }

        .q4-2019 .map-header-container .map-legend-wrapper .map-legend-container .map-legend-party {
            color: #fff;
            padding: 8px 15px;
            margin-bottom: 5px;
            border-radius: 3px;
            font-size: 16px;
            font-weight: 600
        }

@media only screen and (max-width:764px) {
    .q4-2019 .map-header-container .map-legend-wrapper .map-legend-container .map-legend-party {
        padding: 5px 8px;
        font-size: 12px;
        width: 90px
    }
}

.q4-2019 .map-header-container .map-legend-wrapper .map-legend-container .map-legend-color-container {
    transition: all .5s;
    opacity: 0
}

    .q4-2019 .map-header-container .map-legend-wrapper .map-legend-container .map-legend-color-container.is-visible {
        opacity: 1
    }

    .q4-2019 .map-header-container .map-legend-wrapper .map-legend-container .map-legend-color-container .map-legend-color {
        width: 100%;
        height: 15px
    }

    .q4-2019 .map-header-container .map-legend-wrapper .map-legend-container .map-legend-color-container .map-legend-label {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-pack: justify;
        justify-content: space-between;
        font-family: 'Open Sans',sans-serif
    }

        .q4-2019 .map-header-container .map-legend-wrapper .map-legend-container .map-legend-color-container .map-legend-label p {
            font-size: 10px;
            color: #979797;
            margin: 0
        }

@media only screen and (max-width:764px) {
    .q4-2019 .map-header-container .map-legend-wrapper .map-legend-container {
        margin: 0 10px
    }
}

.q4-2019 .table-container table {
    border-collapse: collapse;
    border-radius: 2px;
    width: 250px;
    max-width: 950%;
    margin: auto
}

    .q4-2019 .table-container table thead {
        text-align: left;
        color: #979797;
        border-bottom: 2px solid #979797;
        font-size: 16px
    }

        .q4-2019 .table-container table thead th {
            padding: 0 0 4px 2px
        }

            .q4-2019 .table-container table thead th:first-child {
                border-radius: 2px 0 0
            }

            .q4-2019 .table-container table thead th:last-child {
                border-radius: 0 2px 0 0;
                text-align: center
            }

    .q4-2019 .table-container table tbody {
        font-size: 14px;
        margin-top: 4px
    }

        .q4-2019 .table-container table tbody tr {
            border: 4px solid #fff
        }

        .q4-2019 .table-container table tbody td {
            font-weight: 600;
            font-size: 16px
        }

            .q4-2019 .table-container table tbody td:nth-child(even) {
                background-color: #F13D40;
                color: #fff;
                text-align: center
            }

            .q4-2019 .table-container table tbody td:nth-child(odd) {
                background-color: #fff
            }

        .q4-2019 .table-container table tbody:before {
            content: "@";
            display: block;
            line-height: 2px;
            text-indent: -99999px
        }

.q4-2019 .bar-container .bar text {
    fill: #fff;
    font-size: 14px;
    font-weight: 600
}

.q4-2019 .bar-container p {
    margin: 0;
    color: #979797;
    font-weight: 600;
    font-size: 16px
}

@font-face {
    font-family: FontAwesome;
    font-weight: 400;
    font-style: normal;
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?v=4.3.0);
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?#iefix&v=4.3.0) format("embedded-opentype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff2?v=4.3.0) format("woff2"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff?v=4.3.0) format("woff"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.ttf?v=4.3.0) format("truetype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular) format("svg")
}

.about-page .data-highlights {
    display: -ms-grid;
    display: grid;
    margin-top: 24px;
    -ms-grid-columns: (minmax(100px,1fr)) [1];
    grid-template-columns: repeat(1,minmax(100px,1fr));
    grid-gap: 32px;
    grid-auto-rows: 0
}

@media only screen and (min-width:960px) {
    .about-page .data-highlights {
        -ms-grid-columns: (minmax(100px,1fr)) [2];
        grid-template-columns: repeat(2,minmax(100px,1fr))
    }
}

.about-page .data-highlights a {
    color: inherit;
    font-weight: inherit
}

    .about-page .data-highlights a.article-link {
        box-shadow: 0 2px 8px 1px rgba(0,0,0,.25);
        border-radius: 3px;
        position: relative;
        overflow: hidden;
        padding-bottom: 16px
    }

.about-page .data-highlights .article {
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center;
    padding: 0;
    width: 100%;
    cursor: pointer
}

    .about-page .data-highlights .article .underline {
        position: absolute;
        bottom: -5px;
        left: 0;
        width: 100%;
        height: 5px;
        background-color: #F13D40;
        transition: all 250ms ease-in-out
    }

    .about-page .data-highlights .article:hover .underline {
        bottom: 0
    }

    .about-page .data-highlights .article .left {
        height: 200px;
        overflow: hidden;
        -ms-flex-item-align: stretch;
        -ms-grid-row-align: stretch;
        align-self: stretch;
        background-size: cover !important;
        background-position: center !important
    }

@media only screen and (max-width:900px) {
    .about-page .data-highlights .article .left {
        height: 150px
    }
}



.about-page .data-highlights .article .left img {
    width: 100%;
    border-radius: 3px
}

.about-page .data-highlights .article .right {
    padding: 16px 32px
}

@media only screen and (max-width:900px) {
    .about-page .data-highlights .article .right {
        padding: 16px
    }
}

.about-page .data-highlights .article .right p {
    margin: 0
}

.about-page .data-highlights .article .right .outlet {
    font-family: 'Open Sans',sans-serif;
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 5px
}

.about-page .data-highlights .article .right .title {
    font-size: 16px;
    margin-bottom: 10px;
    font-family: 'Open Sans',sans-serif;
    color: #949494
}

.about-page .data-highlights .article .right a i {
    font-size: 14px;
    margin-left: 5px;
    transition: all .1s ease-in-out
}

.about-page .data-highlights .article .right a:hover i {
    margin-left: 7px
}

@font-face {
    font-family: FontAwesome;
    font-weight: 400;
    font-style: normal;
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?v=4.3.0);
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?#iefix&v=4.3.0) format("embedded-opentype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff2?v=4.3.0) format("woff2"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff?v=4.3.0) format("woff"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.ttf?v=4.3.0) format("truetype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular) format("svg")
}

body {
    margin: 0;
    background: #fff;
    color: #2B273C;
    font-family: 'Open Sans',sans-serif;
    font-size: 16px;
    overflow-x: hidden;
    box-sizing: border-box
}

.button, .closures-092020 .axis text, .closures-092020 .centered-title--button, .closures-092020 .line-chart--axis text, .closures-092020 .line-chart--circle-label, .closures-092020 .line-chart--label, .closures-092020 .mouseover-instructions, .closures-092020 .q22020-footer, .closures-092020 h4 {
    font-family: 'Open Sans',sans-serif
}

body button:focus, body input:focus, body select:focus, body textarea:focus {
    outline: 0
}

@font-face {
    font-family: FontAwesome;
    font-weight: 400;
    font-style: normal;
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?v=4.3.0);
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?#iefix&v=4.3.0) format("embedded-opentype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff2?v=4.3.0) format("woff2"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff?v=4.3.0) format("woff"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.ttf?v=4.3.0) format("truetype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular) format("svg")
}

.closures-092020 .flag {
    padding-bottom: 20px !important;
    color: #757481 !important;
    font-size: 16px !important
}

.closures-092020 .q22020-footer {
    font-size: 14px !important;
    color: #757481 !important;
    padding-bottom: 20px !important
}

.closures-092020 h3 {
    margin: 0 0 5px;
    font-size: 28px;
    font-weight: 800
}

.closures-092020 h4 {
    margin: 0 0 20px;
    font-size: 18px;
    font-weight: 400
}

@media only screen and (max-width:764px) {
    .closures-092020 h4 {
        margin: 0 0 20px
    }
}

.closures-092020 .mouseover-instructions {
    color: #757481;
    font-size: 14px
}

    .closures-092020 .mouseover-instructions .fa-hand-point-up {
        margin-right: 5px
    }

.closures-092020 .fill-red {
    color: #F13D40;
    font-weight: 800
}

.closures-092020 .chart-wrapper {
    margin: auto auto 60px;
    width: 100%;
    max-width: 800px
}

.closures-092020 .report-wrapper {
    position: relative
}

.closures-092020 .static-image-container {
    width: 100%
}

.closures-092020 .static-image-mobile {
    display: none;
    width: 100%
}

@media only screen and (max-width:763px) {
    .closures-092020 .static-image-mobile {
        display: block
    }
}

.closures-092020 .static-image-tablet {
    display: none;
    width: 100%
}

@media only screen and (min-width:764px) and (max-width:999px) {
    .closures-092020 .static-image-tablet {
        display: block
    }
}

.closures-092020 .static-image-desktop {
    display: none;
    width: 100%
}

@media only screen and (min-width:1000px) {
    .closures-092020 .static-image-desktop {
        display: block
    }
}

.closures-092020 .static-image-container__toggle {
    display: none
}

    .closures-092020 .static-image-container__toggle.is-visible {
        display: block
    }

.closures-092020 .extend-full-width {
    width: calc(100vw - 20px);
    max-width: 1100px;
    margin-left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.closures-092020 .centered-title {
    text-align: left
}

@media only screen and (min-width:764px) {
    .closures-092020 .centered-title {
        text-align: center;
        width: calc(100vw - 20px);
        max-width: 1100px;
        margin-left: 50% !important;
        -ms-transform: translateX(-50%);
        transform: translateX(-50%)
    }
}

.closures-092020 .centered-title-desktop {
    text-align: left
}

@media only screen and (min-width:1000px) {
    .closures-092020 .centered-title-desktop {
        text-align: center;
        width: calc(100vw - 20px);
        max-width: 1100px;
        margin-left: 50% !important;
        -ms-transform: translateX(-50%);
        transform: translateX(-50%)
    }
}

.closures-092020 .methodology-anchor {
    position: absolute;
    visibility: hidden;
    top: -100px;
    left: 50%;
    height: 1px;
    width: 100px
}

@media only screen and (max-width:764px) {
    .closures-092020 .hide__mobile {
        display: none !important
    }
}

.closures-092020 .centered-title--button-container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 20px 0 30px
}

.closures-092020 .centered-title--button {
    border: 1px solid #2B273C;
    background-color: #fff;
    cursor: pointer;
    padding: 4px 8px;
    width: 160px;
    color: #2B273C;
    font-size: 14px;
    text-align: center
}

@media only screen and (max-width:764px) {
    .closures-092020 .centered-title--button-container {
        -ms-flex-pack: start;
        justify-content: flex-start
    }

    .closures-092020 .centered-title--button {
        width: 110px;
        font-size: 10px
    }
}

.closures-092020 .centered-title--button:first-child {
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px
}

.closures-092020 .centered-title--button:last-child {
    border-left: none;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px
}

.closures-092020 .centered-title--button:hover {
    background: #F4F4F4
}

.closures-092020 .centered-title--button.is-active {
    background: #2B273C;
    color: #fff
}

.closures-092020 #line-chart-container {
    width: calc(100vw - 20px);
    max-width: 800px;
    margin-left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.closures-092020 .line-chart--path {
    fill: none;
    stroke: #4f4f4f;
    stroke-width: 2
}

    .closures-092020 .line-chart--path.current {
        stroke: #F13D40;
        stroke-width: 2
    }

    .closures-092020 .line-chart--path.past {
        stroke: #dcdbdb;
        stroke-width: 1
    }

.closures-092020 .line-chart--label {
    font-size: 14px;
    font-weight: 600;
    fill: #2B273C
}

    .closures-092020 .line-chart--label.current {
        font-weight: 700;
        fill: #F13D40
    }

.closures-092020 .line-chart--circle-label {
    font-size: 12px;
    fill: #2B273C;
    font-weight: 600;
    text-anchor: middle
}

.closures-092020 .line-chart--circle-label-bg {
    stroke: #fff;
    stroke-width: 2px
}

.closures-092020 .line-chart--axis text {
    fill: #4f4f4f
}

.closures-092020 .line-chart--axis .domain {
    display: none
}

.closures-092020 .line-chart--axis.y line {
    stroke: #4f4f4f;
    stroke-dasharray: .5 3;
    stroke-linecap: round
}

.closures-092020 .line-chart--axis.y text {
    text-anchor: start;
    -ms-transform: translate(2px,-8px);
    transform: translate(2px,-8px)
}

.closures-092020 .line-chart--axis.y-horiz line {
    stroke: #dcdbdb
}

@font-face {
    font-family: FontAwesome;
    font-weight: 400;
    font-style: normal;
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?v=4.3.0);
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?#iefix&v=4.3.0) format("embedded-opentype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff2?v=4.3.0) format("woff2"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff?v=4.3.0) format("woff"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.ttf?v=4.3.0) format("truetype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular) format("svg")
}

.buttonRed {
    background: #F13D40;
    border-radius: 3px;
    padding: 10px 24px;
    margin: 0 auto;
    display: inline-block;
    cursor: pointer;
    font-weight: 700;
    transition: all 250ms ease-in-out
}

.buttonRed {
    background: #2b273c
}

    .button {
    background: #F13D40;
    border-radius: 3px;
    padding: 10px 24px;
    margin: 0 auto;
    display: inline-block;
    cursor: pointer;
    font-weight: 700;
    transition: all 250ms ease-in-out
}

    .button:hover {
        background: #2b273c
    }

    .button p {
        color: #fff;
        margin: 0
    }

.divider {
    width: 100%;
    height: 1px;
    background: #BBBAC0
}

@font-face {
    font-family: FontAwesome;
    font-weight: 400;
    font-style: normal;
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?v=4.3.0);
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?#iefix&v=4.3.0) format("embedded-opentype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff2?v=4.3.0) format("woff2"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff?v=4.3.0) format("woff"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.ttf?v=4.3.0) format("truetype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular) format("svg")
}

.coronavirus .fill-red {
    color: #F13D40;
    font-weight: 800
}

.coronavirus .map-container {
    margin-bottom: 100px
}

.coronavirus .map-header-container {
    text-align: center
}

    .coronavirus .map-header-container .map-legend-container {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: row;
        flex-direction: row;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -ms-flex-pack: center;
        justify-content: center;
        width: 100%
    }

        .coronavirus .map-header-container .map-legend-container .map-legend {
            padding: 10px 20px
        }

.coronavirus .chart-wrapper .map-header {
    position: relative;
    text-align: center
}

.coronavirus .chart-wrapper .map-header--button-container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 10px
}

.coronavirus .chart-wrapper .map-header--button {
    border: 1px solid #2B273C;
    background-color: #fff;
    cursor: pointer;
    padding: 4px 8px;
    width: 160px;
    color: #2B273C;
    font-family: 'Open Sans',sans-serif;
    font-size: 14px
}

@media only screen and (max-width:764px) {
    .coronavirus .chart-wrapper .map-header--button {
        width: 110px;
        font-size: 10px
    }
}

.coronavirus .chart-wrapper .map-header--button:first-child {
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px
}

.coronavirus .chart-wrapper .map-header--button:last-child {
    border-left: none;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px
}

.coronavirus .chart-wrapper .map-header--button:hover {
    background: #F4F4F4
}

.coronavirus .chart-wrapper .map-header--button.is-active {
    background: #2B273C;
    color: #fff
}

.coronavirus .chart-wrapper .map-header--count-container {
    margin-top: 12px;
    text-align: center
}

.coronavirus .chart-wrapper .map-header--count {
    margin: 12px 0 0;
    color: #F13D40;
    font-size: 32px;
    font-weight: 600
}

.coronavirus .chart-wrapper .map-header--subhed {
    margin: 0;
    color: #2B273C;
    font-family: 'Open Sans',sans-serif;
    font-size: 16px
}

@media only screen and (max-width:764px) {
    .coronavirus .chart-wrapper .map-header--subhed {
        font-size: 12px
    }
}

.coronavirus .chart-wrapper .map-header--subhed-text {
    font-weight: 400
}

.coronavirus .chart-wrapper .map-header--subhed-date {
    font-weight: 700
}

.coronavirus .map-wrapper {
    margin: auto;
    width: 100%
}

    .coronavirus .map-wrapper svg {
        overflow: visible
    }

        .coronavirus .map-wrapper svg path {
            stroke-linejoin: round;
            stroke-linecap: round
        }

            .coronavirus .map-wrapper svg path.us-outline {
                fill: #fff;
                stroke: #2B273C;
                stroke-width: 1px
            }

            .coronavirus .map-wrapper svg path.state-outline {
                fill: none;
                stroke: #F4F4F4
            }

    .coronavirus .map-wrapper .closures__label {
        font-family: 'Open Sans',sans-serif;
        font-size: 12px;
        font-weight: 800;
        text-anchor: middle;
        fill: #2B273C
    }

    .coronavirus .map-wrapper .closures__label--bg {
        stroke: #fff;
        stroke-width: 4px;
        stroke-linecap: round;
        stroke-linejoin: round
    }

    .coronavirus .map-wrapper .closures__label--small {
        font-family: 'Open Sans',sans-serif;
        font-size: 10px;
        text-anchor: middle;
        fill: #757481
    }

    .coronavirus .map-wrapper .closures__label--small-bg {
        stroke: #fff;
        stroke-width: 3px;
        stroke-linecap: round;
        stroke-linejoin: round;
        text-anchor: middle
    }

.coronavirus .chart-wrapper h3 {
    font-size: 28px;
    font-weight: 800
}

.coronavirus .chart-wrapper h4 {
    margin: 0 0 20px;
    font-family: 'Open Sans',sans-serif;
    font-size: 18px;
    font-weight: 400
}

.coronavirus .chart-wrapper p {
    font-weight: 400
}

@media only screen and (min-width:1000px) {
    .coronavirus .chart-wrapper p {
        margin: 0 0 10px;
        font-size: 22px
    }
}

.coronavirus .chart {
    position: relative
}

.coronavirus .area-x-axis text, .coronavirus .x.axis text {
    font-weight: 700
}

.coronavirus .area-x-axis line, .coronavirus .x.axis line {
    stroke: #000 !important
}

.coronavirus .tick text {
    font-family: Roboto,sans-serif;
    fill: #828282
}

.coronavirus .annotation text, .coronavirus .tooltip {
    font-family: 'Open Sans',sans-serif
}

.coronavirus .tick line {
    stroke: #e0e0e0;
    stroke-dasharray: 0 0
}

.coronavirus .voronoi path {
    fill: transparent !important;
    stroke: none !important
}

.coronavirus .tooltip {
    display: none;
    position: absolute;
    z-index: 99;
    box-shadow: rgba(0,0,0,.3) 0 2px 10px;
    background-color: #fff;
    padding: 5px 10px;
    width: 200px;
    pointer-events: none
}

    .coronavirus .tooltip h6 {
        margin: 0;
        font-size: 14px
    }

    .coronavirus .tooltip p {
        margin: 5px 0 0;
        text-align: left;
        font-size: 12px;
        font-weight: 400
    }

.coronavirus .comp-cat-row p {
    font-size: 24px
}

.coronavirus .comp-cat-row .header {
    text-shadow: -1px -1px 0 #f6f6f6,1px -1px 0 #f6f6f6,-1px 1px 0 #f6f6f6,1px 1px 0 #f6f6f6
}

.coronavirus .all-area-wrapper {
    margin: 30px 0
}

.coronavirus .annotation line {
    fill: none;
    stroke: #2B273C
}

.coronavirus .annotation text {
    font-size: 10px;
    font-weight: 400
}

@media only screen and (min-width:600px) {
    .coronavirus .annotation text {
        font-size: 14px
    }
}

.coronavirus .annotation text.bg {
    stroke: #fff;
    stroke-width: 4px;
    stroke-linejoin: round
}

.coronavirus .annotation circle {
    fill: #2B273C;
    stroke: none
}

.coronavirus .full-width-wrapper {
    margin: auto auto 60px;
    padding: 0 30px;
    max-width: 1140px
}

@media only screen and (max-width:600px) {
    .coronavirus .full-width-wrapper {
        padding: 0 15px
    }
}

.coronavirus .full-width-wrapper h2 {
    margin-bottom: 20px;
    border-bottom: 2px solid #d3d3d3;
    padding-bottom: 4px;
    line-height: 1.2;
    color: #2B273C;
    font-family: 'Open Sans',sans-serif;
    font-size: 24px;
    font-weight: 700
}

.contact .prose, .coronavirus .full-width-wrapper .line-chart--axis text, .coronavirus .full-width-wrapper .line-chart--container h3, .coronavirus .full-width-wrapper .line-chart--label, .footer .footer-content, .last-quarter-footnote, .nav, .side-by-side p {
    font-family: 'Open Sans',sans-serif
}

.coronavirus .full-width-wrapper .line-chart--wrapper {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.coronavirus .full-width-wrapper .line-chart--container {
    margin: 0 32px 32px 0
}

@media only screen and (max-width:764px) {
    .coronavirus .full-width-wrapper .line-chart--container {
        margin: 0 0 32px
    }
}

.coronavirus .full-width-wrapper .line-chart--container h3 {
    color: #2B273C;
    font-size: 18px;
    font-weight: 700
}

.coronavirus .full-width-wrapper .line-chart--axis text {
    font-size: 10px;
    fill: #828282
}

.coronavirus .full-width-wrapper .line-chart--axis.x text {
    font-weight: 700
}

.coronavirus .full-width-wrapper .line-chart--axis line {
    stroke: #e0e0e0
}

.coronavirus .full-width-wrapper .line-chart--axis .domain {
    display: none
}

.coronavirus .full-width-wrapper .line-chart--path {
    fill: none;
    stroke-width: 2px;
    stroke-linecap: round;
    stroke-linejoin: round
}

.coronavirus .full-width-wrapper .line-chart--label {
    font-size: 12px
}

.coronavirus .static-image-container {
    width: 100%
}

.coronavirus .static-image-mobile {
    display: none;
    width: 100%
}

@media only screen and (max-width:600px) {
    .coronavirus .static-image-mobile {
        display: block
    }
}

.coronavirus .static-image-tablet {
    display: none;
    width: 100%
}

@media only screen and (min-width:601px) and (max-width:999px) {
    .coronavirus .static-image-tablet {
        display: block
    }
}

.coronavirus .static-image-desktop {
    display: none;
    width: 100%
}

.coronavirus .extend-full-width {
    width: calc(100vw - 20px);
    max-width: 1100px;
    margin-left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.coronavirus .centered-title {
    text-align: left
}

@media only screen and (min-width:1000px) {
    .coronavirus .static-image-desktop {
        display: block
    }

    .coronavirus .centered-title {
        text-align: center;
        width: calc(100vw - 20px);
        max-width: 1100px;
        margin-left: 50% !important;
        -ms-transform: translateX(-50%);
        transform: translateX(-50%)
    }
}

@font-face {
    font-family: FontAwesome;
    font-weight: 400;
    font-style: normal;
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?v=4.3.0);
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?#iefix&v=4.3.0) format("embedded-opentype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff2?v=4.3.0) format("woff2"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff?v=4.3.0) format("woff"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.ttf?v=4.3.0) format("truetype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular) format("svg")
}

.footer {
    padding: 60px 0
}

    .footer .footer-content {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-pack: center;
        justify-content: center;
        -ms-flex-align: center;
        align-items: center;
        text-align: center;
        width: 100%;
        max-width: 1140px;
        margin: auto;
        color: #757481
    }

        .footer .footer-content h5 {
            font-size: 16px;
            font-weight: 700 !important;
            color: #F13D40;
            margin-bottom: 8px
        }

        .footer .footer-content ul {
            list-style-type: none;
            margin-top: 0;
            padding: 0;
            font-size: 14px;
            line-height: 1.5
        }

            .footer .footer-content ul a {
                color: inherit;
                text-decoration: none;
                cursor: pointer
            }

                .footer .footer-content ul a:hover {
                    color: #2B273C
                }

        .footer .footer-content .footer-content-column {
            position: relative
        }

            .footer .footer-content .footer-content-column.desktop {
                display: none
            }

            .footer .footer-content .footer-content-column.mobile {
                display: block
            }

@media only screen and (min-width:1000px) {
    .footer .footer-content {
        -ms-flex-direction: row;
        flex-direction: row;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -ms-flex-align: start;
        align-items: flex-start;
        text-align: left
    }

        .footer .footer-content .footer-content-column.desktop {
            display: block
        }

        .footer .footer-content .footer-content-column.mobile {
            display: none
        }
}

.footer .footer-content .footer-content-column.mobile .footer-link {
    font-size: 14px;
    line-height: 1.5;
    margin: 8px
}

    .footer .footer-content .footer-content-column.mobile .footer-link a {
        color: inherit;
        text-decoration: inherit
    }

.footer .footer-content .country-dropdown {
    display: none;
    position: absolute;
    max-height: 60px;
    overflow-y: scroll;
    background-color: #fff;
    box-shadow: 0 0 18px 0 rgba(0,0,0,.15);
    width: 190px;
    padding: 16px 6px 16px 7px;
    z-index: 99;
    text-align: left
}

.nav, .nav .nav-inner {
    width: 100%;
    z-index: 99
}

.footer .footer-content .country-dropdown.is-visible {
    display: block
}

.footer .footer-content .country-dropdown li a {
    display: block;
    line-height: 19px;
    padding: 10px 0 11px 17px;
    white-space: nowrap;
    border-radius: 4px
}

    .footer .footer-content .country-dropdown li a:hover {
        background-color: #EEEEEF
    }

@font-face {
    font-family: FontAwesome;
    font-weight: 400;
    font-style: normal;
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?v=4.3.0);
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?#iefix&v=4.3.0) format("embedded-opentype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff2?v=4.3.0) format("woff2"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff?v=4.3.0) format("woff"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.ttf?v=4.3.0) format("truetype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular) format("svg")
}

.nav {
    position: fixed;
    height: 89px;
    left: 0;
    top: 0;
    background: #FFF;
    box-shadow: 0 2px 7px rgba(0,0,0,.3)
}

    .nav .nav-inner {
        height: 100%;
        max-width: 1200px;
        margin: auto;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

    .nav .left, .nav .right {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-align: center;
        align-items: center
    }

        .nav .right.desktop {
            display: none
        }

@media only screen and (min-width:1000px) {
    .footer .footer-content .country-dropdown {
        max-height: 150px
    }

    .nav .right.desktop {
        display: -ms-flexbox;
        display: flex
    }
}

.nav .right.mobile {
    display: -ms-flexbox;
    display: flex;
    padding: 0 30px 0 0
}

    .nav .right.mobile img {
        height: 16px
    }

@media only screen and (min-width:1000px) {
    .nav .right.mobile {
        display: none
    }
}

.nav .item {
    height: calc(100% - 3px);
    padding: 0 19px;
    font-size: 14px;
    cursor: pointer;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    border-bottom: 3px solid transparent
}

@media only screen and (max-width:900px) {
    .nav .item {
        font-size: 12px
    }
}

.nav .item p {
    padding-top: 10px
}

.nav .item:hover:not(.logo-item) {
    border-bottom: 3px solid #F13D40
}

.nav .item.is-active {
    font-weight: 700
}

.nav .item .item-logo {
    width: 90px;
    margin: 0 20px 5px 0;
    padding-top: 10px
}

.nav .item p.logo {
    font-size: 16px;
    font-weight: 700;
    color: #BBBAC0
}

@media only screen and (min-width:412px) {
    .nav .item p.logo {
        font-size: 20px
    }
}

.nav .item:hover .dropdown {
    display: block
}

.nav .item .dropdown {
    display: none;
    position: absolute;
    left: 50%;
    top: calc(100% + 3px);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    background-color: #fff;
    box-shadow: 0 8px 16px 0 rgba(0,0,0,.2);
    z-index: 1;
    border-radius: 0 0 5px 5px
}

.carousel-img, .report-carousel .report-container .report {
    border-radius: 3px;
    box-shadow: 0 2px 8px 1px rgba(0,0,0,.25)
}

.nav .item .dropdown a {
    color: #000;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    font-weight: 400
}

    .nav .item .dropdown a:hover {
        background-color: #ddd
    }

    .nav .item .dropdown a.is-active {
        font-weight: 700
    }

.homepage-header {
    margin-top: 89px;
    padding: 80px 0;
    text-align: center;
    background: url(https://the-dataface.github.io/yea-site/assets/img/YEA_header-34a8e568be.jpg);
    background-repeat: no-repeat !important;
    background-size: cover !important;
    background-position: bottom !important
}

    .homepage-header .button {
        margin: 30px 0
    }

    .homepage-header .social {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-pack: center;
        justify-content: center;
        -ms-flex-align: center;
        align-items: center
    }

        .homepage-header .social img {
            padding: 0 10px;
            height: 20px;
            cursor: pointer
        }

            .homepage-header .social img:hover {
                opacity: .7
            }

.report-carousel .carousel-controls p.is-hidden, .report-carousel .report-container.is-hidden {
    pointer-events: none;
    opacity: 0
}

.report-carousel {
    position: relative;
    width: 100%;
    height: 300px
}

    .report-carousel .report-container {
        position: absolute;
        top: 0;
        left: 0;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-pack: start;
        justify-content: flex-start
    }

        .report-carousel .report-container .report {
            padding: 0 0 16px;
            margin-right: 16px;
            width: calc(100% / 4 - 16px);
            min-height: 200px;
            cursor: pointer;
            position: relative;
            overflow-y: hidden
        }

            .report-carousel .report-container .report .blurb, .report-carousel .report-container .report .date {
                line-height: 20px;
                padding: 0 16px;
                font-weight: 700;
                font-family: 'Open Sans',sans-serif
            }

            .report-carousel .report-container .report:last-child {
                margin-right: 0
            }

@media only screen and (max-width:900px) {
    .report-carousel .report-container {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }

        .report-carousel .report-container .report {
            width: calc(100% / 2 - 16px);
            margin-bottom: 30px
        }
}

@media only screen and (max-width:500px) {
    .report-carousel .report-container .report {
        width: calc(100% / 2 - 8px);
        margin-bottom: 16px;
        margin-right: 8px
    }
}

.report-carousel .report-container .report.three {
    width: calc(100% / 3 - 16px)
}

@media only screen and (max-width:500px) {
    .report-carousel .report-container .report.three {
        width: calc(100% / 2 - 8px);
        margin-bottom: 16px;
        margin-right: 8px
    }
}

.report-carousel .report-container .report img {
    width: 100%
}

.report-carousel .report-container .report .date {
    color: #BBBAC0;
    font-size: 12px;
    margin: 16px 0 0
}

.report-carousel .report-container .report .blurb {
    margin: 0;
    color: #2B273C;
    font-size: 16px
}

.report-carousel .report-container .report .underline {
    position: absolute;
    bottom: -5px;
    left: 0;
    width: 100%;
    height: 5px;
    background-color: #F13D40;
    transition: all 250ms ease-in-out
}

.report-carousel .report-container .report:hover .underline {
    bottom: 0
}

.report-carousel .carousel-controls {
    position: absolute;
    top: calc(100% + 10px);
    width: 100%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between
}

    .report-carousel .carousel-controls p {
        cursor: pointer;
        margin: 0
    }

        .report-carousel .carousel-controls p:hover {
            color: #F13D40
        }

        .report-carousel .carousel-controls p.carousel-prev {
            margin-right: 20px
        }

        .report-carousel .carousel-controls p .fa-chevron-left {
            margin-right: 3px
        }

        .report-carousel .carousel-controls p .fa-chevron-right {
            margin-left: 3px
        }

.last-quarter {
    padding: 30px;
    text-align: center
}

    .last-quarter .spotlight {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-pack: center;
        justify-content: center;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        margin: 40px 0 60px
    }

@media only screen and (max-width:900px) {
    .last-quarter .spotlight {
        margin: 30px 0 40px
    }
}

.last-quarter .spotlight .item {
    max-width: 300px;
    text-align: left
}

    .last-quarter .spotlight .item:first-child {
        margin-right: 100px
    }

@media only screen and (max-width:900px) {
    .last-quarter .spotlight .item {
        width: 100%;
        max-width: 600px;
        text-align: center
    }

        .last-quarter .spotlight .item:first-child {
            margin-bottom: 30px;
            margin-right: 0
        }
}

.last-quarter .spotlight .item p {
    margin: 0
}

.last-quarter .spotlight .item .title {
    font-size: 20px;
    color: #2B273C;
    margin-bottom: 10px;
    font-weight: 700
}

@media only screen and (max-width:900px) {
    .last-quarter .spotlight .item .title {
        font-size: 18px;
        margin-bottom: 5px
    }
}

.last-quarter .spotlight .item .big {
    font-size: 70px;
    font-weight: 700;
    line-height: 1
}

@media only screen and (max-width:900px) {
    .last-quarter .spotlight .item .big {
        font-size: 50px
    }
}

.last-quarter .spotlight .item .medium {
    font-size: 24px;
    font-weight: 600
}

@media only screen and (max-width:900px) {
    .last-quarter .spotlight .item .medium {
        font-size: 20px
    }
}

.last-quarter .spotlight .item .sub {
    font-size: 16px;
    margin-top: 0
}

@media only screen and (max-width:900px) {
    .last-quarter .spotlight .item .sub {
        font-size: 14ppx
    }
}

.last-quarter .spotlight .item .list {
    columns: 100px 2;
    text-align: left;
    width: 350px;
    max-width: 100%;
    margin: auto
}

    .last-quarter .spotlight .item .list ol {
        margin: 0;
        padding: 0;
        list-style-position: inside
    }

        .last-quarter .spotlight .item .list ol li {
            font-weight: 400;
            font-size: 18px
        }

.last-quarter .youtube-video-wrapper {
    width: 600px;
    max-width: 100%;
    margin: auto
}

.last-quarter .youtube-video-container {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
    box-shadow: 0 2px 8px 1px rgba(0,0,0,.25)
}

.last-quarter .youtube-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.last-quarter .side-by-side {
    text-align: left
}

    .last-quarter .side-by-side .carousel-controls {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-align: center;
        align-items: center
    }

        .last-quarter .side-by-side .carousel-controls .carousel-circles {
            display: -ms-flexbox;
            display: flex;
            margin: 0 5px
        }

            .last-quarter .side-by-side .carousel-controls .carousel-circles div {
                width: 14px;
                height: 14px;
                border-radius: 50%;
                border: 2px solid #F13D40;
                margin: 0 5px;
                cursor: pointer;
                transition: 250ms ease-in-out
            }

                .last-quarter .side-by-side .carousel-controls .carousel-circles div.is-active, .last-quarter .side-by-side .carousel-controls .carousel-circles div:hover {
                    background: #F13D40
                }

        .last-quarter .side-by-side .carousel-controls p {
            margin: 0;
            color: #F13D40;
            cursor: pointer;
            white-space: nowrap;
            display: -ms-flexbox;
            display: flex;
            -ms-flex-direction: row;
            flex-direction: row;
            -ms-flex-pack: center;
            justify-content: center;
            -ms-flex-align: center;
            align-items: center;
            transition: color 250ms ease-in-out
        }

            .last-quarter .side-by-side .carousel-controls p i {
                margin-left: 4px;
                font-size: 18px
            }

            .last-quarter .side-by-side .carousel-controls p:hover {
                color: #2B273C
            }

.logos {
    margin: 48px 0
}

    .logos .logos-row {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: row;
        flex-direction: row;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -ms-flex-line-pack: center;
        align-content: center;
        -ms-flex-pack: justify;
        justify-content: space-between;
        gap: 16px 24px
    }

@media only screen and (min-width:472px) {
    .logos .logos-row {
        gap: 16px 8px
    }
}

@media only screen and (min-width:537px) {
    .logos .logos-row {
        gap: 16px 24px
    }
}

@media only screen and (min-width:900px) {
    .logos .logos-row {
        gap: 32px 64px
    }
}

@media only screen and (min-width:1029px) {
    .logos .logos-row {
        gap: 32px 32px
    }
}

@media only screen and (min-width:1166px) {
    .logos .logos-row {
        gap: 32px 64px
    }
}

.logos .logos-row img {
    height: 30px
}

@media only screen and (min-width:417px) {
    .logos .logos-row img {
        height: 36px
    }
}

@media only screen and (min-width:900px) {
    .logos .logos-row img {
        height: 50px
    }
}

@media only screen and (min-width:1029px) {
    .logos .logos-row img {
        height: 75px
    }
}

.videos {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between
}

    .videos .video {
        width: 46%;
        position: relative
    }

@media only screen and (max-width:900px) {
    .logos {
        margin: 32px 0 48px
    }

    .videos {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }

        .videos .video {
            width: 95%;
            margin-bottom: 20px
        }
}

.videos .video .tag {
    position: absolute;
    left: 0;
    top: 0;
    background: rgba(43,39,60,.8);
    padding: 5px 10px
}

    .videos .video .tag.cheddar img, .videos .video .tag.yahoo img {
        height: 20px;
        margin-top: 4px
    }

    .videos .video .tag.cnbc img {
        height: 30px;
        margin-top: 4px
    }

.videos .video video {
    width: 100%
}

.contact .prose {
    font-size: 20px
}

@media only screen and (max-width:640px) {
    .contact .prose {
        font-size: 16px
    }
}



.mobile-menu {
    position: fixed;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    top: 80px;
    left: 0;
    min-height: 100px;
    width: 100%;
    background: #FFF;
    box-shadow: 0 2px 7px rgba(0,0,0,.3);
    z-index: 98;
    transition: all 250ms ease-in-out;
    -ms-transform: translate(0,-100%);
    transform: translate(0,-100%)
}

@media only screen and (min-width:1000px) {
    .mobile-menu {
        display: none
    }
}

.mobile-menu.is-visible {
    -ms-transform: translate(0,0);
    transform: translate(0,0)
}

.mobile-menu .menu-row {
    padding: 16px;
    border-bottom: 1px solid #BBBAC0
}

    .mobile-menu .menu-row p {
        margin: 8px 0;
        font-weight: 700;
        color: #2B273C
    }

        .mobile-menu .menu-row p:first-child {
            margin-bottom: 0
        }

    .mobile-menu .menu-row .reports {
        margin-top: 0;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: row;
        flex-direction: row;
        -ms-flex-align: space-between;
        align-items: space-between;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }

        .mobile-menu .menu-row .reports a {
            color: inherit;
            padding: 0 20px 3px 0
        }

            .mobile-menu .menu-row .reports a.is-active {
                color: #F13D40;
                font-weight: 700
            }

    .mobile-menu .menu-row .item {
        color: inherit;
        text-decoration: inherit
    }

        .mobile-menu .menu-row .item.is-active p {
            color: #F13D40
        }

.menu-wrapper {
    margin: auto;
    width: 24px;
    height: 18px;
    cursor: pointer
}

.hamburger-menu, .hamburger-menu:after, .hamburger-menu:before {
    width: 24px;
    height: 2px
}

.hamburger-menu {
    position: relative;
    -ms-transform: translateY(8px);
    transform: translateY(8px);
    background: #2b273c;
    transition: all 0 .3s
}

    .hamburger-menu.animate {
        background: rgba(43,39,60,0)
    }

    .hamburger-menu:after, .hamburger-menu:before {
        content: '';
        position: absolute;
        left: 0;
        background: #2b273c
    }

    .hamburger-menu:before {
        bottom: 8px;
        transition: bottom .3s .3s cubic-bezier(.23,1,.32,1),transform .3s cubic-bezier(.23,1,.32,1)
    }

    .hamburger-menu:after {
        top: 8px;
        transition: top .3s .3s cubic-bezier(.23,1,.32,1),transform .3s cubic-bezier(.23,1,.32,1)
    }

    .hamburger-menu.animate:after {
        top: 0;
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
        transition: top .3s cubic-bezier(.23,1,.32,1),transform .3s .3s cubic-bezier(.23,1,.32,1)
    }

    .hamburger-menu.animate:before {
        bottom: 0;
        -ms-transform: rotate(-45deg);
        transform: rotate(-45deg);
        transition: bottom .3s cubic-bezier(.23,1,.32,1),transform .3s .3s cubic-bezier(.23,1,.32,1)
    }

.report-header p a, .report-wrapper .prose a, a {
    text-decoration: none;
    transition: .3s
}

.last-quarter-footnote {
    padding-top: 20px;
    font-size: 16px
}

@font-face {
    font-family: FontAwesome;
    font-weight: 400;
    font-style: normal;
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?v=4.3.0);
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?#iefix&v=4.3.0) format("embedded-opentype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff2?v=4.3.0) format("woff2"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff?v=4.3.0) format("woff"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.ttf?v=4.3.0) format("truetype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular) format("svg")
}

.homepage-wrapper {
    max-width: 1140px;
    padding: 25px;
    margin: 30px auto
}

@media only screen and (min-width:834px) {
    .homepage-wrapper {
        padding: 50px;
        margin: 55px auto
    }
}

@media only screen and (max-width:900px) {
    .homepage-wrapper {
        max-width: 500px
    }
}

.homepage-wrapper.divider-wrapper {
    padding: 25px;
    margin: 30px auto
}

.homepage-wrapper.reduce-padding-top {
    padding-top: 25px;
    margin-top: 30px
}

.homepage-wrapper.reduce-padding-bottom {
    padding-bottom: 25px;
    margin-bottom: 30px
}

.homepage-wrapper.intro-wrapper {
    margin-top: 0;
    padding-top: 0
}

@media only screen and (min-width:834px) {
    .homepage-wrapper.intro-wrapper {
        margin-top: 25px;
        padding-top: 25px
    }
}

.supporting-wrapper {
    max-width: 1000px;
    padding: 0 170px;
    margin: auto auto 60px
}

@media only screen and (max-width:900px) {
    .supporting-wrapper {
        max-width: 500px;
        padding: 0 15px
    }
}

.report-wrapper {
    max-width: 800px;
    padding: 0 50px;
    margin: auto auto 60px
}

@media only screen and (max-width:900px) {
    .report-wrapper {
        max-width: 500px;
        padding: 0 15px
    }
}

.nav-margin {
    margin-top: 89px
}

    .nav-margin.large {
        margin-top: 160px
    }

@media only screen and (min-width:600px) {
    .nav-margin.large {
        margin-top: 180px
    }
}

.gray-bg {
    background: #F4F4F4
}

    .gray-bg.padded {
        margin: 42px 0;
        padding: 8px
    }

.side-by-side {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-align: center;
    align-items: center
}

    .side-by-side.margin-top {
        margin-top: 60px
    }

    .side-by-side.margin-bottom {
        margin-bottom: 60px
    }

    .side-by-side .container {
        width: 48%
    }

@media only screen and (max-width:900px) {
    .side-by-side {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }

        .side-by-side.wrap-reverse {
            -ms-flex-wrap: wrap-reverse;
            flex-wrap: wrap-reverse
        }

        .side-by-side .container {
            width: 100%
        }
}

.side-by-side .container p:last-child {
    margin-bottom: 0
}

.side-by-side .container img {
    width: 100%;
    -ms-flex: 1;
    flex: 1
}

@media only screen and (max-width:900px) {
    .side-by-side .container img {
        margin-bottom: 20px
    }
}

.quotation-wrapper p.logo, .quote-image p, .report-header h1, .report-wrapper h1, .report-wrapper h2 {
    font-family: "Helvetica Neue",sans-serif
}

.quotation-wrapper {
    position: relative;
    margin-top: 10px
}

    .quotation-wrapper p {
        font-weight: 300;
        font-size: 24px;
        margin: 50px 20px 30px 0;
        padding-right: 10px
    }

        .quotation-wrapper p.logo, .quote-image p {
            margin: 0;
            font-style: italic
        }

@media only screen and (max-width:900px) {
    .quotation-wrapper p {
        font-size: 20px
    }
}

.quotation-wrapper p.logo {
    font-size: 24px;
    font-weight: 600;
    color: #F13D40;
    line-height: 1.2
}

    .quotation-wrapper p.logo.sub {
        font-weight: 200;
        color: grey;
        font-size: 20px
    }

@media only screen and (max-width:900px) {
    .quotation-wrapper p.logo {
        font-size: 20px
    }

        .quotation-wrapper p.logo.sub {
            font-size: 18px
        }
}

.quotation {
    position: absolute;
    top: -30px;
    color: #BBBAC0;
    opacity: .7;
    z-index: -1;
    font-size: 24px
}

.quote-image {
    text-align: left
}

    .quote-image p {
        font-size: 30px;
        font-weight: 600;
        color: #A41034
    }

    .quote-image img {
        max-width: 300px !important;
        margin-top: 20px
    }

@media only screen and (min-width:1000px) {
    .quote-image {
        text-align: right
    }
}

.report-header {
    text-align: center
}

@font-face {
    font-family: FontAwesome;
    font-weight: 400;
    font-style: normal;
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?v=4.3.0);
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?#iefix&v=4.3.0) format("embedded-opentype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff2?v=4.3.0) format("woff2"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff?v=4.3.0) format("woff"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.ttf?v=4.3.0) format("truetype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular) format("svg")
}

.report-outer.padding-top {
    padding: 48px 0 16px
}

    .report-outer.padding-top .report-wrapper {
        margin-bottom: 0
    }

.report-header {
    margin: 160px auto 80px;
    padding: 0 32px
}

@media only screen and (min-width:600px) {
    .report-header {
        margin: 240px auto 80px
    }
}

.report-header h1 {
    margin-bottom: 20px;
    line-height: 1.25;
    color: #2B273C;
    font-size: 48px;
    font-weight: 700
}

@media only screen and (min-width:600px) {
    .report-header h1 {
        font-size: 60px
    }
}

.report-header h3, .report-header p {
    color: #BBBAC0;
    font-weight: 400;
    max-width: 900px;
    margin: 20px auto
}

.report-header p {
    line-height: 1.8;
    font-size: 18px
}

    .report-header p a {
        border-bottom: 1px solid #BBBAC0;
        color: inherit
    }

        .report-header p a:hover {
            color: #F13D40
        }

.report-header .social {
    margin-top: 8px;
    color: #BBBAC0
}

    .report-header .social a:hover {
        color: #F13D40
    }

.report-wrapper.methodology p {
    color: #333;
    font-size: 16px
}

.report-wrapper.methodology em {
    font-style: normal;
    font-weight: 700;
    color: #2B273C;
    font-size: 18px;
    margin-top: 32px
}

.report-wrapper.methodology ol li {
    font-size: 16px;
    color: #333;
    margin: 12px 0
}

.report-wrapper h1, .report-wrapper h2 {
    font-weight: 700;
    margin-bottom: 20px
}

.report-wrapper h1 {
    font-size: 28px;
    color: #2B273C;
    line-height: 1.25
}

@media only screen and (min-width:600px) {
    .report-wrapper h1 {
        font-size: 32px
    }
}

.report-wrapper h2 {
    font-size: 24px;
    color: #F13D40;
    line-height: 1.2
}

.report-wrapper .prose, .report-wrapper.report-title .quarter {
    font-size: 18px;
    font-family: 'Open Sans',sans-serif
}

.report-wrapper .prose {
    color: #2B273C;
    font-weight: 400;
    line-height: 1.8;
    margin: 20px 0
}

h1, h2 {
    line-height: 1.2
}

.report-wrapper .prose a {
    color: inherit;
    border-bottom: 1px solid #F13D40
}

    .report-wrapper .prose a:hover {
        color: #F13D40
    }

.report-wrapper .static-image {
    margin: 20px 0
}

    .report-wrapper .static-image.full-width {
        width: 100%
    }

.report-wrapper p {
    margin: 0
}

.report-wrapper.report-title {
    margin-bottom: 40px;
    margin-top: 160px
}

@media only screen and (min-width:600px) {
    .report-wrapper.report-title {
        margin-bottom: 32px;
        margin-top: 180px
    }
}

.report-footer .divider, .report-footer h3 {
    margin-bottom: 24px
}

.report-wrapper.report-title .quarter {
    color: #BBBAC0;
    font-weight: 700
}

.report-wrapper.report-title .byline {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%
}

    .report-wrapper.report-title .byline .info {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-pack: start;
        justify-content: flex-start
    }

        .report-wrapper.report-title .byline .info .image {
            width: 40px;
            height: 40px;
            border: 2px solid #2B273C;
            border-radius: 50%;
            margin-right: 10px;
            background-size: cover !important;
            background-position: center
        }

        .report-wrapper.report-title .byline .info .text {
            font-size: 24x;
            font-family: "Helvetica Neue",sans-serif
        }

.school-2020 .axis text, .school-2020 .line-chart--axis text, .school-2020 .line-chart--label, .school-2020 .q22020-footer, .school-2020 h4, .supporting-wrapper .prose, a {
    font-family: 'Open Sans',sans-serif
}

.report-wrapper.report-title .byline .info .text .name {
    color: #2B273C;
    font-weight: 600
}

.report-wrapper.report-title .byline .info .text .sub {
    color: #757481;
    font-weight: 400
}

.report-wrapper.report-title .byline .info .text .inline {
    display: inline-block
}

.report-wrapper.report-title .byline .social {
    font-size: 20px;
    color: #00838F;
    cursor: pointer
}

    .report-wrapper.report-title .byline .social a:hover {
        color: #2B273C
    }

.school-2020 .flag, .school-2020 .q22020-footer {
    color: #757481 !important;
    padding-bottom: 20px !important
}

.report-footer {
    margin-top: 48px
}

    .report-footer h3 {
        font-weight: 600
    }

@font-face {
    font-family: FontAwesome;
    font-weight: 400;
    font-style: normal;
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?v=4.3.0);
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?#iefix&v=4.3.0) format("embedded-opentype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff2?v=4.3.0) format("woff2"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff?v=4.3.0) format("woff"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.ttf?v=4.3.0) format("truetype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular) format("svg")
}

.school-2020 .flag {
    font-size: 16px !important
}

.school-2020 .q22020-footer {
    font-size: 14px !important
}

.school-2020 .report-wrapper h3 {
    margin: 0 0 5px;
    font-size: 28px;
    font-weight: 800
}

.school-2020 h4 {
    margin: 0 0 20px;
    font-size: 18px;
    font-weight: 400
}

@media only screen and (max-width:764px) {
    .school-2020 h4 {
        margin: 0 0 20px
    }
}

.school-2020 .fill-red {
    color: #F13D40;
    font-weight: 800
}

h1, h2, h3 {
    color: #2B273C;
    font-weight: 700
}

.school-2020 .chart-wrapper {
    margin: auto auto 60px;
    width: 100%;
    max-width: 800px
}

.school-2020 .report-wrapper {
    position: relative
}

.school-2020 .static-image-container {
    width: 100%
}

.school-2020 .static-image-mobile {
    display: none;
    width: 100%
}

@media only screen and (max-width:600px) {
    .school-2020 .static-image-mobile {
        display: block
    }
}

.school-2020 .static-image-tablet {
    display: none;
    width: 100%
}

@media only screen and (min-width:601px) and (max-width:999px) {
    .school-2020 .static-image-tablet {
        display: block
    }
}

.school-2020 .static-image-desktop {
    display: none;
    width: 100%
}

@media only screen and (min-width:1000px) {
    .school-2020 .static-image-desktop {
        display: block
    }
}

.school-2020 .static-image-container__toggle {
    display: none
}

    .school-2020 .static-image-container__toggle.is-visible {
        display: block
    }

.school-2020 .extend-full-width {
    width: calc(100vw - 20px);
    max-width: 1100px;
    margin-left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.school-2020 .centered-title {
    text-align: center;
    width: calc(100vw - 20px);
    max-width: 1100px;
    margin-left: 50% !important;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.school-2020 .centered-title-desktop {
    text-align: left
}

@media only screen and (min-width:1000px) {
    .school-2020 .centered-title-desktop {
        text-align: center;
        width: calc(100vw - 20px);
        max-width: 1100px;
        margin-left: 50% !important;
        -ms-transform: translateX(-50%);
        transform: translateX(-50%)
    }
}

.school-2020 .methodology-anchor {
    position: absolute;
    visibility: hidden;
    top: -100px;
    left: 50%;
    height: 1px;
    width: 100px
}

@media only screen and (max-width:764px) {
    .school-2020 .hide__mobile {
        display: none !important
    }
}

.school-2020 #line-chart-container {
    width: calc(100vw - 20px);
    max-width: 800px;
    margin-left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

h1, h3 {
    margin: 0
}

.school-2020 .line-chart--path {
    fill: none;
    stroke: #4f4f4f;
    stroke-width: 2
}

    .school-2020 .line-chart--path.current {
        stroke: #F13D40;
        stroke-width: 2
    }

    .school-2020 .line-chart--path.past {
        stroke: #dcdbdb;
        stroke-width: 1
    }

.school-2020 .line-chart--label {
    font-size: 14px;
    fill: #4f4f4f
}

    .school-2020 .line-chart--label.current {
        font-weight: 700;
        fill: #F13D40
    }

.school-2020 .line-chart--axis text {
    fill: #4f4f4f
}

.school-2020 .line-chart--axis .domain {
    display: none
}

.school-2020 .line-chart--axis.y line {
    stroke: #4f4f4f;
    stroke-dasharray: .5 3;
    stroke-linecap: round
}

.school-2020 .line-chart--axis.y text {
    text-anchor: start;
    -ms-transform: translate(2px,-8px);
    transform: translate(2px,-8px)
}

.school-2020 .line-chart--axis.y-horiz line {
    stroke: #dcdbdb
}

@font-face {
    font-family: FontAwesome;
    font-weight: 400;
    font-style: normal;
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?v=4.3.0);
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?#iefix&v=4.3.0) format("embedded-opentype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff2?v=4.3.0) format("woff2"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff?v=4.3.0) format("woff"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.ttf?v=4.3.0) format("truetype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular) format("svg")
}

h1 {
    font-size: 70px
}

@media only screen and (max-width:900px) {
    h1 {
        font-size: 60px
    }
}

@media only screen and (max-width:640px) {
    h1 {
        font-size: 45px
    }
}

h2 {
    font-size: 44px;
    margin: 0 0 20px
}

@media only screen and (max-width:900px) {
    h2 {
        font-size: 40px
    }
}

@media only screen and (max-width:640px) {
    h2 {
        font-size: 36px
    }
}

h3 {
    font-size: 24px;
    line-height: 1.4
}

@media only screen and (max-width:900px) {
    h3 {
        font-size: 20px
    }
}

.supporting-wrapper .prose {
    font-size: 18px;
    line-height: 32px;
    position: relative
}

    .supporting-wrapper .prose .annotated {
        display: inline;
        background: #F8BFC1;
        cursor: pointer
    }

    .supporting-wrapper .prose .annotation {
        display: block;
        width: 150px;
        margin: -17px 0 0;
        padding: 0;
        position: absolute;
        left: calc(100% + 15px)
    }

@media only screen and (max-width:900px) {
    .supporting-wrapper .prose .annotation {
        display: none
    }
}

.supporting-wrapper .prose .annotation-bullet {
    display: inline-block;
    height: 10px;
    width: 10px;
    margin-right: 3px;
    background-color: #F68A8A
}

.supporting-wrapper .prose .annotation-text {
    color: #F68A8A;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 1px;
    margin-right: 15px
}

.supporting-wrapper .prose .annotation-date {
    display: inline;
    width: 100%;
    color: #757481;
    font-size: 14px;
    font-weight: 400;
    text-align: left;
    text-transform: uppercase
}

.supporting-wrapper .prose .annotation-reveal {
    padding: 8px 16px;
    display: none
}

@media only screen and (max-width:900px) {
    .supporting-wrapper .prose .annotation-reveal {
        padding: 8px 0
    }
}

.supporting-wrapper .prose .annotation-reveal-text {
    color: #757481;
    font-size: 14px
}

@media only screen and (min-width:901px) {
    .supporting-wrapper .prose .annotation-mobile {
        display: none
    }
}

.supporting-wrapper li {
    margin-bottom: 10px
}

a {
    color: inherit
}

.large-area-wrapper p span, .score-label {
    font-family: Roboto,sans-serif
}

a.underline {
    border-bottom: 1px solid #0E81CA
}

    a.underline:hover {
        color: #0E81CA
    }

a.colored {
    color: #00838F;
    font-weight: 600
}

.side-by-side .prose {
    line-height: 1.6;
    font-size: 18px
}

@media only screen and (max-width:640px) {
    .side-by-side .prose {
        font-size: 16px
    }
}

.text-red {
    color: #F13D40
}

@font-face {
    font-family: FontAwesome;
    font-weight: 400;
    font-style: normal;
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?v=4.3.0);
    src: url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?#iefix&v=4.3.0) format("embedded-opentype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff2?v=4.3.0) format("woff2"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff?v=4.3.0) format("woff"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.ttf?v=4.3.0) format("truetype"),url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular) format("svg")
}

.large-area-wrapper {
    width: calc(100% - 32px);
    height: 400px;
    max-width: 800px;
    margin: 32px auto;
    padding: 16px
}

    .large-area-wrapper h4 {
        font-weight: 800
    }

    .large-area-wrapper p {
        font-weight: 400
    }

@media only screen and (min-width:1000px) {
    .large-area-wrapper {
        margin-bottom: 50px
    }

        .large-area-wrapper h4 {
            font-size: 36px;
            margin: 0 0 5px
        }

        .large-area-wrapper p {
            font-size: 22px;
            margin: 0 0 10px
        }
}

@media only screen and (min-width:764px) and (max-width:999px) {
    .large-area-wrapper {
        margin-bottom: 40px
    }

        .large-area-wrapper h4 {
            font-size: 32px;
            margin: 0 0 5px
        }

        .large-area-wrapper p {
            font-size: 20px;
            margin: 0 0 10px
        }
}

@media only screen and (max-width:763px) {
    .large-area-wrapper {
        margin-bottom: 20px
    }

        .large-area-wrapper h4 {
            font-size: 22px;
            margin: 0 0 5px
        }

        .large-area-wrapper p {
            font-size: 16px;
            margin: 0 0 10px
        }
}

.large-area-wrapper .button-container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: start;
    justify-content: start
}

    .large-area-wrapper .button-container p {
        border: 1px solid #000;
        border-radius: 3px;
        color: #000;
        background: #fff;
        font-weight: 600;
        cursor: pointer
    }

        .large-area-wrapper .button-container .selected, .large-area-wrapper .button-container p:hover {
            background: #000;
            color: #fff
        }

@media only screen and (min-width:1000px) {
    .large-area-wrapper .button-container p {
        font-size: 12px;
        margin-right: 5px;
        padding: 2px 5px
    }
}

@media only screen and (min-width:764px) and (max-width:999px) {
    .large-area-wrapper .button-container p {
        font-size: 12px;
        margin-right: 5px;
        padding: 2px 5px
    }
}

@media only screen and (max-width:763px) {
    .large-area-wrapper .button-container p {
        font-size: 10px;
        margin-right: 3px;
        padding: 2px 3px
    }
}

#large-area-container {
    width: 100%;
    height: 300px;
    position: relative;
    margin-left: 5px
}

    #large-area-container #loader {
        background: #d32323;
        color: #fff;
        font-weight: 200;
        font-size: 16px;
        padding: 6px 10px;
        border-radius: 4px;
        position: absolute;
        left: 0;
        top: 0;
        -ms-transform: translate(0,0);
        transform: translate(0,0)
    }

        #large-area-container #loader .lds-ellipsis {
            display: inline-block;
            position: relative;
            width: 30px;
            height: 14px
        }

.area-axis .domain, .area-y-axis .tick line, .large-area-axis .domain, .large-area-y-axis .tick line {
    display: none
}

#large-area-container #loader .lds-ellipsis div {
    position: absolute;
    top: 7px;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #fff;
    animation-timing-function: cubic-bezier(0,1,1,0)
}

    #large-area-container #loader .lds-ellipsis div:nth-child(1) {
        left: 3px;
        animation: lds-ellipsis1 .6s infinite
    }

    #large-area-container #loader .lds-ellipsis div:nth-child(2) {
        left: 3px;
        animation: lds-ellipsis2 .6s infinite
    }

    #large-area-container #loader .lds-ellipsis div:nth-child(3) {
        left: 13px;
        animation: lds-ellipsis2 .6s infinite
    }

    #large-area-container #loader .lds-ellipsis div:nth-child(4) {
        left: 23px;
        animation: lds-ellipsis3 .6s infinite
    }

@keyframes lds-ellipsis1 {
    0% {
        transform: scale(0)
    }

    100% {
        transform: scale(1)
    }
}

@keyframes lds-ellipsis3 {
    0% {
        transform: scale(1)
    }

    100% {
        transform: scale(0)
    }
}

@keyframes lds-ellipsis2 {
    0% {
        transform: translate(0,0)
    }

    100% {
        transform: translate(9px,0)
    }
}

.overlay {
    fill: none;
    pointer-events: all
}

.axis line, .focus, .quarter-line, .score-label {
    pointer-events: none
}

    .focus circle {
        stroke: #000
    }

.score-label {
    position: absolute;
    background: #fff;
    box-shadow: rgba(0,0,0,.3) 0 2px 10px;
    color: #000;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    padding: 3px 5px;
    font-size: 12px
}

.all-area-wrapper {
    font-family: sans-serif;
    margin: 30px 0 100px
}

#comp-area-wrapper {
    margin: auto;
    overflow-y: hidden;
    position: relative;
    padding: 0 10px
}

@media only screen and (min-width:1200px) {
    #comp-area-wrapper {
        width: 1140px
    }
}

@media only screen and (min-width:1000px) and (max-width:1199px) {
    #comp-area-wrapper {
        width: 990px
    }
}

@media only screen and (min-width:764px) and (max-width:999px) {
    #comp-area-wrapper {
        width: 95vw
    }
}

@media only screen and (max-width:763px) {
    #comp-area-wrapper {
        width: 95vw
    }
}

.comp-cat-row {
    width: 100%
}

    .comp-cat-row p {
        font-weight: 800;
        border-bottom: 2px solid #d3d3d3
    }

    .comp-cat-row .comp-area-row {
        width: 100%;
        position: relative
    }

        .comp-cat-row .comp-area-row .comp-area-container {
            position: absolute;
            background: #f6f6f6
        }

.highlighted-comp-area {
    background-color: #f6f6f6 !important;
    box-shadow: rgba(0,0,0,.3) 0 3px 5px
}

@media only screen and (min-width:1000px) {
    .comp-cat-row {
        margin-bottom: 40px
    }

        .comp-cat-row p {
            font-size: 18px;
            margin: 0 0 10px
        }

        .comp-cat-row .comp-area-row {
            height: 140px
        }
}

@media only screen and (min-width:764px) and (max-width:999px) {
    .comp-cat-row {
        margin-bottom: 40px
    }

        .comp-cat-row p {
            font-size: 18px;
            margin: 0 0 10px
        }

        .comp-cat-row .comp-area-row {
            height: 140px
        }
}

@media only screen and (max-width:763px) {
    .comp-cat-row {
        margin-bottom: 20px
    }

        .comp-cat-row p {
            font-size: 18px;
            margin: 0 0 10px
        }

        .comp-cat-row .comp-area-row {
            height: 140px
        }
}

.comp-cat-row .comp-area-row .comp-area-container .comp-area-title {
    font-size: 16px;
    font-family: 'Open Sans',sans-serif;
    font-weight: 800;
    position: absolute;
    left: 8px;
    top: 8px
}

#metro-area-wrapper .comp-area-title .sub-header, .area-axis, .large-area-axis {
    font-family: Roboto,sans-serif
}

.comp-cat-row .comp-area-row .comp-area-container .comp-area-title p {
    border-bottom: 0;
    margin: 0
}

.comp-cat-row .comp-area-row .comp-area-container .comp-area-title .header {
    font-size: 14px;
    line-height: 1.25;
    font-weight: 400
}

.comp-cat-row .comp-area-row .comp-area-container .comp-area-title .sub-header {
    margin-top: 4px;
    font-family: Roboto,sans-serif;
    font-size: 12px;
    font-weight: 700
}

.comp-cat-row .comp-area-row .comp-area-container .comp-area-title .hidden {
    opacity: 0;
    font-size: 8px
}

.large-area-axis {
    color: #000;
    fill: #000;
    font-size: 12px
}

.large-area-y-axis .tick text {
    text-anchor: start;
    text-shadow: -1px -1px 0 #fff,1px -1px 0 #fff,-1px 1px 0 #fff,1px 1px 0 #fff
}

.area-axis {
    color: grey
}

    .area-axis .tick text {
        font-size: 8px;
        text-anchor: middle
    }

#metro-area-wrapper {
    width: 960px;
    margin: auto
}

    #metro-area-wrapper .comp-area-title {
        font-size: 20px;
        font-weight: 800;
        left: 0;
        top: 0
    }

        #metro-area-wrapper .comp-area-title p {
            border-bottom: 0;
            margin: 0
        }

        #metro-area-wrapper .comp-area-title .header {
            font-size: 20px
        }

        #metro-area-wrapper .comp-area-title .sub-header {
            font-size: 16px;
            font-weight: 400
        }

        #metro-area-wrapper .comp-area-title .hidden {
            opacity: 0;
            font-size: 8px
        }

#collapse-container {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%
}

#collapse-gradient {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: #fff;
    opacity: .9
}

#collapse-button {
    position: absolute;
    top: 100%;
    left: 50%;
    -ms-transform: translate(-50%,-200%);
    transform: translate(-50%,-200%);
    display: inline-block;
    border: 1px solid #000;
    background-color: #fff;
    color: #000;
    font-weight: 600;
    cursor: pointer;
    border-radius: 3px;
    font-family: 'Open Sans',sans-serif
}

    #collapse-button:hover {
        background-color: #000;
        color: #fff
    }

@media only screen and (min-width:1000px) {
    #collapse-button {
        padding: 8px;
        font-size: 14px
    }
}

@media only screen and (min-width:764px) and (max-width:999px) {
    #collapse-button {
        padding: 6px;
        font-size: 14px
    }
}

@media only screen and (max-width:763px) {
    #collapse-button {
        padding: 6px;
        font-size: 12px
    }
}

.axis text {
    font-family: Roboto,sans-serif;
    font-size: 12px;
    fill: #666
}

@media only screen and (max-width:500px) {
    .axis text {
        font-size: 10px
    }
}

.axis path {
    display: none
}

.axis line {
    stroke: #ddd;
    stroke-dasharray: 2 2
}

.axis.label {
    font-family: sans-serif;
    font-size: 14px;
    fill: #000
}

.component-footer {
    font-style: italic;
    font-size: 16px;
    margin: 32px auto
}

    .component-footer p {
        margin: 0
    }

@media only screen and (min-width:1200px) {
    .component-footer {
        width: 1140px
    }
}

@media only screen and (min-width:1000px) and (max-width:1199px) {
    .component-footer {
        width: 990px
    }
}

@media only screen and (min-width:764px) and (max-width:999px) {
    .component-footer {
        width: 95vw
    }
}

@media only screen and (max-width:763px) {
    .component-footer {
        width: 95vw
    }
}