@charset "UTF-8";
/* CSS Document */

body{
	margin:0;
	padding:0;	
}

h1, h2, h3, h4, h5, h6, p {
	color:white;
	font-family:Arial, Helvetica, sans-serif;
}

#wrapperZumbies{
	width: 920px;
	height:550px;
	margin: 0;
	padding:0;
	background-image:url(../images/fundo.jpg);
}

/* thumbs selects GENERICO */
.thumbSelect {
	position:absolute;
	width:200px;
	height: 140px;
	top:100px;
	left:100px;
}
.thumbSelect.esquerda{
	left:10px;
}
.thumbSelect.direita{
	left:710px;
}

.labelThumbSelect{/*label*/
	width:100%;
	text-align:center;
	margin: 0;
	padding:0;
	font-size:12px;
}
.divThumbSelect {/*div com imagem e botões */
}

.divThumbSelect a img{/*div com imagem e botões */
	border-style: none;
}
.divThumbSelect .setaAnterior { /*seta anterior*/
	display: block;
	position: absolute;
	left: 0;
	top: 62px;
}
.divThumbSelect .setaSeguinte {/*seta seguinte*/
	display:block;
	position:absolute;
	left: 185px;
	top: 62px;
}

.imgThumbSelect{/*imagem objeto*/
	position: absolute;
	width: 138px;
	top: 15px;
	left: 28px;
	background-color:black;
}
/* fim thumbs selects GENERICO */
/* thumbs selecs ESPECIFICO */
#divThumbSelectCabeca{top: 12px}
#divThumbSelectTronco{top: 142px}
#divThumbSelectPernas{top: 273px}
#divThumbSelectPes{top: 403px}

#divThumbsSelectItens{top: 12px}
#divThumbsSelectArmas{top: 142px}
/*fim thumb selects ESPECIFICO */


/* recuadro COMENTARIOS */
#recuadroComentarios {
	display: block;
	position: absolute;
	top: 419px;
	left: 570px;
	width: 335px;
	height: 112px;
	overflow: hidden;
}
#recuadroComentarios p{/*texto dentro dos comentarios */
	padding: 0;
	margin: 10px;
	font-size: 12px;
	text-align: right;
}
/*fim recuadro COMENTARIOS */

	/* barras GENERICO */
	#barras{
	position:absolute;
	top: 300px;
	left: 537px;
	background-color:#6CF;
	
	}
	
	#barras h4{/*labels*/
		position:absolute;
		margin: 0;
		left:0;
		width:90px;
		text-align:right;
		font-size:14px;
	}
	.divsBarras{
		position:absolute;
		left:100px;
		top:50px;
		width: 234px;
		height:14px;
		border-style:solid;
		border-width:1px;
		border-color:white;
		background-color:black;
		background-image:url(../images/pattern.gif);
	}
	/* fim barras GENERICO */
	/* labels ESPECIFICO */
	#labelForca{top:0;}
	#labelAgilidade{top:30px;}
	#labelLongevidade{top:60px;}
	#labelProtecao{top:90px;}
	/* fim labels ESPECIFICO */
	/* barras ESPECIFICO */
	#divBarraForca{top:0;}
	#divBarraAgilidade{top:30px;}
	#divBarraLongevidade{top:60px;}
	#divBarraProtecao{top:90px;}
	/* fim barras ESPECIFICO */
	
	/*barras indicadores GENERICO */
	.divBarrasIndicador{
		height: 10px;
		background-color: white;
		margin: 2px;
	}
	/*fim barras indicadores GENERICO */
	
	/*barras indicadores ESPECIFICO */
	#divBarraIndicadorForca{
		width:2%;	
	}
	#divBarraIndicadorAgilidade{
		width:2%;	
	}
	#divBarraIndicadorLongevidade{
		width:2%;	
	}
	#divBarraIndicadorProtecao{
		width:2%;	
	}
/*fim barras indicadores ESPECIFICO */

/* SOLDIER/personagem */
.soldier{
	position:absolute;
	top:0;
	left:230px;
}
/* fim SOLDIER/personagem*/

/*recuadro TOOLTIP */

#recuadroTooltip {
		position: absolute;
		width: 200px;
		top: 43px;
		left: 160px;
		background-color: #039;
		z-index: 100;
		margin: 10px;
		padding: 10px;	
		background-image:url(../images/pattern.gif);
		opacity: 0.8;
		border-width:1px;
		border-style:solid;
		border-color:#666;
	}
	
#recuadroTooltip h3 {
	text-transform: uppercase;
	font-size:14px;
	color:#CCC;
}
#recuadroTooltip p {
	font-size:12px;
	color:#CCC;
}

/*  indicador porcentaje  */

.divBarrasIndicadorTxtPercentual {
	position: absolute;
	left: 200px;
	margin: -10px;
	padding: 0;
	color: #333;
	height: 20px;
	width: 25px;
}

.divBarrasIndicadorTxtPercentual p{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight:bold;
	color:#666;	
}


/*tela inicial blur*/

#telaInicialBlur {
	position:absolute;
	z-index:100;	
}
#imgIconePreload{
	position:absolute;
	z-index:101;
	top:240px;
	left:426px;
}