#animation,
#animation .text,
#animation .media,
#animation .ventures,
#animation .daten,
#animation .circle,
#animation .triangle .triangle-1,
#animation .triangle .triangle-2 {
	position: absolute;
}

#animation {
	/*background: url('../img/factornetwork.jpg') center center no-repeat;*/
	height: 330px;
	left: 50%;
	margin-top: -165px; /* Half the height */
	margin-left: -280px; /* Half the width */
	top: 50%;
	width: 560px;
}

/*
** Words
*/

#animation .text h2 {
	color: #df0b1f;
	font-family: 'VitesseSans-Light', sans-serif;
	font-size: 32px !important;
	font-weight: normal;
	margin: 0;
	text-transform: uppercase;
}

#animation .media {
	left: 70px;
	top: 12px;
}

#animation .ventures {
	left: 394px;
	top: 145px;
}

#animation .daten {
	left: 72px;
	top: 285px;
}

/*
** Triangle
*/

#animation .triangle .tri-stroke {
	background: #df0b1f;
	height: 15px;
	width: 150px;
}

#animation .triangle .tri-media,
#animation .triangle .tri-ventures,
#animation .triangle .tri-daten {
	overflow: hidden;
	position: absolute;
}


#animation .triangle .tri-media {
	height: 100px;
	left: 204px;
	top: 62px;
	width: 140px;
}

#animation .triangle .tri-media .tri-stroke {
	height: 25px;
	margin-top: 57px;
	margin-left: -31px;
-webkit-transform: rotate(30deg);  /* Chrome, Opera 15+, Safari 3.1+ */
	-ms-transform: rotate(30deg);  /* IE 9 */
  		transform: rotate(30deg);  /* Firefox 16+, IE 10+, Opera */
	width: 180px;
}

#animation .triangle .tri-ventures {
	height: 100px;
	left: 204px;
	top: 162px;
	width: 136px;
}

#animation .triangle .tri-ventures-helper {
	background: #F3F3F3;
	height: 80px;
	left: 0px;
	position: absolute;
	top: 0px;
	width: 136px;
	opacity: 0;
}

#animation .triangle .tri-ventures .tri-stroke {
	height: 25px;
	margin-top: 15px;
	margin-left: -31px;
-webkit-transform: rotate(-30deg);  /* Chrome, Opera 15+, Safari 3.1+ */
	-ms-transform: rotate(-30deg);  /* IE 9 */
  		transform: rotate(-30deg);  /* Firefox 16+, IE 10+, Opera */
	width: 190px;
}

#animation .triangle .tri-daten {
	height: 126px;
	left: 204px;
	top: 100px;
	width: 136px;
}

#animation .triangle .tri-daten .tri-stroke {
	height: 130px;
	margin-top: 0px;
	margin-left: 0px;
	opacity: 1;
-webkit-transform: rotate(0deg);  /* Chrome, Opera 15+, Safari 3.1+ */
	-ms-transform: rotate(0deg);  /* IE 9 */
  		transform: rotate(0deg);  /* Firefox 16+, IE 10+, Opera */
	width: 25px;
}

/*
** Circle
*/

#animation .circle {
	border: 15px solid #df0b1f;
	height: 220px;
	left: 125px;
	width: 220px;
	top: 38px;

-webkit-border-radius: 250px;
   -moz-border-radius: 250px;
		border-radius: 250px;
}

/*
** Animation
** Name | Duration | Timimg-Function | Iteration | Delay | Direction 
*/

/*
** Words
*/

@-webkit-keyframes text {
  0%   { opacity: 0; left: 200px; top: 140px;}
  100% { opacity: 1; }
}
@-moz-keyframes text {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
@-o-keyframes text {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
@keyframes text {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}

#animation .text.media {
  -webkit-animation: text 1s ease 1 1s backwards; /* Safari 4+ */
  -moz-animation:    text 1s ease 1 1s backwards; /* Fx 5+ */
  -o-animation:      text 1s ease 1 1s backwards; /* Opera 12+ */
  animation:         text 1s ease 1 1s backwards; /* IE 10+, Fx 29+ */
}

.no-csstransforms3d #animation .text.media {
  -webkit-animation: opacity 1s ease 1s;
  -moz-animation:    opacity 1s ease 1s;
  -o-animation:      opacity 1s ease 1s;
  animation:         opacity 1s ease 1s; 
}

#animation .text.ventures {
  -webkit-animation: text 1s ease 1 2.7s backwards; /* Safari 4+ */
  -moz-animation:    text 1s ease 1 2.7s backwards; /* Fx 5+ */
  -o-animation:      text 1s ease 1 2.7s backwards; /* Opera 12+ */
  animation:         text 1s ease 1 2.7s backwards; /* IE 10+, Fx 29+ */
}

#animation .text.daten {
  -webkit-animation: text 1s ease 1 4.4s backwards; /* Safari 4+ */
  -moz-animation:    text 1s ease 1 4.4s backwards; /* Fx 5+ */
  -o-animation:      text 1s ease 1 4.4s backwards; /* Opera 12+ */
  animation:         text 1s ease 1 4.4s backwards; /* IE 10+, Fx 29+ */
}

/*
** Triangle
*/

@-webkit-keyframes tri-media {
  0%   { width: 0px; }
  100% { width: 140px; opacity: 1; }
}
@-moz-keyframes tri-media {
  0%   { width: 0px; }
  100% { width: 140px; opacity: 1; }
}
@-o-keyframes tri-media {
  0%   { width: 0px; }
  100% { width: 140px; opacity: 1; }
}
@keyframes tri-media {
  0%   { width: 0px; }
  100% { width: 140px; opacity: 1; }
}

#animation .triangle .tri-media {
  -webkit-animation: tri-media 1.5s ease 1 1.5s backwards; /* Safari 4+ */
  -moz-animation:    tri-media 1.5s ease 1 1.5s backwards; /* Fx 5+ */
  -o-animation:      tri-media 1.5s ease 1 1.5s backwards; /* Opera 12+ */
  animation:         tri-media 1.5s ease 1 1.5s backwards; /* IE 10+, Fx 29+ */
}

@-webkit-keyframes tri-ventures {
  0%   { left: 0px; opacity: 1; }
  100% { left: -140px; opacity: 1; }
}
@-moz-keyframes tri-ventures {
  0%   { left: 0px; opacity: 1; }
  100% { left: -140px; opacity: 1; }
}
@-o-keyframes tri-ventures {
  0%   { left: 0px; opacity: 1; }
  100% { left: -140px; opacity: 1; }
}
@keyframes tri-ventures {
  0%   { left: 0px; opacity: 1; }
  100% { left: -140px; opacity: 1; }
}

#animation .triangle .tri-ventures-helper {
  -webkit-animation: tri-ventures 1.5s ease 1 3.2s backwards; /* Safari 4+ */
  -moz-animation:    tri-ventures 1.5s ease 1 3.2s backwards; /* Fx 5+ */
  -o-animation:      tri-ventures 1.5s ease 1 3.2s backwards; /* Opera 12+ */
  animation:         tri-ventures 1.5s ease 1 3.2s backwards; /* IE 10+, Fx 29+ */
}


@-webkit-keyframes tri-daten {
  0%   { margin-top: 135px; opacity: 1; }
  100% { margin-top: 0; opacity: 1; }
}
@-moz-keyframes tri-daten {
  0%   { margin-top: 135px; opacity: 1; }
  100% { margin-top: 0; opacity: 1; }
}
@-o-keyframes tri-daten {
  0%   { margin-top: 135px; opacity: 1; }
  100% { margin-top: 0; opacity: 1; }
}
@keyframes tri-daten {
  0%   { margin-top: 135px; opacity: 1; }
  100% { margin-top: 0; opacity: 1; }
}

#animation .triangle .tri-daten .tri-stroke {
  -webkit-animation: tri-daten 1.5s ease 1 4.9s backwards; /* Safari 4+ */
  -moz-animation:    tri-daten 1.5s ease 1 4.9s backwards; /* Fx 5+ */
  -o-animation:      tri-daten 1.5s ease 1 4.9s backwards; /* Opera 12+ */
  animation:         tri-daten 1.5s ease 1 4.9s backwards; /* IE 10+, Fx 29+ */
}

/*
** Circle
*/

@-webkit-keyframes circle {
  0%   { 
  	border: 2px solid #df0b1f; 
  	height: 200px;
  	margin: 20px 0 0 20px; 
  	opacity: 0; 
  	width: 200px; 

-webkit-box-shadow: 0px 0px 2px 0px rgba(223,11,31,0.7);
   -moz-box-shadow: 0px 0px 2px 0px rgba(223,11,31,0.7);
		box-shadow: 0px 0px 2px 0px rgba(223,11,31,0.7);
  }/*
  50% {
  	height: 170px;
  	margin: 50px 0 0 50px; 
  	width: 170px;

-webkit-box-shadow: 0px 0px 2px 20px rgba(223,11,31,0.7);
   -moz-box-shadow: 0px 0px 2px 20px rgba(223,11,31,0.7);
		box-shadow: 0px 0px 2px 20px rgba(223,11,31,0.7);
  }*/
  100% { 
  	border: 15px solid #df0b1f; 
  	height: 220px; 
  	margin: 0; 
  	opacity: 1; 
  	width: 220px; 

-webkit-box-shadow: 0px 0px 2px 50px rgba(223,11,31,0);
   -moz-box-shadow: 0px 0px 2px 50px rgba(223,11,31,0);
		box-shadow: 0px 0px 2px 50px rgba(223,11,31,0);
  }
}
@-moz-keyframes circle {
 0%   { 
  	border: 2px solid #df0b1f; 
  	height: 200px;
  	margin: 20px 0 0 20px; 
  	opacity: 0; 
  	width: 200px; 

-webkit-box-shadow: 0px 0px 2px 10px rgba(0,0,0,1);
   -moz-box-shadow: 0px 0px 2px 10px rgba(0,0,0,1);
		box-shadow: 0px 0px 2px 10px rgba(0,0,0,1);
  }
  50% {
-webkit-box-shadow: 0px 0px 2px 20px rgba(223,11,31,0.7);
   -moz-box-shadow: 0px 0px 2px 20px rgba(223,11,31,0.7);
		box-shadow: 0px 0px 2px 20px rgba(223,11,31,0.7);
  }
  100% { 
  	border: 15px solid #df0b1f; 
  	height: 220px; 
  	margin: 0; 
  	opacity: 1; 
  	width: 220px; 

-webkit-box-shadow: 0px 0px 2px 50px rgba(223,11,31,0);
   -moz-box-shadow: 0px 0px 2px 50px rgba(223,11,31,0);
		box-shadow: 0px 0px 2px 50px rgba(223,11,31,0);
  }
}
@-o-keyframes circle {
 0%   { 
  	border: 2px solid #df0b1f; 
  	height: 200px;
  	margin: 20px 0 0 20px; 
  	opacity: 0; 
  	width: 200px; 

 webkit-box-shadow: 0px 0px 2px 10px rgba(0,0,0,1);
   -moz-box-shadow: 0px 0px 2px 10px rgba(0,0,0,1);
		box-shadow: 0px 0px 2px 10px rgba(0,0,0,1);
  }
  50% {
-webkit-box-shadow: 0px 0px 2px 20px rgba(223,11,31,0.7);
   -moz-box-shadow: 0px 0px 2px 20px rgba(223,11,31,0.7);
		box-shadow: 0px 0px 2px 20px rgba(223,11,31,0.7);
  }
  100% { 
  	border: 15px solid #df0b1f; 
  	height: 220px; 
  	margin: 0; 
  	opacity: 1; 
  	width: 220px; 

-webkit-box-shadow: 0px 0px 2px 50px rgba(223,11,31,0);
   -moz-box-shadow: 0px 0px 2px 50px rgba(223,11,31,0);
		box-shadow: 0px 0px 2px 50px rgba(223,11,31,0);
  }
}
@keyframes circle {
 0%   { 
  	border: 2px solid #df0b1f; 
  	height: 200px;
  	margin: 20px 0 0 20px; 
  	opacity: 0; 
  	width: 200px;

 webkit-box-shadow: 0px 0px 2px 10px rgba(0,0,0,1);
   -moz-box-shadow: 0px 0px 2px 10px rgba(0,0,0,1);
		box-shadow: 0px 0px 2px 10px rgba(0,0,0,1); 
  }
  50% {
-webkit-box-shadow: 0px 0px 2px 20px rgba(223,11,31,0.7);
   -moz-box-shadow: 0px 0px 2px 20px rgba(223,11,31,0.7);
		box-shadow: 0px 0px 2px 20px rgba(223,11,31,0.7);
  }
  100% { 
  	border: 15px solid #df0b1f; 
  	height: 220px; 
  	margin: 0; 
  	opacity: 1; 
  	width: 220px; 

-webkit-box-shadow: 0px 0px 2px 50px rgba(223,11,31,0);
   -moz-box-shadow: 0px 0px 2px 50px rgba(223,11,31,0);
		box-shadow: 0px 0px 2px 50px rgba(223,11,31,0);
  }
}

#animation .circle {
  -webkit-animation: circle 0.5s ease 1 6.0s backwards; /* Safari 4+ */
  -moz-animation:    circle 0.5s ease 1 6.0s backwards; /* Fx 5+ */
  -o-animation:      circle 0.5s ease 1 6.0s backwards; /* Opera 12+ */
  animation:         circle 0.5s ease 1 6.0s backwards; /* IE 10+, Fx 29+ */
}