.codeflow-loader {

    margin: 0;
    padding: 0;
    display: inline-block;
    overflow: hidden;
    font-size: 1rem;
    position: relative;
    text-indent: -9999em;
    border-width: 1.1em;
    border-style: solid;
    transform: translateZ(0);
    animation: codeflow-loader_load8 1.1s infinite linear;

    &--primary {
        border-color: $color-primary-light;
        border-left-color: $color-primary;
    }

    &--secondary {
        border-color: $color-secondary-light;
        border-left-color: $color-secondary;
    }

    &--danger {
        border-color: $color-danger-light;
        border-left-color: $color-danger;
    }

    &,&:after{
        border-radius: 50%;
        width: 10em;
        height: 10em;
    }
}

@-webkit-keyframes codeflow-loader_load8 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes codeflow-loader_load8 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}