/* Main Styles */
body {
	background: url(../images/layout/body_bg.jpg) top left repeat-x #727E85;
	padding: 0;
	margin: 0;
	font-family: Helvetica, Arial, sans-serif;
	}

p {
	color: #3E3E3E;
	font-size: .81em;
	line-height: 1.55em;
	margin-bottom: 1em;
	}
H1 {
	color: #28c;
	font-size: 1.65em;
	text-transform: uppercase;
	font-weight: normal;
	border-bottom: 1px solid #999;
	padding-bottom: 10px;
	line-height: 90%;
	}
H1.product_title {
	text-transform: none;
	}	
	H1 SUP {
		font-size: smaller;
		font-weight: normal;
		}
H2 {
	text-transform: uppercase;
	color: #69A444;
	margin: 15px 0 4px 0;
	}
H3 {
	color: #28c;
	font-size: .81em;
	text-transform: uppercase;
	margin-bottom: 3px;
	}
H4 {
	color: #28c;
	font-size: .81em;
	text-transform: none;
	margin-bottom: 1px;
	}
strong, b {
	font-weight: bold;
	color: #28c;
	}
em {
	font-style: italic;
	color: #666666;
	}
	.closing {
		padding-right: 16px;
		background: url(../images/icons/sts_icon.gif) center right no-repeat;
		}
a { color: #28c; }
a:hover { color: #593; }

HR {
	clear: both;
	margin-top: .4em;
	margin-bottom: 1em;
	padding: .5em 0;
	text-align: center;
	height: 1px;
	border: 0;
	border-bottom: 1px solid #ddd;
	}

/*layout*/	
#page {
	background: url(../images/layout/sts_bg_gradient.png) center 159px no-repeat;
	height: 100%;
	width: 100%;
	margin: 0 auto;
	}
#shadow {
	background: url(../images/layout/shadow_2.png) repeat-y top center;
	width: 1028px;
	margin: 0 auto;
	clear: both;
	}
#shadowFooter {
	background: url(../images/layout/shadow_bottom_2.png) no-repeat center top;
	height: 44px;
	width: 1028px;
	margin: 0 auto;
	clear: both;
	}
	
#contentWrapper {
	background: transparent;
	width: 978px;
	height: auto;
	padding: 0;
	margin: 0 auto;
	border: 1px solid #fff;
	border-top: none;
	clear: both;
	}
	
/*Header Area*/
#header {
	background: url(../images/layout/header.jpg) no-repeat;
	width: 978px;
	height: 159px;
	border-bottom: 1px solid #fff;
	padding: 0;
	position: relative;
	}
	#tagline {
		background: url(../images/layout/header_tag.png) no-repeat top left;
		width: 650px;
		height: 40px;
		position: absolute;
		left: 329px;
		top: 62px;
		}
		#header_logo {
			background: url(../images/layout/header_logo.jpg) no-repeat top left;
			width: 324px;
			height: 159px;
			float: left;
			}
			#header_right {
				width: 654px;
				height: 159px;
				float: left;
				}
				#header_right div {
					width: 217px;
					height: 159px;
					border-left: 1px solid #fff;
					float: left;
					}
			
		#subhead {
			width: 978px;
			height: 74px;
			border-bottom: solid 1px #fff;
			}
			#sub_left {
				width: 200px;
				height: 74px;
				background: url(../images/layout/subhead_left.jpg) no-repeat;
				float: left;
				}
				#sub_left span { visibility: hidden; display: none; }
			#sub_center {
				width: 559px;
				height: 74px;
				background: url(../images/layout/subhead_center.jpg) no-repeat;
				border-left: solid 1px #fff;
				border-right: solid 1px #fff;
				float: left;
				}
				#sub_center span { visibility: hidden; display: none; }
			#sub_right {
				width: 217px;
				height: 74px;
				background: url(../images/layout/subhead_right.jpg) no-repeat;
				float: left;
				overflow:hidden;
				}
				#sub_right p {
					font-size: .68em;
					color: #fff;
					line-height: 110%;
					margin: 12px 0 0 13px;
					} 

/*Content Area*/
#contentarea {
	width: 978px;
	height: auto;
	}

		
/* left column */
#columnLeft {
	width: 200px;
	height: auto;
	background: url(../images/layout/sidebarleft_bg.jpg) repeat-y top left;
	border-right: solid 1px #fff;
	float: left;
	padding: 0;
	margin: 0;
	z-index: 999;
	}
	#columnLeft P, #columnRight P {
		padding: 0 12px;
		}
	
/* Main Nav */	
#columnLeft #nav {	
	width: 200px;
	list-style: none;
	margin: 0 0 12px 0; padding: 0;
	position: static;
	}
	
	#columnLeft #nav li {
		margin: 0; padding: 0;
		position: relative;
		width: 200px;
		height: 41px;
		font-size: 1em;
		border-bottom: 1px solid white;
		}
		#columnLeft #nav .nav_home { background: url(../images/nav/home.jpg) top left no-repeat; }
		#columnLeft #nav .nav_about { background: url(../images/nav/about_us.jpg) top left no-repeat; }
		#columnLeft #nav .nav_products { background: url(../images/nav/products.jpg) top left no-repeat; }
		#columnLeft #nav .nav_support { background: url(../images/nav/web_support.jpg) top left no-repeat; }
		#columnLeft #nav .nav_customers { background: url(../images/nav/customers.jpg) top left no-repeat; }
		#columnLeft #nav .nav_contact { background: url(../images/nav/contact.jpg) top left no-repeat; }
		#columnLeft #nav .nav_login { background: url(../images/nav/login.jpg) top left no-repeat; }
		
		#columnLeft #nav li a {
			display: block;
			margin:0; padding:0;
			width: 200px; 
			height: 41px;
			text-align: left;
			text-decoration: none;
			background: transparent;
			border-bottom: none;
			}
			#columnLeft #nav li a span { display: none; font-size: 8px; }
			#columnLeft #nav li:hover { background-position: -200px top; }		
			
	/* sub nav */
		#columnLeft #nav li ul {
			position: absolute;
			margin: 0; padding: 0;
			left: 200px;
			top: -1px;
			display: none;
			list-style: none;
			font-size: .8em;
			color: #fff;
			border-collapse: collapse;
			border-bottom: 1px solid #ccc;
			z-index: 50;
			}
			#columnLeft #nav li.nav_products ul {
				top: -42px;
				}
		#columnLeft #nav li li { 
			height: auto;
			width: 160px; /* 150 + a padding below */
			margin: 0; padding: 0;
			color: #fff;
			border: none;
			border: 1px solid #ccc; border-bottom: none; border-right-width: 1px;
			}
		#columnLeft #nav li:hover ul {
			display: block;
			}
			#columnLeft #nav li ul a, #columnLeft #nav li ul h3 {
				width: 150px;
				height: auto;
				padding: 5px 5px 3px;
				margin: 0;
				display: block;
				color: #fff;
				text-decoration: none;
				/*border: 1px solid #ccc; border-bottom: none; border-right-width: 1px;*/
				background: #28c;
				} #columnLeft #nav li ul h3 { background-color: #06a; font-weight: normal;
					}
				#columnLeft #nav li ul a.navSubproduct {
					width: 144px; /* 150 - border*/
					font-size: .93em;
					color: #bef;
					border-left: 6px solid #06a;
					}
			#columnLeft #nav li ul a:hover {
				color: white;
				background: #593;
				}
				#columnLeft #nav li ul a.mainNavSubOver {
					color: #fff;
					text-transform: uppercase;
					background: #0A6EA2;
					}
				#columnLeft #nav li ul a.mainNavSubOver:hover {
					color: #fff;
					background: #003757;
					}
/* end nav */


#right_wrap {
	width: 777px;
	height: auto;
	padding: 0;
	margin: 0;
	margin-left: 201px;
	z-index: 1;
	position: static;
	}
	#middle {
		position: relative;
		width: 519px; /*559px with 40px padding*/
		min-height: 450px;
		padding: 20px 20px 20px 20px;
		background: url(../images/layout/content_logo.jpg) left bottom no-repeat;
		float: left;
		}
		#middle a {
			color: #28c;
			text-decoration: none;
			border-bottom: 1px dotted #28c;
			}
		#middle a:hover {
			color: #592; /*#669933;*/
			border-bottom: 1px solid #592;
			}
			#middle a.noBorder { border: none; }
			#middle a:hover.noBorder { border: none; }
		
			#middle ul {
				margin: 0 0 12px 0;
				padding: 0 0 0 10px;
				}
			#middle li {
				color: #3E3E3E;
				font-size: .81em;
				line-height: 165%;
				margin: 0 0 .3em 0;
				padding-left: 15px;
				line-height: 130%;
				background: url(../images/icons/arrow_blue.gif) left 3px no-repeat;
				}
				 
				#middle.middle_fullwidth {
					 background: #fff;
					 width: 738px;
					 }
				.productpage_block {
					width: 345px;
					height: auto;
					float: left;
					}
				 .productsContainer {
					padding: 0 0 16px 0;
					margin: 0 0 1em 0;
					background: transparent url(../images/layout/fading_corner_2.jpg) bottom left no-repeat;
					position: relative;
					}
					#middle .productsContainer H2, #middle .productsContainer H2.product_title  {
	margin: 0 0 4px;
	padding: 18px 18px 6px;
	color: #28c;
	font-size: 1em;
	font-weight: normal;
	text-transform: none;
	background: transparent url(../images/layout/fading_corner_2_top.png) top left no-repeat;
	text-align: left;
						}
					#middle .productsContainer H2 A, #middle .productsContainer H2.blockify {
						/*display: block;*/
						color: #28c;
						}
							H1 .product_sub {
								color: #000;
								font-size: .62em;
								line-height: 1.16em;
								border-bottom: none;
								}
					/*#middle .productsContainer H2:hover, #middle .productsContainer H2:hover STRONG, #middle .productsContainer H2 A:hover, #middle .productsContainer H2:hover A, #middle .productsContainer H2:hover A STRONG {
						color: #593;
						}*/
					#middle .productsContainer H2 A:hover, #middle .productsContainer H2 A:hover STRONG {
						color: #593;
						}
					#middle .productsContainer A:hover STRONG { color: #593; }
					
						 #middle .productsContainer P {
							margin: 0 18px 6px;
							line-height: 1.33em;
							font-size: .76em;
							/*color: #111;*/
						 	margin-bottom: 10px;
							}
						#middle .productsContainer UL, #middle UL.products_ul {
							margin: 0 18px 6px;
							padding: 0;
							line-height: 1.33em;
						 	margin-bottom: 0;
							border-left: 1px solid #999;
							}
						 #middle UL.products_ul LI {
						 	margin-left: 18px;
							background: none;
							font-size: .76em;
							/*color: #111;*/
							margin: 0 0 .4em 0;
							}
				 			.suite_title { color: #28c; font-size: 1.1em; }
							
							/*#middle .productsContainer H2 A { border-bottom: none; }
							#middle .productsContainer H2 A:hover { border-bottom: none; }*/

#columnContentRight {
	width: 217px;
	border-left: solid 1px #999;
	margin-left: 559px;
	padding-top: 15px;
	background: url(../images/layout/sidebarright_bg.jpg) repeat-y top left;
	}
	#columnContentRight ul {
		margin: -3px 0 0 -12px;
		padding: 0;
		}
		#columnContentRight li {
			padding: 15px 15px 15px 47px;
			margin: 0 0 10px 0;
			color: #3E3E3E;
			font-size: .77em;
			}			

/**** sidebar boxes ****/
#columnContentRight .sidebarsRight {
	position: relative;
	padding:0;
	margin: 0;
	width: 210px;
	height: auto;
	}
#columnLeft .sidebarsLeft {
	position: relative;
	padding:0;
	margin:0;
	width: 198px;
	height:auto;
	}
	#columnContentRight .sidebarsRight a, #columnLeft .sidebarsLeft a {
		text-decoration: none; 
		color: #fff;
		border-bottom: dotted 1px #fff; 
		}
	#columnContentRight .sidebarsRight a:hover, #columnLeft .sidebarsLeft a:hover {
		color: #000; 
		border-bottom: dotted 1px #000;
		}
	#columnContentRight .sidebarsRight P, #columnLeft .sidebarsLeft P {
		color: #fff; 
		margin: 0 18px 0 24px;
		padding: 0;
		padding-top: 6px;
		font-size: .76em; 
		line-height:1.3em;
		}
		
	#columnContentRight .sidebarsRight strong, #columnLeft .sidebarsLeft strong,#columnContentRight .sidebarsRight b, #columnLeft .sidebarsLeft sb {
		color: #fff;
		font-weight: bold;
		}
		
	#columnContentRight .sidebarsRight ul, #columnLeft .sidebarsLeft ul {
		margin: 0 18px 0 24px; padding: 0;
		font-size: .88em; 
		line-height:1em;
		}
		#columnContentRight .sidebarsRight li, #columnLeft .sidebarsLeft li {
			font-size: .81em; color: #fff; 
			padding: 8px 0 0 15px; 
			margin: 0;
			background: url(../images/icons/arrow.png) left 9px no-repeat;
			}
	#columnContentRight .sidebarsRight h6, #columnLeft .sidebarsLeft h6 {
		margin: 0 24px; padding: 17px 0 9px 0;
		font-weight: normal;
		font-size: .92em;
		color: #fff;
		}
	#columnContentRight .sidebarsRight h6 a, #columnLeft .sidebarsLeft h6 a { border:none; }
	
	.sidebarsIcon {
		position: absolute;
		top: -5px; right: 2px;
		width: 42px;
		height: 42px;
		background: url(../images/icons/product_icons/product_icons-39.png) top left no-repeat;
		}
		.product_icon39 { background: url(../images/icons/product_icons/product_icons-39.png) top left no-repeat; }
		.product_icon33 { background: url(../images/icons/product_icons/product_icons-33.png) top left no-repeat; }	
		
	.sidebarBlueTop { width: 210px; overflow: visible; background: url(../images/sidebars/images/sidebar_blue_top.png) center top no-repeat; }
	.sidebarBlueMid { width: 210px; overflow: visible; background: url(../images/sidebars/images/sidebar_blue_mid.png) center bottom no-repeat; }
	.sidebarBlueBottom { width: 210px; height: 34px; background: url(../images/sidebars/images/sidebar_blue_bottom.png) center top no-repeat; }
	#columnContentRight .sidebarsRight .sidebarBlueMid a { color: #ff0; border-bottom: 1px dotted #ff0; }
	#columnContentRight .sidebarsRight .sidebarBlueMid a:hover { color: #4f0; border-bottom: 1px dotted #4f0; }
		
	.sidebarYellowTop { width: 210px; overflow: visible; background: url(../images/sidebars/images/sidebar_yellow_top.png) center top no-repeat; }
	.sidebarYellowMid { width: 210px; overflow: visible; background: url(../images/sidebars/images/sidebar_yellow_mid.png) center bottom no-repeat; }
	.sidebarYellowBottom { width: 210px; height: 44px; background: url(../images/sidebars/images/sidebar_yellow_bottom.png) center top no-repeat; }
	#columnContentRight .sidebarsRight .sidebarYellowMid p, #columnContentRight .sidebarsRight .sidebarYellowMid li { color: #333; }
	#columnContentRight .sidebarsRight .sidebarYellowTop h6 a { color: #fff; }
	#columnContentRight .sidebarsRight .sidebarYellowTop h6 a:hover { color: #000; }
	#columnContentRight .sidebarsRight .sidebarYellowMid strong { color: #000; }
	#columnContentRight .sidebarsRight .sidebarYellowMid a { color: #f00; border-bottom: 1px dotted #f00; }
	#columnContentRight .sidebarsRight .sidebarYellowMid a:hover { color: #03a; border-bottom: 1px dotted #03a; }
		
	.sidebarGreenTop { width: 198px; margin-top: 14px; overflow: visible; background: url(../images/sidebars/images/sidebar_green_top.png) center top no-repeat; }
	.sidebarGreenMid { width: 198px; overflow: visible; background: url(../images/sidebars/images/sidebar_green_mid.png) center bottom no-repeat; }
	.sidebarGreenBottom { width: 198px; height: 34px; background: url(../images/sidebars/images/sidebar_green_bottom.png) center top no-repeat; }
	#columnLeft .sidebarsLeft .sidebarGreenMid a { color: #ff0; border-bottom: 1px dotted #ff0; }
	#columnLeft .sidebarsLeft .sidebarGreenMid a:hover { color: #03a; border-bottom: 1px dotted #03a; }

	.whitelink { color: #fff; }
/**** END sidebar boxes ****/

#footer {
	width: 978px;
	height: 22px;
	line-height: 22px;
	margin: 0 auto;
	border-bottom: solid 1px #fff;
	border-left: solid 1px #fff;
	border-right: solid 1px #fff;
	}
	#footer_left {
		width: 200px;
		height: 22px;
		background: url(../images/layout/footer_bg.jpg) repeat-x;
		float: left;
		border-right: 1px solid #fff;
		text-align: center;
		overflow:visible;
		}
	#footer_right {
		width: 758px; /*777px with 20px padding*/
		height: 22px;
		overflow:visible;
		background: url(../images/layout/footer_bg.jpg) repeat-x;
		padding-left: 20px;
		margin-left: 200px;
		}
		#footer p {
			font-size: .73em;
			color: #fff;
			padding: 3px 0 2px;
			}
			#footer .bluetext { color: #AED6FF; }

.imageLeft {
	float: left; margin-right: 12px;
	}
.imageRight {
	float: right; margin-left: 12px;
	}
	a img.imageLeft, a img.imageright {
		padding: 1px;
		background: #bebebe;
		}
	a:hover .imageLeft, a:hover .imageRight {
		background: #000;
		}

	
/*Misc*/
.noDisplay {
	display:none;
	font-size: 1px;
	visibility: hidden;
	}

.fix {
	margin: 0; padding: 0;
	visibility:hidden;
	clear:both;
	display:block;
	font-size: 1px;
	height: 0;
	border: none;
	background: none;
	}
	
.float_left {
	float: left;
	}
	
.ContactStyle {
	font-size: .82em;
	color: #28c;
	padding: 0 10px 0 0;
	vertical-align: top;
	}

/*Logo Thumbnails*/
.logo_small {
	position: absolute;
	top: 10px;
	right: 8px;
	}
.logo_big {
	margin-bottom: 15px;
	}

/*** list icons ***/
#middle li.address {
	background: url(../images/icons/home.gif) left 2px no-repeat;
	}
#middle li.phone {
	background: url(../images/icons/mobile.gif) left 2px no-repeat;
	}
#middle li.fax {
	background: url(../images/icons/printer.gif) left 2px no-repeat;
	}

				
input {
	margin-bottom: 5px;
	}
textarea {
	margin-bottom: 5px;
	}
	table.contact_table td {
	vertical-align: top;
	}
	table.contact_table label, table label, table label.ContactStyle {
		vertical-align: top;
		padding-top: 4px;
		}


#credit { width:980px; margin:0 auto; font-size:11px; color:#adbdc6; text-align:right; }
#credit a { color:#adbdc6; text-decoration:none; }
#credit a:hover { color:#fff; }

/** COLORS 
#28c; blue
#AED6FF; light blue
#69A444; green
#694; green
**/