/* 
 * Animsition Custom Loader
 * Remplace le loader orange par le picto_marker.png avec animation de pulsation
 */

/* Supprimer complètement le loader orange par défaut */
.animsition-loading {
    background: url('/img/picto_marker.png') no-repeat center center !important;
    background-color: transparent !important;
    background-size: contain !important;
    width: 64px !important;
    height: 64px !important;
    border: none !important;
    border-top: none !important;
    border-right: none !important;
    border-bottom: none !important;
    border-left: none !important;
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    margin-top: -32px !important;
    margin-left: -32px !important;
    z-index: 2 !important;
    -webkit-animation-name: animsition-loading-pulse !important;
    animation-name: animsition-loading-pulse !important;
    -webkit-animation-duration: 1.5s !important;
    animation-duration: 1.5s !important;
    -webkit-animation-iteration-count: infinite !important;
    animation-iteration-count: infinite !important;
    -webkit-animation-timing-function: ease-in-out !important;
    animation-timing-function: ease-in-out !important;
}

/* Supprimer l'élément :after du loader par défaut */
.animsition-loading:after {
    display: none !important;
    content: none !important;
}

/* Animation de pulsation pour le picto */
@-webkit-keyframes animsition-loading-pulse {
    0%, 100% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    50% {
        opacity: 0.6;
        -webkit-transform: scale(0.85);
        transform: scale(0.85);
    }
}

@keyframes animsition-loading-pulse {
    0%, 100% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    50% {
        opacity: 0.6;
        -webkit-transform: scale(0.85);
        transform: scale(0.85);
    }
}
