/* Estilo principal WEB */

html{
width:100%;
height:100%;
margin:0;
padding:0;
}

body{
width:100%;
height:100%;
margin:0;
padding:0 0 0 0;
background:url(../img/faldon_burbujas.jpg) top center repeat-y #ccc;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#666;
cursor:default;

}


a img{border:none;}
a{color:#666;text-decoration:none;}
a:hover{color:#000;text-decoration:none;}

/* ---------------------------------------------------------------------------------------- /*

div#casper{
float:left;
position:relative;
width:100%;
height:30px;
margin:0;
padding:0;
}

/* MASTER */
div#master{
position:relative;
width:802px;
margin:25px auto 0 auto;
padding:0;
background:url(../img/master_bg.jpg) top left repeat #fff;
}

/* Cabeceras */	
div#subcabecera{
float:left;
position:relative;
width:100%;
height:94px;
margin:0;
padding:0;
}

	/* Logotipo */
	div#subcabecera div#logo{
	float:left;
	position:relative;
	width:315px;
	height:94px;
	margin:0;
	padding:0;
	}

		div#subcabecera div#logo a{
		width:100%;
		height:100%;
		}

		div#subcabecera div#logo a img{
		width:100%;
		height:100%;
		}



	/* Datos empresa */
	div#subcabecera div#datos_contacto{
	float:right;
	position:relative;
	width:315px;
	height:94px;
	margin:0;
	padding:0;
	background:url(../img/datos-empresa.png) top right no-repeat;
	top:20px;
	right:10px;
	}


div#cabecera{
float:left;
position:relative;
width:100%;
height:268px;
margin:0;
padding:0;
background:url(../img/megabanner.jpg) top left no-repeat;
}


/* MENU PRINCIPAL */
div#menu_principal{
float:left;
position:relative;
width:100%;
height:33px;
margin:0 0 0 0;
padding:0;
background:url(../img/menu_bg.jpg) top left no-repeat;
}



	div#menu_principal ul{
	position:relative;
	width:776px;
	height:27px;
	margin:0 auto; 
	padding:0;
	list-style-type:none;
	}

		div#menu_principal ul li{
		float:left;
		position:relative;
		margin:5px 0 0 0; 
		padding:0;
		list-style-type:none;
		}
		
			div#menu_principal ul li a.naranja{color:#f5a416;}

			div#menu_principal ul li a{padding:0 15px 0 0;color:#fff;background:url(../img/tick.jpg) right 0 no-repeat;}

			div#menu_principal ul li a:hover{color:#f5a416;}


		div#menu_principal ul li#inicio{margin-left:15px;}
		
		div#menu_principal ul li#area_clientes{
		float:right;
		position:relative;
		width:90px;
		margin:4px 0 0 0; 
		padding:0;
		list-style-type:none;
		}


		li#area_clientes a{
		width:19px;
		height:19px;
		}

		li#area_clientes a img{
		width:19px;
		height:19px;
		opacity: .4;
		-moz-opacity: .4;
		filter: alpha(opacity=40);		
		}
		li#area_clientes a:hover img{
		width:19px;
		height:19px;
		opacity: 1;
		-moz-opacity: 1;
		filter: alpha(opacity=100);		
		}
		
			div#menu_principal ul li#area_clientes a.naranja{color:#f5a416;}
			div#menu_principal ul li#area_clientes a{padding:0 0 0 0;color:#999;background:none;}

			div#menu_principal ul li#area_clientes a:hover{color:#f5a416;}



/* Contenedor */
div#contenedor{
float:left;
position:relative;
width:100%;
min-height:400px;
height:auto;
margin:0;
padding:0;
}


	div#contenedor div#lateral{
	float:left;
	position:relative;
	width:300px;
	min-height:350px;
	height:auto;
	margin:0;
	padding:0;
	/*background:url(../img/lateral_bg.jpg) right 15px no-repeat;*/
	/*border-right:1px solid #666;*/
	}


	div#contenedor div#lateral div{
	float:left;
	position:relative;
	width:90%;
	margin:0;
	padding:2%;
	margin:0 0 0 8px;
	}

	div#contenedor div#seccion{
	float:left;
	position:relative;
	height:auto;
	margin:0;
	padding:0;
	}


/* 
Fantasma :
Este contenedor sirve para meter 150px 
vacios al final de la página de forma limpia
*/
div#footer{
position:relative;
width:802px;
height:50px;
margin:10px auto 0 auto;
padding:0;
}


div#footer span#copy{
float:left;
position:relative;
width:100%;
margin:0 0 0 0;
padding:0;
text-align:left;
color:#fff;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
text-align:center;
}



div#footer span#valida{
float:left;
position:relative;
width:100%;
margin:8px 0 0 0;
padding:0;
text-align:center;
color:#fff;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
text-align:center;
}



	div#footer span a#aviso{
	color:#fff;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;	
	}

	div#footer span a#aviso:hover{color:#f5a415;}
	
/* ---------------------------------------------------------------------------------------- /*

/* CONTENIDOS DE LA WEB */

/* Noticias */
div#noticias{
float:left;
position:relative;
width:95%;
margin:0;
padding:0;
}



	div#noticias div.mininoticia{float:left;position:relative;width:100%;margin:0 0 0 -4px!important;}

		div.mininoticia p.fecha{float:left;position:relative;width:100%;margin:0;color:#ff9900;font-weight:bold;}
		div.mininoticia p.titulo{float:left;position:relative;width:100%;margin:0;color:#333;font-weight:bold;}

		div.mininoticia p.texto a{float:left;position:relative;width:100%;margin:0;color:#666;}
 		div.mininoticia p.texto a:hover{color:#999;cursor:pointer;}
	

/* Seccion INICIO */
div#inicio{
position:relative;
width:100%;
height:auto;
margin:0 auto 0 auto;
height:690px;
padding:0;
background:url(../img/mujer_inicio.jpg) right 10px no-repeat;
}


	div#inicio p{width:68%;color:#666;}


span#titulo_seccion{float:left;position:relative;width:100%;font-size:18px;color:#ff9900;margin:8px 0 8px 0;}

span.titulo_seccion{float:left;position:relative;width:100%;font-size:18px;color:#ff9900;margin:8px 0 8px 0;}


/* PORTAFOLIO */
div#portafolio{
float:left;
position:relative;
width:100%;
height:680px;
margin:0 0 0 0;
padding:0;
background:url(../img/portafolio_bg.jpg) top left no-repeat;
}

div#portafolio a:hover{color:#f5a416;}

a#estudio_grafico{float:left;width:300px;height:25px;position:absolute;left:52px;top:225px;margin:0;padding:0;font-weight:bold;color:#333;text-align:center;font-size:14px;}

a#desarrollo_web{float:right;width:300px;height:25px;position:absolute;right:38px;top:225px;margin:0;padding:0;font-weight:bold;color:#333;text-align:center;font-size:14px;}

a#impresion{float:left;width:300px;height:25px;position:absolute;left:52px;top:508px;margin:0;padding:0;font-weight:bold;color:#333;text-align:center;font-size:14px;}

a#marketing{float:right;width:300px;height:25px;position:absolute;right:38px;top:508px;margin:0;padding:0;font-weight:bold;color:#333;text-align:center;font-size:14px;}


/* LOCALIZACION */
div#localizacion{
position:relative;
width:85%;
height:auto;
margin:47px auto 0 auto;
}

	div#localizacion span{float:left;position:relative;width:100%;font-size:18px;margin:8px 0 8px 0;}

	div#localizacion div{float:left;position:relative;width:100%;margin:15px 0 0 10px;color:#666;}
	
iframe{position:relative;margin:42px 0 0 25px;border:1px solid #f5a416;}


/* Clientes */
div#clientes{
float:left;
position:relative;
width:100%;
margin:0;
padding:0;
}

	div#clientes span{float:left;position:relative;width:100%;font-size:18px;margin:8px 0 8px 0;}


/* LOGIN */
div#login{
position:relative;
width:235px;
height:170px;
padding:0;
margin:0 auto;
top:50px;
background-color:#fff;
border:1px solid #f5a416;

}


div#login form{
position:relative;
width:85%;
margin:0 auto;
padding:0;
}

div#login a#sinclave{float:left;position:relative;width:100%;font-size:9px;text-align:center;}

label.etique{
float:left;
position:relative;
}

.textfield{
float:left;
position:relative;
background:#f0f0f0;
border:solid 1px #666;
font:11px/normal Tahoma, Verdana;
width:195px;
}

.textfield:hover, .textfield:focus{
background:#fff;
border:solid 1px #333;
color:#000;
width:195px;
}
		
.buttonfield{
background:#fff;
border:solid 1px #ccc;
color:#666;
font:bold 11px/normal Tahoma, Verdana;
padding:4px;
cursor:pointer;
}

p.ok{color:#336600;}
p.no_ok{color:#990000;}

a#boton_log{
float:left;
position:relative;
height:12px;
background-color:#fff;
color:#666;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
border:1px solid #f5a416;
padding:8px;
margin:5px 10px 0 0;
text-decoration:none;
}

.buttonfield:hover{
background-color:#666;
color:#fff;
}

div.centrar{
position:relative;
width:100%;
height:12px;
text-align:center;
top:20px;
padding:0;
}


/* ---------------------------------------------------------------------------------------- /*


/* GALERIAS*/
div#galeria{
position:relative;
width:100%;
height:100%;
margin:0 auto;
top:0;
padding:0 0 0 0;
}


div#galeria div.album{
float:left;
position:relative;
width:100%;
height:100%;
margin:0 0 0 0;
padding:0;
}

div.foto{
float:left;
position:relative;
width:220px;
min-height:80px;
margin:15px 0 0 25px;
padding:0;
}

span.titulo_foto{
float:left;
position:relative;
width:100%;
margin:0;
padding:3px 0 3px 0;
font-size:11px;
font-family:Verdana, Arial, Helvetica, sans-serif;
text-align:center;
}


span.titulo_foto a:hover{color:#f5a415;}


/* CONTACTO */
div#texto_contacto{
float:left;
position:relative;
width:90%;
margin:0;
padding:2%;
margin:0 0 0 8px;
}

	div#texto_contacto span{
	margin:8px 0 8px 0;
	}


	div#texto_contacto strong{
	color:#f5a416;
	}


div#contacto{
position:relative;
width:85%;
height:auto;
margin:47px auto 0 auto;
background-color:#FFFFFF;
border:1px solid #f5a416;
}

	div#contacto form{
	position:relative;
	width:85%;
	margin:20px auto 0 auto;
	padding:2%;
	}


	div#contacto form label{
	float:left;
	position:relative;
	width:100px;
	margin:0;
	padding:0;
	text-align:right;
	}


	div#contacto form input,textarea{
	background:#f0f0f0;
	border:solid 1px #666;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	}

	div#contacto form input:hover,input:focus,textarea:hover,textarea:focus{
	border:1px solid #ccc;
	background-color:#fff;
	color:#999;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	}
		div#contacto form label#condi{
		float:left;
		position:relative;
		margin:0;
		padding:0;
		width:100%;
		text-align:center;
		}
		
		div#contacto form input#acepto{margin-left:55px}
		
		
		div#contacto form fieldset{margin:10px auto 10px auto;width:77%;height:100px}
		
		div#contacto form input#boton_enviar{
		float:right;
		position:relative;	
		margin:8px 40px 0 0;	
		width:55px;
		height:25px;
		background:#f0f0f0;
		border:solid 1px #666;
		padding:0;
		cursor:pointer;
		font-weight:bold;
		color:#999;
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-size:11px;
		text-align:center;
		}
		
		div#contacto form input#boton_enviar:hover{border:1px solid #ccc;background-color:#fff;}


/* Servicios */

div#servicios{
float:left;
position:relative;
width:96%;
margin:0;
padding:2%;
margin:21px 0 0 0;
}


div#texto_servicios{
float:left;
position:relative;
width:90%;
margin:0;
padding:2%;
margin:0 0 0 8px;
}


	div#texto_servicios span{
	margin:8px 0 8px 0;
	}

div#texto_servicios ul{
float:left;
position:relative;
margin:10px 0 0 33px;
padding:0;
}

div#texto_servicios ul li{list-style-image:url(../img/lista_naranja.gif);color:#666;}

div#texto_servicios ul li.enlace{list-style-image:none;list-style-type:none;color:#333;font-weight:bold;margin-left:-30px;text-decoration:underline;cursor:pointer;}


cite{font-weight:bold;font-size:12px;}

img#img_servicios{
float:right;
position:relative;
width:135px;
border:1px solid #ccc;
margin:15px 0 0 15px;
}


/* FTP */

table tr td span{
float:left;
position:relative;
margin:2px 0 0 4px;
padding:0;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
}


table tr th{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
color:#f5a416;
height:35px;
}

table tr td{height:25px;}

table tr td img{
width:16px;
}


table tr td img#icono{
float:left;
position:relative;
margin:0;
padding:0;
}



div#tabla{
width:650px;
height:auto;
position:relative;
margin:50px auto;
border:1px solid #f5a416;
background-color:#fff;
}

div#tabla table{
position:relative;
margin:10px auto 20px auto;
}


div#tabla form{
position:relative;
margin:10px auto 20px auto;
width:70%;
}

p.error{
float:left;
position:relative;
width:100%;
text-align:center;
color:#990000;
}


