/*** Estilos de la página ***/
html			{ 
   background: #000 url(../images/luna.jpg) no-repeat ;
   font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; 
   font-size: 18px; 
}

/*** Nubes ***/
.clouds					{ 
   width:100%; 
   height:262px; 
   overflow:hidden; 
}
#clouds-small			{ 
   width:3000px; 
   height:100%; 
   background:url(../images/bg-clouds-small.png) repeat-x;
}
#cloud2					{ 
   position:relative; 
   top:-262px;
}
#clouds-big				{
   width:4000px; 
   height:100%; 
   background:url(../images/bg-clouds-big.png) repeat-x;
}

/*** Cabecera ***/
h1#logo				{ 
   background:url(../images/Logo.png) top left no-repeat; 
   height:62px; 
   width:481px;
	text-indent:-9999px; 
   position:absolute; 
   top:10px; 
   left:10px;
}

h2 { 
   font-size: 150%; 
}						

/*** Menu ***/
#menu				{ 
   float:right; 
   position:absolute; 
   top:20px; 
   right:10px; 
   z-index:10;
}

#menu a				{ 
   background:#FFF; 
   color:#000; 
   border:#AAA 3px solid;  
   text-decoration:none; 
   padding:10px;
   margin-right:10px; 
   border-radius:10px; 
   -moz-border-radius:10px; 
   -webkit-border-radius:10px;
}
					
#menu a:hover		{ 
   background:#aaa; 
   color:#FFF; 
   border:#FFF 3px solid; 
   text-decoration:none; 
   padding:10px;
	margin-right:10px; 
   border-radius:10px; 
   -moz-border-radius:10px; 
   -webkit-border-radius:10px;
}

#menu a.selected	{ 
   background:#AAA; 
   color:#FFF; 
   border:#555555 3px solid; 
   text-decoration:none; 
   padding:10px;
	margin-right:10px; 
   border-radius:10px; 
   -moz-border-radius:10px; 
   -webkit-border-radius:10px;
}
					
#menu li			{ float:left; }

/*** Enlaces ***/
a {
	text-decoration: none;
}

a:link {
	border-bottom: 2px dotted #000;
	color: #000;
}

a:visited {
	color: #333333;
	border-bottom: 2px dotted #333333;
}

a:hover {
	color: #333333;
	border-bottom-color: #333333;
}

/*** El cuerpo de la página, van incluidos uno dentro de otro en este orden ***/
#wrapper	{ 
   width:100%; 
   height:100%; 
   position:absolute; 
   top:0; 
   left:0; 
   overflow:hidden; 
}

#mask		{ 
   width:400%; /* Son 4 páginas posibles */
   height:100%; 
}

.box		{ 
   width:25%; /*Una cuarta parte de lo anterior es una página */
   height:100%; 
   float:left;
}

.content	{ 
   width:860px; /* Aquí defino el ancho y alto real del contenedor externo */
   height:420px; 
   top:20%; 
   margin: 0 auto; 
   position:relative; 
   background:#FFFFFF;/* Solo para explorer */
}

				
.inner		{ 
   width:820px; /* Aquí defino el ancho y alto real del contenedor interno */
   height:380px; 
   background:#FFFFFF; /* Solo para explorer */
   margin:5px; 
   padding:15px; 
   top:5px; 
   position:relative;
}


/*** 
     ATENCION
     ESTE ES UN PARCHE PARA QUE EN LOS NAVEGADORES "NORMALES" SE VEA BIEN LA CAJA DE CONTENIDOS
     CON SU TRANSPARENCIA Y ESO. EN EXPLORER FALLABA Y HAY QUE DEJARLO EN BLANCO.
***/     

html>body .content {
   background:rgba(255,255,255, 0.3); /* Contiene una pequeña transparencia */
	border-radius:35px; 
   -moz-border-radius:35px; 
   -webkit-border-radius:35px;
}

html>body .inner {
   background:rgba(255, 255, 255, 0.3); 
   border-radius:30px; 
   -moz-border-radius:30px;
	-webkit-border-radius:30px; 
}