body {
	margin: 0;
	background: #fff;
	font-size: 62.5%;
	font-family: arial,helvetica,sans-serif;
	color: #053A57;
	text-align: center;
}

p {	font: 1.2em/135% arial,helvetica,sans-serif; }
td, li, dd { font: 1.2em arial,helvetica,sans-serif; }
a img { border: none; }

.right {
	float: right;
	padding: 1em 0 1em .5em;
}

a { color: #053A57; }
a:hover { color: #74A4BF; }

/***************** estructura ******************/

#contenedor {
	position: relative;
	margin: 0 auto;
	width: 77em;
	text-align: left;
	background: transparent url("images/contenido_lateral.gif") top right no-repeat;
}

#logo {
	position: absolute;
	top: 0;
	left: 0;
}

#logo h1 {
	width: 221px;
	height: 261px;
	text-indent: -400em;
	margin: 0;
}

#logo h1 a { 
	display: block;
	width: 221px;
	height: 261px;
	background: transparent url("images/logo_supragestion.gif") 0 0 no-repeat;
	text-decoration:none;
}

#logo h1 a.interior { background-image: url("images/logo_supragestion_over.gif"); }
/*********** menu *************/


#menu {
	margin: 0 0 0 22.6em;
	padding: 3em 0 0 0;
	list-style: none;
}

#menu li {
	list-style: none;
	float: left;
	padding: 0;
	margin: 0 .3em 0 0;
}

#menu li a {
	display: block;
	width: 132px;
	height: 108px;
	text-indent: -400em;
	text-decoration: none;
}

#menu li a.servicios { background: transparent url("images/menu01.gif") 0 0 no-repeat; }
#menu li a.metodologia { background: transparent url("images/menu02.gif") 0 0 no-repeat; }
#menu li a.cobertura { background: transparent url("images/menu03.gif") 0 0 no-repeat; }
#menu li a.contacto { background: transparent url("images/menu04.gif") 0 0 no-repeat; }

#menu li a.servicios:hover, #menu li a.metodologia:hover, #menu li a.cobertura:hover, #menu li a.contacto:hover { background-position: 0 -108px; }

#menu li a.actual {background-position: 0 -108px;}
/************** lateral ****************/

#lateral {
	float: left;
	width: 19.7em;
	padding: 17.5em 0 0 2.4em;
}

/************ contenido ****************/

#contenido {
	background: transparent url("images/contenido_fondo.gif") 0 0 repeat-x;
	float: left;
	width: 50.7em;
	padding: 0 2em;
	border-top: 2px solid #fff;
}

#contenido h2.claim {
	text-indent: -400em;
	margin: 2em 0 0;
	height: 83px;
	background: transparent url("images/claim.gif") top center no-repeat;
}

#contenido h2.nuestros_servicios {
	text-indent: -400em;
	margin: 1em 0 0;
	height: 34px;
	width: 500px;
	background: transparent url("images/nuestros_servicios.gif") top left no-repeat;
}
#contenido h2.metodologia {
	text-indent: -400em;
	margin: 1em 0 0;
	height: 34px;
	width: 500px;
	background: transparent url("images/metodologia.gif") top left no-repeat;
}
#contenido h2.cobertura {
	text-indent: -400em;
	margin: 1em 0 0;
	height: 34px;
	width: 500px;
	background: transparent url("images/cobertura.gif") top left no-repeat;
}
#contenido h2.contacto {
	text-indent: -400em;
	margin: 1em 0 0;
	height: 34px;
	width: 500px;
	background: transparent url("images/contacto.gif") top left no-repeat;
}
.cuadro {
	height: 91px;
	width: 22em;
	padding: 1.8em 0 1em;
	background: transparent url("images/home_cuadros_fondo.gif") 0 0 repeat-x;
	float: left;
	margin: 0 4.5em 0 0;
}
.sinseparador { margin: 0; }

.cuadro img { float: left; padding: 1px; border: 1px solid #D7D7D7; }
.cuadro p {	margin: 0 0 1em 6em; font: 1.1em arial,helvetica,sans-serif; }
.cuadro a { text-decoration: none; color: #053A57; font-weight: bold; }
.cuadro a.vermas  { margin: 0 0 0 5em; font-weight: bold; background: #fff url("images/arrow1.gif") 0 50% no-repeat; padding: 0 0 0 .6em; text-decoration: none; color: #053A57; }
.cuadro a:hover { text-decoration: underline; }


/************** servicios ********************/

#servicios { list-style: none; }
#servicios li { list-style: none; padding: .5em 0; }
#servicios a {
	padding: .4em 0 .4em .7em;
	font-weight: bold;
	text-decoration: none;
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: 0 50%;
}
#servicios ul { margin: 0 0 0 .5em; }
#servicios ul li { background: transparent url("images/listado_sub.gif") 0 50% no-repeat; padding: .2em 0 .2em .7em; font: .9em arial,helvetica,sans-serif; }

/***************** formulario **********************/
input { font-family: Tahoma, Verdana, Arial; font-size: 11px; color: #FFFFFF; background-color: #74A4BF; border: #053A57; border-style: solid; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px}
select { font-family: Tahoma, Verdana, Arial; font-size: 11px; color: #FFFFFF; background-color: #74A4BF; border: #053A57; border-style: solid; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px}

/***************** proteccion_de datos **********************/
#proteccion {
	margin:1em;
	width: 600px;
}
.letra {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #053A57;
	text-align: left;
}
#proteccion li {
	padding: .5em 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #053A57;
}
/***************** pie **********************/

#pie { clear: both; background: transparent url("images/pie.gif") 0 0 no-repeat; }
#pie p { text-align: center; font: 1em/3em arial,helvetica,sans-serif; }