/* base video */
.baseVideo .bodytext {
    color: #333333;
}

.baseVideo .bodytext p, .baseVideo .bodytext .btn {
    font-size: 16px;
}

.baseVideo iframe, .baseVideo .image-mask {
    cursor: pointer;
}

.baseVideo .page-teaser h1 {
    max-width: 56rem;
    font-size: 57px;
}

.baseVideo .baseVideoHeaderImg {
    display: none;
}

@media (max-width: 992px) {
    .baseVideo .page-teaser h1 {
        max-width: 42rem;
    }
}

@media (max-width: 768px) {
    .baseVideo .bodytext, .baseVideo .btn, .baseVideo .responsive.baseVideoHeader {
        display: none;
    }

    .baseVideo .baseVideoHeaderImg {
        display: block;
    }
}
/* end base video */

/* special bubble */
.specialBubble section {
    display: inline-block;
    position: relative;
    font-family: Lato,sans-serif;
    width: 100%;
    height: auto;
}
.specialBubble section img + .content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
}
.specialBubble section img {
    z-index: 2;
    position: relative;
    /* because the image is now cube and with is greater than height*/
    width: 100%;
    height: auto;
}
.specialBubble section .bubble {
    display: table;
    position: absolute;
    right: 0;
    top: 70%;
    background: rgba(57,187,223,1);
    padding: 38px;
    width: 260px;
    height: 260px;
    border-radius: 100%;
    text-align: center;
    z-index: 3;
}
.specialBubble section .bubble p {
    display: table-cell;
    font-size: 1.2vw;
    vertical-align: middle;
    color: #ffffff;
}
.specialBubble section .content-mask {
    top: 2em;
    padding-left: 2em;
    position: absolute;
    width: 90%;
}
.specialBubble {
    padding-right: 6%;
}
.specialBubble .divider {
    z-index: 2;
    position: relative;
    height: 3px;
    background-color: transparent;
}
.isAppleDevice video.landingpageBubbleIframe {
    width: 100%;
    height: 100%;
}
@media (max-width: 1200px) {
    .isAppleDevice .specialBubble section .bubble {
        top: 66%;
    }
    .isAppleDevice.specialBubble section .bubble p {
        font-size: 2.6vw;
    }
    .container {
        margin-right: 0;
        margin-left: 0;
    }
}
@media (max-width: 1024px) {
    .specialBubble section .bubble {
        top: 60%;
        width: 230px;
        height: 230px;
    }
}
@media (max-width: 540px) {
    .isAppleDevice.specialBubble section .bubble {
        top: 57%;
        width: 150px;
        height: 150px;
        padding: 10px;
    }
    .isAppleDevice.specialBubble section .bubble p {
        font-size: 3vw;
    }
}
@media (max-width: 420px) {
    .isAppleDevice.specialBubble section .bubble {
        width: 100px;
        height: 100px;
    }
    .isAppleDevice.specialBubble section .bubble p {
        font-size: 3.2vw;
    }
}
/* end special bubble */

/* Overlay Playbutton for square layout */
.wrapper-playbtn {
    display:table;
    width:auto;
    position:relative;
}
.playpause {
    background-image:url(../Images/play-solid.svg);
    background-repeat:no-repeat;
    width:10%;
    height:10%;
    position:absolute;
    left:0;
    right:0;
    top:0;
    bottom:0;
    margin:auto;
    background-size:contain;
    background-position: center;
    cursor: pointer;
    z-index: 2000;
}

@media (max-width: 768px) {
    .videoPlayButton {
        width: 100%;
        height: auto;
    }
}

/* End Overlay Playbutton for square layout */