/* INFOGRAPHIC STYLES */

.module_article section { margin-bottom: 2em; }
.module_article ul, .module_article p { color:#808080; }
section:after { display: table; clear: both; content: ""; }
.resnew .module_hero .titles { bottom: 0; }
.resnew .module_hero h1 { font: normal 500 1.75em 'IBM Plex Sans'; margin-bottom: 0; padding: 30px 35px; color: #ffffff; }
.resnew .module_hero h2 { margin-left: 35px; }
.resnew .module_hero #titlefade { display: none; }
.resnew .module_hero .titles { font-size: 1.85em; width: 85%; margin-left: 0; padding: 0.85em 1.15em 0 1.15em; }
.column_two { display: none; }
.container.resnew { max-width: 1200px; padding-top:0; }
.resnew .module_article { margin-left:0; }
.resnew .column_one { width: 100%; margin-right: 0; position: relative; z-index: 100; }
.socials { position: absolute; z-index: 100; top: -70px; right: 30px; }
.socials .sociallabel { color:#fff; }

.priority-graphics {
    width: 90%;
    margin: 0 auto;
}

.rev-cycle h3 {
    margin: 20px 0;
    font-size: 1.5em;
    font-weight: 400;
    line-height: 1.35em;
}

.rev-cycle h2 {
    font-size: 2em!important;
    margin-top: 40px;
}

.rev-cycle section {
    position: relative;
    padding-top: 10px;
}

.rev-cycle .gray-bg {
    background-color: #f2f2f2;
    padding-top: 0;
    margin-top: 40px;
}

.rev-cycle .blue-bg {
    background-color: #71bde0;
    padding-top: 0;
    margin-top: 40px;
    padding: 40px 20px;
}

.rev-cycle .blue-bg p {
    color: #fff;
}

.rev-cycle section.unprepared::before, .rev-cycle section.blue-bg::before {
    display: none;
}

.rev-cycle .gray-bg h3 {
    color: #666666!important;
}

.rev-cycle .graphics-container {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: center;
}

.rev-cycle .graphics-container.challenges {
    justify-content: space-around;
}

.rev-cycle .three-priorities {
    width: 55%;
    margin-bottom: 20px;
}

@media screen and (min-width: 800px) {

    .rev-cycle .graphics-container {
        flex-wrap: nowrap;
        justify-content: space-between;
    }

    .rev-cycle .three-priorities {
        width: 20%;
        margin-bottom: 0;
    }

}

.rev-cycle .three-priorities img {
    width: 100%;
    height: auto;
}

.rev-cycle .unprepared {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.rev-cycle .unprepared.gray-bg h3, .rev-cycle .unprepared.gray-bg li {
    color: #2a3a51!important;
}

@media screen and (min-width: 800px) {

    .rev-cycle .tile-row {
        display: flex;
        width: 100%;
        align-items: center;
        flex: 1 1 100%;
    }

    .rev-cycle .quarter-tile {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        width: 50%;
        flex: 1 1 50%;
        box-sizing: border-box;
    }

}

.rev-cycle .quarter-tile.text h3, .rev-cycle .quarter-tile.text ol, .rev-cycle .quarter-tile.text ul {
    margin-left: 20px;
    margin-right: 20px;
}


.rev-cycle .quarter-tile img {
    width: 100%;
    height: 100%!important;
}

.rev-cycle .what-is {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex: 1 1 100%;
}

.rev-cycle .what-is-container {
    width: 90%;
    flex: 0 0 90%;
}

.rev-cycle .what-is img {
    display: none;
}

@media screen and (min-width: 800px) {

    .rev-cycle .what-is-container {
        width: 60%;
        flex: 0 0 60%;
    }

    .rev-cycle .what-is img {
        display: block;
        width: 25%;
        height: auto;
    }

}

.rev-cycle .challenge {
    background: url('/~/media/Resource Media Content/Healthcare/infographic-improve-physician-reimbursement/challenge-bg.jpg');
    background-size: cover;
    background-position: center;
    padding-top: 40px;
    padding-bottom: 40px;
}

.rev-cycle .challenge-container {
    padding: 0 20px 10px;
    color: #ffffff!important;
}

.rev-cycle .challenge-container h2 {
    margin-top: 0;
    color: #ffffff;
}

.rev-cycle .challenge-container p {
    color: #ffffff;
}

.rev-cycle .three-challenges {
    width: 85%;
    margin-bottom: 40px;
}

@media screen and (min-width: 800px) {

    .rev-cycle .three-challenges {
        width: 25%;
        margin-bottom: 0;
    }

}

.rev-cycle .three-challenges img {
    width: 100%;
    height: auto;
}

.rev-cycle .graphics-container.benefits {
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.rev-cycle .five-benefits {
    width: 90%;
    margin: 0 auto 20px;
}

@media screen and (min-width: 800px) {

    .rev-cycle .five-benefits {
        width: 30%;
        margin: 0 1.5% 5px;
    }

}

.rev-cycle .five-benefits img {
    width: 100%;
    height: auto;
}

.rev-cycle .benefits-graphic {
    background: url('/~/media/Resource Media Content/Healthcare/infographic-improve-physician-reimbursement/challenge-bg.jpg');
    background-size: cover;
    background-position: center;
    padding-top: 40px;
    padding-bottom: 40px;
}

.rev-cycle .graphics-container.benefits-graphics {
    display: flex;
    justify-content: space-around;
    width: 100%;
}

.rev-cycle .benefits-graphic::before {
    display: none;
}

.rev-cycle .three-benefits-graphics {
    width: 85%;
}

@media screen and (min-width: 800px) {

    .rev-cycle .three-benefits-graphics {
        width: 25%;
    }

}

.rev-cycle .benefits-graphics img {
    width: 100%;
    height: auto;
}

.rev-cycle .benefits-graphic p {
    color: #ffffff;
    margin-left: 40px;
}

.rev-cycle .step-row {
    display: flex;
    align-items: center;
    flex: 1 1 100%;
    justify-content: flex-start;
    background-color: #f2f2f2;
    border-bottom: 1px solid #e5e5e5;
}

.rev-cycle .step-row:last-of-type {
    border-bottom: 0;
}

.rev-cycle .step-row:nth-child(even) {
    background-color: #e5e5e5;
}

.rev-cycle .step-number {
    background-color: #ffffff;
    display: block;
    width: 75px;
    flex: 1 1 75px;
}

.rev-cycle .step-number img {
    display: block;
    width: 75px;
    height: 150px!important;
    padding: 0 20px;
}

.rev-cycle .step-content {
    color: #00558C;
    font-size: 1.25rem;
    padding: 0 20px 0 40px;
    flex: 1 1 90%;
}

.rev-cycle .takeaways {
    padding: 20px;
}

.rev-cycle .takeaway-holder {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
}

.rev-cycle .takeaway {
    display: block;
    width: 78%;
    padding: 0 2%;
}

@media screen and (min-width: 800px) {

    .rev-cycle .takeaway-holder {
        flex-wrap: nowrap;
    }

    .rev-cycle .takeaway {
        display: block;
        width: 28%;
        padding: 0 2%;
        border-left: 1px solid #e5e5e5;
    }

}

.rev-cycle .takeaway-one {
    color: #71bde0!important;
}

.rev-cycle .takeaway-two {
    color: #e9b648!important;
}

.rev-cycle .takeaway-three {
    color: #005584!important;
}

.rev-cycle .takeaway:first-of-type {
    border-left: 0;
}

.rev-cycle .takeaway-holder h4 {
    font-size: 1.25rem;
    font-weight: bold;
}

/* ANIMATION STYLES */

.fade-in, .fade-left, .fade-right {
    opacity: 0;
    left: 0;
    position: relative;
    transition-duration: 1s;
    transition-property: opacity, left;
}

.fade-left {
    left: -10px;
}

.fade-right {
    left: 10px;
}

.fade-in-2, .fade-left-2 {
    transition-delay: 0.5s;
}

.fade-in-3, .fade-left-3 {
    transition-delay: 1s;
}

.fade-in-4, .fade-left-4 {
    transition-delay: 1.5s;
}

.fade-in-5, .fade-left-5 {
    transition-delay: 2s;
}

.fade-in-5 {
    transition-delay: 2.5s;
}

.fade-in.visible, .fade-left.visible, .fade-right.visible {
    opacity: 1;
    left: 0;
}