@charset "UTF-8";

/* /// ANIMATIONS HOME /// */

/* CANNON WRAPPER */

div.cannon_wrapper {
    z-index:1;
    position:absolute;
    top:4px; left:61px;
}

/* PIXEL TIMER */

div.cannon_pixel_timer {
    z-index:2;
    top:20px;
    position:absolute;
    background-repeat:no-repeat;
    background-position:0 0;
    width:76px;
    height:16px; 
}

/* BlAST TIMER */

div.cannon_blast_timer {
    z-index:1;
    position:absolute;
    top:24px; right:-80px;
    background-repeat:no-repeat;
    background-position:center center;
    width:40px;
    height:8px;
    visibility:hidden;
}


/* /// CANNON ONE /// */


/* PIXEL TIMER */

div.cannon_1 div.cannon_pixel_timer {background-image:url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2NHB4IiBoZWlnaHQ9IjE2cHgiIHZpZXdCb3g9IjAgMCA2NCAxNiI+PGc+PHBvbHlnb24gZmlsbD0iIzgyODE3QSIgcG9pbnRzPSI2MCw0IDYwLDggNTYsOCA1NiwxMiA2MCwxMiA2NCwxMiA2NCw4IDY0LDQiLz48cmVjdCB4PSI1MiIgeT0iOCIgZmlsbD0iIzZENkM2NiIgd2lkdGg9IjQiIGhlaWdodD0iNCIvPjxwb2x5Z29uIGZpbGw9IiM2RDZDNjYiIHBvaW50cz0iNDgsMTIgNDQsMTIgNDQsMTYgNDgsMTYgNTIsMTYgNTIsMTIiLz48cG9seWdvbiBmaWxsPSIjOTM5MjhBIiBwb2ludHM9IjU2LDQgNTIsNCA0OCw0IDQ0LDQgNDQsOCA0OCw4IDUyLDggNTYsOCA2MCw4IDYwLDQiLz48cmVjdCB4PSIzMiIgeT0iOCIgZmlsbD0iIzkzOTI4QSIgd2lkdGg9IjQiIGhlaWdodD0iNCIvPjxwb2x5Z29uIGZpbGw9IiM4MjgxN0EiIHBvaW50cz0iNDgsOCA0NCw4IDQ0LDQgNDAsNCAzNiw0IDMyLDQgMzIsOCAzNiw4IDM2LDEyIDQwLDEyIDQ0LDEyIDQ4LDEyIDUyLDEyIDUyLDgiLz48cG9seWdvbiBvcGFjaXR5PSIwLjYiIGZpbGw9IiNDNkNDRDAiIHBvaW50cz0iMjQsNCAyMCw0IDE2LDQgMTYsOCAyMCw4IDI0LDggMjgsOCAyOCw0Ii8+PHBvbHlnb24gZmlsbD0iIzZENkM2NiIgcG9pbnRzPSIyOCw0IDI4LDggMjQsOCAyMCw4IDE2LDggMTYsNCAxMiw0IDEyLDggMTIsMTIgMTYsMTIgMjAsMTIgMjQsMTIgMjgsMTIgMzIsMTIgMzIsOCAzMiw0Ii8+PHBvbHlnb24gZmlsbD0iIzZENkM2NiIgcG9pbnRzPSI0OCwwIDQ0LDAgNDQsNCA0OCw0IDUyLDQgNTIsMCIvPjxwb2x5Z29uIGZpbGw9IiM4MjgxN0EiIHBvaW50cz0iOCw0IDgsOCA0LDggMCw4IDAsMTIgNCwxMiA4LDEyIDEyLDEyIDEyLDggMTIsNCIvPjwvZz48L3N2Zz4=');}

/* BlAST TIMER */

div.cannon_blast_timer {background-image:url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0MHB4IiBoZWlnaHQ9IjhweCIgdmlld0JveD0iMCAwIDQwIDgiPjxwb2x5Z29uIG9wYWNpdHk9IjAuMiIgZmlsbD0iI0FGNEI0NiIgcG9pbnRzPSIzMiwwIDMyLDQgMzIsOCAzNiw4IDM2LDQgMzYsMCIvPjxwb2x5Z29uIG9wYWNpdHk9IjAuMSIgZmlsbD0iI0FGNEI0NiIgcG9pbnRzPSIzNiwwIDM2LDQgMzYsOCA0MCw4IDQwLDQgNDAsMCIvPjxwb2x5Z29uIG9wYWNpdHk9IjAuMyIgZmlsbD0iI0FGNEI0NiIgcG9pbnRzPSIyOCwwIDI4LDQgMjgsOCAzMiw4IDMyLDQgMzIsMCIvPjxwb2x5Z29uIG9wYWNpdHk9IjAuNCIgZmlsbD0iI0FGNEI0NiIgcG9pbnRzPSIyNCwwIDI0LDQgMjQsOCAyOCw4IDI4LDQgMjgsMCIvPjxwb2x5Z29uIG9wYWNpdHk9IjAuNSIgZmlsbD0iI0FGNEI0NiIgcG9pbnRzPSIyMCwwIDIwLDQgMjAsOCAyNCw4IDI0LDQgMjQsMCIvPjxwb2x5Z29uIG9wYWNpdHk9IjAuNiIgZmlsbD0iI0FGNEI0NiIgcG9pbnRzPSIxNiwwIDE2LDQgMTYsOCAyMCw4IDIwLDQgMjAsMCIvPjxwb2x5Z29uIG9wYWNpdHk9IjAuNyIgZmlsbD0iI0FGNEI0NiIgcG9pbnRzPSIxMiwwIDEyLDQgMTIsOCAxNiw4IDE2LDQgMTYsMCIvPjxwb2x5Z29uIG9wYWNpdHk9IjAuOCIgZmlsbD0iI0FGNEI0NiIgcG9pbnRzPSI4LDAgOCw0IDgsOCAxMiw4IDEyLDQgMTIsMCIvPjxwb2x5Z29uIG9wYWNpdHk9IjAuOSIgZmlsbD0iI0FGNEI0NiIgcG9pbnRzPSI0LDAgNCw0IDQsOCA4LDggOCw0IDgsMCIvPjxwb2x5Z29uIGZpbGw9IiNBRjRCNDYiIHBvaW50cz0iMCwwIDAsNCAwLDggNCw4IDQsNCA0LDAiLz48L3N2Zz4=');}

/* CANNON FIRE */

/* Timer */
div.cannon_1 div.cannon_fire_event {
    -webkit-animation:cannon_fire_event 2850ms;
            animation:cannon_fire_event 2850ms;
}
@-webkit-keyframes cannon_fire_event {from {opacity:1;} to {opacity:1;}}
        @keyframes cannon_fire_event {from {opacity:1;} to {opacity:1;}}

/* Animation */
div.cannon_1 div.cannon_fire_animation {
    -webkit-animation:cannon_fire_animation 1700ms;
            animation:cannon_fire_animation 1700ms;
    
}

@-webkit-keyframes cannon_fire_animation {  
    0%   {-webkit-transform:translate3d(0,0,0);} 
    50%  {-webkit-transform:translate3d(32px,0,0);}
    100% {-webkit-transform:translate3d(0,0,0);}
}

@keyframes cannon_fire_animation {  
    0%   {transform:translate3d(0,0,0);} 
    50%  {transform:translate3d(32px,0,0);}
    100% {transform:translate3d(0,0,0);}
}

/* Blast */

div.cannon_1 div.cannon_blast_animation {
    visibility:visible;
    -webkit-animation:cannon_blast_animation 2000ms 850ms;
            animation:cannon_blast_animation 2000ms 850ms;
}

@-webkit-keyframes cannon_blast_animation {  
    0%   {visibility:visible; -webkit-transform:translate3d(0,0,0);} 
    70%  {opacity:1;}
    100% {visibility:hidden;  -webkit-transform:translate3d(-2000px,0,0); opacity:0;}
}

@keyframes cannon_blast_animation {  
    0%   {visibility:visible; -webkit-transform:translate3d(0,0,0);} 
    70%  {opacity:1;}
    100% {visibility:hidden;  -webkit-transform:translate3d(-2000px,0,0); opacity:0;}
}


/* CANNON FIRE */

/* Timer */
div.cannon_1 div.cannon_pause_event {
    -webkit-animation:cannon_pause_event 30000ms;
            animation:cannon_pause_event 30000ms;
}
@-webkit-keyframes cannon_pause_event {from {opacity:1;} to {opacity:1;}}
        @keyframes cannon_pause_event {from {opacity:1;} to {opacity:1;}}