/* ****************************************************************************************************************
 *      Web:            Esemmese                                                                                  *
 *      Autor:                            *
 *      Hoja:           principal.css                                                                             *
 *      Descripcion:    maquetacion Esemmese                                                                      *
 *      Fecha:          25/07/2010                                                                                *
 *****************************************************************************************************************/

/*** NEUTRALIZANDO ESTILOS:
elementos que queremos limpiar completamente: ***/
* {margin: 0; padding: 0; /*border: none;* eliminado para darle el estilo por defecto a los botones de formulario*/ }
body{ font: 0.8125em/1  Georgia, Times New Roman, Arial, sans-serif; padding: 0; margin: 0;}
/*** NEUTRALIZANDO ESTILOS:
elementos con margen vertical: ***/
h1, h2, h3, h4, h5, h6, p, pre,
blockquote, ul, ol, dl, address { font-weight: normal; margin: 0; }

/*** Algunos ajustes basicos: ***/
sup { position: relative; bottom: 0.3em; vertical-align: baseline; }
sub { position: relative; bottom: -0.2em; vertical-align: baseline; }
li, dd, blockquote {  list-style: none; }

/*** LINKS: */

a, a:link, a:visited, a:hover, a:active {
outline: 0; /*Elimina la línea de puntos que aparece alrededor de los enlace al clicarlos*/ text-decoration: none;}
a img { border: none; text-decoration: none; }
img {border: none; text-decoration: none; /*Si añades un background aparecerá como fondo de la imagen, útil para imágenes de carga*/ }

/*** FORMULARIOS: ***/
/*label,*/ button { cursor:pointer; }
/*input, select, textarea { font-size: 100%;}*/
input:focus, select:focus, textarea:focus { background-color: #FFF;}
fieldset { border: none;}

.estirar{ height: 1%;}
.estirar:after {clear:both; content:".";display:block; height:0pt; visibility:hidden; }

.alt{ display: none;}


/* ==================== MAQUETACION =================== */

body{ text-align: center; background:#030303 url(../img/fondoeseMMese.png) top center no-repeat;}

#wrapper {  margin: 0 auto;  height: auto;}

#contenedor { overflow: hidden; margin: 20px auto 0 auto;  text-align: left; width:960px;}

#cabecera, #contenido,  #pie{ float:left; width:960px;}
	
/************ CABECERA **********/	
.cabeceraizq, .cabeceradrcha{ float:left; width:480px;}
	.logo{ float:left; background:url(../img/logoesemmese.png) top left no-repeat; width:364px; height:89px; text-indent:-9000px;}	
	.lema{ float:left; font-family:Arial, Helvetica, sans-serif; font-size:2.2em; font-weight:900; color:#64ccf4; width:364px; margin:30px 0 0 20px;}
		.textoamarillo{ color:#d9e01f;}
	.cajabola{ float:left; background:url(../img/bolaAzul.png) top left no-repeat; margin:24px 0 0 88px; width:180px; height:183px;}
		.textobola{ color:#FFFFFF; display:block; font-family:Arial,Helvetica,sans-serif; font-size:1.6em; font-weight:bold; line-height:21px; margin:36px 0 0 23px; text-align:center; width:130px;}
.cabeceradrcha{ float:right;}
	
	.cajaiphone, .cajahtc{ float:left; width:195px; margin:0 45px 0 34px; display:inline;}
		a.btnappstore:link, a.btnappstore:visited{ background:url(../img/botonesAppstore.png) no-repeat 0 0 transparent; float:left; display:block; overflow:hidden; height:63px; margin:25px 0 0 20px; width:153px; text-indent:-9000px;} 
		a.btnappstore:hover, a.btnappstore:active{ background:url(../img/botonesAppstore.png)  no-repeat scroll -171px 0; height:63px;}
	
	.cajahtc{ background:url(../img/htc.png) top left no-repeat; margin:0;}
		a.btnhtc:link, a.btnhtc:visited{ background:url(../img/botonesMarket.png) no-repeat 0px 0 transparent; float:left; height:63px; margin:25px 0 0 20px; overflow:hidden; width:153px; text-indent:-9000px;}
		a.btnhtc:hover, a.btnhtc:active{ background:url(../img/botonesMarket.png)  no-repeat scroll -173px 0 transparent; height:63px;}
		
		
/*************** CONTENIDO ********************/		
#contenido{ background:url(../img/fondoContenido.png) top left no-repeat; height:925px; margin-top:20px;}		
	.ulcontenido{ float:left; width:940px; height:948px; padding:40px 10px 0 10px;}
		.ulcontenido li, .ulcontenido .licentral{ float:left; width:304px; height:948px;}
		.ulcontenido .licentral{ margin:0 14px;}
			.btnazulcontenido{ float:left; background-color:#64ccf4; color:#FFF; font-weight:bold; text-align:center; font-size:1.9em; font-family:Arial, Helvetica, sans-serif; width:304px; -moz-border-radius:4px; -webkit-border-radius:4px; padding:8px 0;}
		
		.cajacontenedora{ float:left; width:304px; height:211px;}
		
		/**** COLUMNA 1 *****/
		.logoconsupermiso{ float:left; background:url(../img/logoConsupermiso.png) top left no-repeat; width:169px; height:137px; margin:0 0 20px 66px; text-indent:-9000px;}
		a.enlaceconsupermiso{ text-decoration:underline; color:#64CCF2; float:left; font-family:Arial,Helvetica,sans-serif; font-size:1.3em; margin-bottom:53px; margin-left:50px; text-align:center; width:211px;}
		a.enlaceconsupermiso:hover{ background-color:#64ccf2; color:#FFF;}
		
		.ulinteriorcontenido{ float:left; height:251px; margin:30px 0 0 15px; width:280px;} 
			.ulinteriorcontenido li{ background:url(../img/circuloListas.png) left 5px  no-repeat; float:left; font-family:Arial,Helvetica,sans-serif; font-size:1.3em; height:auto; line-height:17px; margin-bottom:20px; padding-left:24px; width:254px; color:#404040;}
			.ulinteriorcontenido li strong{ float:left; margin-right:4px;}
			.ulinteriorcontenido li a.atextoconsupermiso{ text-decoration:underline; color:#64CCF2;}
			.ulinteriorcontenido li a.atextoconsupermiso:hover{ background-color:#64CCF2; color:#FFF;}
				.imgencolumna1{ height:83px; margin:0px 0 0 3px; width:300px;}

		/**** COLUMNA 2 *****/
		.textoexplicativo, .textoexplicativo2{ float:left; font-family:Arial,Helvetica,sans-serif; font-size:1.4em; color:#404040; font-weight:normal; line-height:20px; margin-top:37px; width:256px; padding-left:26px;} 
			.textoexplicativo a.atextoconsupermiso{ text-decoration:underline; color:#64CCF2;}
			.textoexplicativo a.atextoconsupermiso:hover{ background-color:#64CCF2; color:#FFF;}
			.textoexplicativo strong{ float:left; margin-right:4px;}
			.imgencolumna2{ height:179px; margin:140px 0 0 39px; width:240px;}
		/**** COLUMNA 3 *****/
			.imgencolumna3{ width:240px; height:178px; margin:140px 0 0 39px;}
		
#pie{ background:url(../img/fondoPie.png) top left no-repeat; height:60px; font-size:1em; font-family:Arial, Helvetica, sans-serif;}		
	.logopie{ float:right; background:url(../img/logopie.png) top left no-repeat; margin:12px 40px 0 10px; width:198px; height:48px; text-indent:-9000px;}
	a.politicaprivacidad{ float:right; color:#64ccf4; margin:23px 0 0 0; text-decoration:underline; width:135px; text-align:center;}
	a.avisolegal{ float:right; color:#64ccf4;  margin:23px 0 0 0; text-decoration:underline; width:84px; text-align:center;}
	a.avisolegal:hover, a.politicaprivacidad:hover{ color:#FFF; text-decoration:underline;} 
	.empresapie{ float:right; color:#64ccf4;  margin:23px 0 0 0; width:180px;}
		
	.lineaseparacion{ float:right; color:#64ccf4;  margin:23px 0 0 0;}