body { font: 1em/140% Arial, Helvetica, sans-serif; margin: 0px auto; }
.input { font-family: arial; font-size: 16px; color: #000000; }
img { border: 0px; }
a:link { text-decoration: none; color:#000000; }
a:visited { text-decoration: none; color:#000000; }
a:active { text-decoration: none; color:#000000; }
a:hover { color: #ff6600; }

.galeria { margin: 3px 0px 4px 3px; background-color: #e9edfe; padding: 10px; width: 204px; height: 200px; vertical-align: top; border: 1px solid #eeeeee; -webkit-border-radius: 8; -moz-border-radius: 8; border-radius: 8px; display: inline-block; }
.galeria:hover { background-color: #646775; color: #ffffff; }
.galeria img { border: 3px solid #aaaaaa; }

.bordepubli { overflow: hidden; text-align: center; padding-top: 5px; padding-bottom: 5px; -webkit-border-radius: 6px; -o-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; background-color: #fff; box-shadow: 0px 0px 20px 8px #fff; -moz-box-shadow: 0px 0px 20px 8px #fff; -webkit-box-shadow: 0px 0px 20px 8px #fff; -o-box-shadow: 0px 0px 20px 8px #fff; -ms-box-shadow: 0px 0px 20px 8px #fff; }

.blanco:hover { color: #ffffff; }

.highlightit img { filter:progid:DXImageTransform.Microsoft.Alpha(opacity=75); -moz-opacity: 0.75; opacity: 0.75; }
.highlightit:hover { background-color:transparent; color:#FF6600 }
.highlightit:hover img { filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100); -moz-opacity: 1; opacity: 1; }

.exponsor { padding: 8px; margin: 2px; font-size: 16px; text-align: left; font-weight: bold; background-color: #e5e5e5; -webkit-border-radius: 4; -moz-border-radius: 4; border-radius: 4px; display: inline-block; }
.exponsor:hover { background-color: #f1ab41; color: #ffffff; }


h1 { font: bold 20px/100% Arial, Helvetica, sans-serif; margin: 0px; letter-spacing: 2px; text-shadow: 4px 1px 5px #aaa; }
h2 { font: bold 20px/100% Arial, Helvetica, sans-serif; margin: 0px; text-shadow: 4px 1px 5px #aaa; }
h3 { font: bold 17px Arial, Helvetica, sans-serif; color: #62667B; margin: 0px; padding-bottom: 6px; text-shadow: 4px 4px 8px #999; }

/* Estructura */
#logocorto { display: none; }
#pagina { background: url('http://josecabello.com/fondo.gif') center no-repeat fixed; width: 960px; margin: 0px auto; }
#cabecera { height: auto; margin: 0px auto; }
#contenido { width: 930px; }
/* #pie { background: url('http://josecabello.com/fondo.gif') center no-repeat fixed; } */
#sitiosamigos { width: 230px; float: right; }

/* MEDIA QUERIES */
/* para 980px o menos */
@media screen and (max-width: 980px) { 
#pagina { width: 100%; }
#contenido { width: auto; }
}

/* para 890px o menos */
@media screen and (max-width: 890px) { 
#desaparecerpubli { display: none !important; }
}

/* para 750px o menos */
@media screen and (max-width: 750px) { 
#ampliar2 { text-align: center !important; width: 100% !important; }
}

/* para 700px o menos */
@media screen and (max-width: 700px) { 
#cabecera { height: auto; }
#contenido { width: auto; }
#sitiosamigos { width: 100%; }
#ensanchar2 { width: 100%; }
#desaparecer2 { display: none; }
}

/* para 480px o menos */
@media screen and (max-width: 580px) {
#logocorto { display: block; }
#cabecera { height: auto; }
#ensanchar { text-align: center !important; width: 100% !important; }
#desaparecer { visibility: hidden; display: none; }
/* #desaparecer { display: none; } */
h1 { font-size: 18px; padding-top: 5px; padding-bottom: 3px; }
h2 { font-size: 16px; padding-bottom: 5px; }
}

/* Bordes y otros */
#contenido { background: transparent; margin-left: 20px; margin-right: 20px; }
#cabecera { padding-left: 1%; padding-right: 1%; padding-top: 4px; margin: 0px; }
#contenido { padding-left: 5px; padding-right: 5px; }
/* #contenido { padding-left: 22px; padding-right: 20px; margin: 0px; } */
/* #pagina, #cabecera, #contenido, #pie { border: solid 0px #ccc; } */

.nav { font-weight: bold; padding: 3px 7px 3px 7px; letter-spacing: 1px; background-color: #dfdfdf; border: 1px solid #cccccc; -webkit-border-radius: 4; -moz-border-radius: 4; border-radius: 4px; display: inline-block; }
.nav:hover { background-color: #ff6600; color: #ffffff; }

.nav2 { font-weight: bold; margin-bottom: 4px; padding: 3px 7px 3px 7px; background-color: #d8dae2; border: 1px solid #cccccc; -webkit-border-radius: 4; -moz-border-radius: 4; border-radius: 4px; display: inline-block; }
.nav2:hover { background-color: #ff6600; color: #ffffff; }

@-webkit-keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@-moz-keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }

.aparecer { -webkit-border-radius: 6; -moz-border-radius: 6; border-radius: 6px; -webkit-animation: fadeIn ease-in 1; -moz-animation: fadeIn ease-in 1; animation: fadeIn ease-in 1; -webkit-animation-fill-mode: forwards; -moz-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-animation-duration: 0.7s; -moz-animation-duration: 0.7s; animation-duration: 0.7s; }