/**********
Nutrition Learning *Base* styles

Version: 01/06/2005

Pieced together by: Ron Adams
ron@rainstormconsulting.com

Please request written permission prior to use.
**********/ 

/***********
1.0 Basic elements
**********/
body { position: relative; left: 0px; top: 0px; width: 100%; margin: 0; padding: 0; font-family: Arial, Helvetica, sans-serif; font-size: 80%; background-color: #336699; color: #000; z-index: 0; _font-size: 75%;}
	
a { color: #336699; text-decoration:underline; }

a:hover { text-decoration: none; }

img {
	border: 0;
}
	
h3 {
	font-family: Helvetica, Verdana, Arial, sans-serif;
	color: #eee;
	font-weight: normal;
}
	
h5 {
	margin: 0;
	padding: 0;
	font-size: 110%;
	font-weight: bold;
	color: #000063;
}


h6 {
	margin: 0;
	padding: 0;
	font-size: 100%;
	font-weight: bold;
	color: #336699;
}

.small-grey {
	font-size: 80%;
	font-weight: bold;
	color:#a4a4a4;
}

.medium-grey {
	color:#a4a4a4;
	font-weight: bold;
	font-size: 110%;
}

.large-grey {
	color:#a4a4a4;
	font-weight: bold;
	font-size:160%;

}

.small-dark-grey {
	font-size: 80%;
	font-weight: bold;
	color:#3b3b3b;

}

.medium-dark-grey {
	font-size: 110%;
	color:#3b3b3b;

}

.large-dark-grey {
	color:#3b3b3b;
	font-weight: bold;
	font-size:160%;

}

.small-med-blue {
	font-size: 80%;
	font-weight: bold;
	color:#336699;

}

.medium-med-blue {
	font-size: 110%;
	color:#336699;

}

.large-med-blue {
	color:#336699;
	font-weight: bold;
	font-size:160%;

}

.small-dark-blue {
	font-size: 80%;
	font-weight: bold;
	color:#215387;

}

.medium-dark-blue {
	font-size: 110%;
	color:#215387;

}

.large-dark-blue {
	color:#215387;
	font-weight: bold;
	font-size:160%;

}

.table {
	border: 1px solid #3b3b3b;
	text-align:left;
	padding:5px;
}

.dark-blue-text {
	color:#215387;
}

.medium-blue-text {
	color:#336699;
}

/***********
2.0 Branding elements
**********/
	
.sechex-bot-border {
	background-color: #000063;
	padding: 5px 5px 5px 10px;
}

#branding-container {
	position: relative;
	width: 700px;
	margin: 10px auto 0px auto;
	background: #fff;
}

	/*****
	2.1 Utility elements
	*****/

	#utilities {
		position: absolute;
		top: 4px;
		right: 2px;
		font-size: 90%;
		font-weight: bold;
	}
	
	#your-profile-button {
		vertical-align: top;
	}
	
	/*****
	2.2 Logo elements
	*****/
	
	#logo-container {
		position: absolute;
		top: 0px;
		left: 19px;
		z-index: 1;
	}
	
	#logo-background {
		text-align: center;
		width: 140px;
		height: 100px;
	}

	#logo-container .bottom { width: 142px; display:block; background:transparent; font-size:1px; }
	
	#logo-container .b1b, #logo-container .b2b, #logo-container .b3b, #logo-container .b4b { display:block; overflow:hidden; }
	
	#logo-container .b1b, #logo-container .b2b, #logo-container .b3b { height:1px; }
	
	#logo-container .b4b, #logo-container .b3b, #logo-container .b2b { background:transparent;  }

	#logo-container .b2b { margin:0 3px; border-width:0 2px; }
	
	#logo-container .b3b { margin:0 2px; }
	
	#logo-container .b4b { height:2px; margin:0 1px; }
	
	#logo-container .b1b { margin:0 5px; background:transparent; }
	
	#logo-container #logo-background {
		display:block;
		background:transparent;
		padding: 0;
	}

	/*****
	2.3 Site Title elements
	*****/

	#site-title-container {
		padding: 18px 0 0 160px;
		width: 468px;
		font-size: 160%;
		font-weight: normal;
		letter-spacing: .07em;
		background-color: #fff;
	}
	
	#site-title {
		margin: 10px 0 0 9px;
		_margin-top: 30px;
		font-size: 110%;
	}
	
	.bold-fl {
		font-weight: bold;
	}

	/*****
	2.4 Other elements
	*****/
	
	#usda-logo {
		position: absolute;
		bottom: 0px;
		right: 0px;
		width: 67px;
		height: 47px;
		padding: 0;
		margin: 0;
	}
	
	#usda-logo-sm {
		margin-top: 7px;
	}
	
	#branding-hr {
		margin: 0 auto 0 auto;
		padding: 0;
		height: 8px;
		width: 702px;
		border: 1px solid #7b7b7b;
		overflow: hidden;
	}

	#inset-container {
		margin: 5px 5px 5px 10px;
	}
/***********
3.0 Navigation elements
**********/

	/***********
	3.2 Main Navigation elements
	**********/
	#global-nav {
	  background-color:#06335F;
	  background-repeat:no-repeat;
	  width: 694px;
	  margin: 0 auto 0 auto;
	  border:solid #06335F;
	  border-width:1px 1px 0 1px;
	  background-position:0 -70px;
	  }
	#global-nav ul {
	  margin:0;
	  padding:0 20px;
	  list-style:none;
	  font-family: Verdana, Helvetica, Arial, sans-serif;
	  font-size:90%;
	  }
	#global-nav li {
	  float:right;
	  line-height:normal;
	  }
	#global-nav a, #global-nav strong {
	  display:block;
	  padding:5px 10px 5px;
	  border:solid #5c5c5c;
	  border-width:0 1px 0 0;
	  color: #fff;
	  text-decoration:none;
	  white-space:nowrap;
	  }
	.global-nav-first {
	  border:solid #7DAEDF;
	  border-width: 0 0 0 1px;
	  }
	/* Following rule allows entire region of link to to be 
	   clickable in IE/Win. Holly Hack explained here:
	   http://www.positioniseverything.net/explorer/escape-floats.html */
	* html #global-nav a {
	  width:1%;
	  }
	#global-nav #current strong, #global-nav #current a {
	  background-repeat:no-repeat;
	  }
	#global-nav a:hover, #global-nav #current a:hover strong, #global-nav #current strong {
	  color:#fff;
	  }
	#global-nav a:hover {
	  background-repeat:no-repeat;
	  }
	#global-nav a strong, #global-nav #current a strong {
	  background:none;
	  padding:0;
	  border:none;
	  }
	#global-nav {
	  background: #06335F url('/images/global_nav_bg.gif') repeat-x;
	  border-color:#5c5c5c;
	  }
	#global-nav a, #global-nav strong {
	  border-color:#7DAEDF;
	  }
	#global-nav #current strong, #global-nav #current a {
	  background-color:#336699;
	  background-image:url('/images/global_nav_current_bg.gif');
	  }
	#global-nav a:hover, #global-nav #current a:hover strong, #global-nav #current strong {
	  color:#fff;
	  }
	#global-nav #current a {
	  font-weight: bold;
	  color:#fff;
	  }
	#global-nav a:hover {
	  background-color:#336699;
	  }


	/***********
	3.1 Global navigation elements
	**********/

	#global-supp-container {
		padding: 2px 10px 2px 10px;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 75%;
	}
	
	#global-supp-container a {
		text-decoration: none;
	}

	#global-supp-nav {
		float: right;
		width: 65%;
		text-align: right;
	}

	#global-supp-nav a {
		font-weight: bold;
		text-decoration: underline;
	}

	#global-supp-nav a:hover {
		text-decoration: none;
	}


/***********
4.0 Content elements
**********/

fieldset {
	margin: 0 auto 10px auto;
	padding: 5px 5px 0 5px;
	border: 8px double #ccc;
	white-space: nowrap;
}

legend {
	margin: 0 0 5px 0;
	padding: 0 5px 0 5px;
	white-space: nowrap;
	font-family: Trebuchet MS, Verdana, Arial, sans-serif;
	font-size: 140%;
	color: #00374f;
	font-weight: bold;
	background-color: #FFF;
	border: 0;
}

	/***********
	4.1 Global content
	**********/

	#global-title-container {
		padding: 6px 20px 4px 20px;
		background-color: #ffe4bc;
	}

	h1 {
		margin: 0;
		padding: 0;
		font-family: Trebuchet MS, Verdana, Arial, sans-serif;
		font-size: 160%;
		color: #5F5F5F;
		font-weight: normal
	}
	
	#global-info {
		font-family: Verdana, Arial, Helvetica, sans-serif;
		border-top: 4px double #b0b0b0;
		border-bottom: 2px solid #b0b0b0;
		background-color: #fff;
		color: #666;
		font-size: 70%;
	}
	
	#global-instructions {
		padding: 3px 20px 3px 20px;
	}
	
	#global-notice-icon {
		margin: 1px 5px 0 0;
		vertical-align: top;
	}
	
	.error, .warning, .notice {
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 90%;
	}
	
	.error {
		padding: 3px 20px 3px 10px;
		margin-top: 10px;
		border-top: 2px solid #BF0B17;
		border-bottom: 1px solid #7F7F7F;
		background: #FFDFE2;
		color: #333;
		clear: both;
	}
	
	.error dd {
		margin-left: 75px;
	}
	
	.warning {
		padding: 3px 20px 3px 10px;
		margin-top: 10px;
		border-top: 2px solid #BDBF00;
		border-bottom: 1px solid #7F7F7F;
		background: #FFFFDF;
		color: #333;
		clear: both;
	}
	
	.warning dd {
		margin-left: 95px;
	}
	
	.notice {
		padding: 3px 20px 3px 10px;
		margin-top: 10px;
		border-top: 2px solid #26BF0B;
		border-bottom: 1px solid #7F7F7F;
		background: #F2FFEF;
		color: #333;
		clear: both;
	}
	
	.notice dd {
		margin-left: 85px;
	}
	
	#global-info-drop {
		height: 5px;
		margin: 0;
		padding: 0;
	}
	
	#main-content-container {
		width: 686px;
		margin: 0 auto 0 auto;
		padding: 5px;
		background-color: #f0f0f0;
		border-left: 2px solid #444;
		border-right: 2px solid #444;
		border-bottom: 1px solid #444;
		font-size: 105%;
	}
	
	#main-content-container p:first-child {
		margin-top: 0;
	}
	
	#body-container {
		padding: 20px;
		border-top: 1px solid #989898;
		border-right: 1px solid #d1d1d1;
		border-bottom: 1px solid #d1d1d1;
		border-left: 1px solid #989898;
		background-color: #fff;
	}

	/***********
	4.2 Login Form Elements
	**********/

	#login-form {
		padding-top: 15px;
	}
	
	#login-form fieldset {
		width: 50%;
		height: 155px;
		margin: 5px auto 10px auto;
		padding: 0 14px 14px 14px;
		border: 8px double #C3D2DF;
		font-family: Trebuchet MS, Verdana, Arial, sans-serif;
		font-size: 110%;
		white-space: nowrap;
		font-weight: bold;
		background:  url(/images/girl_laptop.jpg) right no-repeat;
	}

	#login-form legend {
		margin: 0;
		height: 25px;
		padding: 0 5px 0 5px;
		white-space: nowrap;
		font-size: 120%;
		background: #fff;
		border: 0;
	}
	
	#login-form dl {
		width: auto;
		clear: both;
		margin: 10px 0 0 0;
		padding: 0 0 10px 5px;
	}
	
	#login-form dt {
		float: left;
		clear: right;
		width: 70px;
		font-size: 90%;
		font-weight: normal;
		line-height: 24px;
	}
	
	#login-form dd {
		margin: 0 0 5px 0px;
		margin-left: 75px;
		font-size: 80%;
		color: #666;
		line-height: 24px;
	}
	
	/* commented backslash hack for mac-ie5 \*/
	#login-form dt {
		clear: both; 
	}
	/* end hack */
	
	#login-form #user_login {
		width: 125px;
	}
	
	#login-form #user_password {
		width: 125px;
	}
	
	#secure-login-icon {
	    vertical-align: middle;
	}
	
	#login-utilities {
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 80%;
		margin-top: 20px;
		margin-bottom: 0px;
		padding: 0px;
	}
	
	#login-utilities a {
		font-weight: bold;
		line-height: 1em;
	}
	
	/***********
	4.5 Website Utilities
	**********/
	
	.confirmbox {
		margin: 5px 0 5px 0;
		padding: 10px 10px 10px 65px;
		background: #eee url(../images/confirmbox_bg.gif) top left no-repeat;
		color: #666;
		min-height: 50px;
	}
	
	.alertbox {
		margin: 5px 0 5px 0;
		padding: 10px 10px 10px 65px;
		background: #eee url(../images/alertbox_bg.gif) top left no-repeat;
		color: #ff0000;
		min-height: 50px;
	}

	/***********
	4.6 Admin Area Welcome Screen
	**********/
	
	#area-list {
		white-space: nowrap;
	    padding: 10px 0 10px 10px;
	}
	
	#area-list fieldset {
	}
	
	#area-list dl {
		width: auto;
		clear: both;
		margin: 0;
		padding: 0;
	}
	
	#area-list dt {
	    width: 60px;
		float: left;
		clear: right;
		font-size: 90%;
		font-weight: normal;
		line-height: 24px;
	}
	
	#area-list dd {
		margin: 0;
		color: #666;
		line-height: 1.25em;
	}

	/***********
	4.7 Profile Page
	**********/

	.pod {
		width: 49%;
		float: left;
	}

	.long {
		margin-bottom: 15px;
		width: 100%;
		float: none;
	}
	
	.pod-row {
		margin-bottom: 15px;
	}
	
	.right {
		margin-left: 10px;
	}
	
	h3 img {
		vertical-align: top;
	}
	
	.pod-content {
		padding: 1px 10px 1px 10px;
		font-size: 90%;
		color: #515151;
	}
	
	.pod .top, .pod .bottom {display:block; background:transparent; font-size:1px;}
	.pod .b1, .pod .b2, .pod .b3, .pod .b4, .pod .b1b, .pod .b2b, .pod .b3b, .pod .b4b {display:block; overflow:hidden;}
	.pod .b1, .pod .b2, .pod .b3, .pod .b1b, .pod .b2b, .pod .b3b {height:1px;}
	.pod .b2 {background:#f0f0f0; border-left:1px solid #fff; border-right:1px solid #eee;}
	.pod .b3 {background:#f0f0f0; border-left:1px solid #fff; border-right:1px solid #ddd;}
	.pod .b4 {background:#f0f0f0; border-left:1px solid #fff; border-right:1px solid #aaa;}
	.pod .b4b {background:#f0f0f0; border-left:1px solid #eee; border-right:1px solid #999;}
	.pod .b3b {background:#f0f0f0; border-left:1px solid #ddd; border-right:1px solid #999;}
	.pod .b2b {background:#f0f0f0; border-left:1px solid #aaa; border-right:1px solid #999;}
	
	.pod .b1 {margin:0 5px; background:#fff;}
	.pod .b2, .pod .b2b {margin:0 3px; border-width:0 2px;}
	.pod .b3, .pod .b3b {margin:0 2px;}
	.pod .b4, .pod .b4b {height:2px; margin:0 1px;}
	.pod .b1b {margin:0 5px; background:#999;}
	.pod .pod-content {display:block;  background:#f0f0f0; border-left:1px solid #fff; border-right:1px solid #999;	}
	
	h4 {
		margin: 0;
		font-size: 105%;
	}
	
	.inset {
		background: #fff;
		margin: 5px 0 5px 0;
		padding: 1px 10px 2px 10px;
	}
	
	#graph-key-image {
		vertical-align: top;
	}
	
	.graph-text-header {
		font-family: Verdana; 
		font-weight: bold; 
		background-color: #000063; 
		color: #FFFFFF; 
		padding: 5px;
	}
	
		/***********
		4.7.0 Profile Pod
		**********/
		
		#profile-container {
			font-size: 90%;
			width: 25%;
		}
		
		#profile-container .out {
		  display:block; 
		  background:#bbb; 
		  border:1px solid #ddd; 
		  position:relative;
		  margin: 0 10px 10px 0;
		  float: left;
		  float: right;
		}
		  
		#profile-container .in {
		  text-align:center; 
		  background:#fff; 
		  border:1px solid #555; 
		  position:relative; 
		  padding:5px;
		  font-weight:normal;
		}
		  
		#profile-container .ltin {
		  left:-2px;
		}
		 
		#profile-container .tpin {
		  top:-2px;
		}
		
		#profile-edit-button {
			clear: both;
			margin-bottom: 0;
			margin-left: 10px;
		}
		
		.hp-text {
			font-family: Verdana, Trebuchet MS, Arial, sans-serif;
			font-size: 110%;
			color: #7b7b7b;
			font-weight: bold;
		}
		
		.subject-name {
			font-family: Verdana, Trebuchet MS, Arial, sans-serif;
			font-size: 160%;
			font-weight: bold;
			color: #515151;
		}
		
		#subject-contact-container {
			padding: 3px 0 0 0;
		}
	
		/***********
		4.7.1 Lessons Pod
		**********/
	
		#next-lesson {
			font-weight: bold;
			font-size: 120%;
		}
		
		#lesson-available {
			border-width: 2px;
			border-style: solid;
		}
		
		#lesson-title {
			font-family: Verdana, Trebuchet MS, Arial, sans-serif;
			font-weight: normal;
			color: #515151;
			font-size: 70%;
		}
		
		#completed-lessons {
			font-family: Verdana, Trebuchet MS, Arial, sans-serif;
			font-weight: normal;
			color: #245d97;
			margin: 5px 0 3px 0;
			font-size: 90%;
		}
		
		.inactive {
			color: #ccc;
		}
		
		#lesson-container {
			width: 60%;
		}
	
		/***********
		4.7.2 Messages Pod
		**********/
		
		#message-container {
			width: 72%;
			float: right;
		}
		
		.message {
			margin: 3px 0 3px 0;
		}
		
		.message-icon {
			border: 0;
			float: left;
			vertical-align: top;
		}
		
		.message-title {
			float: left;
			padding-left: 9px;
			width: 390px;
		}
		
		#current-messages {
			font-weight: bold;
			color: #245d97;
		}	

		.opened {
			font-weight: normal;
		}
	
		/***********
		4.7.3 Health Metrics
		**********/
		
		#metrics-container-treatment {
			width:140%; 
			margin-top: 50px;
		}
		
		#metrics-container-control {
			width:60%; 
			margin-left: 70px;
			margin-top: 20px;
		}
		
		/***********
		4.7.4 Graphs
		**********/
		
		#freg-container {
			width:140%; 
			margin-top: 15px;
		}
		
		#graph-text {
			font-family: Verdana, Trebuchet MS, Arial, sans-serif;
			font-weight: bold;
			font-size: 125%;
		}
		
		/***********
		4.7.5 Calculators
		**********/
		
		#calculator-container {
			margin: 0 auto;
		}

#survey-title h3 {
	font-size: 160%;
	margin: 0 0 10px 0;
	font-weight: normal;
}

.survey-page-numbers {
	color: #eee;
	font-weight: bold;
	float: right;
	padding: 5px 10px 0 0;
}

.survey-page-numbers-bottom {
	font-weight: bold;
	float: right;
	padding: 5px 10px 0 0;
}

#survey-container {
	padding: 10px 30px 0 30px;
}

/***********
	Health Metric Meanings Tables
**********/

.bmi-header {
	background-color: #FFCC99;
}
	
.metric-meaning-header {
	border-top: 1px solid #001949;
	border-left: 1px solid #001949;
	border-bottom: 1px solid #001949;
	padding: 3px 30px 3px 3px;
	font-size: 110%;
}

.metric-meaning-row {
	border-left: 1px solid #001949;
	border-bottom: 1px solid #001949;
	padding: 3px 30px 3px 3px;
}

.vo2-meaning-header {
	border-top: 1px solid #001949;
	border-left: 1px solid #001949;
	border-bottom: 1px solid #001949;
	padding: 5px 5px 5px 5px;
	font-size: 110%;
}

.vo2-meaning-row {
	border-left: 1px solid #001949;
	border-bottom: 1px solid #001949;
	padding: 5px 5px 5px 5px;
}

/***********
	Module-specific title and utilities
**********/

.vertical-table-header {
	background: #dfefff;
}

.vertical-top-border {
	border-top: 1px solid #001949;
}

.vertical-right-border {
	border-right: 1px solid #001949;
}

.vertical-row {
	padding: 3px 3px 3px 3px;
	border-bottom: 1px solid #001949;
	font-size: 90%;
}
	
.tabular-list-full {
	width: 100%;
	text-align: left;
}

.tabular-header {
	background: #dfefff;
	font-size: 90%;
	font-family: Trebuchet MS, Verdana, Arial, sans-serif;
}

.tabular-header a {
	color: #0077ab;
}

.tabular-header {
	background: #dfefff;
	font-size: 90%;
	font-family: Trebuchet MS, Verdana, Arial, sans-serif;
}

.action-heading {
	padding: 5px;
	border-top: 1px solid #001949;
	border-bottom: 1px solid #001949;
	font-size: 80%;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: normal;
}

.active-heading {
	padding: 3px 8px 3px 8px;
	border-top: 1px solid #001949;
	border-bottom: 1px solid #001949;
	font-size: 120%;
	white-space: nowrap;
}

.source-heading {
	padding: 3px 8px 3px 8px;
	border-top: 1px solid #001949;
	border-bottom: 1px solid #001949;
	white-space: nowrap;
}

.tabular-row {
	font-size: 90%;
}

.tabular-row:hover {
	background: #fff3de;
}

.row-action {
	padding: 3px 0 3px 4px;
	border-bottom: 1px solid #6699cc;
}

.row-source {
	padding: 3px 0 3px 8px;
	border-bottom: 1px solid #6699cc;
}

.row-active {
	padding: 3px 0 3px 8px;
	border-bottom: 1px solid #6699cc;
	font-weight: bold;
}

h2 {
	margin: 5px 0 10px 0;
	font-family: Arial, sans-serif;
	font-weight: 120%;
	color: #5F5F5F;
}


/***************
 CSS Utilities
 
***************/

.clearfix:after { 
	content:"."; 
	display:block; 
	height:0; 
	clear:both; 
	visibility:hidden; 
} 

.clearfix {display:inline-block;} /* Hide from IE Mac \*/ 

.clearfix {display:block;} /* End hide from IE Mac */ 

.clearfix {_height:1px;}

.float-right {
	float: right;
}

.float-left {
	float: left;
}

.center {
	text-align: center;
}

/***************
COLORS USED

#ffe4bc Light Color
#00374f Dark Color 
***************/