/* Hero  */
.top-section:not(.solid) {
    display: flex;
    flex-direction: column;
    background-image: url("https://assets.xboxservices.com/assets/95/79/957930c3-b255-4b28-938b-f3c484cd637f.jpg?n=Console-Hub_Custom-Hero-0_Xbox-Consoles_767x1175.jpg");
}

.top-section {
    background-repeat: no-repeat;
    background-size: 100% auto;
}

.top-section .m-banner .c-group {
    z-index: 2;
}

@media screen and (min-width: 0px) {
.top-section .jumpgcontainer .jump-g.jump-b {
    font-size: 60px;
    line-height: 50px;}
}

@media screen and (min-width: 768px) and (max-width: 1083px) {
.top-section .jumpgcontainer .jump-g.jump-b {
    top: 10px !important;}
}

@media screen and (min-width: 768px) {
.top-section.solid {
    background-image: url("https://assets.xboxservices.com/assets/3f/62/3f623667-634a-4125-85c3-bf92d8164c5f.jpg?n=Console-Hub_Custom-Hero-768_036489_1920x1008.jpg");} 

.top-section:not(.solid) {
    background-image: url("https://assets.xboxservices.com/assets/8f/db/8fdb9ecf-234c-4953-8f0e-736ecb92435f.jpg?n=Console-Hub_Custom-Hero-768_Xbox-Consoles_1920x1008.jpg");} 

.top-section, .top-section.solid .image-panes {
    padding-top: 48px;} 

.top-section .SB-hero-banner {
    padding-top: 48px !important;} 

.custom-2up {
    position: relative;}
/*
.custom-2up:before {
    content: "";
    background-color: #171717;
    position: absolute;
    display: block;
    width: 100%;
    top: calc(55% - 170px);
    bottom: 0;
    z-index: 1;} */
}

.SB-hero-banner.console-hero {
    z-index: 0;
}

@media screen and (min-width: 1084px) {
.top-section .truncate img {
    width: 92.25%;}
    
.dreamBlade {
    padding-top: 96px;}

.top-section .jumpgcontainer .jump-g.jump-b {
    top: 30px !important;
    font-size: 100px !important;}
}

@media screen and (max-width: 767px) {
.top-section.solid {
    display: flex;
    flex-direction: column;
    background-image: url("https://assets.xboxservices.com/assets/44/ea/44eaa858-69b8-489c-a3e3-270d6dea334a.jpg?n=Console-Hub_Custom-Hero-0_036489_767x1175.jpg");}

.SB-hero-banner.console-hero {
    padding-top: 0 !important;}
    
.SB-hero-banner.nextGen {
    background-size: 50%;}

.accoladeBlade [data-grid="col-12 stack-3"] {
    padding-top: 32px !important;}

.SB-hero-banner.head1a.spBanner {
    padding-top: 48px;}

.gtm-hero .c-heading-3 {
    font-size: 24px;}

.gtm-hero .c-subheading-4 {
    font-size: 16px;}

.gtm-hero .m-mosaic .c-mosaic .c-mosaic-placement .c-heading-3, .gtm-hero .m-mosaic .c-mosaic .c-mosaic-placement .c-subheading-4 {
    padding: 0 1% 0 1%;}
}

.SB-hero-banner.console-hero .banner-background {
    background-color: transparent;
    z-index: 1;
}

@media screen and (max-width: 767px) {
.top-section .zpt:not(.m-image):not(.spBanner)   {
    padding-top: 24px !important;}    

.top-section .spBanner {
    padding-bottom: 48px !important;}    

.SB-hero-banner.console-hero .banner-background, .spBanner {
    background-color: transparent}

.SB-hero-banner.console-hero {
    background-color: transparent;}
}

.SB-hero-banner.console-hero .banner-background {
    padding-bottom: 48px;
}

.SB-hero-banner.console-hero .m-banner h1 {
    /*max-width: 650px;*/
    margin-left: auto;
    margin-right: auto;
}

@media screen and (max-width: 360px) {
.console-hero .m-banner .c-heading-1L {
    font-size: 54px;
    line-height: 56px;}

.console-hero.SB-hero-banner .banner-background {
    top: -115px;}
}

@media screen and (min-width: 1400px) {
.top-section.solid .truncate img {
    width: 91.6%;}

.top-section:not(.solid) .truncate img {
    width: 71.6%;}

.console-hero>.m-banner.jumpgcontainer .jump-g.jump-b {
    top: 25px;
    font-size: 100px;
    line-height: 0;}

.SB-hero-banner.console-hero .banner-background {
    top: -168px;}
}

@media screen and (min-width: 1084px) and (max-width: 1399px) {
.SB-hero-banner.console-hero .banner-background {
    top: -70px;
    margin-bottom: -100px;}
}

@media screen and (min-width: 768px) and (max-width: 1083px) {
    .SB-hero-banner.console-hero .banner-background {
        top: -62px;
        margin-bottom: -90px;
    }
}

@media screen and (min-width: 540px) and (max-width: 768px) {
    .SB-hero-banner.console-hero .banner-background {
       padding-bottom: 75px;
    }
}

@media screen and (max-width: 767px) {
    .SB-hero-banner.console-hero  {
        padding-top: 48px;
    }
    .SB-hero-banner.console-hero .banner-background {
        position: relative;
        padding-top: 0px;
        top: -93px;
        margin-bottom: -102px;
    }
}
@media screen and (max-width: 539px) {
    .SB-hero-banner.console-hero  {
        padding-top: 24px;
    }
}

/* Help Me Choose */
.tune-in.theme-17 {
    background-color: #171717;
    color: #FFF;
}

.tune-in.theme-17 .m-banner {
    border: 2px solid #9bf00b;
}

/* Image Panes */
/* .image-panes .m-panes img {
    height: 450px
} */

.image-panes .m-panes section {
    border: none;
}

.image-panes .m-panes .c-subheading-2 {
    font-weight: 700 !important;
}

.image-panes .m-panes,
.image-panes .m-panes>section {
    padding-top: 0 !important;
}

.image-panes .c-group a.c-call-to-action.f-lightweight {
    margin-top: 0;
}
.image-panes .c-group {
    margin-top: 12px;
}

@media only screen and (max-width: 767px) {
.image-panes .m-panes {
    padding-bottom: 32px !important;}

.image-panes .m-panes>section {
    padding-left: 2.5%;
    padding-right: 2.5%;}
}

@media only screen and (min-width: 1084px) and (max-width: 1399px) {
    .m-panes {
        flex-direction: inherit !important;
    }
}

/* Get the most */
.mosaic-container-console {
    background-color: #e6e6e6;
}

.SB-hero-banner.get-the-most .banner-background {
    padding-bottom: 96px;
}

@media screen and (max-width: 768px) {
.gtm-hero .m-hero-item>div {
    height: 200px;}

.gtm-hero .m-hero-item>div>div {
    top: calc(50%) !important;}
}

@media screen and (min-width: 0px) {
    .SB-hero-banner.head1a.get-the-most .banner-background {
        margin-bottom: -250px;}
    }

@media screen and (min-width: 540px) {
.SB-hero-banner.head1a.get-the-most .banner-background {
    margin-bottom: -180px;}
}

@media screen and (min-width: 768px) {
.SB-hero-banner.head1a.get-the-most .banner-background {
    margin-bottom: -160px;}
}


@media screen and (min-width: 1400px) {
.SB-hero-banner.head1a.get-the-most .banner-background {
    margin-bottom: -121px;}
}

/* Mosaic */
.gtm-hero .c-drawer .c-drawer-toggle[aria-expanded="false"]::before, .gtm-hero .c-drawer .c-drawer-toggle[aria-expanded="true"]::before {
    content: "" !important;
}
.gtm-hero {
    background-color: #e6e6e6;
}

.gtm-hero .c-drawer {
    text-align: center;
    background-color: transparent;
    margin-top: 48px;
}

.gtm-hero .c-drawer .c-drawer-toggle.c-call-to-action.c-glyph {
    padding: 5px 20px 5px 20px;
    font-size: 15px;
    line-height: 18.5px;
    font-weight: 900;
    background: transparent;
    color: #0a4f0a;
    border-color: #0a4f0a;
    outline: 1px solid transparent;
    display: inline-block;
    width: auto;
}

@media screen and (min-width: 1084px) {
    .c-mosaic-placement {
        width: 98% !important;
    }
    .c-mosaic-placement.f-right {
        float: right !important;
    }
    .c-mosaic [data-f-mosaic~="f-vp4-half"] {
        margin-bottom: 1vw;
        background-color: #e6e6e6;
    }
}

.gtm-hero .m-hero-item>div>div[style] {
    max-width: 400px;
}

@media screen and (min-width: 1084px) and (max-width: 1399px) {
    .gtm-hero .m-hero-item {
        height: 49vw;
    }
    div.gtm-hero section.m-hero-item div.high-contrast {
        top: calc(50%);
    }
}

@media screen and (min-width: 1400px) {
    .gtm-hero .m-hero-item {
        height: 50vw;
    }
    div.gtm-hero section.m-hero-item div.high-contrast {
        top: calc(50%);
    }
}

.m-mosaic .c-mosaic .c-mosaic-placement .c-heading-3,
.m-mosaic .c-mosaic .c-mosaic-placement .c-subheading-4 {
    padding: 0 15% 0 15%;
}

.m-mosaic .c-mosaic .c-mosaic-placement .c-heading-3 {
    padding-bottom: 20px;
}


/******* SVGs ************/

.velocity-svg {
    width: 82px;
    margin-left: auto;
    margin-right: auto;
}

.velocity-svg img {
    width: 82px;
    ;
}

.boxshots-svg {
    width: 119px;
    margin-left: auto;
    margin-right: auto;
}

.boxshots-svg img {
    width: 119px;
}

.xgp-svg {
    width: 172px;
    margin-left: auto;
    margin-right: auto;
}

.xgp-svg img {
    width: 172px;
}

@media only screen and (min-width: 768px) and (max-width: 1083px) {
    .xgp-svg {
        width: 142px;
    }
    .xgp-svg img {
        width: 142px;
    }
}

.smart-delivery-svg {
    width: 84px;
    margin-left: auto;
    margin-right: auto;
}

.smart-delivery-svg img {
    width: 84px;
}

.fourKultra-svg {
    width: 83px;
}

.fourKultra-svg img {
    width: 83px;
}

.hdr-svg {
    width: 73px;
}

.hdr-svg img {
    width: 73px;
}

.oneTwentyFPS-svg {
    width: 38px;
}

.oneTwentyFPS-svg img {
    width: 30px;
    top: -15px;
}

.rayTracing-svg {
    width: 69px;
}

.rayTracing-svg img {
    width: 69px;
}

.console-svg {
    width: 56px;
}

.console-svg img {
    width: 56px;
}

.boxes-svg {
    width: 64px;
}

.boxes-svg img {
    width: 64px;
}

.tag-svg {
    width: 65px;
}

.tag-svg img {
    width: 65px;
}

.SB-hero-banner.head1a.optimized .m-banner .c-image {
    max-height: 125px;
}

@media only screen and (max-width: 1779px) {
    .SB-hero-banner.head1a.optimized .m-banner .c-image {
        max-height: 110px;
    }
}

@media only screen and (max-width: 1399px) {
    .SB-hero-banner.head1a.optimized .m-banner .c-image {
        max-height: 75px;
    }
}

.mosaic-support-icon {
    font-family: MWFMDL2-Xbox;
    font-size: 140px;
}

@media only screen and (min-width: 768px) and (max-width: 1083px) {
    .mosaic-support-icon {
        padding-bottom: 35px;
    }
    .m-mosaic .c-mosaic .c-mosaic-placement.support .c-heading-3 {
        padding: 0 12% 0 12%;
    }
}

@media only screen and (min-width: 480px) and (max-width: 767px) {
    .mosaic-support-icon {
        font-size: 115px;
    }
    .m-mosaic .c-mosaic .c-mosaic-placement.support .c-heading-3 {
        padding: 0 5% 0 5%;
    }
}

@media only screen and (min-width: 321px) and (max-width: 479px) {
    .mosaic-support-icon {
        font-size: 90px;
    }
}

@media only screen and (min-width: 0px) and (max-width: 320px) {
    .mosaic-support-icon {
        font-size: 70px;
    }
}


/* Accolade */
.accolade-rotator {
    margin-bottom: 96px;
}

.accoladeBlade .c-paragraph-4 {
    padding-top: 25px !important;
    font-weight: 700
}

.accoladeBlade .content .quotes {
    width: 121px;
    height: 103px;
    margin-right: -50px;
    bottom: 30px;
    position: relative;
    opacity: .11;
}

.accoladeBlade .content .slash {
    width: 32px;
    bottom: 20px;
    position: relative;
    /*left: 28px;*/
    margin: 0 0 0 6%;
}

.accoladeBlade .c-heading-4 {
    font-size: 34px;
    line-height: 40px;
}

.accoladeBlade .content {
    display: inline-flex !important;
    /*top: 36px;*/
    position: relative;
}

.accoladeBlade [data-grid~="col-3"] {
    width: 52%;
    max-width: 340px;
}

.accoladeBlade .m-hero-item>div {
    width: 100%;
}

@media screen and (max-width: 1530px) and (min-width: 1084px) {
    .accoladeBlade .c-heading-4 {
        padding-top: 10px !important;
    }
    .accoladeBlade .c-paragraph-4,
    .accoladeBlade .c-paragraph-2 {
        padding-top: 25px !important;
    }
}

@media screen and (max-width: 1083px) {
    .accoladeBlade .c-paragraph-4 {
        padding-top: 0 !important;
        margin: auto;
    }
}
.accoladeBlade .c-heading-4 {
    font-size: 20px;
    line-height: 24px;
}

.accoladeBlade .m-hero-item.f-transparent:before {
    padding-bottom: 15% !important;
}

.accoladeBlade button.c-action-toggle {
    padding: 0px 10px 4px 0;
}

.accoladeBlade button.c-action-toggle.c-glyph:before {
    margin-right: 0px;
}

@media (min-width: 1084px) {
    .accoladeBlade .m-hero-item.f-transparent:before {
        padding-bottom: 200px !important;
    }
}

@media (min-width: 768px) and (max-width: 1083px) {
    .accoladeBlade .m-hero-item.f-transparent:before {
        padding-bottom: 36% !important;
    }
    .content.lower {
        text-align: center;
        display: block;
        /*margin-top: -30px;*/
    }
}

@media (min-width: 0px) and (max-width: 767px) {
    .accoladeBlade {
        order: 3;
        display: none;
    }
    .accoladeBlade .m-hero-item.f-transparent:before {
        padding-bottom: 8% !important;
    }
    .content.lower {
        text-align: center;
        display: block;
        /*margin-top: -10px;*/
    }


    .mosaic-container-console .c-mosaic-placement picture img {
        height: 100%
    }
    .newXGPshared .spLogo {
        display: block !important;
    }
}

.accoladeBlade .m-hero-item section {
    padding-top: 64px;
    float: none;
    margin: 0 auto;
    display: flex;
    justify-content: center;
}

@media (min-width: 0px) and (max-width: 1083px) {
.accoladeBlade .m-hero-item section {
    flex-direction: column;
    align-items: center;} 
    
.accoladeBlade .m-hero-item .content.lower {
    padding-top: 36px;}
}
.accoladeBlade .m-hero-item section>div {
    float:none;
    flex-basis: content;
    width: auto;
    max-width: none;
}

@media only screen and (max-width: 1083px) {
    .accoladeBlade .m-hero-item section>div {
        min-width: 100%;
        justify-content: center;
    }
}
.accoladeBlade .m-hero-item section>div:first-of-type {
    flex-grow: .06;
}

/* override to make hero flow at mobile */
@media only screen and (max-width: 1083px) {
.custom-hero .m-hero-item:before {
    /* This is what defines the aspect ratio of the hero */
    display: none;}
    
.custom-hero .m-hero-item>div,
.custom-hero .m-hero-item.f-y-center>div>div,
.custom-hero .m-hero-item.f-y-center>div>div,
.custom-hero .m-hero-item.f-y-bottom>div>div,
.custom-hero .m-hero-item.f-y-bottom>div>div,
.custom-hero .m-hero-item>picture img,
.custom-hero .m-hero-item>img,
.custom-hero .m-hero-item>picture {
    /* Some of these styles are redundant for some of these elements, but it doesn't hurt to pile them up in one place */
    position: relative;
    top: 0 !important;
    left: 0 !important;
    transform: none !important;
    overflow: visible;
    height: auto;}

.custom-hero .m-hero-item>div>div {
    padding-bottom: 48px;}
}
    /* END override to make hero flow at mobile */


.supportBanner .c-call-to-action.c-glyph.white-c.f-lightweight:hover {
    color: #FFF !important;
}

.supportBanner .m-global-promotion.f-image>div>div {
    padding-right: 25px;
}

.supportBanner .c-image img {
    height: 80px !important;
    margin: 0 75px 0 75px !important;
}

.high-contrast-mode.white-on-black .accoladeBlade .content .slash {
    filter: invert(1);
}

/* Rebuild */
.heroGradient {
    width: 100% !important;
    position: relative;
    bottom: 0;
    z-index: 1;
    top: -70vw;
}

.heightZero {
    height: 0;
}

.tall5up .m-content-placement div div div.x-type-center img {
    height: auto !important;
    margin: auto !important;
}

.tall5up-container .tall5up .m-content-placement div div div.x-type-center a {
    height: 100px;
    width: 200px;
}

@media screen and (min-width: 0px) {
.nextGen.SB-hero-banner .banner-background {
    margin-bottom: -200px;}
}

@media screen and (min-width: 768px) {
.image-panes .m-panes {
    flex-direction: row;
    align-items: flex-start;
    z-index: 2;
    position: relative;}
}


@media screen and (max-width: 767px) {
.tall5up-container .tall5up .m-content-placement div div div.x-type-center a {
    position: relative;
    display: inline-block;
    left: 25%;}

.tall5up-container .tall5up .m-content-placement div div div.x-type-center {
    transform: translateY(-35.8vw);}

.inlineBubble.SB-hero-banner .banner-background, .nextGen.SB-hero-banner .banner-background, .tall5up-container .SFE-copy p {
    padding-left: 26px;
    padding-right: 26px;}
}

@media screen and (max-width: 540px) {
.tall5up-container .tall5up .m-content-placement div div div.x-type-center {
    transform: translateY(-40.8vw);}
}

@media screen and (max-width: 400px) {
.tall5up-container .tall5up .m-content-placement div div div.x-type-center {
    transform: translateY(-46.8vw);}

.tall5up-container .tall5up .m-content-placement div div div.x-type-center a {
    left: 18%;}
}

.inlineBubble.SB-hero-banner .banner-background {
    background-color: #171717;
    height: 57vw;
}

.inlineBubble .bubbleContainer, .top-section {
    background-color: #171717 !important;
}

@media screen and (min-width: 1084px) {
.inlineBubble.SB-hero-banner .banner-background {
    background-image: url("asset://{a442d835-bd8b-4c2c-8c94-0cbfd7e725bb/Console-Hub_Super-Hero-1400_Power-Your-Dreams_1920x1080.jpg/xbet prod https}");}

.tall5up-container .tall5up .m-content-placement div div div.x-type-center {
    transform: translateY(-150%);}

.inlineBubble .bubbleContainer {
    height: 54vw;} 

.inlineBubble .banner-background p, .nextGen .banner-background {
    max-width: 1000px;
    margin: 0 auto;
    text-align: center;}
}

@media screen and (max-width: 1083px) {
.inlineBubble .banner-background p {
    max-width: 600px;
    margin: 0 auto;
    text-align: center;}

.nextGen .banner-background {
    max-width: 1000px;
    margin: 0 auto;
    text-align: center;}
}

.nextGen .m-ambient-video {
    background-color: #FFF;
}

.inlineVideo {
    z-index: 2;
    position: relative;
}

@media screen and (min-width: 0px) {
.inlineVideo {
    transform: translateY(6vw);
    margin-bottom: 0 !important;}
}

@media screen and (min-width: 450px) {
.inlineVideo {
    transform: translateY(-13vw);
    margin-bottom: -13vw !important;}
}

@media screen and (min-width: 540px) {
.inlineVideo {
    transform: translateY(-20vw);
    margin-bottom: -20vw !important;}
}

@media screen and (min-width: 600px) {
.inlineVideo {
    transform: translateY(-25vw);
    margin-bottom: -25vw !important;}
}

@media screen and (min-width: 768px) {
.inlineVideo {
    transform: translateY(-30vw);
    margin-bottom: -30vw !important;}
}

@media screen and (min-width: 900px) {
.inlineVideo {
    transform: translateY(-36vw);
    margin-bottom: -36vw !important;}
}

@media screen and (min-width: 1084px) {
.inlineVideo {
    transform: translateY(-30vw);
    margin-bottom: -25vw !important;}
}

@media screen and (min-width: 1600px) {
.inlineVideo {
    transform: translateY(-25vw);
    margin-bottom: -20vw !important;}
}

@media screen and (min-width: 1700px) {
.inlineVideo {
    transform: translateY(-28vw);
    margin-bottom: -23vw !important;}
}


@media screen and (min-width: 1400px) and (max-width: 1604px) {
.inlineBubble .banner-background {
    top: -149px !important;}

.SB-hero-banner:not(.console-hero) .jump-g.jump-b {
    top: 0 !important;}
}

@media screen and (min-width: 767px) and (max-width: 1399px) {
.inlineBubble .jump-g.jump-b {
    top: -12px !important;}
}

@media screen and (min-width: 0) {
.inlineBubble .inlineVideo .oneFrame {
    width: 100%;
    height: 56.3vw;}
}

@media screen and (min-width: 500px) {
.inlineBubble .inlineVideo .oneFrame {
    width: 100%;
    height: 54.81vw;}

.nextGen.SB-hero-banner .banner-background {
    margin-bottom: -220px !important;}
}

@media screen and (min-width: 768px) {
.inlineBubble .inlineVideo .oneFrame {
    width: 100%;
    height: 55.10vw;} 
}

@media screen and (min-width: 900px) {
.inlineBubble .inlineVideo .oneFrame {
    width: 100%;
    height: 55.35vw;} 

.inlineBubble.SB-hero-banner .banner-background {
    background-size: contain;}
}

@media screen and (min-width: 1084px) {
.inlineBubble .inlineVideo .oneFrame {
    width: 83.33vw;
    height: 46.87vw;}

.inlineBubble .inlineVideo .fullBubble {
    width: 83.36vw;
    margin: 0 auto;}
}

.lightBox hr.c-divider {
    display: none;
}

.fullBubble {
    background-color: #e6e6e6;
}

.fullBubble .m-banner p {
    padding-bottom: 34px;
}

.halfBubble {
    display: flex;
    flex-wrap: wrap;
    gap: 16px 14px;
    justify-content: center;
    position: relative;
    margin: 0 auto;
    max-width: 1204px;
    padding: 0 16px;
}

.bubble {
    padding: 5px 20px;
    background-color: #107c10;
    border-radius: 10px;
    border: 2px solid #107c10;
    color: white;
    align-items: center;
    justify-content: center;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.bubble {
    text-align: center;
}

.bubble span {
    margin: 0;
    font-size: 22px;
    line-height: 1.5;
    font-weight: 600;
    padding: 0px 25px;
}

.bubble:hover {
    background-color: white;
    color: #107c10; 
    border: 2px solid #107c10;
    transform: scale(1.05);
}

.bubble:focus {
    background-color: white;
    color: #107c10; 
    border: 2px dotted #FFF;
    transform: scale(1.05);
}

.lightBox.c-dialog [role="dialog"] .c-heading a {
    font-weight: 700 !important;
}

.lightBox.c-dialog [role="dialog"] {
    text-align: center;
    min-width: 75vw;
    height: 70%;
    background-color: #000;
    color: #FFF;
}

.lightBox.c-dialog [role="dialog"] h2 {
    font-size: 24px !important;
    margin-top: 66px;
    font-weight: 400;
}

.lightBox .m-content-placement-item>picture {
    padding-bottom: 101%;
}

.lightBox .m-content-placement-item .c-heading {
    padding-right: 0;
}

.lightBox .m-content-placement-item .c-hyperlink {
    margin-right: 0;
}

.lightboxclosebutton::before {
    color: #9bf00b;
    font-size: 20px;
    text-align: center;
    line-height: 38px !important;
    height: 41px !important;
    width: 41px !important;
    box-sizing: border-box;
    border: 2px solid #ccc;
    border-radius: 50%;
    padding: 1px 0 0 1px;
    margin-left: 0px !important;
    top: 0;
}

.lightboxclosebutton {
    font-size: 20px;
    line-height: 41px !important;
    height: 41px !important;
    width: 41px !important;
}


.lightBox.c-dialog [role="dialog"] .c-divider {
    margin: 16px 48px;
    position: relative;
    top: 48px;
    background-color: #ccc;
}


@media screen and (min-width: 768px) and (max-width: 1083px) {
.lightBox.c-dialog [role="dialog"] {
    height: 63%;}

.lightBox.c-dialog [role="dialog"] .c-heading {
    font-size: 18px;
    margin-top: 24px;}
}

@media screen and (max-width: 767px) {
.lightBox.c-dialog [role="dialog"] {
    max-height: 100%;}
    
.lightBox.c-dialog [role="dialog"] {
    height: 100%;
    min-width: 95vw;}
}

.lightBox.c-dialog [role="dialog"] {
    border: none;
}

.lightBox.c-dialog [role="dialog"] strong {
    font-weight: 700;
}

.lightBox.c-dialog a > h3 {
    text-decoration: underline;
}

.lightBox.c-dialog a:hover {
    color: #FFF !important;
}

.lightBox.c-dialog a:focus {
    border: 1px dashed #000 !important;
    outline: 1px dashed #FFF !important;
}

.tall5up .m-content-placement div div div.x-type-center a:focus {
    border: 2px dashed #000 !important;
    outline: 2px dashed #FFF !important;
}

/* Next Gen */
.SB-hero-banner.nextGen .m-banner {
    max-width: 1600px !important;
}

.SB-hero-banner.nextGen {
    background-color: #171717
}

.SB-hero-banner.nextGen .banner-background {
    background-color: transparent !important;
    z-index: 2;
}

@media screen and (max-width: 1084px) and (min-width: 768px) {
.SB-hero-banner.nextGen .banner-background {
    padding-left: 5%;
    padding-right: 5%;}
}

@media screen and (min-width: 1084px) {
.spBanner .m-banner {
    max-width: 1200px !important;}

.lightBox.c-dialog [role="dialog"] {
    height: 50vw !important;}

.lightBox.c-dialog [role="dialog"] .c-heading {
    margin-top: 26px;}
}

@media screen and (min-width: 1400px) {
.SB-hero-banner.nextGen .banner-background {
    margin-bottom: -325px !important;}

.lightBox.c-dialog [role="dialog"] {
    height: 42vw !important;}
}

/* Five Up */
.SB-hero-banner.head1a.tall5up-container .m-banner {
    max-width: 660px !important;
}

@media screen and (min-width: 0px) and (max-width: 600px) {
.SB-hero-banner.head1a.tall5up-container .m-banner {
    padding-bottom: 0;}
}

@media screen and (min-width: 0px) and (max-width: 1083px) {
.SB-hero-banner.head1a.tall5up-container {
    padding-bottom: 96px;}
}

@media screen and (max-width: 320px) {
.SB-hero-banner.head1a .tall5up-background {
    height: 405vw;
    transform: translateY(-396vw);}
}

@media screen and (min-width: 321px) and (max-width: 375px) {
.SB-hero-banner.head1a .tall5up-background {
    height: 385vw;
    transform: translateY(-381vw);}
}

@media screen and (min-width: 376px) and (max-width: 390px) {
.SB-hero-banner.head1a .tall5up-background {
    height: 367vw;
    transform: translateY(-359vw);}
}

@media screen and (min-width: 391px) and (max-width: 414px) {
.SB-hero-banner.head1a .tall5up-background {
    height: 349vw;
    transform: translateY(-343vw);}
}

@media screen and (min-width: 415px) and (max-width: 519px) {
.SB-hero-banner.head1a .tall5up-background {
    height: 335vw;
    transform: translateY(-330vw);}
}

@media screen and (min-width: 520px) and (max-width: 550px) {
.SB-hero-banner.head1a .tall5up-background {
    height: 336vw;
    transform: translateY(-329vw);}
}

@media screen and (min-width: 551px) and (max-width: 579px) {
.SB-hero-banner.head1a .tall5up-background {
    height: 331vw;
    transform: translateY(-325vw);}
}

@media screen and (min-width: 580px) and (max-width: 629px) {
.SB-hero-banner.head1a .tall5up-background {
    height: 322vw;
    transform: translateY(-322vw);}
}

@media screen and (min-width: 630px) and (max-width: 679px) {
.SB-hero-banner.head1a .tall5up-background {
    height: 317vw;
    transform: translateY(-313vw);}
}

@media screen and (min-width: 680px) and (max-width: 734px) {
.SB-hero-banner.head1a .tall5up-background {
    height: 313vw;
    transform: translateY(-309vw);}
}

@media screen and (min-width: 735px) and (max-width: 767px) {
.SB-hero-banner.head1a .tall5up-background {
    transform: translateY(-309vw);}
}

@media screen and (min-width: 768px) and (max-width: 799px) {
.SB-hero-banner.head1a .tall5up-background {
    height: 164vw;
    transform: translateY(-162vw);}
}

@media screen and (min-width: 800px) and (max-width: 849px) {
.SB-hero-banner.head1a .tall5up-background {
    height: 159vw;
    transform: translateY(-158vw);}
}


@media screen and (min-width: 850px) and (max-width: 899px) {
.SB-hero-banner.head1a .tall5up-background {
    height: 157vw;
    transform: translateY(-155vw);}
}

@media screen and (min-width: 900px) and (max-width: 999px) {
.SB-hero-banner.head1a .tall5up-background {
    height: 154vw;
    transform: translateY(-151vw);}
}

@media screen and (min-width: 1000px) and (max-width: 1083px) {
.SB-hero-banner.head1a .tall5up-background {
    height: 152vw;
    transform: translateY(-148vw);}
}

@media screen and (min-width: 1084px) and (max-width: 1199px) {
.SB-hero-banner.head1a .tall5up-background {
    height: 86vw;
    transform: translateY(-96vw);}

.SB-hero-banner.head1a .SFE-copy {
    bottom: 130px !important;}
}

@media screen and (min-width: 1200px) and (max-width: 1299px) {
.SB-hero-banner.head1a .tall5up-background {
    height: 83vw;
    transform: translateY(-91vw);}
    
.SB-hero-banner.head1a .SFE-copy {
    bottom: 130px !important;}
}

@media screen and (min-width: 1300px) and (max-width: 1399px) {
.SB-hero-banner.head1a .tall5up-background {
    height: 82vw;
    transform: translateY(-89vw);}

.SB-hero-banner.head1a .SFE-copy {
    bottom: 130px !important;}
}

@media screen and (min-width: 1400px) and (max-width: 1499px) {
.SB-hero-banner.head1a .tall5up-background {
    height: 82vw;
    transform: translateY(-90vw);}
}

@media screen and (min-width: 1500px) and (max-width: 1600px) {
.SB-hero-banner.head1a .tall5up-background {
    height: 77vw;
    transform: translateY(-85.5vw);}
}

@media screen and (min-width: 1601px) and (max-width: 1699px) {
.SB-hero-banner.head1a .tall5up-background {
    height: 81vw !important;
    transform: translateY(-89.5vw);}
}

@media screen and (min-width: 1700px) and (max-width: 1799px) {
.SB-hero-banner.head1a .tall5up-background {
    height: 81vw !important;
    transform: translateY(-88.5vw);}
}

@media screen and (min-width: 1800px) {
.SB-hero-banner.head1a .tall5up-background {
    height: 78vw;
    transform: translateY(-84.5vw);}
}

.SB-hero-banner.head1a.spBanner .banner-background {
    background-color: transparent;
    padding-bottom: 0;
}

/* Slider XGP */
.m-banner .xgpSvg {
    max-width: 279px;
}
.slider {
    opacity: 0;
    transition: opacity 1000ms;
    transition-delay: 1700ms;
}

.slider.fade-in {
    opacity: 1;
}

.slider {
    margin: auto;
    overflow: hidden;
    position: relative;
}

.slide picture {
  height: 157px !Important;
}

.slider .m-product-placement-item.f-clean>picture:hover {
    border: 1px solid rgba(0,0,0,0) !important;
}

.slide-track {
    display: flex;
}

.newReleases {
  margin-top: 8px;
}
.newReleases .slide-track {
    animation: scroll 100s linear infinite;
}

.newReleases2 .slide-track {
    animation: scroll2 100s linear infinite;
    animation-delay: 1.7s;
}

.pausePlay {
    height: 36px !important;
    width: 36px;
    position: absolute;
    color: white;
    background-color: rgba(0, 0, 0, 0.60);
    border: 1px solid white !important;
    bottom: 24px;
    display: block;
    padding: 2px 0px 0px 0px;
    margin-left: 24px;
}

.slider .pausePlay:focus {
    outline: 2px dotted #000 !important;
    border: 2px dotted #FFF !important;
}

.slide {
    list-style: none;
}

.newReleases .paused, .newReleases2 .paused {
    animation-play-state: paused;
}

/* Dream with Us Sneak Slider */
.grayBox {
    background-color: #e6e6e6;
    padding-bottom: 70px !important;
    float: none !important;
}

.contentSlider {
    margin-top: -148px !important;;
}

@media screen and (max-width: 768px) {
.contentSlider {
    margin-top: -100px !important;}
}

.stealth-carousel .stealth-carousel-arrow {
    background-color: #000 !important;
    color: #FFF !important;
}

.stealth-carousel .stealth-carousel-arrow {
    width: 44px;
    height: 44px;
}

.stealth-carousel-arrow.left-arrow {
    display: block !important;
}

@media screen and (min-width: 768px) {
.grayBox {
    padding-bottom: 137px !important;
    float: none !important;}

.stealth-carousel {
    justify-content: center;
    width: 95%;}

.stealth-carousel-arrow.left-arrow.remove, .stealth-carousel-arrow.right-arrow.remove {
    display: none !important;}
}


@media screen and (max-width: 767px) {
.stealth-carousel .stealth-sub-carousel.center-carousel {
    display: none;}

.stealth-carousel .stealth-sub-carousel.left-carousel {
    position: relative;
    width: auto;}

.stealth-carousel .stealth-sub-carousel.left-carousel {
    display: flex;}

#Stealth-Carousel {
    padding: 12px 0 0 0 !important;}

.stealth-carousel .stealth-sub-carousel.center-carousel {
    margin-top: 0;
    margin-bottom: 0;}

.stealth-carousel .stealth-carousel-arrow.right-arrow {
    right: 3% !important;
    top: 42%;}

.stealth-carousel .stealth-carousel-arrow.left-arrow {
    left: 3% !important;
    top: 42%;}
}

.stealth-sub-carousel-panel .panel-content {
    padding: 12px 0;
}

.stealth-carousel .stealth-sub-carousel.left-carousel, .stealth-carousel .stealth-sub-carousel.right-carousel {
    opacity: 1;
}

.stealth-carousel .stealth-sub-carousel .stealth-sub-carousel-panel {
    box-shadow: none;
}

.stealth-carousel .stealth-sub-carousel.left-carousel .stealth-sub-carousel-panel .panel-content h3, .stealth-carousel .stealth-sub-carousel.left-carousel .stealth-sub-carousel-panel .panel-content p, .stealth-carousel .stealth-sub-carousel.left-carousel .stealth-sub-carousel-panel .panel-content a, .stealth-carousel .stealth-sub-carousel.right-carousel .stealth-sub-carousel-panel .panel-content h3, .stealth-carousel .stealth-sub-carousel.right-carousel .stealth-sub-carousel-panel .panel-content p, .stealth-carousel .stealth-sub-carousel.right-carousel .stealth-sub-carousel-panel .panel-content a {
    visibility: initial !important;
}

.stealth-carousel .stealth-carousel-arrow.right-arrow {
    right: 1%;
    top: 38%;
}
.stealth-carousel .stealth-carousel-arrow.left-arrow {
    top: 38%;
    left: 1%;
}
.stealth-sub-carousel {
    transform: scale(0.95) !important;
}

@media screen and (max-width: 1200px) and (min-width: 900px) {
.stealth-carousel .stealth-carousel-arrow.right-arrow {
    top: 32%;}

.stealth-carousel .stealth-carousel-arrow.left-arrow {
    top: 32%;}
}

@media screen and (max-width: 899px) and (min-width: 768px) {
.stealth-carousel .stealth-carousel-arrow.right-arrow {
    top: 27%;}

.stealth-carousel .stealth-carousel-arrow.left-arrow {
    top: 27%;}
}

/* Icons */
.dsk48 {
    padding: 42px 0 48px 0;
}

.iconBlade .c-caption-2 {
    font-weight: 700;
}

.icons .spWidth {
    width: 72px;
}

.icons {
    text-align: center;
}

.icons a {
    display: inline-block;
    margin: 0 3.2%;
}

.icons a:nth-child(6) {
    margin-right: 0px;
}

.icons a p {
    font-size: 20px;
}

.icons a:hover p {
    color: #107c10 !important;
    text-decoration: underline;
}

.icons p {
    color: #107c10 !important;
}

.icons .icon-break {
    display: inline;
}

.icons a:focus,
.stay-connected .zoomImg:focus {
    outline: 2px dashed #fff !important;
    border: 2px dashed #000 !important;
}

@media screen and (min-width: 768px) {
.icons a img {
    margin-bottom: 25px;
    max-width: 72px;}

.iconBlade {
    padding-bottom: 48px;}
}

@media screen and (max-width: 940px) {
.icons a img {
    float: none;
    margin-right: 0;
    width: 56px;}

.icons a p {
    display: none;}
}

@media screen and (max-width: 640px) {
.icons .icon-break {
    display: block;}
    
.icons .icon-break:first-of-type {
    margin-bottom: 32px;}

.icons a {
    margin: 0 5%;}
}

@media screen and (max-width: 539px) {
.icons a img {
    width: 48px;}
}

.gtm-hero .c-drawer>a[aria-expanded="true"].c-call-to-action:not(.glyph-play):after {
    content: "" !important;
}

.gtm-hero .c-drawer>a.c-call-to-action:not(.glyph-play):after {
    vertical-align: middle;
    margin-top: -1px;
    content: "";
}

/* XAA Blade */
.image-block img {
    display: block;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}

.all-inclusive .image-block {
    margin-bottom: -91px;
}

@media screen and (max-width: 767px) {
.all-inclusive .image-block {
    margin-bottom: -60px;}
}

.all-inclusive .copy-block {
    padding-top: 112px;
    padding-bottom: 96px;
    padding-left: 5%;
    padding-right: 5%;
    text-align: center;
    background-color: #505050;
}

.all-inclusive .copy-block p {
    max-width: 95%;
    margin-left: auto;
    margin-right: auto;
}

.all-inclusive .copy-block a {
    margin-top: 24px;
}

.all-inclusive .copy-block img {
    max-width: 80%;
}

@media screen and (min-width: 1921px) {
.top-section.solid {
background-color: #171717;}

.SB-hero-banner.head1a.tall5up-container .tall5up-background {
    height: 1560px;
    transform: translateY(-1685px);}
    
.c-image, .top-section, .inlineBubble {
    max-width: 1920px !important;
    margin: 0 auto !important;}

.inlineBubble .inlineVideo .oneFrame {
    width: 1600px;
    height: 900px;}

.inlineBubble .inlineVideo .fullBubble {
    width: 100%;}
}

@media screen and (min-width: 0px) {
.c-heading-1L.spText {
    font-size: 42px;
    line-height: 46px;}
}

/* Text Spacing */
@media screen and (max-width: 1399px) {
.text-spacing .m-mosaic .c-mosaic .c-mosaic-placement .c-heading-3, .m-mosaic .c-mosaic .c-mosaic-placement .c-heading-3[style] {
    font-size: 20px !important;
    line-height: 24px !important;}

.text-spacing .m-mosaic .c-mosaic .c-mosaic-placement .c-subheading-4, .m-mosaic .c-mosaic .c-mosaic-placement .c-subheading-4[style] {
    font-size: 16px;}
}

.text-spacing .longTxt, .longTxt[style] {
    font-size: 42px;
}

.text-spacing .gtm-hero .c-heading-3, .gtm-hero .c-heading-3[style] {
    font-size: 24px;
}

.text-spacing .gtm-hero .c-subheading-4, .gtm-hero .c-subheading-4[style] {
    font-size: 16px;
}

@media screen and (max-width: 321px) {
.textwrap {
    text-wrap: auto !important;}
}

/* old version fix */
.inlineBubble.SB-hero-banner .banner-background {
    height: auto !important;
    padding-bottom: 48px;
}

.inlineBubble.SB-hero-banner .banner-background:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 150%;
    background-color: #171717;
}

.inlineVideo {
    transform: none !important;
    margin-bottom: 0 !important;
    padding-bottom: 96px;
}

.inlineVideo:before {
    position: absolute;
    top: 0;
    left: -3.55%;
    width: 107.15%;
    height: 54%;
    background-color: #171717;
    z-index: -1;
}

@media screen and (min-width: 1400px) {
    .inlineBubble.SB-hero-banner .banner-background {
        margin-bottom: -150px;
    }
}

.inlineBubble .banner-background p {
    position: relative;
}