varbase-video-player.theme.css in Varbase Media 8.5
.video-player-icon {
position: relative;
}
.video-player-icon.js-video-player-icon {
position: absolute;
top: 0;
left: 0;
right: 0;
margin: 0;
cursor: pointer;
z-index: 3;
}
.video-player-icon:after {
content: "";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: url(../../images/play.svg) no-repeat center center;
height: 72px;
width: 72px;
max-height: 55%;
font-size: 15%;
cursor: pointer;
}
.video-player-icon:hover:after {
opacity: 0.75;
}
[dir="rtl"] .video-player-icon.js-video-player-icon {
right: 0;
left: auto;
}
.media--type-video-embed,
.media--type-video {
position: relative;
}
File
css/theme/varbase-video-player.theme.css
View source
- .video-player-icon {
- position: relative;
- }
- .video-player-icon.js-video-player-icon {
- position: absolute;
- top: 0;
- left: 0;
- right: 0;
- margin: 0;
- cursor: pointer;
- z-index: 3;
- }
- .video-player-icon:after {
- content: "";
- position: absolute;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
- background: url(../../images/play.svg) no-repeat center center;
- height: 72px;
- width: 72px;
- max-height: 55%;
- font-size: 15%;
- cursor: pointer;
- }
- .video-player-icon:hover:after {
- opacity: 0.75;
- }
- [dir="rtl"] .video-player-icon.js-video-player-icon {
- right: 0;
- left: auto;
- }
- .media--type-video-embed,
- .media--type-video {
- position: relative;
- }