/* global on page */
.loader {
    border: 0.625rem solid #D4DADC;
    border-radius: 50%;
    border-top: 0.5rem solid var(--color-green-1kmapied);
    -webkit-animation: spin 2s linear infinite;
    /* Safari */
    animation: spin 2s linear infinite;
    margin: auto;
    display: block;
    position: absolute;
    top: 50vh; /* vh here because it should always be defined on the viewport */
    left: 50%; /* % here because we want to position the loader in the middle of the component */
    width: 6.25rem;
    height: 6.25rem;

    &.small-loader {
        position: static;
        top: auto;
        left: auto;
        width: 1.5625rem;
        height: 1.5625rem;
    }
}