/* project: Andr?s D?az
   design: Andr?s Diaz (www.nexodigital.cl) */

   
body { padding: 0; margin: 0; font: 0.7em Arial, sans-serif; line-height: 1.5em; background: #919191; color: #454545; }
a { color: #0E4D8B; background: inherit; }
a:hover { color: #000; background: inherit;}
a.title { color: #B41A1A; background: #FFF; }

h1 { font: bold 2em Arial, Sans-Serif; letter-spacing: -1px; padding: 16px 0 0 8px; margin: 0; }
h2 { margin: 0px 0px 5px 0px; font: normal 1.6em Arial, Sans-Serif; letter-spacing: -0.8px; color: #24845F; }
h1 a { color: #FFF; background: inherit; }
h1 a, h2 a { text-decoration: none; }
h1 a:hover, h2 a:hover { color: #BFE1ED; background: inherit; }
h3 { font: 1.2em Arial, Sans-Serif; margin: 0 0 0px 0; padding: 0; }
h4 { font: 1.2em Arial, Sans-Serif; margin: 75px 0px 0px 0px; padding: 0; }
p {	margin: 0 0 0px 0; line-height: 1.5em; }
form { margin: 0; }
input.search { width: 199px; border: none; background: #FFF url(input.gif); padding: 4px; color: #808080; }
input.submit { height: 24px; font-weight: bold; width: 53px; border: none; background: #D96855 url(button.gif); padding: 3px; color: #FFF; }

/* layout
   ------ */
   .background { 
		margin: 00px auto;
	width: 960px;

	background: url(bg.gif) repeat-y;
	color: #F5F5F5;
	
}
   
.content { 
	margin: 00px auto;
	width: 920px;
	background: url(bg.gif) repeat-y;
	color: #000;
	
}

.logo {	padding: 0px 0 0 0px; }

/* header */
.header { padding: 0px 0px 0 00px; }
.header_bottom { clear: both; background: #FFF; }
    
/* navigation */
#nav {width: 920px; color: #939393; font-size: 14px; line-height: 42px; font-family: "Trebuchet MS", Tahoma, Helvetica, sans-serif; text-decoration: none; text-transform: uppercase; display: block; float: none; padding: 0 0px; cursor: pointer; background: #fff url(toolbar_bg.gif) repeat-x; }
#nav ul { margin:0; list-style:none; padding: 0;  height: 50px }
#nav a, #nav strong, #nav span { float:none; display:block; color:#939393; padding: 0px 10px 10px 10px; background: #fff url(toolbar_bg.gif); text-decoration:none; }
#nav a { float:none; }
#nav li { background: url(toolbar_div.png) repeat-x ; height: 42px; float:left; color: #FFF; margin:0; padding:0 0 0 2px; }
#nav a:hover { color:#24845F; background: url(toolbar_bg.gif)repeat-x; }   


.sf_left {
	float: left;
	width: 441px;
	height: 60px;
	background: #fff url(logo.gif) repeat-x; 
	color: #FFF;
	border-top: 0px solid #137DA2;
	border-bottom: 0px solid #000;
	padding: 00px 0 0px 0px;
}

.sf_right {
	width: 479px;
	background: #5BB2D1 url(top_bg.gif) repeat-x; 
	height: 60px;
	float: right;
}

.main_foto {
	width: 920px;
	background: #fff url(top.jpg) repeat-x; 
	height: 213px;
	float: right;
}

.main_interna {
	width: 920px;
	background: #fff url(top_interna.jpg) repeat-x; 
	height: 130px;
	float: right;
}

.topsection {
	width: 920px;

}
		
.subheader {
	padding: 8px;
	background: #f0f0f0;
	color: #808080;
}

.content2 {
	width: 881px;
padding: 00px 00px 00px 20px;
background: #F5F5F5

}

.content_top {
	width: 881px;
		height:20px;
	background: #fff url(content_top.gif) repeat-x; 

}

.content_middle {
	width: 881px;
	background: #F5F5F5 url(content_middle.gif) repeat-y; 
	padding: 00px 00px 00px 0px;

}

.content_bottom {
	width: 881px;
	height:20px;
	background: #fff url(content_bottom.gif) repeat-x; 

}

/* left side
   --------- */

.left {
	float: left;
	width: 195px;
		height: 207px;
	margin: 0 0 10px 0;
}

	.box_top {
		background: #fff ;
		border-right: 2px solid #F0F0F0;
		padding: 7px 4px 0 7px;
		color: #808080;
		height: 22px;
		width: 170px;
	}
	
	.box_top h2 {
		color: #808080;
		background: inherit;
		padding: 4px 0 0 5px;
		margin: 0;
	}
	
	.boxleft {
		border-left: 0px solid #F0F0F0;
		border-right: 2px solid #F0F0F0;
		padding: 0 4px 0 7px;
		margin: 0;
		width: 170px;
		height: 280px;
		color: #595959;
		background: #FFF;
	}
	
	.box_bottom {
		background: #fff;
		color: #fff;
		height: 13px;
		width: 160px;
		margin: 0 0 7px 0;
	}
	
		/* left and central column */
		.left_side { float: left; width: 180px; padding: 0px 5px 5px 8px; }
		
		.article {padding: 0px 0px 25px 15px; margin-bottom: 25px; border-bottom: 2px dotted #CECECE; width: 457px;}
		
		.contenido {float: left; padding: 0px 0px 0px 5px; margin-bottom: 0px; border-bottom: 0px dotted #CECECE; width: 620px;}
		

		
/* right side
   ---------- */
		
.right { float: right; width: 145px; margin: 0px 20px 0px 0px;}s
		
/*img { float: right; margin: 0 9px 3px 0;}*/

.right_side {
	float: left;
	width: 170px;
	height: 117px;
	background: url(home/esquema_riles.gif) repeat-x; 
	border-right: 2px dotted #CECECE;
	padding: 0px 0px 0px 0px;
}

.esquema_left {
	float: left;
	width: 170px;
	height: 117px;
	background: url(home/esquema_riles.gif) repeat-x; 
	border-right: 2px dotted #CECECE;
	padding: 0px 0px 0px 0px;
}

.esquema_centro {
	float: left;
	width: 160px;
	height: 117px;
	background: url(home/esquema_energia.gif) repeat-x; 
	border-right: 2px dotted #CECECE;
	padding: 0px 0 0px 0px;
}

.esquema_right {
	float: left;
	width: 160px;
	height: 77px;
	background: url(home/esquema_aguasserv.gif) repeat-x; 
	border-top: 0px solid #CECECE;
	padding: 00px 0 0px 0px;
}

/* footer
   ------ */

.footer  { color: #1d2a44; background-color: #f5f5f5; text-align: center; clear: both; padding: 10px 0px; border-bottom: 0px solid #5f5f5f; width: auto; height: 50px; div-align: center }
.footer p {	line-height: 2em; }
.footer a {	color: #4F4F4F; background: #f0f0f0; border-bottom: 1px dotted #808080; text-decoration: none; } 

/* forulario contacto
   ------ */

<style type="text/css">
<!--

form {  /* set width in form, not fieldset (still takes up more room w/ fieldset width */
  font:100% arial,sans-serif;
  margin: 0;
  padding: 0;e
  min-width: 500px;
  max-width: 700px;
  width: 560px; 
}

form fieldset {
  / * clear: both; note that this clear causes inputs to break to left in ie5.x mac, commented out */
  border-color: #1C2A44;
  border-width: 1px;
  border-style: solid;
  padding: 10px;        /* padding in fieldset support spotty in IE */
  margin: 0;
}

form label { 
	display: block;  /* block float the labels to left column, set a width */
	float: left; 
	width: 160px; 
	padding: 0; 
	margin: 5px 0 0; /* set top margin same as form input - textarea etc. elements */
	text-align: right; 
}


form fieldset legend {
	font-size:1.1em; /* bump up legend font size, not too large or it'll overwrite border on left */
                       /* be careful with padding, it'll shift the nice offset on top of border  */
}

form input, form textarea {
	/* display: inline; inline display must not be set or will hide submit buttons in IE 5x mac */
	width:auto;      /* set width of form elements to auto-size, otherwise watch for wrap on resize */
	margin:5px 0 0 10px; /* set margin on left of form elements rather than right of
                              label aligns textarea better in IE */
}

form input#reset {
	margin-left:0px; /* set margin-left back to zero on reset button (set above) */
}

textarea { overflow: auto; }

form small {
	display: block;
	margin: 0 0 5px 160px; /* instructions/comments left margin set to align w/ right column inputs */
	padding: 1px 3px;
	font-size: 88%;
}

form .required{font-weight:bold;} /* uses class instead of div, more efficient */

form br {
	clear:left; /* setting clear on inputs didn't work consistently, so brs added for degrade */
}
-->
</style>