body {
	background: #FFF url(../images/mainBG.jpg) repeat-x top;
	font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
	line-height: 1.45;
}
/*---------FOR IE PNG SUPPORT----------*/
img, div, a, input {
	behavior: url(css/iepngfix.htc);
}
/*--------------------------------------*/

/*--------------TEXT STYLES-------------*/
h1 {
	color: #990000;
	font-size: 120%; line-height: 1;
	margin-bottom: 10px;
}
h2 {
	color: #333;
	font-size: 95%; font-weight: bold; line-height: 1.2;
	margin-bottom: 5px;
}
h3 {
	color: #990000;
	font-size: 170%; line-height: 1;
	margin-bottom: 25px;
	margin-left: 12px;
}
h4 {
	color: #FFF;
	font-weight: bold; font-size: 125%; line-height: 1;
	margin-bottom: 10px;
	text-shadow:#333 0 1px 2px;
}
h5 {
	color: #FFF;
	font-size: 200%; font-weight: normal; text-align: center;
	display: block;
	text-shadow: #000 2px 2px 4px;
}
.mainText {
	color: #474747;
	font-size: 75%;
	margin-bottom: 10px; margin-right: 25px;
	list-style-image: url(../images/bulletRed.png);
}
	.mainText a:link, .mainText a:visited {
		color: #016F9E;
		text-decoration:none
	}
	.mainText a:hover {
		text-decoration:underline;
	}
	.mainText li {
		margin-bottom: 10px;
	}
.productSubhead {
	color: #FFF;
	font-size: 80%;text-align: center; line-height: 1.25;
	display: block;
	width: 700px;
	margin-right: auto; margin-left: auto;
}
a:hover {
	cursor:pointer; cursor:hand;
}

/*--------------------------------------*/


/*-----------LAYOUT ELEMENTS------------*/
#container {
	width: 925px;
	margin-right: auto; margin-left: auto;
	top: 0px;
}
/*----------GLOBAL HEADER-----------*/
#header {
	height: 100px; width: 925px;
	position: relative;
}
#topLogo {
	background: url(../images/homeLogo.jpg) no-repeat;
	height: 67px; width: 184px;
	position: absolute;
	left: 0px; top: 20px;
	cursor:pointer; cursor:hand;
}
#topLinks {
	height: 19px;
	top: 15px; right: 0px;
	position: absolute;
}
#topLinks img {
	margin-left: 7px;
}
#topLinks p {
	color: #999;
	display: inline;
	font-size: 65%;
	position: relative;
	top: -5px;
}
#topLinks p a {
	color: #999;
}
#topLinks p a:hover {
	color: #FFF;
}
#languageEN, #languageES, #languageFR, #languageCH {
	color: #999;
	font-size: 8px;
	position: absolute;
	height: 12px;
	top: 4px;
	visibility: hidden;
}
#languageEN {
	left: 873px;
}
#languageES {
	left: 847px;
}
#languageFR {
	left: 872px;
}
#languageCH {
	left: 898px;
}
/*---------NAV TABS---------*/

#topNav {
	position: absolute;
	height: 35px;
	top: 45px; right: -42px;
	z-index: 700;
}
#topNav ul {
	list-style-type: none;
	display: inline;
}
	#topNav ul li {
		float: left;
	}
	#topNav a.tab {
		background: transparent url(../images/navTabR.jpg) no-repeat scroll top right;
		color: #FFF;
		display: block;
		font-size: 90%;
		height: 35px;
		padding-right: 8px; 								/* sliding doors padding */
		text-decoration: none;
		text-shadow: #000 0 1px 2px;
		float: left;
	}
		#topNav a.tab span {
			background: transparent url(../images/navTabBG.jpg) no-repeat top left;
			display: block;
			line-height: 25px;
			padding: 5px 4px 5px 12px;
		}
		#topNav a.tab:hover {
			background-position: bottom right;
			outline: none; 									/* hide dotted outline in Firefox */
		}
			#topNav a.tab:hover span {
				background-position: bottom left;
			}
/*---------SUBNAV---------*/

#topNav ul li ul.subNav {
	position: absolute;
	list-style-type: none;
	display: block;
	height: 35px;
	margin-top: 35px;
	padding: 0;
	z-index: 200;
}
	#topNav ul li ul.subNav li {
		background: none;
		float: left;
		margin: 0; padding-right: 1px;
		display: block;
	}
	#topNav ul li ul.subNav a.tab {
		background: transparent url(../images/navTabR1.png) no-repeat scroll right top;
		color: #FFF;
		display: block;
		font-size: 90%;
		height: 35px;
		padding-right: 7px; 								/* sliding doors padding */
		text-decoration: none; text-shadow:#000 0 1px 2px;
	}
		#topNav ul li ul.subNav a.tab span {
			background: transparent url(../images/navTabBG1.png) no-repeat left top;
			display: block;
			line-height: 25px;
			margin: 0; padding: 5px 8px 5px 15px;
			height: 25px;
		}
		#topNav ul li ul.subNav a.tab:hover {
			background-position: right -35px;
			outline: none; 									/* hide dotted outline in Firefox */
		}
			#topNav ul li ul.subNav a.tab:hover span {
				background-position: left -35px;
			}
/*-----------------------*/
/*------------------------------*/
/*----------------------------------*/


/*----------GLOBAL FOOTER-----------*/
#bottom {
	height: 75px; width: 925px;
	position: relative;
	float: left;
	border-top: solid #666 1px;
	margin-top: 5px;
	text-align: right;
}
	#bottom img {
		margin-top: 15px;
		float: left;
	}
	#bottom p {
		font-size: 70%;
		color: #666;
		margin-top: 15px;
	}
		#bottom p a:link, #bottom p a:visited, #bottom p a:active {
			color: #016F9E;
			text-decoration:none
		}
		#bottom p a:hover {
			text-decoration:underline;
		}
/*----------------------------------*/

/*---------HOMEPAGE LAYOUT----------*/
#homeMainContent {
	position: relative;
	width: 925px;
	float: left;
}
#homeFlash {
	height: 301px; width: 614px;
	position: relative;
	float: left;
}
#homeBanner {
	height: 301px; width: 287px;
	position: relative;
	right: 0px;
	float: right;
}
	#homeBanner img:first-child {
		margin: 0 0 7px 0; padding: 0;
	}
#homeCol1, #homeCol2 {
	float: left;
	width: 294px;
	margin-top: 25px;
	position: relative;
}
#homeCol2 {
	margin-left: 25px;
}
#homeCol3 {
	float: right;
	width: 300px;
	margin-top: 25px;
	position: relative;
}
	#homeCol3 h1 {
		margin-left: 15px;
	}
		#homeCol3 div {
			clear: both;
		}
			#homeCol3 div span {
				display: block;
				width: 150px; height: 58px;
				text-align: center;
				float: left;
			}
/*----- Footer Notification -----*/
#footerNotification {
	display: none;
	position: fixed;
	background: #111725;
	bottom: 0;
	height: 50px; width: 100%;
	text-align: left;
	z-index: 10000;
}
#footerNotificationContainer {
	position: relative;
	width: 910px;
	margin: 0 auto; padding-top: 10px;
}
	#footerNotification p {
		font-size: .75em;
		float: left;
		color: #FFFFFF; /*background: url(../images/sFlag.gif) no-repeat left top;*/
		padding: 10px 0 10px 55px; margin-right: 15px;
	}
.visit a {
	display: block;
	float: left;
	width: 240px;
	height: 30px;
	background: url(../images/visit.jpg) no-repeat left top;
}
	.visit a:hover {
		background: url(../images/visit.jpg) no-repeat 0 -30px;
	}
	.visit a span {
		position: absolute;
		text-indent: -99999px;
	}
.visitClose {
	position: absolute;
	right: 0px;
}
	.visitClose a {
		display: block;
		width: 58px; height: 16px;
		background: url(../images/visitClose.gif) no-repeat left top;
		cursor:pointer; cursor:hand;
	}
		.visitClose a:hover {
			background: url(../images/visitClose.gif) no-repeat 0 -16px;
		}
		.visitClose a span {
			position: absolute;
			text-indent: -99999px;
		}
/*--- End Footer Notification ---*/
/*----------------------------------*/


/*-------CONTENT PAGE LAYOUT--------*/
#contentMainContent, #contentProduct, #contentProductRevo {
	position: relative;
	width: 925px;
	float: left;
}
#contentMainContent {
	background: #FFF url(../images/contentTop.jpg) no-repeat center top;
}
#contentProduct {
	background: #FFF url(../images/contentProduct.jpg) no-repeat center top;
}
#contentProductRevo {
	background: #FFF url(../images/contentProductRev.jpg) no-repeat center top;
}
#revTop {
	background: url(../images/revLogo.png) no-repeat left 30px;
	color: #FFF;
	float: left;
	width: 420px;
	padding-top: 155px;
	position: absolute;
	left: 444px;

}
	#revTop p {
		font-size: 14px;
		line-height: 24px;
	}
	#revTop h1 {
		font-size: 30px;
		padding-top: 40px;
		color: #FFF;
	}
/*-------contentCol01 (main content area)--------*/
#contentCol1 {
	float: left;
	width: 613px;
	position: relative;
	margin: 25px 12px;
}
/* IE6 only */
* html #contentCol1 {
	margin-left: 10px;
}
/* END */


#contentCol1 div {
	width: 281px;
	padding: 0 12px 0 12px; margin: 0;
	float: left;
}
#contentCol1 div.consulting, #contentCol1 div.fullWidth {
	width: 562px;
	padding: 0 12px 0 12px; margin: 0 0 1em 0;
}
#contentCol1 div.fullWidth span {
	padding: 0 0 0 20px;
}
	#contentCol1 div p {
		font-size: 75%;
		color: #333;
		margin-bottom: 10px;
	}
		#contentCol1 div p a:link, #contentCol1 div p a:visited, #contentCol1 div ul li a:link, #contentCol1 div ul li a:visited {
			color: #016F9E;
			text-decoration:none
		}
		#contentCol1 div p a:hover, #contentCol1 div ul li a:hover {
			text-decoration:underline;
		}
	#contentCol1 div ul, div.lowerContent2 ul {
		margin-bottom: 25px;
		list-style-image: url(../images/bulletRed.png);
	}
	#contentCol1 div ul li, div.lowerContent2 ul li {
		font-size: 75%;
		color: #333;
		margin-bottom: 5px;
}
	#contentCol1 div img {
		margin-bottom: 15px;
	}
	#contentCol1 div#ice {
		float: none;
		display: block;
		width: auto;
	}
	#contentCol1 .pullquote {
		color: #333;
		font-size: 95%; font-weight: bold; line-height: 2em;
		margin: 15px 0 0 0; padding: 12px;
		display:inline;
	}
	#contentCol1 br {
		clear: left;
	}
/*-------contentCol02 (side panels)--------*/
#contentCol2 {
	float: right;
	width: 262px;
	margin: 70px 25px 0 0;
	position: relative;
}
/* IE6 only */
* html #contentCol2 {
	margin-right: 10px;
}
/* END */

#contentCol2 span #button {
	margin-top: 5px;
}
/*-------contentCol03 (alternate main content area - products page)--------*/
#contentCol3 {
	float: left;
	width: 900px;
	margin: 25px 0 25px 25px;
	position: relative;
}
/* IE6 only */
* html #contentCol3 {
	margin-left: 10px;
}
/* END */

#contentCol3 .mainText {
	padding-right: 25px;
}
#contentCol3 div.lowerContent {
	width: 410px;
	margin: 400px 35px 0 0;
	float: left;
}
#contentCol3 div.lowerContent2 {
	width: 410px;
	margin: 475px 35px 0 0;
	float: left;
}
	#contentCol3 div.lowerContent p, #contentCol3 div.lowerContent2 p {
		font-size: 75%;
		color: #333;
		margin-bottom: 10px;
	}
		#contentCol3 div.lowerContent p a:link, #contentCol3 div p a:visited {
			color: #016F9E;
			text-decoration:none;
		}
		#contentCol3 div.lowerContent p a:hover {
			text-decoration:underline;
		}
	#contentCol3 div.lowerContent ul {
		margin-bottom: 15px;
		list-style-image: url(../images/bulletRed.png);
	}
		#contentCol3 div.lowerContent ul li {
			font-size: 75%;
			color: #333;
			margin-bottom: 10px;
		}
	#contentCol3 div.lowerContent img {
		margin-bottom: 15px;
	}
.iconColumn01 {
	float: left;
	width: 610px;
	position: relative;
	margin: 40px 0 0 0;
}
	.iconColumn01 p {
		font-size: 1.3em; line-height: 1.5em; text-align: justify;
	}
	.iconColumn01 h2 {
		font-size: 2em; font-weight: bold;
	}
.iconColumn01, .iconColumn02 {
	width: 410px;
	float: left;
}

	.iconColumn01 ul {
		list-style-type: none;
		margin: 0; padding: 0;
	}
		.iconColumn01 ul li {
			font-size: 75%;
			padding-bottom: 15px;
			height: 55px;
			display: block;
		}
			.iconColumn01 ul li img {
				float: left;
				margin-top: -10px;
			}
			.iconColumn01 ul li h3 {
				font-size: 120%;
				margin-bottom: 0px;
			}
.iconColumn02 {
	margin: 20px 0 0 0
}
#panel {
	margin: 0; padding: 0;
	z-index: 1;
	float:left;
	position: absolute;
}
#device01, #device02, #device03 {
	background: url(../images/deviceiPhone.png) no-repeat;
	float: left;
	height: 400px; width: 339px;
	text-indent: -9999px;
	display:block;
}
#device01 {
	background-image: url(../images/deviceWeb.jpg);
}
#device02 {
	background-image: url(../images/deviceMobile.jpg);
}
#device03 {
	background-image: url(../images/deviceApps.jpg);
}
/*----------------------------------*/


/*-----------SIDE PANELS------------*/
#panelFree, #panelDemo, #panelDemo2, #panelUptime {
	display: block;
	height: 177px; width: 262px;
	text-decoration: none;
	margin-bottom: 15px;
	cursor:pointer; cursor:hand;
}
#panelFree {
	background: transparent url(../images/panelFreedom.jpg) no-repeat scroll top left;
}
	#panelFree:hover {
		background-position: top right;
		outline: none; 								/* hide dotted outline in Firefox */
	}
#panelDemo {
	background: transparent url(../images/panelDemo.jpg) no-repeat scroll top left;
}
	#panelDemo:hover {
		background-position: top right;
		outline: none; 								/* hide dotted outline in Firefox */
	}
#panelDemo2 {
	background: transparent url(../images/panelDemo2.jpg) no-repeat scroll top left;
}
	#panelDemo2:hover {
		background-position: top right;
		outline: none; 								/* hide dotted outline in Firefox */
	}
#panelUptime {
	background: transparent url(../images/panelUptime.jpg) no-repeat scroll top left;
}
	#panelUptime:hover {
		background-position: top right;
		outline: none; 								/* hide dotted outline in Firefox */
	}
#panelCareers {
	background: transparent url(../images/buttonCareers.jpg) no-repeat scroll top left;
	display: block;
	height: 48px; width: 262px;
	text-decoration: none;
	margin-bottom: 15px;
	cursor:pointer; cursor:hand;
}
	#panelCareers:hover {
		background-position: bottom left;
		outline: none; 								/* hide dotted outline in Firefox */
	}
.panelGray {
	background: transparent url(../images/panelGrayBottom.jpg) no-repeat scroll bottom left;
	color: #999;
	display: block;
	font-size: 65%;
	line-height: 1.2;
	color: #333;
	width: 262px;
	padding-bottom: 15px;							/* sliding doors padding */
	text-decoration: none;
	margin-bottom: 15px;
}
	.panelGray div {
		background: transparent url(../images/panelGrayTop.jpg) no-repeat top left;
		display: block;
		padding: 5px 15px 0px 15px;
	}
		.panelGray div a:link, .panelGray div a:visited {
			color: #016F9E;
			text-decoration:none;
		}
		.panelGray div a:hover {
			text-decoration:underline;
		}
/*----------------------------------*/

/*-------contentCol04 (form pages)--------*/
#contentCol4 {
	float: left;
	width: 600px;
	margin-top: 25px 0; padding: 25px 0 25px 0;
	position: relative;
}
	#contentCol4 p {
		margin-bottom: 1em;
	}
	#contentCol4 p.recommendation {
		margin-bottom: 2em;
	}
/* IE6 only */
* html #contentCol4 {
	margin-left: 10px;
}
/* END */

/*-----------------------------------------*/



.2column {
	margin-bottom: 25px;
}
#bannerDemo {
	background: transparent url(../images/buttonDemo.jpg) no-repeat scroll top left;
	display: block;
	height: 48px;
	width: 376px;
	margin-top: 0px;
	position: relative;
	float: left;
	cursor:pointer; cursor:hand;
}
	#bannerDemo:hover {
		background-position: bottom left;
	}
#bannerRevo {
	background: transparent url(../images/buttonRevo.jpg) no-repeat scroll top left;
	display: block;
	height: 48px;
	width: 376px;
	margin-top: 0px;
	position: relative;
	float: left;
	cursor:pointer; cursor:hand;
}
	#bannerRevo:hover {
		background-position: bottom left;
	}
 /*#spanStateText, {
float: right;
}*/
/*-------PORTFOLIO PAGE LAYOUT--------*/

#portfolio {
	margin: auto;
	text-align: center;
}
	#portfolio h1 {
		text-align: left;
		font-size: 170%;
		margin: 25px 0 10px 24px;
	}
#portfolioContent {
	clear: both;
	margin: auto 0;
	text-align: left;
	margin-left: 25px;
}
	#portfolioContent h2 {
		margin-top: 1em;
		margin-bottom: 1em;
		font-size: 110%;
		color: #990000;
		margin-bottom: 10px;
	}
	#portfolioContent p {
		font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
		line-height: 1.45;
		font-size: 12px;
		margin-bottom: 1em;
	}
	#portfolioContent div {
		margin-left: 40px;
		display: block;
		width: 375px;
		float: left;
	}
#portfolioContentFoot {
	clear: both;
	display: block;
	width: 1px;
	height: 1px;
}
div.scrollable {
/* required settings */
	float: left;  
	margin: auto;
	margin-bottom: 25px;
	text-align: center;
	position: relative;
	overflow: hidden;
	width: 815px;
	height: 330px;
}
/*-----GRADIENT MAKING SCROLL APPEAR TO BE SLIDING THROUGH THE PAGE-----*/
#scrollFadeL {
	top: 0;
	left: 0;
	margin-top: 15px;
	background:url(../images/scrollFadeL.png) no-repeat;
	display: block;
	width: 20px;
	height: 315px;
	position: absolute;
	z-index: 20;
}
#scrollFadeR {
	top: 0;
	right: 0;
	margin-top: 15px;
	background:url(../images/scrollFadeR.png) no-repeat;
	display: block;
	width: 20px;
	height: 315px;
	position: absolute;
	z-index: 20;
}
/*------------------------------*/
/*  root element for scrollable items. Must be absolutely positioned 
    and it should have a super large width to accomodate scrollable items. 
    it's enough that you set width and height for the root element and 
    not for this element.  */ 
div.scrollable div.items {
	width: 9999px;						/* this cannot be too large */  
	height: auto;
	position: relative;
	padding-top: 15px;
	margin-left: 2px;
}
	/*  a single item. must be floated on horizontal scrolling 
    typically this element is the one that will be styled 
    the most. */ 
	div.scrollable div.items div {
		display: block;
		width: 375px;
		height: 256px;
		float:left;
		margin: 30px 15px;
	}
		div.scrollable div.items div a {
			display: block;
			width: 375px;
			height: 256px;
			margin: 0;
			padding: 0;
		}
			div.scrollable div.items div a span {
				position: absolute;
				top: 0;
				left: 0;
				margin-top: -100px;
			}
/*-------PORTFOLIO ITEMS--------*/
#bd 	{ background: url(../images/byDesign.jpg) no-repeat; }
#cw 	{ background: url(../images/cyberWize.jpg) no-repeat; }
#eh 	{ background: url(../images/eternalHealth.jpg) no-repeat; }
#gi 	{ background: url(../images/greenIrene.jpg) no-repeat; }
#hc 	{ background: url(../images/healthEChoice.jpg) no-repeat; }
#tm 	{ background: url(../images/tunguskaMist.jpg) no-repeat; }
#ws 	{ background: url(../images/WickScents.jpg) no-repeat; }
#nice 	{ background: url(../images/NICE.jpg) no-repeat; }
#aa 	{ background: url(../images/avaAnderson.jpg) no-repeat; }
#asea 	{ background: url(../images/asea.jpg) no-repeat; }
#ve 	{ background: url(../images/vivaElite.jpg) no-repeat; }
#vs 	{ background: url(../images/VerdantSpring.jpg) no-repeat; }
#mz 	{ background: url(../images/mannazo.jpg) no-repeat; }
#eg 	{ background: url(../images/endlessGlow.jpg) no-repeat; }

/*-------PERSONALIZE TOOLTIP (courtesy of http://www.kriesi.at/archives/create-simple-tooltips-with-css-and-jquery)--------*/
.tooltip {
	position:absolute;
	z-index:999;
	left:-9999px;
}
.tooltip p {
	color:#000;
	background-color:#fff;
	font-size: 11px;
	margin:0; padding: 5px;
	-moz-border-radius: 3px; -webkit-border-radius: 3px;
	box-shadow: 0px 0px 5px #000; -moz-box-shadow: 0px 0px 5px #000; -webkit-box-shadow: 0px 0px 5px #000;
}
/*-----------------------------------------*/
	/*-----------------------------------------*/
/* prev, next, prevPage and nextPage buttons */
a.prev, a.next, a.prevPage, a.nextPage {
	background: url(../images/PortLeft.png) no-repeat;
	display: block;
	height: 18px; width: 18px;
	float: left;
	margin-top: 150px;
	cursor:pointer; cursor:hand;
}
	/* mouseover state */
	a.prev:hover, a.next:hover, a.prevPage:hover, a.nextPage:hover {
		background-position: 0px -18px;
	}
/* disabled navigational button */
a.disabled {
	visibility: hidden !important;
}
/* next button uses another background image */
a.next, a.nextPage {
	background-image: url(../images/PortRight.png);
	clear: right;
}
a.prev {
	float: left;
	margin-left: 15px;
	margin-right: 20px;
}
a.next {
	float: right;
	margin-right: 15px;
}
/*-----------------------------------------*/

/* the overlayed element */ 
div.overlay {
	background-image:url(../img/overlay/white.png); 	/* growing background image */
	width:600px; height:470px; 							/* dimensions after the growing animation finishes  */
	display:none; 										/* initially overlay is hidden */
    padding:55px;										/* some padding to layout nested elements nicely  */
}
/* default close button positioned on upper right corner */ 
div.overlay div.close {
	background-image:url(../img/overlay/close.png);
	position:absolute;
	right:5px; top:5px;
	cursor:pointer; cursor:hand;
	height:35px; width:35px;
}
/* black */ 
div.overlay.black {
	background:url(../img/overlay/transparent.png) no-repeat !important;
	color:#fff;
}
/* petrol */ 
div.overlay.petrol {
	background:url(../img/overlay/petrol.png) no-repeat !important;
	color:#fff;
}
div.black h2, div.petrol h2 {
	color:#ddd;
}
