#alert_table .data_row td { border-top: 1px solid #c0c5df; 	font:normal 11px Verdana;  }
tr.header_row { margin-top: 20px; }
table.section { border-top: 1px solid #3366cc;border-bottom: 1px solid #3366cc; }


/* 
the following hack prevent the scrollbars from 'bumping' the page content
by creating a permanent empty scrollbar when page does not overflow... can
also be accomplished with a similar hack: margin-bottom: 1px;   
*/
html { 
	height: 100%; 
	overflow-y: scroll;
}

body {
	background:#B27F56 url(../images/body_background.jpg) repeat-x;		/* this background leaks out below the footer and "completes" the footer to the bottom of the page.  Needs to be same bgcolor as footer. */
	font: normal 12px Arial, Helvetica, sans-serif;
	color: #555;
	margin:0;
	padding:0;
}


/* Header/Banner */
#header-banner-wrap 
{
	width: 900px;
	margin: 0 auto;	/* auto margin centers */
}

#header {
	width: 900px;
	height: 65px;
	
/*		border-style: inset;
	border-width: thin;
	border-color: #FFFF00;
*/
}

#header a {
	color:#ccc; text-decoration:none;
}

.logo {
	float:left;
	height:33px;
	margin-top: 24px;
	margin-left: 10px;
}

#banner {
	clear: both;
}


#nav-menu {
	float: right;
	width: 700px;	/* we want this width to be close to the combined width of all tabs.  That way the tabs float as far "right" as they can. TODO: Be careful though, the size will grow if the user increases font size */
	font:normal 10px Verdana;
	line-height: normal;
}

#nav-menu ul {
	margin-left: 0;
	margin-top: 37px;	/* this margin determines how far "down" in the header the tabs appear.  We use it to align bottom.  TODO: This positioning technique will break if the users increases font size */
	margin-bottom: 0;
	list-style-type: none;
}

#nav-menu li {
	display: inline;
	margin: 0;
}

#nav-menu li a {
	float:left;
	background:url("../images/nav_tab_left_background.gif") no-repeat left top;
	margin:0;
	padding:0 0 0 3px;
	text-decoration:none;
}

#nav-menu a span{
	display:block;
	background:url("../images/nav_tab_right_background.gif") no-repeat right top;
	padding:6px 12px 6px 6px;
	color:#FFFFFF;
}

#nav-menu li a:hover {
	text-decoration: underline;
}

#nav-menu a:hover span {
	text-decoration: underline;
}


/* Content */
.content-background-wrap {
	height:100%;
	background:#FFFFFF url("../images/content_background.jpg") repeat-x;
	padding: 10px 0 20px 0;
}

#content {
	width: 900px;
	min-height: 450px;
	margin:0 auto;
}

#content .col1 {
	width: 600px;
	padding: 15px 20px 20px 20px;
}

#content .col2{
	width:230px;
	float:right;
	padding-top:15px;
}

#content h1 { font:normal 26px/30px Verdana, Arial, Helvetica, sans-serif; color:#5d8096; }
#content .col1 h3 {font:bold 16px/20px "Trebuchet MS",Verdana, Arial, Helvetica, sans-serif; color:#333; }

#content .col2 p { padding:0 6px; }
#content .col1 li { padding-left:20px; margin-top:8px; }
#content .col1 p, #contenthome .col1 p, #contenthome .col2 p { line-height:17px; }
#content .col1 ul{ margin-bottom:16px; line-height:17px; margin-left:14px;}
#content .col2 ul { margin-bottom:16px; line-height:17px; }
#contenthome .col3 ul { margin-bottom:12px; line-height:17px; }


#content .col1 p {padding:0 6px;}
#content h3 {padding:0 6px;}
#content p, #content ul { line-height:15px; list-style:none; }
#content h2{ font:bold 12px/17px Verdana, Arial, Helvetica, sans-serif; color:#5d8096; background:#c7e6fa url(round-izq.gif) no-repeat top left; padding:5px 4px 4px 10px; border-bottom:1px solid #b1d1e6; margin-bottom:12px; clear:both;}
#content li {padding-left:20px; background:url(../images/bullet.gif) no-repeat 8px 3px; margin-top:2px; }

.col1, .col2, .col3 {
	width:284px;
	float:left;
	padding:8px;
}


/* Footer */
#footer {
	color: #d8cbc5;
	font:normal 11px/15px Arial, Helvetica, sans-serif;
	clear:both;
	background: #B27F56 url("../images/footer_background.jpg") repeat-x;
	padding-top:15px;
	height:50px;
	text-align:center;
}

#footer a {
	color: #fff;
	text-decoration: none;
}

#footer a:hover {
	text-decoration: underline;
}


.clearfix { clear:both;}


h1, h2, h3, p, table { margin-bottom:12px; }
a { color:#993300; text-decoration:underline; }
a:hover { color:#000; }
a:visited { color:#666666; }
a:active { color:#000; }




.pic {float: right;	margin: 0 0 5px 10px;}
.picborde {float: right; border:4px solid #eee; padding: 3px; margin: 4px 0 5px 10px;}
.picl {float: left;	margin: 0 10px 5px 0;}
.alert { text-align:center; padding: 7px;	margin-bottom: 15px; background-color: #cfedb3;	color:#333;	border: 1px solid #a6de74;}


/* This style applies to all form-related validation-error messages */
.validation-error {
	color: red;
}

/* These styles apply to the 6-pack configuration table.  TODO: move this elsewhere */
#six-pack-configuration {	/* this is the <table> element */
	font: 11px/24px Verdana, Arial, Helvetica, sans-serif;
	border-collapse: collapse;
	width: 480px;
	}

#six-pack-configuration th {
	border-top: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
	border-left: 1px solid #CCC;
	border-right: 1px solid #CCC;
	background: #C7E6FA;
	}

#six-pack-configuration td {
	border-bottom: 1px solid #CCC;
	padding: 0 1.5em;
	}

#six-pack-configuration td.width {
	width: 190px;
	}

#six-pack-configuration td.adjacent {
	border-left: 1px solid #CCC;
	text-align: center;
}


/* These styles apply to the "select scenarios" configuration table.  TODO: move this elsewhere */
#select-scenarios {	/* this is the <table> element */
	font: 11px/24px Verdana, Arial, Helvetica, sans-serif;
	border-collapse: collapse;
	width: 500px;
	}

#select-scenarios th {
	border-top: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
	background: #C7E6FA;
	}

#select-scenarios td {
	border-bottom: 1px solid #CCC;
	padding: 0 0.5em;
	}

#select-scenarios td.width {
	width: 190px;
	}

#select-scenarios td.adjacent {
	border-left: 1px solid #CCC;
	text-align: center;
}

/* These styles apply to the login form.  TODO: move this elsewhere */
#login-form label {
	width: 5em;
	float: left;
	text-align: right;
	margin-right: 0.5em;
	display: block
}


#login-form .submit input {
	margin-left: 5.5em;
}

/* The error page */
.error {
	color: #FF0000;
}



/* ######### Styles for Drop Down Menus ######### */

.dropmenudiv {
	position:absolute;
	border: 1px solid #333;
	border-width: 1px;
	font:normal 11px Verdana;
	line-height:18px;
	z-index:100;
	background-color: #000;
	visibility: hidden;
}

.dropmenudiv a{
	width: auto;
	display: block;
	text-indent: 8px;
	border-top: 1px solid #333;
	padding: 2px 0;
	text-decoration: none;
	color:#CCCCCC;
}

* html .dropmenudiv a{ /*IE only hack*/
	width: 100%;
}

.dropmenudiv a:hover{
	background-color: #333; color:#FFFFFF;
}


.disable{
  color:#BBBBBB;
  overflow: hidden;
}

a.disable:active,
a.disable:link,
a.disable:visited,
a.disable:hover{
	color:#993300;
	float: left;
	width: 4em;
}

a.edit:active,
a.edit:link,
a.edit:visited,
a.edit:hover{
	color:#993300;
	align: right;
}