/* .loading-indicator {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: #ffffff;
    opacity: 0.9;
    z-index: 1029;
}

.ytp-spinner {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 55px;
    margin-left: -27.5px;
    margin-top: -27px;
    z-index: 18;
    pointer-events: none;
}
.ytp-spinner .ytp-spinner-container {
    pointer-events: none;
    position: absolute;
    width: 100%;
    padding-bottom: 100%;
    top: 50%;
    left: 50%;
    margin-top: -50%;
    margin-left: -50%;
    animation: ytp-spinner-linspin 1568.23529647ms linear infinite;
    -webkit-animation: ytp-spinner-linspin 1568.23529647ms linear infinite;
}
.ytp-spinner-rotator {
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-animation: ytp-spinner-easespin 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
    animation: ytp-spinner-easespin 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
}
.ytp-spinner-left {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    overflow: hidden;
}
.ytp-spinner-right {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
}
.ytp-spinner-left {
    right: 49%;
}
.ytp-spinner-right {
    left: 49%;
}
.ytp-spinner-circle {
    box-sizing: border-box;
    position: absolute;
    width: 200%;
    height: 100%;
    border-style: solid;
    border-radius: 50%;
    border-width: 4px;
}
.ytp-spinner-left .ytp-spinner-circle {
    left: 0;
    right: -100%;
    border-right-color: transparent;
    -webkit-animation: ytp-spinner-left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
    animation: ytp-spinner-left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
}
.ytp-spinner-right .ytp-spinner-circle {
    left: -100%;
    right: 0;
    border-left-color: transparent;
    -webkit-animation: ytp-right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
    animation: ytp-right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
}
@-webkit-keyframes ytp-spinner-linspin {
    to {
        -webkit-transform: rotate(360deg);
    }
}
@keyframes ytp-spinner-linspin {
    to {
        transform: rotate(360deg);
    }
}
@-webkit-keyframes ytp-spinner-easespin {
    12.5% {
        -webkit-transform: rotate(135deg);
    }
    25% {
        -webkit-transform: rotate(270deg);
    }
    37.5% {
        -webkit-transform: rotate(405deg);
    }
    50% {
        -webkit-transform: rotate(540deg);
    }
    62.5% {
        -webkit-transform: rotate(675deg);
    }
    75% {
        -webkit-transform: rotate(810deg);
    }
    87.5% {
        -webkit-transform: rotate(945deg);
    }
    to {
        -webkit-transform: rotate(1080deg);
    }
}
@keyframes ytp-spinner-easespin {
    12.5% {
        transform: rotate(135deg);
    }
    25% {
        transform: rotate(270deg);
    }
    37.5% {
        transform: rotate(405deg);
    }
    50% {
        transform: rotate(540deg);
    }
    62.5% {
        transform: rotate(675deg);
    }
    75% {
        transform: rotate(810deg);
    }
    87.5% {
        transform: rotate(945deg);
    }
    to {
        transform: rotate(1080deg);
    }
}
@-webkit-keyframes ytp-spinner-left-spin {
    0% {
        -webkit-transform: rotate(130deg);
    }
    50% {
        -webkit-transform: rotate(-5deg);
    }
    to {
        -webkit-transform: rotate(130deg);
    }
}
@keyframes ytp-spinner-left-spin {
    0% {
        transform: rotate(130deg);
    }
    50% {
        transform: rotate(-5deg);
    }
    to {
        transform: rotate(130deg);
    }
}
@-webkit-keyframes ytp-right-spin {
    0% {
        -webkit-transform: rotate(-130deg);
    }
    50% {
        -webkit-transform: rotate(5deg);
    }
    to {
        -webkit-transform: rotate(-130deg);
    }
}
@keyframes ytp-right-spin {
    0% {
        transform: rotate(-130deg);
    }
    50% {
        transform: rotate(5deg);
    }
    to {
        transform: rotate(-130deg);
    }
} */

.loading-indicator {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}
.app-loader {
    -webkit-animation: e 2s ease-in infinite;
    animation: e 2s ease-in infinite;
    background: url('data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2032%2032%22%20style%3D%22%22%20xml%3Aspace%3D%22preserve%22%20height%3D%22100%25%22%20width%3D%22100%25%22%3E%0A%3Cstyle%20type%3D%22text%2Fcss%22%3E%0A%09.st0%7Bopacity%3A0.302%3B%7D%0A%09.st1%7Bfill-rule%3Aevenodd%3Bclip-rule%3Aevenodd%3Bfill%3A%23000000%3B%7D%0A%3C%2Fstyle%3E%0A%3Cg%20id%3D%22Rectangle_3_copy_3%22%20class%3D%22st0%22%3E%0A%09%3Cg%3E%0A%09%09%3Crect%20x%3D%228%22%20y%3D%228%22%20class%3D%22st1%22%20width%3D%2216%22%20height%3D%2216%22%2F%3E%0A%09%3C%2Fg%3E%0A%3C%2Fg%3E%0A%3Cg%20id%3D%22Rectangle_2_copy_13%22%3E%0A%09%3Cg%3E%0A%09%09%3Cpath%20class%3D%22st1%22%20d%3D%22M23%2C7H9C7.9%2C7%2C7%2C7.9%2C7%2C9v14c0%2C1.1%2C0.9%2C2%2C2%2C2h14c1.1%2C0%2C2-0.9%2C2-2V9C25%2C7.9%2C24.1%2C7%2C23%2C7z%20M23%2C23H9V9h14V23z%22%2F%3E%0A%09%3C%2Fg%3E%0A%3C%2Fg%3E%0A%3C%2Fsvg%3E')
        no-repeat 50%;
    display: inline-block;
    height: 2em;
    margin: 0.2em;
    width: 2em;
}

.app-loader:first-child {
    -webkit-animation-delay: 0s;
    animation-delay: 0s;
}
.app-loader:nth-child(2) {
    -webkit-animation-delay: 0.2s;
    animation-delay: 0.2s;
}
.app-loader:nth-child(3) {
    -webkit-animation-delay: 0.4s;
    animation-delay: 0.4s;
}
@-webkit-keyframes e {
    0% {
        opacity: 0;
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    20% {
        opacity: 1;
    }
    30% {
        opacity: 1;
    }
    50% {
        opacity: 0;
        -webkit-transform: scale(2);
        transform: scale(2);
    }
    to {
        opacity: 0;
        -webkit-transform: scale(3);
        transform: scale(3);
    }
}
@keyframes e {
    0% {
        opacity: 0;
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    20% {
        opacity: 1;
    }
    30% {
        opacity: 1;
    }
    50% {
        opacity: 0;
        -webkit-transform: scale(2);
        transform: scale(2);
    }
    to {
        opacity: 0;
        -webkit-transform: scale(3);
        transform: scale(4);
    }
}
