/* Estilos Sismos */
html { width: 100%; height: 100%; }
body { height: 100%; width: 100%; margin: 0px; padding: 0px; background: #DFE6DD;}
h1,h2,h3,h4,h5,h6 {padding: 10px 15px 25px 15px;text-align: center;font-weight: bold;}
h1 { font-size: 32px; }
h2 { font-size: 30px; }
h3 { font-size: 26px; }
h4 { font-size: 22px; }
h5 { font-size: 18px; }
h6 { font-size: 14px; }
#datos{position:fixed;bottom: 20px;left: 0;height: 40px;width: 100%;text-align:center;z-index:1;display: block;}
#datos2{height: 40px;width: 550px;text-align:left;z-index:1;color: #E6F107;margin:0 auto 0 auto;padding: 5px;font-size: 16px;font-weight:bold;background-color: #000000;border: 2px dashed #1B8CE9;}
#PaginaWeb { margin: 0px auto 0px auto; width: 1024px; }
header {margin: 10px auto 0px auto;text-align: center; width: 100%;height: 150px;background-image: url('//cdn.magdalenajalisco.net/img/logos/sismos.gif');background-repeat: no-repeat;background-position: center;}
footer {margin: 10px auto 10px auto;padding: 5px;float: left;width: 100%;min-height: 100px;border: 3px dashed #FF8080;text-align: center;}
#izquierda {margin: 10px auto 0px auto;float: left;width: 195px;min-height: 100px;}

#contenido {
	margin: 10px auto 0px auto;
	float: right;	
	width: 800px;
}


#copy {
	margin: 10px auto 0px auto;
	width: 100%;
	font-size: 14px;
	font-weight: bold;
}

#sismologico {margin: 0px auto 0px auto;width: 700px;height: 500px;}
#sismologicoimg {margin: 0px auto 0px auto;width: 1024px;height: 768px;}
#RedesSociales {margin: 0px auto 10px auto;text-align: center;width: 100%;}

.enlaces {
	margin: 10px auto 20px 150px;
	width: 300px;
	text-align: center;
	font-weight: bold;
	float: left;
}

.enlaces ul {
	text-decoration: none;
	text-indent: 0px;
	display: block;
}

.enlaces li {
	text-decoration: none;
}

.enlaces a {
	color: #808080;
	text-decoration: none;
}

.sismos {
	margin: 5px 10px 5px auto;
	padding: 10px;
	width: 773px;
	border: 3px dashed #FF8080;
	float: right;
	text-align: justify;
}

.titulo {
	margin: 10px auto 0px auto;
	width: 100%;
	font-size: 18px;
	text-align: center;
	font-weight: bold;
}

.descripcion {
	margin: 10px 0px 0px 0px;
	text-align: justify;
	width: 600px;
	float: left;
}

.contenido {
	margin: 10px 0px 0px 0px;
	text-align: justify;
	width: 750px;
	float: left;
}

.ubicar {
	text-decoration: none;
	font-size: 20px;
	font-weight: bold;
	color: #1791D9;
}

.imagen {
	margin: 10px 0px 0px 10px;
	padding: 0px;
	width: 150px;
	float: right;
}

.miniatura {
	width: 140px;
	height: 120px;
}

.publicidad {
	margin: 5px 0px 5px 0px;
	text-align: center;
}

.Contenedor {
	margin: 5px 10px 5px auto;
	padding: 10px;
	width: 773px;
	border: 3px dashed #FF8080;
	float: right;
}

.Contenedor p {
	padding: 10px;
	width: 100%;
	text-align: justify;
}
/* Menu Horizontal */
#Menu-H {
position: relative;
overflow: hidden;
width: 1000px;
height: 30px;
line-height: 30px;
margin: 10px auto;
border-radius: 8px;
background: #025BA3;
}
#Menu-H ul {
  list-style: none;
  text-align: center;
  margin: 0;
  padding: 0;
  font-size: 0;
}
#Menu-H ul li {
display: inline-block;
width: 200px;
box-sizing: border-box;
font-size:18px;
}
#Menu-H ul li a {
  color: #fff;
  text-decoration: none;
}
.marca {
position: absolute;
bottom: 2px;
left: -100px; /* Al menos 1/2 del ancho de cada enlace */
width: 100px; /* 1/2 del ancho de cada enlace */
height: 4px;
background: white;
transition: 0.5s ease-in-out; 
}
#Menu-H ul li:nth-child(1):hover ~ .marca {
left: 50px; /* 1/4 Ancho del enlace */
}
#Menu-H ul li:nth-child(2):hover ~ .marca {
left: 250px; /* 1/4 Ancho del enlace + 1 vez ancho enlace */
}
#Menu-H ul li:nth-child(3):hover ~ .marca {
left: 450px; /* 1/4 Ancho del enlace + 2 veces ancho enlace */
}
#Menu-H ul li:nth-child(4):hover ~ .marca {
left: 650px; /* 1/4 Ancho del enlace + 3 veces ancho enlace */
}
#Menu-H ul li:nth-child(5):hover ~ .marca {
left: 850px; /* 1/4 Ancho del enlace + 3 veces ancho enlace */
}
.tabla01{
	margin: 0px auto 0px auto;
	width: 700px;
	overflow:auto;
	background: transparent;
}

.tabla01 .th{
	margin: 0px auto 0px auto;	
	width: 700px;
	float: left;
	text-align: center;
	font-weight: bold;
	font-size: 16px;
	background: #A3E2ED;
}

.tabla01 .th .height {
	height: 20px;
	padding: 4px;
}

.tabla01 .th .fecha{
	width: 180px;
	float: left;
}

.tabla01 .th .coor{
	width: 110px;
	float: left;
}

.tabla01 .th .mag{
	width: 60px;
	float: left;
}

.tabla01 .th .prof{
	width: 70px;
	float: left;
}

.tabla01 .th .epi{
	width: 240px;
	float: left;
}

.tabla01 .td{
	margin: 0px auto 0px auto;	
	float: left;
	font-size: 14px;
	font-weight: bold;
}

.tabla01 a {
	text-decoration: none;
	font-weight: bold;
	font-size: 14px;
	text-align: left;	
	color: #2A96F8;
}

.tabla01 .c1{
	background: #F8D5D5;
}

.tabla01 .c2{
	background: #F8F8D5;
}

.tabla01 .td .height {
	height: 50px;
	padding: 4px;
}

.tabla01 .td .fecha{
	width: 180px;
	float: left;
}

.tabla01 .td .coor{
	width: 110px;
	float: left;
}

.tabla01 .td .mag{
	width: 60px;
	float: left;
	text-align: center;
}

.tabla01 .td .prof{
	width: 70px;
	float: left;
	text-align: center;
}

.tabla01 .td .epi{
	width: 240px;
	float: left;
	text-align: left;
}

.tabla01 .tf{
	float: left;
	padding: 10px;
	width: 680px;
	min-height: 40px;
	background: #D5F8DF;
}

/* Menu Vertical */
#menuV {
  margin: 0px 0px 10px 0px;
  padding: 0;
  font-family: Verdana, Helvetica, Arial, sans-serif;
  width: 193px;
}

#menuV ul {
  list-style: none;
  text-indent: 0px;
}

#menuV li {
  margin-top: 3px;
}

#menuV a {
  font: 12px Verdana;
  color: #646464;
  display: block;
  padding: 6px 20px;
  height: 20px;
  text-decoration: none;
  background: url('//cdn.magdalenajalisco.net/css/_StylesWeb_/sismos/img/sismos1.gif');
}

#menuV a:hover {
  background: url('//cdn.magdalenajalisco.net/css/_StylesWeb_/sismos/img/sismos2.gif') no-repeat right;
  padding: 6px 40px;
  font-weight: bold;
}

#menuV .titulo a {
  font: 12px Verdana;
  font-weight: bold;
  color: #646464;
  display: block;
  padding: 6px 20px;
  height: 20px;
  text-decoration: none;
  background: url('//cdn.magdalenajalisco.net/css/_StylesWeb_/sismos/img/sismos1.gif');
}
