/* -- Web diseñada y maquetada por: http://elufo.com -- */

body{ background-color: #470000; margin: 0; padding: 0; font-family: Arial, Helvetica, sans-serif; font-size: .7em; color: white; }
#lienzo{ border: 2px solid #ffb400; width: 990px; height: 580px; margin: 60px auto 10px auto; background: #a4141e url(img/lienzofondo.jpg) no-repeat bottom right; position: relative; }
#logo{ width: 184px; padding: 0 0 0 23px; float: left; }
#contenido{ margin: 0; float: right; width: 781px; height: 580px; padding: 0 0 0 2px; }

/* -- menu -- */
#menu{ background: #5d040a url(img/menufondo.gif) no-repeat left; height: 28px; margin: 59px 0 15px 0; padding: 0 0 0 25px; list-style: none; }
#menu li{ display: inline; height: 28px; }
#menu li a{ height: 28px; display: block; float: left; margin: 0 21px 0 0; text-indent: -9999px; outline: none; }
#menu li a:hover{ background: none !important; }

#menu li #ahnews{ width: 78px; background: url(img/ahnews.gif) no-repeat left; }
#menu li #ahprojects{ width: 127px; background: url(img/ahprojects.gif) no-repeat left; }
#menu li #ahsubphono{ width: 140px; background: url(img/ahsubphono.gif) no-repeat left; }
#menu li #ahcontact{ width: 123px; background: url(img/ahcontact.gif) no-repeat left; }
#menu li #ahnewsletter{ width: 175px; margin: 0; background: url(img/ahnewsletter.gif) no-repeat left; }

#contenido.news #menu li #ahnews,
#contenido.projects #menu li #ahprojects,
#contenido.subphono #menu li #ahsubphono,
#contenido.contact #menu li #ahcontact,
#contenido.newsletter #menu li #ahnewsletter{ background: none !important; cursor: default; }


/* -- newsletter -- */
#newsletter{ width: 990px; height: 580px; top: 0; right: 0; position: absolute; background: url(img/newsletterfondotrans.png); display: none;}
#newsletter.visible{ display: block; }
#newsletter.oculto{ display: none; }
#newsletter.visible #conMensaje.visible #msjNews{ display: block; }
#newsletter.visible #conMensaje.visible #frmNews{ display: none; }
#newsletter.visible #conMensaje.oculto #msjNews{ display: none; }
#newsletter.visible #conMensaje.oculto #frmNews{ display: block; }
#newsletter .caja{ border: 2px solid #FFB400; background-color: #A4141E; margin: 210px auto 0 auto; width: 350px; }
#newsletter .caja .cabecera{ text-align: right; background-color: #5D040A; margin: 0 0 10px 0; padding: 2px; }
#newsletter .caja .cabecera a{ padding: 0 2px; }
#newsletter .caja .cabecera a img{ border: 0; }
#newsletter .caja p{ margin: 0 0 10px 0; text-align: center; font-weight: bold; }
#newsletter .caja form{ margin: 20px 0 10px 0; }
#newsletter .caja form label{ margin: 0 5px 0 0; padding: 2px 0 0 0; }
#newsletter .caja form select{ font-family: Arial, Helvetica, sans-serif; font-size: 1em; border: 0; font-weight: normal; }
#newsletter .caja form input{ font-family: Arial, Helvetica, sans-serif; font-size: 1em; border: 0; padding: 0 3px; font-weight: normal; }
#newsletter .caja form input#subscribe,
#newsletter .caja form input#unsubscribe{ width: 12px; height: 12px; margin-right: 20px; vertical-align: top; }
#newsletter .caja form input.boton{ margin: 10px 0 0 0px; background-color: #FFB400; font-weight: bold; width: 100px; }


/* -- barra de iconos -- */
#bloquelist{ margin: 0; padding: 0; list-style: none; height: 130px; }
#bloquelist li{ display: block; float: left; height: 130px; width: 100px; margin: 0; padding: 0 0 0 10px; overflow: hidden; }
#bloquelist li a{ font-size: .9em; color: white; text-decoration: none; }
#bloquelist li a img{ border: 1px solid #FFB400; display: block; margin: 0 0 3px 0; width: 65px; height: 65px; }
#bloquelist li a:hover{ text-decoration: underline; }
#bloquelist li a:hover img{ border-color: white; }
#bloquelist li a.current{ text-decoration: underline; cursor: default;  }
#bloquelist li a.current img{ border-color: white; cursor: default; }

/* -- paginación -- */
#paginacion{ background: url(img/paginacionfondo.gif) no-repeat left; height: 23px; margin: 0 2px 30px 0; padding: 0 15px; }
#paginacion a{ display: block; height: 23px; text-indent: -9999px; }
#paginacion a:hover{ background: none !important; }
#paginacion a#ahanterior{ float: left; background: url(img/ahanterior.gif) no-repeat left; width: 94px; outline: none; }
#paginacion a#ahsiguiente{ float: right; background: url(img/ahsiguiente.gif) no-repeat right; width: 59px; outline: none; }

/* -- ficha general -- */
#ficha{	padding: 0 70px; }
#ficha #col1{ width: 174px; float: left; margin: 0 10px 0 0; }
#ficha #col1 img{ border: 1px solid #FFB400; margin: 0 0 10px 0; width: 172px; height: 172px; }
#ficha #col1 #muestras{ background-color: #470000; padding: 5px 10px; font-weight: bold; border: 1px solid #FFB400; }
#ficha #col1 #muestras ul{ margin: 5px 0 5px 0; padding: 0; list-style: none; }
#ficha #col1 #muestras ul li{ margin: 0 0 3px 0; }
#ficha #col1 #muestras ul a{ color: #FFB400; background: url(img/mp3icon.gif) no-repeat 0 3px; padding: 0 0 0 14px; }
#ficha #col1 #muestras ul a:hover{ color: white; }

#ficha #col2{ height: 262px; padding: 0 10px 10px 0; width: 444px; overflow: auto; text-align: justify; }
#ficha #col2 h1{ font-size: 1.1em; color: #FFB400; margin: 0 0 20px 0; }
#ficha #col2 p{ margin: 0 0 10px 0; }
#ficha #col2 p a{ color: #FFB400; font-weight: bold; text-decoration: none; }

#ficha #col2 p.enlacerel{ padding: 5px; margin: 5px 0 0 0; }
#ficha #col2 p.enlacerel a{ text-decoration: underline; padding: 0 0 0 18px; background: url(img/ahblank.gif) no-repeat 0 3px; }
#ficha #col2 p.enlacerel a:hover{ color: white; }

/* -- subphono -- */
h2#staff{ text-indent: -9999px; background: #470000 /*url(img/h2stafffondo.gif) no-repeat 10px 5px*/; height: 28px; margin: 25px 0 20px 0; }
.subphono #paginacion{ margin-bottom: 0; }
.subphono #bloquelist{ height: 100px; }
.subphono #bloquelist li{ height: 100px; width: 100px; margin: 0; padding: 0 0 0 10px; }

/* -- formulario -- */
.contactbox{ background: #470000; border: 2px solid #FFB400; margin: 30px 200px; padding: 30px 30px 10px 30px; }
div.contactbox p{ text-align: center; }
.contactbox p{ margin: 0 0 20px 0; font-weight: bold; }
.contactbox label{ width: 80px; display: block; float: left; text-align: right; font-size: 1.1em; margin: 0 10px 0 0; padding: 2px 0 0 0; }
.contactbox input,
.contactbox textarea{ font-family: Arial, Helvetica, sans-serif; font-size: 1em; border: 0; padding: 0 3px; }
.contactbox input#nombre{ width: 200px; }
.contactbox input#empresa{ width: 200px; }
.contactbox input#correo{ width: 200px; }
.contactbox input#motivo{ width: 200px; }
.contactbox textarea#comentarios{ width: 200px; }
.contactbox input.boton{ margin: 10px 0 0 90px; background-color: #FFB400; font-weight: bold; width: 100px; }