/* mmmmmmmmmmmmmmmmmm Carthaginian Army  mmmmmmmmmmmmmmmmm */


p {color:#37edf8;}

:hover {
 -webkit-box-shadow: inset 0px 0px 24px #37edf8, 0px 0px 24px #37edf8;
}

#Carth-Gen {

background-image:url('images/carth-general-w-std.png');
position:absolute;
width:60px;
height:40px;
left:48.2%;
bottom:60px;
z-index:2;


}#carth-hc-2{
background-image:url('images/poeni-cav--1.png');
position:absolute;
width:60px;
height:40px;
left:48.2%;
bottom:20px;
z-index:2;
}


#carth-mi-1{
background-image:url('images/libyan-mi.png');

position:absolute;
width:120px;
height:40px;
left:54%;
bottom:60px;
z-index:2;
}




#carth-lmi-1{
background-image:url('images/celtiberians.png');
position:absolute;
width:120px;
height:60px;
left:39%;
bottom:40px;
z-index:2;
}


#carth-li-1{
background-image:url('images/balearic-slingers.png');
position:absolute;
width:240px;
height:60px;
left:17%;
bottom:40px;
z-index:1;

  -moz-transition: all 1s ease;
  -webkit-transition: all 1s ease;
  -o-transition: all 1s ease;
  transition: all 1s ease;


animation-name:carth-li-1;
animation-duration:200s;
animation-timing-function:ease,;
animation-delay:0s;

animation-iteration-count:1;
animation-direction:normal;
animation-play-state:running;
animation-fill-mode:forwards;

/* Safari and Chrome: */
-webkit-animation-name:carth-li-1;
-webkit-animation-duration:200s;
-webkit-animation-timing-function:ease;
-webkit-animation-delay:0s; 

-webkit-animation-iteration-count:1;
-webkit-animation-direction:normal;
-webkit-animation-play-state:running;
-webkit-animation-fill-mode:forwards;
}

@keyframes carth-li-1
{
0%   	{left:17%;bottom:40px;}
1%  	{left:17%;bottom:40px;}
6%  	{left:17%;bottom:40%;}
20%  	{left:17%;bottom:40%;opacity:1;}
20.1%	{left:17%;bottom:40%;opacity:0;}
100% 	{left:17%;bottom:40%;opacity:0;}
}

@-webkit-keyframes carth-li-1 /* Safari and Chrome */
{
0%   	{left:17%;bottom:40px;}
1%  	{left:17%;bottom:40px;}
6%  	{left:17%;bottom:40%;}
20%  	{left:17%;bottom:40%;opacity:1 ;-webkit-transform: rotateX(0deg); opacity:1;}
20.5% {opacity:.4;}
21%  	{left:17%;bottom:40%;opacity:1 ;-webkit-transform: rotateX(180deg); opacity:1;}
90%	{left:17%;bottom:0%;opacity:1; }         
100% 	{left:17%;bottom:0%;opacity:0; -webkit-transform: rotateX(180deg);}
}

#carth-li-1:hover > #label-c-li-1{
opacity:1;
}


#label-c-li-1{

position:absolute;
top:50px;
right:100px;

z-index:3;
opacity:0;
padding:15px;
  -webkit-animation: ab-face 200s ease  1 forwards;
     -moz-animation: lab-1 10s ease  1 forwards;
       -o-animation: lab-1 10s ease  1 forwards;
          animation: lab-1 10s ease  1 forwards;
}

@-webkit-keyframes ab-face /* Safari and Chrome */
{
20.5%  	{-webkit-transform: rotateX(0deg); top:50px;}
20.6%  	{-webkit-transform: rotateX(180deg); top:-50px;} 
100% 		{-webkit-transform: rotateX(180deg); top:-50px;}
}



#lab1 {

position:absolute;
left:15px;
top:40px;
opacity:0;

  -webkit-animation: lab-1 200s ease  1 forwards;
     -moz-animation: lab-1 10s ease  1 forwards;
       -o-animation: lab-1 10s ease  1 forwards;
          animation: lab-1 10s ease  1 forwards;

}

@-webkit-keyframes lab-1 /* Safari and Chrome */
{
0%   	{opacity:1;}
6%  	{opacity:1;}
6.5% {opacity:0;}
100% 	{opacity:0; }
}


#lab2 {

position:absolute;
left:10px;
top:40px;
opacity:0;


  -webkit-animation: lab-2 200s ease  1 forwards;
     -moz-animation: lab-2 10s ease  1 forwards;
       -o-animation: lab-2 10s ease  1 forwards;
          animation: lab-2 10s ease  1 forwards;
}

@-webkit-keyframes lab-2 /* Safari and Chrome */
{
0%   	{lopacity:0;}
6%		{opacity:0;}
6.5%%  	{opacity:1;}
20%  	{opacity:1;}
20.3% {opacity:0;}
 100% 	{opacity:0;}
}


#lab3 {

position:absolute;
left:10px;
top:40px;
opacity:0;


  -webkit-animation: lab-3 200s ease  1 forwards;
     -moz-animation: lab-3 10s ease  1 forwards;
       -o-animation: lab-3 10s ease  1 forwards;
          animation: lab-3 10s ease  1 forwards;

}

@-webkit-keyframes lab-3 /* Safari and Chrome */
{
0%   	{opacity:0;}
20.5% {opacity:0;}
20.7%  	{opacity:1 }
90%	{opacity:1; }         
100% 	{opacity:0; }
}

#carth-li-2{
background-image:url('images/numidian-li.png');
position:absolute;
width:180px;
height:60px;
left:62%;
bottom:40px;
z-index:1;



animation-name:carth-li-2;
animation-duration:200s;
animation-timing-function:ease;
animation-delay:0s;

animation-iteration-count:1;
animation-direction:normal;
animation-play-state:running;
animation-fill-mode:forwards;

/* Safari and Chrome: */
-webkit-animation-name:carth-li-2;
-webkit-animation-duration:200s;
-webkit-animation-timing-function:linear;
-webkit-animation-delay:0s; 

-webkit-animation-iteration-count:1;
-webkit-animation-direction:normal;
-webkit-animation-play-state:running;
-webkit-animation-fill-mode:forwards;
}

@keyframes carth-li-2
{
0%   	{left:62%;bottom:40px;}
2%  	{left:62%;bottom:40px;}
6%  	{left:62%;bottom:240px;}
20%  	{left:62%;bottom:240px;}
100% 	{left:62%;bottom:0px;}
}

@-webkit-keyframes carth-li-2 /* Safari and Chrome */
{
0%   	{left:62%;bottom:40px;}
2%  	{left:62%;bottom:40px;}
6%  	{left:62%;bottom:45%;}
20%  	{left:62%;bottom:45%;opacity:1;}
20.1%	{left:62%;bottom:45%;opacity:0;}
100% 	{left:62%;bottom:45%;opacity:0;}
}

#li-2-rev {
background-image:url('images/numidian-li-rev.png');
position:absolute;
width:180px;
height:60px;
left:62%;
bottom:240px;
opacity:0;
z-index:1;

animation-name:numrev;
animation-duration:200s;
animation-timing-function:ease;
animation-delay:0s;

animation-iteration-count:1;
animation-direction:normal;
animation-play-state:running;
animation-fill-mode:forwards;

/* Safari and Chrome: */
-webkit-animation-name:numrev;
-webkit-animation-duration:200s;
-webkit-animation-timing-function:ease;
-webkit-animation-delay:0s; 

-webkit-animation-iteration-count:1;
-webkit-animation-direction:normal;
-webkit-animation-play-state:running;
-webkit-animation-fill-mode:forwards;
}

@keyframes numrev
{
0%   	{left:309px;bottom:0px;}
2%  	{left:309px;bottom:0px;}
6%  	{left:309px;bottom:200px;}
20%  	{left:309px;bottom:200px;}
100% 	{left:309px;bottom:0px;}
}

@-webkit-keyframes numrev /* Safari and Chrome */
{
0%   	{left:62%;bottom:45%;}
20%  	{left:62%;bottom:45%;opacity:0;}
20.1%	{left:62%;bottom:45%;opacity:1;}
70%	{opacity:1;}
80% 	{left:62%;bottom:0px;opacity:0;}
100% 	{left:62%;bottom:0px;opacity:0;}
}







#carth-hc-1{
background-image:url('images/poeni-cav--1.png');
position:absolute;
width:60px;
height:80px;
left:33%;
bottom:20px;
z-index:2;
}


#sp-mc{

background-image:url('images/spanish-mc.png');
position:absolute;
width:60px;
height:80px;
bottom:20px;
left:12%;
z-index:2;
}


#sp-lc{

background-image:url('images/spanish-lc.png');
position:absolute;
width:60px;
height:80px;
bottom:20px;
left:5%;
z-index:2;
}



#carth-lc-1{
background-image:url('images/numidian-lc.png');
position:absolute;
width:120px;
height:80px;
left:75%;
bottom:20px;
z-index:2;
}