.aside-loader {
    display          : flex;
    align-items      : center;
    flex-direction   : row;
    justify-content  : center;
}

.aside-loader-body {
    overflow : hidden;
}

.aside-loader-overlay {
    position         : fixed;
    z-index          : 999999;
    top              : 0;
    right            : 0;
    bottom           : 0;
    left             : 0;
    color            : #ffffff;
    background-color : rgba(0, 0, 0, .84);
}

.aside-loader-hidden {
    visibility : hidden;
}

.aside-loader .md-progress-circle {
    width         : 120px;
    height        : 120px;
    animation     : spin 2s linear infinite, colors 2s linear infinite;
    border-top    : 4px solid #3498db;
    border-radius : 50%;
}

@keyframes spin {
    0% { transform : rotate(0deg); }
    100% { transform : rotate(360deg); }
}

@keyframes colors {
    0% { border-top : 4px solid #4285F4; }
    25% { border-top : 4px solid #DE3E35; }
    50% { border-top : 4px solid #F7C223; }
    75% { border-top : 4px solid #1B9A59; }
    100% { border-top : 4px solid #4285F4; }
}