/*---------- CSS Animations ---------*/
/*Blur*/
@keyframes blur {
    from {
        filter: blur(0px);
    }

    to {
        filter: blur(10px);
    }
}

/*FadeIn*/
.fade {
    -webkit-animation-name: fadeIn;
    -webkit-animation-duration: s;
    animation-name: fadeIn;
    animation-duration: 1.5s;
}

@-webkit-keyframes fadeIn {
    from {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes fadeIn {
    from {
        opacity: 0
    }

    to {
        opacity: 1
    }
}


/*Rotation*/
.rotating {
    -webkit-animation: rotating 60s linear infinite;
    -moz-animation: rotating 60s linear infinite;
    -ms-animation: rotating 60s linear infinite;
    -o-animation: rotating 60s linear infinite;
    animation: rotating 60s linear infinite;
}

@-webkit-keyframes rotating

    /* Safari and Chrome */
{
    from {
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes rotating {
    from {
        -ms-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -ms-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}