
@keyframes mask1 {
    0% {
        stroke-dashoffset: 160;
        opacity: 1;
    }
    10% {
        stroke-dashoffset: 0;
        opacity: 1;
    }
    95% {
        opacity: 1;
        stroke-dashoffset: 0;
    }   
    100% {
        opacity: 0;
        stroke-dashoffset: 160;
    }
}

@keyframes mask2 {
    0% {
        stroke-dashoffset: 330;
        opacity: 1;
    }
    4% {
        stroke-dashoffset: 330;
        opacity: 1; 
    }
    14% {
        opacity: 1;  
        stroke-dashoffset: 0;
    }
    95% {
        opacity: 1;
        stroke-dashoffset: 0;
    }   
    100% {
        opacity: 0;
        stroke-dashoffset: 330;
    }
}

@keyframes mask3 {
    0% {
        stroke-dashoffset: 370;
        opacity: 1;
    }
    21% {
        stroke-dashoffset: 370;
        opacity: 1; 
    }
    45% {
        opacity: 1;  
        stroke-dashoffset: 0;
    }
    95% {
        opacity: 1;
        stroke-dashoffset: 0;
    }   
    100% {
        opacity: 0;
        stroke-dashoffset: 370;
    }
}




#mask3a {
    stroke-dashoffset: 370;
    stroke-dasharray: 370;
    stroke-width: 7.0375;
    stroke-linecap: round;
    display: inline;
    animation: mask3 9s cubic-bezier(.14,.47,.91,.62) infinite 2s;
    stroke:#ffffff;
    stroke-miterlimit: 4;
    stroke-linejoin: miter;

} 



#mask2a {
    stroke-dashoffset: 330;
    stroke-dasharray: 330;
    stroke-width:7.0375;
    stroke-linecap: round;
    display: inline;
    animation: mask2 9s cubic-bezier(.8,.19,.9,.79) infinite 2s;
    stroke:#ffffff;
    stroke-miterlimit:4;
    stroke-linejoin: miter;
} 



#mask1a {
    stroke-dashoffset: 160;
    stroke-dasharray: 160;
    stroke-width: 4.8;
    stroke-linecap: round;    
    display: inline;
    animation: mask1 9s cubic-bezier(.44,.12,.19,.94) infinite 2s;
    stroke:#ffffff;
    stroke-miterlimit:4;
    stroke-linejoin: miter;
} 