@charset "utf-8";
/* CSS Document */

body {
margin: 0;
padding: 0;
background-color: #FFFFFF;
background-image: url(../images/fondo.gif);
background-repeat: repeat-y;
background-position: center;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #444444;
}

/*TITULOS*/
h1, h2, h3, h4, h5, h6 { margin: 0 0 10px; padding: 0 0 0 10px; height: 20px; line-height: 20px; font-family: Arial Narrow, Arial, Helvetica, sans-serif; font-size: 13px; text-align: left; cursor: default;}
h1 {background-color: #F47920; color: #FFFFFF;}
h2 {margin-bottom: 0;}

/*LINKS*/
a {text-decoration: none; color: #F47920; cursor: pointer;}
a:hover { text-decoration: underline; }
a:active {color: #CCCCCC;}

/*TEXTO*/
p {margin: 0 0 10px; text-align: left; line-height: 15px; cursor: default;}
img {border-style: none;}

ul {list-style-image: url(../images/bullet.gif);}

/*POSICION*/
.page {width: 1000px; margin: 0 auto; background-color: #FFFFFF;}
.logo {width: 800px; height: 100px; position: absolute; top: 0;}
.opciones {width: 160px; margin: 0 0 0 800px; position: absolute; top: 45px;}
.intro {width: 1000px; height: 240px; position: absolute; top: 70px;}
.header {width: 1000px; height: 120px; position: absolute; top: 70px; background-image: url(../images/contacto/contacto.jpg); background-position: top left; background-repeat: no-repeat;}
.menu {width: 1000px; height: 50px; position: absolute; top: 190px; border-top: solid 2px #000000;}
.submenu, .pop, .boceto, .texto_izq { margin: 0 0 10px 40px; width: 218px; position: absolute; top: 240px; background-color: #FFFFFF;}
.modulo {margin: 0 40px 0 274px; padding: 0 0 20px; width: 680px; position: absolute; top: 240px; float: left;}

/*PROFUNDIDAD Y VISIBILIDAD*/
.boceto {z-index: 0;}
.submenu {z-index: 1;}
.pop {z-index: 2; visibility: hidden;}

/*OPCIONES*/
.opciones ul {margin: 0; padding: 0; list-style: none; float: right; background-color: #FFFFFF;}
.opciones li {margin: 0; position: relative; float: left; list-style: none;}
.opciones a {margin: 0 0 0 10px; padding: 20px 0 0; display: block; width: 65px; height: 0; overflow: hidden; background-repeat: no-repeat; background-position: top right; text-decoration: none;}
a#op01 {background-image: url(../images/op1a.gif)}
a#op02 {background-image: url(../images/op2a.gif)}
a#op01:hover {background-image: url(../images/op1b.gif)}
a#op02:hover {background-image: url(../images/op2b.gif)}
a#op01:active {background-image: url(../images/op1c.gif)}
a#op02:active {background-image: url(../images/op2c.gif)}

/*MENU*/
.menu ul {margin: 0 0 0 20px; padding: 0; list-style: none; float: left;}
html>body .menu ul {margin: 0 0 0 40px;}
.menu li {margin: 0; display: inline; position: relative; list-style: none;}
.menu a {margin: 0; padding: 30px 0 0; display: block; float: left; width: 140px; height: 0; overflow: hidden; border-right: 1px solid #000000; background-repeat: no-repeat; background-position: top left; text-decoration: none;}
a#menu01 {background-image: url(../images/menu1a.gif); border-left: 1px solid #000000;}
a#menu02 {background-image: url(../images/menu2a.gif);}
a#menu03 {background-image: url(../images/menu3a.gif);}
a#menu04 {background-image: url(../images/menu4a.gif);}
a#menu05 {background-image: url(../images/menu5a.gif);}
a#menu01:hover {background-image: url(../images/menu1b.gif);}
a#menu02:hover {background-image: url(../images/menu2b.gif);}
a#menu03:hover {background-image: url(../images/menu3b.gif);}
a#menu04:hover {background-image: url(../images/menu4b.gif);}
a#menu05:hover {background-image: url(../images/menu5b.gif);}
a#menu01:active {background-image: url(../images/menu1c.gif);}
a#menu02:active {background-image: url(../images/menu2c.gif);}
a#menu03:active {background-image: url(../images/menu3c.gif);}
a#menu04:active {background-image: url(../images/menu4c.gif);}
a#menu05:active {background-image: url(../images/menu5c.gif);}

/*SUBMENU + POPUP + BOCETO*/
.pop {border: solid 1px #F47920; filter:alpha(opacity=90); opacity:0.9;}
a.cerrar {float: right; margin: 5px 10px 0 0; height: 15px; line-height: 15px; color: #F47920; text-decoration: none;}
a.cerrar:hover {text-decoration: underline;}

.submenu {border: solid 1px #E0E0E0; }
.pop h1, .submenu h1 {height: 15px; line-height: 15px; margin: 5px 10px 8px; padding: 0; font-size: 14px; font-weight: normal; color: #000000; background-color: #FFFFFF; text-transform: uppercase;}
.pop h2, .submenu h2 {margin: 0 10px 4px; padding: 0 10px; background-color: #999999; color: #FFFFFF; font-family: Arial, Helvetica, sans-serif; font-size: 11px; font-weight: bold;}
.pop ul, .submenu ul {margin: 5px 10px 8px; padding: 0; list-style: none; list-style-image: none;}
.pop li a, .submenu li a {padding: 0 15px; display: block; height: 18px; line-height: 18px; color: #666666; font-size: 12px;}
.pop li a:hover, .submenu li a:hover {background-color: #DDDDDD; color: #000000; text-decoration: none;}
.pop li a:active, .submenu li a:active {background-color: #EEEEEE; color: #AAAAAA;}

.boceto {padding: 220px 0 0 0; height: 0; background-repeat: no-repeat; background-position: top left;}

/*MODULO*/
.modulo p {margin: 0 245px 10px 10px; text-align: justify;}
/*.modulo ul {margin: 0 245px 10px 10px;}
.modulo li {margin: 0 0 10px;}*/
.modulo ul {margin: 0 245px 10px 10px; padding: 0 0 0 16px; list-style-image: url(../images/bullet.gif);}
.modulo li {margin: 0 0 8px; padding: 0;}
.modulo .icono {padding: 4px; border: 1px solid #CCCCCC;}
.modulo #icono01 {margin: 0 0 0 460px; position: absolute;}
html>body .modulo #icono01 {margin: 10px 0 0 460px;}
.modulo #icono02 {position: absolute; margin: 250px 0 0 460px;}
.modulo #icono03 {position: absolute; margin: 500px 0 0 460px;}
.modulo #icono04 {position: absolute; margin: 750px 0 0 460px;}
.modulo #icono05 {
	position: absolute;
	margin: 1000px 0 0 460px;
	left: -2px;
	top: 54px;
}
.modulo #icono06 {position: absolute; margin: 1250px 0 0 460px;}
.modulo #icono07 {position: absolute; margin: 1500px 0 0 460px;}

/*INICIO*/
#inicio .menu {top: 310px;}
#inicio .pop, #inicio .submenu, #inicio .boceto, #inicio {top: 360px;}
#inicio .modulo {top: 360px; width: 215px; margin: 0 40px 0 279px;}
#inicio #inicio02 {margin: 0 0 0 518px;}
#inicio #inicio03 {margin: 0 0 0 757px; height: 200px; background-image: url(../images/inicio/iso.jpg); background-repeat: no-repeat; background-position: center top;}
#inicio a#op01 {background-image: url(../images/op1d.gif);}
#inicio .modulo p {text-align: left; margin: 0 0 10px 0;}
#inicio .icono {margin: 0 76px 5px 0; padding: 4px; border: 1px solid #CCCCCC; float: right;}
#inicio .boceto {background-image: url(../images/draft2.gif);}

#inicio #inicio02 p {margin: 0;}
#inicio #inicio02 ul {margin: 0 0 0 16px; padding: 0;}
#inicio #inicio02 li {margin: 0; padding: 0;}

/*NOSOTROS*/
#quienes_somos a#menu01, #historia a#menu01, #organigrama a#menu01, #capital_humano a#menu01, #reconocimientos a#menu01, #publicaciones a#menu01 {background-image: url(../images/menu1d.gif);}
#quienes_somos a#sub01a, #historia a#sub01b, #organigrama a#sub01c, #capital_humano a#sub01d, #reconocimientos a#sub01e, #publicaciones a#sub01e {background-color: #F47920; color: #FFFFFF; font-weight: bold;}
#quienes_somos .header, #historia .header, #organigrama .header, #capital_humano .header, #reconocimientos .header, #publicaciones .header {background-image: url(../images/nosotros/nosotros.jpg);}

.texto_izq {top: 395px;}
.texto_izq h1 {margin: 0; padding: 0; background-color: #FFFFFF; color: #F47920; font-family: Arial, Helvetica, sans-serif; font-size: 14px;}
.texto_izq p {font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-style: italic; color: #888888;}

#capital_humano .modulo .icono {margin: 0;}
#capital_humano .modulo div {margin: 0 0 10px 10px; padding: 0; width: 670px; min-height: 160px;}
#capital_humano .modulo div h2 {margin: 0 0 7px; padding: 0 10px; width: 410px; height: 20px; display: block; background-color: #EEEEEE; color: #444444; line-height: 20px;}
#capital_humano .modulo div h2 span {float: right;}
#capital_humano .modulo div img {margin: -27px 0 0 0; padding: 4px; border: 1px solid #CCCCCC; float: right;}
#capital_humano .modulo div p {margin: 0 240px 14px 0; padding: 0;}

#reconocimientos .modulo ul {margin-bottom: 30px;}
#reconocimientos #icono01 {border-color: #FFFFFF;}
#reconocimientos #icono02, #reconocimientos #icono03, #reconocimientos #icono04 {position: relative; margin: 0 14px 0 0; float: left;}
 #reconocimientos #icono04 {margin: 0;}

/*EXPERIENCIA*/
#emblematicos a#menu02, #est_sanitarios a#menu02, #est_viales a#menu02, #est_arquitectonicos a#menu02, #fis_sanitarios a#menu02, #fis_viales a#menu02, #fis_arquitectonicos a#menu02 {background-image: url(../images/menu2d.gif);}
#est_sanitarios a#sub02a, #est_viales a#sub02b, #est_arquitectonicos a#sub02c, #fis_sanitarios a#sub02d, #fis_viales a#sub02e, #fis_arquitectonicos a#sub02f {background-color: #F47920; color: #FFFFFF; font-weight: bold;}
#emblematicos .header {background-image: url(../images/experiencia/emblematicos.jpg);}
#est_sanitarios .header, #fis_sanitarios .header {background-image: url(../images/experiencia/sanitarios.jpg);}
#est_viales .header, #fis_viales .header {background-image: url(../images/experiencia/viales.jpg);}
#est_arquitectonicos .header, #fis_arquitectonicos .header {background-image: url(../images/experiencia/arquitectonicos.jpg);}

#emblematicos h2.emblematicos {background-color: #F47920;}
ul.emblematicos {margin-bottom: 10px;}
ul.emblematicos li {float: left;}
ul.emblematicos li a {width: 60px; height: 50px; margin: 0 4px 4px 0; padding: 0; display: block; border: solid 1px #FFFFFF;}
ul.emblematicos li a:hover {border: solid 1px #F47920;}
#emblematicos .modulo div, #est_arquitectonicos .modulo div, #fis_arquitectonicos .modulo div {width: 420px; height: 340px; margin: 0 0 10px 15px; float: right;}

#est_sanitarios .modulo #icono02 {margin: 220px 0 0 460px;}
#est_sanitarios .modulo #icono03 {margin: 430px 0 0 460px;}

#terminales {width: 454px; margin: 0 40px 0 279px;}
#terminales p {margin: 0 160px 14px 0;}
#terminales ul, #terminales li {margin: 0;}
#terminales #icono01 {margin: 0 0 0 314px; position: absolute;}
#terminales #icono01 {margin: 10px 0 0 314px;}
#otros {width: 215px; margin: 0 0 0 757px; height: 200px;}
#otros a {width: 215px; height: 60px; display: block; margin: 0 0 5px 0; float: left; border: solid 1px #CCCCCC;}
#otros a img {position: absolute; margin: 5px 0 0 5px;}
#otros a p {width: 140px; position: absolute; margin: 20px 0 0 70px; display: block; text-align: center; color: #333333;}
#otros a:hover {background-color: #DDDDDD; border-color: #F47920; text-decoration: none;}
#otros a:hover p {color: #000000;}

/*CLIENTES*/
#clientes a#menu03 {background-image: url(../images/menu3d.gif);}
#clientes .modulo {width: 914px; margin: 0 40px;}
#clientes .modulo div {width: 220px; height: 90px; margin: 0 6px 6px 0; float: left; border: solid 1px #CCCCCC;}
#clientes .modulo div img {position: absolute; margin: 5px 0 0 5px;}
#clientes .modulo div p {width: 125px; position: absolute; margin: 30px 0 0 90px; display: block; text-align: center;}
#clientes .header {background-image: url(../images/clientes/clientes.jpg);}

/*VINCULOS*/
#vinculos a#menu04 {background-image: url(../images/menu4d.gif);}
#vinculos .header {background-image: url(../images/vinculos/vinculos.jpg);}
#vinculos .boceto {background-image: url(../images/draft1.gif)}

#vinculos .modulo {width: 454px; margin: 0 40px 0 279px;}
#vinculos .modulo p {margin: 0 0 14px 0;}

#vinculos .modulo#descargas {width: 215px; margin: 0 0 0 757px; height: 200px;}
#vinculos .modulo#descargas div {width: 215px; height: 60px; margin: 0 0 5px 0; float: left; border: solid 1px #CCCCCC;}
#descargas div img {position: absolute; margin: 5px 0 0 5px;}
#descargas a {margin: 10px 0 0 70px; display: block; text-align: left; color: #333333;}
/*#descargas a:hover {background-color: #DDDDDD; border-color: #F47920; text-decoration: none;}
#descargas a:hover p {color: #000000;}*/

/*CONTACTO*/
#contacto a#menu05 {background-image: url(../images/menu5d.gif);}
#contacto .boceto {background-image: url(../images/draft2.gif);}

#contacto form {width: 430px; margin: 0; text-align: right;}
#contacto form {font-size: 11px;}
#contacto form p {margin: 0 0 10px; padding: 5px 0; text-align: center; font-size: 12px; font-weight: bold; background-color: #FFEE99;}
#contacto form span {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; color: #999999;}
#contacto form label {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; line-height: 25px;}
#contacto form input {margin: 1px 1px 1px 10px; padding: 4px 4px 0; width: 325px; height: 18px; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; vertical-align: top;  background-color: #EEEEEE; border: 1px solid #CCCCCC;}
html>body #contacto form input {margin: 2px 2px 2px 10px;}
#contacto form textarea {margin: 1px 1px 1px 10px; padding: 4px 4px 0; width: 325px; background-color: #EEEEEE; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; border: 1px solid #CCCCCC; vertical-align: top;}
html>body #contacto form textarea {margin: 2px 2px 2px 10px;}
#contacto form #send, #contacto form #clear {width: 80px; height: 20px; margin: 4px; padding: 0; background-color: #FFBB22; background-image: url(../images/contacto/enviarb.gif); background-repeat: no-repeat; border: none; line-height: 0; cursor: pointer;}
#contacto form #clear {background-image: url(../images/contacto/limpiarb.gif);}
a#form_generator {width: 335px; height: 18px; margin: 20px 0 0 92px; display: block; font-size: 10px; text-align: center; line-height: 18px; color: #FFFFFF; background-color: #FFFFFF; cursor: default;}
a:hover#form_generator {color: #DDDDDD; text-decoration: none;}

.texto_der {width: 218px; height: 163px; position: absolute; margin: 0 0 0 452px; padding: 20px 5px; background-color: #EEEEEE;}
.texto_der p {width: 200px; position: absolute; padding: 0 0 0 15px; display: block;}
.texto_der p span {font-weight: bold;}
.texto_der a#contacto_email {width: 158px; height: 0; display: block; margin: 0 0 8px; padding: 18px 0 0; overflow: hidden; background-image: url(../images/contacto/contacto_email.gif); background-repeat: no-repeat; background-position: top left;}
