.acptoggletext {
    letter-spacing: 1px
}

.acp-banner-text div {
    margin-right: .75rem
}

@media (min-width:375px) {
    .acp-banner-text {
        flex-basis: 55%
    }

    .acptoggleposition {
        flex-basis: 45%
    }
}

@media (min-width:1024px) {
    .acp-banner-text {
        flex-basis: 75%
    }

    .acptoggleposition {
        flex-basis: 25%
    }
}

.reusable-toggle-switch .label {
    grid-template-areas: "checkbox label"
}

.reusable-toggle-switch .slider {
    grid-area: checkbox;
    transition: all .2s ease-in
}

.reusable-toggle-switch .slider:before {
    --tw-bg-opacity: 1;
    background-color: #62626c;
    border-radius: 16px;
    content: "";
    height: 1.5rem;
    position: relative;
    width: 100%
}

.reusable-toggle-switch .label.loading {
    cursor: wait;
    pointer-events: none
}

.reusable-toggle-switch .label.loading .slider:before {
    opacity: .3
}

.reusable-toggle-switch .slider:after {
    --tw-bg-opacity: 1;
    --shadow-color: rgba(95, 95, 95, .51);
    background-color: rgb(255 255 255/var(--tw-bg-opacity));
    border-radius: 50%;
    content: "";
    height: 1.25rem;
    pointer-events: none;
    position: absolute;
    text-align: center;
    transition-duration: .2s;
    transition-property: all;
    transition-timing-function: cubic-bezier(.4, 0, 1, 1);
    width: 1.25rem;
    z-index: 10
}

.reusable-toggle-switch .loading-spinner,
.reusable-toggle-switch .slider:after {
    transform: translateX(.125rem)
}

.reusable-toggle-switch .input:checked+.label .slider:before {
    background-color: #6138f5
}

.reusable-toggle-switch .input:not(:disabled)+.label:hover .slider:before {
    background-color: #35353b
}

.reusable-toggle-switch .input:not(:disabled):checked+.label:hover .slider:before {
    background-color: #3a0092
}

.reusable-toggle-switch .input:focus+.label .slider {
    box-shadow: 0 0 0 1px #fff, 0 0 0 2px #000
}

.reusable-toggle-switch .input:checked:focus+.label .slider {
    box-shadow: 0 0 0 1px #fff, 0 0 0 2px #6138f5
}

.reusable-toggle-switch .loading-spinner {
    height: 1.25rem;
    width: 1.25rem
}

.reusable-toggle-switch .input:checked+.label .loading-spinner,
.reusable-toggle-switch .input:checked+.label .slider:after {
    transform: translateX(26px)
}

.reusable-toggle-switch .input:checked+.label .loading-spinner {
    color: #6138f5
}

.reusable-toggle-switch .input:disabled+.label {
    cursor: not-allowed;
    opacity: .3
}

.reusable-toggle-switch .spinner {
    --offset: 113
}

.reusable-toggle-switch .spinner-svg {
    animation: spin 1.75s linear 0s infinite normal none running
}

.reusable-toggle-switch .spinner-circle {
    fill: transparent;
    stroke: currentcolor;
    stroke-linecap: round;
    animation: spinner 3.5s linear 0s infinite normal none running;
    transform: rotate(-120deg);
    transform-origin: 50% 50%
}

@keyframes spinner {
    0% {
        stroke-dashoffset: var(--offset)
    }

    to {
        stroke-dashoffset: 0
    }
}

a.line-height-normal {
    line-height: normal
}

.x-page__footer .x-landing-page__container,
.x-page__footer .x-landing-page__container>.x-flex-row {
    align-items: center;
    justify-content: center;
    margin: 0
}

.activeAdd-mb-8 {
    margin-bottom: 2rem !important
}

body .x-preloader--global {
    align-items: center;
    bottom: 0;
    display: flex;
    justify-content: center;
    left: 0;
    max-width: 100%;
    position: fixed;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 100
}

body .x-preloader--global.x-background-opaque--black {
    background-color: rgba(0, 0, 0, .9);
    color: #fff
}

body .x-preloader--global.x-background-opaque--urban {
    background-color: rgba(5, 18, 25, .8);
    color: #fff
}

.x-preloader {
    padding: 3rem 1.25rem;
    text-align: center
}

.x-wide-loader>.x-preloader {
    padding: 5rem 0
}

@media only screen and (min-width:64rem) {
    .x-wide-loader>.x-preloader {
        padding: 12.5rem 0
    }
}

.x-preloader__dots {
    box-sizing: border-box;
    display: none;
    font-size: 0;
    margin: 0 auto;
    min-height: 1.375rem;
    padding: 0;
    text-align: center;
    width: 6.25rem
}

.x-preloader__dots._show {
    display: block
}

.x-preloader__dots-enclosed {
    background: rgba(93, 93, 93, .5);
    border-radius: 50%;
    display: block;
    height: 6.25rem;
    padding: 2.75rem 0 0;
    width: 6.25rem
}

.x-preloader__dots>div {
    background-color: #646a70;
    border-radius: 100%;
    display: inline-block;
    height: .813rem;
    margin: 0 0 0 .813rem;
    opacity: .7;
    transform: scale(1);
    width: .813rem
}

.x-preloader__dots>div:first-child {
    margin-left: 0
}

.x-preloader__dots.x-color--white>div {
    background-color: #fff
}

.x-preloader__dots .dot-l {
    animation: pulse 1.1s ease-in-out .1s infinite
}

.x-preloader__dots .dot-c {
    animation: pulse 1.1s ease-in-out .3s infinite
}

.x-preloader__dots .dot-r {
    animation: pulse 1.1s ease-in-out .5s infinite
}

@keyframes fadeIn {
    to {
        opacity: 1
    }
}

.fade-in-opacity {
    animation: fadeIn .1s ease-in-out forwards;
    animation-delay: 1s
}

:root {
    --patch-black: var(--palette-black, #000);
    --patch-blue-05: var(--palette-blue-05, #d9e1f2);
    --patch-blue-10: var(--palette-blue-10, #8baff9);
    --patch-blue-20: var(--palette-blue-20, #4784ff);
    --patch-blue-30: var(--palette-blue-30, #3376ff);
    --patch-blue-40: var(--palette-blue-40, #2970ff);
    --patch-blue-50: var(--palette-blue-50, #1f69ff);
    --patch-blue-60: var(--palette-blue-60, #0051d0);
    --patch-blue-70: var(--palette-blue-70, #0040a3);
    --patch-blue-80: var(--palette-blue-80, #003485);
    --patch-blue-90: var(--palette-blue-90, #131e34);
    --patch-green-05: var(--palette-green-05, #d9f2ea);
    --patch-green-10: var(--palette-green-10, #78e3bf);
    --patch-green-20: var(--palette-green-20, #0ac284);
    --patch-green-30: var(--palette-green-30, #009965);
    --patch-green-40: var(--palette-green-40, #008f5e);
    --patch-green-50: var(--palette-green-50, #008558);
    --patch-green-60: var(--palette-green-60, #006851);
    --patch-green-70: var(--palette-green-70, #005240);
    --patch-green-80: var(--palette-green-80, #003328);
    --patch-green-90: var(--palette-green-90, #0e2a21);
    --patch-grey-05: var(--palette-grey-05, #f6f6f9);
    --patch-grey-10: var(--palette-grey-10, #ececf2);
    --patch-grey-20: var(--palette-grey-20, #ceceda);
    --patch-grey-30: var(--palette-grey-30, #b1b1bd);
    --patch-grey-40: var(--palette-grey-40, #8b8b97);
    --patch-grey-50: var(--palette-grey-50, #62626c);
    --patch-grey-60: var(--palette-grey-60, #484851);
    --patch-grey-70: var(--palette-grey-70, #35353b);
    --patch-grey-80: var(--palette-grey-80, #232328);
    --patch-grey-90: var(--palette-grey-90, #141417);
    --patch-orange-05: var(--palette-orange-05, #f2e1d9);
    --patch-orange-10: var(--palette-orange-10, #ffb68f);
    --patch-orange-20: var(--palette-orange-20, #ff8d52);
    --patch-orange-30: var(--palette-orange-30, #ff6f24);
    --patch-orange-40: var(--palette-orange-40, #f95600);
    --patch-orange-50: var(--palette-orange-50, #e64f00);
    --patch-orange-60: var(--palette-orange-60, #b33d00);
    --patch-orange-70: var(--palette-orange-70, #a33800);
    --patch-orange-80: var(--palette-orange-80, #8f3100);
    --patch-orange-90: var(--palette-orange-90, #392014);
    --patch-purple-05: var(--palette-purple-05, #f1ecf8);
    --patch-purple-10: var(--palette-purple-10, #ded3f1);
    --patch-purple-20: var(--palette-purple-20, #bda7e3);
    --patch-purple-30: var(--palette-purple-30, #9c7bd5);
    --patch-purple-40: var(--palette-purple-40, #916cd0);
    --patch-purple-50: var(--palette-purple-50, #5a23b9);
    --patch-purple-60: var(--palette-purple-60, #481c94);
    --patch-purple-70: var(--palette-purple-70, #3d1881);
    --patch-purple-80: var(--palette-purple-80, #291155);
    --patch-purple-90: var(--palette-purple-90, #270e48);
    --patch-red-05: var(--palette-red-05, #f2d9e1);
    --patch-red-10: var(--palette-red-10, #ff99ba);
    --patch-red-20: var(--palette-red-20, #ff6194);
    --patch-red-30: var(--palette-red-30, #ff3878);
    --patch-red-40: var(--palette-red-40, #f0004d);
    --patch-red-50: var(--palette-red-50, #e6004a);
    --patch-red-60: var(--palette-red-60, #b7023c);
    --patch-red-70: var(--palette-red-70, #8f002f);
    --patch-red-80: var(--palette-red-80, #660021);
    --patch-red-90: var(--palette-red-90, #31111b);
    --patch-white: var(--palette-white, #fff);
    --patch-yellow-05: var(--palette-yellow-05, #f2ead9);
    --patch-yellow-10: var(--palette-yellow-10, #ffd88a);
    --patch-yellow-20: var(--palette-yellow-20, #ffc95c);
    --patch-yellow-30: var(--palette-yellow-30, #ffb829);
    --patch-yellow-40: var(--palette-yellow-40, #fa0);
    --patch-yellow-50: var(--palette-yellow-50, #b87700);
    --patch-yellow-60: var(--palette-yellow-60, #8f5d00);
    --patch-yellow-70: var(--palette-yellow-70, #7a5000);
    --patch-yellow-80: var(--palette-yellow-80, #664200);
    --patch-yellow-90: var(--palette-yellow-90, #352913)
}

.patch-bg-black,
[theme].patch-bg-black {
    background-color: var(--patch-black)
}

.patch-bg-blue-05,
[theme].patch-bg-blue-05 {
    background-color: var(--patch-blue-05)
}

.patch-bg-blue-10,
[theme].patch-bg-blue-10 {
    background-color: var(--patch-blue-10)
}

.patch-bg-blue-20,
[theme].patch-bg-blue-20 {
    background-color: var(--patch-blue-20)
}

.patch-bg-blue-30,
[theme].patch-bg-blue-30 {
    background-color: var(--patch-blue-30)
}

.patch-bg-blue-40,
[theme].patch-bg-blue-40 {
    background-color: var(--patch-blue-40)
}

.patch-bg-blue-50,
[theme].patch-bg-blue-50 {
    background-color: var(--patch-blue-50)
}

.patch-bg-blue-60,
[theme].patch-bg-blue-60 {
    background-color: var(--patch-blue-60)
}

.patch-bg-blue-70,
[theme].patch-bg-blue-70 {
    background-color: var(--patch-blue-70)
}

.patch-bg-blue-80,
[theme].patch-bg-blue-80 {
    background-color: var(--patch-blue-80)
}

.patch-bg-blue-90,
[theme].patch-bg-blue-90 {
    background-color: var(--patch-blue-90)
}

.patch-bg-green-05,
[theme].patch-bg-green-05 {
    background-color: var(--patch-green-05)
}

.patch-bg-green-10,
[theme].patch-bg-green-10 {
    background-color: var(--patch-green-10)
}

.patch-bg-green-20,
[theme].patch-bg-green-20 {
    background-color: var(--patch-green-20)
}

.patch-bg-green-30,
[theme].patch-bg-green-30 {
    background-color: var(--patch-green-30)
}

.patch-bg-green-40,
[theme].patch-bg-green-40 {
    background-color: var(--patch-green-40)
}

.patch-bg-green-50,
[theme].patch-bg-green-50 {
    background-color: var(--patch-green-50)
}

.patch-bg-green-60,
[theme].patch-bg-green-60 {
    background-color: var(--patch-green-60)
}

.patch-bg-green-70,
[theme].patch-bg-green-70 {
    background-color: var(--patch-green-70)
}

.patch-bg-green-80,
[theme].patch-bg-green-80 {
    background-color: var(--patch-green-80)
}

.patch-bg-green-90,
[theme].patch-bg-green-90 {
    background-color: var(--patch-green-90)
}

.patch-bg-grey-05,
[theme].patch-bg-grey-05 {
    background-color: var(--patch-grey-05)
}

.patch-bg-grey-10,
[theme].patch-bg-grey-10 {
    background-color: var(--patch-grey-10)
}

.patch-bg-grey-20,
[theme].patch-bg-grey-20 {
    background-color: var(--patch-grey-20)
}

.patch-bg-grey-30,
[theme].patch-bg-grey-30 {
    background-color: var(--patch-grey-30)
}

.patch-bg-grey-40,
[theme].patch-bg-grey-40 {
    background-color: var(--patch-grey-40)
}

.patch-bg-grey-50,
[theme].patch-bg-grey-50 {
    background-color: var(--patch-grey-50)
}

.patch-bg-grey-60,
[theme].patch-bg-grey-60 {
    background-color: var(--patch-grey-60)
}

.patch-bg-grey-70,
[theme].patch-bg-grey-70 {
    background-color: var(--patch-grey-70)
}

.patch-bg-grey-80,
[theme].patch-bg-grey-80 {
    background-color: var(--patch-grey-80)
}

.patch-bg-grey-90,
[theme].patch-bg-grey-90 {
    background-color: var(--patch-grey-90)
}

.patch-bg-orange-05,
[theme].patch-bg-orange-05 {
    background-color: var(--patch-orange-05)
}

.patch-bg-orange-10,
[theme].patch-bg-orange-10 {
    background-color: var(--patch-orange-10)
}

.patch-bg-orange-20,
[theme].patch-bg-orange-20 {
    background-color: var(--patch-orange-20)
}

.patch-bg-orange-30,
[theme].patch-bg-orange-30 {
    background-color: var(--patch-orange-30)
}

.patch-bg-orange-40,
[theme].patch-bg-orange-40 {
    background-color: var(--patch-orange-40)
}

.patch-bg-orange-50,
[theme].patch-bg-orange-50 {
    background-color: var(--patch-orange-50)
}

.patch-bg-orange-60,
[theme].patch-bg-orange-60 {
    background-color: var(--patch-orange-60)
}

.patch-bg-orange-70,
[theme].patch-bg-orange-70 {
    background-color: var(--patch-orange-70)
}

.patch-bg-orange-80,
[theme].patch-bg-orange-80 {
    background-color: var(--patch-orange-80)
}

.patch-bg-orange-90,
[theme].patch-bg-orange-90 {
    background-color: var(--patch-orange-90)
}

.patch-bg-purple-05,
[theme].patch-bg-purple-05 {
    background-color: var(--patch-purple-05)
}

.patch-bg-purple-10,
[theme].patch-bg-purple-10 {
    background-color: var(--patch-purple-10)
}

.patch-bg-purple-20,
[theme].patch-bg-purple-20 {
    background-color: var(--patch-purple-20)
}

.patch-bg-purple-30,
[theme].patch-bg-purple-30 {
    background-color: var(--patch-purple-30)
}

.patch-bg-purple-40,
[theme].patch-bg-purple-40 {
    background-color: var(--patch-purple-40)
}

.patch-bg-purple-50,
[theme].patch-bg-purple-50 {
    background-color: var(--patch-purple-50)
}

.patch-bg-purple-60,
[theme].patch-bg-purple-60 {
    background-color: var(--patch-purple-60)
}

.patch-bg-purple-70,
[theme].patch-bg-purple-70 {
    background-color: var(--patch-purple-70)
}

.patch-bg-purple-80,
[theme].patch-bg-purple-80 {
    background-color: var(--patch-purple-80)
}

.patch-bg-purple-90,
[theme].patch-bg-purple-90 {
    background-color: var(--patch-purple-90)
}

.patch-bg-red-05,
[theme].patch-bg-red-05 {
    background-color: var(--patch-red-05)
}

.patch-bg-red-10,
[theme].patch-bg-red-10 {
    background-color: var(--patch-red-10)
}

.patch-bg-red-20,
[theme].patch-bg-red-20 {
    background-color: var(--patch-red-20)
}

.patch-bg-red-30,
[theme].patch-bg-red-30 {
    background-color: var(--patch-red-30)
}

.patch-bg-red-40,
[theme].patch-bg-red-40 {
    background-color: var(--patch-red-40)
}

.patch-bg-red-50,
[theme].patch-bg-red-50 {
    background-color: var(--patch-red-50)
}

.patch-bg-red-60,
[theme].patch-bg-red-60 {
    background-color: var(--patch-red-60)
}

.patch-bg-red-70,
[theme].patch-bg-red-70 {
    background-color: var(--patch-red-70)
}

.patch-bg-red-80,
[theme].patch-bg-red-80 {
    background-color: var(--patch-red-80)
}

.patch-bg-red-90,
[theme].patch-bg-red-90 {
    background-color: var(--patch-red-90)
}

.patch-bg-white,
[theme].patch-bg-white {
    background-color: var(--patch-white)
}

.patch-bg-yellow-05,
[theme].patch-bg-yellow-05 {
    background-color: var(--patch-yellow-05)
}

.patch-bg-yellow-10,
[theme].patch-bg-yellow-10 {
    background-color: var(--patch-yellow-10)
}

.patch-bg-yellow-20,
[theme].patch-bg-yellow-20 {
    background-color: var(--patch-yellow-20)
}

.patch-bg-yellow-30,
[theme].patch-bg-yellow-30 {
    background-color: var(--patch-yellow-30)
}

.patch-bg-yellow-40,
[theme].patch-bg-yellow-40 {
    background-color: var(--patch-yellow-40)
}

.patch-bg-yellow-50,
[theme].patch-bg-yellow-50 {
    background-color: var(--patch-yellow-50)
}

.patch-bg-yellow-60,
[theme].patch-bg-yellow-60 {
    background-color: var(--patch-yellow-60)
}

.patch-bg-yellow-70,
[theme].patch-bg-yellow-70 {
    background-color: var(--patch-yellow-70)
}

.patch-bg-yellow-80,
[theme].patch-bg-yellow-80 {
    background-color: var(--patch-yellow-80)
}

.patch-bg-yellow-90,
[theme].patch-bg-yellow-90 {
    background-color: var(--patch-yellow-90)
}

.patch-bg-transparent,
[theme].patch-bg-transparent {
    background-color: initial
}

.patch-text-black,
[theme].patch-text-black {
    color: var(--patch-black)
}

.patch-text-blue-05,
[theme].patch-text-blue-05 {
    color: var(--patch-blue-05)
}

.patch-text-blue-10,
[theme].patch-text-blue-10 {
    color: var(--patch-blue-10)
}

.patch-text-blue-20,
[theme].patch-text-blue-20 {
    color: var(--patch-blue-20)
}

.patch-text-blue-30,
[theme].patch-text-blue-30 {
    color: var(--patch-blue-30)
}

.patch-text-blue-40,
[theme].patch-text-blue-40 {
    color: var(--patch-blue-40)
}

.patch-text-blue-50,
[theme].patch-text-blue-50 {
    color: var(--patch-blue-50)
}

.patch-text-blue-60,
[theme].patch-text-blue-60 {
    color: var(--patch-blue-60)
}

.patch-text-blue-70,
[theme].patch-text-blue-70 {
    color: var(--patch-blue-70)
}

.patch-text-blue-80,
[theme].patch-text-blue-80 {
    color: var(--patch-blue-80)
}

.patch-text-blue-90,
[theme].patch-text-blue-90 {
    color: var(--patch-blue-90)
}

.patch-text-green-05,
[theme].patch-text-green-05 {
    color: var(--patch-green-05)
}

.patch-text-green-10,
[theme].patch-text-green-10 {
    color: var(--patch-green-10)
}

.patch-text-green-20,
[theme].patch-text-green-20 {
    color: var(--patch-green-20)
}

.patch-text-green-30,
[theme].patch-text-green-30 {
    color: var(--patch-green-30)
}

.patch-text-green-40,
[theme].patch-text-green-40 {
    color: var(--patch-green-40)
}

.patch-text-green-50,
[theme].patch-text-green-50 {
    color: var(--patch-green-50)
}

.patch-text-green-60,
[theme].patch-text-green-60 {
    color: var(--patch-green-60)
}

.patch-text-green-70,
[theme].patch-text-green-70 {
    color: var(--patch-green-70)
}

.patch-text-green-80,
[theme].patch-text-green-80 {
    color: var(--patch-green-80)
}

.patch-text-green-90,
[theme].patch-text-green-90 {
    color: var(--patch-green-90)
}

.patch-text-grey-05,
[theme].patch-text-grey-05 {
    color: var(--patch-grey-05)
}

.patch-text-grey-10,
[theme].patch-text-grey-10 {
    color: var(--patch-grey-10)
}

.patch-text-grey-20,
[theme].patch-text-grey-20 {
    color: var(--patch-grey-20)
}

.patch-text-grey-30,
[theme].patch-text-grey-30 {
    color: var(--patch-grey-30)
}

.patch-text-grey-40,
[theme].patch-text-grey-40 {
    color: var(--patch-grey-40)
}

.patch-text-grey-50,
[theme].patch-text-grey-50 {
    color: var(--patch-grey-50)
}

.patch-text-grey-60,
[theme].patch-text-grey-60 {
    color: var(--patch-grey-60)
}

.patch-text-grey-70,
[theme].patch-text-grey-70 {
    color: var(--patch-grey-70)
}

.patch-text-grey-80,
[theme].patch-text-grey-80 {
    color: var(--patch-grey-80)
}

.patch-text-grey-90,
[theme].patch-text-grey-90 {
    color: var(--patch-grey-90)
}

.patch-text-orange-05,
[theme].patch-text-orange-05 {
    color: var(--patch-orange-05)
}

.patch-text-orange-10,
[theme].patch-text-orange-10 {
    color: var(--patch-orange-10)
}

.patch-text-orange-20,
[theme].patch-text-orange-20 {
    color: var(--patch-orange-20)
}

.patch-text-orange-30,
[theme].patch-text-orange-30 {
    color: var(--patch-orange-30)
}

.patch-text-orange-40,
[theme].patch-text-orange-40 {
    color: var(--patch-orange-40)
}

.patch-text-orange-50,
[theme].patch-text-orange-50 {
    color: var(--patch-orange-50)
}

.patch-text-orange-60,
[theme].patch-text-orange-60 {
    color: var(--patch-orange-60)
}

.patch-text-orange-70,
[theme].patch-text-orange-70 {
    color: var(--patch-orange-70)
}

.patch-text-orange-80,
[theme].patch-text-orange-80 {
    color: var(--patch-orange-80)
}

.patch-text-orange-90,
[theme].patch-text-orange-90 {
    color: var(--patch-orange-90)
}

.patch-text-purple-05,
[theme].patch-text-purple-05 {
    color: var(--patch-purple-05)
}

.patch-text-purple-10,
[theme].patch-text-purple-10 {
    color: var(--patch-purple-10)
}

.patch-text-purple-20,
[theme].patch-text-purple-20 {
    color: var(--patch-purple-20)
}

.patch-text-purple-30,
[theme].patch-text-purple-30 {
    color: var(--patch-purple-30)
}

.patch-text-purple-40,
[theme].patch-text-purple-40 {
    color: var(--patch-purple-40)
}

.patch-text-purple-50,
[theme].patch-text-purple-50 {
    color: var(--patch-purple-50)
}

.patch-text-purple-60,
[theme].patch-text-purple-60 {
    color: var(--patch-purple-60)
}

.patch-text-purple-70,
[theme].patch-text-purple-70 {
    color: var(--patch-purple-70)
}

.patch-text-purple-80,
[theme].patch-text-purple-80 {
    color: var(--patch-purple-80)
}

.patch-text-purple-90,
[theme].patch-text-purple-90 {
    color: var(--patch-purple-90)
}

.patch-text-red-05,
[theme].patch-text-red-05 {
    color: var(--patch-red-05)
}

.patch-text-red-10,
[theme].patch-text-red-10 {
    color: var(--patch-red-10)
}

.patch-text-red-20,
[theme].patch-text-red-20 {
    color: var(--patch-red-20)
}

.patch-text-red-30,
[theme].patch-text-red-30 {
    color: var(--patch-red-30)
}

.patch-text-red-40,
[theme].patch-text-red-40 {
    color: var(--patch-red-40)
}

.patch-text-red-50,
[theme].patch-text-red-50 {
    color: var(--patch-red-50)
}

.patch-text-red-60,
[theme].patch-text-red-60 {
    color: var(--patch-red-60)
}

.patch-text-red-70,
[theme].patch-text-red-70 {
    color: var(--patch-red-70)
}

.patch-text-red-80,
[theme].patch-text-red-80 {
    color: var(--patch-red-80)
}

.patch-text-red-90,
[theme].patch-text-red-90 {
    color: var(--patch-red-90)
}

.patch-text-white,
[theme].patch-text-white {
    color: var(--patch-white)
}

.patch-text-yellow-05,
[theme].patch-text-yellow-05 {
    color: var(--patch-yellow-05)
}

.patch-text-yellow-10,
[theme].patch-text-yellow-10 {
    color: var(--patch-yellow-10)
}

.patch-text-yellow-20,
[theme].patch-text-yellow-20 {
    color: var(--patch-yellow-20)
}

.patch-text-yellow-30,
[theme].patch-text-yellow-30 {
    color: var(--patch-yellow-30)
}

.patch-text-yellow-40,
[theme].patch-text-yellow-40 {
    color: var(--patch-yellow-40)
}

.patch-text-yellow-50,
[theme].patch-text-yellow-50 {
    color: var(--patch-yellow-50)
}

.patch-text-yellow-60,
[theme].patch-text-yellow-60 {
    color: var(--patch-yellow-60)
}

.patch-text-yellow-70,
[theme].patch-text-yellow-70 {
    color: var(--patch-yellow-70)
}

.patch-text-yellow-80,
[theme].patch-text-yellow-80 {
    color: var(--patch-yellow-80)
}

.patch-text-yellow-90,
[theme].patch-text-yellow-90 {
    color: var(--patch-yellow-90)
}

.patch-text-headline3 {
    --text-headline2-leading: var(--text-headline2-line-height);
    --text-headline2-family: var(--text-family-brand);
    font-family: var(--text-headline2-family);
    font-size: var(--text-headline2-size);
    font-size: 1.5rem;
    font-weight: var(--text-headline2-weight);
    letter-spacing: var(--text-headline2-letter-spacing);
    line-height: var(--text-headline2-leading);
    line-height: 2rem;
    text-transform: var(--text-headline2-text-transform)
}

.cta {
    padding-bottom: 1.875rem;
    padding-top: 1.875rem
}

@media only screen and (min-width:48rem) {
    .cta {
        padding-bottom: 3rem;
        padding-top: 3rem
    }
}

.cta__link:focus {
    outline: .125rem dotted
}

.cta__link:hover {
    border-bottom: .063rem solid;
    text-decoration: none
}

.x-ui-theme--blue .cta__link:focus {
    outline: 1px dotted #fff
}

.cta__link:after {
    content: "\203A";
    padding-left: .75rem;
    position: absolute
}

.solid-divider {
    color: #dde2e6
}

.custom-width-button {
    --width: 100%;
    --display: block;
    min-width: 156px
}

.offer-details__wrapper--price-and-info {
    box-shadow: none
}

.x-price-info__container {
    flex-direction: row;
    margin: 0 auto;
    max-width: 1024px;
    padding: 0 .563rem;
    position: relative;
    width: 100%
}

@media only screen and (min-width:48rem) {
    .x-price-info__container {
        padding: 0 1.125rem
    }
}

@media only screen and (min-width:64rem) {
    .x-price-info__container {
        padding: 0
    }
}

@media only screen and (min-width:20rem) {
    .x-price-info__container {
        padding: 1.5rem .75rem
    }
}

@media only screen and (min-width:23.375rem) {
    .x-price-info__container {
        padding: 2.25rem .75rem
    }
}

@media only screen and (min-width:48rem) and (max-width:65.875rem) {
    .x-price-info__container {
        padding: 3rem 1.5rem
    }
}

@media only screen and (min-width:65.938rem) and (max-width:90rem) {
    .x-price-info__container {
        padding: 3.375rem 0
    }
}

.x-price-info__container .x-price-info-border {
    border-bottom: 1px solid #dde2e6
}

.x-price-info__container .bold {
    font-weight: 700
}

.x-price-info__container .hide {
    display: none
}

@media only screen and (min-width:23.375rem) {
    .x-price-info__container .x-price-info-header {
        margin-bottom: 1.125rem
    }
}

@media only screen and (min-width:48rem) {
    .x-price-info__container .x-price-info-header {
        margin-bottom: 1.5rem
    }
}

@media only screen and (min-width:64rem) {
    .x-price-info__container .x-price-info-header {
        margin-bottom: 2.25rem
    }
}

.x-price-info__container .x-price-info-customer-container {
    border-bottom: 1px solid #dde2e6
}

@media only screen and (min-width:23.375rem) {
    .x-price-info__container .x-price-info-customer-container .x-price-info-customer-label {
        padding-bottom: .375rem
    }
}

@media only screen and (min-width:48rem) {
    .x-price-info__container .x-price-info-customer-container .x-price-info-customer-label {
        padding-bottom: .375rem
    }
}

@media only screen and (min-width:64rem) {
    .x-price-info__container .x-price-info-customer-container .x-price-info-customer-label {
        padding-bottom: .75rem
    }
}

@media only screen and (min-width:23.375rem) {
    .x-price-info__container .x-price-info-customer-container .x-price-info-customer-bullets {
        padding-bottom: 1.125rem
    }
}

@media only screen and (min-width:48rem) {
    .x-price-info__container .x-price-info-customer-container .x-price-info-customer-bullets {
        padding-bottom: 1.125rem
    }
}

@media only screen and (min-width:64rem) {
    .x-price-info__container .x-price-info-customer-container .x-price-info-customer-bullets {
        padding-bottom: 1.5rem
    }
}

.x-price-info__container .x-price-info-customer-container .x-price-info-customer-bullets .customer-bullet span:before {
    content: "•";
    padding: 0 .375rem
}

.x-price-info__container .x-price-info-customer-container .x-price-info-customer-bullets .customer-bullet span:first-child:before {
    content: ""
}

@media only screen and (min-width:23.375rem) {
    .x-price-info__container .x-price-info-rate-container {
        padding: 1.125rem 0
    }
}

@media only screen and (min-width:48rem) {
    .x-price-info__container .x-price-info-rate-container {
        padding: 1.125rem 0
    }
}

@media only screen and (min-width:64rem) {
    .x-price-info__container .x-price-info-rate-container {
        padding: 1.5rem 0
    }
}

.x-price-info__container .x-price-info-rate-container .x-price-info-rate-label {
    font-weight: 500;
    padding-bottom: .375rem
}

.x-price-info__container .x-price-info-rate-container .x-price-info-amount {
    display: inline;
    font-weight: 700
}

@media only screen and (min-width:23.375rem) {
    .x-price-info__container .x-price-info-rate-container .x-price-info-rate-description {
        padding-top: 1.125rem
    }
}

@media only screen and (min-width:48rem) {
    .x-price-info__container .x-price-info-rate-container .x-price-info-rate-description {
        padding-top: .75rem
    }
}

@media only screen and (min-width:64rem) {
    .x-price-info__container .x-price-info-rate-container .x-price-info-rate-description {
        padding-top: 0
    }
}

@media only screen and (min-width:23.375rem) {
    .x-price-info__container .x-price-info-fee-container {
        padding: 1.125rem 0
    }
}

@media only screen and (min-width:48rem) {
    .x-price-info__container .x-price-info-fee-container {
        padding: 1.125rem 0
    }
}

@media only screen and (min-width:64rem) {
    .x-price-info__container .x-price-info-fee-container {
        padding: 1.5rem 0
    }
}

.x-price-info__container .x-price-info-fee-container .x-price-info-fee-label {
    font-weight: 500;
    padding-bottom: .375rem
}

.x-price-info__container .x-price-info-fee-container .x-price-info-prefix {
    display: inline;
    font-weight: 400;
    padding-right: .375rem
}

.x-price-info__container .x-price-info-fee-container .x-price-info-amount {
    display: inline;
    font-weight: 700
}

@media only screen and (min-width:23.375rem) {
    .x-price-info__container .x-price-info-fee-container .x-price-info-fee-description {
        padding: .75rem 0 1.125rem
    }
}

@media only screen and (min-width:48rem) {
    .x-price-info__container .x-price-info-fee-container .x-price-info-fee-description {
        padding: .375rem 0 1.125rem
    }
}

@media only screen and (min-width:64rem) {
    .x-price-info__container .x-price-info-fee-container .x-price-info-fee-description {
        padding: 0
    }
}

@media only screen and (min-width:20rem) {
    .x-price-info__container .x-price-info-month {
        padding-right: 1.5rem
    }
}

@media only screen and (min-width:23.375rem) {
    .x-price-info__container .x-price-info-month {
        padding-right: 1.5rem
    }
}

@media only screen and (min-width:48rem) {
    .x-price-info__container .x-price-info-month {
        padding-right: 1.5rem
    }
}

@media only screen and (min-width:64rem) {
    .x-price-info__container .x-price-info-month {
        padding-right: 2.25rem
    }
}

@media only screen and (min-width:23.375rem) {
    .x-price-info__container .x-price-info-pricing-other-container {
        padding-bottom: 1.125rem;
        padding-top: 1.125rem
    }
}

@media only screen and (min-width:48rem) {
    .x-price-info__container .x-price-info-pricing-other-container {
        padding-bottom: 1.125rem;
        padding-top: 1.125rem
    }
}

@media only screen and (min-width:64rem) {
    .x-price-info__container .x-price-info-pricing-other-container {
        padding-bottom: 1.125rem;
        padding-top: 1.5rem
    }
}

@media only screen and (min-width:23.375rem) {
    .x-price-info__container .x-price-info-pricing-other-container .x-price-info-pricing-other-description {
        padding-top: .375rem
    }
}

@media only screen and (min-width:48rem) {
    .x-price-info__container .x-price-info-pricing-other-container .x-price-info-pricing-other-description {
        padding-top: .375rem
    }
}

@media only screen and (min-width:64rem) {
    .x-price-info__container .x-price-info-pricing-other-container .x-price-info-pricing-other-description {
        padding-top: 0
    }
}

@media only screen and (min-width:23.375rem) {
    .x-price-info__container .x-price-info-additional-container {
        padding-top: 1.125rem
    }
}

@media only screen and (min-width:48rem) {
    .x-price-info__container .x-price-info-additional-container {
        padding-top: 1.125rem
    }
}

@media only screen and (min-width:64rem) {
    .x-price-info__container .x-price-info-additional-container {
        padding-top: 1.5rem
    }
}

@media only screen and (min-width:23.375rem) {
    .x-price-info__container .x-price-info-additional-container .x-price-info-additional-description {
        padding-top: .375rem
    }
}

@media only screen and (min-width:48rem) {
    .x-price-info__container .x-price-info-additional-container .x-price-info-additional-description {
        padding-top: .375rem
    }
}

@media only screen and (min-width:64rem) {
    .x-price-info__container .x-price-info-additional-container .x-price-info-additional-description {
        padding-top: 0
    }
}

.cart-action-btn {
    height: 100%;
    min-height: 3.25rem;
    transition: .2s ease-in;
    transition-property: background-color, border-color, box-shadow
}

.cart-action-btn:focus {
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
    --tw-ring-opacity: 1;
    --tw-ring-color: rgb(var(--ring-color-theme1-base)/var(--tw-ring-opacity));
    --tw-ring-offset-width: 2px;
    --tw-ring-offset-color: rgb(var(--ring-offset-color-material-neutral-base));
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000)
}

.react-autosuggest__suggestions-container {
    max-width: 100%;
    width: 100%
}

.react-autosuggest__suggestions-container--open {
    background: #fff;
    border: 1px solid #c7cdd2;
    max-height: 250px;
    overflow-y: scroll;
    padding: 12px 0;
    position: absolute;
    z-index: 20
}

.react-autosuggest__section-container {
    margin-top: 12px
}

.react-autosuggest__section-container--first {
    margin-top: 0
}

.react-autosuggest__section-title {
    padding: 0 12px
}

.react-autosuggest__suggestions-list {
    list-style: none;
    margin: 0;
    padding: 0
}

.react-autosuggest__suggestion {
    padding: 6px 12px
}

.react-autosuggest__suggestion--highlighted {
    background-color: #ebeef0;
    color: #5a23b9
}

.react-autosuggest__suggestion .matched-text {
    font-weight: 700
}

@media only screen and (min-width:48rem) {
    .react-autosuggest__suggestions-container--open {
        max-height: 600px;
        overflow: auto
    }
}

.delete-icon-search {
    stroke: #fff;
    stroke-width: 12;
    background: #5a23b9;
    border-radius: 50%;
    color: #fff;
    height: 1.125rem;
    padding: .125rem;
    width: 1.125rem
}

.bg-left {
    background-position: 8px
}

.x-channels-table__inner .x-channels-table__heading.x-channels-table__row.mobile-sticky {
    top: 70px !important
}

.x-channels-table__inner .x-channels-table__heading.x-channels-table__row.tablet-desktop-sticky {
    top: 79px !important
}

.x-channels-container {
    position: relative
}

.x-channel-lineup__inner {
    width: 100%
}

.x-channels-container__disclaimer {
    margin-bottom: 1.125rem;
    padding: 0 .75rem
}

.x-channels-container__offers {
    margin: 1.5rem .75rem .75rem
}

.x-channels-container__nav-wrapper .top-nav {
    background: #fff
}

.x-channels-container__nav-wrapper .top-nav__item {
    margin: 0 .625rem;
    padding: 0
}

.x-channels-container__nav-wrapper .top-nav__item--active {
    border-bottom: .125rem solid #0272b6
}

.x-channels-container__nav-wrapper .top-nav__item-link {
    padding: .75rem 0
}

.x-channels-container__nav-wrapper .x-channels-container__existing-customer {
    margin: 1.5rem 0 0;
    padding: .75rem 0
}

.x-channels-container__views {
    margin: 0 auto 1.5rem;
    padding: 0
}

.x-channels-container__views [class^=x-flex__col] {
    padding: 0
}

.x-channels-container__views .x-list--inline-bullets li:before {
    top: .438rem
}

.x-channels-container__views a,
.x-channels-container__views p {
    margin: 0
}

.x-channels-container__table {
    position: relative
}

.x-channels-container__featured-title {
    margin: 0 0 1.125rem;
    padding: 0 .75rem
}

@media only screen and (min-width:64rem) {
    .x-channels-container__featured-title {
        padding: 0
    }
}

.x-channels-container__featured {
    margin: 0 0 3.375rem;
    width: 100%
}

.x-channels-container__featured [class^=x-flex__col] {
    padding: 0 .063rem
}

.x-channels-container__featured .card-collection {
    margin: 0
}

.x-channels-container__featured-tab {
    background-color: #dde2e6;
    border: 0;
    padding: 1.125rem .375rem;
    text-align: center;
    width: 100%
}

.x-channels-container__featured-tab:hover {
    text-decoration: none
}

.x-channels-container__featured-tab .x-heading5 {
    line-height: .813rem
}

.x-channels-container__featured-tab .x-channels-container__numbers {
    color: #191919
}

@media only screen and (min-width:64rem) {
    .x-channels-container__featured-tab .x-channels-container__numbers {
        font-size: 30px;
        font-size: 1.875rem;
        line-height: 1.067;
        margin-top: .375rem
    }
}

.x-channels-container__featured-tab--active {
    background-color: #fff;
    border-top: .188rem solid #0272b6;
    padding: .938rem .375rem 1.125rem
}

.x-channels-container__featured-logo {
    margin: 1.125rem 0;
    text-align: center
}

.x-channels-container__summary {
    padding: .75rem 0;
    position: relative
}

@media only screen and (min-width:20rem) {
    .x-channels-container__summary {
        padding: .75rem
    }
}

.x-channels-container__summary .x-button--flat {
    margin: 0;
    min-width: 4.375rem;
    padding-left: .188rem;
    padding-right: .188rem
}

@media only screen and (min-width:20rem) {
    .x-channels-container__summary .x-button--flat {
        height: 2.875rem;
        min-width: 5.625rem;
        padding-left: .375rem;
        padding-right: .375rem
    }
}

.x-channels-container__summary .x-channels-container__address {
    margin-bottom: 0
}

.x-channels-container__summary .x-channels-container__address .x-offer-summary__location {
    margin: 0
}

.x-channels-container__summary .x-channels-container__address .x-offer-summary__location .x-hide--medium-and-under {
    display: none !important
}

@media only screen and (min-width:64rem) {
    .x-channels-container__summary .x-channels-container__address .x-offer-summary__location .x-hide--medium-and-under {
        display: inline-block !important
    }
}

.x-channels-container__summary .x-channels-container__address .x-icon {
    stroke: none;
    color: #ff9271;
    margin-right: .75rem;
    max-height: 1.25rem;
    max-width: 1.25rem
}

.x-channels-container__summary .x-channels-container__address button {
    margin-left: .375rem
}

.x-channels-container__summary .x-field--checkbox,
.x-channels-container__summary .x-field--switch {
    margin: 0 1.125rem 0 0;
    width: auto
}

.x-channels-container__summary .x-field--checkbox .x-field__label,
.x-channels-container__summary .x-field--switch .x-field__label {
    margin: 0
}

.x-channels-container__summary .x-field--checkbox.x-input-checkbox--hd .x-field__label:before {
    margin-right: .75rem
}

.x-channels-container__summary .x-field__input--search {
    padding-right: 4.5rem
}

.x-channels-container__summary .x-field__select-options.x-field__select-options--channel-sort {
    padding-left: .75rem;
    padding-right: 2rem
}

.x-channels-container__summary .x-channels-container__options>div {
    margin: 0
}

.x-channels-container__summary .x-channels-container__options .x-channels-container__summary-col {
    margin: 0 0 0 .375rem
}

.x-channels-container__summary .x-channels-container__options .x-channels-container__summary-col .x-field__select-container {
    background-color: #2f3845;
    border: 0;
    color: #fff
}

.x-channels-container__summary .x-channels-container__options .x-channels-container__options-hd {
    display: none
}

@media only screen and (min-width:64rem) {
    .x-channels-container__summary .x-channels-container__options .x-channels-container__options-hd {
        padding: 0 1.5rem 0 0
    }
}

.x-channels-container__summary .x-channels-container__options .x-channels-container__options-hd span {
    text-align: left
}

.x-channels-container__summary .x-channels-container__options .x-field--search-wrap,
.x-channels-container__summary .x-channels-container__options .x-field--select {
    display: none
}

.x-channels-container__summary .x-channels-container__options .x-field--select {
    padding-right: 0
}

.x-channels-container__summary .x--active .x-field--search-wrap {
    background-color: #1f232e;
    display: flex;
    height: 100%;
    left: 0;
    padding: .75rem;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 7
}

.x-channels-container__summary .x-channels-container__summary-btn--search button {
    background-color: #fff;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 1.5rem 1.5rem;
    border: 1px solid #fff;
    border-radius: .188rem;
    font-size: 0;
    height: 2.875rem;
    margin: 0;
    padding: 0;
    width: 3.125rem
}

.x-channels-container__summary .x-channels-container__summary-btn--search button:hover {
    cursor: pointer
}

.x-channels-container__summary .x-channels-container__summary-sort-drawer {
    background-color: #1f232e;
    height: 100vh;
    left: 0;
    overflow: auto;
    padding-bottom: 6.25rem;
    position: fixed;
    top: 0;
    transform: translateY(100%);
    transition: transform .3s ease-in-out 0s, visibility .3s ease-in-out 0s;
    visibility: hidden;
    width: 100%;
    z-index: 70
}

@media only screen and (min-width:550px) {
    .x-channels-container__summary .x-channels-container__summary-sort-drawer {
        padding-bottom: 0
    }
}

.x-channels-container__summary .x--active .x-channels-container__summary-sort-drawer {
    transform: translateY(0);
    visibility: visible
}

.x-channels-container__summary .x-channels-container__summary-sort-drawer-inner {
    padding: 1.25rem
}

.x-channels-container__summary .x-channels-container__summary-sort-drawer-inner .x-channels-container__summary-btn--close {
    position: absolute;
    right: 1.25rem
}

.x-channels-container__summary .x-channels-container__summary-sort-drawer-inner .x-channels-container__summary-btn--apply {
    bottom: 1.25rem;
    left: 1.25rem;
    position: absolute;
    right: 1.25rem
}

@media only screen and (min-width:550px) {
    .x-channels-container__summary .x-channels-container__summary-sort-drawer-inner .x-channels-container__summary-btn--apply {
        bottom: auto;
        left: 0;
        position: relative;
        right: 0
    }
}

.x-channels-container__summary section {
    margin: .75rem 0 3.125rem
}

.x-channels-container__summary section h2 {
    border-bottom: .063rem solid #44484c;
    margin-bottom: 1.25rem;
    padding-bottom: 1.25rem
}

.x-channels-container__summary section .x-field {
    margin-bottom: .75rem
}

.x-channels-container__summary .x-field--search input {
    background-color: #fff;
    background-position: .75rem;
    background-repeat: no-repeat;
    background-size: 1.5rem 1.5rem;
    border: 1px solid #646a70;
    border-radius: .188rem;
    color: #000;
    height: 3.438rem;
    padding: .75rem .75rem .75rem 3rem;
    width: 100%
}

.x-channels-container__summary .x-field--search .x-button--icon {
    position: absolute;
    right: 1.25rem;
    top: .938rem;
    z-index: 2
}

.x-channels-container__summary .x--active .x-field--search {
    flex-grow: 1
}

.x-channels-container__summary .x--active .x-field--search input {
    height: auto
}

.x-channels-container__summary .x--active .x-channels-container__summary-btn--cancel {
    margin-left: .75rem
}

.x-channels-table {
    margin: 0 auto;
    max-width: 64rem;
    position: relative;
    width: 100%
}

.x-channels-table p {
    list-style: none;
    margin: 0;
    padding: 0
}

.x-channels-table .x--is-available {
    background-color: #0272b6;
    border-radius: .313rem;
    height: .625rem;
    margin: 0 auto;
    width: .625rem
}

.x-channels-table .x-channels-table__row {
    display: table;
    max-width: 64rem;
    table-layout: fixed;
    width: 100%
}

.x-channels-table .x-channels-table__item {
    background-color: #fff;
    border-bottom: .188rem solid #eef1f3;
    border-right: .188rem solid #eef1f3;
    display: table-cell;
    font-size: 11px;
    font-size: .688rem;
    height: 3.75rem;
    line-height: 1.182;
    overflow: hidden;
    padding: .188rem;
    position: relative;
    text-align: center;
    vertical-align: middle
}

@media only screen and (min-width:23.375rem) {
    .x-channels-table .x-channels-table__item {
        padding: .375rem
    }
}

.x-channels-table .x-channels-table__item span {
    word-wrap: break-word
}

.x-channels-table .x-channels-table__item .x-button--anchor {
    text-align: center
}

.x-channels-table .x-channels-table__item.enabled {
    background-color: #fff
}

.x-channels-table .x-channels-table__item:last-child {
    border-right: 0
}

.x-channels-table--highlights .x-channels-table__item[data-channel-tier] {
    background-color: #dde2e6
}

.x-channels-table--highlights .x-channels-table__item[data-channel-tier].enabled {
    background-color: #fff
}

.x-channels-table--highlights .x-channels-table__item[data-channel-tier].x-channels-table__preferred-item {
    background-color: #fff;
    overflow: visible
}

.x-channels-table .x-channels-table__row:last-child .x-channels-table__item[data-channel-tier].x-channels-table__preferred-item {
    background: -ms-linear-gradient(top, #fff 1%, #fff 98%, #5837cb 98%, #5837cb 100%)
}

@media only screen and (min-width:20rem) {
    .x-channels-table .x-channels-table__row:last-child .x-channels-table__item[data-channel-tier].x-channels-table__preferred-item {
        background: linear-gradient(0deg, #fff 1%, #fff 98%, #5837cb 0, #5837cb)
    }
}

.x-channels-table .x-channels-table__row:last-child .x-channels-table__item {
    border-bottom: 0
}

.x-channels-table--package-selector .x-channels-table__heading .x-channels-table__item[role=columnheader] {
    overflow: hidden
}

@media only screen and (min-width:23.375rem) {
    .x-channels-table--package-selector .x-channels-table__heading .x-channels-table__item[role=columnheader] {
        height: 5rem
    }
}

.x-channels-table--package-selector.x-channels__preferred-category-sort .x-channels-table__heading .x-channels-table__item {
    border-bottom: 0
}

@media only screen and (min-width:20rem) {
    .x-channels-table--package-selector.x-channels__preferred-category-sort .x-channels-table__heading .x-channels-table__preferred-item {
        background: linear-gradient(0deg, #fff 1%, #fff 99%, #5837cb 0, #5837cb)
    }
}

.x-channels-table--package-selector .x-field--checkbox {
    display: flex;
    height: 100%;
    margin-bottom: 0
}

.x-channels-table--package-selector .x-field--checkbox .x-field__label {
    margin-bottom: 0;
    width: 100%
}

.x-channels-table--package-selector .x-field--checkbox .x-field__label__text {
    display: flex;
    flex-direction: column;
    flex-grow: 2;
    justify-content: space-around;
    padding-bottom: .75rem
}

.x-channels-table--package-selector .x-field--checkbox .x-field__label__text .x-heading5 {
    align-items: center;
    flex-grow: 2;
    justify-content: center
}

.x-channels-table--package-selector .x-field--checkbox .x-field__label__text .x-heading5.x-hide--small-and-under {
    display: none !important
}

@media only screen and (min-width:23.375rem) {
    .x-channels-table--package-selector .x-field--checkbox .x-field__label__text .x-heading5.x-hide--small-and-under {
        display: none !important
    }
}

.x-channels-table--package-selector .x-field--checkbox .x-field__label__text .x-channel-table__numbers {
    bottom: 0;
    width: 100%
}

.x-channels-table .x-channels-table__item-text {
    display: none;
    height: 0;
    opacity: 0
}

.x-channels-table .x-channels-table__item-text:only-child {
    display: block;
    height: auto;
    opacity: 1
}

.x-channels-table .x-channels-table__item-image {
    align-items: center;
    display: flex;
    height: 1.875rem;
    margin: 0 auto;
    width: 3.125rem
}

.x-channels-table .x-channels-table__main-title .x-channels-table__item-image {
    height: auto;
    width: auto
}

.x-channels-table .x-channels-table__item-image img {
    display: block;
    height: auto;
    margin: 0 auto;
    max-height: 100%;
    max-width: 100%;
    width: 100%
}

.x-channels-table.x-channels-heading--text-view .x-channels-table__item-text {
    display: block;
    height: auto;
    opacity: 1;
    width: 100%
}

.x-channels-table.x-channels-heading--text-view .x-channels-table__item-image {
    display: none
}

.x-channels-table.x-channels-heading--text-view .x-channels-table--heading {
    text-align: left
}

.x-channels-table.x-channels-heading--text-view .x-channels-existing-view {
    align-items: flex-start;
    flex-direction: column
}

.x-channels-table .x-channels-table__group {
    margin-top: 1.5rem
}

.x-channels-table .x-channels-table__group .x-channels-table__group-inner {
    padding: .75rem;
    position: relative
}

.x-channels-table .x-channels-table__group .x-channels-table__group-wrap {
    align-items: flex-end;
    display: flex;
    padding-right: 3.125rem
}

.x-channels-table .x-channels-table__group [data-drawer] {
    position: absolute;
    right: .75rem;
    top: .75rem
}

.x-channels-table .x-channels-table__group .x-channels-table__group-extra-link {
    margin-left: .75rem
}

.x-channels-table .x-channels-table__group--error {
    background-color: #fff;
    border-top: .375rem solid #eef1f3;
    text-align: center
}

.x-channels-table .x-channels-table__heading .x-channels-table__numbers {
    margin-top: .188rem
}

@media only screen and (min-width:64rem) {
    .x-channels-table .x-channels-table__heading .x-channels-table__numbers {
        font-size: 30px;
        font-size: 1.875rem;
        line-height: 1.067
    }
}

.x-channels-table .x-channels-table__heading .x-channels-table__main-title {
    font-size: 11px;
    font-size: .688rem;
    font-weight: 700;
    line-height: 1.182
}

.x-channels-table .x-channels-table__heading .x-channels-table__item {
    height: 4.063rem;
    padding: 0;
    text-align: center;
    vertical-align: middle
}

.x-channels-table .x-channels-table__heading .x-channels-table__item:first-child {
    padding: 0 .375rem;
    vertical-align: middle
}

.x-channels-table .x-channels-table__heading .x-channels-table__item>.x-heading5 {
    line-height: .813rem
}

.x-channels-table .x-channels-table__heading .x-channels-table__item .x-field--checkbox .x-field__label {
    flex-direction: column;
    flex-grow: 1
}

.x-channels-table .x-channels-table__heading .x-channels-table__item .x-field--checkbox .x-field__label:before {
    margin: .75rem auto .563rem
}

.x-channels-table .x-channels-table__heading .x-channels-table__item.x-channels-table__preferred-item:before {
    content: " ";
    height: 108%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

@media only screen and (min-width:20rem) {
    .x-channels-table .x-channels-table__heading .x-channels-table__item.x-channels-table__preferred-item:before {
        border-top: 3px solid #5837cb
    }
}

@media only screen and (min-width:64rem) {
    .x-channels-table .x-channels-table__heading .x-channels-table__item.x-channels-table__preferred-item:before {
        height: 105%
    }
}

.x-channels-table .x-channels-table__heading+.x-channels-table__group {
    margin-top: 0
}

.x-channels-table .x-channels-table__heading.x-channels-table__row {
    padding-top: .375rem
}

.x-channels-table .x-channels-table__heading+.x-channels-table__row {
    border-top: .188rem solid #eef1f3
}

.x-channel-lineup--drawer-open .x-channels-table__heading {
    display: none
}

.x-channels-heading--no-logos .x-channels-table--heading {
    text-align: left
}

.x-channels-table--col-1 .x-channels-table__item {
    width: 100%
}

.x-channels-table--col-2 .x-channels-table__item {
    width: 50%
}

.x-channels-table--col-3 .x-channels-table__item {
    width: 33.33333%
}

.x-channels-table--col-4 .x-channels-table__item {
    width: 25%
}

.x-channels-table--col-5 .x-channels-table__item {
    width: 20%
}

.x-channels-table--col-6 .x-channels-table__item {
    width: 16.66667%
}

.x-channels-table--col-7 .x-channels-table__item {
    width: 14.28571%
}

.x-channels-table--col-8 .x-channels-table__item {
    width: 12.5%
}

.x-channels-table--col-9 .x-channels-table__item {
    width: 11.11111%
}

.x-channels-table--col-10 .x-channels-table__item {
    width: 10%
}

.x-channels-table--col-6 .x-channels-table__item:first-child {
    width: 5rem
}

@media only screen and (min-width:23.375rem) {
    .x-channels-table--col-6 .x-channels-table__item:first-child {
        width: 6.875rem
    }
}

.x-channels-table--col-7 .x-channels-table__item:first-child {
    width: 5rem
}

@media only screen and (min-width:23.375rem) {
    .x-channels-table--col-7 .x-channels-table__item:first-child {
        width: 6.875rem
    }
}

.x-channels-table--col-8 .x-channels-table__item:first-child {
    width: 5rem
}

@media only screen and (min-width:23.375rem) {
    .x-channels-table--col-8 .x-channels-table__item:first-child {
        width: 6.875rem
    }
}

.x-channels-table--col-9 .x-channels-table__item:first-child {
    width: 5rem
}

@media only screen and (min-width:23.375rem) {
    .x-channels-table--col-9 .x-channels-table__item:first-child {
        width: 6.875rem
    }
}

.x-channels-table--col-10 .x-channels-table__item:first-child {
    width: 5rem
}

@media only screen and (min-width:23.375rem) {
    .x-channels-table--col-10 .x-channels-table__item:first-child {
        width: 6.875rem
    }
}

.x--is-fixed .x-channels-container__summary,
.x--is-fixed .x-channels-table__heading {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 10
}

.x--is-fixed .x-channels-container__summary {
    left: 50%;
    transform: translateX(-50%);
    z-index: 11
}

.x--is-fixed .x-channels-table__heading {
    background-color: #fff;
    box-shadow: 0 .375rem .625rem 0 rgba(0, 0, 0, .2)
}

.x--is-fixed .x-channels__preferred-category-sort .x-channels-table__heading .x-channels-table__preferred-item {
    background: #fff
}

.x-channels--fullylocalized .x-channels-container__address .x-icon {
    color: #2b9cd8
}

@media print {
    .x-channels-table .x-channels-table__item-text {
        height: auto;
        opacity: 1
    }

    .x-channels-table .x-channels-table__item-image,
    .x-channels-table .x-channels-table__main-title {
        display: none
    }
}

.x-channel-overlay-container__headings .x-display3 {
    margin-bottom: .75rem
}

.x-channel-overlay-container__headings .x-heading4 {
    margin-bottom: 1.5rem
}

.x-channel-overlay-container__logos {
    padding: 0 0 .75rem
}

.x-channel-number {
    color: #191919;
    font-weight: 700;
    min-width: 50px;
    padding-bottom: 12px
}

.x-channels-existing-view {
    align-items: center;
    display: flex;
    flex-direction: column
}

.x-channels__legal-with-recommened {
    padding-top: .75rem;
    width: 100%
}

.x-channels__recommended-icon {
    margin-right: .375rem;
    position: relative;
    top: -1px
}

.x-channels__recommended-label {
    width: 100%
}

.x-recommended-highlight {
    background-color: #5837cb;
    display: table-cell;
    width: 1px
}

@media only screen and (min-width:20rem) {
    .x-recommended-highlight.right {
        transform: translateX(-3.2px)
    }
}

.x-recommended-highlight.left {
    transform: translateX(.1px)
}

.clu-table-tiles {
    position: relative;
    width: 100%
}

.clu-table-tiles .image-grid {
    padding: 0
}

.clu-table-tiles .image-grid--extra__tiles {
    display: none;
    width: 100%
}

.clu-table-tiles .image-grid--extra__link {
    justify-content: center;
    margin-bottom: 1.5rem
}

.clu-table-tiles__categories .image-grid-item--inactive .image-grid-item__inner {
    border: .063rem solid rgba(199, 205, 210, .4)
}

.clu-table-tiles__categories .image-grid-item--inactive .image-grid-item__inner .image-grid-item__cta p {
    border-top: .063rem solid rgba(199, 205, 210, .4)
}

.clu-table-tiles__categories .image-grid-item--inactive .image-grid-item__heading,
.clu-table-tiles__categories .image-grid-item--inactive .image-grid-item__img img {
    opacity: .4
}

.clu-table-tiles__category {
    flex-direction: column-reverse;
    margin: 0 0 .188rem
}

.clu-table-tiles__category:last-of-type {
    margin-bottom: 0
}

.clu-table-tiles__category-title {
    background-color: #f2f4f5;
    padding: 2.063rem 2.25rem 2.063rem .75rem;
    position: relative
}

.clu-table-tiles__category-title [data-drawer] {
    position: absolute;
    right: .75rem;
    top: 1.938rem
}

.clu-table-tiles__category-tiles {
    display: none
}

.clu-table-tiles__category-tiles[aria-hidden=false]~.clu-table-tiles__category-title {
    background: none
}

.clu-table-tiles__summary {
    border-bottom: .063rem solid #e6eaed;
    padding: 1.5rem 0 2.25rem
}

.clu-table-tiles__summary .image-grid {
    justify-content: flex-start
}

.clu-table-tiles__category.clu-table-tiles__category--inactive-row .image-grid-item--mini {
    flex-basis: 100%;
    margin-bottom: 0;
    max-width: 100%
}

.clu-table-tiles__category.clu-table-tiles__category--inactive-row .image-grid-item--mini .image-grid-item__cta {
    display: none
}

.clu-table-tiles__category.clu-table-tiles__category--inactive-row .image-grid-item--mini .image-grid-item__inner {
    border: 0;
    border-bottom: .063rem solid #dde2e6;
    cursor: default;
    flex-direction: row;
    min-height: auto;
    padding: .75rem 0
}

.clu-table-tiles__category.clu-table-tiles__category--inactive-row .image-grid-item--mini .image-grid-item__heading {
    margin-bottom: 0;
    padding-bottom: 0;
    text-align: left
}

.clu-table-tiles__category.clu-table-tiles__category--inactive-row .image-grid-item--mini .image-grid-item__heading h3 {
    font-size: 1rem
}

.clu-table-tiles__category.clu-table-tiles__category--inactive-row .image-grid-item--mini .image-grid-item__img {
    margin: 0 .375rem 0 0
}

.clu-table-tiles__category.clu-table-tiles__category--inactive-row .image-grid-item--mini .image-grid-item__img img {
    max-height: 1.563rem;
    max-width: 1.563rem;
    padding: 0
}

.clu-table-tiles__category.clu-table-tiles__category--inactive-row .image-grid--extra__link {
    margin-top: 1.5rem
}

.clu-table-tiles__category.clu-table-tiles__category--inactive-row .clu-table-tiles__category--inactive-row__message {
    margin-bottom: 1.125rem
}

.clu-table-tiles__category.clu-table-tiles__category--inactive-row .image-grid-parent {
    padding: 0 .75rem
}

.clu-table-tiles__category.clu-table-tiles__category--inactive-row .clu-table-tiles__category-title--description {
    display: none;
    margin-top: .375rem
}

.clu-table-tiles__category.clu-table-tiles__category--inactive-row .clu-table-tiles__category-tiles[aria-hidden=false]~.clu-table-tiles__category-title {
    padding-bottom: 1.125rem
}

.clu-table-tiles__category.clu-table-tiles__category--inactive-row .clu-table-tiles__category-tiles[aria-hidden=false]~.clu-table-tiles__category-title .clu-table-tiles__category-title--description {
    display: block
}

@media only screen and (min-width:48rem) {
    .x-channels-container__nav-wrapper {
        background: #fff
    }

    .x-channels-container__nav-wrapper .top-nav {
        text-align: left
    }

    .x-channels-container__nav-wrapper .top-nav__item {
        margin: 0 1.875rem 0 0
    }

    .x-channels-container__nav-wrapper .x-channels-container__existing-customer {
        margin: 0
    }

    .x-channels-container__views {
        margin: 0 auto 3.375rem;
        padding: 0 .375rem
    }

    .x-channels-container__featured [class^=x-flex__col] {
        max-width: 100%;
        padding: 0 .188rem
    }

    .x-channels-container__featured-tab .x-channels-container__numbers {
        font-size: 24px;
        font-size: 1.5rem;
        font-weight: 300;
        line-height: 1.083
    }

    .x-channels-container__summary {
        padding: .75rem .5rem .75rem 1rem
    }

    .x-channels-container__summary .x-channels-container__options .x-channels-container__summary-col {
        margin: 0
    }

    .x-channels-container__summary .x-channels-container__options .x-channels-container__summary-col--sort {
        max-width: 8.5rem;
        padding: 0
    }

    .x-channels-container__summary .x-channels-container__options .x-channels-container__summary-col--search {
        padding: 0 0 0 .75rem
    }

    .x-channels-container__summary .x-channels-container__options .x-channels-container__summary-col--search div.x-field--search {
        min-width: 18.438rem;
        padding: 0
    }

    .x-channels-container__summary .x-channels-container__options .x-channels-container__options-hd {
        display: flex;
        padding-right: .75rem
    }

    .x-channels-container__summary .x-channels-container__options .x-channels-container__summary-btn {
        display: none
    }

    .x-channels-container__summary .x-channels-container__options .x-field--search-wrap,
    .x-channels-container__summary .x-channels-container__options .x-field--select {
        display: block
    }

    .x-channels-container__summary .x--active .x-field--search-wrap {
        background-color: inherit;
        position: static
    }

    .x-channels-container__summary .x--active .x-field--search-wrap-inner {
        bottom: auto;
        margin: auto;
        position: static;
        top: auto;
        transform: none;
        width: auto
    }

    .x-channels-container__summary .x-channels-container__summary-sort-drawer {
        display: none
    }

    .x-channels-container__summary .x--active .x-channels-container__summary-sort-drawer {
        transform: translateY(100%);
        visibility: hidden
    }

    .x-channels-container__summary .x-field--search .x-button--icon {
        display: none
    }

    .x-channels-table .x-channels-table__item {
        border-bottom: .375rem solid #eef1f3;
        border-right: .375rem solid #eef1f3;
        padding: .75rem
    }

    .x-channels-table .x-channels-table__row:last-child .x-channels-table__item[data-channel-tier].x-channels-table__preferred-item {
        background: linear-gradient(0deg, #fff 1%, #fff 97%, #5837cb 0, #5837cb)
    }

    .x-channels-table--package-selector .x-channels-table__heading .x-channels-table__item[role=columnheader] {
        height: 10.313rem;
        padding-top: 1.125rem;
        vertical-align: initial
    }

    .x-channels-table--package-selector.x-channels__preferred-category-sort .x-channels-table__heading .x-channels-table__preferred-item {
        background: linear-gradient(0deg, #fff 1%, #fff 97%, #5837cb 0, #5837cb)
    }

    .x-channels-table--package-selector .x-field--checkbox .x-field__label__text {
        padding-bottom: 0
    }

    .x-channels-table--package-selector .x-field--checkbox .x-field__label__text .x-heading5.x-hide--small-and-under {
        display: flex !important
    }

    .x-channels-table .x-channels-table__heading .x-channels-table__numbers {
        font-size: 24px;
        font-size: 1.5rem;
        font-weight: 300;
        line-height: 1.083;
        margin-top: .375rem
    }

    .x-channels-table .x-channels-table__heading .x-channels-table__main-title {
        font-size: 14px;
        font-size: .875rem;
        line-height: 1.143
    }

    .x-channels-table .x-channels-table__heading .x-channels-table__item {
        height: 5.75rem;
        padding: .75rem .375rem 1.125rem;
        vertical-align: bottom
    }

    .x-channels-table .x-channels-table__heading .x-channels-table__item .x-field--checkbox .x-field__label:before {
        margin-bottom: .75rem;
        margin-top: 0
    }

    .x-channels-table .x-channels-table__heading .x-channels-table__item.x-channels-table__preferred-item:before {
        border-top: 4px solid #5837cb;
        height: 104%
    }

    .x-channels-table .x-channels-table__heading+.x-channels-table__row {
        border-top: .375rem solid #eef1f3
    }

    .x-channels-table--col-6 .x-channels-table__item,
    .x-channels-table--col-6 .x-channels-table__item:first-child {
        width: 16.66667%
    }

    .x-channels-table--col-7 .x-channels-table__item,
    .x-channels-table--col-7 .x-channels-table__item:first-child {
        width: 14.28571%
    }

    .x-channels-table--col-8 .x-channels-table__item,
    .x-channels-table--col-8 .x-channels-table__item:first-child {
        width: 12.5%
    }

    .x-channels-table--col-9 .x-channels-table__item,
    .x-channels-table--col-9 .x-channels-table__item:first-child {
        width: 11.11111%
    }

    .x-channels-table--col-10 .x-channels-table__item,
    .x-channels-table--col-10 .x-channels-table__item:first-child {
        width: 10%
    }

    .x-channel-overlay-container__headings .x-heading4 {
        margin-bottom: .75rem
    }

    .x-channel-overlay-container__logos {
        padding: 1.5rem 0
    }

    .x-channel-number {
        padding-bottom: 0;
        padding-right: 12px
    }

    .x-channels-existing-view {
        flex-direction: row
    }
}

.channel-cell-border {
    border-bottom: 6px solid var(--patch-grey-20)
}

.channel-cell-border:not(:last-child) {
    border-right: 6px solid var(--patch-grey-20)
}

.available-indicator {
    border-radius: .313rem;
    height: .625rem;
    margin: 0 auto;
    width: .625rem
}

.prism-checkbox-width {
    width: 20px
}

.channel-table-column-header {
    border-right: 6px solid var(--patch-grey-20)
}

.channel-table-column-header-bottom {
    border-bottom: 6px solid var(--patch-grey-20)
}

.fixedTableHeader {
    top: 72px
}

@media (max-width:768px) {
    .fixedTableHeader {
        top: 63px
    }
}

.x-clu-drawer {
    bottom: 0;
    flex-wrap: nowrap;
    left: 0;
    position: fixed;
    transform: translateY(100%);
    transition: opacity .3s ease-in-out 0s, visibility .3s ease-in-out 0s, transform .3s ease-in-out 0s, height .6s ease-in-out 0s;
    width: 100%;
    z-index: 60
}

.x-clu-drawer--active {
    transform: translateY(0)
}

.x-clu-drawer--scroll-hide {
    opacity: 0;
    visibility: hidden
}

.x-clu-drawer .x-clu-drawer-wrapper {
    margin: 12px 0
}

.x-clu-drawer .x-clu-drawer-description {
    font-weight: 700;
    margin: 0 12px 12px
}

.x-channel-lineup--drawer-open .x-clu-drawer {
    display: none
}

@media screen and (min-width:768px) {
    .x-clu-drawer .x-clu-drawer-wrapper {
        margin: 18px 0
    }

    .x-clu-drawer .x-clu-drawer-description {
        display: inline;
        margin: 0 24px 0 0
    }
}

.top-nav {
    display: block;
    position: relative;
    text-align: center
}

.top-nav__item {
    padding: 0
}

.top-nav__item-link {
    color: #44484c;
    display: block;
    padding: 12px 15px
}

.top-nav__item-link:hover {
    text-decoration: none
}

.top-nav__item-link:visited {
    color: #44484c
}

.x-content-banner,
.x-content-banner--inline-background,
.x-content-banner--slant-down,
.x-content-banner--slant-up {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    padding: .75rem;
    position: relative
}

.x-content-banner--inline-background>.x-flex-row,
.x-content-banner--slant-down>.x-flex-row,
.x-content-banner--slant-up>.x-flex-row,
.x-content-banner>.x-flex-row {
    max-width: 80rem
}

.x-content-banner--inline-background {
    background-size: 0 0
}

@media only screen and (min-width:48rem) {
    .x-content-banner--inline-background {
        background-repeat: no-repeat;
        background-size: cover
    }
}

@media only screen and (min-width:23.375rem) and (max-width:47.938rem) {
    .x-content-banner--slant-up {
        margin-top: 2.25rem
    }
}

.x-content-banner--slant-up:before {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    content: "";
    height: 4.5rem;
    position: absolute;
    top: -2.25rem;
    transform: skewY(-1.25deg);
    transform-origin: left center;
    width: 100%
}

@media only screen and (min-width:64rem) {
    .x-content-banner--slant-up:before {
        height: 6.75rem;
        top: -2.25rem;
        transform: skewY(-1.5deg)
    }
}

.x-content-banner--slant-down:before {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    content: "";
    height: 4.5rem;
    position: absolute;
    top: -2.25rem;
    transform: skewY(-1.25deg);
    transform-origin: right center;
    width: 100%
}

@media only screen and (min-width:64rem) {
    .x-content-banner--slant-down:before {
        height: 6.75rem;
        top: -2.25rem;
        transform: skewY(-1.5deg)
    }
}

.x-content-banner__mobile-image {
    display: block
}

@media only screen and (min-width:48rem) {
    .x-content-banner__mobile-image {
        display: none
    }
}

.x-content-banner__media,
.x-content-banner__media--pull-up-full,
.x-content-banner__media--push-down-full {
    position: static
}

@media only screen and (min-width:48rem) {

    .x-content-banner__media,
    .x-content-banner__media--pull-up-full,
    .x-content-banner__media--push-down-full {
        position: relative
    }
}

.x-content-banner__media--push-down-full {
    top: 9rem;
    z-index: 10
}

.x-content-banner__media--pull-up-full {
    bottom: 9rem;
    z-index: 10
}

.x-content-banner__portrait--clipped {
    align-self: flex-end;
    margin: 1em auto;
    max-width: 20rem
}

@media only screen and (min-width:64rem) {
    .x-content-banner__portrait--clipped {
        margin: 0
    }
}

.x-content-banner__content>.x-button--anchor,
.x-content-banner__content>.x-button--solid,
.x-content-banner__content>a,
.x-content-banner__content>button {
    display: inline-block;
    margin: 1.125rem 0
}

@media only screen and (min-width:48rem) {
    .x-content-banner--pad-top-none {
        padding-top: 0
    }

    .x-content-banner--pad-top-none .x-content-banner__media {
        padding: 0
    }

    .x-content-banner--pad-top-none .x-content-banner__content {
        padding-top: 4.5rem
    }

    .x-content-banner--pad-bottom-none {
        padding-bottom: 0
    }

    .x-content-banner--pad-bottom-none .x-content-banner__media {
        padding: 0
    }

    .x-content-banner--pad-bottom-none .x-content-banner__content {
        padding-bottom: 4.5rem
    }

    .x-content-banner--pad-top-sm {
        padding-top: 1.5rem
    }

    .x-content-banner--pad-top-md {
        padding-top: 4.5rem
    }

    .x-content-banner--pad-top-lg {
        padding-top: 13.5rem
    }

    .x-content-banner--pad-top-xl {
        padding-top: 27rem
    }

    .x-content-banner--pad-bottom-sm {
        padding-bottom: 1.5rem
    }

    .x-content-banner--pad-bottom-md {
        padding-bottom: 4.5rem
    }

    .x-content-banner--pad-bottom-lg {
        padding-bottom: 13.5rem
    }

    .x-content-banner--pad-bottom-xl {
        padding-bottom: 27rem
    }
}

.x-content-banner--hero {
    display: flex;
    height: 100vh;
    padding: 1.25rem
}

.x-language-banner {
    border-bottom: 1px solid #dde2e6;
    margin: 1.875rem auto;
    padding: 0 .75rem .75rem
}

.x-language-banner h3 {
    margin-bottom: .75rem
}

.gradient-banner,
.x-freeform-text {
    padding: .75rem
}

.gradient-banner__content {
    text-align: center
}

.gradient-banner__heading {
    color: #191919;
    font-size: 12px;
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .031rem;
    line-height: 1.5;
    margin: 0;
    text-transform: uppercase
}

.xfinity-web-font-override .gradient-banner__heading {
    font-size: 15px;
    font-size: .938rem;
    font-weight: 700;
    letter-spacing: .125rem;
    line-height: 1.2
}

@media only screen and (min-width:48rem) {
    .gradient-banner__heading {
        color: #191919;
        font-size: 15px;
        font-size: .938rem;
        font-weight: 700;
        letter-spacing: .031rem;
        line-height: 1.467;
        margin: 0;
        text-transform: uppercase
    }
}

.channel-logo-image {
    display: block;
    max-height: 32px;
    max-width: 62px;
    width: 100%
}

.channel-logo .rounded-2xl {
    border-radius: 1rem
}

.channel-logo .rounded-lg {
    border-radius: .5rem
}

.channel-logo .text-xs {
    line-height: 20px
}

:root {
    --color-dark-bg: #2f3845;
    --color-light-bg: #fff;
    --color-border-dark: #44484c;
    --color-border-light: #dde2e6;
    --color-loading: #051219;
    --color-product-border: #868f96;
    --font-weight-bold: 700;
    --padding-main: 0.75rem;
    --padding-header: 0.375rem;
    --margin-title: 2.25rem;
    --margin-cta: 1.125rem 0 1.125rem 1.5rem;
    --max-width: 1280px
}

.xc-current-plan-nav__title {
    font-size: 1rem;
    font-weight: var(--font-weight-bold);
    margin-right: var(--margin-title)
}

.xc-current-plan-nav--mobile .xc-current-plan-nav__title {
    align-items: center;
    display: flex;
    font-weight: var(--font-weight-bold)
}

.xc-current-plan-nav .xc-current-plan-nav--desktop .xc-current-plan-nav__title,
.xc-current-plan-nav .xc-current-plan-nav--mobile .xc-current-plan-nav__title,
.xc-current-plan-nav--desktop .xc-current-plan-nav .xc-current-plan-nav__title {
    font-weight: var(--font-weight-bold)
}

.xc-current-plan-nav__plan-info {
    align-items: center;
    font-weight: var(--font-weight-bold)
}

.xc-current-plan-nav--desktop .xc-current-plan-nav__plan-info {
    align-items: center;
    font-weight: var(--font-weight-bold);
    padding-left: var(--padding-main)
}

.xc-current-plan-nav .xc-current-plan-nav--desktop .xc-current-plan-nav__product-list__item__name,
.xc-current-plan-nav--desktop .xc-current-plan-nav__product-list__item__name {
    font-weight: var(--font-weight-bold);
    margin-right: .188rem
}

@media (min-width:64rem) {

    .xc-current-plan-nav .xc-current-plan-nav--desktop .xc-current-plan-nav__product-list__item__name,
    .xc-current-plan-nav--desktop .xc-current-plan-nav__product-list__item__name {
        margin-right: .375rem
    }
}

.xc-current-plan-nav--mobile .xc-current-plan-nav__price .x-price-lockup__additional {
    align-self: flex-start;
    font-weight: var(--font-weight-bold);
    line-height: 1
}

.xc-current-plan-nav .xc-current-plan-nav--mobile .xc-current-plan-nav__price .x-price-lockup__additional {
    font-weight: var(--font-weight-bold)
}

.xc-current-plan-nav--desktop .xc-current-plan-nav__plan-cta .xc-current-plan-nav__price .x-price-lockup__additional,
.xc-current-plan-nav--desktop .xc-current-plan-nav__plan-info .xc-current-plan-nav__price .x-price-lockup__additional {
    align-self: flex-start;
    font-weight: var(--font-weight-bold);
    line-height: 1;
    text-transform: none
}

.xc-current-plan-nav .xc-current-plan-nav--desktop .xc-current-plan-nav__plan-cta .xc-current-plan-nav__price .x-price-lockup__additional,
.xc-current-plan-nav .xc-current-plan-nav--desktop .xc-current-plan-nav__plan-info .xc-current-plan-nav__price .x-price-lockup__additional {
    font-weight: var(--font-weight-bold)
}

.xc-current-plan-nav__product-list {
    list-style: none;
    padding-left: 0
}

.xc-current-plan-nav__product-list,
.xc-current-plan-nav__product-list__item {
    align-items: center;
    display: flex
}

.xc-current-plan-nav--mobile .xc-current-plan-nav__products .xc-current-plan-nav__product-list {
    margin: 0
}

.xc-current-plan-nav__product-list__item {
    border-right: 1px solid var(--color-product-border);
    margin-right: .375rem;
    padding-right: .375rem
}

@media (min-width:48rem) {
    .xc-current-plan-nav__product-list__item {
        margin-right: .75rem;
        padding-right: .75rem
    }
}

.xc-current-plan-nav__product-list__item--loading {
    background-color: var(--color-loading);
    margin-right: .75rem;
    width: 6.25rem
}

.xc-current-plan-nav__product-list__item:last-child {
    border-right: 0;
    margin-right: 0;
    padding-right: 0
}

.xc-current-plan-nav__product-list__item__details,
.xc-current-plan-nav__product-list__item__details--hidden {
    display: none;
    line-height: 1
}

@media (min-width:64rem) {

    .xc-current-plan-nav__product-list__item__details,
    .xc-current-plan-nav__product-list__item__details--hidden {
        display: inline
    }
}

.xc-current-plan-nav__product-list__item:nth-last-child(2) .xc-current-plan-nav__product-list__item__details--hidden {
    margin-right: -.625rem
}

.xc-current-plan-nav__price--loading .x-price-lockup__amount {
    background-color: var(--color-loading);
    width: 6.25rem
}

.xc-current-plan-nav--mobile .xc-current-plan-nav__price .x-price-lockup__amount {
    font-weight: var(--font-weight-bold);
    line-height: 1
}

.xc-current-plan-nav--mobile .xc-current-plan-nav__cta.x-button,
.xc-current-plan-nav--mobile .xc-current-plan-nav__price .x-price-lockup__amount {
    display: none
}

.xc-current-plan-nav--desktop .xc-current-plan-nav__plan-cta .xc-current-plan-nav__price .x-price-lockup__amount,
.xc-current-plan-nav--desktop .xc-current-plan-nav__plan-info .xc-current-plan-nav__price .x-price-lockup__amount {
    font-weight: var(--font-weight-bold);
    line-height: 1
}

.xc-current-plan-nav .xc-current-plan-nav--desktop .xc-current-plan-nav__plan-cta .xc-current-plan-nav__price .x-price-lockup__amount,
.xc-current-plan-nav .xc-current-plan-nav--desktop .xc-current-plan-nav__plan-info .xc-current-plan-nav__price .x-price-lockup__amount {
    font-weight: var(--font-weight-bold)
}

.xc-current-plan-nav--desktop .xc-current-plan-nav__plan-cta .xc-current-plan-nav__price .x-price-lockup__dollar,
.xc-current-plan-nav--desktop .xc-current-plan-nav__plan-info .xc-current-plan-nav__price .x-price-lockup__dollar,
.xc-current-plan-nav--mobile .xc-current-plan-nav__price .x-price-lockup__dollar {
    font-weight: var(--font-weight-bold);
    line-height: 1
}

.xc-current-plan-nav .xc-current-plan-nav--desktop .xc-current-plan-nav__plan-cta .xc-current-plan-nav__price .x-price-lockup__dollar,
.xc-current-plan-nav .xc-current-plan-nav--desktop .xc-current-plan-nav__plan-info .xc-current-plan-nav__price .x-price-lockup__dollar {
    font-weight: var(--font-weight-bold)
}

.xc-current-plan-nav__plan-cta {
    flex-direction: column;
    padding: var(--padding-main) var(--padding-main) 0
}

@media (min-width:48rem) {
    .xc-current-plan-nav__plan-cta {
        flex-direction: row
    }
}

@media (min-width:67.8125rem) {
    .xc-current-plan-nav__plan-cta {
        padding-top: 0
    }
}

.xc-current-plan-nav__cta {
    margin: var(--margin-cta) !important
}

.xc-current-plan-nav--error .xc-current-plan-nav--desktop .xc-current-plan-nav__cta,
.xc-current-plan-nav--error .xc-current-plan-nav--mobile .xc-current-plan-nav__cta {
    align-items: center;
    margin: 0;
    padding-top: 0
}

.xc-current-plan-nav .b {
    font-weight: var(--font-weight-bold)
}

.xc-current-plan-nav__title--loading {
    background-color: var(--color-loading);
    color: var(--color-loading) !important
}

.xc-current-plan-nav__inner {
    margin: 0 auto;
    max-width: var(--max-width);
    padding: 0 .563rem;
    width: 100%
}

@media (min-width:48rem) {
    .xc-current-plan-nav__inner {
        padding: 0 1.125rem
    }
}

@media (min-width:64rem) {
    .xc-current-plan-nav__inner {
        padding: 0
    }
}

@media (min-width:23.375rem) {
    .xc-current-plan-nav__inner {
        padding: var(--padding-main) 1.125rem
    }
}

@media (min-width:48rem) {
    .xc-current-plan-nav__inner {
        padding: var(--padding-main) 0
    }
}

.xc-current-plan-nav__inner.x-no-padding {
    padding: .75rem 0
}

.xc-current-plan-nav--mobile .xc-current-plan-nav__products {
    margin-top: var(--padding-main)
}

.xc-current-plan-nav--mobile .xc-current-plan-nav__price {
    padding-top: var(--padding-main)
}

.xc-current-plan-nav--desktop {
    display: none
}

@media (min-width:48rem) {
    .xc-current-plan-nav--desktop {
        display: flex
    }

    .xc-current-plan-nav--mobile {
        display: none !important
    }
}

@media (max-width:47.9375rem) {
    .xc-current-plan-nav--desktop {
        display: none !important
    }
}

.xc-current-plan-nav--desktop .xc-current-plan-nav__plan-cta,
.xc-current-plan-nav--desktop .xc-current-plan-nav__plan-info {
    align-items: center;
    padding: .75rem .75rem 0
}

.xc-current-plan-nav--desktop .xc-current-plan-nav__plan-cta .x-price-lockup-container,
.xc-current-plan-nav--desktop .xc-current-plan-nav__plan-info .x-price-lockup-container {
    width: auto
}

.xc-current-plan-nav--desktop .xc-current-plan-nav__plan-cta .xc-current-plan-nav__price,
.xc-current-plan-nav--desktop .xc-current-plan-nav__plan-info .xc-current-plan-nav__price {
    align-items: center
}

.xc-current-plan-nav--desktop .xc-current-plan-nav__plan-cta .xc-current-plan-nav__price .x-price-lockup__monthly,
.xc-current-plan-nav--desktop .xc-current-plan-nav__plan-info .xc-current-plan-nav__price .x-price-lockup__monthly {
    font-size: .875rem;
    margin-right: .375rem
}

.xc-current-plan-nav--desktop .xc-current-plan-nav__cta.x-button--anchor {
    display: none
}

@media (min-width:48rem) {

    .x-ui-theme--dark .xc-current-plan-nav--desktop .xc-current-plan-nav__cta,
    .xc-current-plan-nav--desktop .xc-current-plan-nav__cta:visited {
        color: #fff
    }

    .x-ui-theme--dark .xc-current-plan-nav--desktop .xc-current-plan-nav__cta:focus,
    .x-ui-theme--dark .xc-current-plan-nav--desktop .xc-current-plan-nav__cta:hover {
        color: #00619a
    }
}

.xc-current-plan-nav__cta--loading {
    background-color: var(--color-loading);
    color: var(--color-loading)
}

.xc-current-plan-nav__cta--loading.x-button--outline-white {
    background-color: var(--color-loading);
    border: 0;
    border-radius: 0;
    color: var(--color-loading) !important
}

.xc-current-plan-nav__cta--loading.x-button--outline-white:focus,
.xc-current-plan-nav__cta--loading.x-button--outline-white:hover,
.xc-current-plan-nav__cta--loading.x-button--outline-white:visited {
    color: var(--color-loading) !important
}

.xc-current-plan-nav.x-ui-theme--dark {
    background-color: var(--color-dark-bg);
    border: 0
}

.xc-current-plan-nav.x-ui-theme--light {
    background-color: var(--color-light-bg)
}

@media (min-width:64rem) {
    .xc-current-plan-nav.x-ui-theme--dark {
        border-bottom: 1px solid var(--color-border-dark)
    }

    .xc-current-plan-nav.x-ui-theme--light {
        border-bottom: .063rem solid var(--color-border-light)
    }

    .xc-current-plan-nav.x-ui-theme--dark .xc-current-plan-nav__header,
    .xc-current-plan-nav.x-ui-theme--light .xc-current-plan-nav__header {
        border: 0;
        padding-bottom: 0
    }
}

@media (min-width:23.375rem) {

    .xc-current-plan-nav.x-ui-theme--dark,
    .xc-current-plan-nav.x-ui-theme--light {
        border: 0
    }

    .xc-current-plan-nav.x-ui-theme--dark .xc-current-plan-nav__header {
        border-bottom: .063rem solid var(--color-border-dark);
        padding-bottom: var(--padding-header)
    }

    .xc-current-plan-nav.x-ui-theme--light .xc-current-plan-nav__header {
        border-bottom: .063rem solid var(--color-border-light);
        padding-bottom: var(--padding-header)
    }
}

.xc-current-plan-nav--error {
    padding-bottom: var(--padding-main);
    padding-top: var(--padding-main)
}

.xc-current-plan-nav--desktop .xc-current-plan-nav__plan-cta {
    align-items: center;
    padding: .75rem .75rem 0
}

.xc-current-plan-nav--error .xc-current-plan-nav--desktop .xc-current-plan-nav__cta,
.xc-current-plan-nav--error .xc-current-plan-nav--desktop .xc-current-plan-nav__plan-cta,
.xc-current-plan-nav--error .xc-current-plan-nav--mobile .xc-current-plan-nav__cta,
.xc-current-plan-nav--error .xc-current-plan-nav--mobile__plan-cta {
    align-items: center;
    margin: 0;
    padding-top: 0
}

div.x-dealfinder-wrapper .x-compare__section ul.x-list {
    list-style: disc
}

.dealsDollar {
    line-height: 35px
}

.dealsSign {
    line-height: 48px
}

.deals-tabs-only-padding.horizontal.sc-prism-tabs-h .tab-header.sc-prism-tabs {
    padding-left: 1.75rem
}

.deals-cards-container {
    border-bottom-left-radius: var(--prism-border-radius-lg, .5rem);
    border-bottom-right-radius: var(--prism-border-radius-lg, .5rem)
}

.bg-white.rounded-large .deals-cards-container {
    border-radius: 0
}

.full-image {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 0 0;
    overflow: hidden;
    position: relative;
    width: 100%
}

@media only screen and (min-width:48rem) {
    .full-image {
        background-size: cover;
        height: 100%
    }
}

@media only screen and (min-width:80rem) {
    .full-image.full-image--contain {
        background-size: contain
    }
}

.full-image__content {
    display: flex;
    margin: 0 auto;
    max-width: 64rem;
    min-height: 18.75rem;
    padding: 2.25rem .75rem;
    position: relative;
    width: 100%;
    z-index: 3
}

.sc-page-edit .full-image__content,
.sc-page-edit .full-image__content>.x-flex-row {
    min-height: 50vh
}

.full-image.full-image--right .full-image__content>.x-flex-row {
    display: flex;
    flex: 0 1 auto;
    flex-direction: row-reverse;
    flex-wrap: wrap;
    margin: 0 auto;
    width: 100%
}

.full-image .full-image__disclaimer {
    margin-top: 1.5rem
}

@media only screen and (min-width:48rem) {
    .full-image .full-image__disclaimer {
        margin-top: 2.25rem
    }
}

.full-image__mobile-image {
    width: 100%
}

@media only screen and (min-width:48rem) {
    .full-image__mobile-image {
        display: none
    }
}

.full-image__mobile-image img {
    height: auto;
    width: 100%
}

@media only screen and (min-width:48rem) {
    .full-image__content {
        min-height: 100vh;
        padding: 0 1.5rem
    }

    .full-image__content>.x-flex-row {
        min-height: 100vh;
        padding: 3rem 0
    }

    .full-image__content.full-image__content-600h,
    .full-image__content.full-image__content-600h>.x-flex-row {
        min-height: 600px
    }
}

.full-image__content [class*=x-price-lockup] {
    justify-content: center
}

@media only screen and (min-width:48rem) {
    .full-image__content [class*=x-price-lockup] {
        justify-content: flex-start
    }
}

.full-image__content .x-list {
    margin: 0 auto 1.25rem;
    max-width: 21.875rem;
    text-align: left
}

@media only screen and (min-width:48rem) {
    .full-image__content .x-list {
        margin: 0 0 1.25rem;
        max-width: 100%
    }
}

.full-image__hide-on-mobile {
    display: none
}

@media only screen and (min-width:48rem) {
    .full-image__hide-on-mobile {
        display: block
    }
}

.caralax {
    overflow: hidden;
    position: relative;
    width: 100%;
    z-index: 0
}

@media only screen and (min-width:48rem) {
    .caralax .full-image {
        background-image: none !important
    }
}

._caralax-mode-on main>[id=details]>div:not(.caralax),
._caralax-mode-on main>[id=details]>section:not(.caralax),
._caralax-mode-on main>div:not(.caralax),
._caralax-mode-on main>section:not(.caralax),
._caralax-mode-on main>section:not([id=details]) {
    position: relative;
    z-index: 2
}

._caralax-mode-on main>section[id=details] {
    z-index: 1
}

._caralax-mode-on footer,
._caralax-mode-on header {
    position: relative;
    z-index: 5
}

._caralax-mode-on .splash-action,
._caralax-mode-on [data-react-mount=GbbOffercard] {
    background-color: #eef1f3
}

._caralax-mode-on [data-react-mount=GbbOffercard] .splash-action {
    background-color: initial
}

.caralax__bg-wrap {
    display: none
}

@media only screen and (min-width:48rem) {
    .caralax__bg-wrap {
        display: block
    }
}

.caralax__bg {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    bottom: 0;
    left: 0;
    opacity: 0;
    position: fixed;
    right: 0;
    top: 0;
    transform: translateZ(0);
    transition: opacity .4s ease-in-out 0s;
    width: 100%;
    will-change: opacity
}

.caralax__bg._active {
    opacity: 1
}

.caralax__indicators-wrap {
    display: none;
    height: 100%;
    opacity: 0;
    position: fixed;
    right: .75rem;
    top: 0;
    transition: opacity .15s ease-in-out 0s, visibility .15s ease-in-out 0s;
    visibility: hidden;
    width: .938rem;
    will-change: opacity, visibility;
    z-index: 4
}

._show-indicators .caralax__indicators-wrap {
    opacity: 1;
    visibility: visible
}

@media only screen and (min-width:48rem) {
    .caralax__indicators-wrap {
        display: block
    }
}

@media (min-width:1120px) {
    .caralax__indicators-wrap {
        right: 2.5rem
    }
}

@media (min-width:1300px) {
    .caralax__indicators-wrap {
        right: 6.25rem
    }
}

@media only screen and (min-width:1441px) {
    .caralax__indicators-wrap {
        right: 12.5rem
    }
}

.caralax__indicators-wrap .caralax__indicators {
    margin: 0;
    padding: 0;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%)
}

.caralax__indicators-wrap li,
.caralax__indicators-wrap ul {
    list-style: none;
    margin: 0;
    padding: 0
}

.caralax__indicators-wrap .caralax__indicators-link {
    background-color: initial;
    border: .125rem solid #fff;
    border-radius: 3.125rem;
    display: block;
    height: .75rem;
    margin: 0 0 1.5rem;
    position: relative;
    width: .75rem
}

.caralax__indicators-wrap ._active .caralax__indicators-link {
    background-color: #fff
}

.caralax__indicators-wrap li:last-child .caralax__indicators-link {
    margin-bottom: 0
}

.sc-page-edit .caralax {
    padding: 2.5rem 0
}

#fcc-nutrition-hub .horizontal.sc-prism-tabs-h {
    gap: 0
}

@media (max-width:767px) {
    #cta-btn {
        --width: 100%
    }
}

.now--selected {
    --tw-bg-opacity: 1;
    background-clip: padding-box;
    background-color: rgb(255 255 255/var(--tw-bg-opacity, 1));
    border: 2px solid transparent;
    border-radius: .5rem;
    box-sizing: border-box;
    position: relative
}

.now--selected:before {
    background-image: var(--background-image-gradient-expressive, linear-gradient(90deg, #28156b, #7b30ff));
    border-radius: inherit;
    bottom: 0;
    content: "";
    left: 0;
    margin: -2px;
    position: absolute;
    right: 0;
    top: 0;
    z-index: -1
}

.FormJson .form-field {
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    padding-left: .25rem;
    padding-right: .25rem
}

.FormJson prism-input {
    border: none !important;
    height: auto !important;
    padding: 0 !important
}

.FormJson .x-field--textarea textarea,
.FormJson .x-input__text,
.FormJson [type=date],
.FormJson [type=email],
.FormJson [type=number],
.FormJson [type=password],
.FormJson [type=search],
.FormJson [type=tel],
.FormJson [type=text] {
    height: auto !important
}

#search-form {
    grid-area: form;
    place-items: center
}

#search-form form {
    align-items: center;
    display: flex;
    flex-direction: row;
    justify-content: center;
    margin: 0 auto 1rem;
    max-width: 40rem
}

#search-form button,
#search-form input {
    border-bottom: 1px solid #646a70;
    border-top: 1px solid #646a70;
    box-sizing: border-box;
    height: 40px
}

#search-form input {
    border-bottom-left-radius: 5px;
    border-left: 1px solid #646a70;
    border-top-left-radius: 5px;
    font-size: 1rem;
    padding: 5px 10px;
    width: 100%
}

#search-form button {
    background-color: #6138f6;
    border-bottom-right-radius: 5px;
    border-right: 1px solid #646a70;
    border-top-right-radius: 5px;
    padding: 6px;
    width: 40px
}

#search-form .search #close {
    display: none
}

#search-form .search #magnifying-glass {
    display: initial
}

#search-form .suggestions #magnifying-glass {
    display: none
}

#search-form .suggestions #close {
    display: initial
}

#search-form button svg {
    stroke: #fff;
    stroke-width: 14px;
    fill: none
}

#search-form button span,
#search-form label {
    display: none
}

@media screen and (min-width:40rem) {
    #search-form form {
        margin: 0 auto
    }

    #search-form button,
    #search-form input {
        height: 60px
    }

    #search-form input {
        font-size: 1.25rem;
        min-width: 25rem;
        padding: 10px
    }

    #search-form button {
        border-right: 1px solid #646a70;
        padding: 12px;
        width: 60px
    }
}

.animated-loading {
    align-items: center;
    background-color: rgba(236, 236, 242, .5);
    border-radius: 5px;
    flex-direction: column;
    height: 100%;
    justify-content: flex-start;
    left: 0;
    padding-top: 2rem;
    position: absolute;
    top: 0;
    transition: opacity .66s, box-shadow .66s, -webkit-backdrop-filter .66s;
    transition: opacity .66s, backdrop-filter .66s, box-shadow .66s;
    transition: opacity .66s, backdrop-filter .66s, box-shadow .66s, -webkit-backdrop-filter .66s;
    width: 100%
}

.animated-loading.active {
    -webkit-backdrop-filter: blur(7.5px);
    backdrop-filter: blur(7.5px);
    box-shadow: 0 3px 7.5px rgba(0, 0, 0, .125);
    opacity: 1
}

.animated-loading.inactive {
    -webkit-backdrop-filter: blur(0);
    backdrop-filter: blur(0);
    box-shadow: 0 0 0 transparent;
    opacity: 0
}

.animated-loading.hidden {
    display: none
}

.animated-loading.not-hidden {
    display: flex
}

.animated-loading .spinner {
    height: 40px;
    width: 40px
}

.animated-loading .spinner circle {
    fill: transparent;
    stroke: #6138f6;
    stroke-width: 4;
    stroke-linecap: round;
    stroke-dasharray: 125.6px;
    animation: animated-loading-spinner 4s linear infinite;
    transform-origin: 20px 20px 0
}

@keyframes animated-loading-spinner {
    0% {
        stroke-dashoffset: 26.4px;
        transform: rotate(0deg)
    }

    50% {
        stroke-dashoffset: 125.6px;
        transform: rotate(2turn)
    }

    to {
        stroke-dashoffset: 26.4px;
        transform: rotate(3turn)
    }
}

#search-results-pager {
    margin: 1rem auto;
    text-align: center
}

#search-results-pager a {
    border-radius: 5px;
    display: inline-block;
    margin: 0 .125rem;
    min-width: 1.5rem;
    padding-left: .25rem;
    padding-right: .25rem;
    text-decoration: none;
    transition: background-color .33s, color .33s
}

#search-results-pager a:not(.disabled):active,
#search-results-pager a:not(.disabled):hover {
    background-color: #6138f6;
    color: #fff;
    outline: none
}

#search-results-pager .current,
#search-results-pager a:not(.disabled):active {
    background-color: rgba(97, 56, 246, .25)
}

#search-results-pager .disabled:not(.current) {
    color: rgba(97, 56, 246, .125);
    text-decoration: none
}

#search-results-pager .disabled:hover {
    cursor: not-allowed
}

@media screen and (min-width:40rem) {
    #search-results-pager a {
        margin: 0 .25rem;
        min-width: 2.5rem
    }
}

#search-results {
    display: grid;
    grid-area: results;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    min-height: calc(5rem + 24px);
    padding: 12px;
    place-content: center;
    position: relative;
    transition: height .66s
}

#search-results .summary em {
    font-style: normal;
    font-weight: 700
}

#search-results .search-result {
    padding-bottom: .5rem;
    padding-top: .5rem
}

#search-results h6 {
    margin-bottom: .25rem
}

#search-results h6 a {
    font-weight: 700;
    text-decoration: none
}

@media screen and (min-width:40rem) {
    #search-results {
        margin-top: 12px
    }
}

#search-form #suggestions {
    border: 1px solid #0c5ca7;
    border-radius: 5px;
    box-shadow: 0 5px 7.5px rgba(0, 0, 0, .25);
    margin-top: .5rem;
    overflow: hidden;
    position: relative;
    z-index: 100
}

#search-form #suggestions.hidden {
    display: none
}

#search-form #suggestions>.backdrop {
    background-color: initial;
    bottom: 0;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: -1
}

#search-form #suggestions button {
    background-color: #fff;
    border-bottom: none;
    border-bottom-right-radius: 0;
    border-right: none;
    border-top: none;
    border-top-right-radius: 0;
    display: block;
    padding: 6px 12px;
    text-align: start;
    width: 100%
}

@media screen and (min-width:40rem) {
    #search-form #suggestions button {
        height: auto;
        padding: 6px 12px;
        transition: background-color .33s, color .33s;
        width: 100%
    }

    #search-form #suggestions button:hover {
        background-color: #6138f6;
        color: #fff
    }

    .xfinity-search-new #search-form #suggestions {
        margin-left: 10rem;
        position: absolute
    }
}

#xfinity-search {
    padding: 1rem;

    @keyframes pulse {

        0%,
        to {
            opacity: 1
        }

        50% {
            opacity: .3
        }
    }
}

@media screen and (min-width:40rem) {
    .xfinity-search {
        align-items: center;
        display: flex;
        flex-direction: column;
        width: 100%
    }

    .xfinity-search .ama-component,
    .xfinity-search .search-form,
    .xfinity-search .search-results {
        width: 41rem
    }
}

.justify-center-btn {
    justify-items: anchor-center
}

.hero-image {
    display: inline;
    object-fit: contain
}

@media screen and (max-width:767px) {
    .hero-image-hide {
        background-image: none !important
    }
}

.ie-info-card {
    background-color: var(--helix-color-neutral2-base, #f3f3f4)
}

@media (min-width:1024px) {
    .ie-card-grid {
        grid-template-columns: repeat(3, 275px);
        justify-content: center
    }
}

.iframe-container {
    height: var(--mobile-height);
    width: 100%
}

@media (min-width:768px) {
    .iframe-container {
        height: var(--desktop-height)
    }
}

.image-chip .x-min-height--40 {
    min-height: 40px
}

.image-chip .icon-small {
    stroke-width: 4;
    height: 24px;
    width: 24px
}

.image-chip .image-container {
    box-shadow: 0 4px 8px -4px
}

.image-chip .image-chip-image-container {
    padding-left: 10px;
    padding-right: 16px
}

.image-chip .image-chip-image-block {
    display: flex;
    margin-right: 10px
}

.image-chip .word-break {
    word-break: break-word
}

@media (max-width:767px) {
    .image-chip .text-body3 {
        font-size: 12px
    }
}

.hover-tooltip__heading {
    position: relative
}

.hover-tooltip__heading:after {
    bottom: -10px;
    content: " ";
    left: -10px;
    position: absolute;
    right: -10px;
    top: -10px
}

.hover-tooltip__body {
    font-size: 14px
}

.image-chip-text .richDescriptionContent ul {
    margin-left: 1rem
}

.image-chip-text .description-bullets-voice-over {
    clip: rect(0 0 0 0);
    border: 0;
    display: flex;
    margin: -.063rem;
    overflow: hidden;
    padding: 0;
    position: absolute;
    visibility: visible
}

.image-chip-text .image-chip-cta:hover {
    color: #00619a;
    text-decoration: underline
}

.image-chip-text .image-chip-cta:visited {
    color: #0272b6
}

#inline-tabs-container.inline-tabs-container-outline .tab-header {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255/var(--tw-bg-opacity, 1));
    border-radius: var(--border-radius-xlarge, 32px);
    border-style: solid;
    border-width: 2px;
    padding: .5rem
}

#inline-tabs-container.inline-tabs-container-outline .tab-header:is(.dark *) {
    --tw-bg-opacity: 1;
    --shadow-color: var(--fill-inverse-base-shadow);
    background-color: rgb(var(--background-color-fill-inverse-base)/var(--tw-bg-opacity, 1))
}

#inline-tabs-container.inline-tabs-container-outline .tab-header {
    border-color: #14141715;
    justify-self: center;
    max-width: -webkit-fill-available;
    max-width: -moz-available;
    max-width: stretch
}

#inline-tabs-container.inline-tabs-container-outline .tab-content {
    margin-top: 1.5rem
}

#inline-tabs-container.inline-tabs-container-shadow .tab-header {
    --tw-shadow: 0px 12px 12px -8px var(--shadow-color);
    --tw-shadow-colored: 0px 12px 12px -8px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

#inline-tabs-container.left-align-heading-and-tabs .tab-header {
    justify-content: flex-start
}

#inline-tabs-container.inline-tabs-container-outline.left-align-heading-and-tabs .tab-header {
    justify-self: start
}

.x--bg-t-l {
    background-position: 0 0
}

.x--bg-t-c {
    background-position: top
}

.x--bg-t-r {
    background-position: 100% 0
}

.x--bg-c-l {
    background-position: 0
}

.x--bg-c-c {
    background-position: 50%
}

.x--bg-c-r {
    background-position: 100%
}

.x--bg-b-l {
    background-position: 0 100%
}

.x--bg-b-c {
    background-position: bottom
}

.x--bg-b-r {
    background-position: 100% 100%
}

@media screen and (max-width:767px) {
    .hero-image-hide-sm {
        background-image: none !important
    }
}

@media screen and (min-width:426px) {
    .hero-image-hide {
        background-size: 100% !important
    }
}

:root {
    --progress-bar-offset: 4px
}

.order-progress__progress-bar:after,
.order-progress__progress-bar:before {
    content: "";
    height: 4px;
    left: var(--progress-bar-offset);
    position: absolute;
    right: var(--progress-bar-offset);
    top: 50%;
    transform: translateY(-50%)
}

.order-progress__progress-bar:before {
    background-color: rgb(var(--background-color-material-2))
}

.order-progress__progress-bar.full:after,
.order-progress__progress-bar.half:after {
    background-color: rgb(var(--background-color-fill-theme1-base))
}

.order-progress__progress-bar.half:after {
    width: calc(50% - var(--progress-bar-offset))
}

.order-progress__progress-bar.full:after {
    width: calc(100% - var(--progress-bar-offset)*2)
}

.order-progress__icon-container {
    background-color: #fff;
    border-radius: 50%;
    padding: 4px;
    position: relative
}

.order-progress__icon-container:before {
    border-radius: 50%;
    content: "";
    display: block;
    height: 36px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 36px
}

.order-progress__icon-container.complete:before {
    background-color: rgb(var(--background-color-fill-theme1-base));
    border: 2px solid rgb(var(--background-color-fill-theme1-base))
}

.order-progress__icon-container.pending:before {
    background: #fff;
    border: 2px solid rgb(var(--background-color-fill-theme1-base))
}

.order-progress__icon-container.shipping-truck-icon2-mirror prism-icon {
    transform: scaleX(-1)
}

:root {
    --learning-tile-text-black: #000
}

.learning-tile__item .learning-tile__category-title {
    min-height: 2rem
}

.learning-tile__item .learning-tile__title {
    min-height: 40px
}

.learning-tile__item .learning-tile__description {
    min-height: 65px
}

.learning-tile__item .learning-tile__lessons-count {
    bottom: 8px
}

.learning-tile__item .learning-tile__cta-link:active,
.learning-tile__item .learning-tile__cta-link:focus,
.learning-tile__item .learning-tile__cta-link:visited {
    --gradient-full-color: var(--learning-tile-text-black) !important;
    color: var(--learning-tile-text-black) !important
}

@media screen and (min-width:478px) {
    .learning-tile__item .learning-tile__category-title {
        min-height: 3rem
    }

    .learning-tile__item .learning-tile__title {
        min-height: 85px
    }
}

.learning-tile__item.flex-wrap-full {
    display: flex !important;
    flex-wrap: wrap
}

.learning-tile__item .container {
    position: relative
}

.learning-tile__item .icon {
    float: left;
    height: 35px;
    left: 0;
    position: absolute;
    top: 0;
    width: 35px
}

.tile-collection a {
    margin: 5px
}

@media screen and (min-width:478px) {
    .tile-collection a {
        margin: 10px
    }
}

:root {
    --lesson-text-black: #000;
    --lesson-text-red-50: #e6004a;
    --lesson-text-grey-50: #62626c
}

.topic-cotainer__links a:active,
.topic-cotainer__links a:focus,
.topic-cotainer__links a:visited {
    --gradient-full-color: var(--lesson-text-black) !important;
    color: var(--lesson-text-black) !important
}

.topic-container__inner .lesson-content__parter-cta:active,
.topic-container__inner .lesson-content__parter-cta:focus,
.topic-container__inner .lesson-content__parter-cta:visited {
    --gradient-full-color: var(--lesson-text-grey-50) !important;
    color: var(--lesson-text-grey-50) !important
}

.topic-cotainer__links li:not(:last-child) {
    padding-bottom: 1.5rem
}

.topic-container__content .lesson-content__image-container img.desktop-image {
    display: none
}

.lesson-content__cta:active,
.lesson-content__cta:focus,
.lesson-content__cta:visited {
    --gradient-full-color: var(--lesson-text-red-50);
    color: var(--lesson-text-red-50)
}

.topic-container__inner .topic-container__lesson-item {
    margin-bottom: 1rem
}

.topic-container__inner .topic-container__lesson-item:last-child {
    margin-bottom: 0
}

@media screen and (min-width:768px) {
    .topic-container__inner .topic-container__lesson-item {
        margin-bottom: 2rem
    }
}

@media screen and (min-width:478px) {
    .topic-container__content .lesson-content__image-container img.desktop-image {
        display: block
    }

    .topic-container__content .lesson-content__image-container img.mobile-image {
        display: none
    }
}

.topic-container__inner .not-active {
    opacity: .5
}

.lesson-youtube-player__container {
    padding-bottom: 56.25%
}

.topic-container__inner .progressFade {
    fill: #7f7f7f
}

.topic-cotainer__links .progressFade {
    left: -20px;
    top: 3px
}

.topic-container__inner .imgCenter {
    position: relative;
    top: 50%;
    transform: translateY(-50%)
}

.lesson-content__cta .arrow {
    border-color: var(--lesson-text-red-50);
    border-width: 0 2px 2px 0;
    padding: 2px
}

.lesson-content__cta .down {
    transform: translateY(-2px) rotate(45deg);
    -webkit-transform: translateY(-2px) rotate(45deg)
}

.lesson-content__cta .up {
    transform: translateY(2px) rotate(-135deg);
    -webkit-transform: translateY(2px) rotate(-135deg)
}

.topic-container__inner .rightProgress {
    right: 8px;
    width: 25px
}

.tile-collection .swiper-left-icon,
.tile-collection .swiper-right-icon {
    border-radius: 50%;
    top: calc(50% - 20px)
}

.tile-collection .xds-learning__button-back.xds-learning__button-disabled,
.tile-collection .xds-learning__button-next.xds-learning__button-disabled {
    display: none
}

.tile-collection .swiper-slide {
    display: flex
}

.swiper-pagination-fraction,
.tile-collection .swiper-horizontal>.swiper-pagination-bullets,
.tile-collection .swiper-pagination-bullets.swiper-pagination-horizontal,
.tile-collection .swiper-pagination-custom {
    bottom: 0
}

.popular-category .menu-tab-item:first-child {
    margin-left: 0
}

.popular-category .menu-tab-item:last-child {
    margin-right: 0
}

.popular-category .menu-tab-item button {
    border: 1px solid transparent;
    border-radius: 20px;
    transition: background-color .4s
}

.popular-category .menu-tab-item button,
.popular-category .menu-tab-item button:active,
.popular-category .menu-tab-item button:focus,
.popular-category .menu-tab-item button:hover,
.popular-category .menu-tab-item button:visited {
    color: unset
}

.popular-category .menu-tab-item button:focus,
.popular-category .menu-tab-item button:hover {
    background-color: var(--palette-grey-05, #f6f6f9)
}

.popular-category .menu-tab-item button.active:hover,
.popular-category .menu-tab-item button.inactive:hover {
    text-decoration: none
}

.popular-category .menu-tab-item button:focus {
    border: 1px solid var(--patch-black);
    outline: none
}

.lob-card-comparison-tab-container [role=tablist] {
    --tw-shadow: 0 4px 8px -4px rgba(95, 95, 95, .51);
    --tw-shadow-colored: 0 4px 8px -4px var(--tw-shadow-color);
    border-radius: var(--border-radius-xlarge, 32px);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    margin-left: auto;
    margin-right: auto;
    padding: .5rem !important
}

.lob-tile-main {
    margin: var(--size-space-4) 0
}

.lob-tile-inner {
    background-color: #f6f6f9;
    padding: 1.25rem
}

.lob-tile-inner.lob-tile-inner-no-bg {
    background-color: initial
}

.lob-tile-main a {
    border: 1px solid transparent;
    border-radius: 3px;
    color: var(--patch-black);
    font-family: var(--text-family-brand);
    font-size: var(--size-font-14);
    font-weight: var(--font-weight-bold);
    padding: 5px;
    text-decoration: underline;
    -webkit-text-decoration-color: rgba(13, 13, 15, .3);
    text-decoration-color: rgba(13, 13, 15, .3);
    text-decoration-thickness: .09rem;
    text-transform: none;
    text-underline-position: under
}

.lob-tile-main a:hover {
    color: var(--patch-grey-70);
    -webkit-text-decoration-color: var(--patch-grey-70);
    text-decoration-color: var(--patch-grey-70)
}

.lob-tile-main a:active {
    color: var(--patch-black);
    -webkit-text-decoration-color: var(--patch-black);
    text-decoration-color: var(--patch-black)
}

.lob-tile-main a:focus {
    outline: 0
}

.lob-tile-main a:focus-visible {
    border: 1px solid var(--patch-black);
    border-radius: 3px;
    color: var(--patch-black);
    -webkit-text-decoration-color: var(--patch-black);
    text-decoration-color: var(--patch-black)
}

.lob-tile-main a.disabled {
    color: #b6b6b7;
    pointer-events: none;
    -webkit-text-decoration-color: #b6b6b7;
    text-decoration-color: #b6b6b7
}

.lob-tile-flex-vertical .lob-tile-inner {
    display: grid;
    grid-template-columns: 24px auto 100px
}

.lob-tile-flex-horizontal .lob-tile-title-container,
.lob-tile-flex-vertical .lob-tile-title-container {
    margin-left: 24px;
    text-align: left
}

.lob-tile-flex-vertical .lob-tile-description-container {
    grid-column: 2/span 1;
    margin-left: 24px;
    margin-top: 6px;
    text-align: left
}

.lob-tile-flex-vertical .lob-tile-specificdata-container {
    grid-column: 2/span 2;
    margin-left: 24px;
    text-align: left
}

.lob-tile-flex-horizontal .lob-tile-content-inner,
.lob-tile-flex-horizontal .lob-tile-inner,
.lob-tile-flex-horizontal .lob-tile-specificdata-inner,
.lob-tile-flex-vertical .lob-tile-content-inner,
.lob-tile-flex-vertical .lob-tile-specificdata-inner {
    display: flex;
    flex: 0 1 auto;
    flex-direction: row;
    flex-wrap: nowrap;
    margin: 0 auto;
    width: 100%
}

.lob-tile-flex-vertical .lob-tile-content-inner,
.lob-tile-flex-vertical .lob-tile-specificdata-inner {
    flex-direction: column
}

.lob-tile-flex-horizontal .lob-tile-content-inner,
.lob-tile-flex-horizontal .lob-tile-inner,
.lob-tile-flex-horizontal .lob-tile-specificdata-inner {
    align-items: center
}

.lob-tile-icon-container .icon-tile-logo {
    height: 1.5rem;
    width: 1.5rem
}

.lob-tile__body1 {
    color: #2b2b2b;
    font-size: var(--size-font-16);
    font-weight: 400;
    letter-spacing: var(--size-tracking-normal);
    line-height: var(--size-leading-24)
}

.lob-tile__heading3 {
    color: #2b2b2b;
    font-family: var(--text-family-brand);
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.5rem;
    margin: 0;
    text-transform: none
}

.lob-tile__body3 {
    color: var(--patch-black);
    font-size: var(--size-font-14);
    font-weight: var(--font-weight-bold);
    line-height: var(--size-leading-20)
}

.lob-tile-internet__display3 {
    color: var(--patch-black);
    font-size: var(--size-font-12);
    letter-spacing: var(--size-tracking-normal);
    line-height: var(--size-leading-18)
}

.lob-tile-content-container {
    flex-grow: 1;
    margin-left: var(--size-space-24)
}

.icon-tile-logo:not(:first-child) {
    margin-left: var(--size-font-10)
}

.lob-tile-flex-vertical .lob-tile-specificdata-container,
.lob-tile-flex-vertical .lob-tile-tvlink-container {
    margin-top: var(--size-font-10)
}

.lob-tile-flex-vertical .lob-tile-managelink-container,
.lob-tile-flex-vertical .lob-tile-quaternary-link-container {
    text-align: right
}

.lob-tile-flex-vertical .lob-tile-quaternary-link-container {
    grid-column: 3;
    margin-top: 6px
}

.lob-tile-flex-horizontal .lob-tile-specificdata-container,
.lob-tile-flex-horizontal .lob-tile-tvlink-container {
    margin-left: var(--size-font-10)
}

.lob-tile-flex-horizontal .lob-tile-managelink-container {
    margin-left: auto
}

.lob-tile-flex-horizontal .lob-tile-specificdata-inner>:not(.lob-tile-tvlink-container),
.lob-tile-flex-horizontal:not(#lob-tile-Mobile) .lob-tile-managelink-container {
    display: none
}

.lob-tile-flex-horizontal .lob-tile-description-container {
    flex-grow: 1;
    margin-left: 24px
}

.lob-tile-tv-logos .lob-tile-tv-logo {
    display: inline-flex;
    height: 48px;
    margin-right: 8px;
    padding: 8px;
    width: 48px
}

.lob-tile-tv-logo svg {
    max-height: 100%;
    max-width: 100%
}

@media only screen and (min-width:320px) {
    .lob-mobile-grid-without-tertiary {
        grid-template-columns: 24px auto
    }
}

@media only screen and (min-width:768px) {
    .lob-mobile-grid-without-tertiary {
        grid-template-columns: 24px auto 60px
    }
}

.lob-tile__main-container {
    text-align: center
}

.lob-tile__lob-container {
    border-color: #ececf2;
    box-shadow: none;
    transition-duration: .3s
}

.lob-tile__lob-container,
.lob-tile__tv-container {
    padding: 32px 24px
}

.lob-tile__promo-container {
    padding: 24px 24px 0
}

.lob-tile__highlights-container>:not(:first-child) {
    margin-top: 4px
}

.lob-tile__tv-logos {
    border-radius: var(--border-radius-small, 4px);
    margin: 0 auto;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

.lob-tile__tv-logos .lob-tile__tv-logo-container {
    --tw-bg-opacity: 1;
    --shadow-color: var(--material-neutral2-base-shadow);
    background-color: rgb(var(--background-color-material-neutral2-base)/var(--tw-bg-opacity, 1));
    border-left: 1px solid #ececf2;
    display: inline-flex;
    padding: 8px
}

.lob-tile__tv-logos .lob-tile__tv-logo-container:first-child {
    border-left: none
}

.lob-tile__tv-logo-svg {
    height: 24px;
    width: 50px
}

@media screen and (min-width:550px) {

    .lob-tile__lob-container,
    .lob-tile__tv-container {
        padding: 40px 32px
    }

    .lob-tile__promo-container {
        padding: 32px 32px 0
    }

    .lob-tile__tv-logos .lob-tile__tv-logo-container {
        padding: 12px 8px
    }
}

@media screen and (min-width:768px) {

    .lob-tile__lob-container,
    .lob-tile__tv-container {
        padding: 40px
    }

    .lob-tile__promo-container {
        padding: 32px 40px 0
    }
}

@media screen and (min-width:1024px) {

    .lob-tile__lob-container,
    .lob-tile__tv-container {
        padding: 40px 24px
    }

    .lob-tile__promo-container {
        padding: 32px 24px 0
    }

    .lob-tile__tv-logo-svg {
        width: 28px
    }
}

@media screen and (min-width:1152px) {
    .lob-tile__tv-logo-svg {
        width: 34px
    }
}

@media screen and (min-width:1280px) {

    .lob-tile__lob-container,
    .lob-tile__tv-container {
        padding: 40px 32px
    }

    .lob-tile__promo-container {
        padding: 32px 32px 0
    }

    .lob-tile__tv-logo-svg {
        width: 42px
    }
}

@media screen and (min-width:1568px) {

    .lob-tile__lob-container,
    .lob-tile__tv-container {
        padding: 40px
    }

    .lob-tile__promo-container {
        padding: 32px 40px 0
    }

    .lob-tile__tv-logo-svg {
        height: 24px;
        width: 50px
    }
}

.localization-container {
    --form-max-width: 768px;
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255/var(--tw-bg-opacity, 1));
    display: flex;
    flex-direction: column
}

.localization-container__theme-dark {
    --tw-text-opacity: 1;
    color: rgb(var(--text-color-neutral-base)/var(--tw-text-opacity, 1))
}

.localization-container__background-image {
    background-color: var(--background-color-transparent, transparent)
}

.localization-container__icon {
    margin-bottom: 1.5rem;
    max-height: 66px;
    width: 100%
}

.localization-container__description {
    margin-top: 1rem
}

.localization-container__eccopy {
    --text-caption-leading: var(--text-caption-line-height);
    --text-caption-family: var(--text-family-default);
    font-family: var(--text-caption-family);
    font-size: var(--text-caption-size);
    font-weight: var(--text-caption-weight);
    letter-spacing: var(--text-caption-letter-spacing);
    line-height: var(--text-caption-leading);
    margin-top: 1rem;
    text-transform: var(--text-caption-text-transform)
}

@media (min-width:768px) {
    .localization-container__icon {
        max-height: 77px
    }

    .localization-container__eccopy {
        margin-top: 1.5rem
    }
}

@media (min-width:1024px) {
    .localization-container__icon {
        max-height: 88px
    }
}

@media (max-width:768px) {
    .localization-container__width-mobile {
        max-width: 100% !important
    }
}

.localization-container__width-500 {
    width: 500px
}

.localization-container__width-700 {
    width: 700px
}

.localization-container__width-1000 {
    width: 1000px
}

.localization-container__width-default {
    width: 100%
}

.localization-container__height-640 {
    height: 640px
}

.localization-container__height-default {
    height: 100%
}

.localization-container__align-left {
    align-items: flex-start;
    text-align: left
}

.localization-container__align-center {
    align-items: center;
    text-align: center
}

@media (max-width:768px) {
    .localization-container__align-mobile-left {
        align-items: flex-start;
        text-align: left
    }

    .localization-container__align-mobile-center {
        align-items: center;
        text-align: center
    }
}

.localization-container__form {
    align-items: center;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    max-width: var(--form-max-width);
    text-align: left;
    width: 100%
}

.localization-container__inputs-container {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    position: relative
}

.localization-container__inputs-container :focus-visible {
    outline: none !important
}

.localization-container__inputs-container>div.text-inputfield-container,
.localization-container__inputs-container>div.text-inputfield-container input {
    flex-grow: 1;
    max-width: 100%
}

input#localization-address-field {
    padding-left: 1rem;
    padding-right: 0;
    width: 100%
}

span#localization-address-field-error {
    padding-top: 0
}

.localization-container__inputs-submit {
    box-sizing: border-box;
    height: 3rem;
    margin-left: 1rem;
    margin-top: 1rem;
    padding-bottom: 0 !important;
    padding-top: 0 !important
}

@media screen and (min-width:768px) and (max-width:1024px) {
    .localization-container__form {
        flex-direction: row
    }

    .localization-container__inputs-container {
        margin-right: 1rem
    }

    .localization-container__inputs-submit {
        align-self: flex-start;
        margin-left: 1rem
    }

    .localization-container__inputs-submit.left {
        margin-top: 2.8rem
    }

    .localization-container__form.left {
        align-items: flex-start
    }
}

@media screen and (min-width:0px) and (max-width:768px) {
    .localization-container__form {
        flex-direction: column;
        width: 100%
    }

    .localization-container__form.left {
        align-items: flex-start
    }

    .localization-container__inputs-submit {
        margin-bottom: 1.5rem;
        margin-left: 0
    }

    .localization-container__inputs-container {
        min-width: 100%
    }
}

.location-container__form .location-container__inputs-container {
    margin-right: 0
}

.localization-container__form .input-container {
    background: #f6f6f9;
    border: 1px solid #ececf2
}

.localization-container__form .icon-container {
    padding-right: 10px
}

.localization-container__form .location-icon {
    color: #62626c;
    max-height: 20px;
    max-width: 20px
}

.localization-container__form .localization-container__inputs-submit {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

.localization-container__change {
    box-sizing: border-box;
    height: 3rem;
    margin-top: 1.5rem
}

.localization-container__change button {
    padding: .5rem 2rem !important
}

.suggestions-select {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255/var(--tw-bg-opacity, 1));
    border: 1px solid #dfdfdf;
    border-radius: 4px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    padding: .5rem;
    position: absolute;
    top: 104px;
    width: 100%;
    z-index: 20
}

.suggestions-select__item {
    --text-body2-leading: var(--text-body2-line-height);
    --text-body2-family: var(--text-family-default);
    background-color: var(--background-color-transparent, transparent);
    box-sizing: border-box;
    display: inline-block;
    font-family: var(--text-body2-family);
    font-size: var(--text-body2-size);
    font-weight: var(--text-body2-weight);
    letter-spacing: var(--text-body2-letter-spacing);
    line-height: var(--text-body2-leading);
    min-width: 100%;
    padding: .5rem;
    text-align: left;
    text-transform: var(--text-body2-text-transform);
    width: 100%
}

.suggestions-select>li[aria-selected=true],
.suggestions-select__item:hover {
    --tw-bg-opacity: 1;
    --shadow-color: var(--fill-inverse-down-shadow);
    background-color: rgb(var(--background-color-fill-inverse-down)/var(--tw-bg-opacity, 1));
    border-radius: 4px;
    cursor: pointer;
    outline: 2px solid transparent;
    outline-offset: 2px
}

.suggestions-select>li[aria-selected=true] {
    border-style: solid;
    border-width: 1px
}

.suggestions-select :focus-visible {
    outline: none !important
}

.highlightText-suggestions {
    font-weight: 700
}

@media (min-width:1024px) {

    .suggestions-select,
    .suggestions-select__item {
        padding: .25rem
    }
}

.mdu-fallback-container__form {
    align-items: center;
    max-width: var(--form-max-width);
    width: 100%
}

.mdu-fallback-container__button-container-center,
.mdu-fallback-container__button-container-left,
.mdu-fallback-container__inputs-container {
    align-items: center;
    display: flex;
    text-align: left
}

.mdu-fallback-container__button-container-center {
    justify-content: center
}

.mdu-fallback-container__button-container-left {
    justify-content: flex-start
}

.mdu-fallback-container__inputs-container div.text-inputfield-container,
.mdu-fallback-container__inputs-container div.text-inputfield-container input {
    flex-grow: 1;
    max-width: 100%
}

.mdu-fallback-container__inputs-submit {
    box-sizing: border-box;
    height: 3rem;
    margin-top: 1rem;
    padding-bottom: 0 !important;
    padding-top: 0 !important
}

.mdu-fallback-extra-fields {
    display: flex
}

.mdu-fallback-extra-fields .mdu-fallback-container__unit-container div.text-inputfield-container input,
.mdu-fallback-extra-fields .mdu-fallback-container__zip-container div.text-inputfield-container input {
    padding-left: 1rem;
    width: 100%
}

.mdu-fallback-container__unit-dropdown:focus:before {
    content: none
}

.mdu-fallback-container__unit-dropdown {
    -webkit-appearance: none;
    -moz-appearance: none;
    border-color: #62626c;
    border-radius: .25rem;
    border-width: 1px;
    padding-left: 10px;
    padding-right: 10px
}

.mdu-fallback-container__unit-dropdown,
.mdu-fallback-container__unit-dropdown:active,
.mdu-fallback-container__unit-dropdown:focus,
.mdu-fallback-container__unit-dropdown:hover {
    --tw-bg-opacity: 1 !important;
    --shadow-color: var(--material-neutral2-base-shadow) !important;
    --text-body2-leading: var(--text-body2-line-height);
    --text-body2-family: var(--text-family-default);
    background-color: rgb(var(--background-color-material-neutral2-base)/var(--tw-bg-opacity, 1)) !important;
    font-family: var(--text-body2-family);
    font-size: var(--text-body2-size);
    font-weight: var(--text-body2-weight);
    letter-spacing: var(--text-body2-letter-spacing);
    line-height: var(--text-body2-leading);
    padding: .75rem;
    text-align: left;
    text-transform: var(--text-body2-text-transform);
    width: 100%
}

.mdu-fallback-container__unit-dropdown.dropdown-open,
.mdu-fallback-container__unit-dropdown:active,
.mdu-fallback-container__unit-dropdown:focus,
.mdu-fallback-container__unit-dropdown:hover {
    border-color: #0d0d0f
}

.dropdown-arrow {
    float: right;
    height: 12px;
    width: 12px
}

.mdu-fallback-unit-list {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255/var(--tw-bg-opacity, 1));
    border: 1px solid #dfdfdf;
    left: 0;
    padding: .5rem;
    position: absolute;
    top: 55px;
    width: 100%;
    z-index: 10
}

.mdu-fallback-unit-list-option {
    --text-body2-leading: var(--text-body2-line-height);
    --text-body2-family: var(--text-family-default);
    background-color: var(--background-color-transparent, transparent);
    border-width: 0;
    display: block;
    font-family: var(--text-body2-family);
    font-size: var(--text-body2-size);
    font-weight: var(--text-body2-weight);
    letter-spacing: var(--text-body2-letter-spacing);
    line-height: var(--text-body2-leading);
    padding: .5rem;
    text-align: left;
    text-transform: var(--text-body2-text-transform);
    width: 100%
}

.mdu-fallback-unit-list-option:focus-visible {
    outline: none !important
}

.mdu-fallback-container__inputs-container :focus-visible {
    outline: none !important
}

.mdu-fallback-unit-list-option:not(.list-option-disabled):hover,
.mdu-fallback-unit-list-option[aria-selected=true]:not(.list-option-disabled):not(:hover) {
    --tw-bg-opacity: 1;
    --shadow-color: var(--fill-inverse-down-shadow);
    background-color: rgb(var(--background-color-fill-inverse-down)/var(--tw-bg-opacity, 1));
    border-radius: 4px;
    outline: 2px solid transparent;
    outline-offset: 2px
}

.mdu-fallback-container__unit-dropdown-icon {
    float: right
}

.mdu-fallback-container__unit-dropdown-icon-native {
    position: absolute;
    right: 18px;
    top: 14px;
    z-index: 10
}

#localization-address-field-error,
#localization-unit-field-error,
#localization-zip-field-error {
    display: inline-block
}

.mdu-fallback-container__button-container>.localization-container__inputs-submit {
    margin-left: 0 !important;
    margin-top: 2.5rem
}

.unit-label-text {
    font-size: 12px
}

.localization-container__form .label-text.sc-prism-input-default,
.mdu-fallback-container__form .label-text.sc-prism-input-default {
    margin-bottom: 0 !important
}

.mdu-lesser__inputs-container {
    align-items: center !important
}

@media screen and (min-width:769px) {

    .mdu-fallback-container__button-container-center,
    .mdu-fallback-container__button-container-left,
    .mdu-fallback-container__inputs-container {
        flex-wrap: nowrap
    }

    .mdu-fallback-container__button-container-center {
        justify-content: center
    }

    .mdu-fallback-container__button-container-left {
        justify-content: flex-start;
        margin-left: 0 !important
    }

    .mdu-fallback-container__inputs-container {
        align-items: flex-start;
        position: relative
    }

    .mdu-fallback-container__inputs-submit {
        margin-top: 1.5rem
    }

    .mdu-fallback-container__address-container {
        flex-grow: 1;
        position: relative
    }

    .mdu-fallback-container__unit-container,
    .mdu-fallback-container__zip-container {
        margin-left: 1rem
    }

    .mdu-fallback-extra-fields .mdu-fallback-container__unit-container,
    .mdu-fallback-extra-fields .mdu-fallback-container__zip-container {
        max-width: 182px
    }

    .mdu-lesser-unit-field {
        display: block
    }
}

@media screen and (max-width:768px) {

    .mdu-fallback-container__button-container-mobile-left,
    .mdu-fallback-container__inputs-container {
        justify-content: flex-start
    }

    .mdu-fallback-container__button-container-mobile-center {
        justify-content: center
    }

    .mdu-fallback-container__button-container>.localization-container__inputs-submit {
        margin-top: 2rem
    }

    .mdu-fallback-container__button-container,
    .mdu-fallback-container__inputs-container {
        flex-wrap: wrap
    }

    .mdu-fallback-container__inputs-container {
        margin-right: 0;
        width: 100%
    }

    .mdu-fallback-container__address-container {
        position: relative;
        width: 100%
    }

    .mdu-fallback-container__unit-container,
    .mdu-fallback-container__zip-container {
        width: 100%
    }

    .mdu-fallback-final-container .mdu-fallback-extra-fields .mdu-fallback-container__unit-container {
        margin-right: .5rem
    }

    .mdu-fallback-extra-fields .mdu-fallback-container__zip-container {
        margin-left: .5rem
    }

    .mdu-greater-extra-fields,
    .mdu-lesser-extra-fields {
        width: 100%
    }

    .mdu-lesser-dropdown {
        display: inline-flex
    }
}

@media screen and (max-width:376px) {
    .mdu-fallback-extra-fields {
        width: 100%
    }

    .mdu-fallback-container__button-container-mobile-left,
    .mdu-fallback-container__inputs-container {
        justify-content: flex-start
    }

    .mdu-fallback-container__button-container-mobile-center {
        justify-content: center
    }

    .mdu-fallback-container__button-container>.localization-container__inputs-submit {
        margin-top: 1rem
    }
}

.overflow-container {
    overflow: hidden;
    position: relative;
    width: 100%
}

.marquee-row {
    --marquee-gap: 1rem;
    display: flex;
    white-space: nowrap;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    will-change: transform
}

.marquee-row>* {
    flex-shrink: 0
}

.marquee-row.paused,
.marquee-row:focus-within,
.marquee-row:hover {
    animation-play-state: paused
}

.membership-tier-pill--gold {
    color: #150659
}

.membership-tier-container {
    border: 3px solid transparent
}

.membership-tier-container.membership-tier--preactive {
    background: #fff;
    border: 3px solid #fff
}

.membership-tier-container.membership-tier--silver {
    background: linear-gradient(#fff, #fff) padding-box, linear-gradient(152.69deg, #fff -5.7%, #525252 44.8%, #fff 108.15%) border-box
}

.membership-tier-container.membership-tier--gold {
    background: linear-gradient(#fff, #fff) padding-box, linear-gradient(152.69deg, #fff -5.7%, #fbc74e 44.8%, #fff 108.15%) border-box
}

.membership-tier-container.membership-tier--platinum {
    background: linear-gradient(#fff, #fff) padding-box, linear-gradient(152.69deg, #fff -5.7%, #284bbe 44.8%, #fff 108.15%) border-box
}

.membership-tier-container.membership-tier--diamond {
    background: linear-gradient(#fff, #fff) padding-box, linear-gradient(152.69deg, #fff -5.7%, #4b19a0 44.8%, #fff 108.15%) border-box
}

.membership-pill-anim {
    --stripe-cycle: 3300ms;
    --stripe-color: hsla(0, 0%, 100%, .55);
    --stripe-angle: 110deg;
    --stripe-width-1: 3.5%;
    --stripe-width-2: 5%;
    --stripe-gap: 8%;
    --stripe-center-1: 58%;
    --stripe-center-2: calc(var(--stripe-center-1) + var(--stripe-gap));
    --stripe-layer-width: 240%;
    --stripe-feather: 0%;
    --stripe-blend: overlay;
    --stripe-opacity: 1;
    align-items: center;
    border-radius: 10px;
    display: inline-flex;
    height: 20px;
    isolation: isolate;
    line-height: 20px;
    overflow: hidden;
    padding: 0 12px;
    position: relative
}

.membership-pill-anim:after {
    animation: stripes-sweep var(--stripe-cycle) linear infinite;
    background: linear-gradient(var(--stripe-angle), transparent 0, transparent calc(var(--stripe-center-1) - var(--stripe-width-1)/2 - var(--stripe-feather)), var(--stripe-color) calc(var(--stripe-center-1) - var(--stripe-width-1)/2), var(--stripe-color) calc(var(--stripe-center-1) + var(--stripe-width-1)/2), transparent calc(var(--stripe-center-1) + var(--stripe-width-1)/2 + var(--stripe-feather)), transparent calc(var(--stripe-center-2) - var(--stripe-width-2)/2 - var(--stripe-feather)), var(--stripe-color) calc(var(--stripe-center-2) - var(--stripe-width-2)/2), var(--stripe-color) calc(var(--stripe-center-2) + var(--stripe-width-2)/2), transparent calc(var(--stripe-center-2) + var(--stripe-width-2)/2 + var(--stripe-feather)), transparent 100%);
    border-radius: inherit;
    content: "";
    height: 100%;
    inset: 0;
    left: calc((100% - var(--stripe-layer-width))/2);
    mix-blend-mode: var(--stripe-blend);
    opacity: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    transform: translateX(120%);
    width: var(--stripe-layer-width);
    will-change: transform, opacity;
    z-index: 1
}

@keyframes stripes-sweep {

    0%,
    2.999% {
        opacity: 0;
        transform: translateX(120%)
    }

    3% {
        opacity: var(--stripe-opacity);
        transform: translateX(120%)
    }

    97% {
        opacity: var(--stripe-opacity);
        transform: translateX(-120%)
    }

    97.001%,
    to {
        opacity: 0;
        transform: translateX(-120%)
    }
}

@media (prefers-reduced-motion:reduce) {
    .membership-pill-anim:after {
        animation: none !important;
        opacity: 0 !important
    }
}

.offer-label-grid {
    transition: max-height .5s ease-out
}

.offer-label-grid.outline-border {
    border-width: 1px
}

.offer-label-grid-broadband-ui {
    border-top-width: 1px
}

.offer-label-grid .xjs-icon-stack__bullet {
    border: none !important
}

.read-more_outer {
    max-width: unset;
    min-height: 40px;
    width: 100%
}

.offer-label-grid .offer-label-grid_eyebrow__outer-eyebrow .read-more_outer,
.offer-label-grid .read-more-text {
    min-height: 40px
}

.offer-label-grid-broadband-ui.hide-label {
    height: auto;
    max-height: 240px;
    overflow: hidden
}

.offer-label-grid-broadband-ui.show-label {
    max-height: 100%
}

.offer-label-grid-eyebrow {
    font-size: 24px
}

.read-more_expand {
    display: block;
    max-height: 100%
}

.offer-details-drawer-header-close-icon {
    fill: var(--palette-white, #fff)
}

.customize-btn {
    --tw-border-opacity: 0.15;
    border-color: rgb(var(--border-color-stroke-neutral-base)/var(--tw-border-opacity));
    transition: .2s ease-in;
    transition-property: background-color, border-color, box-shadow
}

.customize-btn:focus {
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
    --tw-ring-opacity: 1;
    --tw-ring-color: rgb(var(--ring-color-neutral-base)/var(--tw-ring-opacity));
    --tw-ring-offset-width: 2px;
    --tw-ring-offset-color: rgb(var(--ring-offset-color-material-neutral-base));
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000)
}

.offer-details-drawer-header-content {
    border-bottom: 1px solid #979797;
    font-size: 14px
}

.offer-details-drawer-header-close-btn:focus {
    outline: 2px solid #000;
    outline-offset: 2px
}

.lob-title:not(:last-child):after {
    content: "\2022";
    margin-left: 5px;
    margin-right: 5px
}

.offer-details-drawer-header,
.xjs-modal-close {
    height: unset;
    width: unset
}

.menu-tab-container {
    -ms-overflow-style: none;
    scrollbar-width: none
}

.menu-tab-container::-webkit-scrollbar {
    display: none
}

.offer-details-drawer-header .menu-tab-container {
    border-bottom: 1px solid;
    border-color: var(--palette-grey-10, #ececf2)
}

.menu-tab-item:first-child {
    margin-left: 0
}

.menu-tab-item:last-child {
    margin-right: 0
}

.menu-tab-item button {
    border: 1px solid transparent;
    border-radius: 20px;
    transition: background-color .4s
}

.menu-tab-item button,
.menu-tab-item button:active,
.menu-tab-item button:focus,
.menu-tab-item button:hover,
.menu-tab-item button:visited {
    color: unset
}

.menu-tab-item button:focus,
.menu-tab-item button:hover {
    background-color: var(--palette-grey-05, #f6f6f9)
}

.menu-tab-item button.active:hover,
.menu-tab-item button.inactive:hover {
    text-decoration: none
}

.menu-tab-item button:focus {
    border: 1px solid var(--patch-black);
    outline: none
}

@media screen and (max-width:767px) {
    .offer-details-drawer-header-close-btn {
        margin-right: 24px;
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%)
    }

    .cart-action-button-wrapper .customize-btn,
    .cart-action-button-wrapper button {
        padding: 8px 16px
    }

    .cart-action-button-wrapper button span {
        white-space: nowrap
    }

    .offer-details-footer,
    .offer-drawer-sticky-header__inner {
        box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .3)
    }
}

#nav-slide {
    transition: .3s ease-in-out
}

section.offer-details__wrapper.offer-details__wrapper--header {
    background-position: 50%;
    background-repeat: no-repeat
}

.x-offer-details-header-merchandizing>.x-button--anchor:focus {
    outline: none
}

.loading.offer-details__wrapper--header .offer-details__header-banner .x-offer-details-header__cta-share,
.loading.offer-details__wrapper--header .x-offer-details-header-featured-offers-placeholder,
.loading.offer-details__wrapper--header .x-offer-details-header-marketing p,
.loading.offer-details__wrapper--header .x-offer-details-header-marketing-placeholder,
.loading.offer-details__wrapper--header .x-offer-details-header-merchandizing h3,
.loading.offer-details__wrapper--header .x-offer-details-header-merchandizing p,
.loading.offer-details__wrapper--header .x-offer-details-header__cta.x-button--solid,
.loading.offer-details__wrapper--header .x-offer-details-row h2,
.loading.offer-details__wrapper--header .x-offer-details-row p,
.loading.offer-details__wrapper--header h1.x-main-heading,
.loading.offer-details__wrapper--header h2.x-sub-heading {
    animation: gradient 2s linear infinite;
    background-blend-mode: multiply;
    background-color: initial;
    background-image: linear-gradient(90deg, #f6f6f9, #ececf2, #f6f6f9, #ececf2);
    background-size: 300% 100%;
    border: 0 solid transparent;
    border-radius: 3px;
    color: transparent !important;
    pointer-events: none
}

.loading.offer-details__wrapper--header .x-offer-details-header-featured-offers-placeholder,
.loading.offer-details__wrapper--header .x-offer-details-header-marketing-placeholder {
    display: inline-block;
    height: 1.5rem;
    margin-right: .25rem;
    padding: 0;
    width: 1.5rem
}

.loading.offer-details__wrapper--header .x-offer-details-header-merchandizing a:hover {
    cursor: default
}

.loading.offer-details__wrapper--header .x-offer-details-header-merchandizing h3,
.loading.offer-details__wrapper--header .x-offer-details-row p {
    margin-bottom: .25rem
}

.loading.offer-details__wrapper--header .x-offer-details-row p a {
    color: transparent !important
}

.loading.offer-details__wrapper--header h1.x-main-heading,
.loading.offer-details__wrapper--header h2.x-sub-heading {
    min-height: 1.5rem;
    min-width: 12rem
}

.loading.offer-details__wrapper--header h2.x-sub-heading {
    min-height: .75rem
}

.loading.offer-details__wrapper--header .x-offer-details-header__cta.x-button--solid {
    border-radius: 40px
}

.loading.offer-details__wrapper--header .x-offer-details-header__cta.x-button--solid svg,
.loading.offer-details__wrapper--header img {
    opacity: 0
}

.offer-details__header-banner .x-offer-details-header-middle-container .x-offer-details-header-price-container {
    overflow: visible !important
}

.offer-details-header-lob-div>div:last-child {
    border-right: none
}

:root {
    --shimmerColor1: #dde2e6;
    --shimmerColor2: #ebeef0;
    --themeColorBase: rgb(var(--text-color-theme1-base));
    --themeColorHover: rgb(var(--text-color-theme1-hover))
}

.offer-stack-block {
    container-name: osb;
    container-type: inline-size
}

.non-linear-stack-block__text:not(:last-child) {
    margin-bottom: 24px
}

.non-linear-stack-block__text .header strong {
    color: rgb(var(--text-color-theme1-base)/var(--tw-text-opacity, 1))
}

.non-linear-stack-block__text .header div,
.non-linear-stack-block__text .header h1,
.non-linear-stack-block__text .header h2,
.non-linear-stack-block__text .header h3,
.non-linear-stack-block__text .header h4,
.non-linear-stack-block__text .header h5,
.non-linear-stack-block__text .header h6,
.non-linear-stack-block__text .header p {
    display: inline
}

.non-linear-stack-block__text .header div:not(:last-child):after,
.non-linear-stack-block__text .header h1:not(:last-child):after,
.non-linear-stack-block__text .header h2:not(:last-child):after,
.non-linear-stack-block__text .header h3:not(:last-child):after,
.non-linear-stack-block__text .header h4:not(:last-child):after,
.non-linear-stack-block__text .header h5:not(:last-child):after,
.non-linear-stack-block__text .header h6:not(:last-child):after,
.non-linear-stack-block__text .header p:not(:last-child):after {
    content: "\A";
    white-space: pre
}

.bundle-container.show-connector .bundle-card:after {
    align-items: center;
    background-color: #5a23b9;
    border-radius: 50%;
    color: #fff;
    content: "+";
    display: flex;
    font-size: 1rem;
    height: 28px;
    justify-content: center;
    line-height: .5;
    position: absolute;
    right: 50%;
    top: 100%;
    transform: translate(50%, -50%);
    width: 28px;
    z-index: 10
}

@container osb (min-width: 42rem) {
    .bundle-container.show-connector.horizontal .bundle-card:after {
        font-size: 2rem;
        height: 50px;
        right: 0;
        top: 50%;
        transform: translate(66%, -50%);
        width: 50px
    }

    .bundle-container.show-connector.vertical .bundle-card:after {
        font-size: 2rem;
        height: 50px;
        transform: translate(50%, -37%);
        width: 50px
    }
}

.bundle-container.show-connector .bundle-card:not(:has(+*)):after {
    display: none
}

@keyframes placeholderShimmer {
    0% {
        background-position: -468px 0
    }

    to {
        background-position: 468px 0
    }
}

.shimmer-element {
    animation-duration: 1s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: placeholderShimmer;
    animation-timing-function: linear;
    background: var(--shimmerColor1);
    background-image: linear-gradient(to right, var(--shimmerColor1) 0, var(--shimmerColor2) 20%, var(--shimmerColor1) 40%, var(--shimmerColor1) 100%);
    background-repeat: no-repeat;
    background-size: 800px 100%;
    display: block;
    position: relative
}

.shimmer-element.theme1 {
    background: var(--themeColorBase);
    background-image: linear-gradient(to right, var(--themeColorBase) 0, var(--themeColorHover) 20%, var(--themeColorBase) 40%, var(--themeColorBase) 100%);
    background-repeat: no-repeat;
    background-size: 800px 100%
}

.x-share-offer {
    padding-top: .75rem
}

.x-share-offer--copy {
    margin-top: 2.25rem !important
}

.x-share-offer--copy-field {
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important
}

.x-share-offer--copy-button {
    margin-top: .75rem !important
}

@media only screen and (min-width:48rem) {
    .x-share-offer--copy-button {
        margin-left: .75rem !important
    }
}

.x-share-offer--copy-button.disabled {
    border: 1px solid #e6eaed;
    cursor: default
}

.x-ui-theme--dark .x-share-offer--copy-button.disabled,
.x-ui-theme--dark-clear .x-share-offer--copy-button.disabled {
    color: #0b7dbb
}

.x-share-offer--copy-button.disabled:hover {
    background-color: #fff;
    color: #0b7dbb
}

@media only screen and (min-width:48rem) {
    .x-overlay.x-overlay--share-offer .x-overlay-container {
        padding: 3rem 2.25rem 2.25rem !important
    }
}

.personalization-api-container-text {
    align-items: center;
    font-family: var(--text-family-brand);
    font-size: var(--size-font-16);
    padding: .5rem;
    text-align: center
}

.plan-comparison-card_fade-into-expand-button {
    background: linear-gradient(0deg, #fff, #fff 40%, hsla(0, 0%, 100%, .3));
    position: relative
}

.fcc-label-toggle {
    border-top-width: 1px;
    transition: max-height .5s ease-out
}

.plan-comparison-divider-color-purple {
    border-color: #5a23b9
}

.pricing-term-dropdown {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-color: var(--palette-grey-80, #232328);
    border-width: 2px
}

.pricing-term-dropdown:focus {
    border-color: var(--palette-purple-50, #5a23b9);
    border-width: 2px
}

.pricing-term-dropdown:focus-visible {
    outline: none
}

.pricing-header-border {
    border-bottom: 1px solid;
    border-color: var(--palette-grey-10, #ececf2);
    border-top-left-radius: 8px;
    border-top-right-radius: 8px
}

.pricing-section-border {
    border: 1px solid;
    border-color: var(--palette-grey-10, #ececf2)
}

@media screen and (min-width:672px) {

    .pricing-accordion-body,
    .pricing-other-info {
        padding: 32px 24px
    }

    .pricing-contract-label,
    .pricing-dropdown,
    .pricing-line-item,
    .pricing-two-col-regular-label {
        grid-column: span 2/span 2
    }

    .pricing-one-col-line-item {
        grid-column: span 4/span 4
    }

    .pricing-chart-header,
    .pricing-header-border,
    .pricing-row,
    .pricing-tooltip-body {
        grid-template-columns: repeat(8, minmax(0, 1fr))
    }

    .pricing-header-border {
        padding: 24px 64px
    }

    .pricing-heading-poi {
        grid-column: span 8/span 8
    }

    .pricing-heading,
    .pricing-tooltip-heading {
        justify-content: flex-start
    }

    .pricing-headline,
    .pricing-item-container {
        text-align: left
    }

    .pricing-chart-header {
        padding-left: 64px;
        padding-right: 64px
    }

    .pricing-poi-item-container {
        padding-left: 0;
        padding-right: 0
    }

    .pricing-item-container {
        margin-bottom: 0;
        margin-top: 0;
        padding: 24px 32px
    }

    .pricing-summary-row {
        padding-bottom: 32px;
        padding-left: 32px;
        padding-right: 32px
    }

    .pricing-chart-header,
    .pricing-header-border,
    .pricing-row,
    .pricing-totals,
    .pricing-two-col-list {
        gap: 24px
    }

    .pricing-contract-label {
        grid-column-end: 7
    }

    .pricing-dropdown,
    .pricing-regular-label,
    .pricing-two-col-regular-label {
        grid-column-end: 9
    }
}

@media screen and (min-width:1056px) {

    .pricing-accordion-body,
    .pricing-other-info {
        padding: 40px 32px
    }

    .pricing-line-item {
        grid-column: span 3/span 3
    }

    .pricing-header-border>div:first-of-type,
    .pricing-heading-column,
    .pricing-heading-summary,
    .pricing-headline,
    .pricing-one-col-item,
    .pricing-one-col-line-item,
    .pricing-regular-label,
    .pricing-tooltip-body.div,
    .pricing-totals {
        grid-column: span 6/span 6
    }

    .pricing-chart-header,
    .pricing-header-border,
    .pricing-row,
    .pricing-tooltip-body {
        grid-template-columns: repeat(12, minmax(0, 1fr))
    }

    .pricing-heading-poi {
        grid-column: span 12/span 12
    }

    .pricing-summary-row {
        padding: 24px 64px 40px
    }

    .pricing-totals {
        grid-template-columns: repeat(6, minmax(0, 1fr))
    }

    .pricing-contract-label,
    .pricing-dropdown,
    .pricing-two-col-item,
    .pricing-two-col-regular-label {
        grid-column: span 3/span 3
    }

    .pricing-contract-label {
        grid-column-end: 10
    }

    .pricing-dropdown,
    .pricing-regular-label,
    .pricing-two-col-regular-label {
        grid-column-end: 13
    }
}

.pc-body li {
    list-style: none
}

.pc-body .text-caption {
    font-weight: 500
}

.pricing-tile__main-container {
    padding: 40px 24px 32px
}

.pricing-split-info-container>.pricing-split-term-description:first-child {
    overflow: hidden;
    position: relative
}

.pricing-split-info-container>.pricing-split-term-description:first-child:after {
    border-bottom: 1px dotted #000;
    border-left: none;
    bottom: 4px;
    content: "";
    margin-left: 2px;
    position: absolute;
    width: 100%
}

.pricing-split-info-container>.pricing-split-group-price {
    padding-left: 2px;
    width: 1%
}

.pricing-tile__btns-container .pricing-tile__cta2 {
    --tw-border-opacity: 0.15;
    border-color: rgb(var(--border-color-stroke-neutral-base)/var(--tw-border-opacity));
    transition: .2s ease-in;
    transition-property: background-color, border-color, box-shadow
}

h2.price-toolTip {
    font-size: 14px
}

.pricing-tile__btns-container .pricing-tile__cta2:focus {
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
    --tw-ring-opacity: 1;
    --tw-ring-color: rgb(var(--ring-color-neutral-base)/var(--tw-ring-opacity));
    --tw-ring-offset-width: 2px;
    --tw-ring-offset-color: rgb(var(--ring-offset-color-material-neutral-base));
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000)
}

.pricing-tile__cta3:hover:after {
    --tw-bg-opacity: 1;
    background-color: rgba(97, 56, 245, var(--tw-bg-opacity))
}

a.pricing-tile__cta3:focus {
    color: #000
}

.c__gbb-card-tooltip__tip {
    opacity: 0;
    transition: opacity .4s ease-in-out .5s, visibility .4s ease-in-out .5s;
    visibility: hidden
}

.c__gbb-card-tooltip__tip.c__gbb-card-tooltip__tip--active {
    opacity: 1;
    transition: opacity .4s ease-in-out .5s, visibility .4s ease-in-out .5s;
    visibility: visible
}

.c__gbb-card-tooltip__content {
    word-wrap: break-word;
    font-size: 14px;
    overflow-wrap: break-word;
    word-break: break-word
}

@media screen and (min-width:550px) {
    .pricing-tile__main-container {
        padding: 40px 32px
    }
}

@media screen and (min-width:768px) {
    .pricing-tile__main-container {
        padding: 40px
    }
}

@media screen and (min-width:1024px) {
    .pricing-tile__main-container {
        padding: 40px 24px
    }
}

@media screen and (min-width:1280px) {
    .pricing-tile__main-container {
        padding: 40px 32px
    }
}

@media screen and (min-width:1568px) {
    .pricing-tile__main-container {
        padding: 40px
    }
}

.background-video-component>.x-video-inner>.x-player-video[poster] {
    object-fit: cover
}

.share-offer__container {
    display: flex;
    flex-direction: column
}

.share-offer__email-btn {
    height: 3.25rem;
    transition: .2s ease-in;
    transition-property: background-color, border-color, box-shadow
}

.share-offer__copy-link {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    position: relative
}

.share-offer__copy-link span.wrap {
    display: inline
}

.share-offer__copy-btn,
.share-offer__copy-link input {
    height: 3rem
}

.dynamic-links {
    margin: 0 auto;
    max-width: 64rem;
    padding: 1.875rem 1.125rem;
    width: 100%
}

@media only screen and (min-width:64rem) {
    .dynamic-links {
        padding: 3rem 0
    }
}

.dynamic-links__list {
    list-style-type: none;
    margin: 0;
    padding: 0
}

.dynamic-links__item {
    padding-bottom: 1.125rem;
    text-align: left
}

.icon_container {
    border-color: var(--palette-grey-10, #ececf2);
    border-radius: 50%;
    border-style: solid;
    border-width: 2px;
    padding: .5rem
}

.icon_container.offer--ineligible {
    color: var(--palette-orange-40, #f95600)
}

.offer--ineligible prism-icon {
    --text-color-caution-base: var(--palette-orange-40, #f95600)
}

.speed-range-tile-richtext ol,
.speed-range-tile-richtext ul {
    list-style: disc
}

.xds-gbb-button-next {
    right: -7px
}

.xds-gbb-button-back {
    left: -7px
}

.xds-gbb-button-back,
.xds-gbb-button-next {
    border: 0;
    border-radius: 50%;
    box-shadow: 0 4px 6px 0 rgba(0, 0, 0, .25);
    height: 48px;
    outline: 1px solid var(--palette-grey-10, #ececf2);
    position: absolute;
    top: 300px;
    width: 48px;
    z-index: 50
}

.xds-gbb-button-back:hover,
.xds-gbb-button-next:hover {
    box-shadow: none
}

.xds-gbb-button-back.xds-gbb-button-disabled,
.xds-gbb-button-next.xds-gbb-button-disabled {
    display: none
}

.xds-gbb-button-back:focus,
.xds-gbb-button-next:focus {
    outline: 0
}

.xds-gbb-button-back:focus-visible,
.xds-gbb-button-next:focus-visible {
    border-radius: 50%
}

.xds-gbb-cards-main-wrapper {
    margin: 0 auto;
    position: relative;
    width: 320px
}

.xds-gbb-offer-cards-main {
    background-color: var(--patch-white);
    border: 1px solid #ceceda;
    border-radius: 4px;
    box-shadow: 0 12px 20px 0 rgba(0, 0, 0, .15);
    max-width: 320px;
    overflow: hidden;
    width: 100%
}

.xds-gbb-offer-cards-main.xds-gbb-cards-with-dots {
    border-bottom: 0;
    border-radius: 4px 4px 0 0;
    margin: 0 28px
}

.xds-gbb-offer-cards-main .lob-tile-main {
    border-radius: 6px;
    overflow: hidden
}

.xds-gbb-offer-cards-inner {
    display: flex;
    flex-direction: column
}

.xds-gbb-offer-cards-inner a {
    color: var(--patch-black);
    font-size: 14px;
    font-weight: 700;
    text-decoration: underline;
    -webkit-text-decoration-color: #b6b6b7;
    text-decoration-color: #b6b6b7;
    text-decoration-thickness: .09rem;
    text-underline-position: under
}

.xds-gbb-offer-cards-inner a:hover,
.xds-gbb-offer-cards-main a:active {
    color: var(--patch-black);
    -webkit-text-decoration-color: var(--patch-black);
    text-decoration-color: var(--patch-black)
}

.xds-gbb-offer-cards-inner a.disabled {
    color: #b6b6b7;
    pointer-events: none;
    -webkit-text-decoration-color: #b6b6b7;
    text-decoration-color: #b6b6b7
}

.xds-gbb-eyebrow-container {
    margin: 0 auto;
    padding: 12px 0;
    width: 100%
}

.xds-gbb-card-offer-name-container,
.xds-gbb-eyebrow-container {
    align-items: center;
    display: flex;
    display: -ms-flexbox;
    justify-content: center
}

.xds-gbb-card-offer-name-container {
    margin: 16px 0
}

.xds-gbb-card-lob-container {
    margin: 5px 6px 10px
}

.xds-gbb-section-divider {
    background-color: #d9d9d9;
    border: none;
    height: 1px;
    margin: 0;
    width: 100%
}

.xds-gbb-card__heading2 {
    font-size: 20px;
    font-weight: 700
}

.xds-gbb-card__recommended-container {
    display: flex;
    justify-content: center;
    margin-top: 8px
}

.xds-gbb-card__recommended {
    align-items: center;
    background-color: var(--palette-purple-50, #5a23b9);
    border-radius: 14px;
    color: var(--palette-purple-50, #5a23b9);
    display: flex;
    font-size: 10px;
    font-weight: 700;
    height: 28px;
    padding: 4px 8px
}

.xds-gbb-card__center {
    text-align: center
}

.xds-gbb-card__heading3 {
    font-size: 14px;
    font-weight: 700;
    line-height: normal;
    text-transform: uppercase
}

.xds-gbb-card__body1 {
    font-size: 12px;
    text-align: left
}

.xds-gbb-card__display1 {
    font-size: 48px;
    font-weight: 700;
    line-height: 1
}

.xds-gbb-card__display2 {
    font-size: 26px;
    font-weight: 700;
    margin-top: 2px
}

.xds-gbb-promo-container {
    margin: 16px 24px
}

.xds-gbb-promo-inner {
    align-items: center;
    display: flex;
    display: -ms-flexbox;
    flex-direction: row;
    justify-content: flex-start
}

.xds-gbb-promo-inner:not(:first-of-type) {
    margin-top: 8px
}

.xds-gbb-offer-cards-main .promo-icon-container {
    margin-right: 23px;
    max-height: 30px;
    max-width: 30px
}

.xds-gbb-offer-cards-main .promo-icon-container img {
    height: auto;
    width: 100%
}

.xds-gbb-offer-cards-main .promo-icon-container img.scEmptyImage.scEnabledChrome {
    height: auto;
    max-height: none;
    max-width: none;
    min-height: auto;
    min-width: auto;
    width: 100%
}

.xds-gbb-primary-container {
    margin: 24px
}

.xds-gbb-primary-inner {
    align-items: center;
    display: flex;
    display: -ms-flexbox;
    flex-direction: row;
    justify-content: flex-start
}

.xds-gbb-primary-inner:not(:first-child) {
    margin-top: 16px
}

.primary-inner-icon-container {
    margin-left: 8px;
    margin-right: 30px;
    max-height: 11px;
    max-width: 15px
}

.icon-bullet {
    height: auto;
    vertical-align: top;
    width: 100%
}

.xds-gbb-price-container {
    display: flex;
    display: -ms-flexbox;
    flex-direction: row;
    justify-content: center;
    line-height: normal
}

.xds-gbb-price-main {
    margin: 24px 0 0
}

.xds-gbb-card__price-freq-accessible {
    clip: rect(1px, 1px, 1px, 1px);
    border: 0;
    height: 1px;
    margin: 0;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px
}

.xds-gbb-price-inner {
    margin-left: 5px;
    width: 170px
}

.xds-gbb-selection-container {
    margin: 24px 0;
    padding: 0 32px;
    text-align: center
}

.xds-gbb-selection-btn {
    background: #000;
    border-radius: 4px;
    color: #fff;
    height: 64px;
    width: 100%
}

p.xds-gbb-selection-btn {
    padding: 20px 0
}

.xds-gbb-link-container {
    margin-top: 12px;
    text-align: center
}

.xds-gbb-carousel-controls-container {
    align-items: center;
    display: flex;
    display: -ms-flexbox;
    justify-content: center;
    margin: 0 auto;
    width: 100%
}

@media (min-width:768px) {
    .xds-gbb-cards-main-wrapper {
        width: 472px
    }

    .xds-gbb-offer-cards-main {
        max-width: 472px
    }
}

@media (min-width:1024px) {
    .xds-gbb-cards-main-wrapper {
        width: 1024px
    }

    .xds-gbb-offer-cards-main {
        max-width: 325px
    }
}

@media (min-width:1280px) {
    .xds-gbb-cards-main-wrapper {
        width: 1280px
    }

    .xds-gbb-offer-cards-main {
        max-width: 421px
    }
}

@media (min-width:1536px) {
    .xds-gbb-cards-main-wrapper {
        width: 1440px
    }

    .xds-gbb-offer-cards-main {
        max-width: 464px
    }
}

.xds-gbb__button-next {
    box-shadow: 0 12px 12px -8px;
    right: -12px
}

.xds-gbb__button-back {
    box-shadow: 0 -12px 12px -8px;
    left: -12px;
    transform: rotate(180deg)
}

.xds-gbb__button-back,
.xds-gbb__button-next {
    border-radius: 50%;
    position: absolute;
    top: 100px;
    transition: background-color .2s ease-in;
    z-index: 50
}

.xds-gbb__button-back.xds-gbb__button-disabled,
.xds-gbb__button-next.xds-gbb__button-disabled {
    display: none
}

.xds-gbb__button-back:focus-visible,
.xds-gbb__button-next:focus-visible {
    border: 2px solid #fff;
    outline: 1px solid #000
}

.xds-gbb__button-next:focus-visible {
    right: -14px
}

.xds-gbb__button-back:focus-visible {
    left: -14px
}

.xds-gbb-cards__main-wrapper .swiper-container-horizontal>.swiper-pagination-bullets {
    bottom: 0
}

.swiper-pagination-bullet.swiper-pagination-bullet-active {
    background-color: #000
}

.xds-gbb-cards__main-wrapper .swiper-wrapper {
    justify-content: normal
}

.xds-gbb-cards__main-wrapper .swiper-slide:last-child {
    margin-right: 0 !important
}

.xds-gbb-cards__main-wrapper {
    margin: 0 auto;
    position: relative;
    width: 310px
}

.xds-gbb-offer-cards__outer-eyebrow {
    background-color: #fff;
    display: flex;
    min-height: 52px
}

.xds-gbb-offer-cards__eyebrow {
    align-items: center;
    background-color: #6138f5;
    border-radius: 8px 8px 0 0;
    display: flex;
    flex-direction: row;
    font-weight: 500;
    height: auto;
    justify-content: center;
    letter-spacing: 0;
    line-height: 20px;
    min-height: 52px;
    padding: 8px 32px;
    width: 100%
}

.xds-gbb-offer-cards__eyebrow-image {
    height: 32px;
    padding-right: 4px;
    width: 32px
}

.xds-gbb-offer-cards__main {
    border-radius: 4px;
    max-width: 310px;
    width: 100%
}

.xds-gbb-offer-cards__main .pricing-tile__btns-container .check-availability-button button {
    padding: 0
}

.xds-gbb-offer-cards__main .pricing-tile__btns-container .check-availability-button .check-availability-button-text {
    display: block;
    padding: 12px 24px
}

@media screen and (min-width:550px) {
    .xds-gbb-cards__main-wrapper {
        width: 472px
    }

    .xds-gbb-offer-cards__main {
        max-width: 472px
    }
}

@media (max-width:767px) {
    .xds-gbb-offer-cards__main .text-headline1 {
        font-size: 20px
    }
}

@media screen and (max-width:1279px) {
    .xds-gbb-offer-cards__eyebrow {
        padding-left: 24px;
        padding-right: 24px
    }
}

@media screen and (max-width:1568px) {

    .xds-gbb-offer-cards__eyebrow,
    .xds-gbb-offer-cards__outer-eyebrow {
        min-height: 50px
    }
}

@media screen and (min-width:1024px) {
    .xds-gbb-cards__main-wrapper {
        width: 1024px
    }

    .xds-gbb-offer-cards__main {
        max-width: 325px
    }

    .xds-gbb__button-back,
    .xds-gbb__button-next {
        height: 48px;
        width: 48px
    }

    .xds-gbb-cards__main-wrapper .swiper-wrapper {
        justify-content: center
    }
}

@media screen and (min-width:1280px) {
    .xds-gbb-cards__main-wrapper {
        width: 1280px
    }

    .xds-gbb-offer-cards__main {
        max-width: 421px
    }
}

@media screen and (min-width:1568px) {
    .xds-gbb-cards__main-wrapper {
        width: 1440px
    }

    .xds-gbb-offer-cards__main {
        max-width: 464px
    }
}

:root {
    --four: 4px;
    --four-2: calc(var(--four)*2);
    --four-3: calc(var(--four)*3);
    --four-4: calc(var(--four)*4);
    --four-6: calc(var(--four)*6);
    --four-8: calc(var(--four)*8);
    --four-10: calc(var(--four)*10);
    --four-12: calc(var(--four)*12);
    --four-16: calc(var(--four)*16);
    --four-20: calc(var(--four)*20);
    --four-22: calc(var(--four)*22);
    --question-max-width: 400px;
    --question-horizontal-whitespace: var(--four-3);
    --question-padding-left: var(--four-6);
    --question-padding-right: var(--four-6);
    --question-padding-top: var(--four-10);
    --question-padding-bottom: var(--four-6);
    --stage-tracker-width: 68px;
    --back-button-size: var(--four-10);
    --image-size: var(--four-10);
    --grey-opaque: #f6f6f9;
    --grey-transparent: rgba(246, 246, 249, 0);
    --grey-dark: #ececf2;
    --animation-cycle: 0.6s;
    --hmd-blue-50: #1f69ff;
    --hmd-green-50: #008558;
    --hmd-grey-10: #ececf2;
    --hmd-grey-40: #8b8b97;
    --hmd-grey-90: #0d0d0f;
    --hmd-orange-50: #e64f00;
    --hmd-purple-50: #6138f5;
    --hmd-red-50: #e6004a;
    --hmd-white: #fff;
    --hmd-yellow-40: #fa0;
    --gradient-full-color: var(--grey-dark)
}

.help-me-decide {
    background-position: 50%;
    background-size: cover;
    padding-bottom: var(--four-10);
    padding-top: var(--four-10);
    position: relative
}

.help-me-decide .card {
    --shadow-color: rgba(var(--background-color-material-theme1-base), 0.3);
    background-color: rgb(var(--background-color-material-neutral-base));
    min-height: 200px;
    min-width: 250px;
    overflow: hidden;
    position: relative;
    width: 100%
}

.help-me-decide .cta {
    padding: 12px 24px;
    text-decoration: none
}

.help-me-decide .question-offer-wrapper {
    transition: transform var(--animation-cycle)
}

.help-me-decide .question-offer-wrapper-gradient {
    overflow: hidden
}

.help-me-decide .question-offer-wrapper,
.help-me-decide .question-offer-wrapper-gradient {
    display: flex;
    flex-direction: row;
    position: relative;
    width: 100%
}

.help-me-decide .questions {
    display: flex;
    flex-direction: row
}

.help-me-decide .internet-offer,
.help-me-decide .question {
    --required-width: min(calc(100vw - var(--question-horizontal-whitespace)*2), var(--question-max-width));
    border-radius: var(--four-2);
    flex-direction: column;
    margin-left: var(--question-horizontal-whitespace);
    margin-right: var(--question-horizontal-whitespace);
    min-width: var(--required-width);
    padding: var(--question-padding-top) var(--question-padding-right) var(--question-padding-bottom) var(--question-padding-left);
    text-align: center;
    transition: opacity var(--animation-cycle)
}

.help-me-decide .question {
    display: flex
}

.help-me-decide .internet-offer {
    display: block;
    transition: opacity var(--animation-cycle)
}

.help-me-decide .internet-offer:not(.show) {
    visibility: hidden
}

.help-me-decide .question .options {
    flex-grow: 1
}

.help-me-decide a:focus,
.help-me-decide button:focus {
    outline: none
}

.help-me-decide .option.option.btn:hover {
    border: 1px solid #000
}

.help-me-decide .stage-dots {
    display: flex;
    flex-direction: row;
    height: var(--four-3);
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
    margin-top: var(--four-8);
    width: var(--stage-tracker-width)
}

.help-me-decide .stage-dots>div {
    background-color: initial;
    border: 1px solid rgb(var(--background-color-material-theme1-inverse-base));
    border-radius: 5px;
    height: 10px;
    transition: all var(--animation-cycle);
    width: 10px
}

.help-me-decide .stage-dots>.one,
.help-me-decide .stage-dots>.two {
    margin-left: var(--four-4)
}

.help-me-decide .stage-dots>.one.active:before,
.help-me-decide .stage-dots>.one:before,
.help-me-decide .stage-dots>.two.active:before,
.help-me-decide .stage-dots>.two:before {
    content: "";
    display: block;
    height: 2px;
    margin-top: calc(50% - 1px);
    transition: all var(--animation-cycle)
}

.help-me-decide .stage-dots>.one:before,
.help-me-decide .stage-dots>.two:before {
    background-color: rgba(0, 0, 0, .5);
    margin-left: calc(-150% - 1px);
    width: var(--four-2)
}

.help-me-decide .stage-tracker {
    height: var(--four-3);
    position: relative
}

.help-me-decide .stage-tracker button {
    background-color: #fff;
    border: 2px solid transparent;
    border-radius: 20px;
    box-shadow: 0 var(--four-4) var(--four-4) -8px var(--shadow-color);
    height: var(--back-button-size);
    left: calc(50% - var(--stage-tracker-width)/2 - var(--back-button-size) - var(--four-4));
    opacity: 1;
    padding: 10px;
    position: absolute;
    top: calc(-2px - 100%);
    transition: all var(--animation-cycle);
    width: var(--back-button-size)
}

.help-me-decide .stage-tracker button:disabled {
    box-shadow: 0 0 0 0 transparent;
    cursor: default;
    opacity: 0
}

.help-me-decide .stage-tracker button:focus {
    border: 2px solid #000
}

.help-me-decide .stage-dots>.active {
    background-color: rgb(var(--background-color-material-theme1-inverse-base))
}

.help-me-decide .stage-dots>.one.active:before,
.help-me-decide .stage-dots>.one.completed:before,
.help-me-decide .stage-dots>.two.active:before {
    background-color: rgb(var(--background-color-material-theme1-inverse-base));
    margin-left: calc(-200% - 1px);
    width: var(--four-4)
}

.help-me-decide h2 {
    margin-bottom: var(--four-8);
    margin-left: auto;
    margin-right: auto;
    position: relative;
    width: 70%;
    z-index: 1
}

.help-me-decide h3 {
    margin-bottom: var(--four-2)
}

.help-me-decide p {
    margin-bottom: var(--four-6)
}

.help-me-decide img {
    height: var(--image-size);
    margin-left: auto;
    margin-right: auto;
    object-fit: cover;
    object-position: center;
    width: var(--image-size)
}

.help-me-decide .internet-offer h3 {
    margin-bottom: var(--four-6)
}

.help-me-decide .internet-offer img {
    height: var(--image-size);
    margin-bottom: var(--four-2);
    width: var(--image-size)
}

.help-me-decide .internet-offer p.text-display1 {
    font-size: 48px;
    margin-bottom: 0;
    margin-top: 0
}

.help-me-decide .internet-offer p.speed-units {
    font-weight: 400;
    margin-top: var(--four)
}

.help-me-decide .internet-offer p.speed-description {
    color: var(--secondary-color);
    font-weight: 400;
    margin-top: var(--four-6)
}

.help-me-decide .internet-offer p {
    margin-bottom: 0
}

.help-me-decide .stage-2 .internet-offer.show {
    opacity: 1
}

.help-me-decide .stage-0 .internet-offer.show,
.help-me-decide .stage-0 .internet-offer:not(.show),
.help-me-decide .stage-1 .internet-offer.show,
.help-me-decide .stage-1 .internet-offer:not(.show) {
    opacity: 0
}

.help-me-decide .internet-offer .card {
    border: 2px solid #ceceda;
    border-radius: var(--four-2);
    margin-left: auto;
    margin-right: auto;
    max-width: 200px;
    padding: var(--four-6) var(--four-8) var(--four-8);
    width: 70vw
}

.help-me-decide .internet-offer .cta {
    margin-bottom: 5px;
    margin-top: 27px
}

.help-me-decide .internet-offer .cta,
.help-me-decide .question .cta {
    background-color: rgb(var(--background-color-material-neutral-inverse-base));
    border-radius: var(--four);
    color: rgb(var(--background-color-material-neutral-base));
    display: flex;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

.help-me-decide .internet-offer h3,
.help-me-decide .question h3 {
    position: relative
}

.help-me-decide .internet-offer h3:before,
.help-me-decide .question h3:before {
    border: 2px solid transparent;
    border-radius: 6px;
    bottom: -3px;
    content: "";
    display: block;
    left: -3px;
    position: absolute;
    right: -3px;
    top: -3px;
    transition: border var(--animation-cycle)
}

.help-me-decide .question .option-wrapper {
    display: inline-block;
    margin: var(--four);
    position: relative
}

.help-me-decide .question .option {
    align-items: center;
    background-color: rgb(var(--background-color-material-neutral-base));
    border: 1px solid #ceceda;
    border-radius: var(--four);
    color: rgb(var(--background-color-material-neutral-inverse-base));
    display: flex;
    flex-grow: 1;
    justify-content: center;
    padding: var(--four-3) 10px;
    pointer-events: none;
    transition: border var(--animation-cycle)
}

.help-me-decide .question .option-wrapper input+.option:before {
    --offset: -3px;
    --thickness: 1px
}

.help-me-decide .question .cta {
    transition: background-color var(--animation-cycle)
}

.help-me-decide .question .cta:disabled {
    background-color: rgba(35, 35, 40, .3);
    cursor: not-allowed
}

.help-me-decide .internet-offer .cta:before,
.help-me-decide .question .cta:before {
    --offset: -6px;
    --thickness: 2px
}

.help-me-decide .internet-offer .cta:before,
.help-me-decide .question .cta:before,
.help-me-decide .question .option-wrapper input+.option:before {
    border: var(--thickness) solid transparent;
    border-radius: 6px;
    bottom: var(--offset);
    content: "";
    left: var(--offset);
    position: absolute;
    right: var(--offset);
    top: var(--offset);
    transition: border var(--animation-cycle)
}

.help-me-decide .internet-offer .cta:focus:before,
.help-me-decide .question .cta:focus:before,
.help-me-decide .question .option-wrapper input:focus+.option:before {
    border: var(--thickness) solid rgb(var(--background-color-material-neutral-inverse-base))
}

.help-me-decide .question .option-wrapper.one-column {
    max-width: 225px;
    width: calc(100% - var(--four-2))
}

.help-me-decide .question .option-wrapper.two-column {
    width: calc(50% - var(--four-2))
}

.help-me-decide .question .option-wrapper input {
    bottom: 0;
    cursor: pointer;
    display: block;
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0
}

.help-me-decide .question .option-wrapper .option {
    min-height: 48px
}

.help-me-decide .question .option-wrapper input,
.help-me-decide .question .option-wrapper label {
    height: 100%;
    width: 100%
}

.help-me-decide .question .option-wrapper input:disabled,
.help-me-decide .question .option-wrapper input:disabled+label {
    cursor: not-allowed;
    pointer-events: none
}

.help-me-decide .question .option-wrapper input:checked+label.option.btn {
    border: 1px solid #6138f5
}

.help-me-decide .question .option-wrapper input:hover+label.option.btn {
    border: 1px solid #000
}

.help-me-decide .internet-offer .card .image-wrapper {
    margin-bottom: var(--four-2);
    margin-left: auto;
    margin-right: auto
}

.help-me-decide .internet-offer .card img {
    --transparent-black: transparent;
    background-blend-mode: multiply;
    background-image: linear-gradient(to right, var(--transparent-black), var(--transparent-black), var(--transparent-black), var(--transparent-black))
}

.help-me-decide .internet-offer:not(.loading) .card img {
    opacity: 1
}

.help-me-decide .internet-offer.loading .card img {
    opacity: 0
}

.help-me-decide .questions .acp-text-color p {
    color: var(--patch-purple-50) !important
}

.help-me-decide .internet-offer .card a,
.help-me-decide .internet-offer .card h1,
.help-me-decide .internet-offer .card h3,
.help-me-decide .internet-offer .card p {
    color: transparent;
    transition: all var(--animation-cycle)
}

.help-me-decide .internet-offer.loaded .card a,
.help-me-decide .internet-offer.loaded .card h1,
.help-me-decide .internet-offer.loaded .card h3,
.help-me-decide .internet-offer.loaded .card p {
    color: rgb(var(--background-color-material-theme1-inverse-base))
}

.help-me-decide .internet-offer.loading .card .image-wrapper,
.help-me-decide .internet-offer.loading .card a,
.help-me-decide .internet-offer.loading .card h1,
.help-me-decide .internet-offer.loading .card h3,
.help-me-decide .internet-offer.loading .card p {
    animation: gradient 2s linear infinite;
    background-image: linear-gradient(to right, var(--grey-opaque), var(--grey-dark), var(--grey-opaque), var(--grey-dark));
    background-size: 300% 100%;
    pointer-events: none
}

.help-me-decide .internet-offer.loading .card a,
.help-me-decide .internet-offer.loading .card div:not(.image-rounder) img,
.help-me-decide .internet-offer.loading .card h1,
.help-me-decide .internet-offer.loading .card h3,
.help-me-decide .internet-offer.loading .card p {
    border-radius: 3px
}

.help-me-decide .internet-offer.loading .card a::-moz-selection,
.help-me-decide .internet-offer.loading .card h1::-moz-selection,
.help-me-decide .internet-offer.loading .card h3::-moz-selection,
.help-me-decide .internet-offer.loading .card p::-moz-selection,
.help-me-decide .internet-offer.loading .card span::-moz-selection {
    background-color: initial;
    color: transparent !important
}

.help-me-decide .internet-offer.loading .card a,
.help-me-decide .internet-offer.loading .card a::selection,
.help-me-decide .internet-offer.loading .card h1,
.help-me-decide .internet-offer.loading .card h1::selection,
.help-me-decide .internet-offer.loading .card h3,
.help-me-decide .internet-offer.loading .card h3::selection,
.help-me-decide .internet-offer.loading .card p,
.help-me-decide .internet-offer.loading .card p::selection,
.help-me-decide .internet-offer.loading .card span::selection {
    background-color: initial;
    color: transparent !important
}

@keyframes gradient {
    0% {
        background-position: 0 0
    }

    to {
        background-position: 100% 0
    }
}

@media screen and (min-width:461px) {
    .help-me-decide .question-offer-wrapper.stage-1 {
        transform: translateX(calc(-100vw + var(--question-horizontal-whitespace)*3))
    }

    .help-me-decide .question-offer-wrapper.stage-2 {
        transform: translateX(calc(-200vw + var(--question-horizontal-whitespace)*8))
    }
}

@media screen and (min-width:497px) {
    :root {
        --internet-offer-horizontal-whitespace: var(--four-22)
    }

    .help-me-decide .question-offer-wrapper {
        --full-card-width: var(--question-max-width);
        --double-card-width: calc(var(--full-card-width)*2);
        --half-card-width: calc(var(--full-card-width)/2);
        --horizontal-margin: calc(var(--question-horizontal-whitespace)*2);
        --full-card-width-with-margin: calc(var(--full-card-width) + var(--horizontal-margin));
        --double-card-width-with-margin: calc(var(--double-card-width) + var(--horizontal-margin) + var(--question-horizontal-whitespace));
        --half-card-width-with-margin: calc(var(--half-card-width) + var(--horizontal-margin));
        --half-card-width-with-half-margin: calc(var(--half-card-width) + var(--question-horizontal-whitespace))
    }

    .help-me-decide .question-offer-wrapper.stage-0 {
        transform: translateX(calc(50vw - var(--half-card-width-with-half-margin)))
    }

    .help-me-decide .question-offer-wrapper.stage-1 {
        transform: translateX(calc(50vw - var(--half-card-width-with-half-margin) - var(--full-card-width-with-margin)))
    }

    .help-me-decide .question-offer-wrapper.stage-2 {
        transform: translateX(calc(50vw - var(--half-card-width-with-margin) - var(--double-card-width-with-margin)))
    }
}

@media screen and (min-width:560px) {
    .help-me-decide .question-offer-wrapper-gradient:after {
        background-image: linear-gradient(to right, var(--gradient-full-color) 5%, var(--grey-transparent) 20%, var(--grey-transparent) 80%, var(--gradient-full-color) 95%);
        content: "";
        display: block;
        height: 100%;
        left: 0;
        pointer-events: none;
        position: absolute;
        top: 0;
        width: 100%;
        z-index: 50
    }
}

@media screen and (min-width:768px) {
    .help-me-decide {
        padding-bottom: var(--four-12);
        padding-top: var(--four-12)
    }

    .help-me-decide .question-offer-wrapper-gradient:after {
        background-image: linear-gradient(to right, var(--gradient-full-color) 5%, var(--grey-transparent) 30%, var(--grey-transparent) 70%, var(--gradient-full-color) 95%)
    }
}

@media screen and (min-width:1024px) {
    :root {
        --question-max-width: 310px;
        --internet-offer-horizontal-whitespace: var(--four-12)
    }

    .help-me-decide {
        padding-bottom: var(--four-16);
        padding-top: var(--four-16)
    }

    .help-me-decide h2 {
        margin-bottom: var(--four-16)
    }

    .help-me-decide .question .cta,
    .help-me-decide .stage-tracker .stage-dots>.two,
    .help-me-decide .stage-tracker button {
        display: none
    }

    .help-me-decide .question-offer-wrapper {
        max-width: 1272px
    }

    .help-me-decide:after {
        background-image: linear-gradient(90deg, var(--grey-transparent) 30%, var(--gradient-full-color) 60%);
        content: "";
        display: block;
        height: 100%;
        pointer-events: none;
        position: absolute;
        right: 0;
        top: 0;
        transition: width var(--animation-cycle);
        width: 0;
        z-index: 0
    }

    .help-me-decide.initial-stage:after {
        width: 50%
    }

    .help-me-decide .question-offer-wrapper-gradient:after {
        background-image: linear-gradient(to right, var(--grey-transparent) 5%, var(--grey-transparent) 30%, var(--grey-transparent) 70%, var(--grey-transparent) 95%)
    }

    .help-me-decide .question-offer-wrapper.stage-2 {
        transform: translateX(calc(50vw - var(--half-card-width-with-margin) - var(--full-card-width-with-margin) + 6px))
    }

    .help-me-decide .stage-1 .internet-offer.show {
        opacity: 1
    }
}

@media screen and (max-width:1023px) {
    .help-me-decide {
        background-image: none !important
    }

    .help-me-decide .question-offer-wrapper.show-offer:not(.stage-2) .internet-offer a.cta {
        visibility: hidden
    }
}

@media screen and (min-width:1280px) {
    :root {
        --question-max-width: 400px;
        --internet-offer-horizontal-whitespace: var(--four-22);
        --question-padding-top: var(--four-10);
        --question-padding-bottom: var(--four-10);
        --question-padding-left: var(--four-10);
        --question-padding-right: var(--four-10)
    }

    .help-me-decide {
        padding-bottom: var(--four-20);
        padding-top: var(--four-20)
    }
}

.help-me-decide-container.patch-bg-blue-50 {
    --gradient-full-color: var(--hmd-blue-50)
}

.help-me-decide-container.patch-bg-green-50 {
    --gradient-full-color: var(--hmd-green-50)
}

.help-me-decide-container.patch-bg-grey-10 {
    --gradient-full-color: var(--hmd-grey-10)
}

.help-me-decide-container.patch-bg-grey-40 {
    --gradient-full-color: var(--hmd-grey-40)
}

.help-me-decide-container.patch-bg-grey-90 {
    --gradient-full-color: var(--hmd-grey-90)
}

.help-me-decide-container.patch-bg-orange-50 {
    --gradient-full-color: var(--hmd-orange-50)
}

.help-me-decide-container.patch-bg-purple-50 {
    --gradient-full-color: var(--hmd-purple-50)
}

.help-me-decide-container.patch-bg-red-50 {
    --gradient-full-color: var(--hmd-red-50)
}

.help-me-decide-container.patch-bg-white {
    --gradient-full-color: var(--hmd-white)
}

.help-me-decide-container.patch-bg-yellow-40 {
    --gradient-full-color: var(--hmd-yellow-40)
}

.help-me-decide .offer-price-point {
    margin-top: var(--four-2)
}

.help-me-decide .offer-price-point .text-button2,
.help-me-decide .offer-price-point>.text-headline1 {
    display: inline-block;
    line-height: 1
}

.help-me-decide .offer-price-point>.text-button2 {
    padding-top: 1px
}

.acp-toggle-text {
    border-radius: 8px;
    font-size: .625rem;
    font-weight: 500
}

.offer-price-point-dollar {
    font-size: 1.5rem
}

@media (min-width:1024px) {
    .help-me-decide .offer-price-point>.text-button2 {
        padding-top: 2px
    }
}

@media screen and (max-width:768px) {
    .tbyb-confirmation-mobile-btn button {
        --width: 64px
    }

    .tbyb-confirmation-mobile-pill-desc {
        font-size: 14px;
        line-height: 20px
    }

    .imei-submit-btn button,
    .syt-cta button {
        --width: 100%
    }
}

.your-plan-mobile-subtabs.horizontal.sc-prism-tabs-h .tab-header.sc-prism-tabs {
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 999px;
    box-shadow: 1px 5px 5px #ceceda;
    display: flex;
    flex-direction: row;
    gap: 8px;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    max-width: 100%;
    padding: 8px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

.your-plan-mobile-subtabs.horizontal.sc-prism-tabs-h .tab-header.sc-prism-tabs button.sc-prism-tabs {
    background: transparent;
    border: 2px solid transparent;
    border-radius: 20px;
    color: #333;
    cursor: pointer;
    font-weight: 400;
    height: 32px;
    padding: 4px 12px;
    white-space: nowrap
}

.your-plan-mobile-subtabs.horizontal.sc-prism-tabs-h .tab-header.sc-prism-tabs button.sc-prism-tabs.active,
.your-plan-mobile-subtabs.horizontal.sc-prism-tabs-h .tab-header.sc-prism-tabs button.sc-prism-tabs[aria-selected=true] {
    background: #f1ecf8;
    border: 2px solid #5a23b9;
    color: #5a23b9;
    font-weight: 600
}

.your-plan-mobile-subtabs.horizontal.sc-prism-tabs-h .tab-indicator.sc-prism-tabs {
    display: none
}

.gateway-halo {
    --base-bottom: 18%;
    --cycle: 7s;
    --cyl-w: 160px;
    --rim-h: 30px;
    --cyl-h: 40px;
    --sx-start: 0.55;
    --sy-start: 0.55;
    --sx-end: 1.45;
    --sy-end: 1.45;
    --cyl-max-alpha: 1;
    --cyl-accent: #0ac284;
    --cyl-stroke: color-mix(in srgb, var(--cyl-accent) 88%, transparent);
    --cyl-wall: var(--cyl-accent);
    --stroke-w: 5px;
    --cyl-overlap: 4px;
    --cyl-draw-w: calc(var(--cyl-w) + var(--cyl-overlap)*2 + var(--stroke-w)*2);
    --wipe-feather: 14px;
    --back-edge-blur: 0.35px;
    isolation: isolate;
    position: relative
}

.gateway-halo--green {
    --cyl-accent: #0ac284
}

.gateway-halo--purple {
    --cyl-accent: #e55fea
}

.gateway-halo-image-wrapper {
    align-items: center;
    display: inline-flex;
    height: 100%;
    justify-content: center;
    max-height: 100%;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

.gateway-halo>* {
    position: relative;
    z-index: 2
}

.gateway-halo-front-layer {
    inset: 0;
    pointer-events: none;
    position: absolute;
    z-index: 3
}

.gateway-halo-front-layer:after,
.gateway-halo-front-layer:before {
    animation: cylFrontWipe var(--cycle) linear infinite;
    bottom: var(--base-bottom);
    content: "";
    height: calc(var(--cyl-h) + var(--rim-h));
    left: 50%;
    -webkit-mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 14px), transparent), linear-gradient(270deg, #000 0, #000 calc(100% - 14px), transparent);
    mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 14px), transparent), linear-gradient(270deg, #000 0, #000 calc(100% - 14px), transparent);
    -webkit-mask-position: 0 0, calc(50% - 6px) 0;
    mask-position: 0 0, calc(50% - 6px) 0;
    -webkit-mask-repeat: no-repeat, no-repeat;
    mask-repeat: no-repeat, no-repeat;
    -webkit-mask-size: calc(50% + 6px) 100%, calc(50% + 6px) 100%;
    mask-size: calc(50% + 6px) 100%, calc(50% + 6px) 100%;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transform: translateX(-50%) scaleX(var(--sx-start)) scaleY(var(--sy-start));
    transform-origin: 50% 100%;
    width: var(--cyl-draw-w);
    will-change: transform, opacity;
    z-index: 0
}

.gateway-halo-front-layer:after {
    animation-delay: calc(var(--cycle)*-.5)
}

.gateway-halo-front-layer--wall:after,
.gateway-halo-front-layer--wall:before {
    background: linear-gradient(to bottom, color-mix(in srgb, var(--cyl-wall) 3%, transparent) 0, color-mix(in srgb, var(--cyl-wall) 5%, transparent) 8%, color-mix(in srgb, var(--cyl-wall) 8%, transparent) 16%, color-mix(in srgb, var(--cyl-wall) 12%, transparent) 24%, color-mix(in srgb, var(--cyl-wall) 9%, transparent) 50%, transparent 100%) 0 calc(var(--rim-h)/2) /100% calc((var(--cyl-h) + var(--rim-h)/2)/2) no-repeat
}

.gateway-halo-front-layer--arc:after,
.gateway-halo-front-layer--arc:before {
    background: radial-gradient(farthest-side at 50% 0, transparent calc(100% - var(--stroke-w)), var(--cyl-stroke) calc(100% - var(--stroke-w)) 100%, transparent 101%) 0 calc(var(--rim-h)/2 - .5px) /100% calc(var(--rim-h)/2) no-repeat
}

.gateway-halo:after,
.gateway-halo:before {
    animation: cylBackWipeIn var(--cycle) linear infinite;
    background: radial-gradient(farthest-side at 50% 100%, transparent calc(100% - var(--stroke-w)), var(--cyl-stroke) calc(100% - var(--stroke-w)) 100%, transparent 101%) 0 0 /100% calc(var(--rim-h)/2) no-repeat, radial-gradient(farthest-side at 50% 100%, color-mix(in srgb, var(--cyl-wall) 15%, transparent) 0, color-mix(in srgb, var(--cyl-wall) 13%, transparent) 58%, color-mix(in srgb, var(--cyl-wall) 9%, transparent) calc(100% - var(--stroke-w)), transparent calc(100% - var(--stroke-w)), transparent 101%) 0 0 /100% calc(var(--rim-h)/2) no-repeat, linear-gradient(to bottom, color-mix(in srgb, var(--cyl-wall) 8%, transparent) 0, color-mix(in srgb, var(--cyl-wall) 8%, transparent) 8%, color-mix(in srgb, var(--cyl-wall) 7%, transparent) 16%, color-mix(in srgb, var(--cyl-wall) 7%, transparent) 24%, color-mix(in srgb, var(--cyl-wall) 5%, transparent) 50%, transparent 100%) 0 calc(var(--rim-h)/2 - .5px) /100% calc((var(--cyl-h) + var(--rim-h)/2)/2 + .5px) no-repeat;
    bottom: var(--base-bottom);
    -webkit-clip-path: inset(0 0 0 0);
    clip-path: inset(0 0 0 0);
    content: "";
    filter: blur(var(--back-edge-blur)) drop-shadow(0 0 10px rgba(140, 190, 255, .18)) drop-shadow(0 0 18px rgba(140, 190, 255, .12));
    height: calc(var(--cyl-h) + var(--rim-h));
    left: 50%;
    -webkit-mask-image: linear-gradient(#000, #000), linear-gradient(#000, #000), linear-gradient(#000, #000);
    mask-image: linear-gradient(#000, #000), linear-gradient(#000, #000), linear-gradient(#000, #000);
    -webkit-mask-position: 0 0, 0 calc(var(--rim-h)/2 - 1px), 0 0;
    mask-position: 0 0, 0 calc(var(--rim-h)/2 - 1px), 0 0;
    -webkit-mask-repeat: no-repeat, no-repeat, no-repeat;
    mask-repeat: no-repeat, no-repeat, no-repeat;
    -webkit-mask-size: 100% calc(var(--rim-h)/2), 100% calc((var(--cyl-h) + var(--rim-h)/2)/2 + .5px), 100% 100%;
    mask-size: 100% calc(var(--rim-h)/2), 100% calc((var(--cyl-h) + var(--rim-h)/2)/2 + .5px), 100% 100%;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transform: translateX(-50%) scaleX(var(--sx-start)) scaleY(var(--sy-start));
    transform-origin: 50% 100%;
    width: var(--cyl-draw-w);
    will-change: transform, opacity, clip-path;
    z-index: 0
}

.gateway-halo:after {
    animation-delay: calc(var(--cycle)*-.5)
}

@keyframes cylBackWipeIn {
    0% {
        -webkit-clip-path: inset(0 0 0 0);
        clip-path: inset(0 0 0 0);
        opacity: 0;
        transform: translateX(-50%) scaleX(var(--sx-start)) scaleY(var(--sy-start))
    }

    10% {
        -webkit-clip-path: inset(0 0 0 0);
        clip-path: inset(0 0 0 0);
        opacity: var(--cyl-max-alpha)
    }

    69% {
        -webkit-clip-path: inset(0 0 0 0);
        clip-path: inset(0 0 0 0);
        opacity: var(--cyl-max-alpha)
    }

    to {
        -webkit-clip-path: inset(0 49% 0 49%);
        clip-path: inset(0 49% 0 49%);
        opacity: 0;
        transform: translateX(-50%) scaleX(var(--sx-end)) scaleY(var(--sy-end))
    }
}

@keyframes cylFrontWipe {
    0% {
        -webkit-mask-position: 0 0, 100% 0;
        mask-position: 0 0, 100% 0;
        opacity: 0;
        transform: translateX(-50%) scaleX(var(--sx-start)) scaleY(var(--sy-start))
    }

    10% {
        -webkit-mask-position: 0 0, 100% 0;
        mask-position: 0 0, 100% 0;
        opacity: var(--cyl-max-alpha)
    }

    40% {
        -webkit-mask-position: 0 0, 100% 0;
        mask-position: 0 0, 100% 0;
        opacity: var(--cyl-max-alpha)
    }

    51% {
        -webkit-mask-position: 0 0, 100% 0;
        mask-position: 0 0, 100% 0;
        opacity: var(--cyl-max-alpha)
    }

    85% {
        -webkit-mask-position: -200% 0, 300% 0;
        mask-position: -200% 0, 300% 0;
        opacity: var(--cyl-max-alpha)
    }

    to {
        -webkit-mask-position: -200% 0, 300% 0;
        mask-position: -200% 0, 300% 0;
        opacity: 0;
        transform: translateX(-50%) scaleX(var(--sx-end)) scaleY(var(--sy-end))
    }
}

@media (prefers-reduced-motion:reduce) {

    .gateway-halo:after,
    .gateway-halo:before {
        animation: none !important;
        opacity: .6;
        transform: translateX(-50%) scaleX(var(--sx-end)) scaleY(var(--sy-end))
    }

    .gateway-halo-front-layer:after,
    .gateway-halo-front-layer:before {
        animation: none !important;
        opacity: 0
    }
}

.your-plan-video-modal .modal.sc-prism-modal .modal-container {
    display: flex;
    max-height: none;
    max-width: -webkit-max-content;
    max-width: -moz-max-content;
    max-width: max-content
}

@media (min-width:768px) {
    .your-plan-video-modal .video-player-container video {
        height: calc(70vh - 5.5rem);
        width: auto
    }
}



/* ================================================================
   CENTER & CONTAINER WRAPPER FIX
   ================================================================ */

/* 1. Constrain outer section and center it horizontally */
section[data-component-id="layout-container"],
.hx-car {
  max-width: 1280px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

/* 2. Center title to align with container bounds */
.patch-text-purple-50,
h2:has(+ [data-component-id="carousel"]),
.hx-text-3xl {
  max-width: 1280px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 16px !important;
}

/* 3. Center slides inside Swiper track */
[aria-label="Carousel showing clickable cards"] .swiper {
  width: 100% !important;
  margin: 0 auto !important;
}

[aria-label="Carousel showing clickable cards"] .swiper-wrapper {
  display: flex !important;
  justify-content: center !important; /* Centers grid if viewport is wider */
  gap: 20px !important;
  width: 100% !important;
  transform: none !important; /* Disables unwanted swiper offset translate */
}

/* 4. Flexible slide widths so cards stretch evenly */
[aria-label="Carousel showing clickable cards"] .swiper-slide {
  flex: 1 1 0% !important;
  width: auto !important; /* Overrides inline style="width: 334px;" */
  max-width: 300px !important;
  margin-right: 0 !important; /* Replaces swiper inline margin */
}

/* 5. Center bottom disclaimer footer */
.hx-text-center,
p:contains("Xfinity Internet required") {
  text-align: center !important;
  width: 100% !important;
  margin: 24px auto 0 auto !important;
}
/* ── Section & Swiper Container Setup ── */
.patch-text-purple-50 {
  color: #58258b !important;
}

[aria-label="Carousel showing clickable cards"] .swiper-wrapper {
  display: flex !important;
  gap: 16px !important;
}

[aria-label="Carousel showing clickable cards"] .swiper-slide {
  flex: 1 1 0 !important;
  max-width: 320px !important;
  margin-right: 0 !important;
}

/* ── Card Base Styles ── */
.hx-jss-meta-block-section {
  position: relative !important;
  height: 480px !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  /* Key properties to anchor the graphic to the card bottom */
  background-repeat: no-repeat !important;
  background-position: bottom center !important;
  background-size: contain !important;
}

/* Full-card overlay click link */
.hx-card-link {
  position: absolute !important;
  inset: 0 !important;
  z-index: 5 !important;
}

/* ── Card Background Images & Background Colors ── */
.hx-card-samsung-1 {
  background-color: #ececf1 !important;
  background-image: url("https://assets.comcast.com/assets/dotcom/projects_3/2026/july/xm_7-22-offer-launches/enhancement-tabs_oem-carousel/tab_top-deals/Samsung-NPI_Up-to-1000-TIPS_Desktop-and-Mobioe.jpg") !important;
}

.hx-card-apple-1 {
  background-color: #ffffff !important;
  background-image: url("https://assets.comcast.com/assets/dotcom/projects_3/2026/july/xm_7-22-offer-launches/enhancement-tabs_oem-carousel/tab_top-deals/Apple_Up-to-830-TIPS_Desktop-and-Mobile.jpg") !important;
}

.hx-card-apple-2 {
  background-color: #ffffff !important;
  background-image: url("https://assets.comcast.com/assets/dotcom/projects_3/2026/july/xm_7-22-offer-launches/enhancement-tabs_oem-carousel/tab_free-devices/Apple_iPhone-17-on-us-trade-in_Desktop-and-Mobile.jpg") !important;
}

.hx-card-samsung-2 {
  background-color: #ececf1 !important;
  background-image: url("https://assets.comcast.com/assets/dotcom/projects_3/2026/july/xm_7-22-offer-launches/enhancement-tabs_oem-carousel/tab_top-deals/Samsung-NPI_600-off-no-trade_Destkop-and-Mobile.jpg") !important;
}

/* ── Padding & Text Positioning ── */
.hx-jss-meta-block {
  padding: 32px 24px 0 24px !important;
  position: relative !important;
  z-index: 10 !important;
}

.hx-text-headline1 {
  font-size: 1.35rem !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  color: #101010 !important;
  margin-bottom: 12px !important;
}

.hx-text-body1 {
  font-size: 0.9rem !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
  color: #333333 !important;
}

/* ── Remove Default Overlays & Buttons ── */
.hx-jss-meta-block-section::after {
  display: none !important;
}