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

/*-- changes made by wn on 11.11.08 - changed the mainBlue, mainGreen, mainOrange, mainMagenta widths from 752 to 600 --*/

/*-- Basic --------------------------------------------------------------------*/
html, body {
	height: 100%;
}

body {
	margin:0;
	padding:0;
	font: 0.91em "Helvetica", Arial, sans-serif;
	color: #4d4d4d;
	background: #fff url(../images/backbg.jpg) no-repeat top center;
}

p {
	color: #565656;
	line-height: 180%;
}

.product {
	color: #4d4d4d;
	font-size: 0.78em;
	line-height: 160%;
	margin-left: 75px;
}

.information {
	color: #4d4d4d;
	font-size: 0.78em;
	line-height: 160%;
	margin-left: 35px;
}

.design {
	color: #4d4d4d;
	font-size: 0.78em;
	line-height: 160%;
	margin-left: 65px;
}

a:focus {
	outline: none;
}

a img {
	border: 0;
}

h1 {
	font-family: "Helvetica", Arial, sans-serif;
	font-size: 6.78em;
	font-style:normal;
	font-weight:700;
	color: #86be3b;
	letter-spacing: -0.05em;
	padding: 0;
	margin: 50px 0 20px 0;
}


h2 {
	font-family: "Helvetica", Arial, sans-serif;
	font-size: 2.43em;
	font-style:normal;
	font-weight:700;
	color: #565656;
	letter-spacing: -0.03em;
	text-align: justify;
	padding: 0;
	margin: 20px 0 30px 0;
}

h3 {
	font-family: "Helvetica", Arial, sans-serif;
	font-size: 1.31em;
	font-style:normal;
	font-weight:400;
	color: #565656;
	line-height: 180%;
	text-align: justify;
	padding: 0;
	margin: 20px 0 30px 0;
}

h4 {
	font-family: "Helvetica", Arial, sans-serif;
	font-size: 1.50em;
	font-style:normal;
	font-weight:700;
	color: #565656;
	display: inline;
	line-height: 0.6em;
}

h5 {
	font-family: "Helvetica", Arial, sans-serif;
	font-size: 1.50em;
	font-style:normal;
	font-weight:700;
	color: #565656;
	line-height: 0.6em;
	padding: 20px 0 0 0;
	margin: 20px 0 0 0;
}

/*-- Colors --------------------------------------------------------------------*/
.gray {
	color: #afafaf;
}
.blue {
	color: #3860b8;
}

.green {
	color: #6eb517;
}

.orange {
	color: #df880e;
}

.magenta {
	color: #ed145b;
}

.white {
	color: #fff;
}

/*-- General --------------------------------------------------------------------*/
.container {
	position: relative;
	left: 50%;
	width: 960px;
	margin-left: -480px;
	min-height:100%;
	margin-bottom: -332px;
}

.login {
	position:relative;
	top:0px;
	left:0px;
	width:100%;
	height:8px;
	background: white;
}


.logo {
	position: absolute;
	top: 21px;
	left: 48px;
	width: 182px;
	height: 135px;
	background: url(../images/logo.gif) no-repeat;
	z-index: 99;

}
	
	.mainBlue {
		position: relative;
		float: left;
		width: 650px;
		top: 160px;
		margin-bottom: 350px;
	
	}
		.mainBlue ul li {
			color: #3860b8;
			list-style-image:url(../images/bullet.gif);
			line-height: 180%;
		}
	
	.mainGreen {
		position: relative;
		float: left;
		width: 650px;
		top: 160px;
		margin-bottom: 350px;
	
	}
		.mainGreen ul li {
			color: #6eb517;
			list-style-image:url(../images/bullet.gif);
			line-height: 180%;
		}
	
	.mainOrange {
		position: relative;
		float: left;
		width: 650px;
		top: 160px;
		margin-bottom: 350px;
	
	}
		.mainOrange ul li {
			color: #df880e;
			list-style-image:url(../images/bullet.gif);
			line-height: 180%;
		}
		
	.mainMagenta {
		position: relative;
		float: left;
		width: 650px;
		top: 160px;
		margin-bottom: 350px;
	
	}
	
		.workContainer {
			position: relative;
			float: left;
			width: 280px;
			margin: 15px 22px 15px 22px;
			line-height: 180%;
		}	
		
		.workContainer img {
			border: 5px #565656 solid;
		}			
		
		.workContainer a, a:active, a:visited {
			color: #ed145b;
			text-decoration: none;
		}
		
		.workContainer a:hover {
			color: #ed145b;
			text-decoration: underline;
		}
		
		.mainMagenta ul li {
			color: #ed145b;
			list-style-image:url(../images/bullet.gif);
			line-height: 180%;
		}
		


		
/*-- Navigation (Blue) --------------------------------------------------------------------*/		
	#navBlue {
		position: absolute;
		top: 21px;
		right: 0px;
		z-index: 9999;
	}

		#navBlue ul li {
			display: inline;
			list-style-type:none;
			padding: 2px 2px 0px 0px;
			margin: 0;
		}	
		
		#navBlue ul li a {
			font: 1em "Helvetica", Arial, sans-serif;
			color: #fff;
			padding: 8px 17px 8px 17px;
			margin: 0;
			text-decoration: none;
			background: #5a5a5a;
			filter:alpha(opacity=100);
			-moz-opacity:1.0;
			-khtml-opacity: 1.0;
			opacity: 1.0;
		}
		
		#navBlue ul li a:hover {
			background: #3860b8;
			text-decoration: none;
			filter:alpha(opacity=100);
			-moz-opacity:1.0;
			-khtml-opacity: 1.0;
			opacity: 1.0;
		}
		
		#navBlue ul li a.selected {
			background: #3860b8;
			text-decoration: none;
		}
		
		#navBlue ul li a.selected:hover {
			background: #3860b8;
			text-decoration: none;
		}
		
/*-- Navigation (Green) --------------------------------------------------------------------*/		
	#navGreen {
		position: absolute;
		top: 21px;
		right: 0px;
	}
	
		#navGreen ul li {
			display: inline;
			list-style-type:none;
			padding: 2px 2px 0px 0px;
			margin: 0;
		}	
		
		#navGreen ul li a {
			font: 1em "Helvetica", Arial, sans-serif;
			color: #fff;
			padding: 8px 17px 8px 17px;
			margin: 0;
			text-decoration: none;
			background: #5a5a5a;
			filter:alpha(opacity=100);
			-moz-opacity:1.0;
			-khtml-opacity: 1.0;
			opacity: 1.0;
		}
		
		#navGreen ul li a:hover {
			background: #6eb517;
			text-decoration: none;
			filter:alpha(opacity=100);
			-moz-opacity:1.0;
			-khtml-opacity: 1.0;
			opacity: 1.0;
		}
		
		#navGreen ul li a.selected {
			background: #6eb517;
			text-decoration: none;
		}
		
		#navGreen ul li a.selected:hover {
			background: #6eb517;
			text-decoration: none;
		}
		
/*-- Navigation (Orange) --------------------------------------------------------------------*/		
	#navOrange {
		position: absolute;
		top: 21px;
		right: 0px;
	}
	
		#navOrange ul li {
			display: inline;
			list-style-type:none;
			padding: 2px 2px 0px 0px;
			margin: 0;
		}	
		
		#navOrange ul li a {
			font: 1em "Helvetica", Arial, sans-serif;
			color: #fff;
			padding: 8px 17px 8px 17px;
			margin: 0;
			text-decoration: none;
			background: #5a5a5a;
			filter:alpha(opacity=100);
			-moz-opacity:1.0;
			-khtml-opacity: 1.0;
			opacity: 1.0;
		}
		
		#navOrange ul li a:hover {
			background: #df880e;
			text-decoration: none;
			filter:alpha(opacity=100);
			-moz-opacity:1.0;
			-khtml-opacity: 1.0;
			opacity: 1.0;
		}
		
		#navOrange ul li a.selected {
			background: #df880e;
			text-decoration: none;
		}
		
		#navOrange ul li a.selected:hover {
			background: #df880e;
			text-decoration: none;
		}

/*-- Navigation (Magenta) --------------------------------------------------------------------*/		
	#navMagenta {
		position: absolute;
		top: 21px;
		right: 0px;
	}
	
		#navMagenta ul li {
			display: inline;
			list-style-type:none;
			padding: 2px 2px 0px 0px;
			margin: 0;
		}	
		
		#navMagenta ul li a {
			font: 1em "Helvetica", Arial, sans-serif;
			color: #fff;
			padding: 8px 17px 8px 17px;
			margin: 0;
			text-decoration: none;
			background: #5a5a5a;
			filter:alpha(opacity=100);
			-moz-opacity:1.0;
			-khtml-opacity: 1.0;
			opacity: 1.0;
		}
		
		#navMagenta ul li a:hover {
			background: #ed145b;
			text-decoration: none;
			filter:alpha(opacity=100);
			-moz-opacity:1.0;
			-khtml-opacity: 1.0;
			opacity: 1.0;
		}
		
		#navMagenta ul li a.selected {
			background: #ed145b;
			text-decoration: none;
		}
		
		#navMagenta ul li a.selected:hover {
			background: #ed145b;
			text-decoration: none;
		}

/*-- Sub-Navigation (Blue) --------------------------------------------------------------------*/		
	.subnavBlue {
		position: relative;
		float: left;
		width: 208px;
		top: 200px;
		margin-left: 30px;
	}
		
		.subnavBlue ul li {
			padding: 10px 0 10px 20px;
			list-style-image: url(../images/bullet.gif);
			list-style-position:inside;
		}	
		
		.subnavBlue ul li a {
			font: bold 0.81em "Helvetica", Arial, sans-serif;
			color: #999;
			text-decoration: none;
		}
		
		.subnavBlue ul li a:hover {
			color: #3860b8;
			text-decoration: none;
		}
		
		.subnavBlue ul li a.selected {
			font: bold 0.81em "Helvetica", Arial, sans-serif;
			color: #3860b8;
			text-decoration: none;
		}
		
		.subnavBlue ul li a.selected:hover {
			cursor: text;
			text-decoration: none;
		}
		
/*-- Sub-Navigation (Green) --------------------------------------------------------------------*/		
	.subnavGreen {
		position: relative;
		float: left;
		width: 208px;
		top: 200px;
		margin-left: 30px;
	}
		
		.subnavGreen ul li {
			padding: 10px 0 10px 20px;
			list-style-image: url(../images/bullet.gif);
			list-style-position:inside;
		}	
		
		.subnavGreen ul li a {
			font: bold 0.81em "Helvetica", Arial, sans-serif;
			color: #999;
			text-decoration: none;
		}
		
		.subnavGreen ul li a:hover {
			color: #6eb517;
			text-decoration: none;
		}
		
		.subnavGreen ul li a.selected {
			font: bold 0.81em "Helvetica", Arial, sans-serif;
			color: #6eb517;
			text-decoration: none;
		}
		
		.subnavGreen ul li a.selected:hover {
			cursor: text;
			text-decoration: none;
		}
		
/*-- Sub-Navigation (Orange) --------------------------------------------------------------------*/		
	.subnavOrange {
		position: relative;
		float: left;
		width: 208px;
		top: 200px;
		margin-left: 30px;
	}
		
		.subnavOrange ul li {
			padding: 10px 0 10px 20px;
			list-style-image: url(../images/bullet.gif);
			list-style-position:inside;
		}	
		
		.subnavOrange ul li a {
			font: bold 0.81em "Helvetica", Arial, sans-serif;
			color: #999;
			text-decoration: none;
		}
		
		.subnavOrange ul li a:hover {
			color: #df880e;
			text-decoration: none;
		}
		
		.subnavOrange ul li a.selected {
			font: bold 0.81em "Helvetica", Arial, sans-serif;
			color: #df880e;
			text-decoration: none;
		}
		
		.subnavOrange ul li a.selected:hover {
			cursor: text;
			text-decoration: none;
		}
		
/*-- Sub-Navigation (Magenta) --------------------------------------------------------------------*/		
	.subnavMagenta {
		position: relative;
		float: left;
		width: 208px;
		top: 200px;
		margin-left: 30px;
	}
		
		.subnavMagenta ul li {
			padding: 10px 0 10px 20px;
			list-style-image: url(../images/bullet.gif);
			list-style-position:inside;
		}	
		
		.subnavMagenta ul li a {
			font: bold 0.81em "Helvetica", Arial, sans-serif;
			color: #999;
			text-decoration: none;
		}
		
		.subnavMagenta ul li a:hover {
			color: #ed145b;
			text-decoration: none;
		}
		
		.subnavMagenta ul li a.selected {
			font: bold 0.81em "Helvetica", Arial, sans-serif;
			color: #ed145b;
			text-decoration: none;
		}
		
		.subnavMagenta ul li a.selected:hover {
			cursor: text;
			text-decoration: none;
		}

/*-- Footer-navigation (Blue) --------------------------------------------------------------------*/	
#footernavBlue {
		position: absolute;
		top: 20px;
		right: 29px;
	}
	
		#footernavBlue ul li {
			display: inline;
			list-style-type:none;
		}	
		
		#footernavBlue ul li a {
			font: bold 0.81em "Helvetica", Arial, sans-serif;
			color: #999;
			padding: 0px 0px 0px 14px;
			text-decoration: none;
		}
		
		#footernavBlue ul li a:hover {
			color: #3860b8;
			text-decoration: none;
		}
		
/*-- Footer-navigation (Green) --------------------------------------------------------------------*/	
#footernavGreen {
		position: absolute;
		top: 20px;
		right: 29px;
	}
	
		#footernavGreen ul li {
			display: inline;
			list-style-type:none;
		}	
		
		#footernavGreen ul li a {
			font: bold 0.81em "Helvetica", Arial, sans-serif;
			color: #999;
			padding: 0px 0px 0px 14px;
			text-decoration: none;
		}
		
		#footernavGreen ul li a:hover {
			color: #6eb517;
			text-decoration: none;
		}
		
/*-- Footer-navigation (Orange) --------------------------------------------------------------------*/	
#footernavOrange {
		position: absolute;
		top: 20px;
		right: 29px;
	}
	
		#footernavOrange ul li {
			display: inline;
			list-style-type:none;
		}	
		
		#footernavOrange ul li a {
			font: bold 0.81em "Helvetica", Arial, sans-serif;
			color: #999;
			padding: 0px 0px 0px 14px;
			text-decoration: none;
		}
		
		#footernavOrange ul li a:hover {
			color: #df880e;
			text-decoration: none;
		}
		
/*-- Footer-navigation (Magenta) --------------------------------------------------------------------*/	
#footernavMagenta {
		position: absolute;
		top: 20px;
		right: 29px;
		z-index: 99999;
	}
	
		#footernavMagenta ul li {
			display: inline;
			list-style-type:none;
		}	
		
		#footernavMagenta ul li a {
			font: bold 0.81em "Helvetica", Arial, sans-serif;
			color: #999;
			padding: 0px 0px 0px 14px;
			text-decoration: none;
		}
		
		#footernavMagenta ul li a:hover {
			color: #ed145b;
			text-decoration: none;
		}

/*-- Home Page --------------------------------------------------------------------*/
	#homegraphic {
		position: absolute;
		left: 50%;
		width: 960px;
		height: 130px;
		margin-top: 175px;
		margin-left: -480px;
		text-align: center;
		background: url(../images/home_words_blue.png) no-repeat top center;
	}
	
	#designContainer {
		position: absolute;
		top: 294px;
		left: 51px;
		width: 259px;
		height: 415px;
		z-index: 9999;
	}
	
	#itContainer {
		position: absolute;
		top: 324px;
		left: 379px;
		width: 259px;
		height: 385px;
		z-index: 9999;
	}
	
	#productContainer {
		position: absolute;
		top: 324px;
		left: 699px;
		width: 259px;
		height: 385px;
		z-index: 9999;
	}

/*-- Careers Page --------------------------------------------------------------------*/
	#envelope {
		background: url(../images/envelope.png) no-repeat top left;
		width: 67px;
		height: 42px;
	}
	
	.careerslinks a {color: #3a4c66; font-weight: 600;}
	.careerslinks a:link {color: #FFFF00;}
	.careerslinks a:hover {color: #b8c2ba;}

/*-- Footer --------------------------------------------------------------------*/
	#footer {
		height: 332px;
		width: 100%;
		background: url(../images/footerbg.gif) repeat-x top center;
		background-color:#181b28;
		position: relative;
	}
	
	#footer2 {
		height: 332px;
		width: 100%;
		background: url(../images/footerbg2.gif) repeat-x top center;
		background-color:#181b28;
		position: relative;
	}
	
	.clearfooter {
		height: 332px;
		clear: both;
	}
	
	/*-- Footer Home --------------------------------------------------------------------*/
	#footerContainerhome {
		position: absolute;
		top: 645px;
		left: 50%;
		width: 960px;
		height: 332px;
		margin-left: -480px;
	}
	
	#privacyhome {
			position:absolute;
			right: 29px;
			bottom: 55px;
			font: 0.63em "Helvetica", Arial, sans-serif;
			color: #565656;
		}
		
			#privacyhome a {
				color: #565656;
				text-decoration: none;
			}
			
			#privacyhome a:hover {
				color: #3860b8;
				text-decoration: none;
			}
		
		#copyhome {
			position:absolute;
			left: 67px;
			bottom: 55px;
			font: 0.63em "Helvetica", Arial, sans-serif;
			color: #565656;
		}

	#navFooterhome {
		position: absolute;
		bottom: 80px;
		right: 29px;
	}
	
		#navFooterhome ul li {
			display: inline;
			list-style-type:none;
		}	
		
		#navFooterhome ul li a {
			font: bold 0.81em "Helvetica", Arial, sans-serif;
			color: #999;
			padding: 0px 0px 0px 14px;
			text-decoration: none;
		}
		
		#navFooterhome ul li a:hover {
			color: #3860b8;
			text-decoration: none;
		}
	
	/*-- Footer Back --------------------------------------------------------------------*/
	#footerContainer {
		position: relative;
		left: 50%;
		width: 960px;
		height: 332px;
		margin-left: -480px;
	}
		#copy {
			position:absolute;
			left: 67px;
			top: 70px;
			font: 0.63em "Helvetica", Arial, sans-serif;
			color: #565656;
			z-index: 9999;
		}	
		
		/*-- Privacy/Terms (Blue) --------------------------------------------------------------------*/
		#privacytermsBlue {
			position:absolute;
			right: 29px;
			top: 70px;
			font: 0.63em "Helvetica", Arial, sans-serif;
			color: #565656;
		}
		
			#privacytermsBlue a {
				color: #565656;
				text-decoration: none;
			}
			
			#privacytermsBlue a:hover {
				color: #3860b8;
				text-decoration: none;
			}
		
		/*-- Privacy/Terms (Green) --------------------------------------------------------------------*/	
		#privacytermsGreen {
			position:absolute;
			right: 29px;
			top: 70px;
			font: 0.63em "Helvetica", Arial, sans-serif;
			color: #565656;
		}
		
			#privacytermsGreen a {
				color: #565656;
				text-decoration: none;
			}
			
			#privacytermsGreen a:hover {
				color: #6eb517;
				text-decoration: none;
			}
		
		/*-- Privacy/Terms (Orange) --------------------------------------------------------------------*/
		#privacytermsOrange {
			position:absolute;
			right: 29px;
			top: 70px;
			font: 0.63em "Helvetica", Arial, sans-serif;
			color: #565656;
		}
		
			#privacytermsOrange a {
				color: #565656;
				text-decoration: none;
			}
			
			#privacytermsOrange a:hover {
				color: #df880e;
				text-decoration: none;
			}			
		
		/*-- Privacy/Terms (Magenta) --------------------------------------------------------------------*/
		#privacytermsMagenta {
			position:absolute;
			right: 29px;
			top: 70px;
			font: 0.63em "Helvetica", Arial, sans-serif;
			color: #565656;
			z-index: 9999;
		}
		
			#privacytermsMagenta a {
				color: #565656;
				text-decoration: none;
			}
			
			#privacytermsMagenta a:hover {
				color: #ed145b;
				text-decoration: none;
			}
			
			
			
			
/*** ESSENTIAL STYLES ***/
.sf-menu, .sf-menu * {
	margin:			0;
	padding:		0;
	list-style:		none;
}
.sf-menu {
	line-height:	1.0;
}
.sf-menu ul {
	position:		absolute;
	top:			-999em;
	width:			17em; /* left offset of submenus need to match (see below) */
}
.sf-menu ul li {
	width:			80%;
}
.sf-menu li:hover {
	visibility:		inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li {
	float:			left;
	position:		relative;
}
.sf-menu a {
	display:		block;
	position:		relative;
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
	left:			0;
	top:			34px; /* match top ul list item height */
	z-index:		99;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left:			17em; /* match ul width */
	top:			0;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
	left:			17em; /* match ul width */
	top:			0;
}

/*** DEMO SKIN ***/
.sf-menu a {
	font: 1em "Helvetica", Arial, sans-serif;
	color: #999;
	padding: 0px 0px 0px 50px;
	text-decoration: none;
}
.sf-menu a, .sf-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
	color:	#999;
}
.sf-menu li {			
	padding: 0px 0px 0px 50px;
	display:inline;
	list-style-type:none;
}
.sf-menu li.selected {
	text-decoration: none;
	cursor:text;
	color: #3860b8;
}
.sf-menu li li {
	color: #999;
	padding: 2px 0px 0px 50px;
}
.sf-menu li:hover, .sf-menu li.sfHover {
	color: #3860b8;
	text-decoration: none;
}
.sf-menu li li:hover, .sf-menu li li.sfHover {
	color: #3860b8;
	text-decoration: none;
}
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
	
}

/*-- Design Flash --------------------------------------------------------------------*/
#flash {
	position: absolute;
	top: 0px;
	left: 50%;
	width: 960px;
	height: 800px;
	margin-left: -465px;
	z-index: 9999;
}