/* General Styling */
h1 {
    display: none;
}

.average-american h3 {
    font-family: 'Muli', sans-serif !important;
}

.average-american h1.slide-header {
    display: block;
    font-family: 'Muli', sans-serif !important;
    font-size: 60px;
    text-transform: inherit;
    font-weight: bold;
}

.average-american p {
    font-family: 'Muli', sans-serif !important;
    font-size: 28px;
    color: #9B9B9B;
    font-weight: bold;
}

#content {
    padding: 0 !important;
    margin: 0 !important;
}

/* SLIDES - General Styling */
@media (min-width: 900px) {
    .average-american h1.slide-header {
        font-size: 30px;
    }
}

@media (min-width: 1250px) {
    .average-american h1.slide-header {
        font-size: 45px;
    }
}

@media (min-width: 1600px) {
    .average-american h1.slide-header {
        font-size: 60px;
    }
}


@media (min-width: 900px) {
    .average-american p {
        font-size: 16px;
    }
}

@media (min-width: 1250px) {
    .average-american p {
        font-size: 22px;
    }
}

@media (min-width: 1600px) {
    .average-american p {
        font-size: 26px;
    }
}

@media (min-width: 990px) {
    div#fullpage {
        height: 100vh;
    }
}




/* Left Side - Text and Pie Chart */
.left-side {
    width: 40%;
    float: left;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    height: 91vh;
    background: white;

}

.text-cont {
    display: flex;
    justify-content: center;
    flex-direction: column;
    text-align: left;
    /*  padding: 0 10%;*/
    padding: 0 15%;
    height: 75%;
}

/* text Source we */
.text-source {
    text-align: right;
    padding: 20px;
    font-family: 'Muli', sans-serif !important;
    color: #9B9B9B;
    font-weight: bold;
}


/* Stats  - Number and Pie Chart */
.stats-cont {
    display: flex;

    height: 25%;
    display: flex;
}

@media (max-width: 1400px) {
    .stats-cont {
        height: 35vh;
    }
}

.pie-cont {
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.pie {
    width: 90px;
    height: 90px;
    color: white;
    font-size: 18px;
}

@media (min-width: 1400px) {
    .pie {
        width: 130px;
        height: 130px;
    }
}


.pie-img {
    width: 130px;
    height: 130px;
    background-size: cover !important;
    position: absolute;

}

@media (max-width: 1400px) {
    .pie-img {
        width: 90px;
        height: 90px;
    }
}


.pie-numb {
    position: absolute;
    display: none;
}



.pie-cont img {
    width: 130px;
}

.pie-cont p {
    color: white;
    font-size: 16px;
    text-align: center;
}

.number-cont {
    display: none;
    justify-content: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 50%;
    font-size: 60px;
}

.number-cont p {
    color: white !important;

    text-shadow: 8px 7px 2px #515151;
}

@media (min-width: 900px) {
    .number-cont p {
        font-size: 30px;
    }
}

@media (min-width: 1250px) {
    .number-cont p {
        font-size: 45px;
    }
}

@media (min-width: 1600px) {
    .number-cont p {
        font-size: 60px;
    }
}




/* Left Image */
.right-side {
    background-size: cover !important;
    height: 91vh;
    ;
    width: 60%;
    float: right;
}


/* Slide 01 */
.slide_01a .right-side {
    background: url("../../averageAmerican-2020/bg%20photos/intro.jpg");
}

.slide_01a .slide-header {
    color: #E7A026;
}

@media (max-width:991px) {
    .average-mobile .slide_01a .left-side {
        background: rgba(39, 39, 39, 0.48);
    }
}

/* Slide 02 */
.slide_02a .right-side {
    background: url("../../averageAmerican-2020/bg%20photos/housing.jpg");
}

.slide_02a .slide-header {
    color: #6293bd;
}

.slide_02a .number-cont {
    background: #6293bd
}

.slide_02a .pie-cont {
    background: #545E01
}

.slide_02a .pie-img {
    background: url("https://fmg-websites-custom.s3.amazonaws.com/interactives/averageAmerican-2024/icons/Pies/housing.png");
}

@media (max-width:991px) {
    .average-mobile .slide_02a .left-side {
        background: rgba(56, 45, 13, 0.67);
    }
}

/* Slide 03 */
.slide_03a .right-side {
    background: url("../../averageAmerican-2020/bg%20photos/trans.jpg");
}

.slide_03a .slide-header {
    color: #AABC2E;
}

.slide_03a .number-cont {
    background: #AABC2E
}

.slide_03a .pie-cont {
    background: #2c7557
}

.slide_03a .pie-img {
    background: url("https://fmg-websites-custom.s3.amazonaws.com/interactives/averageAmerican-2024/icons/Pies/transportation.png");
}

@media (max-width:991px) {
    .average-mobile .slide_03a .left-side {
        background: rgba(87, 97, 0, 0.52);
    }
}

/* Slide 04 */
.slide_04a .right-side {
    background: url("../../averageAmerican-2020/bg%20photos/food.jpg");
}

 .slide_04a .slide-header {
    color: #C54143;
}

.slide_04a .number-cont {
    background: #C54143
}

.slide_04a .pie-cont {
    background: #a82924
}

.slide_04a .pie-img {
    background: url("https://fmg-websites-custom.s3.amazonaws.com/interactives/averageAmerican-2024/icons/Pies/food.png");
}

@media (max-width:991px) {
    .average-mobile .slide_04a .left-side {
        background: rgba(181, 47, 46, 0.55);
    }
}

/* Slide 05 */
.slide_05a .right-side {
    background: url("../../averageAmerican-2020/bg%20photos/insur.jpg");
}

.slide_05a .slide-header {
    color: #F48B62;
}

.slide_05a .number-cont {
    background: #F48B62
}

.slide_05a .pie-cont {
    background: #007679
}

.slide_05a .pie-img {
    background: url("https://fmg-websites-custom.s3.amazonaws.com/interactives/averageAmerican-2024/icons/Pies/insurance.png");
}

@media (max-width:991px) {
    .average-mobile .slide_05a .left-side {
        background: rgba(0, 117, 121, 0.6);
    }
}

/* Slide 06 */
.slide_06a .right-side {
    background: url("../../averageAmerican-2020/bg%20photos/healthcare.jpg");
}

.slide_06a .slide-header {
    color: #6293bd;
}

.slide_06a .number-cont {
    background: #8D8D8D
}

.slide_06a .pie-cont {
    background: #3e657d
}

.slide_06a .pie-img {
    background: url("https://fmg-websites-custom.s3.amazonaws.com/interactives/averageAmerican-2024/icons/Pies/healthcare.png");
}

@media (max-width:991px) {
    .average-mobile .slide_06a .left-side {
        background: rgba(128, 97, 0, 0.65);
    }
}

/* Slide 07 */
.slide_07a .right-side {
    background: url("../../averageAmerican-2020/bg%20photos/entertain.jpg");
}

.slide_07a .slide-header {
    color: #85B38F;
}

.slide_07a .number-cont {
    background: #85B38F
}

.slide_07a .pie-cont {
    background: #6a7539
}

.slide_07a .pie-img {
    background: url("https://fmg-websites-custom.s3.amazonaws.com/interactives/averageAmerican-2024/icons/Pies/entertainment.png");
}

@media (max-width:991px) {
    .average-mobile .slide_07a .left-side {
        background: rgba(51, 84, 58, 0.8);
    }
}

/* Slide 08 */
.slide_08a .right-side {
    background: url("../../averageAmerican-2020/bg%20photos/cash.jpg");
}

.slide_08a .slide-header {
    color: #F3233B;
}

.slide_08a .number-cont {
    background: #52959C
}

.slide_08a .pie-cont {
    background: #92271f
}

.slide_08a .pie-img {
    background: url("https://fmg-websites-custom.s3.amazonaws.com/interactives/averageAmerican-2024/icons/Pies/contributions.png");
}

@media (max-width:991px) {
    .average-mobile .slide_08a .left-side {
        background: rgba(230, 37, 53, 0.43);
    }
}

/* Slide 09 */
/*
.slide_09a .right-side  {background: url("../../averageAmerican-2020/bg%20photos/misc.jpg");}
.slide_09a .slide-header {color: #022942; }
.slide_09a .number-cont { background: #022942 }
.slide_09a .pie-cont { background: #984112 }
.slide_09a .pie-img { background: url("https://fmg-websites-custom.s3.amazonaws.com/interactives/averageAmerican-2020/icons/Pies/5_3.png"); }
@media (max-width:991px) {
  .average-mobile .slide_09a  .left-side {
    background: rgba(0, 42, 67, 0.73);
  }
}
*/


/* Slide 09 */
.slide_09a .right-side {
    background: url("../../averageAmerican-2020/bg%20photos/apparel.jpg");
}

.slide_09a .slide-header {
    color: #FB7D9B;
}

.slide_09a .number-cont {
    background: #6FA994
}

.slide_09a .pie-cont {
    background: #617992
}

.slide_09a .pie-img {
    background: url("https://fmg-websites-custom.s3.amazonaws.com/interactives/averageAmerican-2024/icons/Pies/apparel.png");
}

@media (max-width:991px) {
    .average-mobile .slide_09a .left-side {
        background: rgba(150, 46, 69, 0.65);
    }
}





.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
    background: #FFC100 !important;
}

.nav-pills > li.active > a,
.nav-pills > li.active > a:focus,
.nav-pills > li.active > a:hover {
    background: #FFC100 !important;
    color: #2B281D !important;
    font-weight: bold;
    border-radius: 0 !important;
}

.nav-pills > li {
    border: 2px solid #FFC100 !important;
    color: #FFC100 !important;
    font-weight: bold;
    margin-right: 0px;
}

.nav-pills .nav-link {
    color: #FFC100 !important;
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
    color: #2B281D !important;
}

.nav > li > a:focus,
.nav > li > a:hover {
    background: #FFC100 !important;
    color: #2B281D !important;
}





/*  NAVIGATION */

.carousel-indicators {
    width: 100% !important;
    bottom: 0 !important;
    left: 0 !important;
    margin: 0 !important;
    background: #5b5b5b !important;
    height: 9vh !important;
    padding: 0 30px !important;
    position: absolute;
    min-height: 70px;


}

@media (max-width: 1400px) {
    .carousel-indicators {
        max-height: 9vh;
        min-height: 9vh;
    }
}

.carousel-indicators li {
    color: #fff;
    position: relative;
    top: 30%;
    transform: translateY(-60%);
    padding-right: 4% !important;
    padding-left: 4% !important;
    text-align: right !important;
    text-indent: -999px;
    border: none !important;
}

.carousel-indicators li:first-of-type {
    top: 35%;
}

.carousel-indicators li img {
    width: 47px;
    opacity: .25;
    max-width: 47px !important;
}

@media (max-width: 1400px) {
    .carousel-indicators li img {
        width: 30px;
        max-width: 30px !important;
    }
}

@media (max-width: 1600px) {
    .carousel-indicators li img {
        width: 35px;
        max-width: 35px !important;
    }
}


.carousel-indicators li img:hover {
    opacity: 1;
}

.carousel-indicators li.active img {
    opacity: 1 !important;
}

.carousel-indicators li:hover {
    background: none !important;
}

.carousel-indicators li.active {
    background: none !important;
}

.carousel-indicators li.active a {
    color: white !important;
}

.carousel-indicators li:hover a {
    color: white !important;
}

.carousel-indicators li a {
    font-family: 'Muli', sans-serif !important;
    color: #8a8a8a;
    text-transform: inherit;
    font-size: 22px;
}

.carousel-arrows {
    padding: 10px 5px;
    position: absolute;
    top: 35%;
    width: 100%;
    z-index: 10;
}

@media (max-width: 990px) {
    .carousel-arrows {
        display: none
    }
}

span.cr-chevron.chevron-right {
    float: right;
    background: rgba(121, 121, 121, 0.4);
    color: white;
    padding: 30px 18px 30px 10px !important;
}

span.cr-chevron.chevron-left {
    float: left;
    padding-right: 10px;
    background: rgba(121, 121, 121, 0.4);
    color: white;
    padding: 30px 12px 35px 12px !important;
}

.carousel-arrows a {
    font-size: 20px;
    font-weight: 900;
    padding: 0 10px;
    color: #cccccc;
}

.carousel-arrows a span {
    text-align: center;
}

.cr-chevron::before {
    border-style: solid;
    border-width: 6px 6px 0 0;
    content: '';
    display: inline-block;
    height: 25px;
    position: relative;
    transform: rotate(-45deg);
    vertical-align: middle;
    width: 25px;
}

@media (min-width: 1600px) {
    .cr-chevron::before {
        border-width: 6px 6px 0 0;
        height: 25px;
        width: 25px;
    }
}

/* Arrows */
.cr-chevron:hover {
    background: rgba(121, 121, 121, 0.9) !important;
    /*  background: #ffc100!important;*/
}

.cr-chevron.chevron-right:before {
    left: 0;
    transform: rotate(45deg);
}

.cr-chevron.chevron-left:before {
    left: 0.25em;
    transform: rotate(-135deg);
}





.cr-item {
    height: 100vh;
}

.cr-desktop {
    display: block;
}

.cr-mobile {
    display: none;
}

.landscape_notice {
    display: none;
}



/*=============================*/
/*=============================*/
/*==== Mobile ======*/
/*=============================*/
/*=============================*/

@media (max-width:990px) {
    .average-desktop {
        display: none;
    }
}

@media (min-width:990px) {
    .average-mobile {
        display: none;
    }
}



/*=============================*/
/*=============================*/
/*==== RESPONSIVE STYLES ======*/
/*=============================*/
/*=============================*/


@media (max-width:991px) {
    .average-mobile .left-side {
        width: 100%;
        height: 100vh;
        background: rgba(39, 39, 39, 0.48);
    }

    .average-mobile h1,
    .average-mobile p,
    .average-mobile div {
        color: white !important;
    }

    .average-mobile .right-side {
        height: 100vh;
        width: 100%;
        float: none;
    }

    .mobile_title {
        padding: 5% 2%;
    }

    /* FOOTER FIX */
    footer .note {
        float: none;
    }

    .subpage footer aside {
        margin-left: 0;
    }

    footer .container {
        width: 100%;
    }

    .landscape_notice {
        display: none !important;
    }
}

@media (max-width: 700px) {
    .average-mobile h1 {
        font-size: 34px !important;
    }

    .average-mobile p {
        font-size: 20px;
    }

    .average-mobile div {
        font-size: 12px;
    }

    .average-mobile .pie-cont img {
        width: 90px;
    }

    .average-mobile .pie-cont p {
        font-size: 16px;
        text-align: center;
    }

    .pie {
        width: 90px;
        height: 90px;
    }

    .average-mobile .number-cont p {
        font-size: 28px;
    }
}

@media (min-width: 1400px) {
    .pie-cont p {
        padding-top: 40px;
    }

    .pie {
        width: 130px;
        height: 100px;
    }
}

.slide_01a .text-cont {
    height: 100%;
}

@media screen and (max-width: 480px) {
    .cr-mobile {
        display: block;
    }

    .landscape_notice {
        display: block !important;
        background: rgba(0, 0, 0, 0.90) !important;
        height: 120% !important;
        width: 100% !important;
        padding: 35vh 20px !important;
        margin: 0 !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        z-index: 3000 !important;
    }

    .landscape_notice h2 {
        color: #fff;
        text-align: center;
    }

    .average-mobile p {
        font-size: 17px;
    }

    /*    .average-mobile .left-side {height: 130vh;}*/


    /*============*/
    /*============*/
    /* ANIMATIONS */
    /*============*/
    /*============*/

    .slide_title {
        animation: sweep-in-right 1.5s;
        animation-timing-function: ease;
        animation-iteration-count: 1;
        animation-delay: .5s;
        animation-fill-mode: forwards;
        margin-left: 150%;
    }

    .sweep-in-2 {
        animation: sweep-in-right 3s;
        animation-timing-function: ease;
        animation-iteration-count: 1;
        animation-delay: 1s;
    }

    .sweep-in-3 {
        animation: sweep-in-right 3s;
        animation-timing-function: ease;
        animation-iteration-count: 1;
        animation-delay: 1s;
    }

    .fade-in {
        animation: fade-in 5s;
        animation-timing-function: ease;
        animation-iteration-count: 1;
        /*    animation-delay: 1s;*/
        animation-fill-mode: forwards;
    }

    #impt-bullet-1 {
        animation: color-change 1s;
        animation-timing-function: ease;
        animation-iteration-count: 1;
        animation-delay: 3s;
        animation-fill-mode: forwards;
    }

    #impt-bullet-2 {
        animation: color-change 1s;
        animation-timing-function: ease;
        animation-iteration-count: 1;
        animation-delay: 4s;
        animation-fill-mode: forwards;
    }

    #impt-bullet-3 {
        animation: color-change 1s;
        animation-timing-function: ease;
        animation-iteration-count: 1;
        animation-delay: 5s;
        animation-fill-mode: forwards;
    }

    .title-fade-in {
        animation: title-fade-in 3s;
        animation-timing-function: ease;
        animation-iteration-count: 1;
        animation-delay: 1s;
        animation-fill-mode: forwards;
    }

    .title-slide-overlay {
        position: absolute;
        width: 100% !important;
        height: 100%;
        top: 0;
    }

    @keyframes sweep-in-right {
        from {
            margin-left: 150%;
        }

        to {
            margin-left: 0;
        }
    }

    @keyframes color-change {
        from {
            color: #fff;
        }

        to {
            color: #FFC100;
        }
    }

    @keyframes fade-in {
        from {
            opacity: 0;
        }

        to {
            opacity: 1.0;
        }
    }

    @keyframes title-fade-in {
        from {
            width: 100%;
        }

        to {
            width: 0;
        }
    }

    /*=======*/
    /*=======*/
    /* FIXES */
    /*=======*/
    /*=======*/

    /* Dev Theme */
    .o-container.c-customsection__container {
        padding: 0;
    }

    /* Cardiff */
    #subContent {
        display: none;
    }

    #content {
        margin: 0;
        padding: 0;
    }

    #content .container {
        width: 100%;
    }

    footer .container {
        width: 90%;
    }

    .body-container {
        overflow: hidden;
        width: 100%;
    }

    h1.c-matter__title {
        display: none;
    }

    article > h1:first-child {
        display: none;
    }

    article > h1:first-child {
        display: none;
    }

    article > .container > h1 {
        display: none;
    }

    .addthis_toolbox {
        margin: 20px;
    }

    /* Alta fix   */
    .subpage .body-container {
        min-height: 0;
    }