@charset "UTF-8";

/* @override http://approva.net/themes/site_themes/net.approva/styles/home/screen.css */



/* CORE 1 of 2 */
html {
	height: 100%;
}
body {
	/* 
		@DEV-NOTES: font-size set to 100% (16px)
		em sizes:
			20px - 1.25em
			18px - 1.125em;
			16px - 1.0em;
			14px - 0.875em
			12px - 0.75em
			11px - 0.6875em;
			10px - 0.625em;
	 */
	font: 100% Arial, Helvetica, sans-serif; /* body font-size set to 16px base */
	line-height: 1.125em;
	margin: 0;
	padding: 0 !important;
	text-align: center;
	color: #000;
}

body {
	background: #dedede url(/themes/site_themes/net.approva/assets/images/bg-approva-light.png) left top repeat-x !important;
	min-width: 1000px;
}

body.staging {
	
}


ul.MenuBarHorizontal a
{
	display: block;
	cursor: pointer;
	padding: 0.7em 0.75em;
	color: #aaa;
	text-decoration: none;
	white-space: nowrap;
	background-color: transparent;
}
#wrapper {
	width: 100%;
	text-align:left;

	/* margin-top: -18px; */
}
	#header {
			height: 4.75em; /* 76px */
			padding: 0 0 0 0;  /* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
			margin-top: 0;
			margin-bottom: 1px;
			background: url(/themes/site_themes/net.approva/assets/images/bg_header.png) right top repeat-x;
		}
			ul.utilityNav {
				width: auto;
				padding: 10px 25px 0 0;
				margin: 0;
				list-style: none outside none;
				font-size: .6785em;
				
				text-align: right;
			}
			ul.utilityNav li {
				display: inline;
				color: #e5e5e5;
			}
			ul.utilityNav li a {
				color: #e5e5e5;
				text-decoration: none;
				padding: 8px 15px;
			}
			ul.utilityNav a:hover {
				color: #ffc100;
			}
			
			#header h1 {
				margin: -7px 0 0; /* @NOTE: Margin-Collapse correction - use on last object in header. Needed if border isn't used */
				padding: 0 0 0 40px;
				display: block;
				width: 226px;
				height: 42px;
				overflow: visible; /* offsets negative margin. does not affect visibilty of text */
				background: transparent url(/assets/images/approva_logo.gif) left top no-repeat;
				text-indent: -9999px;
				cursor: pointer;
			}
	
	#globalNav {
		margin: 0 0;
		background: transparent url(/themes/site_themes/net.approva/assets/images/bg_global-nav_home.png) left top repeat-x;
		font-size: 0.6875em;
		padding: 0 10px 0 25px;
		height: 34px;
		clear: both;
	}
	
	
	#globalSearch form,
	form#searchform{
		width: 265px;
		float: right;
		padding: 0 10px;
		margin: 0 25px 0 0;
		border-right: 1px solid #ffc100;
		height: 34px;
		background-color: #838383;
	}
		#searchWrapper {
			position: relative;
			margin-top: 4px;
			width: 194px;
		}
		.search-cap-l {
			background: url(/themes/site_themes/net.approva/assets/images/bg_search-left.png) left top no-repeat;
			display: block; position: absolute; left: 0; top: 0; width: 10px; height: 25px;
		}
		.search-cap-r {
			background: url(/themes/site_themes/net.approva/assets/images/bg_search-right.png) right top no-repeat;
			display: block; position: absolute; right: 0; top: 0; width: 10px; height: 25px;
		}
		input.search-mid {
			background: url(/themes/site_themes/net.approva/assets/images/bg_search-mid.png) center top	repeat-x;
			width: 174px;
			height: 25px;	
			border: 0;
			margin-left: 10px;
			*margin-top: -1px;
			padding: 6px 0 0;
			font-size: 11px;
		}
		.search-button {
			float: right;
			margin-top: 7px;
		}
		
	
	
	#container {
		width: 62.5em; /* 1000px */
		margin: 0 auto;
		text-align: left;
	}
/* END CORE 1 of 2 */		

		#campaign {
			height: 451px; /* temp for development */
		}
		#bg-campaign {
			float: left;
			width: 100%;
		}
		
		#content {
			margin: 0;
			padding: 0;
		}
			#feedTicker {
				background: transparent url(/themes/site_themes/net.approva/assets/images/bg_feed-ticker.png) left top no-repeat;
				width: 62.5em; /* 1000px; */
				height: 1.75em /* 28px; */
			}
				#feedTicker h5 {
					display: block;
					margin: 0;
					padding: 0;
					width: 192px;
					height: 28px;
					text-indent: -9999px;
					background: transparent url(/themes/site_themes/net.approva/assets/images/from-the-audittrail.gif) 13px 7px no-repeat;
					float: left;
				}
				#feedTicker p {
					margin: 0 0 0 143px;
					padding: 5px 0 0;
					font-size: .6875em;
					color: #fff;
					display: block;
				}
				#feedTicker p a {
					color: #fff;
					margin: 0;
					display: block;
					text-decoration: none;
				}
				#feedTicker span.date {
					display: inline;
					padding-right: 17px;
					color: #858585;
				}
			
			#mainArea {
				background: #252525 url(/themes/site_themes/net.approva/assets/images/bg_home-main.gif) left bottom repeat-x;
				padding: 22px 20px 22px;
				color: #e6e6e6;
				font-size: .6875em; /* 11px */
				overflow:auto;
			}
			#mainArea img {
				border: none;
			}
				
				#latestNews {
					width: 272px;
					float: left;
					display: inline;
				}
				#latestNews h2 {
					width: 272px;
					height: 33px;
					margin: 0;
					padding: 0;
					background: #e6e6e6 url(/themes/site_themes/net.approva/assets/images/headers/home/header_latest-news.gif) left top no-repeat;
					text-indent: -9999px;
				}
				
				.TabbedPanelsContent ol {
					list-style: none outside none;
					margin: 0;
					padding: 5px;
					font-size: 1em;
					line-height: 1.125em;
					letter-spacing: -.03ex;
					word-spacing: .1ex;
				}
				.TabbedPanelsContent li {
					margin-top: 12px;
					margin-bottom: 12px;
					width: auto;
				}
				.TabbedPanelsContent li a {
					color: #e6e6e6;
					text-decoration: none;
					display: block;
				}
				.TabbedPanelsContent li a:hover {
					color: #FFFB8D;
				}
				
				#primaryPromo {
					width: 316px;
					margin-left: 293px;
				}
				
				#primaryPromo .col-2-A,
				#primaryPromo .col-2-B {
					width: 166px;
					height: 150px;
				}
				
				#secondaryPromo .col-2-A {
					float: left;
				}
				
				#secondaryPromo .col-2-B {
					float: right;
					margin-bottom: 10px;
				}
				
				#secondaryPromo {
					width: 332px;
					float: right;
				}
				#latestNews .date-loc {
					display: block;
					font-size: .9em;
					color: #a0a0a0;
				}
				
				#latestNews a:hover .date-loc {
					color: #FFC;
				}
				
				/* GRID RULES */
				.col-1-AA { /* zoom: 100%; */ }
				.col-1-AA .row-1-child {
					display: block;
					margin: 0 0 6px;
					padding: 0;
				}
				.col-1-AA .row-2-child {
					display: block;
					padding: 0;
					margin: 0;
				}
				
/* CORE 2 of 2 */	
		#footer {
			padding: 12px 20px 20px;
			background:#0f0f0f;
			margin: 0;
			font-size: .625em; /* 10px */
			}
			#footer ul {
				margin: 0 0 .75em;
				padding: 0;
			}
			#footer li {
				display: inline;
				margin-right: 20px;
				list-style: none outside none;
			}
			#footer ul a {
				color: #9f9f9f;
			}
			#footer p {
				margin: 0 0 2px;
				padding: 0 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
				color: #6f6f6f;
				line-height: 1.1em;
			}
			#footer p.twitter-link {
				display: block;
				float: right;
				margin-top: -10px;
				overflow: visible;
			}
			#footer p.twitter-link a {
				display: block;
				padding-left: 30px;
				background: transparent url(/assets/images/twitter-footer-icon.png) left top no-repeat;
				height: 20px;
				padding-top: 6px;
			}
			
			#footer p.facebook-link {
	display: block;
	float: right;
	margin-top: -10px;
	padding-right: 20px;
	overflow: visible;
}
#footer p.facebook-link a {
	display: block;
	padding-left: 30px;
	background: transparent url(/assets/images/facebook-footer-icon.png) left top no-repeat;
	height: 20px;
	padding-top: 6px;
}		
			
			#footer p a {
				color: #6f6f6f;
			}


			
/* UTIL */
div.clear,
br.clear,
.clear-r,
.clear-l {
	font: 1px/1px monospace;
	display: block;
}
div.clear,
br.clear {
	clear: both;
	margin: 0 0 -1px;
	padding: 0;
	height: 1px;
}
.clear-l { clear: left; }
.clear-r { clear: right; }
.clear-after:after {
	content: "\0020";
	display: block;
	height: 0;
	clear: both;
}
.clear-after {
	/*\*//*/ display: inline-table; /*MacIE*/
	_height: 1em;
	min-height: 1px;
}

.passive {
	visibility: hidden;
	display: none;
}
#newRegistration {
	text-align: left;
}
#newRegistration input,
#newRegistration select {
	margin-bottom: 5px;
}
/* END CORE 2 of 2 */

/* @group New Nav */

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
#nav {
  padding: 0;
  margin-top: 0;
  margin-bottom: 0;
  list-style-type: none;
  float: left;
  font: 11px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}

/* set top level li's do be block, float */
#nav li.a {
  display: block;
  float: left;
  text-transform: uppercase;
  position: relative;
  cursor: pointer !important;
}

/* style all anchors in list */
#nav li.a a {
  display: block;
  padding: 10px;
  color: #999;
  text-decoration: none;
  cursor: pointer !important;
}
#nav li.a li a{
	padding-top:6px;
	padding-bottom: 6px;
}

/* set the hover of the top level */
#nav li.a a:hover,
#nav li.a:hover > a {
  background: #0a0a0a;
  color: #999;
}

/* set the hover of the second level */
#nav li.c a:hover {
  background: #fff;
  color: #000;
}

/* set the hover of the third level */
#nav li.e a:hover,
#nav li.e:hover > a {
  background: #ccc;
  color: #000;
}

/* set the background and shape of the second and third level ul's */
#nav li.a ul.b,
#nav li.a ul.b li.c ul.d {
  text-transform: none;
  margin: 0;
  padding: 5px 0;
  list-style-type: none;
  position: absolute;
  width: 225px;
  background-color: #ddd;
  display: none;
}

/* set the link color for the second level links */
#nav li.a ul.b a {
  color: #000;
  display: block;
}

/* make the ul's show when hovered */
#nav li.a:hover ul.b,
#nav li.a ul.b li.c:hover ul.d {
  display: block;
}

/* make it so we can position the ul relative to the li parent */
#nav li.a ul.b li.c {
  display: block;
  position: relative;
}

/* line the third level links up with the anchor they came from (top == top - padding, left == width) */
#nav li.a ul.b li.c ul.d {
  left: 225px;
  top: -5px;
  background: #333;
}

/* set the third level link colors */
#nav li.a ul.b li.c ul.d a {
  color: #ccc;
  display: block;
}

/* set the third level link colors for hover */
#nav li.a ul.b li.c ul.d a:hover {
  color: #000;
}

/* set the bullet icon */
body #nav li.a ul.b li.v {
  background: transparent url(/themes/site_themes/net.approva/assets/images/bullet-off.gif) no-repeat right center;
}

body #nav li.a ul.b li.v > a:hover,
body #nav li.a ul.b li.v:hover > a {
  background: #fff url(/themes/site_themes/net.approva/assets/images/bullet.gif) no-repeat right center;
}

/* @end New Nav */