/*
https://www.canva.com/learn/website-color-schemes/
nº3: PALE GOLD=C0B283  SILK=DCD0C0  PAPER=F4F4F4  CHARCOAL=373737
BODY: background-color:#FFF0E8;
*/
@media screen and (max-width: 480px) {
   /* Aquí van las reglas CSS necesarias */
	body { font-size:56px; }
}

@media screen and (max-width: 9999px) {
body {background-color:#FFF /*FFF9F2 FFF9EE FFF0E8*/; padding:0px 0px; font-family: 'Lora', serif; font-size:14px; line-height:24px; width:100%; margin:60px 0 20px 0px; box-shadow:0px 0px 0px #CCC;}
#container_ppal { padding:5px 10px; line-height:25px; }

.cont_graf { height:420px; width:98%; max-width:720px; margin-top:20px; }

.divmenu {background-color:#534C46; height:36px; margin:0 0 5px 0; padding:6px 0px; box-shadow:0 0px 2px #FFF; white-space:nowrap; }
<!-- MI MENÚ HOVER VERTICAL: MUY SENCILLO PERO FUNCIONA -->
.dropdown { position: relative; display:inline-block; cursor:pointer; padding:10px 0; overflow:hidden;}
.dropdown span, .dropdown a { padding:7px 12px 7px 12px; margin:0; color:#E5E5E5; text-decoration:none;  }
li.dropdown a { color:#337AB7 }
.dropdown span.active, .dropdown a.active { background-color:#333 /*FCFCF0 FFF9CF 333*/; color:#ED9; font-weight:bold; }
.dropdown:hover, .dropdown span:hover, .dropdown a:hover { cursor:pointer; background-color:#F3F3F3; color:#000;  }
.dropdown-content { cursor:auto; left:0px; border:1px solid #CCC;
	display: none; position: absolute; background-color:#F3F3F3; margin:4px 0 0 0;
	box-shadow: -2px 3px 5px 0px rgba(0,0,0,0.2); padding:10px; z-index: 1; }
.dropdown-content a { color:#003399; white-space:nowrap; float:none; padding:2px 5px; }	
.dropdown:hover .dropdown-content { display: block;}
.dropdown:hover .dropdown-content a:hover { text-decoration:none; background:#000; color:#FFF; }

.div_ajax {margin:20px 0; overflow:hidden; display:none;  }
.div_ajax table { background-color:#FFFFFF}
.div_ajax table th { background-color:}

<!-- FORMATEADO DE MIS FORMULARIOS -->
input { text-align:center; }
input.alto_22 {height:22px;} 
input.alto_24 {height:24px;}
input.alto_26 {height:26px;} 
input.ancho_40 {width:40px;} 
input.ancho_60 {width:60px;} 
input.ancho_80 {width:84px;} 
input.ancho_120 {width:120px;}

<!-- MIS TABS-->
div.tabs {  margin:0px 0px; padding:0px 0px; overflow:hidden; width:100%; }
div.tabs span { cursor: pointer; white-space:nowrap; overflow:hidden  }
div.tabs span.tab { border:1px solid #CCC; border-left:none; background-color:#F3Efe5; padding:3px 10px;  white-space:nowrap; overflow:hidden }
div.tabs span.tab:hover { background-color:#FCFCF0}
div.tabs span.tab.active { border-bottom:/*1px solid #FFF0E8*/; background-color:#FFF9CF /*FFF9EE*/; font-weight:bold}

.box {box-shadow:0px 0px 3px #CCC; padding:20px; margin:20px;}

/* 
.boton {padding:3px 7px 3px 7px; margin:0 2px 0 1px; box-shadow:0px 1px 2px #999; background-color:#F3Efe5; cursor:pointer; color:#333; white-space:nowrap; border:1px solid #CCC;}
.boton::after {content: " | "; } 
*/
.boton-big {margin:0 5px; float:left; border-bottom:1px solid #FFF; padding:5px 7px; cursor:pointer; color:#337AB7; white-space:nowrap; }
.boton-big:hover { background-color:#F6F6F3; }
.boton-big.active { background-color:#F6F6F3; /*FCFCF0 FFF9CF FCFCF0*/;  border-bottom:1px solid #CC8800}

.boton {margin:0 2px; padding:3px 5px; cursor:pointer; color:#669; white-space:nowrap; }
.boton:hover { background-color:#F6F6F3;}
.boton.active { background-color:#F6F6F3; /*FCFCF0 FFF9CF FCFCF0*/; border-bottom:1px solid #CC8800}
}


.ocultar { display:none}

a { color:#337AB7; }
a:hover { color:#23527C; }