/* -- SITE BASE STYLES -- */
body {
    color: #444444;
    background: #ececec;
    font-size: 14px;
    line-height: 130%;
    font-weight: 300;
    font-family: benton-sans, sans-serif;
    margin: 0;
}

h1, h2, h3, h4, h5, h6 {
    line-height: 120%;
}

img {
    display: block;
    width: 100%;
    max-width: 100%;
}

a {
    text-decoration: none;
}

hr {
    border: 2px solid #8e5a90;
    margin: 20px 0;
}

i.arrow {
    border: solid #b1b1b1;
    border-width: 0 2px 2px 0;
    display: inline-block;
    width: 8px;
    height: 8px;
}

.arrow.right {
    transform: rotate(-45deg);
}

.arrow.left {
    transform: rotate(135deg);
}

.nav {
    background: #ffffff;
    z-index: 999;
}

.indicator {
    display: flex;
    text-align: center;
    padding: 20px;
}

.progress {
    font-weight: 600;
    color: #b3b3b3;
    margin: auto;
    margin-right: 0;
}

.progress span {
    width: 1.2em;
    height: 1.3em;
    padding: .2em;
    padding-bottom: .1em;
    display: inline-block;
    color: #fff;
    background: #45c4e6;
    border-radius: 20px;
}

.progress-bar {
    width: 100%;
    height: 5px;
    background: #dedede;
    box-shadow: inset 0 0 2px #00000021;
}

.site-logo {
    margin: auto;
    margin-left: 0;
}

.site-logo img {
    max-height: 70px;
    width: auto;
}

.btn-primary {
    color: #ffffff;
    display: block;
    text-align: center;
    text-transform: uppercase;
    font-weight: 600;
    border-radius: 8px;
    background-color: #0964b5;
    padding: 1.25em 2em;
    font-size: 1.25em;
    margin: auto;
    margin-top: 30px;
}

.btn-primary:hover {
    background-color: #ff0000;
}

.slide-container {
    max-width: 800px;
    margin: 0px auto;
    background: #ffffff;
    margin-bottom: 420px !important;
}

.slide-header {
    position: relative;
    color: #ffffff;
    max-width: 800px;
    height: 70vw;
    display: block;
    background-position: center;
    background-size: cover;
}

.slide-header-rep {
    position: relative;
    color: #ffffff;
    max-width: 800px;
    height: 355px;
    display: block;
    border: 1px solid #000;
    padding: 1.5rem;
    text-align: center;
    color: #000;
    margin: auto;
}

.speechBox {
    width: 90%;
    height: 80px;
    margin: 0 auto;
    border: 1px solid #000;
    border-radius: 10px;
    margin-bottom: 10px;
    padding: 1rem;
    padding-top: 25px;
    text-align: center;
    font-size: 1.5rem;
}

.profileRep {
    width: 158px;
    height: 158px;
    background-image: url(/assets/img/profileRep.png);
    margin: 0 auto;
}


.slide-body {
    position: relative;
    padding: 30px;
    color: #343434;
}

.slide-body h1 {
    font-size: 1.5em;
    line-height: 115%;
    color: #45c4e5;
    margin: 0;
}

.slide-body h2 {
    margin: .25em
}

.slide-body h2 span {
    font-weight: 300;
}

.slide-body-coreg {
    position: relative;
    padding: 30px;
    color: #343434;
}

.slide-body-coreg h1 {
    font-size: 2em;
    color: #0035b2;
    margin: 0;
    font-weight: normal;
}

.slide-body-coreg h2 {
    margin: 0;
    font-size: 1.5em;
    font-weight: normal;
}

.slide-body-coreg h2 span {

}

.benefitNumber {
    width: 100%;
    min-height: 50px;
    text-align: right;
    color: #000;
    font-weight: 300;

}

.acaQues {
    color: #0035b2;
    font-weight: 700;
}

.topATB {
    margin-top: 0px;
    margin-bottom: 30px;
}

.btn-secondary {
    margin: 0 auto;
    margin-top: 10px;
    margin-bottom: 10px;
}

.description {
    background: #f1f1f1;
    padding: 20px;
    border-radius: 10px;
    margin-top: 30px;
}

.description h3 {
    margin: 0;
}

.overlay {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: #00000050;
    position: relative;
}

.program-name {
    font-size: 2.5em;
    position: absolute;
    left: 20px;
    bottom: 20px;
    font-weight: 600;
}

.eligible {
    position: absolute;
    right: 20px;
    top: 20px;
    font-weight: 600;
}

.benefit-id {
    position: absolute;
    left: 20px;
    top: 20px;
    font-weight: 600;
}

.bullets {
    font-weight: 600;
    padding-left: 1.1em;
    margin: 0;
    margin-top: 1em;
}

.bullets li {
    margin-top: .5em;
}

.slide-nav {
    border-top: 7px solid #ececec;
    border-right: none;
    border-left: none;
    border-bottom: 7px solid #ececec;
    text-align: center;
    display: flex;
    background: #ffffff;
}

.slide-nav a {
    color: #4b4b4b;
    font-size: 1.1em;
    font-weight: 600;
    display: block;
    max-width: 50%;
    width: 100%;
    float: left;
    text-transform: uppercase;
    padding: 20px;
}

.slide-nav a:hover {
    color: #123361;
}

.slide-nav a:hover i {
    border-color: #052888;
}

.slide-nav a:first-of-type {
    border-right: 6px solid #ececec;
}

.slide-nav a .arrow.right {
    margin-left: -2px;
}

.slide-nav a .arrow.left {
    margin-right: -2px;
}

.next {
    background-color: #f8c63a;

}

.next span {

}

.orange {
    color: #ff7b00;
}

.next i.arrow {
    border: solid #fff;
    border-width: 0 2px 2px 0;
}

/* -- OFFER WALL STYLES -- */
.offers-container {
    padding: 5%;
}

.offer {
    display: block;
    position: relative;
    max-height: initial;
    overflow: hidden;
    text-decoration: none;
    color: #444;
    background: #ffffff;
    box-shadow: 1px 1px 3px #00000030;
    margin: 2em 0;
    transition: transform .25s ease-in-out;
    border-radius: 20px;
    cursor: pointer;
}

.offer:hover {
    transform: scale(1.01);
}

.offer-header,
.offer-body,
.offer-endcap {
    display: inline-block;
}

.offer-header {
    min-width: 100%;
    max-width: 400px;
    min-height: 50vw;
    background-size: cover;
    display: block;
}

.offer-body {

    max-width: 95%;
    padding: 30px;
}

.offer-body h1 {
    color: #45c4e5;
    margin: 0;
    line-height: 100%;
}

.offer-body h2 {
    font-style: italic;
    margin: 0;
    margin-top: .5em;
    margin-bottom: 1.5em;
    font-size: 1.25em;
}

.offer-body .description {
    background: transparent;
    padding: 0
}

.offer-endcap {
    width: 100%;
    height: initial;
    min-width: 60px;
    display: inline-flex;
    background: #45c4e5;
    border-radius: 0 0 20px 20px;
}

.offer-endcap .icon {
    display: flex;
    margin: auto;
    width: 100%;
    height: 50px;
    margin: 1em;
    border: 1px solid #ffffff8c;
    border-radius: 100px;
    background: #0000000f;
}

.offer-endcap span {
    display: inline-block;
    white-space: nowrap;
    margin: auto;
    margin-left: 2em;
    margin-right: 1em;
    padding-top: .25em;
    color: #ffffff;
    font-weight: 600;
    text-transform: uppercase;
}

.offer-endcap i {
    margin: auto;
    margin-right: 2em;
    border-color: #ffffff;
}

.header {
    color: #fff;
    padding: 5%;
    /* background-color: #45c4e5; */
    background-blend-mode: multiply;
    background-size: cover;
    background-position: center;
    border-bottom: 4px solid #8e5a90;
}



.header h1,
.header p {
    margin: 0;
}

.header h1 {
    margin-bottom: 1em;
}

.continue-block {
    padding: 5%;
    display: block;
    color: #ffffff;
    background: #8e5890;
}

.continue-block .content {
    display: block;
}

.btn-continue {
    color: #45c4e5;
    background-color: #ffffff;
    margin: auto;
    margin-right: 0;
    display: block;
}

.btn-continue:hover {
    color: #ffffff;
    background-color: #45c4e5;
}

/* -- ELEMENT STYLES -- */
.clear-both {
    clear: left;
    clear: right;
}

#finish .slide-nav a {
    max-width: 100%;
    border-right: 0;
}

.footer {
    color: var(--color-white);
    font-size: 14px;
}

.footer .footer-content {
    background: #808080;
    padding: 60px 0 0px 0;
}

#footer {
    margin-top: 200px;
}

.bottomLogo {
    max-width: 200px;
    margin: 0 auto;
    display: block;
    margin-top: -150px;
}

addyText {
    margin-top: 20px;
    margin-bottom: 30px;
}

.center {
    display: block;
    text-align: center;
    margin: auto;
    margin-top: 50px;
}

.card {
    margin-bottom: 10px;
}

.card-title {
    font-weight: 400;
}

.black {
    color: #000 !important;
}

.red {
    color: #fd0000;

}

.blue {
    color: #0964b5;
    font-weight: bold;
}

.boldBlack {
    color: #000;
    font-weight: bold;
}

h5 {
    font-size: 1em;
}

.fa-solid {
    font-size: 1.3em;
    float: right;
    margin: 10px;
    color: #0964b5;
}


@media (min-width: 768px) {
    .slide-container {
        margin: 40px auto;
        /* --  border-radius: 20px; --*/
        box-shadow: 1px 1px 3px #0000003b;
    }

    .slide-image {
        border-radius: 20px 20px 0 0;
    }

    .slide-body {
        padding: 20px;
    }

    .slide-nav {
        border-top: 7px solid #ececec;
        /*--	border-right: 7px solid #ececec;
            border-left: 7px solid #ececec;
            border-bottom: 7px solid #ececec;
            border-radius: 0 0 20px 20px; --*/
    }

    .slide-header {
        height: 450px;
        /* --  border-radius: 20px 20px 0 0; --*/
    }
}

.modal-footer {
    background-color: #0a53be;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

.modal-body p {
    font-size: 1.4em;
    line-height: 1.4em;
}

.modal-body hr {
    border: 1px solid #0a53be;
}

.modal-content {
    border-radius: 30px;
    border: 20px solid #ffffff24;
}

@media (min-width: 996px) {
    .offer {
        display: flex;
        max-height: 250px;
    }

    .offer-header {
        min-width: 400px;
        max-width: 400px;
        min-height: 250px;
    }

    .offer-body {
        width: 100%;
        max-width: 100%;
    }

    .offer-endcap {
        width: 60px;
        height: 60px;
        min-width: 60px;
        height: initial;
        border-radius: 0 20px 20px 0;
    }

    .offer-endcap .icon {
        display: flex;
        margin: auto;
        width: 40px;
        height: 40px;
    }

    .offer-endcap span {
        display: none;
    }

    .offer-endcap i {
        margin-right: 42%;
    }

    .continue-block {
        display: flex;
    }

    .continue-block .content {
        display: inline-block;
    }

    .btn-continue {
        margin: auto;
        margin-right: 0;
        display: inline-block;
    }

}

.fa-sharp, .fa-brands {
    float: left;
    font-size: 3rem;
    color: #0964b5;
}

.disclaimerBottom {
    padding: 1.5rem;
}

@media (max-width: 800px) {
    .slide-container {
        margin-bottom: 0px !important;
    }

    .speechBox {
        font-size: 1em;
    }

    .indicator {
        margin: 0 auto;
    }

    .fixedButton {
        width: 100%;
        height: auto;
        position: fixed;
        left: 0px;
        bottom: 0px;
        z-index: 9999;
        border-radius: 0;
    }

    .fa-beat-fade {
        -webkit-animation-name: fa-beat-fade;
        animation-name: fa-beat-fade;
        -webkit-animation-iteration-count: var(--fa-animation-iteration-count, infinite);
        animation-iteration-count: var(--fa-animation-iteration-count, infinite);
        -webkit-animation-timing-function: var(--fa-animation-timing, cubic-bezier(.4, 0, .6, 1));
        animation-timing-function: var(--fa-animation-timing, cubic-bezier(.4, 0, .6, 1));
    }

    .offer-endcap span {
        margin: auto;

    }

    .site-logo img {
        max-height: 50px;
        width: auto;
    }

    .site-logo {
        margin: 0 auto;
    }

    .prev {
        /* margin-top:13px; */
    }

}

.center {
    text-align: center;
}