/* ------------------------------------------------------ Video Shortcode Styles ------------------------------------------------------*/ .video > div:first-child { margin: 0 auto; } .video.md-align-left > div:first-child{margin-left: 0} .video.md-align-center > div:first-child{margin: 0 auto;} .video.md-align-right > div:first-child{margin-left:auto; margin-right: 0} .video-js.vjs-default-skin:not(.instagram) { position: fixed; width: 80%; height: 80%; opacity: 0; left: 10%; top: 10%; z-index: 999999; display: none; } .video-overlay { position: fixed; width: 100%; height: 100%; background: #000; opacity: 0; top: 0; left: 0; z-index: 999998; } .video-img { display: block; position: relative; overflow: hidden; max-width: 496px; background-repeat: no-repeat; background-position: center; background-size: cover; width: 100%; height: 100%; } .video-img:after { background-color: rgba(0, 0, 0, 0.2); content: ""; width: 100%; height: 100%; display: block; } .image-play-btn { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: transform .3s cubic-bezier(0.23, 1, 0.32, 1); backface-visibility: hidden; z-index: 100; } .image-play-btn:hover { transform: translate(-50%, -50%) scale(1.08); } .video .play-btn{ border-radius: 100%; text-align: center; display: table; margin: auto; transition: border-color .2s,transform .2s; } .video .play-btn .play-helper{ transition: transform .2s; } .video .play-btn:hover { transform: scale(1.1); } .video .play-btn:hover .play-helper{ transform: scale(1.1); } .video .play-helper { display: table-cell; vertical-align: middle; padding-left: 10%; padding-top: 10%; } .player .vp-controls{ display:none !important; opacity:0 !important; } .video-js:after{ display:none !important; } .vjs-control-bar{ opacity: 0 !important; }