/* grabbed from local "css.htm" */

BODY {
	MARGIN-TOP: 0px; BACKGROUND-COLOR: #fff; TEXT-ALIGN: center
}
#contenido {
	MARGIN: 0px auto; WIDTH: 877px; HEIGHT: 633px
}
#textoHeader {
	MARGIN-TOP: 25px; FONT-WEIGHT: bold; FONT-SIZE: 22px; MARGIN-LEFT: 340px; WIDTH: 350px; COLOR: #fff; FONT-FAMILY: Arial, Helvetica, sans-serif
}
#textoPromo {
	MARGIN-TOP: 0px; PADDING-LEFT: 10px; FONT-WEIGHT: bold; FONT-SIZE: 20px; MARGIN-LEFT: 10px; WIDTH: 350px; COLOR: #fff; PADDING-TOP: 5px; FONT-FAMILY: Arial, Helvetica, sans-serif; TEXT-ALIGN: left
}
.textoTitulo {
	FONT-WEIGHT: bold; FONT-SIZE: 24px; COLOR: #9c0; FONT-FAMILY: Arial, Helvetica, sans-serif; TEXT-ALIGN: left
}
.textoSubTitulo {
	FONT-WEIGHT: bold; FONT-SIZE: 18px; COLOR: #666; FONT-FAMILY: Arial, Helvetica, sans-serif; TEXT-ALIGN: left
}
.textoSubHeader {
	FONT-WEIGHT: bold; FONT-SIZE: 18px; COLOR: #9c3; FONT-FAMILY: Arial, Helvetica, sans-serif; TEXT-ALIGN: left
}
.textos {
	FONT-SIZE: 12px; COLOR: #000; FONT-FAMILY: Arial, Helvetica, sans-serif; TEXT-ALIGN: left
}
.txtPromo {
	FONT-WEIGHT: normal; FONT-SIZE: 12px; COLOR: #fff; FONT-FAMILY: Arial, Helvetica, sans-serif; TEXT-ALIGN: left
}
.creditos {
	FONT-SIZE: 10px; COLOR: #666; FONT-FAMILY: Arial, Helvetica, sans-serif; TEXT-ALIGN: center
}
.txtPromo {
	FONT-WEIGHT: normal; FONT-SIZE: 12px; COLOR: #fff; FONT-FAMILY: Arial, Helvetica, sans-serif; TEXT-ALIGN: left
}
.txtPromoTitle {
	FONT-WEIGHT: bold; FONT-SIZE:x-large; COLOR: #fff; FONT-FAMILY: Arial, Helvetica, sans-serif; TEXT-ALIGN: left
}

/* grabbed from "xxx_mbps.htm" */

#ALIVECHAT {
	FLOAT: right; MARGIN-LEFT: 30px; WIDTH: 120px; MARGIN-RIGHT: 20px; 
	
/*	border-left: solid black; border-right: solid black; border-bottom: solid black; border-top: solid black; 
*/
}

<!-- mey *** this is very likely obsolete -->
#mbps_banner {
	margin-left:10px;
	margin-top:0px;
}

/* this is the text that appears immediately below the banner graphic */
#mbps_header
{
	margin-left:25px; margin-top:6px;
}

/* just a tricky way of displaying an image, the DIV section is actually empty in the HTML page 
   but this allows us to control the fine details of layout from shared style sheet

	mey *** the TOP attribute is very likely obsolete.
*/
#office_building 
{
	FLOAT: left; BACKGROUND-IMAGE: url(images/metricfiber/officebuilding.jpg); background-repeat:no-repeat; WIDTH: 200px; HEIGHT: 180px;
	TOP: 120px; 
}

/* top tier of content, the one with the building graphic */
#mbps_content {
	FLOAT: left; WIDTH: 280px; TOP: 117px; TEXT-ALIGN: left; margin-left:10px; margin-top:10px;
}

#mbps_content UL 
{
	line-height:16px; 
}

#mbps_content LI {
	line-height:16px; 
	list-style-type:square;
}

/* header for lower tier of content */
#mbps_content2 {
	FLOAT: left; WIDTH: 350px; TEXT-ALIGN: left; margin-left:40px; margin-top:10px;
 }

#mbps_content2 LI {
	line-height:16px;
	list-style-type:square;
}

/* lower tier's text content */
#mbps_content3 {
	margin-left:10px; margin-top:10px;
}

/* link to metric fiber diagram */
#mbps_content4 {
	margin-left:0px; margin-top:24px;
}

/* the DIV section contains text that overlays the image specified here */
#guarantee {
	margin-left: 10px; margin-top: 16px; LEFT: 20px; FLOAT: left; BACKGROUND-IMAGE: url(images/metricfiber/guarantee.jpg); background-repeat:no-repeat; WIDTH: 409px; TOP: 409px; HEIGHT: 159px; TEXT-ALIGN: left
}

/* mey *** very likely obsolete */
#vertical_line {
	LEFT: 0px; FLOAT: left; WIDTH: 20px; TOP: 409px; HEIGHT: 159px
}

/* mey *** very likely obsolete */
#mbps_footer {
	MARGIN-TOP: 25px; LEFT: 0px; FLOAT: left; WIDTH: 877px; TOP: 568px; HEIGHT: 65px
}

.textosub {
	COLOR: #333
}

#just_for_debugging_layout /* replace the label with whatever DIV section you want to outline */ 
{
	border-left:solid black; border-right: solid black; border-bottom: solid black; border-top: solid black; 	
}

/* ============ diagram page ============ */

#metricfiber_diagram 
{
	margin-top:10px;
	width: 510px; height: 610px;
	FLOAT: left; BACKGROUND-IMAGE: url(images/metricfiber/metricfiber_diagram.jpg); background-repeat:no-repeat;
}

#hostedpbx_diagram 
{
	margin-top:10px;
	width: 510px; height: 680px;
	FLOAT: left; BACKGROUND-IMAGE: url(images/hostedpbx/hostedpbx_diagram.jpg); background-repeat:no-repeat;
}

#voipservice_diagram 
{
	margin-top:0px;
	width: 510px; height: 590px;
	FLOAT: left; BACKGROUND-IMAGE: url(images/voip/voipservice_diagram.jpg); background-repeat:no-repeat;
}
