* { margin: 0px;
padding: 0px; outline: 0;
}
html, body { margin: 0px;
padding: 0px;
width: 100%;
height: 100%;
}
body { background: #000 url(../img/fondo_rayas.png) repeat right top;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
#contenedor { margin: 0px auto;
background: #000 url(../img/tierra2.jpg) no-repeat right top;
height: 620px;
width: 62.7em;
border-bottom: 1px solid #fff;
}
h1 { font-family: Verdana;
font-size: 1.7em;
margin-left: 20px;
padding-top: 20px;
color: #EDED00;
}
h1 em { font-style: normal;
font-weight: bold;
color: #FF7519;
margin-left: 50px;
font-size: 3.2em;
}
#texto { position: relative;
float: right;
width: 400px;
margin: 72px 20px 0px 0px!important;
margin-right: 10px;
}
h2, #sombra { font-weight: bold;
color: #000;
background-color: transparent;
font-size: 3em;
}
#sombra { position: absolute;
left: 2px;
color: #B6B6B6;
top: 2px;
}
#menu { margin: 30px 0px 0px 46px;
width: 490px;
}
ul { list-style-type: none;
margin-top: 0px!important;
margin-top: -10px;
}
ul#lateral li a { border: 1px solid #000;
text-decoration: none;
font-size: 0.8em;
font-weight: bold;
display: block;
margin-top: 9px;
color: #f80;
height: 67px;
}
ul#lateral li a:hover, ul#lateral li a:focus, ul#lateral li a:active {border: 1px solid #ED5E00;
}
ul#lateral li a img { border: 1px solid #ED5E00;
float: left;
width: 90px;
height: 67px;
margin: -1px 10px 0px -1px;
}
ul#lateral li a span.subtitulo { font-weight: normal;
color: #FFFCAD;
}
span.cuadro { position: absolute;
left: 529px;
width: 415px;
height: 395px;
background: url(../img/recorte2.jpg) no-repeat left top;
display: none;
}
ul#lateral a:focus, a:active {position: relative;
}
ul#lateral a:focus span.cuadro, a:active span.cuadro {display: block;}
.huracanes {top: 1px;}
.incendios {top: -77px;}
.inundaciones {top: -155px;}
.volcanes {top: -233px;}
.terremotos {top: -311px;}

span.cuadro em { font-style: normal;
font-weight: bold;
font-size: 1.4em;
display: block;
margin: 8px 14px 0px 12px;
color: #702400;
border-bottom: ridge 1px #999;
padding-bottom: 0px;
}
span.info { font-weight: normal;
margin: 14px 15px 0px;
display: block;
color: #300;
text-indent: 20px;
text-align: justify;
}
span.fuente {font-size: 0.7em;
color: #333;
text-align: right;
display: block;
margin: 2px 15px 16px 0px;
font-weight: normal;
background-color: transparent;
}
span.fotos { 
margin: 14px 14px 8px 12px;
float: right;
width: 140px;
height: 104px;
}
#huracanes {background-image: url(../img/huracanes.jpg);}
#incendios {background-image: url(../img/incendios.jpg);}
#inundaciones {background-image: url(../img/inundaciones.jpg);}
#volcanes {background-image: url(../img/volcanes.jpg);}
#terremotos {background-image: url(../img/terremotos.jpg);}

#pie {  text-align: center;
font-size: 0.7em;
height: 2.2em;
width: 720px;
margin: -1px auto;
background-color: #333;
padding-top: 10px;
border: 1px solid #fff;
border-top: solid 1px #000;
}
#pie ul { background-color: transparent;
list-style-type: none;margin-top: 10px;
}
#pie ul li {  display: inline;
color: #fff;
}
#pie ul li a { padding: 0px 4px;
text-decoration: none;
color: #fff;
}
#pie ul li a:hover, #pie ul li a:focus, #pie ul li a:active { text-decoration: underline;
}