/* -------------------
	Global Resets 
--------------------*/

body{  background: #FFFFFF;
  background-repeat:no-repeat; background-position:center top; 
  background-image:url('imagenespagina/MainBackGround.jpg');
 }

html, body{
   margin:0;
   padding:0;
}
/* -------------------
	Global Personal settings 
--------------------*/

h1, h2, h3, h4 {font-family: 'Arvo', Georgia, Times, serif; }
h1 {font-size: 1.4em; text-align: center; } 
h2 {font-size: 1.2em;}  
h3 {font-size: 1.0em; text-decoration: none;} 
h4 {font-size: 0.9em;}

p {  margin-top: 0.3em;
     text-decoration: none;} 
p + p { margin-top: 0.3em; } 

p.zero {text-indent: 0px; margin-left: 0em;}
p.half {text-indent: 0px; margin-left: 0.5em;}
p.one {text-indent: 0px; margin-left: 1.0em;} 
p.onehalf {text-indent: 0px; margin-left: 1.5em;} 
p.two {text-indent: 0px; margin-left: 2em;} 
p.twohalf {text-indent: 0px; margin-left: 2.5em;} 
p.three {text-indent: 0px; margin-left: 3em;}

a {text-decoration: none;} 
a:link {color: #333333;}
a:visited {color: #333333;}
a:link:hover {text-decoration:underline;}
a img {border: none; }

a.buscacuento {text-decoration:none; line-height:175%;}

.centrado {  text-align: center;}
.center {  text-align: center;}
.left {text-align: left;}
.right {text-align: right;}
.size95  {font-size: 0.95em;}
.size90  {font-size: 0.9em;}
.spacetop { margin-top: 1.5em !important; } 
.spacetoplarge { margin-top: 3.0em !important; } 

hr { color: #DDDDDD; } 
/* -------------------
	Core page structure  
--------------------*/

#contenedor{ 
  position:relative;
  width:1006px;
  background: #FFFFFF;   
  border-right: 0px solid #CCCCCC;
  border-left: 0px solid #CCCCCC;
  margin: auto;
  font-family: 'PT Sans', Helvetica, Arial, sans-serif;
  font-size: 1.0em; 
}

/* ---- ENCABEZADO ---- */ 

#encabezado{
  margin: 0px; 
  padding: 0px; 
  margin-top: 5px; 
  border: 0px solid #666; 
  border-top: 0px solid #CCCCCC;
  text-align: center;
  width: 100%;
  max-width: 1002px;  
  height: 159px;
  background: #FFFFFF; 
}

#encabezado img { width: 100%; height: auto;} 
#encabezado p {line-height: normal; } 

.twitbutton {
  width: 32px; 
  height: 32px; 
  z-index:5;
  display: inline; 
  position: absolute; 
  top: 105px; 
  left: 960px;
  font-size: 10px; 
  text-decoration: none; 
  background-repeat:no-repeat;
  background-image:url('imagenespagina/twitBT.png');   
}

.twitbutton:hover{  background-position:bottom; }



.fbbutton {
  width: 32px; 
  height: 32px; 
  z-index:5;
  display: inline; 
  position: absolute; 
  top: 105px; 
  left: 925px;
  font-size: 10px; 
  text-decoration: none; 
  background-repeat:no-repeat;
  background-image:url('imagenespagina/fbBT.png');   
}

.fbbutton:hover{  background-position:bottom; }

/* ---- NAVEGADOR ---- */ 

#navegador{ 
  margin: 0px; 
  padding: 2px; 
  padding-top: 0.5em; 
  padding-left: 0.5em; 
  float: left; 
  border: 0px solid #666; 
  background: #FFFFFF; 
  width: 194px;

  text-align: left;
  height: 100%;
  font-size: 0.9em;
}

#navegador p { margin:0; } 
 
#navegadorBOTONES 
	{  display:none;  padding-left: 0.5em; text-align: center; width:100%; height:43px;
	}


.navegadorMALTA {margin: 5px; float: left; background-repeat:no-repeat; background-image:url('imagenespagina/maltaBOT.png'); width: 150px; height: 40px; background-position:bottom;}
.navegadorMALTA:hover {cursor:pointer; }

.navegadorMENU {margin: 5px; float: left; background-repeat:no-repeat; background-image:url('imagenespagina/menuBOT.png'); width: 150px; height: 40px; background-position:bottom;}
.navegadorMENU:hover {cursor:pointer; }


.navegadorPAGINA{margin: 5px; float: left; background-repeat:no-repeat; background-image:url('imagenespagina/paginaBOT.png'); width: 150px; height: 40px; background-position:top;}
.navegadorPAGINA:hover {cursor:pointer; }

#navegador a {text-decoration: none; margin-left: 0.0em;   min-height: 1.5em;} 
#navegador a:link {color: #000000;}
#navegador a:visited {color: #111111;}
#navegador a:hover {text-decoration:underline; }

.cuentos-exp {cursor:pointer;} 
.cuentos-menu {display:none;  padding: 0em 0em 0em 0.5em;}  

#cuentos13-menu { padding: 0em 0em 0em 0.5em;}  
#cuentos12-menu {  padding: 0em 0em 0em 0.5em;}  

.novelitas-exp {cursor:pointer;} 
.novelitas-menu {display:none;  padding: 0em 0em 0em 1.0em;}  

.tierras-exp {cursor:pointer;} 
.tierras-menu{ display:none; padding: 0em 0em 0em 1.0em;}  

.religiones-exp { cursor: pointer;}
.religiones-menu{ padding: 0em 0em 0em 1.0em;}
  
.razas-exp { cursor: pointer;}
.razas-menu{ padding: 0em 0em 0em 1.0em;}

.metadata-exp { cursor: pointer;}
.metadata-menu{ padding: 0em 0em 0em 1.0em;}

.cuentoslargos-exp { cursor: pointer;}
.cuentoslargos-menu{ padding: 0em 0em 0em 1.0em; display:none;}

/* ---- CUERPO ---- */ 
#cuerpo{
  margin: 0px; 
  padding: 13px; 
  float: right;
  border: 0px solid #666; 
  /* background-image:url('imagenespagina/liney.jpg'); 
  background-repeat:repeat-y; background-position:left top; */ 
  width: 769px; 
  height: 100%;
  min-height: 400px; 
  text-align: justify;
  font-size: 0.95em;
  
}

.basic
{
  clear: both;
  text-align: justify;
  width: 100%; 
  background: #FFFFFF;
  padding-top: 5px;  
  border: 0px solid #666;
  margin-top: 5px; 
  }
  
.otroscuentosBOX{
  clear: both;
  text-align: justify;
  width: 100%; 
  background: #FFFFFF;
  padding-top: 5px;  
  border: 0px solid #666;
  margin-top: 5px; 
  font-size: 0.95em;
  

  }  

.otroscuentosBOX p {  margin-top: 0.1em !important;}
.otroscuentosBOX   p + p { margin-top: 0.1em !important; }   
  
.topLine {  background-image:url('imagenespagina/linex.jpg');
  background-repeat:repeat-x; background-position:left top; padding-top: 1.0em; 
  clear:both; }

.xLine {  background-image:url('imagenespagina/linex.jpg'); width: 100%; clear:both; 
  background-repeat:repeat-x; background-position:left top; padding-top: 1.0em; 
  }

.topXbox{
  clear: both;
  text-align: left;
  background: #FFFFFF;
  width: 100%; 
  min-height: 10px;
  padding-top: 10px;  
  border: 0px solid #666; 
  background-image:url('imagenespagina/linex.jpg');
  background-repeat:repeat-x; background-position:left top;
  margin-top: 30px;

}
.prenextBOX
{ clear: both;
  text-align: left;
  background: #FFFFFF;
  width: 100%; 
  min-height: 10px;
  padding-top: 10px;  
  border: 0px solid #666; 
  background-image:url('imagenespagina/linex.jpg');
  background-repeat:repeat-x; background-position:left top;
  margin-top: 30px; 
}

.shellBOX
{ clear: both;
  text-align: center;
  background: #FFFFFF;
  padding-top: 5px;  
  border: 0px solid #666;
  margin-top: 5px; 
  padding-left: 150px; 
}

.likeBOX{
  clear: both;
  text-align: left;
  background: #FFFFFF;
  margin: auto; 
  padding-top: 10px;  
  border: 0px solid #666; 
  border-top: 0px solid #DDDDDD;
  padding-left: 150px; 
}

.commentBOX{
  clear: both;
  text-align: left;
  width: 100%; 
  background: #FFFFFF;
  padding-top: 5px;  
  border: 0px solid #666;
  margin-top: 5px; 
}

.twitterBOX{
  float: right; 
  margin: 0px; 
  margin-top: 2px;
  margin-bottom: 2px;
  padding: 5px; 
  border: 0px solid #666; 
  text-align: right;
  width: 34%;
}

.nuevoBOX{ 
  float: left;
  margin: 0px; 
  margin-top: 2px;
  margin-bottom: 2px;
  padding: 0px; 
  border: 0px solid #666; 
  text-align: left;
  width: 64%; 
  height: 100%;
  }
 
 
 .nuevoBOXitem{ 
  float: left;
  margin: 0px; 
  margin-top: 0.5em;
  margin-bottom: 2px;
  padding: 0px; 
  border-radius: 5px;
  border-top: 1px solid #DDDDDD;
  border-left: 1px solid #DDDDDD;
  border-right: 1px solid #AAAAAA;
  border-bottom: 1px solid #AAAAAA;
  text-align: left;
  width: 99%; 
  height: 100%;
  }
.nuevoBOXitem:hover{
  background: #F8F8F8;
 border-radius: 5px;
  border-top: 1px solid #CCCCCC;
  border-left: 1px solid #CCCCCC;
  border-right: 1px solid #999999;
  border-bottom: 1px solid #999999;
}

 .nuevoBOXitemclear{ 
  float: left;
  margin: 0px; 
  margin-top: 2px;
  margin-bottom: 2px;
  padding: 0px; 
  border: 0px solid #666; 
  text-align: left;
  width: 99%; 
  height: 100%;
  }
.nuevoentryBOX {
  margin: 2px; 
  margin-bottom: 7px; 
  padding: 2px; 
  padding-bottom: 14px; 
  padding-top: 0px; 
  float: right;
  background: #FFFFFF;  
  border-radius: 10px;
  border: 2px solid #CCCCCC;
  border-top: 2px solid #CCCCCC;
  border-left: 2px solid #CCCCCC;
  border-right: 2px solid #888888;
  border-bottom: 2px solid #888888;
  width: 430px; 
  height: 200px;
  text-align: justify;
  overflow: hidden; 
  font-size: 0.8em;
}

.nuevoentryBOX:hover{ 
  background: #EEEEEE;
  border-radius: 10px;
  border-top: 2px solid #AAAAAA;
  border-left: 2px solid #AAAAAA;
  border-right: 2px solid #666666;
  border-bottom: 2px solid #666666; 
  }

.nuevoentryBOX a {text-decoration: none;}
.nuevoentryBOX a:link:hover {text-decoration:none; background: #333333;}
  
  
/* ---- CALCE ---- */ 
#calce{
  clear: both;
  margin: auto; 
  background: #FFFFFF;    
  margin: 0px; 
  margin-bottom: 2px;
  padding: 2px; 
  border: 0px solid #666; 
  border-bottom: 0px solid #CCCCCC;  
  text-align: center;
  width: 100%;
  max-width: 1002px;
  height: 80px;
  font-size: 0.8em;
}

.subirbutton {
  float:right;
  width: 76px; 
  height: 38px; 
  display: inline; 
  margin-right: 10px;
  font-size: 10px; 
  text-decoration: none; 
  background-repeat:no-repeat;
  background-image:url('imagenespagina/SubirBOT.png');   
}

.subirbutton:hover{  background-position:bottom; }

.mobileSOCIAL {display:none; float:right; }
.calceFB{ margin-right: 10px; float: right; background-repeat:no-repeat; background-image:url('imagenespagina/FBbutton38.png'); width: 38px; height: 38px; background-position:top;}
.calceFB:hover {cursor:pointer; } 

.calceTW{  margin-right: 10px; float: right; background-repeat:no-repeat; background-image:url('imagenespagina/TWbutton38.png'); width: 38px; height: 38px; background-position:top;}
.calceTW:hover {cursor:pointer; }

/* -------------------
	Paginas Especificas  
--------------------*/
/* ---- ../INDEX ---- */
#index_reciente_virreinatos{

  background: #FFFFFF;
  width: 100%; float:center; 
}  
#index_reciente_malta{
  background: #FFFFFF;  
  width: 50%; float:left;
  margin-left: 0px; 
} 

.nuevoBOXitem{
  margin:0.1em; font-size: 0.6em;
  padding: 0.1em; 
  border: 1px solid #666; 
  border-radius: 5px;
  width: 96%; 
  max-height: 200px; 
  overflow: hidden;
}


/* ---- ../CUENTOS ---- */ 

.boxLeft{ width: 33%; min-height:10px; background: #FFFFFF;  float: left;    }
.boxCenter{width: 33%; min-height:10px; background: #FFFFFF; float: left;}
.boxRight{width: 33%; min-height:10px; background: #FFFFFF; float: right;  }
.boxRightFOOTER{width: 33%; min-height:10px; background: #FFFFFF; float: right;}
.boxLeft50 {width: 48%; min-height:10px; background: #FFFFFF; float: left;}
.boxRight50 {width: 48%; min-height:10px; background: #FFFFFF; float: right;}
.box50 {width: 48%; min-height:10px; background: #FFFFFF; float: left;}

#cuentoindexListaLargaBoton {margin: 5px; float: left; background-repeat:no-repeat; background-image:url('cuentos/cuentosimagenes/botonlistalarga.jpg'); width: 150px; height: 30px; background-position:top;}
#cuentoindexListaLargaBoton:hover {cursor:pointer; }

.cuentoindexListaLarga {clear:both; margin-top: 2.0em;}

#cuentoindexListaCortaBoton{margin: 5px; float: left; background-repeat:no-repeat; background-image:url('cuentos/cuentosimagenes/botonlistacorta.jpg'); width: 150px; height: 30px; background-position:bottom;}
#cuentoindexListaCortaBoton:hover {cursor:pointer; }
.cuentoindexListaCorta {clear:both; display:none; margin-top: 2.0em;}



.cuentoBOX {
  margin: auto; 
  margin-top: 0.5em; 
  padding: 5px; 
  /* padding-bottom: 20px; */ 
  padding-top: 0px; 
  background: #FFFFFF; 
  border-radius: 5px;
  border: 2px solid #CCCCCC;
  border-top: 2px solid #CCCCCC;
  border-left: 2px solid #CCCCCC;
  border-right: 2px solid #888888;
  border-bottom: 2px solid #888888;
  width: 92%; 
  height: 140px;
  text-align: justify;
  overflow: hidden; 
  font-size: 0.8em;
}
.cuentoBOX:hover { 
  background: #F6F6F6;
  border-top: 2px solid #AAAAAA;
  border-left: 2px solid #AAAAAA;
  border-right: 2px solid #666666;
  border-bottom: 2px solid #666666;  
  }

.cuentoBOX a {text-decoration: none;}
.cuentoBOX a:link:hover {text-decoration:none; background: #DDDDDD;}

#listadecuentos { width: 200px; background: #FFFFFF; float: left; }
#descripciondecuentos {width: 100%; overflow: hidden; font-size: 0.9em;}
#descripciondecuentosbox {width: 550px; height: 300px; overflow: hidden; padding: 5px; background: #FFFFFF; float: right;} 

/* ---- ../BIOS ---- */ 
.bio-foto { float: right;   width: 35%; }

.bio-commentarios{  float: left;   width: 60%;   font-size: 0.9em; }

.bio-blurb{
  float: left; 
  width: 100%; } 
  
/* ---- Productos ---- */
.productosCAT { margin: auto; padding: 0px; width: 95%; clear:both; border: 0px solid #CCCCCC; }


.productosCATimg{ width: 10%; float: left; padding-left:10px; }
.productosCATtxt{ width: 85%; float: right; }

.productosCATtxt a {text-decoration: underline;} 
/* ---- MOBILE ----   */

@media screen and (min-width:951px) {
	#navegador {display: inline !important;}
	#navegadorBOTONES{ display:none !important;}
	#cuerpo {display:inline!important; }  
}
@media screen and (max-width:950px) {
    #encabezado {width: 100%; height:100%; }
    #encabezado img {width: 95%; height:auto; }
    #navegador { display: none; width: 100%; }
    #navegador img {width: 40%; height:auto; }    
    #navegador p {  margin-top: 0.5em; font-size: 115%;}
    #cuerpo { width: 95%; background: #FFFFFF; font-size: 110%; }
    #contenedor { width: 100%; }
    #navegadorBOTONES{ display:block;} 
    #cuerpo img { width: 50%; height:auto;} 
    .twitbutton {display: none;}
    .fbbutton {display: none;} 
    .shellBOX {padding-left: 0px; }
    .twitterBOX {display: none; padding-left: 0px;} 
    .nuevoBOX {width:100%;}
    .mobileSOCIAL {display:block; }
    .boxRightFOOTER{ display:none; }
    
    
    .imgsize10 {width: 10% !important; height:auto !important;}
    .imgsize25 {width: 25% !important; height:auto !important;}
    .imgsize90 {width: 90% !important; height:auto !important;}
    
  }
  
@media screen and (max-width:750px) {    
	#cuerpo {font-size: 120%;}
	#cuerpo img { width: 75%; height:auto;}  
    	#navegador img {width: 60%; height:auto; }
    	#navegador p {font-size: 120%;}
    	
        .imgsize10 {width: 10% !important; height:auto !important;}
    	.imgsize25 {width: 34% !important; height:auto !important;}
	.box50 {width: 88%; min-height:10px; background: #FFFFFF; float: left;}
				}

@media screen and (max-width:500px) {    
	#cuerpo {font-size: 130%;}
	#cuerpo img { width: 95%; height:auto;} 
	#navegador p { margin-top: 1.0em; font-size: 150%;}
	#navegador img {width: 75%; height:auto; }
	#calce {font-size: 0.5em; }
	.bio-foto { width: 95%; } .bio-commentarios { width: 95%; } 
	.fb-comments, .fb-comments span, .fb-comments.fb_iframe_widget span iframe { width: 95% !important;}
	
	.imgsize10 {width: 15% !important; height:auto !important;}
	.imgsize25 {width: 50% !important; height:auto !important;}
	}