/* CUSTOM VIDEOJS.CSS */

.video-js {
    /* padding-bottom: 40%; hidden in case we need to add it back for some cases; maybe this was a rule that is needed but the scope was too large */
    position: relative;
    display: inline-block;
    overflow: hidden;


}

.deck-wrapper div.video-js {
    width: 100% !important;
}

@media (max-width: 1023px) and (min-width: 320px){
    .video-js {
        padding-bottom: 35%;

        width: 100% !important;
        left: 0;
    }
}
@media (max-width: 320px){
    .video-js {
        padding-bottom: 55%;
    }
}
.vjs-tech{
   
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    height: 100%;
    width: 620px;
    border: 0;
}

/* Big Play Button (play button at start)
--------------------------------------------------------------------------------
Positioning of the play button in the center or other corners can be done more
easily in the skin designer. http://designer.videojs.com/
*/
body .vjs-default-skin .vjs-big-play-button {
    left: 50%;
    margin-left: -2em;
    top: 50%;
    margin-top: -1.3em;
}