html {
 height: 100%;
}


body {
  height: 100%;
background-color:#000000;
}

h1, h2, p { 

color:#879e8b;
font-family:Verdana, Geneva, sans-serif;

}







#battleground {

background-color:#618768;
position:relative;
top:0px;
margin-left:auto;
margin-right:auto;
width:96%;
height:93%;

border-image: url('images/metalbkg2.jpg') 30 30 30 30 
round round; 
border-style: inset;
border-width: 30px; 

}



#start-button {

position:relative;
width:40%;
top:15%;
margin-left:auto;
margin-right:auto;
text-align:center;
z-index:.5;
opacity:0;


  -webkit-animation: but-1 2s ease 11s 1 forwards;
     -moz-animation: but-1 2s ease 11s 1 forwards;
       -o-animation: but-1 2s ease 11s 1 forwards;
          animation: but-1 2s ease 11s 1 forwards;
}

@-webkit-keyframes but-1 { 
0%   	{opacity:0;}
100% 	{opacity:1;}}
   @-moz-keyframes but-1{ 
0%   	{opacity:0;}
100% 	{opacity:1;}}
     @-o-keyframes but-1 { 
0%   	{opacity:0;}
100% 	{opacity:1;}}
        @keyframes but-1 { 
0%   	{opacity:0;}
100% 	{opacity:1;}}



#deployment {

position:absolute;
background-color:#618768;
width:40%;
top:30%;
margin-left:30%;
padding:50px;
opacity:1;
z-index:1;

  -webkit-animation: dep-1 3s ease 8s 1 forwards;
     -moz-animation: dep-1 3s ease 8s 1 forwards;
       -o-animation: dep-1 3s ease 8s 1 forwards;
          animation: dep-1 3s ease 8s 1 forwards;
}

@-webkit-keyframes dep-1 { 
0%   	{opacity:1;z-index:1;}
90%	{opacity:0;z-index:1;}
100% 	{opacity:0; z-index:-1;}}
   @-moz-keyframes dep-1{ 
0%   	{opacity:1;z-index:1;}
90%	{opacity:0;z-index:1;}
100% 	{opacity:0; z-index:-1;}}
     @-o-keyframes dep-1 { 
0%   	{opacity:1;z-index:1;}
90%	{opacity:0;z-index:1;}
100% 	{opacity:0; z-index:-1;}}
        @keyframes dep-1 { 
0%   	{opacity:1;z-index:1;}
90%	{opacity:0;z-index:1;}
100% 	{opacity:0; z-index:-1;}}







a {

text-decoration:none;

}

/* hide span txt  */
 span, :visited span {

display:none;

}

/* format span txt box  */

:focus span {
  position:absolute;  
  width:335px; 
  display:block; 
  font-family:Verdana; 
  font-size:12px; 
line-height:19px;
  background:#3a513e; 
  /*opacity:.4;*/
  border:1px solid silver; 
  padding:15px;
  }

.r:focus span {

left:0px;
top:200px;
}

.c:focus span {

left:0px;
bottom:200px;

}


.cright:focus span{

right:0px;
bottom:200px;

}


.rright:focus span{

right:0px;
top:150px;

}


      :focus{
        border-color:white;
        -moz-box-shadow: inset 0px 0px 12px #fff;
        -webkit-box-shadow: inset 0px 0px 24px #37edf8, 0px 0px 24px #37edf8;
        box-shadow: inset 0px 0px 24px #37edf8, 0px 0px 24px #37edf8;
		-webkit-appearance: none;
		}

		
#army-label-1 {

position relative;
width:200px;
margin-top:200px;
margin-left:auto;
margin-right:auto;
text-align:center;

}
		
		
#army-label-2 {

position:relative;
top:40%;
width:200px;
margin-left:auto;
margin-right:auto;
text-align:center;

}