/* Voile d'attente, affiché pendant les traitements longs.
   Extrait du bloc de style inline de templates/waiter/waiter_component.html.twig. */


    #hidder {
        display: none;
        position: fixed;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background: grey;
        z-index:99988;
        opacity: 0.5;
    }
    #spinner.active {
        display: block;
    }
    #spinner {
        display: none;
        position: fixed;
        height: 60px;
        width: 60px;
        top: 40%;
        left: 48%;
        z-index: 99989;
    }
    .spinner_ball {
        position: absolute;
        display: block;
        background-color: white;
        left: 24px;
        width: 12px;
        height: 12px;
        border-radius: 6px;
    }
    #ball_1, #ball_2, #ball_3 {
        -webkit-animation: rotate 2s infinite cubic-bezier(0.5, 0.3, 0.9, 0.9);
        animation: rotate 2s infinite cubic-bezier(0.5, 0.3, 0.9, 0.9);
        -webkit-transform-origin: 6px 30px;
        transform-origin: 6px 30px;
    }
    #ball_2 {
        -webkit-animation: rotate 2s infinite cubic-bezier(0.5, 0.5, 0.9, 0.9);
        animation: rotate 2s infinite cubic-bezier(0.5, 0.5, 0.9, 0.9);
    }
    #ball_3 {
        -webkit-animation: rotate 2s infinite cubic-bezier(0.5, 0.7, 0.9, 0.9);
        animation: rotate 2s infinite cubic-bezier(0.5, 0.7, 0.9, 0.9);
    }
    @-webkit-keyframes rotate {
        0% {
            -webkit-transform: rotate(0deg) scale(1);
        }
        100% {
            -webkit-transform: rotate(1440deg) scale(1);
        }
    }
    @keyframes rotate {
        0% {
            transform: rotate(0deg) scale(1);
        }
        100% {
            transform: rotate(1440deg) scale(1);
        }
    }