.line-up-intro-content {
    position: absolute;
    top: 42%;
    width: 455px;
    right: 0;
    transform: translateY(-50%);
    font: 30px/1 'med';
    color: #000;
}

.animation-element{
   opacity: 0;    
}

.animated {
 /*
	-webkit-animation-duration: 0.6s;  
	-moz-animation-duration: 0.6s;
	-o-animation-duration: 0.6s;
    animation-duration: 0.6s; 
  -webkit-animation: fadeIn 1s forwards ease-in;
  -moz-animation:    fadeIn 1s forwards ease-in;
  -o-animation:      fadeIn 1s forwards ease-in;
  animation:         fadeIn 1s forwards ease-in;
  */
}
.line-up-intro-highlight {
    background: rgba(255, 255, 255, .8);
    margin: 0 0 13px;
    padding: 48px 75px 60px 38px;
    font-size: 26px;
    color: #000;
}

.element-fade.in-view{
	animation: fadeIn .8s .8s ease forwards;
}

@-webkit-keyframes fadeIn {
 
 
  100%  { opacity: 1; }
}
@-moz-keyframes fadeIn {
  
 
   100%  { opacity: 1; }
}
@-o-keyframes fadeIn {
  
 
   100%  { opacity: 1; }
}
@keyframes fadeIn {
 
  
   100%  { opacity: 1; }
}


/* =========================================== *\
Line up intro
\* =========================================== */

@media (min-width: 768px) and (orientation: landscape) {
	
	.line-up-intro-highlight.in-view .in-view {
		animation: line-up-intro-message .4s .4s ease forwards;
	}
	
    .line-up-intro {
        opacity: 0;
    }
    .line-up-intro.in-view {
        animation: fade-in .6s .2s forwards;
    }
    .line-up-intro-highlight,
    .line-up-intro-download {
        opacity: 0;
    }
    .line-up-intro-highlight.in-view,
    .line-up-intro-download.in-view {
        animation: line-up-intro-message .4s .4s ease forwards;
    }
    .line-up-intro-download.in-view {
        animation-delay: .6s;
    }
}


/*
*
More detail
*
*/

.top-to-bottom.in-view {
    animation: fade-from-top .8s .8s  forwards; 
	/* -moz-animation-delay: 12s;
	 -o-animation-delay: 12s;
	 -webkit-animation-delay: 12s;  
    animation-delay: 12s;*/
}
 

/* =========================================== *\
Line up Detail
\* =========================================== */

.line-up-detail-engine, 
.line-up-detail-engine-img,
.line-up-detail-gear-img {
		opacity: 0;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE 8 */  
            filter: alpha(opacity=0); /* IE 5-7 */  
            -moz-opacity: 0.0; /* Netscape */  
            -khtml-opacity: 0.0; /* Safari 1.x */  
        
}

.line-up-detail-engine.in-view,

.line-up-detail-engine-img.in-view,
.line-up-detail-gear-img.in-view {
    animation: fade-from-left .6s .4s forwards;
}

.line-up-detail-engine-img.in-view,
.line-up-detail-gear-img.in-view {
    animation-name: fade-from-right;
}

 
.line-up-e-img.in-view {
    animation : fade-from-right .6s .4s forwards;
}
 
.line-up-detail.in-view {
    animation : fade-from-right .6s .4s forwards;
}


.line-fade-left.in-view {
    animation : fade-from-left .8s .8s forwards;
}
  

/* =========================================== *\
Line up List
\* =========================================== */

.line-up-list-item{ 
   opacity: 0;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE 8 */  
            filter: alpha(opacity=0); /* IE 5-7 */  
            -moz-opacity: 0.0; /* Netscape */  
            -khtml-opacity: 0.0; /* Safari 1.x */  
}

.line-up-list-item.in-view {
    animation: fade-from-bottom .6s .4s forwards;
}


/* =========================================== *\
Keyframes collection
\* =========================================== */


/* line up intro */

@keyframes fade-in {
    to {
       opacity: 1;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; /* IE 8 */  
            filter: alpha(opacity=100); /* IE 5-7 */  
            -moz-opacity: 1.0; /* Netscape */  
            -khtml-opacity: 1.0; /* Safari 1.x */  
    }
}

@keyframes line-up-intro-message {
    0% {
        transform: translateX(100%);
        opacity: 0;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE 8 */  
            filter: alpha(opacity=0); /* IE 5-7 */  
            -moz-opacity: 0.0; /* Netscape */  
            -khtml-opacity: 0.0; /* Safari 1.x */  
    }
    100% {
        transform: translateX(0);
          opacity: 1;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; /* IE 8 */  
            filter: alpha(opacity=100); /* IE 5-7 */  
            -moz-opacity: 1.0; /* Netscape */  
            -khtml-opacity: 1.0; /* Safari 1.x */  
    }
}

@keyframes line-up-intro-more {
    0%,
    100% {
        transform: translate(-50%, -3px);
    }
    50% {
        transform: translate(-50%, 3px);
    }
}





/* fade from top */

@keyframes fade-from-top {
    0% {
        transform: translateY(-25px);
        opacity: 0;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE 8 */  
            filter: alpha(opacity=0); /* IE 5-7 */  
            -moz-opacity: 0.0; /* Netscape */  
            -khtml-opacity: 0.0; /* Safari 1.x */  
    }
    100% {
        transform: translateY(0);
          opacity: 1;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; /* IE 8 */  
            filter: alpha(opacity=100); /* IE 5-7 */  
            -moz-opacity: 1.0; /* Netscape */  
            -khtml-opacity: 1.0; /* Safari 1.x */  
    }
}


/* fade from bottom */

@keyframes fade-from-bottom {
    0% {
        transform: translateY(25px);
        opacity: 0;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE 8 */  
            filter: alpha(opacity=0); /* IE 5-7 */  
            -moz-opacity: 0.0; /* Netscape */  
            -khtml-opacity: 0.0; /* Safari 1.x */  
    }
    100% {
        transform: translateY(0);
          opacity: 1;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; /* IE 8 */  
            filter: alpha(opacity=100); /* IE 5-7 */  
            -moz-opacity: 1.0; /* Netscape */  
            -khtml-opacity: 1.0; /* Safari 1.x */  
    }
}


/* fade from left */

@keyframes fade-from-left {
    0% {
        opacity: 0;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE 8 */  
        filter: alpha(opacity=0); /* IE 5-7 */  
        -moz-opacity: 0.0; /* Netscape */  
        -khtml-opacity: 0.0; /* Safari 1.x */  
        transform: translateX(-25px);
    }
    100% {
        opacity: 1;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; /* IE 8 */  
         filter: alpha(opacity=100); /* IE 5-7 */  
         -moz-opacity: 1.0; /* Netscape */  
         -khtml-opacity: 1.0; /* Safari 1.x */  
        transform: translateX(0);
    }
}


/* fade from right */

@keyframes fade-from-right {
    0% {
         opacity: 0;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE 8 */  
        filter: alpha(opacity=0); /* IE 5-7 */  
        -moz-opacity: 0.0; /* Netscape */  
        -khtml-opacity: 0.0; /* Safari 1.x */  
        transform: translateX(25px);
    }
    100% {
		 opacity: 1;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; /* IE 8 */  
         filter: alpha(opacity=100); /* IE 5-7 */  
         -moz-opacity: 1.0; /* Netscape */  
         -khtml-opacity: 1.0; /* Safari 1.x */  
        transform: translateX(0);
    }
}


.img-rotate {
  border-radius: 50%;
  -webkit-transition: -webkit-transform .8s ease-in-out;
          transition:         transform .8s ease-in-out;
}
.img-rotate:hover {
  -webkit-transform: rotate(360deg);
          transform: rotate(360deg);
}