
.scroll-animated-f
{
    transform-style: preserve-3d;
    -webkit-animation-duration: 500ms;
    animation-duration: 500ms;
    visibility: hidden;
}

.scroll-animated-s
{
    transform-style: preserve-3d;
    -webkit-animation-duration: 1500ms;
    animation-duration: 1500ms;
    visibility: hidden;
}

@-webkit-keyframes a-rotateX 
{
    0%   {transform: rotateX(90deg);}
    17%  {transform: rotateX(87deg);}
    25%  {transform: rotateX(68deg);}
    37%  {transform: rotateX(67deg);}
    50%  {transform: rotateX(45deg);}
    67%  {transform: rotateX(37deg);}
    75%  {transform: rotateX(23deg);}
    87%  {transform: rotateX(17deg);}
    100% {transform: rotateX(0deg);}
}

@keyframes a-rotateX 
{
    0%   {transform: rotateX(90deg);}
    17%  {transform: rotateX(87deg);}
    25%  {transform: rotateX(68deg);}
    37%  {transform: rotateX(67deg);}
    50%  {transform: rotateX(45deg);}
    67%  {transform: rotateX(37deg);}
    75%  {transform: rotateX(23deg);}
    87%  {transform: rotateX(17deg);}
    100% {transform: rotateX(0deg);}
}

@-webkit-keyframes a-translateX-l 
{
    0%   {transform: translateX(100%);}
    17%  {transform: translateX(87%);}
    25%  {transform: translateX(75%);}
    37%  {transform: translateX(67%);}
    50%  {transform: translateX(50%);}
    67%  {transform: translateX(37%);}
    75%  {transform: translateX(25%);}
    87%  {transform: translateX(17%);}
    100% {transform: translateX(0%);}
}

@keyframes a-translateX-l
{
    0%   {transform: translateX(100%);}
    17%  {transform: translateX(87%);}
    25%  {transform: translateX(75%);}
    37%  {transform: translateX(67%);}
    50%  {transform: translateX(50%);}
    67%  {transform: translateX(37%);}
    75%  {transform: translateX(25%);}
    87%  {transform: translateX(17%);}
    100% {transform: translateX(0%);}
}

@-webkit-keyframes a-translateX-r 
{
    0%   {transform: translateX(-100%);}
    17%  {transform: translateX(-87%);}
    25%  {transform: translateX(-75%);}
    37%  {transform: translateX(-67%);}
    50%  {transform: translateX(-50%);}
    67%  {transform: translateX(-37%);}
    75%  {transform: translateX(-25%);}
    87%  {transform: translateX(-17%);}
    100% {transform: translateX(0%);}
}

@keyframes a-translateX-r
{
    0%   {transform: translateX(-100%);}
    17%  {transform: translateX(-87%);}
    25%  {transform: translateX(-75%);}
    37%  {transform: translateX(-67%);}
    50%  {transform: translateX(-50%);}
    67%  {transform: translateX(-37%);}
    75%  {transform: translateX(-25%);}
    87%  {transform: translateX(-17%);}
    100% {transform: translateX(0%);}
}

@-webkit-keyframes a-Opacity
{
    0%   {opacity: 0;}
    17%  {opacity: 0.15;}
    25%  {opacity: 0.25;}
    37%  {opacity: 0.4;}
    50%  {opacity: 0.5;}
    67%  {opacity: 0.6;}
    75%  {opacity: 0.75;}
    87%  {opacity: 0.85;}
    100% {opacity: 1;}
}

@keyframes a-Opacity
{
    0%   {opacity: 0;}
    17%  {opacity: 0.15;}
    25%  {opacity: 0.25;}
    37%  {opacity: 0.4;}
    50%  {opacity: 0.5;}
    67%  {opacity: 0.6;}
    75%  {opacity: 0.75;}
    87%  {opacity: 0.85;}
    100% {opacity: 1;}
}
