.loadingAnimation_container{
    margin-top:20px;
    position: relative;
    width:100%;
    display:flex;
    justify-content: center;
    align-items: center;
}

.loadingAnimation_container .animationRing{
    position: relative;
    width:150px;
    height:150px;
    border-radius:50%;
    border:4px solid transparent;
    border-top:4px solid #0a9ebb;
    border-bottom:4px solid #0a9ebb;
    animation: forgas 3s linear infinite;
    display:flex;
    justify-content: center;
    align-items: center;
}

.loadingAnimation_container .animationRing::before{
    content: '';
    position: absolute;
    display: block;
    width:15px;
    height:15px;
    background-color:#0a9ebb;
    border-radius:50%;
    top:12px;
    right:15px;
    box-shadow: 0 0 0 5px #0a9ebb33,
                 0 0 0 10px #0a9ebb22,
                 0 0 0 20px #0a9ebb11,
                 0 0 20px #0a9ebb,
                 0 0 50px #0a9ebb;

}

.loadingAnimation_container .animationRing::after{
    content: '';
    position: absolute;
    display: block;
    width:15px;
    height:15px;
    background-color:#0a9ebb;
    border-radius:50%;
    bottom:12px;
    left:15px;
    box-shadow: 0 0 0 5px #0a9ebb33,
                 0 0 0 10px #0a9ebb22,
                 0 0 0 20px #0a9ebb11,
                 0 0 20px #0a9ebb,
                 0 0 50px #0a9ebb;

}

@keyframes forgas{
    0%{
        transform: rotate(0deg);
    }
    100%{
        transform: rotate(360deg);
    }
}

/*
.loadingAnimation_container img{
    position: absolute;
    max-width:80px;
    max-height: 80px;
    animation: logo 1s ease-in infinite;
    opacity:0.5;
}
*/
.loadingAnimation_container img{
    position: absolute;
    max-width:80px;
    max-height: 80px;
    animation: logo 1s ease-in infinite;
    opacity:0.5;
}

@keyframes logo{
    0%{
        transform: scale(1,1);
    }
    50%{
        transform: scale(1.10,1.10);
    }
    100%{
        transform: scale(1,1);
    }
}


/* MINI RING*/


.loadingMiniAnimation_container{
    margin-top:20px;
    position: relative;
    width:100%;
    display:flex;
    justify-content: center;
    align-items: center;
}

.loadingMiniAnimation_container .animationRing{
    position: relative;
    width:30px;
    height:30px;
    border-radius:50%;
    border:3px solid transparent;
    border-top:3px solid #0a9ebb;
    border-bottom:3px solid #0a9ebb;
    animation: forgas 3s linear infinite;
    display:flex;
    justify-content: center;
    align-items: center;
}

.loadingMiniAnimation_container .animationRing::before{
    content: '';
    position: absolute;
    display: block;
    width:10px;
    height:10px;
    background-color:#0a9ebb;
    border-radius:50%;
    top:-3px;
    right:-3px;
    box-shadow: 0 0 0 2px #0a9ebb33,
                 0 0 0 3px #0a9ebb22,
                 0 0 0 3px #0a9ebb11,
                 0 0 3px #0a9ebb,
                 0 0 10px #0a9ebb;

}

.loadingMiniAnimation_container .animationRing::after{
    content: '';
    position: absolute;
    display: block;
    width:10px;
    height:10px;
    background-color:#0a9ebb;
    border-radius:50%;
    bottom:-3px;
    left:-3px;
    box-shadow: 0 0 0 2px #0a9ebb33,
                 0 0 0 3px #0a9ebb22,
                 0 0 0 3px #0a9ebb11,
                 0 0 3px #0a9ebb,
                 0 0 10px #0a9ebb;

}
