.at-payoff {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 60vh;
    background: transparent linear-gradient(to bottom, #00a7eb 0%, #072e65 100%) no-repeat center center;
    background-size: cover;
}

/*
 * Background position
 */

/** Horizontal */
.at-payoff--bgPosXLeft {
    background-position-x: left;
}

.at-payoff--bgPosXRight {
    background-position-x: right;
}

/** Vertical */
.at-payoff--bgPosYTop {
    background-position-y: top;
}

.at-payoff--bgPosYBottom {
    background-position-y: bottom;
}

/*
 * Text alignment vertical
 */

.at-payoff--textAlignVerTop {
    align-items: flex-start;
}

.at-payoff--textAlignVerBottom {
    align-items: flex-end;
}

/**
 * Parallax effect
 */

.at-payoff--fixedBackground {
    background-attachment: fixed;
}

.touchEnabled .at-payoff--fixedBackground {
    background-attachment: scroll;
}

/*
 * Inner container
 */

.at-payoff__inner {
    position: relative;
    z-index: 1;
    text-align: left;
}

.at-payoff__inner--textAlignHorRight {
    text-align: right;
}

.at-payoff__inner--textAlignHorCenter {
    text-align: center;
}

/**
 * Title link
 */

.at-payoff__titleLink {
    display: inline-block;
}

.at-payoff__titleLink:hover .at-payoff__title {
    -webkit-transform: scale(1.08);
    -ms-transform: scale(1.08);
    transform: scale(1.08);
}

.at-payoff__titleLink:active .at-payoff__title {
    -webkit-transform: scale(.99);
    -ms-transform: scale(.99);
    transform: scale(.99);
}

/**
 * Title
 */

.at-payoff__title {
    position: relative !important;
    display: inline-block !important;
    left: auto !important;
    margin: 1em 0;
    padding: 0;
    color: #fff;
    font-size: 3em !important;
    font-family: "AlwynNewRounded-Medium", Tahoma, Geneva, sans-serif;
    transition: transform .3s ease-out;
    background-color: transparent;
}

.at-payoff__title--hasBackground {
    font-size: 7.5vw !important;
    background-color: #fff;
}

.at-payoff__inner--textAlignHorRight .at-payoff__title--hasBackground {
    text-align: right;
}

.at-payoff__inner--textAlignHorCenter .at-payoff__title--hasBackground {
    text-align: center;
    word-break: break-word;
}

@media (min-width: 433px) {
    .at-payoff__title--hasBackground {
        font-size: 2.7em !important;
    }
}

.body--singleSiteCU .at-payoff__title--showPlusIcon::before {
    content: "";
    position: absolute;
    top: -16px;
    left: -16px;
    display: block;
    width: 33px;
    height: 33px;
    background: transparent url('../../img/plusInCircle.svg') no-repeat 0 0;
}

.at-payoff__title--hasBackground span {
    display: block !important;
    padding: .4em .6em .3em;
    color: #00a7eb;
    background-color: #fff;
}

.body--singleSiteCU .at-payoff__title--hasBackground span {
    background: -webkit-gradient(linear, left top, right top, from(#00a7eb), to(#1f2e61));
    background: -webkit-linear-gradient(left, #00a7eb 0%, #1f2e61 100%);
    background: -o-linear-gradient(left, #00a7eb 0%, #1f2e61 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.body--combiSiteSGP-CU .at-payoff__title--hasBackground span,
.body--combiSiteCU-SGP .at-payoff__title--hasBackground span {
    color: #084686;
}
