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

body {
	background: url('../images/layout/background.jpg') repeat-x fixed;
	font: 100% Arial, sans-serif;
	font-size:11px;
	color: #000000;
	text-align: center;
	font-size-adjust: none;
	font-style: normal;
	font-variant: normal;
}

img {
	border: none;
}

a:link {
	color: #0099FF;
	text-decoration:none;
}

a:hover {
	color: #0099FF;
	text-decoration:underline;
}

a:active {
	color: #0099FF;
	text-decoration:underline;
}

a:visited {
	color: #0099FF;
	text-decoration:none;
}

#footer a {
	color: #3a84ca;
}

#footer a:hover {
	color: #6699FF;
}

h1, h2, h3, h4, h5, h6 {
	margin: 0;
	padding: 0;
}

/* big, bold, blue -> the huge titles */
h1 {
	font-size: 18px;
	color: #50BEE6;
	font-weight: bold;
}

/* medium, bold, black -> subtitles */
h2 {
	font-size: 14px;
	color: black;
	font-weight: bold;
}

/* normal size, bold, blue -> small caption-titles */
h3 {
	font-size: 11px;
	color: #0099FF;
	font-weight: bold;
}

/* normal size, bold, white -> small caption-titles on backgrounds that require white */
h4 {
	font-size: 11px;
	color: #0099FF;
	font-weight: bold;
}

h5 {
	font-size: 11px;
	color: #0099FF;
	font-weight: bold;
	margin-top: 5px;
	margin-bottom: 3px;
	padding: 0;
}

h6 {
	font-size: 11px;
	color: black;
	font-weight: bold;
}

p {
	font-size: 11px;
	margin: 0;
	margin-top: 6px;
	margin-bottom: 3px;
	padding: 0;
}

.sidebar-left a:link {
	color: #666666;
	text-decoration:none;
}

.sidebar-left a:visited {
	color: #666666;
	text-decoration:none;
}

.sidebar-left a:active {
	color: #0099FF;
	text-decoration:underline;
}

.sidebar-left a:hover {
	color: #0099FF;
	text-decoration:underline;
}

div.sidebar3 a:link {
	color: #000000;
	text-decoration:none;
}

div.sidebar3 a:visited {
	color: #000000;
	text-decoration:none;
}

div.sidebar3 a:active {
	color: #000000;
	text-decoration:underline;
}

div.sidebar3 a:hover {
	color: #000000;
	text-decoration:underline;
}

div.sidebar3 {
	height: 225px; 
	background-image:url(/images/gradient_sidebar.jpg);
	padding: 10px 10px 10px 10px;
}

div.sidebar3 h1 h2 h3 h4 h5 {
	color:#FFFFFF;
}

div.clear {
	clear:both;
	width: 100%;
	height: 1px;
	margin: 0 0 -1px;
}

.sidebar-left {
	display: compact;
	float: left;
	width: 100px;
	height: 100%;
	background-color: white;
	padding-top: 10px;
	position: relative;
	top: 0px;
	left: 0px;
}

.sidebar-right {
	display: inline;
	float: right;
	width: 100px;
	height: 100%;
	background-color: white;
	padding-top: 10px;
}

.sidebar-right img {
	border: 1px solid #CCCCCC;
}

.main-content {
	display: block;
	padding-left: 10px;
	padding-top: 10px;
	padding-right: 16px;
	float: left;
	width: 530px;
	height: 100%;
	background-color: white;
}

.main-content-presentation {
	display: block;
	padding-left: 55px;
	padding-top: 10px;
	padding-right: 55px;
	border-bottom: 10px solid white;
	float: left;
	width: 650px;
	height: 100%;
	background-color: white;
}

.main-content img {
	vertical-align: top;
	border: 1px solid #CCCCCC;
}

.item {
	display: block;
	margin-bottom: 15px;
}

.item-image {
	display: inline;
	float: left;
	width: 110px;
}

.item-text {
	display: inline;
	text-align: justify;
	margin-left: 20px;
	width: 93%;
}

.left-pane {
	display: inline;
	width: 40%;
	padding-left: 10px;
	padding-right: 10px;
	float: left;
}

.right-pane {
	display: inline;
	width: 40%;
	padding-left: 10px;
	padding-right: 10px;
	float: right;
}

/*********************** BOX ***********************/
.main-box {
	width: 800px;
	margin: 0 auto;
	text-align: left;
}

/*********************** TOP ***********************/
.main-box .box-top {
	display: block;
	width: 100%;
	height: 22px;
}

.main-box .box-corner-tl {
	display: inline;
	margin: 0px;
	float: left;
	width: 800px;
	height: 22px;
	background: url('../images/layout/box-corner-tl.png') top left no-repeat;
}

.main-box .box-corner-tr {
	display: inline;
	float: right;
	width: 800px;
	height: 22px;
	background: url('../images/layout/box-corner-tr.png') top right no-repeat;
}

.main-box .box-border-top {
	display: inline;
	float: left;
	height: 22px;
	width: 756px;
	margin-left: 22px;
	background: url('../images/layout/box-top.png') top repeat-x;
}

/********************** CENTER *********************/
.main-box .box-center {
	width: 100%;
	height: 100%;
}

.main-box .box-border-left {
	display: inline;
	margin: 0px;
	float: left;
	width: 800px;
	background: url('../images/layout/box-left.png') left repeat-y;
}

.main-box .box-border-right {
	display: inline;
	margin: 0px;
	float: left;
	width: 800px;
	background: url('../images/layout/box-right.png') right repeat-y;
}

.main-box .box-content, .box-content {
	margin-left: 22px;
	width: 756px;
	height: 100%;
	background: white;
}

/********************** BOTTOM *********************/
.main-box .box-bottom {
	display: block;
	width: 100%;
	height: 22px;
}

.main-box .box-corner-bl {
	display: inline;
	margin: 0px;
	float: left;
	width: 800px;
	height: 22px;
	background: url('../images/layout/box-corner-bl.png') bottom left no-repeat;
}

.main-box .box-corner-br {
	display: inline;
	float: right;
	width: 800px;
	height: 22px;
	background: url('../images/layout/box-corner-br.png') bottom right no-repeat;
}

.main-box .box-border-bottom {
	display: inline;
	float: left;
	height: 22px;
	width: 756px;
	margin-left: 22px;
	background: url('../images/layout/box-bottom.png') bottom repeat-x;
}

#header {
}

#footer {
	text-align: center;
	color: #999;
}

#footer .box-content {
	margin-left: 11px;
	width: 778px;
}

#content {
}

#wrapper {
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 50%;
	margin-left: -400px;
	height: 100%;
	width: 800px;
}

/************ MAIN MENU ************/
ul.horiz-menu {
	display: inline;
	margin: 0;
	padding: 0;
	list-style-type: none;
	cursor: default;
}

ul.horiz-menu ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	font-size: 100%;
	z-index: 1020;
	cursor: default;
	width: 100px;
	text-align: center;
}

ul.horiz-menu li {
	margin: 0;
	padding: 0;
	list-style-type: none;
	position: relative;
	text-align: center;
	cursor: pointer;
	float: left;
}

ul.horiz-menu li a {
	display: block;
	width: 100%;
	text-decoration: none;
	border: none;
	font-weight: bold;
	padding: 0;
	margin: 0;
	text-align: center;
	background-color: #dcd;
}

ul.horiz-menu li ul {
	position: absolute;
	border: 1px solid #555;
	width: 200px;
	overflow: hidden;
}

ul.horiz-menu li ul li {
	float: none;
	width: 200px;
}

ul.horiz-menu li ul li a {
	padding: 6px;
	background-color: #f6fbff;
	color: black;
	font-weight: normal;
}

ul.horiz-menu li ul li a:hover {
	color: white;
	font-weight: bold;
}

.horiz-menu .separator {
	color: white;
	font-weight: bold;
	background-color: #555;
}

/* somehow the menu inherits a padding-left from somewhere, so the next 3 things are to fix it */
#ULpassion, #ULproducts_services, #ULabout, #ULnews, #ULadvisors, #ULjoin {
	margin: 0;
}
#ULpassion li, #ULproducts_services li, #ULabout li, #ULnews li, #ULadvisors li, #ULjoin li {
	padding: 0;
}
#ULpassion li a, #ULproducts_services li a, #ULabout li a, #ULnews li a, #ULadvisors li a, #ULjoin li a {
	padding-left: 0px;
}

#ULpassion a:hover {
	background-color: #65c2af;
}

#ULproducts_services a:hover {
	background-color: #75b06a;
}

#ULabout a:hover {
	background-color: #ccc162;
}

#ULnews a:hover {
	background-color: #d19f62;
}

#ULadvisors a:hover {
	background-color: #c95759;
}

#ULjoin a:hover {
	background-color: #9f56ba;
}

#home, #passion, #products_services, #about, #news, #advisors, #join {
	background-image: url('../images/layout/menubar.gif');
}

#home:hover, #passion:hover, #products_services:hover, #about:hover, #news:hover, #advisors:hover, #join:hover {
	background-image: url('../images/layout/menubar-over.gif');
}

#home {
	width: 59px;
	height: 28px;
	background-position: 0px 0px;
}

#passion {
	width: 72px;
	height: 28px;
	background-position: -60px 0px;
}

#products_services {
	width: 152px;
	height: 28px;
	background-position: -133px 0px;
}

#about {
	width: 100px;
	height: 28px;
	background-position: -286px 0px;
}

#news {
	width: 57px;
	height: 28px;
	background-position: -387px 0px;
}

#advisors {
	width: 75px;
	height: 28px;
	background-position: -445px 0px;
}

#join {
	width: 62px;
	height: 28px;
	background-position: -521px 0px;
}

#comm #global, #comm #webmail, #comm #help {
	background-image: url('../images/layout/comm.gif');
	width: 35px;
	height: 28px;
}

#comm #global:hover, #comm #webmail:hover, #comm #help:hover {
	background-image: url('../images/layout/comm-over.gif');
}

#comm #global {
	background-position: 0px 0px;
}

#comm #webmail {
	background-position: -35px 0px;
}

#comm #help {
	background-position: -70px 0px;
}

#comm ul {
	width: 100px !important;
	left: -33px;
}

/********* COMM TOOLTIPS **********/
.tool-tip {
	color: #fff;
	width: 139px;
	z-index: 13000;
}
 
.tool-title {
	font-weight: bold;
	font-size: 11px;
	margin: 0;
	color: #9FD4FF;
	padding: 8px 8px 4px;
	background: url('../images/layout/bubble.png') top left;
}
 
.tool-text {
	font-size: 11px;
	padding: 4px 8px 8px;
	background: url('../images/layout/bubble.png') bottom right;
}

div.eventsBar {
	height: 100 px;
	color:#FFFFFF;
	background-color:#50BEE6;
	padding: 10px 10px 10px 10px;
}

#promo {
	width: 300px;
	height: 100px;
	position: relative;
	display: inline;
	float: right;
	overflow: hidden;
}

#promo-elem {
	width: 258px;
	height: 100px;
	float: left;
	display: inline;
	overflow: hidden;
	clip: rect(0, 378, 100, 0);
}

#promo-elem #pe-wrapper {
	width: 100%;
	height: 100px;
	position: relative;
	left: 0px;
	top: 0px;
}

#promo-menu {
	width: 22px;
	height: 100px;
	float: right;
	display: inline;
	overflow: hidden;
	border-right: 20px solid white;
}

#promo-menu div {
	width: 22px;
	height: 20px;
}

#promo-menu div a {
	width: 100%;
	height: 100%;
	display: block;
	background-image: url('/images/layout/promo-nav.gif');
}

#promo-menu #a1 {
	background-position: 0px 0px;
}
#promo-menu #a1:hover {
	background-position: 22px 0px;
}

#promo-menu #a2 {
	background-position: 0px -20px;
}
#promo-menu #a2:hover {
	background-position: 22px -20px;
}

#promo-menu #a3 {
	background-position: 0px -40px;
}
#promo-menu #a3:hover {
	background-position: 22px -40px;
}

#promo-menu #a4 {
	background-position: 0px -60px;
}
#promo-menu #a4:hover {
	background-position: 22px -60px;
}

#promo-menu #a5 {
	background-position: 0px -80px;
}
#promo-menu #a5:hover {
	background-position: 22px -80px;
}

#img-links {
	display: inline;
	float: left;
	position: relative;
	width: 350px;
	height: 100px;
	background-color: white;
}

#img-links div {
	display: inline-block;
	width: 100px;
	height: 100px;
}

#img-links a {
	display: block;
	width: 100%;
	height: 100%;
	background-position: 0px 0px;
	position: relative;
	left: 10px;
}

#img-links #l1 {
	background-image: url('/images/layout/btn-bulb.gif');
}

#img-links #l1:hover {
	background-position: 100px 0px;
}

div.eventsBar a:link {
	color: #FFFFFF;
	text-decoration:none;
}

div.eventsBar a:visited {
	color: #FFFFFF;
	text-decoration:none;
}

div.eventsBar a:active {
	color: #FFFFFF;
	text-decoration:underline;
}

div.eventsBar a:hover {
	color: #FFFFFF;
	text-decoration:underline;
}