/* Add ad specific styles below */
.paramount-bleed {
    background: rgb(255,255,255);
    box-sizing: border-box;
}

.paramount-safe {
    z-index: -2;
}

/* Outer Container ============================================================ */
.outer-container {
    bottom: 0;
    color: rgb(0, 0, 0);
    font-family: Helvetica, sans-serif;
    font-size: 10px;
    font-style: italic;
    font-weight: bold;
    height: 100%;
    left: 0;
    line-height: 1.2;
    margin: auto;
    opacity: 1;
    overflow: hidden;
    padding: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
}

/* Background ================================================================ */
.background-landscape {
    bottom: 0;
    display: block;
    height: auto;
    margin: auto 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 1;
}

.device-phone .background-landscape {
    display: none;
}

.background-portrait {
    display: none;
}

.device-phone .background-portrait {
    display: block;
    height: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 1;
}

/* Click Cover ========================================================== */
.click-cover {
    display: block;
    height: 100%;
    left: 0;
    margin: 0;
    position: absolute;
    right: auto;
    top: 0;
    width: 100%;
    z-index: 2;
}

/* Video ================================================================ */
.video-player-container {
    background: rgb(255, 255, 255);
    display: block;
    height: 74.4%;
    left: 0;
    margin: 0 auto;
    overflow: hidden;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 62.4%;
    z-index: -1;
}

.device-phone .video-player-container {
    border-style: hidden;
    bottom: auto;
    height: 49%;
    left: 0;
    margin: 0 auto;
    right: 0;
    top: 0%;
    width: 100%;
}

.video-player {
    background: rgb(0, 0, 0);
    display: block;
    height: 101%;
    left: -0.5%;
    overflow: hidden;
    position: absolute !important;
    top: -0.5%;
    width: 101%;
    z-index: 1;
}

.video-click-cover {
    display: block;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 10;
}

/* Common ================================================================ */
#play {
    opacity: 0;
}

.show-video {
    opacity: 1;
    transition: opacity 0.4s;
    z-index: 3;
}
