@charset "utf-8";
/* CSS Document */
/* página de 2 columnas y cabecera con pie */
body {
                background-color: #e8ffff; 
                text-align:center; /* centra la ventana en IE5 */
				margin:0;
				padding:0;
                }
              
#marco {
                border: thin solid #000;
				width: 96%; /* al dar anchura y márgenes auto se centra la ventana */
                margin: 15px auto;
                overflow: hidden; /* recorta y ajusta el pie */
            	text-align: left; /* vuelve a poner el texto como es usual */
				background-color: #fff /* este es el color de fondo */ 
				}
#cabecera {
				margin:0;
				padding:0;
				clear:both;
                float:left; 
                width:100%; /* en todo elemento flotante debe darse la anchura */
                background: #fff;
                border-bottom: 1px solid #fff;
                text-align: center;
				}

.lienzo {
	    			clear:both;
                    float:left; 
                    width:100%;
					overflow:hidden;
					background-color: #fff;
					text-align:left;
	       			}
.principal {
								position:relative;
								width:96%;
                                padding: 2em 0 2em 0;
								margin: 2em auto;
	                			background-color: #ffffda;
								border: 1px solid #000;}

/* ahora viene el pie */
#pie {
        margin: 0 0 -17px 0;
		padding:0 0 17px 0;
		float: left;
		clear: both;
        width:100%;
		border-top: 1px solid #fff;
		background: #2a70a1;
		color:#fff;
    }
	/* barra de navegación */
#barranav {
                float:left;
				clear: both;
                background:#931212;
                margin: 0px;
				text-align: center;
                width: 100%;
                overflow:hidden;
					}
#barranav ul, #barranav ul li {
	       		display: inline;
				list-style:none;
	        	margin:0;
	        	padding:0;
				}

				/* estilos de los hyperlinks */
#barranav ul li a {
	    			float:left;
	    			margin:0;
	    			padding: 0 5px;
	    			text-align:center;
	    			background:#069;
	    			color:#fff;
	    			text-decoration:none;
					border-right: 1px solid #fff;
					}
				
#barranav ul li a:hover {
	    				background: #ffffda;
	   					color: #080484;		
                    	}				
#barranav ul li a.active,
#barranav ul li a.active:hover {
	    				color:#000;
	   					background: #ffffda;
	    				font-weight:bold;
                    			}	
		/* ahora definimos una barra de situación */					
#situador { 	float:left;
				clear: both;
                background:#f38e00;
                margin: 0px;
				width: 100%;
               	border-bottom: 1px solid #fff;
                overflow:hidden;
				color:#000;
				padding-bottom: 2px;
				padding-top: 1px;
				font-size: 85%;
				text-align:left;
				font-weight:600;
				border-bottom: 1px solid #2a70a1;
				}
#situador a { 	color: #fff;
text-decoration:none;
				}
#situador a:visited { color: #fff; }
#situador a:hover {color: #000; }
#situador p {margin:0; padding: 0 0 0 5px; }
		 

/* ajustes de tipografía y efectos */

		body {
                font-family: Verdana, Arial, Helvetica, sans-serif;
                font-size: 80%;
                }
		.imgleft { float: left; }
		.imgright {float: right; }
		a img { border:0; }
		/* .izquierda, .derecha {color: white} */
		#cabecera h1 {padding: 0;
						margin: 10px 0 7px 0; }
		
		#cabecera h2 {
    					margin: 0; 
		 				padding-bottom:5px;
    					}
		#pie p {
    				margin: 0;
    				padding: 2em 0 1em 1em; 
    				}
		.principal p, .principal h2, .principal h1 { padding: 0 10px 10px 10px;}
		/* .centro p, .derecha p, .centro h2 { padding: 0 10px 10px 10px;}
		.izquierda h2 { padding: 0 5px;}
		.izquierda img {position:relative; top:0px; margin: 0 9px; padding-bottom: 10px; }
		.izquierda p { padding: 0px 5px 5px 5px; font-size: 90%;} */
		a, a:link {color: #3a00d4; text-decoration: none; }
		 a:hover {color: #ed6c2e; text-decoration: underline; }
		.principal h3 a {color : #fff; text-decoration: none; } 
		.principal a:link {color: #931212; text-decoration: none; }
		.principal a:link:hover {color: #2a70a1; text-decoration: underline ;} 
		.principal a img {border: 1px solid #f38e00 ;}
		.principal a:hover img {border: 1px solid #2a70a1; }