/*
	<==========================>
	 project: GARREBIL 
	 autor: Raúl Gallo
	<==========================>
*/

/* =propiedades generales-------------------------------- */
body{background: #fff;; margin:0; padding:0; border:0; color:#5b5a58; font:normal 9pt Tahoma,Verdana,sans-serif;}

h1,h2,h3,h4,h5,h6{margin:0; padding:0;}

ul{margin:0; padding:0; list-style:none;}
li{margin:0; padding:0;}
p{margin:0; padding:0 0 8px 0; text-align:justify;}

/* =links ----------------------------------------------------*/
a{text-decoration:none; color:#5b5a58; outline:none;}
a:hover{ outline:none;}
a img{border:0;}

/* =contenedor ---------------------------------------------- */
#contenedor{margin:0 auto; top:10px; width:980px; position:relative;}

/* =cabecera ------------------------------------------------ */
#cabecera{ height:100px; margin:10px 0 2px 0; padding: 25px 0 0 10px; background-image:url(../images/cabecera2.jpg); border-color: #CCC; border-top-style: outset; }

/* =contenedormenu ------------------------------------------ */
#contenedormenu { background:url(../images/fondo_menu2.png) no-repeat; height:57px; margin:0 0 2px 0; }

#menu {padding:0; margin:0; list-style:none; width:525px; height:28px; background: url(../images/bmenu.png) no-repeat; position:relative; float:left;}
#menu li {float:left;}
#menu li a {display:block; width:130px; height:25px; background:transparent;}
#menu li a b {position:absolute; left:-9999px;}

#menu li#home,
#menu li#servicios,
#menu li#nosotros,
#menu li#contacto
{margin-top:2px;}

#menu li#home a:hover {background:url(../images/bmenucolor.png) 0px -2px;}
#menu li#servicios a:hover {background:url(../images/bmenucolor.png) -130px -2px;}
#menu li#nosotros a:hover {background:url(../images/bmenucolor.png) -260px -2px;}
#menu li#contacto a:hover {background:url(../images/bmenucolor.png) -390px -2px;}


.home #menu li#home a, .home #menu li#home a:hover, #menu li#home a:active, #menu li#home a:focus {background:url(../images/bmenucolor.png) 0 -2px;}
.servicios #menu li#servicios a, .servicios #menu li#servicios a:hover, #menu li#servicios a:active, #menu li#servicios a:focus {background:url(../images/bmenucolor.png) -130px -2px;}
.nosotros #menu li#nosotros a, .nosotros #menu li#nosotros a:hover, #menu li#nosotros a:active, #menu li#nosotros a:focus {background:url(../images/bmenucolor.png) -260px -2px;}
.contacto #menu li#contacto a, .contacto #menu li#contacto a:hover, #menu li#contacto a:active, #menu li#contacto a:focus {background:url(../images/bmenucolor.png) -390px -2px;}

#menudesplegable { text-align: center; margin: -33px 0 0 10px; height:20px; width:680px; padding:10px 0 0 0;}
#menudesplegable a { font:bold 11.5px Arial, Helvetica, sans-serif; color:#000; }
#menudesplegable a:hover { color:#000; text-decoration:underline; }

/* =fecha --------------------------------------------------- */
#fecha { float:right; margin-top:8px; margin-right:20px; width:298px; text-align:right; color:#FFF;}

/* =contenido ----------------------------------------------- */
#contenido{ width:648px; height:220px; position:absolute; left: 0; top: 210px; color:#5b5a58; padding: 20px 15px 20px 15px; font-size: 14px }
#contenido p {padding:3px 10px 10px 10px;}

/* =noticias ------------------------------------------------ */
#noticias {
	width:258px;
	height:232px;
	position:absolute;
	right: 0;
	top: 207px;
	background:url(../images/noticias.png) no-repeat;
	padding-top: 40px;
	padding-right: 20px;
	padding-bottom: 17px;
	padding-left: 20px;
}
#noticias a{ font: bold 11px Verdana, Arial, "Helvetica", sans-serif;color:#7caeef;}
#noticias a:hover { text-decoration:underline;}
.titulonoticia { font: 18/20px bold Verdana, Arial, Helvetica, sans-serif; color:#000; text-align:justify;}
.fechasnoticias { padding: 2px 0 6px 0; font-size:10px; color:#666;}
.separador { padding: 5px 0 5px 0; color:#CCC; text-align:center;}
.resumen { font: normal 11px Verdana, Arial, Helvetica, sans-serif; text-align: justify;}
#masnoti a {font: bold 10px Verdana, Arial, Helvetica, sans-serif; text-align: justify; color:#666;}
#masnoti a:hover { text-decoration:underline; text-align: justify; color:#666;}

/* =divisiones ---------------------------------------------- */
#divisiones {width:648px; position:absolute; left: 0; top: 400px; color:#FFF; padding: 100px 15px 20px 15px;}
#divisiones a:hover { text-decoration:underline; color:#5b5a58;}
#divisiones p.rapido {padding:3px 0 3px 7px; text-align:left; font:normal 11px/17px Verdana, Arial, "Helvetica", sans-serif;}

.empresa{ width:185px; padding:28px 10px 50px 5px; float:left; background:url(../images/fondo_empresa.png) no-repeat; height:184px;}
.empresa ul li{ padding:3px 0 19px 0; text-align:center; font:bold 12px/17px Verdana, Arial, "Helvetica", sans-serif;}
	
.institucion{ width:180px; padding:28px 10px 50px 10px; height:184px; float:left; margin:0 23px;	background:url(../images/fondo_institucion.png) no-repeat;}
.institucion ul li{	color:#fff; padding:3px 0 19px 0; text-align:center; font:bold 12px/17px Verdana, Arial, "Helvetica", sans-serif;}

.persona{ width:180px; padding:40px 10px 50px 10px; float:left; height: 184px; background:url(../images/fondo_persona.png) no-repeat 0 0;}
.persona ul li{ color:#fff; padding:3px 0 19px 0; text-align:center; font:bold 12px/17px Verdana, Arial, "Helvetica", sans-serif;}

/* =web actualidad ------------------------------------------ */

#actualidad { text-align: left; margin: 10px auto; padding: 15px 20px 15px 35px; border:0; width: 935px; background: url(../images/actualidad.png) no-repeat; }

#encabezado { margin: 0 0 7px 0; }
#encabezado.tituloactualidad { font:bold 12px Verdana, Arial, Helvetica, sans-serif; color:#fff;}

#side-a {
	width: 300px;
	height:385px;
	float:left;
	padding-top: 17px;
	padding-right: 15px;
	padding-bottom: 0;
	padding-left:80px;
}
#side-a a{ font: bold 11px Verdana, Arial, "Helvetica", sans-serif;color:#7caeef;}
#side-a a:hover { text-decoration:underline;}

#side-b { ;
	margin: 0;
	float: left;
	width: 300px;
	height: 385px;
	padding-top: 17px;
	padding-right: 15px;
	padding-bottom: 0;
	padding-left: 130px;
}
#side-b a{ font: bold 11px Verdana, Arial, "Helvetica", sans-serif;color:#7caeef;}
#side-b a:hover { text-decoration:underline;}

#piepagina {
	clear: both;
	padding: 7px 20px 7px 0;
	margin-right:30px;
	width:94,5%;
	height:20px;
	background-color: #868686;
}
#piepagina a {font: bold 10px Verdana, Arial, Helvetica, sans-serif; color:#fff;}
#piepagina a:hover { text-decoration:underline; color:#fff;}
#piepagina li {float:left; margin-left:25px;}
#piepagina li#anterior { width:400px; text-align:left;}
#piepagina li#posterior { width:400px; text-align:right;}

/* =pie de pagina -------------------------------------------- */
#bottom{ background:url(../images/fondo_menu2.png) no-repeat; height:57px; margin:490px 0 0 0; color:#FFF; text-align:center; padding-top:6px; }

