﻿/* Because of the SVG inliner, these don't work for icons */
.vjs-theme-rt {
    --vjs-theme-rt--primary: #f69223;
    --vjs-theme-rt--secondary: #fff;
}

    /* Big play Button */
    .vjs-theme-rt:hover .vjs-big-play-button,
    .vjs-theme-rt.vjs-big-play-button:focus {
        background-color: transparent;
        background: svg-load('icons/play-btn.svg', fill=#6fb04e);
    }

    .vjs-theme-rt .vjs-big-play-button {
        width: 88px;
        height: 88px;
        background: none;
        background-repeat: no-repeat;
        background-position: center;
        background: svg-load('icons/play-btn.svg', fill=#fff);
        border: none;
        top: 50%;
        left: 50%;
        margin-top: -44px;
        margin-left: -44px;
        color: purple;
    }
    .vjs-theme-rt .vjs-control-bar {
        background-color: rgb(60 33 84);
        color: #f29223;
        font-size: 13px;
        font-weight: 600;
    }

    .vjs-theme-rt .vjs-play-progress {
        background-color: #f29223;
    }
.vjs-theme-rt .vjs-volume-level {
        background-color: #f29223;
    }
    .vjs-theme-rt .vjs-time-control {
        font-size: 13px;
    }
.vjs-theme-rt button:focus {
    outline: 1px dotted !important;
}