<!-- oculto -->
	
     .oculto{display:none;
   position: absolute;
	margin: 0 auto; /*centrar web*/
   padding: 0;
	background-color:#ffffff; /*#cccccc;*/
	width:33%;
	/*ie y todos-->*/
	width:expression(document.body.clientWidth > 500? "500px": "auto" );
    max-width:500px;
	/*ie y todos-->*/
	height: 40%;
	/*min-height:300px;*/
	top:25%;
	left:43%;
   font:Verdana, Geneva, sans-serif;
	color:#000000;
	font-size: 1.0em;
	font-style:italic;
	font-weight:normal;
	z-index:3;
   }
   
   .base{display: block;
   position: absolute;
	margin: 0 auto; /*centrar web*/
   padding: 0;
	background-color: transparente; #cccccc; /*#cccccc;*/
	width:33%;
	max-width:800px;
	height: 40%;
	min-height:300px;
	top:40%;
	left:43%;
   font:Verdana, Geneva, sans-serif;
	color:#000000;
	font-size: 1.0em;
	font-style:italic;
	font-weight:normal;
	z-index:3;
   }
   
	    <!-- oculto -->

	body{
	background-image:url(fondos_web/fondo_varios.png);
	/*background-repeat:repeat-y;*/
	width:99%;
	}
	body{
	CURSOR: url(cursor/laclave4.cur),default;
	background-color: #F9F9F9;
  }
  a{
  CURSOR: url(cursor/negro2.cur),default;
  }
	#cajatotal{
	margin: 0 auto; /*centrar web*/
    padding: 0;
	background-color:#ffffff;
	width:80%;
	/*ie y todos-->*/
	width:expression(document.body.clientWidth > 800? "800px": "auto" );
    max-width:800px;
	/*ie y todos-->*/
	height: 80%;
	min-height:600px;
	top:30%;
    font:Verdana, Geneva, sans-serif;
	color:#000000;
	font-size: 0.9em;
	font-style:normal;
	font-weight:normal;
	z-index:3;
	CURSOR: url(cursor/laclave4.cur),default;
	background-color: #F9F9F9;
   }
   
   #cabecera{
   position: absolute;
   width:80%;
   max-width:800px;
   height:10%;
   min-height:150px;
   background-image:url(fondos_web/rojo_negro.jpg);
	background-repeat:repeat-y;
   font:Verdana, Geneva, sans-serif;
   font-size: 1.6em;
   font-style:italic;
   font-weight:bold;
   color:#ffffff;
   text-align:center;
   top:0%;
   z-index:3;
   }
   
   #titulo{
   position: absolute;
   text-align:center;
   top:16%;
  /*left:60%;*/
   background-color:transparent; /*#ff6600;*/
   width:100%;
   min-width:200px;
   height:5%;
   min-height:50px;
   font-family: Verdana;
   color:#ffff00;
   font-size: 1.6em;
   font-weight: bold;
   z-index:3;
   }
   #titulo:hover{
   font-family: Verdana;
   color:#000000;   
	   }
   #subtitulo{
   position: absolute;
   text-align:center;
   top:65%;
  /*left:60%;*/
   background-color:transparent; /*#ff6600;*/
   width:80%;
   min-width:200px;
   height:5%;
   min-height:50px;
   font-family: Verdana;
   color:#ffff00; /*#DCDCDC;*/
   font-size: 0.9em;
   font-weight: bold;
   z-index:3;
   }
   /**********************************************/
   #logo{
   position: absolute;
   top: 22%;
   left:3%;
   width:80%;
   min-width: 80px;
	max-width:100px;
   height:80%; 
   min-height: 80px;
	max-height:100px;
   background-color:transparent;
   z-index:3;
   /*transicion*/
   -webkit-transition: all .6s ease-in-out; /* safari - Chrome*/ 
  -moz-transition: all .6s ease-in-out; /* Firefox */ 
  -o-transition: all .6s ease-in-out; /* Opera */ 
   transition: all .6s ease-in-out;
   }
   
   #logo:hover{
   position: absolute;
   top: 22%;
   left:3%;
   width:80%;
   min-width: 80px;
	max-width:100px;
   height:80%; 
   min-height: 80px;
	max-height:100px;
   background-color:transparent;
   z-index:3;
   /*transicion*/
   -webkit-transform: rotate(360deg); /* safari - Chrome*/
   -moz-transform: rotate(360deg); /* Firefox */
   -o-transform: rotate(360deg); /* Opera */
    transform: rotate(360deg); 
   }
   /********************************/
   #buscador{
   position: absolute;
   top: 52%;
   right:6%;
   width:25%;
   height:24%;
   background-color:transparent;
   z-index:999;
   }
   
   #menunav {
	position:absolute;
	margin: 0 auto; 
	top: 100%;
	left: 0%;
	right: 17%;
	width: 100%;
	max-width: 1024px;
	background-image:url(fondos_web/rojo_negro.jpg);
	background-repeat:repeat-y;
	border-top-width: 6px;
	border-bottom:6px solid #A85400;
	font:Verdana, Geneva, sans-serif;
	font-size: 0.6em;
	font-weight:bold;
	color:#ffffff;
	text-align:center;
	word-spacing: 0.6em; /*separación*/
	display:block;
	z-index: 999;
   } 

   #pie{
   position: absolute;
   background-image:url(fondos_web/rojo_negro.jpg);
	background-repeat:repeat-y;
   width: 80%;
   max-width: 800px;
   height:auto;
   min-height:20px;
   font:Verdana, Geneva, sans-serif;
   font-size: 0.9em;
   font-style:normal;
   font-weight:bold;
   color:#ffff00;
   text-align:center;
   clear: both; /**/
   bottom: 0 !importante;/**/
   z-index:3;
   }
   
    #dondestamos{
   display:block;
   position: absolute;
	margin: 0 auto; /*centrar web*/
   padding: 0;
	background-color:#ffffff; /*#cccccc;*/
	width:33%;
	max-width:400px;
	height: 40%;
	min-height:300px;
	top:25%;
	left:43%;
   font:Verdana, Geneva, sans-serif;
	color:#000000;
	font-size: 1.0em;
	font-style:italic;
	font-weight:normal;
	z-index:3;
   } 
    #redes{
   display:block;
   position: absolute;
	margin: 0 auto; /*centrar web*/
   padding: 0;
	background-color:#ffff00; /*#cccccc;*/
	width:6%;
	min-width:80px;
	max-width:200px;
	height: 4%;
	min-height:60px;
	top:80%;
	left:43%;
   font:Verdana, Geneva, sans-serif;
	color:#000000;
	font-size: 1.0em;
	font-style:italic;
	font-weight:normal;
	z-index:3;
   }
   .emula{ color:#0E54F1; font-size: 1.0em; font-weight:bold;text-decoration:underline; CURSOR: url(cursor/negro2.cur),default; }
   .emula:hover{color:#ff0000; text-decoration:underline; CURSOR: url(cursor/negro2.cur),default; text-transform:uppercase;}
   <!------------------ xxxxxxxxxxxxxxxx -------------------->
   .navlink {color:#ffffff; text-decoration:none;}
   .navlink:link {color: #ffffff; font: normal; text-decoration:none;}
   .navlink:visited {color: #ffffff; font: normal; text-decoration:none;}
   .navlink:active {color: #B31500; font: bold; text-decoration: none;}
   .navlink:hover {color: #ffffff; font: bold; text-decoration: none; background-color:transparent;  border-top:6px solid transparent; border-bottom:6px solid #ffff00; }
   
   <!------------------ xxxxxxxxxxxxxxxx -------------------->
    a {color:#000000; 
    text-decoration:underline;
    background-color:#000000;}
    
    a:link {
    font-size: 1.0em;
	 color: #0E54F1;
	 font-weight:bold;
	 background-color: transparent; /*#ffff00;*/
	}
	 a:hover{
	 position:relative; /*desplazar si hover*/
     top: -3px; /*desplazar si hover*/
	 font-size: 1.0em;
	 font-weight:bold;
	 color: #ff6600;
	 font-weight:bold;
	 background-color:transparent; /*#007CFF;*/
	  }
	 a:visited {
	 font-size: 1.0em;
	 font-weight:bold;
	 color: #4285F4; /*#ff0000;*/
	 font-weight:bold;
	 background-color: transparent;
	 text-transform:uppercase;
	 }
		<!------------------xxxxxxxxxxxxxx------------------->
	.tel{
   font:Verdana, Geneva, sans-serif;
   font-size: 0.9em;
   font-style:normal;
   font-weight:bold;
   color:#ffff00;
}
	 <!------------------xxxxxxxxxxxxxx------------------->
	.desplegar{
	 font-size: 1.0em;
	 font-weight:bold;
	 color: #ff6600;
	 font-weight:bold;
	 background-color:transparent; /*#007CFF;*/
	 cursor:help;
		}
	.desplegar:hover{
	 font-size: 1.0em;
	 font-weight:bold;
	 color: #000000;
	 background-color:transparent; /*#007CFF;*/
		}
     
     #formato{
   position: absolute;
   margin: 0 auto; /*centrar web*/
   text-align:center;
   top:0%;
  /*left:60%;*/
   background-color:#ffff00; /*#ff6600;*/
   width:100%;
   min-width:200px;
   height:100%;
   min-height:100%;
   font-family: Verdana;
   color:#ffff00;
   font-size: 1.0em;
   font-weight: bold;
   z-index:3;
   }
   /*---*/
   .borderedondoimg {
    background-color: #ff0000;
    height: 30%;
    width: 30%;
	padding: 10px;
 /*para Firefox*/
   -moz-border-radius: 15px 15px 15px 15px; /*arriba izda -arriba derecha- abajoderecha -abajo izda-  */
 /*para Safari y Chrome*/
 
  -webkit-border-radius: 15px 15px 15px 15px; /*arriba izda -arriba derecha- abajoderecha -abajo izda-  */
 /*para IE */
   behavior:url(border-radius.htc);
 /* para Opera */
    border-radius: 15px 15px 15px 15px;   /*arriba izda -arriba derecha- abajoderecha -abajo izda-  */
   opacity:0.4;
   filter:alpha(opacity=40); /*  Para IE8 y anteriores */
	}
	.borderedondoimg:hover {
   background-color: #ff0000;
    height: 30%;
    width: 30%;
	padding: 10px;
 /*para Firefox*/
   -moz-border-radius: 95px 15px 95px 15px; /*arriba izda -arriba derecha- abajoderecha -abajo izda-  */
 /*para Safari y Chrome*/
   -webkit-border-radius: 95px 15px 95px 15px; /*arriba izda -arriba derecha- abajoderecha -abajo izda-  */
 /*para IE */
   behavior:url(border-radius.htc);
 /* para Opera */
    border-radius: 95px 15px 95px 15px;  /*arriba izda -arriba derecha- abajoderecha -abajo izda-  */
	opacity:1.0;
    filter:alpha(opacity=100); /* Para IE8 y anteriores */
	<!--      -->
	/*transiciones, quitar si no quieres retardo en la transición*/
	 -moz-transition: opacity 2s;
    -webkit-transition: opacity 2s;
    -o-transition: opacity 2s;
    transition: opacity 2s;
    opacity: 1;
    /* agreamos el filtro para que en IE8 funcione aunque no sea animado */
    filter:alpha(opacity=100);
	}
	
	 /*---*/
       /*============================== xxxxxxxxxxxxxxxx ============================== */
                     /* 320x480  Smartphones (portrait) */
                    
      @media only screen and (min-width : 320px)  and (max-width : 480px) {
      #cajatotal{
	   background-color: #ffffff; 
	   font-size: 0.8em;
	   font-weight:normal;
	   width:100%;
		  }
      #cabecera{
      position: absolute;
      width:98%;
      }
      #titulo {
      top:3%;
	   left: 2%;
	   font-size: 0.8em;
	    } 
	    
	   #logo {
      top:27%;
	   left: 20%;
	   width: 53%;
	   min-width: 80px;
	   max-width:100px;
	   height: 50%;
	   min-height: 80px;
	   max-height:100px;
	    }
	   #buscador {
	   top:60%;
	   right: 75%;
	   width: 9%;
	    } 
	    
	   #menunav {
		text-align:center;
	   word-spacing: 0.6em;
	   font-size: 0.5em;
	   line-height: 2.0em; /*espacio entre líneas*/
       } 
      .oculto{display:none;
       top:50%;
       width:57%;
       height: 100%;
       background-color: #ffffff;
       }
       
       #dondestamos{
	    width:6%;
	    max-width:250px;
	    height: 25%;
	    min-height:200px;
	    top:40%;
	    left:5%;
       } 
       #redes{
	   background-color:transparent;
	   width:35%;
	   min-width:80px;
	   max-width:300px;
	   height: 4%;
	   min-height:35px;
	   top:140%;
	   left:33%;
      } 
       #central{
	   font-size: 0.9em;
		   }
		   
		 #pie{
		width:90%;
			 }  
       }
	   /*----------------------------------------*/
	   /*para 480x320*/ (Smartphones landscape)
	   @media screen and (min-width: 480px) and (max-width: 599px) {
	   #cajatotal{
	   background-color: #B7B400; /*verde-oliva*/
		  }
	   #logo {
	   top:80%;
	   left: 2%;
	   width: 23%;
	   min-width: 80px;
	   max-width:100px;
	   height: 50%;
	   min-height: 80px;
	   max-height:100px;
	    }
	   #titulo {
      top:3%;
	   left: 2%;
	   font-size: 0.8em;
	    } 
	   #subtitulo{
	   top: 50%;
	   left: 8%;
	   font-size: 1.0em;
	   }
	   
		 #menunav {
		line-height: 2.0em; /*espacio entre líneas*/
		 }
		 .oculto{
		 top:40%;
       height:50%;
       }
       #dondestamos{
	    width:6%;
	    max-width:250px;
	    height: 25%;
	    min-height:200px;
	    top:30%;
	    left:10%;
       } 
       #redes{
	   background-color:transparent;
	   width:18%;
	   min-width:80px;
	   max-width:300px;
	   height: 4%;
	   min-height:35px;
	   top:90%;
	   left:33%;
      } 
		  }
	  
	    /*----------------------------------------*/
	    /* Para 600x800  */
	    @media screen and (min-width: 580px) and (max-width: 798px){
	  #cajatotal{
	   background-color:#ffffff;
		  }
	  #titulo {
	   left: 19%;
	   width: 58%;
	   max-width:600px;
	   min-width:200px;
	   font-size: 1.5em;
	    } 
	  #subtitulo{
	   left: 5%;
	   }
	  #logo {
	   top: 40%;
	   left: 1%;
	   width: 30%;
	   min-width: 120px;
	   max-width:100px;
	   height: 50%;
	   min-height: 80px;
	   max-height:100px;
	    }
	 
		#menunav {
		text-align:center;
	   word-spacing: 0.8em;<!-- separación -->
	   font-size: 0.1em;
	   line-height: 2.0em;
       } 
        .oculto{
       height:40%;
       }
       #redes{
	   background-color:transparent;
	   width:18%;
	   min-width:80px;
	   max-width:300px;
	   height: 4%;
	   min-height:35px;
	   top:70%;
	   left:33%;
      } 
	    }
	     
	     
	    /*----------------------------------------*/
	    /* para 768x795*/
	  	@media screen and (min-width: 768px) and (max-width: 795px){
	   #cajatotal{
	   background-color:#ffffff;
	   font-family:Verdana;
	   color:#000000;
		  }
	  #titulo {
	   left: 19%;
	   width: 58%;
	   max-width:600px;
	   min-width:200px;
	   font-size: 1.2em;
	    } 
	  #logo {
	   top: 40%;
	   left: 1%;
	   width: 30%;
	   min-width: 80px;
	   max-width:100px;
	   height: 50%;
	   min-height: 80px;
	   max-height:100px;
	    }
	  #buscador {
	  width:35%;
	  right: 17%;
	    } 
	  #menunav {
	  text-align:center;
	  font-size: 0.6em;
	  word-spacing: 0.6em; 
      } 
      
      #dondestamos{
	   width:6%;
	   max-width:250px;
	   height: 25%;
	   min-height:200px;
	   top:30%;
	   left:10%;
       } 
       .oculto{
       height:40%;
       }
        #redes{
	   background-color:transparent;
	   width:12%;
	   min-width:80px;
	   max-width:300px;
	   height: 4%;
	   min-height:35px;
	   top:70%;
	   left:33%;
      } 
       }
      /*----------------------------------------*/
	       /* Para 800px */  
       @media screen and (min-width: 800px) and (max-width: 1024px)  {  
	
	   #cajatotal{
	   background-color:#ffffff; 
	   font-family:Verdana;
	   color:#000000;
		  }
	  #titulo {
	   top:20%;
	   left: 29%;
	   width: 58%;
	   max-width:600px;
	   min-width:200px;
	   font-size: 1.6em;
	    } 
	  #logo {
      top:27%;
	   left: 20%;
	   width: 33%;
	   min-width: 80px;
	   max-width:100px;
	   height: 50%;
	   min-height: 80px;
	   max-height:100px;
	    }
	  #buscador {
	  width:35%;
	  right: 22%;
	    } 
	    #menunav {
	  font-size: 0.7em;
      } 
      .oculto{
       height:50%;
	   width:20%;
	   max-width:400;
       }
       #redes{
	   background-color:transparent;
	   width:12%;
	   min-width:80px;
	   max-width:300px;
	   height: 4%;
	   min-height:35px;
	   top:86%;
	   left:33%;
      } 
	  }
	  
	  
	       /*----------------------------------------*/
	       /*Para 1024x*/
	   @media screen and (min-width: 1024px)  {  
	
	   #cajatotal{
	   background-color:#ffffff; 
	   font-family:Verdana;
	   color:#000000;
		  }
	  #titulo {
	   left: 29%;
	   width: 58%;
	   max-width:600px;
	   min-width:200px;
	   font-size: 1.6em;
	    } 
	  #logo {
	   top: 45%;
	   left: 1%;
	   width: 30%;
	   min-width: 80px;
	   max-width:150px;
	   height: 50%;
	   min-height: 80px;
	   max-height:100px;
	    }
	  #buscador {
	  width:35%;
	  right: 17%;
	    } 
	    #menunav {
	  font-size: 0.7em;
      } 
     .oculto{
       width:14%;
	   max-width:400px;
		}
	  
      #redes{
	   background-color:transparent;
	   width:12%;
	   min-width:80px;
	   max-width:300px;
	   height: 6%;
	   min-height:35px;
	   top:85%;
	   left:45%;
      } 
	   }
	     /*----------------------------------------*/