/* General styles */

.euroMap{
	position: relative;
	width: 100%;
	height: 500px;
	top: 50%;
	left: 50%;
	overflow: hidden;
	transform: translate(-50%,0);
}
.euroMap .layer{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
}
.euroMap img{
	width: 50%;
}
.euroMap.anim img.layer.eur {
	animation: euroMapAnimC 2s;
}
.euroMap img.layer.eur {
	transform: scale(1);
	transition: transform 2s;
}
.euroMap.anim img.layer.france {
	animation: euroMapAnimA 2s, euroMapAnimB 2s;
	animation-delay: 0s, 0s;
}
.euroMap img.layer.france {
	transform: scale(1);
	opacity: 1;
}
.euroMap.anim img.layer.location{
	animation: euroMapAnimD 2s, euroMapAnimE 5s infinite;
	animation-delay: 0s, 2s;
}
.euroMap img.layer.location{
	transform: translate(0,0);
}


@keyframes euroMapAnimA {
	0%    { 
		transform: scale(2);
	}
	100%  { 
		transform: scale(1); 
	}
}
@keyframes euroMapAnimB {
	0%    { 
		opacity: 0;
	}
	40%  { 
		opacity: 0; 
	}
	100%  { 
		opacity: 1;
	}
}
@keyframes euroMapAnimC {
	0%    { 
		transform: scale(2);
	}
	100%  { 
		transform: scale(1); 
	}
}
@keyframes euroMapAnimD {
	0%    { 
		transform: translate(100%,0);
	}
	50%  { 
		transform: translate(100%,0); 
	}
	100%  { 
		transform: translate(0,0); 
	}
}
@keyframes euroMapAnimE {
	0%    { 
		transform: translate(0,0);  ; 
	}
	48%  { 
		transform: translate(0,0);  
	}
	50%  { 
		transform: translate(0,-5px); 
	}
	54%  { 
		transform: translate(0,0);   
	}
	100%  { 
		transform: translate(0,0);  
	}
}
