.va-video-centered {
    position: relative;
    aspect-ratio: 16/9;
}

.vjs_spinner {
    position: absolute;
    z-index: 30;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #fff;
    opacity: 1;
    transition: opacity 300ms ease-in-out;
}

.vjs_spinner.out {
    opacity: 0;
}

.vjs_spinner.hidden {
    display: none;
}

.vjs_spinner__inner {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 90%;
    max-width: 300px;
    transform: translate(-50%, -52%);
    text-align: center;
}

.vjs_spinner__indicator {
    display: inline-block;
    position: relative;
    width: 3rem;
    height: 3rem;
}


@keyframes vjs-spinner {
    to {
        transform: rotate(360deg);
    }
}

.vjs_spinner__indicator::before {
    content: '';
    box-sizing: border-box;
    position: absolute;
    top: 0;
    left: 0;
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    border: 0.125rem solid transparent;
    border-bottom-color: #569c00;
    border-right-color: #569c00;
    border-top-color: #569c00;
    animation-name: vjs-spinner;
    animation-duration: 0.9s;
    animation-timing-function: linear;
    animation-delay: 0s;
    animation-direction: normal;
    animation-iteration-count: infinite;
    animation-play-state: running;
}

.vjs_spinner__label,
.vjs_spinner__sub__label {
    display: block;
    font-size: 1rem;
    font-family: 'Fidelity Sans Regular', Arial, sans-serif;
    color: #000000;
    margin-top: 0.625rem;
    word-break: break-word;
}

.vjs_spinner__sub__label {
    display: none;
}

.vjs_spinner__sub__label.visible {
    display: block;
}

@media (max-width:480px) {
    .vjs_spinner__indicator::before {
        width: 2.5rem;
        height: 2.5rem;
    }

    .vjs_spinner__indicator {
        width: 2.5rem;
        height: 2.5rem;
    }

    .vjs_spinner__label,
    .vjs_spinner__sub__label {
        font-size: .8rem;
    }
}