.fancybox__container {
    z-index: 9999;
}
.fancybox__content {
    width: 100% !important;
    height: 100% !important;
}

section#available-now {
    background-image: url('https://cdn.fastly.steamstatic.com/steamdeck/images/hero_availableNow_bg.jpg');
    background-repeat: no-repeat;
    background-color: rgb(240, 203, 195);
    background-color: #f0f0f0;
    background-size: auto 90%;
    background-position: top center;
    padding-bottom: 0;
}
section#available-now .content {
    padding-bottom: 5em;
    padding-top: 1em;
}
section#available-now .gridrow.head div {
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    margin-bottom: 4em;
}
section#available-now h1 {
    margin-bottom: 0;
    margin-left: 0;
}
section#available-now .gridrow.head button {
    margin-bottom: 0.3em;
}
section#available-now .deck-video-frame {
    background-image: url('https://cdn.fastly.steamstatic.com/steamdeck/images/overview_steamDeck_heroCrop.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    position: relative;
    overflow: hidden;
    width: 87.9vw;
    max-width: 75.3em;
    height: 31.5vw;
    max-height: 28.4em;
    margin-bottom: 5em;
}

section#available-now .deck-video-frame .videocontainer {
    position: absolute;
    background: transparent;
    width: 44.4%;
    top: 3.36vw;
    left: 24.2vw;
}
section#available-now .deck-video-frame .videocontainer video {
    background: transparent;
}

@media screen and (min-width: 1500px) {
    section#available-now .deck-video-frame .videocontainer {
        width: 35.1em;
        top: 3.0em;
        left: 19.95em;
    }
}

@media screen and (max-width: 700px) {
    section#available-now {
        background-position: top center;
        background-size: 110% 80%;
    }
    section#available-now .content {
        padding-bottom: 1em;
    }
    section#available-now h1 {
        font-size: 4em;
    }
    section#available-now .gridrow.head div {
        margin-bottom: 2em;
        display: block;
    }
    section#available-now .deck-video-frame {
        left: 50%;
        transform: translateX(-50%);
        width: 43em;
        height: 12em;
        margin-bottom: 3em;
    }
    section#available-now .deck-video-frame .videocontainer {
        width: 15em;
        top: 1.2em;
        left: 13.9em;
    }
    section#available-now .gridrow.dock .copy {
        margin-bottom: 10em;
    }
}


section#available-now .gridrow .cta {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    padding-bottom: 0.6em;
}
section#available-now .gridrow h2 {
    margin-bottom: 0.1em;
}

section#available-now .gridrow .subhead {
	/* display: none; DURING SALE */
}

section#available-now .gridrow .sale_subhead {
	background-color: #FFCC2E;
	font-size: 2.4em;
	line-height: 1.2em;
	width: fit-content;
	padding: 0px 20px;
	margin: 0px;
	text-align: left;
	display: none;
	/* display: none; WHEN NOT ON SALE */
}

@media screen and ( max-width: 700px ) {
    section#available-now .gridrow .sale_subhead {
        font-size: 1.2em;
		line-height: 1.4em;
    }
}

@media screen and ( max-width: 1280px ) {
    section#available-now .gridrow h2 {
        font-size: 4vw;
    }
}
@media screen and ( max-width: 700px ) {
    section#available-now {
        background-size: auto 74%;
    }
    section#available-now .gridrow h2 {
        font-size: 2em;
    }
    section#available-now .gridrow .cta {
        display: block;
        padding-bottom: 0.6em;
        padding-top: 2em;
    }
}
@media screen and ( max-width: 550px ) {
    section#available-now .gridrow h2 {
        font-size: 1.8em;
    }
}

section#topfeature .button-container {
    margin-top: 1em;
}

.ver2 section#topfeature {
    padding-top: 1em;
    padding-bottom: 1.5em;
}

.ver2 #topfeature h1 {
    margin-left: 0;
    margin-top: 0.4em;
    margin-bottom: 0.3em;
    font-size: 2.5em;
}

@media screen and ( min-width: 700px ) {
    .ver2 #topfeature h1 {
        font-size: 6em;
    }
    .ver2.en #topfeature h1 {
        font-size: 6.8em;
    }
    .ver2 #topfeature p.large {
        line-height: 1.2em;
        font-size: 1.8em;
    }
}


.ver2 #topfeature p {
    margin-bottom: 0.8em;
}
.ver2 #topfeature p.large {
    font-weight: 800;
}

.ver2 #topfeature .videocontainer {
    overflow: visible;
}

.ver2 #topfeature .feature-video {
    background-color: var(--bg-dark);
    padding: 1em 1em 0.5em 1em;
    width: 20em;
    justify-content: flex-end;
    flex-direction: column;
    align-items: flex-start;
}

.ver2 #topfeature .feature-video.hide-desktop {
    margin-top: 1em;
    margin-left: auto;
    margin-right: auto;
}

.ver2 #topfeature .feature-video.hide-mobile {
    position: absolute;
    z-index: 9999;
    right: 2em;
    bottom: -1em;
}
.ver2 #topfeature .feature-video p {
    color: var(--bg-light);
    font-weight: 400;
    text-align: left;
    padding-bottom: 0;
    margin-bottom: 0;
}

.ver2 #topfeature .feature-video .thumbnail img {
    width: 100%;
    margin-right: 0;
}

#pillars h1 {
    font-size: 4.7em;
}

.ver2 #pillars .selected h1 {
    color: #1b1b1b;
}

#yourlibrary2.image-backdrop {
    background-image: url('https://cdn.fastly.steamstatic.com/steamdeck/images/ver2/laptop_deck_english.png'), url('https://cdn.fastly.steamstatic.com/steamdeck/images/ver2/overview_laptopanddeck_bg.jpg');
    background-color: rgb(8, 6, 11);
    background-size: auto 143%;
    background-position: center -9em;
}
#yourlibrary2.image-backdrop .spacer {
    height: 33em;
}
#yourlibrary2.image-backdrop h2 {
    text-align: center;
    margin-bottom: 0;
}
#yourlibrary2.image-backdrop .copy {
    margin-top: 0;
    padding-bottom: 3em;
    text-align: center;
}
#experience.image-backdrop {
    background-image: url('https://cdn.fastly.steamstatic.com/steamdeck/images/ver2/overview_deathloop_device_english.png'), url('https://cdn.fastly.steamstatic.com/steamdeck/images/ver2/overview_deathloop_bg.jpg');
    background-color: #efefef;
}

@media screen and ( max-width: 700px ) {
    #yourlibrary2.image-backdrop {
        background-size: auto 143%;
        background-position: center -7em;
    }
    #yourlibrary2.image-backdrop .spacer {
        height: 20em;
    }
    #yourlibrary2.image-backdrop .copy {
        padding-bottom: 1em;
    }
    #experience.image-backdrop {
        background-size: auto 107%;
    }
    section.image-backdrop .spacer {
        height: 45vw;
    }
}

@media screen and ( max-width: 1280px ) {
    #yourlibrary2 p, #yourlibrary2 a {
        font-size: 1.2em;
    }
    #yourlibrary2 h2 br {
        display: none;
    }
    #experience p.large br {
        display: none;
    }
}

#yourlibrary2 .copy {
    margin-top: 2em;
}

@media screen and ( max-width: 700px ) {
    #yourlibrary2 .content {
        padding-bottom: 1em;
    }
    #yourlibrary2 h2 {
        margin-bottom: 1em;
    }
    #yourlibrary2 .col_6,
    #yourlibrary2 .col_6.right,
    #yourlibrary2 .col_6.right .right {
        text-align: center;
    }
}

#feature-hollow-knight {
    background-image: url('https://cdn.fastly.steamstatic.com/steamdeck/images/ver2/overview_playing_hollowKnight.jpg');
}

#feature-hades {
    background-image: url('https://cdn.fastly.steamstatic.com/steamdeck/images/ver2/overview_hades.jpg');
}

#availability img {
    height: 9em;
}
#availability p {
    margin-bottom: 0;
}

section#available-now.anniversary {
    background-image: url('https://cdn.fastly.steamstatic.com/steamdeck/images/anniversarySale_confetti_1500.jpg');
    background-repeat: repeat;
}
section#available-now.anniversary h2 {
    line-height: 1.56em;
    margin-bottom: 0;
}
section#available-now.anniversary h2  {
    background-color: #fff;
    padding-left: 0.3em;
    padding-right: 0.23em;
    padding-top: 0.05em;
    padding-bottom: 0.1em;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    display: inline;
}
section#available-now.anniversary a button {
    color: var(--bg-dark);
    background-color: #fff;
}
section#available-now.anniversary a:hover button {
    color: #fff;
    background-color: var(--bg-dark);
}

@media screen and ( max-width: 700px ) {
    section#available-now.anniversary h2 {
        max-width: 90%;
    }
    section#available-now.anniversary {
        padding-top: 0;
    }
    section#available-now.anniversary .deck-video-frame {
        top: 1.6em;
    }
    section#available-now.anniversary .mobile-head {
        width: 95%;
    }
}

@media screen and ( min-width: 1000px ) {
    section#available-now.anniversary h2 {
        font-size: 3em;
    }
}
@media screen and ( max-width: 1300px ) {
    section#available-now.anniversary br {
        display: none;
    }
}