﻿/* Animation keyframes
--------------------------------------------- */

@-webkit-keyframes fadeIn {
    0%   { opacity: 0; -webkit-transform: translateZ(0); }
    100% { opacity: 1; -webkit-transform: translateZ(0); }
}

@keyframes fadeIn {
    0%   { opacity: 0; transform: translateZ(0); }
    100% { opacity: 1; transform: translateZ(0); }
}

/* ------------------------------------------ */

@-webkit-keyframes fadeInUp {
    0%   { opacity: 0; -webkit-transform: translateY(10px); }
    100% { opacity: 1; -webkit-transform: translateY(0); }
}

@keyframes fadeInUp {
    0%   { opacity: 0; transform: translateY(10px); }
    100% { opacity: 1; transform: translateY(0); }
}

/* ------------------------------------------ */

@-webkit-keyframes fadeInDown {
    0%   { opacity: 0; -webkit-transform: translateY(-10px); }
    100% { opacity: 1; -webkit-transform: translateY(0); }
}

@keyframes fadeInDown {
    0%   { opacity: 0; transform: translateY(-10px); }
    100% { opacity: 1; transform: translateY(0); }
}

/* ------------------------------------------ */

@-webkit-keyframes fadeInLeft {
    0%   { opacity: 0; -webkit-transform: translateX(-10px); }
    100% { opacity: 1; -webkit-transform: translateX(0); }
}

@keyframes fadeInLeft {
    0%   { opacity: 0; transform: translateX(-10px); }
    100% { opacity: 1; transform: translateX(0); }
}

/* ------------------------------------------ */

@-webkit-keyframes fadeInRight {
    0%   { opacity: 0; -webkit-transform: translateX(10px); }
    100% { opacity: 1; -webkit-transform: translateX(0); }
}

@keyframes fadeInRight {
    0%   { opacity: 0; transform: translateX(10px); }
    100% { opacity: 1; transform: translateX(0); }
}

/* ------------------------------------------ */

@-webkit-keyframes spin {
    from { -webkit-transform: rotate(0deg); }
    to   { -webkit-transform: rotate(359deg); }
}

@keyframes spin {
    from { transform:rotate(0deg); }
    to   { transform:rotate(359deg); }
}
