﻿/* video player partial */
.vjs-has-started.vjs-paused .vjs-poster {
    opacity: 1 !important; /* fix issue on iOS */
}

.video-js {
    color: rgb(255 255 255 / 80%);
}

    .video-js .vjs-progress-control .vjs-slider:before {
        background: rgba(255, 255, 255, 20%);
    }

    .video-js .vjs-progress-control .vjs-play-progress {
        background-color: rgba(255, 255, 255, 80%);
    }

    .video-js.vjs-fluid:not(.vjs-audio-only-mode) {
        height: calc(100vh - 72px);
        padding-top: 0px;
    }

.vjs-info {
    display: none;
}

div.vjs-control-bar {
    position: absolute !important;
    bottom: 40px !important;
}

    div.vjs-control-bar > div.vjs-time-control {
        position: absolute !important;
        margin-top: 5vh !important;
        margin-left: 0px !important;
    }

    div.vjs-control-bar > div.vjs-current-time.vjs-time-control.vjs-control > span.vjs-current-time-display {
        position: relative !important;
        left: 1vw !important;
    }

    div.vjs-control-bar > div.vjs-time-control.vjs-time-divider {
        position: relative !important;
        left: -2.4vw !important;
    }

    div.vjs-control-bar > div.vjs-duration.vjs-time-control.vjs-control > span.vjs-duration-display {
        position: relative !important;
        left: 4vw !important;
    }

div.vast-skip-button:hover {
    /* !important is because I need to override videojs' built in CSS */
    background-color: #435561 !important;
    color: #fff !important;
}

    div.vast-skip-button:hover .vast-skip-button-text {
        /* !important is because I need to override videojs' built in CSS */
        color: #fff !important;
    }
