/* ================================================ */


/* BOX SHOT PRODUCT PLACEMENT CUSTOM OVERRIDES */


/* ================================================ */

.featured-games,
.featured-games-header {
    display: none;
    /* hidden until content successfully loads */
    width: 100%;
}

.featured-games .m-area-heading {
    /*padding-top: 0 !important;*/
    padding-bottom: 18px;
}

@media screen and (max-width: 539px) {
    .featured-games .m-area-heading {
        padding-bottom: 9px;
    }
}

.featured-games a.skip-rotator {
    background-color: #333;
    color: #fff;
    position: absolute;
    top: 10%;
    left: -500%;
    transform: translateX(-50%);
    padding: 5px 15px;
    z-index: 400;
}

.featured-games a.skip-rotator:focus {
    left: 50%;
}

#skipped {
    width: .01px;
    height: .01px;
    opacity: 0;
}

.featured-games .m-product-placement {
    max-width: calc(1353px);
    margin: 0 auto;
    float: none;
}

.featured-games * {
    border: 0;
}

.featured-games .c-carousel::before {
    content: "";
    position: absolute;
    bottom: -50px;
    height: 100%;
    width: 100%;
    z-index: -1;
    /*background-color: rgba(103, 114, 128, .5);*/
    /* Done this way because of a small gap than can exist inside an element.*/
    /*-webkit-filter: blur(50px);
  filter: blur(50px);*/
}

@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
    .featured-games .m-product-placement-item::before {
        /*box-shadow: 0px 50px 5px 0px rgba(103, 114, 128, .5); The above method doesn't work in IE */
    }
    .featured-games .c-carousel::before {
        background-color: rgba(103, 114, 128, .3);
        /*box-shadow: 0px 0px 50px 0px rgba(103,114,128,0.5);*/
        width: 100%;
        height: 100%;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
}


/* These containers don't scale, so setting fixed width/height */

.featured-games .m-product-placement-item>a,
.featured-games .m-product-placement-item.f-size-large picture,
.featured-games .c-product-placement.f-size-large picture,
.featured-games .m-product-placement-item.f-size-large,
.featured-games .c-product-placement.f-size-large {
    box-sizing: content-box;
    width: 263px !important;
    height: 440px !important;
    padding: 0 !important;
}

@media screen and (min-width: 768px) and (max-width: 1083px) {
    .featured-games .m-product-placement-item>a,
    .featured-games .m-product-placement-item.f-size-large picture,
    .featured-games .c-product-placement.f-size-large picture,
    .featured-games .m-product-placement-item.f-size-large,
    .featured-games .c-product-placement.f-size-large {
        width: 295px !important;
        height: 494px !important;
    }
    .featured-games {
        transform: translateY(-32%);
    }
}

@media screen and (max-width: 767px) {
    .featured-games .m-product-placement-item>a,
    .featured-games .m-product-placement-item.f-size-large picture,
    .featured-games .c-product-placement.f-size-large picture,
    .featured-games .m-product-placement-item.f-size-large,
    .featured-games .c-product-placement.f-size-large {
        width: 185px !important;
        height: 310px !important;
    }
    .featured-games {
        transform: translateY(-39.5%);
    }
}

@media screen and (max-width: 539px) {
    .featured-games {
        transform: translateY(-30%);
    }
}

@media screen and (max-width: 359px) {
    .featured-games {
        transform: translateY(-30%);
    }
}

.featured-games .m-product-placement-item {
    margin: 0 8px 0 0 !important;
}

.featured-games .m-product-placement-item>a::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 60%;
    background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 70%, rgba(0, 0, 0, 1) 100%);
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 70%, rgba(0, 0, 0, 1) 100%);
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 70%, rgba(0, 0, 0, 1) 100%);
}

.featured-games .m-product-placement-item>a:hover *,
.featured-games .c-product-placement>a:hover * {
    border: 0;
    text-decoration: inherit;
}

.featured-games .m-product-placement-item>a:focus,
.featured-games .c-product-placement>a:focus {
    outline: 2px dashed #000;
    border: 2px dashed #fff;
}

.featured-games .m-product-placement-item>a:focus>picture,
.featured-games .m-product-placement-item>a:focus>.f-default-image>picture,
.featured-games .m-product-placement-item>a:hover>picture,
.featured-games .m-product-placement-item>a:hover>.f-default-image>picture,
.featured-games .c-product-placement>a:focus>picture,
.featured-games .c-product-placement>a:focus>.f-default-image>picture,
.featured-games .c-product-placement>a:hover>picture,
.featured-games .c-product-placement>a:hover>.f-default-image>picture {
    border: 0;
}

.featured-games .m-product-placement-item>a:hover .c-heading,
.featured-games .m-product-placement-item>a:hover .c-subheading,
.featured-games .c-product-placement>a:hover .c-heading,
.featured-games .c-product-placement>a:hover .c-subheading,
.featured-games .m-product-placement-item>a:hover .c-paragraph,
.featured-games .m-product-placement-item>a:focus .c-heading,
.featured-games .m-product-placement-item>a:focus .c-subheading,
.featured-games .c-product-placement>a:focus .c-heading,
.featured-games .c-product-placement>a:focus .c-subheading,
.featured-games .m-product-placement-item>a:focus .c-paragraph {
    text-decoration: none;
}

.featured-games .m-product-placement-item.f-size-large div.slide-content {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    color: white;
    z-index: 100;
    padding: 32px 27px 50px 30px;
    white-space: normal;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 32px, rgba(0, 0, 0, 1) 100%);
}

.featured-games .m-product-placement-item.f-size-large div.slide-content .c-badge.f-small {
    font-size: 11px;
    height: 16px;
    color: #fff;
    background-color: #107c10;
}

.featured-games .m-product-placement-item .slide-content .availability {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
}

.featured-games .m-product-placement-item .slide-content .availability>div {
    bottom: 0;
    right: 0;
    background-color: #fff;
    display: inline-block;
    transform: translateX(-15px) skewX(32deg);
    /* counter this in child element */
}

.featured-games .m-product-placement-item .slide-content .availability p {
    height: 32px;
    line-height: 30px;
    padding: 0 22px 0 47px;
    /* padding compensated for skew and parent margin to maintain 32px */
    color: #000;
    display: inline-block;
    text-align: top;
    transform: skewX(-32deg);
    /* counters parent element */
}

@media screen and (max-width: 767px) {
    .featured-games .m-product-placement-item .slide-content .availability p {
        padding-left: 30px;
        padding-right: 26px;
    }
}

.featured-games .m-product-placement-item .slide-content .availability p span {
    font-family: "MWF-MDL2";
    display: inline-block;
    font-weight: 400;
    font-size: 1.2em;
    vertical-align: middle;
}

.featured-games .m-product-placement-item .slide-content .availability p span.false {
    display: none;
}

.featured-games .m-product-placement-item .slide-content .availability p span:first-of-type {
    padding-left: 8px;
}

.featured-games .m-product-placement-item .slide-content .availability p span:nth-child(2) {
    padding-left: 12px;
}

@media screen and (max-width: 767px) {
    .featured-games .m-product-placement-item .slide-content .availability p span:nth-child(2) {
        padding-left: 11px;
    }
}

.featured-games .availability {
    display: none;
}

.featured-games .m-product-placement-item .c-paragraph,
.featured-games .c-product-placement .c-paragraph {
    color: #fff;
}

.featured-games .m-product-placement-item .slide-content .availability .m-product-placement-item .c-paragraph,
.featured-games .c-product-placement .c-paragraph {
    color: #fff;
}

.featured-games .m-product-placement-item .f-default-image,
.featured-games .c-product-placement .f-default-image {
    padding-right: 0 !important;
}

.featured-games .m-product-placement-item picture .c-image,
.featured-games .c-product-placement picture .c-image {
    top: 0 !important;
    left: 0 !important;
    transform: translate(0, 0) !important;
}

.featured-games .m-product-placement-item>a>picture,
.featured-games .m-product-placement-item>a>.f-default-image>picture,
.featured-games .c-product-placement>a>picture,
.featured-games .c-product-placement>a>.f-default-image>picture {
    border: 0;
}

.featured-games .m-product-placement .c-carousel .c-group {
    padding: 4px 4px 8px 4px;
  }

/* ================================================ */


/* END box shot rotator */


/* ================================================ */