/* CSS Document */

/* CSS Document */
*{margin: 0; padding: 0;}
html {
	font: 125% Arial, Helvetica, sans-serif;
}
body {
	font-size: 55%;
	background: #cecece;
	background-image:url(img/bg-page.gif);
	background-repeat:repeat-x;
}
.left{display: block; float: left; margin: 0 10px 10px 0;}
.right{display: block; float: right; margin: 0 0 10px 10px;}
/*/////////LAYOUT///////////////////////////////////////////*/
#container{
	width: 986px;
	position: relative;
	margin: 0px auto;
	/*
	border-width: 0 1px 0 1px;
	border-color: #d7d4cc;
	border-style: solid;
	*/
	background-image: url(img/bg-shadow.gif);
	background-repeat: repeat-y;
	background-color: #ffffff;
	}
#bottom-end{
	width: 986px;
	position: relative;
	text-align:right;
	margin: 0px auto;
	color:#999999;
	font-size:70%;
	}
	#header{
		/*background: url(img/bg-header-cap.gif) no-repeat;*/
		padding: 3px 0 0;}
		#header div{
			/*background: url(img/bg-middle.gif) repeat-y;*/
			padding: 0 3px;
			height: 89px;
			}
			#header div div{
			/*background: url(img/bg-header.gif) repeat-x;*/
			height: 100%;
			padding: 1px 0;}
			h1{
				display: block;
				width: 286px;
				height: 78px;
				margin-top: -1px;
				float: left;
				position: relative;
				background: url(img/bg-h1.gif) no-repeat;}
				h1 a{
					display: block;
					position: absolute;
					height: 100%;
					width: 100%;
					top: 0;
					left: 0;
				}
				h1 span{
					display: block;
					position: absolute;
					height: 0;
					width: 0;
					overflow: hidden;
				}
			#header ul{
				padding-left:50px;
				margin: 30px 0 0;
				position: relative;
			}
			#nav{
			position:relative;
			left:25px;
		
			}
			#nav li{
				display: inline;
			}
			#nav a{
				font-weight: normal;
				display: block;
				float: left;
				line-height: 20px;
				padding: 0 20px;				
				text-transform: uppercase;
				color: #b0b2a8;
				background: url(img/nav-divider.gif) no-repeat right center;
				text-decoration: none;
				font-size: 1.2em;
				letter-spacing: 1px;
			}
			#nav a:hover{
				color: #CC6600;
			}
			
	/*		#subnav{
			position:relative;
			left:505px;
			text-transform:uppercase;
			top:10px;
			}
			
			#subnav li {list-style:none; }*/
			
			
			#portal a{
				background: none;
			}
	#middle{
		padding: 0 3px;
		position: relative;
		min-height: 410px;
		/*background: url(img/bg-middle.gif) repeat-y;*/}
		#sidebar{
			width: 285px;
			background: white;
			margin: 0 1px 0;
			position: relative;
			float: left;
			z-index: 60;
			border-width: 1px 0;
			border-color: #d7d4cc;
			border-style: solid;
		}
		#home #leftcolumn{
			width: 230px;
			margin: 0 1px 0;
			position: relative;
			float: left;
			/*
			border-width: 0 1px 0 0;
			border-color: #e8e8e8;
			border-style: dotted;
			min-height: 300px;
			*/
		}
		#home #centercolumn{
			width: 375px;
			margin: 20px 0 0 10px;
			position: relative;
			float: left;
			border-width: 0 1px 0 0;
			border-right-width: 1px;
			border-color: #666666;
			border-style: dotted;
		}
		#rightcolumn{
			width: 335px;
			margin: 0 1px 0;
			position: relative;
			float: left;
		}
		#rightcolumn li{
			line-height: 17px;
			vertical-align: top;
			}
		#contact #column{
			width: 210px;
			margin: 2px 0px 0;
			position: relative;
			float: left;
			border-width: 0 1px 0 0;
			border-color: #e8e8e8;
			border-style: dotted;
			min-height: 300px;
		}
		#sidebar div{
			background: white url(img/sidebar-accent.gif) no-repeat center top;
			padding-bottom: 20px;
		}
		#sidebar .hr{
			background: url(img/bg-sidebar-hr.gif) no-repeat;
			height: 10px;
			margin: 0 -4px;
		}
		hr{
			display: none;
		}
		
		#content{
			padding: 1px 0px 10px 11px;
			width: 969px;
			z-index: 1;
			position: relative;
			float: left;}
			#content .hr{
				background-color: #cccccc;
				height: 2px;
				margin: 0 0 10px 20px;
				margin-right: 20px;
				position: relative;
				clear: both;
			}
			#content .toolkit .hr{
				background: url(img/hr-toolkit.gif) no-repeat top left;
				height: 3px;
				position: absolute;
				width: 100%;
				bottom: 0;
				left: 0;
			}
			#banner{
				margin: 0 20px 0 20px;
				padding: 1px 11px;
				background-color: #bfe1ee;
			}
		#about #content {
			/*background-image:url(img/Sjoblad1.jpg);
			background-position:right top;
			background-repeat:no-repeat;*/
			min-height:306px;
			position: absolute;
			}
		
		
		#employment #content {
			min-height:500px;
			}
		#bottom{
			/*height: 3px;
			background: url(img/bg-footer-cap.gif) no-repeat;*/
			}
		#bottom-right{
			background: #41482f url(img/bg-brlist.jpg) no-repeat left bottom;
			padding: 1px 0 15px;
			height: 311px;
			margin: -10px -1px -10px;
		}
	#footer{
		background-image:url(img/bg-footer-mesh.gif);
		background-repeat:repeat-x;
		height:53px;
		/*background: #454545;*/
		/*padding: 3px 0;*/
		margin: 0 2px;
		text-transform: uppercase;
		color: #666666;
		font-size: .8em;
		text-align: center;}
	#home #footer{
		background-image:url(img/bg-footer-mesh-home.gif);
		background-repeat:repeat-x;
		height:93px;
		margin: 0 2px;
		color: #ffffff;
		font-size: .8em;
		text-align: center;
		}
	#footer p{
		text-transform: none;
		padding: 0 4px;
		float: left;
		width: auto;
	}
	#footer div{
		padding-top: 50px;
		}
.toolkit{
	height: 143px;
	padding: 0;
	z-index: 2;
	overflow:hidden;
	position: relative;
}
.verttoolkit{
	border-width: 0 1px 0 0;
	border-color: #aaaaaa;
	border-style: dashed;
	float: left;
	background-color: #ededed;
	min-height: 450px;
	width: 195px;
	padding: 0;
	z-index: 2;
	overflow:hidden;
	position: relative;
}
.verttoolkit p{
	margin: 1em 15px 1em 10px;
	color: #aaaaaa;
	clear: both;
	font-size: 1.1em;
	line-height: 1.5em;
}
.verttoolkit img {
	padding: 10px 10px;
	}
/*
#verttoolkitnav li{
	position: relative;
	list-style: none;
	z-index: 1;
}
#verttoolkitnav{
	position:relative;
	z-index: 20;
}
#verttoolkitnav a{
	font: 1.3em/1.8em Georgia, "Times New Roman", Times, serif;
	color: #000066;
}
*/
#overview{
	/*background: url(img/toolkit-accent.gif) no-repeat 20px center;*/
	border: dotted;
	border-width: 0 0 0 1px;
	border-color: #cccccc;
	width: 230px;
	height: 100px;
	float: right;
}
#vkeeptabs{
	z-index: 1;
	margin-left: -10px;
	}
#vsysmanager{
	z-index: 1;
	margin-right: -10px;
	border-width: 0;
	}
#keeptabs	{
	background: url(img/toolkitscreen_keeptabs.jpg) no-repeat right top;
	z-index: 1;}

#organize	{
	background: url(img/toolkitscreen_organize.jpg) no-repeat right top;}

#trackbonds	{
	background: url(img/toolkitscreen_trackbonds.jpg) no-repeat right top;}

#watchyour	{
	background: url(img/toolkitscreen_watchyour.jpg) no-repeat right top;
	}

#streamline	{
	background: url(img/toolkitscreen_streamline_data.jpg) no-repeat right top;}
#toolkitnav li{
	position: relative;
	list-style: none;
	z-index: 1;
}
#toolkitnav{
	position:relative;
	z-index: 20;
}
#toolkitnav a{
	font: 1.3em/1.8em Georgia, "Times New Roman", Times, serif;
	color: #000066;
}
.hover{
  top: -32px;
  display: none;
  line-height: 1em;
  height: 75px;
  width: 239px;
  padding: 20px 20px 0;
  overflow: hidden;
  position: absolute;
  background:transparent url(img/hover-box.png);
  z-index:70;
	}
/*/////////Forms////////////////////////////////////////*/

fieldset{
	position: relative;
	padding: 5px;
	border: 1px solid #333333;}

legend {font-size: 1.3em; color: #333333;}

label {
	display:inline-table;
	padding: 0 5px;
	color: #695d54;
	font-size: 1.1em;
	font-weight: bold;
	margin: .5em 10px 0;
	vertical-align: top;
	padding-top:5px;
	text-transform:uppercase;
	}

/*label:first-letter {text-decoration: underline;}*/

input, textarea {
	width: 350px;
	margin: 5px 0 8px 10px;
	border-width: 1px 1px;
	border-color: #d7d4cc;
	border-style: solid;
	color: #333333;
	background-color:#eeeeff;
	padding: 5px;
	}
	input{
		line-height: 15px;
		height: 15px;
		}

textarea {
	overflow: auto;}

form .required{font-weight:bold;}

form {
	text-align: right;
	width: 480px;
	/*border-left: 1px solid #E8E8E8;*/
	float: right;
	margin: 0px 10px;
	margin-right: 20px;
	}
	
form br {clear:left;}

/*
button {
	text-transform: uppercase;
	font-weight: bold;
	border-width: 1px;
	border-bottom-width: 0px;
	border-style: solid;
	background: white url(img/button-bg.gif) repeat-x left bottom;
	letter-spacing: 1px;
	padding: 0px 25px;
	color: #ffffff;
	border-color: #e0e0ff #b0b0d0 #b0b0d0 #e0e0ff;
	margin: 1em 150px;
	float: right;
	height: 32px;
	}
*/
button {
	background: white url(img/button-submit.gif);
	margin: 1em 125px;
	float: right;
	height: 33px;
	width: 127px;
	}


.checkbox{
	width: auto;}
	
#loadBar, #emailSuccess{
	text-align: center;}

#content form p{
	margin: 10px 10px 0;
	color: #000000;
	width: 460px;
	font-size: 1.1em;
}
/*/////////sIFR/////////////////////////////////////////*/
/* These are standard sIFR styles... do not modify */

.sIFR-flash {
	visibility: visible !important;
	margin: 0;}
	
.sIFR-replaced {visibility: visible !important;}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;}


/* These are standard sIFR styles... do not modify */

.sIFR-flash {
	visibility: visible !important;
	margin: 0;
}

.sIFR-replaced {
	visibility: visible !important;
}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}

/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
.sIFR-flash + div[adblocktab=true] {
  display: none !important;
}

/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

.sIFR-hasFlash #content h1{
	/*visibility: hidden;*/

}
/*/////////BUTTONS////////////////////////////////////////*/

#bottom-right .button{
	line-height: 20px;
	border: 1px solid #666666;
	background: #333333;
	color: #CCCCCC;
	display: block;
	position: relative;
	margin: 5px 0 0px 50px;
	text-decoration: none;
	text-align: center;
	width: 240px;
}
#sidebar .button, #green-banner .button{
			display: block;
			line-height: 19px;
			position: relative;
			text-align: center;
			margin: 5px auto;
			color: #C87221;
			text-decoration: none;
			border: 1px solid #999999;
			background: url(img/bg-sidebar-button.gif) repeat-x;
}
#bottom-right .button:hover{
	background: #666666;
	}
#sidebar .button:hover, #green-banner .button:hover{
	background: white;
}
/*/////////TYPOGRAPHY/////////////////////////////////////*/
#sidebar h3{
	font: bold 1.1em/1.3em Georgia, "Times New Roman", Times, serif;
	color: #1c2951;
	margin: 10px 20px 5px;
}
#sidebar li, #content li{
	margin: .2em 30px;
	font-size: 1.1em;
	color: #000000;
}
#content li{
	margin: .2em 40px;
	/*background: url(img/bullet-triangle.gif) no-repeat left;*/
	/*background: url(img/bullet-triangle.gif) no-repeat top left;*/
	padding: 0 0 0 4px;
	/*list-style-image:url(img/bullet-triangle.gif);*/
}
#overview li{
	background: url(img/bullet-triangle.gif) no-repeat 15px center;
	list-style: none;
	padding-left: 35px;
}
#content h3{
	color: #0099cc;
	font-size: 1.4em;
	margin: 1em 20px;
	text-transform:uppercase;
}
#sidebar h2{
	font: 2.1em/1.1em Georgia, "Times New Roman", Times, serif;
	color:#7e8667;
	text-transform: uppercase;
	width: 250px;
	margin: 10px auto;
	letter-spacing: 1px;
	position: relative;
}
#sidebar h2 span{
	display: block;
	text-align: right;
	font-size: .9em;
}
#overview h3{
	color: #000000;
	margin: 20px 10px 10px 40px;
	text-transform: uppercase;
	font-size: 1.3em;
}
#sidebar h4{
	color: #97600b;
	font: 1.1em/1.1em Georgia, "Times New Roman", Times, serif;
	margin: 10px 20px;
}
#content h2{
	font: 1.5em/1.1em Georgia, "Times New Roman", Times, serif;
	letter-spacing: 3px;
	text-transform: uppercase;
	margin: 1em 20px .5em;
	color: #444426;
}
#content h4{
	color: #000000;
	font-size: 1.2em;
	margin: 1em 20px;
}
#toolkit #content h4{
	color: #000000;
	margin: 1em 0;
}
.verttoolkit h4{
	padding: 0 10px;
	color: #990000;
	text-transform: uppercase;
	}
#bottom-right h4{
	margin: 0 0 3px;
	color: white;
}
#bottom-right h5 a{
	color: white;
	font-weight: normal;
}
#green-banner{
	color: white;
	margin: 0;
	padding: 18px 20px 0;
	height: 66px;
	background: black url(img/bg-greentexture.gif) repeat-x left bottom;
}
#content #bottom-right h5{
	font: 1.0em/1.2em Georgia, "Times New Roman", Times, serif;
}
#bottom-right ul{
	color: white;
	margin: 0 0 -1px 0;
	height: 165px;
	padding: 0px 0 0px;
}
#bottom-right li{
	margin: 1em 250px 1em 30px;
	color: #000000;
	list-style: disc;
	background: none;
	padding: 0;
	font: 1em/1.2em Georgia, "Times New Roman", Times, serif;
}
p{
	margin: 1em 20px;
	font: 1.2em/1em Arial, Helvetica, sans-serif;
}
#content h5{
	margin: 2em 20px -.5em;
	font-size: 1.1em;
	text-transform:uppercase;
}
a{
	color: #CC6600;
	border-style: none;
	outline-style: none;
}
#overview a{
	text-decoration: none;
	font-weight: bold;
	color: #ff6600;
}
#toolkitnav a{
	text-decoration: none;
}
.toolkit p{
	margin: 1em 150px 1em 20px;
	color: #000000;
	clear: both;
	font-size: 1.1em;
	line-height: 1.5em;
}
#content p{
	font-size: 1.1em;
	line-height: 1.5em;
	color: #000000;	
}
.video, .screenshot{
	margin-left: 20px;
	font-weight: bold;
	text-decoration: none;
	color: #ff6600;
}
.video{
	padding-left: 10px;
	background: url(img/bullet-plus.gif) no-repeat left center;
}
.screenshot{
	padding-left: 10px;
	background: url(img/bullet-plus.gif) no-repeat left center;
}
.toolkit h3{
	float: left;
}
/*/////////CLEARFIX///////////////////////////////////////*/
.clearfix:after, #middle:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix, #middle {display: block;}




/*///////Lightbox//////////////////////////////////////////*/


#lightbox{
	position: absolute;
	top: 40px;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	}

#lightbox a img{ border: none; }

#outerImageContainer{
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
	}

#imageContainer{
	padding: 10px;
	}

#loading{
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
	}
#hoverNav{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
	}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{
	width: 49%;
	height: 100%;
	background: transparent url(img/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
	}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(/assets/img/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(/assets/img/nextlabel.gif) right 15% no-repeat; }


#imageDataContainer{
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	}

#imageData{
	padding:0 10px;
	}
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em;	}	
		
#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
	opacity: 0.6;
	}