/* SLIDER */

#slider {
	background:#000;
	border: 10px solid #3C3C3C ;
	box-shadow: 0px 0px 5px rgba(0,0,0,5);
	height:520px;
	width:1000px;
	margin:40px auto 0;	
	margin-top:5px;
	overflow:visible;
	position:relative;

}
.foto2 {
height:500px;
width:1000px;
}

#mask {
	overflow:hidden;
	height:520px;
	position:relative;
}

#slider ul {
	margin:0;
	padding:0;
	position:relative;
}

#slider li {
	width:1000px;
	height:520px;
	position:absolute;
	top:-520px;
	list-style:none;
}


#slider li.firstanimation {

	-moz-animation:cycle 25s linear infinite;
	
-webkit-animation:cycle 25s linear infinite;
	
}

#slider li.secondanimation {

	-moz-animation:cycletwo 25s linear infinite;

	-webkit-animation:cycletwo 25s linear infinite;

}

#slider li.thirdanimation {

	-moz-animation:cyclethree 15s linear infinite;

	-webkit-animation:cyclethree 25s linear infinite;

}

#slider li.fourthanimation {

	-moz-animation:cyclefour 25s linear infinite;

	-webkit-animation:cyclefour 25s linear infinite;

}

#slider li.fifthanimation {

	-moz-animation:cyclefive 25s linear infinite;

	-webkit-animation:cyclefive 25s linear infinite;
		
}
/* PROGRESS BAR */

.progress-bar {
 
	position:relative;

	top:-20px;

	width:1000px;
 
	height:5px;

	background:#fff;

	-moz-animation:fullexpand 25s ease-out infinite;

	-webkit-animation:fullexpand 25s ease-out infinite;

}

/* ANIMATION */

@-moz-keyframes cycle {
	0%  { top:0px; }
	
4%  { top:0px; } 
	
16% { top:0px; opacity:1; z-index:0; } 
	
20% { top:520px; opacity:0; z-index:0; } 
	
21% { top:-520px; opacity:0; z-index:-1; }
	
92% { top:-520px; opacity:0; z-index:0; }
	
96% { top:-520px; opacity:0; }
	
100%{ top:0px; opacity:1; }
	

}

@-moz-keyframes cycletwo {
	
0%  { top:-520px; opacity:0; }
	
16% { top:-520px; opacity:0; }
	
20% { top:0px; opacity:1; }
	
24% { top:0px; opacity:1; } 
	
36% { top:0px; opacity:1; z-index:0; } 
	
40% { top:520px; opacity:0; z-index:0; }
	
41% { top:-520px; opacity:0; z-index:-1; } 
	
100%{ top:-520px; opacity:0; z-index:-1; }

}

@-moz-keyframes cyclethree {
	
0%  { top:-520px; opacity:0; }
	
36% { top:-520px; opacity:0; }
	
40% { top:0px; opacity:1; }
	
44% { top:0px; opacity:1; } 
	
56% { top:0px; opacity:1; } 
	
60% { top:520px; opacity:0; z-index:0; }
	
61% { top:-520px; opacity:0; z-index:-1; } 
	
100%{ top:-520px; opacity:0; z-index:-1; }

}

@-moz-keyframes cyclefour {
	
0%  { top:-520px; opacity:0; }
	
56% { top:-520px; opacity:0; }
	
60% { top:0px; opacity:1; }
	
64% { top:0px; opacity:1; }
	
76% { top:0px; opacity:1; z-index:0; }
	
80% { top:520px; opacity:0; z-index:0; }
	
81% { top:-520px; opacity:0; z-index:-1; }
	
100%{ top:-520px; opacity:0; z-index:-1; }

}

@-moz-keyframes cyclefive {
	
0%  { top:-520px; opacity:0; }
	
76% { top:-520px; opacity:0; }
	
80% { top:0px; opacity:1; }
	
84% { top:0px; opacity:1; }
	
96% { top:0px; opacity:1; z-index:0; }
	
100%{ top:520px; opacity:0; z-index:0; }

}


@-webkit-keyframes cycle {
	
0%  { top:0px; }
	
4%  { top:0px; }
	
16% { top:0px; opacity:1; z-index:0; } 

20% { top:520px; opacity:0; z-index:0; }

21% { top:-520px; opacity:0; z-index:-1; }
	
50% { top:-520px; opacity:0; z-index:-1; }
	
92% { top:-520px; opacity:0; z-index:0; }
	
96% { top:-520px; opacity:0; }
	
100%{ top:0px; opacity:1; }
	

}

@-webkit-keyframes cycletwo {
	
0%  { top:-520px; opacity:0; }
	
16% { top:-520px; opacity:0; }
	
20% { top:0px; opacity:1; }
	
24% { top:0px; opacity:1; } 
	
36% { top:0px; opacity:1; z-index:0; } 
	
40% { top:520px; opacity:0; z-index:0; }
	
41% { top:-520px; opacity:0; z-index:-1; }  
	
100%{ top:-520px; opacity:0; z-index:-1; }

}

@-webkit-keyframes cyclethree {
	
0%  { top:-520px; opacity:0; }
	
36% { top:-520px; opacity:0; }
	
40% { top:0px; opacity:1; }
	
44% { top:0px; opacity:1; } 
	
56% { top:0px; opacity:1; z-index:0; } 
	
60% { top:520px; opacity:0; z-index:0; } 
	
61% { top:-520px; opacity:0; z-index:-1; }
	
100%{ top:-520px; opacity:0; z-index:-1; }

}

@-webkit-keyframes cyclefour {
	
0%  { top:-520px; opacity:0; }
	
56% { top:-520px; opacity:0; }
	
60% { top:0px; opacity:1; }
	
64% { top:0px; opacity:1; }
	
76% { top:0px; opacity:1; z-index:0; }
	
80% { top:520px; opacity:0; z-index:0; }
	
81% { top:-520px; opacity:0; z-index:-1; }
	
100%{ top:-520px; opacity:0; z-index:-1; }

}

@-webkit-keyframes cyclefive {
	
0%  { top:-520px; opacity:0; }
	
76% { top:-520px; opacity:0; }
	
80% { top:0px; opacity:1; }
	
84% { top:0px; opacity:1; }
	
96% { top:0px; opacity:1; z-index:0; }
	
100%{ top:520px; opacity:0; z-index:0; }

}


/* ANIMATION BAR */

@-moz-keyframes fullexpand {
   
 0%, 20%, 40%, 60%, 80%, 100% { width:0%; opacity:0; }
   
 4%, 24%, 44%, 64%, 84% { width:0%; opacity:0.3; }
  
 16%, 36%, 56%, 76%, 96% { width:100%; opacity:0.7; }
  
 17%, 37%, 57%, 77%, 97% { width:100%; opacity:0.3; }
  
 18%, 38%, 58%, 78%, 98% { width:100%; opacity:0; }	

}

@-webkit-keyframes fullexpand {
    
0%, 20%, 40%, 60%, 80%, 100% { width:0%; opacity:0; }
    
4%, 24%, 44%, 64%, 84% { width:0%; opacity:0.3; }
  
 16%, 36%, 56%, 76%, 96% { width:100%; opacity:0.7; }
   
17%, 37%, 57%, 77%, 97% { width:100%; opacity:0.3; }
   
18%, 38%, 58%, 78%, 98% { width:100%; opacity:0; }	

}