﻿@-webkit-keyframes checkbox-spinout {
    0% {color:#00c853;opacity: 1;}
    15% { opacity: 1;} 
	100% { -webkit-transform: rotate(135deg); transform:rotate(135deg);opacity: 0; }
	}  

@-moz-keyframes checkbox-spinout {
    0% {color:#00c853;opacity: 1;}
    15% { opacity: 1;} 
	100% { -webkit-transform: rotate(135deg); transform:rotate(135deg);opacity: 0; }
	}  

@keyframes checkbox-spinout {
    0% {color:#00c853;opacity: 1;}
    15% { opacity: 1;} 
	100% { -webkit-transform: rotate(135deg); transform:rotate(135deg);opacity: 0; }
	}  


@-webkit-keyframes checkbox-spinout-reverse {
    0% {color:#000000;opacity: 1;}
    15% { opacity: 1;}  
	100% { -webkit-transform: rotate(-135deg); transform:rotate(-135deg);opacity: 0; }
	}  

@-moz-keyframes checkbox-spinout-reverse {
    0% {color:#000000;opacity: 1;}
    15% { opacity: 1;}  
	100% { -webkit-transform: rotate(-135deg); transform:rotate(-135deg);opacity: 0; }
	}  

@keyframes checkbox-spinout-reverse {
    0% {color:#000000;opacity: 1;}
    15% { opacity: 1;}  
	100% { -webkit-transform: rotate(-135deg); transform:rotate(-135deg);opacity: 0; }
	}  



@-webkit-keyframes delayed-visibility {
    0% { opacity:0;}
    100% { opacity: 1;}
}

@-moz-keyframes delayed-visibility {
    0% { opacity:0;}
    100% { opacity: 1;}
}

@keyframes delayed-visibility {
    0% { opacity:0;}
    100% { opacity: 1;}
}

.blinker { 
    	-webkit-animation: blinker 4s; /* Chrome, Safari, Opera  */
    animation: blinker 4s;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite; 	
	} 

@-webkit-keyframes delayedopacityfadein { 
	0% {opacity: 0;}
	99% {opacity: 0; }	
	100% {opacity: 1; }
	}  

@-moz-keyframes delayedopacityfadein { 
	0% {opacity: 0;}
	99% {opacity: 0; }	
	100% {opacity: 1; }
	} 

@keyframes delayedopacityfadein { 
	0% {opacity: 0;}
	99% {opacity: 0; }	
	100% {opacity: 1; }
	}   

@-webkit-keyframes delayedshow { 
	0% {opacity: 0;}
	99% {opacity: 0; }	
	100% {opacity: 1; }
	}  


@-webkit-keyframes blinker { 
	0% {opacity: 0;} 
	25% {opacity: 1; }  
	50% { opacity: 0;}
	75% {opacity: 1; }	
	100% {opacity: 0; }
	}  

@keyframes blinker { 
	0% {opacity: 0;} 
	25% {opacity: 1; }  
	50% { opacity: 0;}
	75% {opacity: 1; }	
	100% {opacity: 0; }
	}  


.reveal-to-white {
    -webkit-animation: revealtowhite 2.5s; /* Chrome, Safari, Opera  */
    -moz-animation: revealtowhite 2.5s;
    animation: revealtowhite 2.5s; 
}

@-webkit-keyframes savedanim 
{
    from {background-color: transparent;}
    to {background-color:white;}    
}

@keyframes savedanim {
    from {background-color: transparent;}
    to { background-color: white;}    
}

@-webkit-keyframes opacityfadeout 
{
    from {opacity: 1;
    }
    to {opacity:0;}    
}

@keyframes opacityfadeout {
    from {opacity: 1;}
    to { opacity: 0;}    
}

/* Chrome, Safari, Opera */
    @-webkit-keyframes myfirst {
    from {background: yellow;}
    to {background: white;}
}

    /* Standard syntax */
@keyframes myfirst {
    from {background: yellow;}
    to {background: white;}
}

/* Chrome, Safari, Opera */
@-webkit-keyframes texttrans {
    from {color: blue;}
    to {color: black;}
}

/* Standard syntax */
@keyframes texttrans {
    from {color: blue;}
    to {color: black;}
}

.slide-wrapper-outer {
    overflow: hidden;
    padding: 1px 5px 5px 5px;
}

.slide-wrapper-inner {
    position: relative;
    transform: translateX(-100%);
    -webkit-transform: translateX(100%);
}

    .slide-wrapper-inner.slide-in {
        animation: slide-in 0.2s forwards;
        -webkit-animation: slide-in 0.2s forwards;
    }

    .slide-wrapper-inner.slide-out {
        animation: slide-out 0.2s forwards;
        -webkit-animation: slide-out 0.2s forwards;
        opacity: 1;
    }

@keyframes slide-in {
    100% {
        transform: translateX(0%);
    }
}

@-webkit-keyframes slide-in {
    100% {
        -webkit-transform: translateX(0%);
    }
}

@keyframes slide-out {
    0% {
        transform: translateX(0%);
    }

    100% {
        transform: translateX(-110%);
    }
}

@-webkit-keyframes slide-out {
    0% {
        -webkit-transform: translateX(0%);
    }

    100% {
        -webkit-transform: translateX(-110%);
    }
}