/*Este bloque pone todos los estilos a un valor por defecto */
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/* Fin de Reseteo de estilos */

body { font-family:"Comic Sans MS", Arial;
			 font-size:1.2em;/* 1em son 16 pixeles    100%;*/
			 text-align:center;
			 	
				
		   background-color:#FFFFFF; /*FFFFFF; /*8CBFDD; E6E6FA*/	
			/* background-image:url('./img/sombra.png');
			 background-repeat:repeat-y;
			 background-position:top;*/	
		 }

h1 
   { text-align:center;
		 color:#7CaFFF;
		 font-size:2.25em;	
		 font-weight:500;
		 padding:10px 0px;
	 }

h2 
   { 
	 	 text-align:center;
		 color:#7CaFFF;
		 font-size:1.7em;	
		 font-weight:700;
	 }

h3 
   { 
	 	 text-align:center;
		 color:#7caFFF;
		 font-size:1.36em;	
	 }	 	  
	 
h4 
   { 
	 	 text-align:center;
		 color:#7caFFF;
		 font-size:1em;	
	 }	 	  	 

h5 
   { 
	 	 text-align:center;
		 color:#7caFFF;
		 font-size:0.9em;	
	 }
	 	 
p
   {
	 	 margin-top:6px;
	   margin-bottom:6px;
		 text-indent: 20px;
	 }	

ol
   {
	   list-style-type: upper-roman;
		 list-style-position:inside;;
	 }	 

ul
   {
	   list-style-type: square;
		 list-style-position:inside;
	 }	 
	 
hr
   {
	   z-index:1;
	 }	  

div		/*solo para propositos de depuracion */
   {
	 	 /*border-style:solid;
	 	 border-width:1px;	
		 padding:2px;
		 margin:2px;*/ 
	 }

.menu
   { 
     list-style-type:none;
		 float: left;/*esto es para que el tamaņo del container(ul) se ajuste al ancho del contenido (li)*/
		 position:relative; /*se desplaza el borde izquierdo la mitad del tamaņo del padre*/
		 left:50%;
		 padding:0;
		 margin:0;
				
		 /*border-style:solid;
	 	 border-width:3px;
		 border-color:#FF0000;*/
			 }

.menuitem 
   { 
	   float:left; /* se alinean todos los <li> de izquierda a derecha en una sola linea */
		 position:relative; /*se desplaza hacia la izquierda la mitad del tamaņo del padre */
		 right:50%;
   }	
		 
/* codigo para estudiar, parece que tambien funciona para centrar un menu
ul{
list-style-type: none;
padding: 0;
text-align: center;
}
li{
float: left;
/* o usar display: inline-block; *
}	 
*/		 		  

.menu a:link,a:visited 
   { 
	   display:block;
		 
		 font-weight:500;/*bold;*/
		 font-size:0.9em;
		 text-decoration:none;
		 color:#FFFFFF;
		 text-align:center;

		 padding:12px 20px 14px 20px;
		 /*padding-top:5px;*/
		 margin-left:1px;
		 		 
		 background-color:#9CcFFF;/*#0000FF; 8CBFFF*/		 
   }					  

.menu a:hover,a:active 
   { 
	   background-color:#8CBFFF;	 
   }

.resaltado 
   { 
	   font-size:1.1em;
		 font-weight:bold;
		 color:#8CBFFF;   /*990000*/;
   }		 

.fotograma1 
   {
	   position:relative;
		 top:0px;
		 left:0px;
		 opacity:1.0;
		 filter:alpha(opacity=100); /* For IE8 and earlier */
	 }
		
.fotograma 
   {
	   position:absolute;
		 top:0px;
		 left:0px;
		 opacity:0.0;
		 filter:alpha(opacity=0); /* For IE8 and earlier */
	 }
	 						 
#completo 
   { width:800px;				 /*establecemos el ancho del area de trabajo y la centramos */
	 	 /*margin-left:-480px;
		 padding-left:50%;*/
		 margin:0 auto;
	 }

#editable
   {
	 	 text-align:justify;
		 background-color:#ffffff;/*#DAFFDA; #E0FFE0;*/
		 z-index:-2;
	 }	 

#Cabecera
   {
	   position:relative; /* tiene que tener posicion relative para que sus hijos puedan tener posicion absolute */
		 border-width:2px;
		 border-color:#FFFF00;
		 z-index:1;
	 }	 
	 
#cabecera_1
   {
	   width:40%;/*300px;*/
		 /*background-image:url('./img/logoGema_p_g.png');
		 background-repeat:no-repeat;*/

		 border-color:#00FF00;
	 }
	 	
#cabecera_2
   {
	   width:40%;/*300px;*/
		 padding-right:20px;
		 
		 border-color:#FF0000;
	 }
	 
#marcoMenu
   {
     overflow: hidden;
		 
		 border-color:#00ffFF;
	 }	 
#Cuerpo
   {
	   position:relative;
		 color:#666666;
		 z-index:1;
		 padding:10px;
		 
		 line-height: 1.5;
	 }
	 	 
#Pie
   {
	   position:relative;
		 padding:5px;
		 font-size: 120%;
		 text-align:center;
		 color:#CCCCCC;
		 /*background-color:#009900;*/
		 z-index:1;
	 }
	 	 	
/* ALINEACION */	 
.arriba
   {
		 position:absolute;
		 top:0px;	 
	 }	 

.derecha
   {
		 position:absolute;
		 right:0px;
	 }

.izquierda
   {
		 position:absolute;
		 left:0px;
	 }

.centrado_V
	 {
		 position:absolute;
		 top:50%;
	 }
	 	 
.centrado
	 {
	 	 text-align:center;
	 }

.ajustado_der
	 {
	 	 text-align:right;
	 }

/* FORMATO */
.negro
   {
	   color:#000000;
	 }

.arial
   {
	   font-family:arial;
	 }
	 	 	 	 	 	 		 
.fondo
   { 
	   position:fixed;
		 top:15px;
		 left:39%;
		 height:550px;
		 z-index:0;
	 }
	 
#img1
   {
	   position:relative;
	 }
	 
	 
#img2
   {
	   position:absolute;
		 top:0px;
		 left:0px;
	 }