﻿/* ------------------------ INTRO ------------------------ */
#wrapper2 {
	position: relative;
	overflow:hidden;
	height: 100%;
	width:100%;
	margin:0;
	padding:0;
}

#intro_left				{position:absolute;top:50%;left:50%;width: 216px; margin-left:-170px}
#intro_right			{position:absolute;top:50%;right:50%;width: 124px; margin-right:-170px}


.intro_logo {
	 display:none;
}


#intro_left img,
#intro_right img {
	 opacity: 0;
}

.item1 {
	animation: fade-in-item 0s 0.2s ease-out forwards;

	}
.item2 {
	animation: fade-in-item 0s 0.4s ease-out forwards;
}
.item3 { 
	animation: fade-in-item 0s 0.6s ease-out forwards;
}
.item4 {
	animation: fade-in-item 0s 0.8s ease-out forwards;
}
.item5 {
	animation: fade-in-item 0s 1s ease-out forwards;
}
.item6 {
	animation: fade-in-item 0s 1.2s ease-out forwards;
}
.item7 {
	animation: fade-in-item 0s 1.4s ease-out forwards;
}
.item8 {
	animation: fade-in-item 0s 1.8s ease-out forwards;
}
.item9 {
	animation: fade-in-item 0s 2s ease-out forwards;
}
.item10 {
	animation: fade-in-item 0s 2.2s ease-out forwards;
}




#intro_left {
	animation: left-item 1s 3.2s ease-out forwards;

}

#intro_right {
	animation: right-item 1s 3.2s ease-out forwards;

}

#wrapper2 {
	animation: fade-out-item 0.5s 3.7s ease-out forwards;

}

 /* ANIMATION ZOOM OUT */
@-webkit-keyframes scale-item {
	0% {display: inherit;}
	100% {display: block;}
}

@keyframes scale-item {
	0% {display: inherit;}
	100% {display: block;}
}

 /* ANIMATION MOVE TO LEFT */
@-webkit-keyframes left-item {
  100% {margin-left:-100%;}
}

@keyframes left-item {
  100% {margin-left:-100%;}
}

 /* ANIMATION MOVE TO RIGHT */
@-webkit-keyframes right-item {
  100% {right:0;}
}

@keyframes right-item {
  100% {right:0;}
}

 /* ANIMATION FADE IN */
@-webkit-keyframes fade-in-item {
  0% {opacity: 0;}
  100% {opacity: 1;}
}

@keyframes fade-in-item {
  0% {opacity: 0;}
  100% {opacity: 1;}
}

 /* ANIMATION FADE OUT */
@-webkit-keyframes fade-out-item {
  0% {opacity: 1;}
  100% {opacity: 0;}
}

@keyframes fade-out-item {
  0% {opacity: 1;}
  100% {opacity: 0;}
}

 /* ANIMATION FADE IN UP */
@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

