/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 2015-04-28, 15:18:26
    Author     : adam
*/

*[animate="hover|300"]
{
    transition-duration: 0.3s;
}
*[animate="hover|300"]:hover
{
    transition-duration: 0.3s;
}
*[animate="fadein|5000"]
{
    opacity: 1;
    -webkit-animation: fadeIn 5s linear;
    animation: fadeIn 5s linear;
}

*[animate="hover|rotate"]:hover
{
    -webkit-animation: spin 5s linear infinite;
    animation: spin 5s linear infinite;
}
*[animate="delay-alert"], .animate-delay-alert
{
    -webkit-animation: alert 4s linear 30s;
    animation: alert 4s linear 30s;
}
*[animate="fadeout|5000"]
{
    opacity: 0;
    -webkit-animation: fadeOut 5s linear;
    animation: fadeOut 5s linear;
}
*[animate="desaturate|300"]
{
    -webkit-filter: grayscale(100%); filter: grayscale(100%);  
    transition-duration: 0.3s;
}
*[animate="desaturate|300"]:hover
{
    -webkit-filter: grayscale(0); filter: grayscale(0);
    transition-duration: 0.3s;
}
*[animate="desaturate|half"]
{
    -webkit-filter: grayscale(50%); filter: grayscale(50%);  
    transition-duration: 0.3s;
}
*[animate="desaturate|half"]:hover
{
    -webkit-filter: grayscale(0); filter: grayscale(0);
    transition-duration: 0.3s;
}
@-webkit-keyframes fadeIn
{
    form {opacity: 0;}
    to {opacity: 1;}
}
@keyframes fadeIn
{
    form {opacity: 0;}
    to {opacity: 1;}
}
@-webkit-keyframes fadeOut
{
    form {opacity: 0;}
    to {opacity: 1;}
}
@keyframes fadeOut
{
    form {opacity: 1;}
    to {opacity: 0;}
}
@-webkit-keyframes alert
{
    10%,30%,50%,70%,90%{transform: scale(1.1)}
    20%,40%,60%,80%,100%{transform: scale(1.0)}
}
@keyframes alert
{
    10%,30%,50%,70%,90%{transform: scale(1.1)}
    20%,40%,60%,80%,100%{transform: scale(1.0)}
}
@-webkit-keyframes spin
{
    from {transform: rotate(0deg)}
    to {transform: rotate(360deg)}
}
@keyframes spin
{
    from {transform: rotate(0deg)}
    to {transform: rotate(360deg)}
}