/*----------------------------------------------
    ETIQUETAS GENERALES
------------------------------------------------*/
html,body { height:100%; }
body { margin:0; padding:0; background:url(../img/background/background.jpg) repeat-x #000;}
h1, h2, h3, h4 { margin:0; padding:0;}
ul, ol, {margin:0;padding:0;list-style:none;}
li { margin:0; padding:0;}
p { font:13px Calibri, Arial, Helvetica, sans-serif;margin:0;padding:0;}
img { border:none;text-decoration:none;}
a { text-decoration:none; }
a:hover { text-decoration:none; }
table { margin:0;padding:0;border-collapse:collapse; }
form { margin:0;padding:0; }
form label { display:block; }

/*----------------------------------------------
   ESTRUCTURA GENERAL
------------------------------------------------*/
#tripulacionweb { display:none; }

#background-izq {
	background:url(../img/background/background-izq.jpg) no-repeat 0 126px;
	height:100%;
}

#background-der {
	background:url(../img/background/background-der.jpg) no-repeat 100% 126px;
	height:100%;
}

/* WRAPPER */
#wrapper {
	margin:0 auto 0 auto;
	width:894px;
}

/* HEADER */
#header {
	position:relative;
	z-index:200; /* <-- Por arriba del carrusel */
}

#logo { /* <div> Sostiene el logo (float left) */
	width:386px;
	float:left;
	margin:16px 0 0 0;
}

#fecha { /* <div> Sostiene la fecha (float right) */
	float:right;
	margin:20px 0 0 0;
}

   #fecha p { font:18px "Times New Roman", Times, serif; }

/* NAV */
#nav { /* <div> Sostiene el nav */
	width:894px;
	position:relative;
	z-index:100; /* <-- Por encima del carrusel */
	clear:both;
}

#nav div a { display:block;width:100%;height:100%;}
#nav #inicio {width:181px; height:111px;float:left; background:url(../img/nav/inicio.png) no-repeat 0 0;}
#nav #inicio.over {background:url(../img/nav/inicio_over.png) no-repeat 0 0;}
#nav #artistas {width:177px; height:111px;float:left; background:url(../img/nav/artistas.png) no-repeat 0 0;}
#nav #artistas.over {background:url(../img/nav/artistas_over.png) no-repeat 0 0;}
#nav #exposiciones {width:178px; height:111px; float:left; background:url(../img/nav/exposiciones.png) no-repeat 0 0;}
#nav #exposiciones.over {background:url(../img/nav/exposiciones_over.png) no-repeat 0 0;}
#nav #obras { width:178px; height:111px; float:left; background:url(../img/nav/obras.png) no-repeat 0 0;}
#nav #obras.over { background:url(../img/nav/obras_over.png) no-repeat 0 0;}
#nav #contacto { width:180px; height:111px; float:left; background:url(../img/nav/contacto.png) no-repeat 0 0;}
#nav #contacto.over { background:url(../img/nav/contacto_over.png) no-repeat 0 0;}

#nav_bg { /* <div> Sostiene el fondo (position absolute) */
	position:absolute;
	left: -258px;
	top: -36px;
	z-index:-2;
}

#carrusel { /* <div> Sostiene el carrusel (position absolute) */
	position:absolute;
	z-index:-2; /* <-- Por abajo de todo */
	top:-93px;
	left: 0px;
}

#bloqueo { /* <div> Bloqueo de publicidad */
	background:black;
	width:50px;
	height:50px;
	position:absolute;
	z-index:20;
	bottom:-400px;
	left:0;
}

/* MAIN */
#main {
   margin:400px 0 0 0;
}

#main_top { /* <div> Borde superior */
	background:url(../img/main/main_top.png) no-repeat 50% 0;
	width:881px;
	margin:0 auto 0 auto;
	height:14px;
}

#main_middle { /* AREA ACTIVA */
	background:url(../img/main/main_middle.png) repeat-x #FFF;
	width:879px;
	margin:0 0 0 2px;
	margin:0 auto 0 auto;
	border-left:1px solid white;
	border-right:1px solid white;
}

#main_bottom { /* <div> Borde inferior */
	background:url(../img/main/main_bottom.png) no-repeat 50% 0;
	width:881px;
	margin:0 auto 0 auto;
	height:14px;
}

/* FOOTER */
#footer { /* <div> Sostiene el footer */
	background:url(../img/footer/bg_footer.png) no-repeat;
	width:893px;
	height:106px;
	position:relative;
}

   #footer #facebook { position:absolute; right:20px; bottom:21px; }
   #footer #twitter { position:absolute; right:85px; bottom:21px; }

#footer .info {
	font:bold 21px Calibri, Arial, Helvetica, sans-serif;
	color:white;
	padding:30px 0 0 25px;
}

#footer .dir {
	font:italic 16px Calibri, Arial, Helvetica, sans-serif;
	color:white;
	padding:2px 0 0 25px;
}

#footer a { color:#308b97; }
#footer a:hover { text-decoration:underline; }

#footer_bg {
	position:absolute;
	left: -211px;
	top: -93px;
	z-index:-2; /* <-- Por abajo del texto */
}

/* LOAD */   
#load { 
   position:absolute; 
   top:0;
   left:-1000000px;
}

/*----------------------------------------------
    SECCIONES (index.php)
------------------------------------------------*/
#s_index {
	position:relative;
}

#bienvenida { /* <div> Sostien el titulo */
	background:url(../img/s_index/bienvenidos.png) no-repeat;
	width:500px;
	height:74px;
	margin:0 0 0 -17px;
}

#bienvenida p { font:italic 32px "Times New Roman", Times, serif; color:white;padding:10px 0 0 25px;}

#texto_bienvenida {
	font:12px Arial, Helvetica, sans-serif;
	width:500px;
	margin:0 0 0 15px;
}

#division { /* <div> Una division (una imagen) */
	margin:15px 0 10px 20px;
}

#img_galeria { /* <div> Sostiene las imágenes de la galería */
	margin:0 0 0 10px;
}

#img_galeria img {margin:0 30px 0 0;}

#obras_venta { /* <div> Sostiene las "Obras en Venta" (position absolute) */
	background:url(../img/s_index/bg_gal.png) no-repeat;
	width:349px;
	height:404px;
	position:absolute;
	left: 523px;
	top: -6px;
}

#obras_venta .obras_titulo { font:italic 40px "Times New Roman", Times, serif;color:#04454f;margin:20px 0 0 0;text-align:center;}

#slider { /* <div> Slider (easySlider.css) */
   margin:0 auto 25px auto;
   width:270px;
   text-align:center;
}

#control p { font:bold 24px Calibri, "Times New Roman", Times, serif;color:#04454f;text-align:center;}
#control p a { color:#04454f; }
#control p a:hover { text-decoration:underline; }


/*----------------------------------------------
    SECCIONES (artistas.php)
------------------------------------------------*/
#s_artistas {
}

#texto_artistas { /* <div> Sostiene le texto de bienvenida (float left) */
	width:565px;
	float:left;
	margin:10px 0 0 15px;
}

#texto_artistas p { font:13px Calibri, Arial, Helvetica, sans-serif;}

#titulo_artistas { /* <div> Sostiene el titular "Nuestors Artistas" (float right) */
	background:url(../img/s_artistas/titulo.png) no-repeat;
	width:290px;
	height:76px;
	float:right;
	margin:0 -10px 0 0;
}

#titulo_artistas p { font:italic 32px "Times New Roman", Times, serif; color:white; margin:10px 0 0 25px; }

#div_artistas { /*  <div> Sostiene una imagen separadora (también usada en detalle) */
	width:880px;
	height:7px;
	text-align:center;
	clear:both;
}

.artistas { /* <div> Sostiene cada uno de los artistas */
	width:418px;
	height:136px;
	float:left;
	margin:15px 0 10px 10px;
}

.foto_artistas { background:url(../img/s_artistas/bg_foto.png) no-repeat; width:172px; height:136px; float:left; }
.foto_artistas img { border:solid 1px black; margin:15px 0 0 25px; }
.descripcion_artistas { width:246px; float:left; }
.descripcion_artistas .titulo_art { font:bold italic 18px Calibri, Arial, Helvetica, sans-serif; color:#022a2c; margin:10px 0 0 5px; }
.descripcion_artistas .titulo_art a { font:bold italic 18px Calibri, Arial, Helvetica, sans-serif; color:#022a2c;text-decoration:none; }
.descripcion_artistas .titulo_art a:hover {f ont:bold italic 18px Calibri, Arial, Helvetica, sans-serif; color:#022a2c;text-decoration:underline;}
.descripcion_artistas .texto_art { font:12px Calibri, Arial, Helvetica, sans-serif; margin:5px 0 5px 5px; height:70px }
.descripcion_artistas .mas_info { margin:0 0 0 5px; text-align:right; }
.descripcion_artistas .mas_info a { font:12px Calibri, Arial, Helvetica, sans-serif; color:black; text-decoration:none; }
.descripcion_artistas .mas_info a:hover { font:12px Calibri, Arial, Helvetica, sans-serif; color:#022a2c; text-decoration:underline;}

/*----------------------------------------------
    SECCIONES (/20-jorge-espinosa-torre.html/)
------------------------------------------------*/
#s_detalle {
	position:relative;
}

#bg_titulo_detalle { /* <div> Sostiene el titular "Nuestros Artistas" */
	background:url(../img/s_detalle/bg_titulo.png) no-repeat;
	width:294px;
	height:75px;
	margin:0 0 0 -10px;
}

#bg_titulo_detalle p { font:italic 32px "Times New Roman", Times, serif; color:white; padding:10px 0 0 25px; }

#nombre_art { /* <div> Sostien el nombre del artista (position absolute) */
	position:absolute;
	top: 42px;
	right:30px;
}

#left { background:url(../img/s_detalle/left.png) no-repeat; width:15px; height:34px; float:left; }
#center { background:url(../img/s_detalle/center.png) repeat-x; height:34px; float:left; text-align:right; }
#center p { font:bold italic 20px Calibri, Arial, Helvetica, sans-serif; color:#022a2c; margin:5px 0 0 0; }
#right { background:url(../img/s_detalle/right.png) no-repeat; width:15px; height:34px; float:left;}


#img_large { /* <div> La imagen del artista (float left) */
	width:235px;
	float:left;
	margin:0 0 10px 15px;
}

#img_large img { border:solid 3px white; }

#desc_detalle { /* <div> Sostiene la información del artista (float right) */
	width:596px;
	float:right;
	margin:0 10px 0 0;
}

#texto_detalle { width:550px;margin:0 0 0 24px;}
#texto_detalle p { padding-bottom:5px; text-align:justify; }
#desc_detalle_top { background:url(../img/s_detalle/desc_top.png) no-repeat;width:596px;height:14px;}
#desc_detalle_middle { background:url(../img/s_detalle/desc_middle.png) repeat-y; width:596px; }
#desc_detalle_bottom { background:url(../img/s_detalle/desc_bottom.png) no-repeat; width:596px; height:14px;}

.obra_detalle { /* <div> Sostiene cada una de las obras (float left) */
	width:138px;
	text-align:center;
	margin:15px 0 0 31px;
	float:left;
}

.foto_obra { margin:0 0 10px 0; }
.nombre_obra_top { background:url(../img/s_detalle/obra_top.png) no-repeat; width:138px; height:13px; }
.nombre_obra_middle { background:url(../img/s_detalle/obra_middle.png) repeat-y; width:138px; }
.nombre_obra_bottom { background:url(../img/s_detalle/obra_bottom.png) no-repeat; width:138px; height:13px; }
.titulo_obra { font:bold italic 17px Calibri, Arial, Helvetica, sans-serif; color:#022a2c; }
.ano_obra { font:bold 15px Calibri, Arial, Helvetica, sans-serif; color:black; }

/*----------------------------------------------
    SECCIONES (exposiciones.php)
------------------------------------------------*/
#s_exposiciones {
	background:url(../img/s_exposiciones/bg_div.png) repeat-y 50% 0;
}

#proximas { /* <div> Sostiene el titular "Próximas Exposiciones" */
	background:url(../img/s_exposiciones/proximas.png) no-repeat;
	width:441px;
	height:75px;
	float:left;
	margin:0 0 0 -15px;
}

#proximas p { font:italic 32px "Times New Roman", Times, serif; color:white; padding:10px 0 0 0; text-align:center }

#pasadas{ /* <div> Sostiene el titular "Exposiciones Pasadas" */
	background:url(../img/s_exposiciones/pasadas.png) no-repeat;
	width:441px;
	height:75px;
	float:right;
	margin:0 -15px 0 0;
}

#pasadas p { font:italic 32px "Times New Roman", Times, serif; color:white; padding:10px 0 0 0; text-align:center; }

#col_pasadas { /* <div> Columna de las "Exposiciones Pasadas" */
	width:420px;
	float:left;
	margin:0 0 0 10px;
}

#col_proximas { /* <div> Columna de las "Próximas Exposiciones" */
	width:420px;
	float:right;
	margin:0 -5px 0 0; 
}

.expo { /* <div> Sostiene a cada una de las exposiciones */
	width:401px;
	background:#f5f5f5;
	border:solid 1px #c2c2c2;
	margin:0 0 10px 0;
}

.img_expo { margin:0 auto 10px auto; padding-top:10px;  width:381px; text-align:center;}
.titulo_expo { font:italic 21px "Times New Roman", Times, serif; color:#010101; float:left; margin:0 0 0 10px; }
.aumentar_expo { float:right; margin:0 10px 10px 0; }

/*----------------------------------------------
    SECCIONES (obras.php)
------------------------------------------------*/
#s_obras {
}

#venta_obras { /* <div> Sostiene la parte introductoria (titular, texto, etc) */
	width:858px;
	margin:0 0 0 10px;
}

#venta_obras_top { background:url(../img/s_obras/bg_venta_top.png) no-repeat; width:858px; height:13px; }
#venta_obras_middle { background:url(../img/s_obras/bg_venta_middle.png) repeat-x white; width:850px; border-left:1px solid white;border-right:1px solid white;margin:0 0 0 4px;}
#venta_obras_bottom { background:url(../img/s_obras/bg_venta_bottom.png) no-repeat; width:858px; height:13px;}

#obras_vent { /* <div> Titular "Obras a la venta" */
	background:url(../img/s_obras/obras_venta.png) no-repeat;
	width:241px;
	height:66px;
	margin:0 0 0 -15px;
}

#obras_vent p { font:italic 30px "Times New Roman", Times, serif; color:white; padding:10px 0 0 15px; }

#texto_obras { /* <div> Texto de Introducción */
	margin:0 15px 0 15px;
}

#texto_obras p { padding-bottom:5px; }

#content_obras { /* <div>  Sostiene a todas las obras */
	width:858px;
	margin:0 0 0 10px;
}

#content_obras_top { background:url(../img/s_obras/bg_venta_top.png) no-repeat; width:858px; height:13px; }
#content_obras_middle { background:url(../img/s_obras/bg_venta_middle.png) repeat-x white; width:850px; border-left:1px solid white; border-right:1px solid white; margin:0 0 0 4px; }
#content_obras_bottom { background:url(../img/s_obras/bg_venta_bottom.png) no-repeat; width:858px; height:13px; }

.venta { /* <div> Sostiene a cada uno de los cuadros */
	width:268px;
	margin:0 0 0 12px;
	padding-top:10px;
	float:left;
}

.venta_top { background:url(../img/s_obras/venta_top.png) no-repeat; width:268px; height:16px; }
.venta_middle { background:url(../img/s_obras/venta_middle.png) repeat-y; width:268px; border-top:solid 1px transparent;}
.venta_bottom { background:url(../img/s_obras/venta_bottom.png) no-repeat; width:268px; height:16px; }

.titulo_venta {
	font:bold italic 25px "Times New Roman", Times, serif;
	color:#022a2c;
    margin:-10px 0 0 10px;
}

.autor_venta {
	font:bold 15px Calibri, Arial, Helvetica, sans-serif;
	color:black;
	margin:-5px 0 10px 10px;
}

.foto_venta {
	float:left;
	margin:0 0 0 10px;
}

.desc_obra {
	float:right;
	width:150px;
	margin:0 10px 10px 0;
	text-align:center;
}

.precio {
	width:155px;
	float:right;
	padding:0 10px 0 0;
}

.precio_top { background:url(../img/s_obras/precio_top.png) no-repeat; width:155px; height:13px; }
.precio_middle { background:url(../img/s_obras/precio_middle.png) repeat-y; width:155px; border-top:solid 1px transparent;}
.precio_bottom { background:url(../img/s_obras/precio_bottom.png) no-repeat; width:155px; height:13px; }

.precio_middle p {
	font:bold 20px Calibri, Arial, Helvetica, sans-serif;
	color:#ff0000;
	margin:-8px 0 -5px 0px;
	text-align:center;
}

.aumentar {
	width:102px;
	float:left;
	margin:10px 10px 0 10px;
}

.comprar {
	width:102px;
	float:right;
	margin:10px 10px 0 10px;
}


/*----------------------------------------------
    SECCIONES (contacto.php)
------------------------------------------------*/
#s_contacto {
}

.texto_contacto { /* <div> Sostiene el texto de introducción (float right)*/
	font:14px Calibri, Arial, Helvetica, sans-serif;
	color:black;
	margin:10px 20px 0 0;
	float:right;
	width:500px;
}

#titulo_contacto { /* <div> Sostiene el titular "Contáctenos" (float left) */
	background:url(../img/s_contacto/titulo_contacto.png) no-repeat;
	width:340px;
	height:73px;
	margin:0 0 0 -15px;
	float:left;
}

#titulo_contacto p { font:italic 32px "Times New Roman", Times, serif; color:white; padding:10px 0 0 25px; }


#logo_contacto { /* <div> Sostiene el logo (float right) */
	float:right;
	margin:-30px 40px 0 0;
}



#formulario { /* <div> Sostiene el formulario (float left) */
	background:url(../img/s_contacto/bg_form.png) no-repeat;
	width:523px;
	height:413px;
	float:left;
	margin:0 0 0 20px;
	position:relative;
}

#liston_left {background:url(../img/s_contacto/liston_left.png) no-repeat;width:10px;height:53px;position:absolute;left: -4px;top: 24px;}
#liston_center {background:url(../img/s_contacto/liston.png) no-repeat;width:511px;height:35px;position:absolute;left: 6px;top: 24px;}
#liston_right {background:url(../img/s_contacto/liston_right.png) no-repeat;width:10px;height:53px;position:absolute;left: 517px;top: 24px;}
.titulo_form {font:bold 17px Arial, Helvetica, sans-serif;color:white;margin:7px 0 0 10px;}

#s_contacto form { /* <div> El formulario */
	margin:70px 0 0 0;
	position:relative;
}

#s_contacto label {
	font:bold italic 18px Arial, Helvetica, sans-serif;
	color:#2e2d2d;
}

#s_contacto input {
	background:url(../img/s_contacto/bg_input.png) no-repeat;
	font:bold 26px Calibri, Arial, Helvetica, sans-serif;
	padding:3px 0 0 5px;
	color:black;
	width:392px;
	height:38px;
	border:none;
}

#s_contacto textarea {
	background:url(../img/s_contacto/bg_textarea.png) no-repeat;
	font:bold 14px Calibri, Arial, Helvetica, sans-serif;
	width:393px; /* <-- 398px */
	height:88px; /* <-- 93px */
	padding:5px;
	border:none;
}

#s_contacto table td {
	padding:15px 0 0 12px;
}

#submit {
	text-align:right;
	margin:10px 0 0 0;
}

   #submit .submit { width:107px; height:42px; border:none; background:none; }

#img_contacto { /* <div> Sostiene la imagen decorativa (position absolute) */
	position:absolute;
	left: 536px;
	top: 194px;
}

#img_contacto img { border:solid 2px white }

#respuesta { /* <div> Área de la resueta */
	position:absolute;
	left:0;
	bottom:13px;
	font:14px Calibri,Arial, Helvetica, sans-serif;
	padding:5px;
	margin-left:15px;
	margin-right:15px;
	border:1px solid white;
	color:white;
	display:none;
}

     #respuesta.ok { background:green; }
	 #respuesta.error { background:red; }
	 
#loading { /* <div> Sostiene la imagen de carga */
	position:absolute;
	left:0;
	bottom:13px;
	padding:5px;
	margin-left:15px;
	margin-right:15px;
	background:url(../img/s_contacto/processing.gif) no-repeat 0 0;
	display:none;
}

