/*** ***/
table, th, td {
  border: 1px solid black;
  border-collapse: collapse;
  padding: 4px;
	margin-bottom: 10px;
}

*{margin: 0; padding: 0; margin-bottom: 10px; }

body {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1rem; /* Utiliza rem para que el tamaño sea relativo y adaptable */
    max-width: 980px; /* Máximo de 980px, pero no fija el ancho */
    margin: 0 auto; /* Centra el contenido horizontalmente */
    padding: 0 15px; /* Añade un padding para mejorar el margen en dispositivos pequeños */
    box-sizing: border-box;
}

/* Estilos responsive */
@media (max-width: 1200px) {
    body {
        font-size: 0.95rem; /* Ajuste de tamaño de fuente en pantallas más pequeñas */
    }
}

@media (max-width: 768px) {
    body {
        font-size: 0.9rem; /* Disminuye el tamaño de la fuente en tablets */
        padding: 0 10px; /* Reduce el padding lateral */
    }
}

@media (max-width: 480px) {
    body {
        font-size: 0.85rem; /* Fuente más pequeña para pantallas muy pequeñas */
        padding: 0 5px; /* Reduce aún más el padding */
        width: 100%; /* Ancho completo en móviles */
    }
}


nav {margin:0; padding: 0;}

.menu{list-style:none; border:1px solid #c0c0c0; float:left;}

.menu li{position:relative; float:left; border-right:1px solid #c0c0c0;  margin-bottom: 0px; }

.menu li a{color:#333; text-decoration:none; padding:5px 10px; display:block;  margin-bottom: 0px;}

.menu li a:hover{background:#333; color:#fff; -moz-box-shadow:0 3px 10px 0 #CCC; -webkit-box-shadow:0 3px 10px 0 #ccc; text-shadow:0px 0px 5px #fff;  margin-bottom: 0px;}

.menu li   ul{position:absolute; top:25px; left:0; background-color:#fff; display:none;  margin-bottom: 0px;}

.menu li:hover ul, .menu li.over ul{display:block;  margin-bottom: 0px;}

.menu li ul li{border:1px solid #c0c0c0; display:block; width:150px;  margin-bottom: 0px;}