@charset "utf-8";
/* CSS Document */

body {
	margin: 0;
	font-family: "Tahoma", Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000000;
	background: url(../graphics/bg.gif) repeat-x #001350 top;
}

a {color: #2816e8; text-decoration: underline; font-weight: bold;}
a:visited {color: #0d33a8;}
a:hover {color: #eca600;}
a:active {color: #ec9000;}

p {
	margin-top: 15px;
	margin-bottom: 0;
}

h1 {
	margin: 0;
	font-size: 24px;
	color: #2816e8;
	font-weight: normal;
	line-height: normal;
}

h2 {
	margin: 0;
	font-size: 20px;
	color: #2816e8;
	font-weight: normal;
	line-height: normal;
}

h3 {
	margin: 0;
	font-size: 18px;
	color: #2816e8;
	font-weight: normal;
	line-height: normal;
}

h4 {
	margin: 0;
	font-size: 16px;
	color: #2816e8;
	font-weight: normal;
	line-height: normal;
}

h5 {
	margin: 0;
	font-size: 14px;
	color: #2816e8;
	font-weight: normal;
	line-height: normal;
}

h6 {
	margin: 0;
	font-size: 12px;
	color: #2816e8;
	font-weight: normal;
	line-height: normal;
}

#header {
	width: 786px;
	height: 84px;
	margin: 22px auto 0 auto;
	background: url(../graphics/bg_header.gif) no-repeat center;
}

	#logo {
		width: 200px;
		height: 84px;
		margin-left: 18px;
		float: left;
	}
	
	*html #logo {margin-left: 9px;}
	
		#logo a {
			width: 200px;
			height: 84px;
			display: block;
			background: url(../graphics/northstar-automation.gif) no-repeat;
		}
		
	#learn-more {
		width: px;
		height: px;
		margin-top: 20px;
		margin-right: 18px;
		float: right;
	}
	
	*html #learn-more {margin-right: 9px;}
	
		#learn-more a {
			width: 146px;			
			height: 47px;
			display: block;
			background: url(../graphics/learn-more.gif) no-repeat;
		}
		
		#learn-more a:hover {background: url(../graphics/learn-more.gif) 0 -47px no-repeat;}

#collage-big {
	width: 786px;
	height: 223px;
	margin: 0 auto;
	background: url(../graphics/collage-big.jpg) no-repeat;
}

#sub-collage {
	width: 786px;
	height: 134px;
	margin: 0 auto;
}

	#sub-collage a {
		width: 786px;
		height: 134px;
		cursor: default;
		display: block;
		background: url(../graphics/sub-collage.jpg) no-repeat;
	}
	
	#sub-collage a:hover {background: url(../graphics/sub-collage.jpg) 0 -134px no-repeat;}

#container {
	width: 770px;
	margin: 0 auto;
	background: url(../graphics/bg_body.gif) repeat-y;
	border-left: 1px solid #ebebeb;
	border-right: 1px solid #ebebeb;
	border-bottom: 1px solid #ebebeb;
}

	#orange-bar {
		width: 770px;
		height: 40px;
		background: url(../graphics/bg_orange-bar.gif) repeat-x;
		text-align: center;
	}
	
	#body {width: 770px;}
	
		#nav {
			width: 200px;
			float: left;
		}
		
			#nav ul, #nav li {margin: 0; padding: 0; list-style: none;}
			#nav li a, #nav li a:visited {
				width: 190px;
				padding: 9px 0 11px 10px;
				display: block;
				font-size: 12px;
				font-weight: bold;
				color: #ffffff;
				text-decoration: none;
				background: url(../graphics/bg_nav.gif) repeat-x;
			}
			
			#nav li a:hover {background: url(../graphics/bg_nav.gif) 0 -34px repeat-x; color: #282368; text-decoration: none;}
		
		#content {
			/*width: 570px;*/
			width: 530px;
			padding: 12px 20px 20px 20px;
			line-height: 18px;
			float: right;
		}
		
			.prod-container {
				width: 530px;
				margin: 15px auto 0 auto;
			}
			
				.prod-header {
					width: 530px;
					height: 15px;
					background: url(../graphics/bg_prod-header.gif) no-repeat;
				}
				
				.prod-body {
					width: 498px;
					padding: 0 15px;
					/*background: url(../graphics/bg_prod-display.gif) repeat-y;*/
					background-color: #ffffff;
					border-left: 1px solid #acacac;
					border-right: 1px solid #acacac;
				}
				
					.prod-body p {margin-top: 10px; line-height: 16px;}
					
					.product-link, .product-link:visited {color: #2816e8; text-decoration: none; font-weight: normal;}
					.product-link:hover, .product-link:active {color: #2816e8; text-decoration: underline;}
					
					.prod-body img {float: right; margin: 0 0 0 10px; border: 0;}
				
				.prod-footer {
					width: 530px;
					height: 15px;
					background: url(../graphics/bg_prod-footer.gif) no-repeat;
				}
				
			.contact-container {
				width: 340px;
				margin-top: 15px;
				float: left;
			}
			
				.contact-header {
					width: 340px;
					height: 15px;
					background: url(../graphics/bg_contact-header.gif) no-repeat;
				}
				
				.contact-body {
					width: 308px;
					padding: 0 15px;
					background-color: #ffffff;
					border-left: 1px solid #acacac;
					border-right: 1px solid #acacac;
				}
				
				.contact-footer {
					width: 340px;
					height: 15px;
					background: url(../graphics/bg_contact-footer.gif) no-repeat;
				}
				
			.contact-info {
				width: 159px;
				margin-top: 15px;
				padding: 8px;
				font-size: 11px;
				border-top: 1px solid #d2d2d2;
				border-bottom: 1px solid #d2d2d2;
				background-color: #ffffff;
				float: right;
			}
		

#footer {
	width: 770px;
	margin: 0 auto;
	padding: 15px 0 20px 0;
	font-size: 10px;
	line-height: 14px;
	color: #ffffff;
}

	#footer-left {
		width: 380px;
		float: left;
	}
	
	#footer-right {
		width: 380px;
		text-align: right;
		float: right;
	}
	
	#footer a {color: #ffffff; text-decoration: underline;}
	#footer a:visited {color: #CCCCCC; text-decoration: underline;}
	#footer a:hover, #footer a:active {color: #eca600; text-decoration: underline;}

.hiddenspan {display: none;}
.blue-text {color: #2816e8;}

/****** CLEAR PROPERTIES ******/

.clear-both {clear: both;}
.clear-left {clear: left;}
.clear-right {clear: right;}

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

*html .prod-body:after, *html .clearfix {height: 1%;}



/******* FORM STYLES *******/

form {margin: 0;}

label {
	float: left;
	width: 90px;
	font-weight: bold;
	text-align: right;
	padding-right: 6px;
	padding-top: 2px;
}

input {width: 180px; height: 13px; margin-bottom: 5px;}

input, textarea {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	padding: 3px;
	margin-bottom: 5px;
	border: 1px solid #acacac;
	/*background: url(../graphics/bg_form.gif) repeat-x;*/
}

input.radio {width: 16px; height: 16px; margin-top: 4px; background: none; border: none;}

textarea {
	width: 180px;
	height: 98px;
}

.boxes {
	width: 16px;
	border: none;
	background: none;
}

#submitbutton {
	margin-left: 96px;
	margin-top: 5px;
	width: 62px;
	height: 30px;
	border: none;
	background: none;
}