@charset "UTF-8";
html {overflow:hidden; height:100%;}
body#red {
	background-color:rgb(238,0,0);
	padding:0 0 0 10px;
	height:100%;
	overflow:auto;
	font-family:verdana, arial, sans-serif;
	font-size:12px;
	margin: 0 0 0 250px;
	border: none;
	letter-spacing: .1em;
}
body#portfolio {
	background-color:#515151;
	padding:0 0 0 10px;
	height:100%;
	overflow:auto;
	font-family:verdana, arial, sans-serif;
	font-size:12px;
	margin: 0 0 0 250px;
	border: none;
	letter-spacing: .1em;
}
body#connect {
	background-color:#ffcc33;
	padding:0 0 0 10px;
	height:100%;
	overflow:auto;
	font-family:verdana, arial, sans-serif;
	font-size:12px;
	margin: 0 0 0 250px;
	border: none;
	letter-spacing: 0.1em;
}

#redmenu {
	position:absolute;
	display:block;
	top:20px;
	left:110px;
	width:130px;
	height:130px;
	background:transparent;
	z-index:50;
	font-size: 12px;
	text-align: right;
	padding: 0;
	color:#FFFFFF;
}

#redmenu a, a:link {
	display:block;
	width:120px;
	height:22px;
	color:#FFFFFF;
	background:transparent;
	text-decoration:none;
	border:0px;
	text-align:right;
	line-height:18px;
	margin-top:0px;
}
#redmenu a:visited {
	display:block;
	color:#FFFFFF;
	background:transparent;
}
#redmenu a:hover {color:#f4d35c; }
#redmenu a:active {
	color:#f4d35c;
	background:transparent;
}
#redbodyContent { 
	position:absolute;
	left: 0; 
	top: 0;
	width: 600px;
	}
 
#redbodyContent p.left {
	font-family:TradeGothic, verdana, arial, san-serif;
	width:100%;
	text-align:left;
	color:#FFFFFF;
	font-weight:bold;
	font-size:18px;
	line-height: 20px;
}
#redbodyContent p.left:first-line {
	font-size:24px;
	line-height:24px;
	color:#f4d35c;}

	
body#portfolio a#creativenav, body#red a#capabilitiesnav, body#red a#clientsnav, body#red a#saganav {color:#f4d35c;}

body#connect a#connectnav {color:#000000;}

body#philosophies a#philosophiesnav, body#philosophies a#sustainabilitynav {color:#EE0000;}


#menuconnect {position:absolute; display:block; top:20px; left:110px; width:130px; height:130px; background:transparent; z-index:50;}

#menuconnect a, a:link {
	display:block;
	width:120px;
	height:22px;
	color:#FFFFFF;
	background:transparent;
	text-decoration:none;
	border:0px;
	text-align:right;
	line-height:18px;
	margin-top:0px;
}
#menuconnect a:visited {
	display:block;

	color:#FFFFFF;
	background:transparent;
}
#menuconnect a:hover {
	color:#000000;
}
#menuconnect a:active {
	color:#EE0000;
	background:transparent;
}
p {width:550px; text-align:justify;}
div.bglogo {
	position: absolute;
	right: 50px;
	top: 550px;
	clear: both;
	border: 0px;
	margin: 10px 50px 0 10px;
	z-index: 99;
	width: 188px;
	height: 65px;
}
 #flash {
 width:800px;
 height:350px;
 position:absolute;
top:180px;
left:50%;
	margin:0px -400px;
text-align:center;
}
body#philosophies {
	background-color:#FFFFFF;
	padding:0 0px 0 10px;
	height:100%;
	overflow:auto;
	font-family:verdana, arial, sans-serif;
	font-size:12px;
	margin: 0 0 0 250px;
	border: none;
	letter-spacing: 0.1em;
}
#philosophiesmenu {
	position:absolute;
	display:block;
	top:20px;
	left:110px;
	width:130px;
	height:130px;
	color:#000000;
	background:transparent;
	z-index:50;
	font-size: 12px;
	text-align: right;
	padding: 0;
}

 #philosophiesmenu a, a:link {
	display:block;
	width:120px;
	height:22px;
	color:#000000;
	background:transparent;
	text-decoration:none;
	border:0px;
	text-align:right;
	line-height:18px;
	margin-top:0px;
}
#philosophiesmenu a:visited {
	display:block;
	color:#000000;
	background:transparent;
}
#philosophiesmenu a:hover {color:#f4d35c; }
#philosophiesmenu a:active {
	color:#f4d35c;
	background:transparent;
}

#content {
	position: absolute;
	top: 180px;
	left: 250px;
	width: 650px;
	height: 500px;
	z-index:10;
	}

#bodyContainer
{
	height:280px;
	width:610px;
	position:absolute;
	clip: rect(0,610px,300px,0);
	padding: 10px;
	overflow:hidden;
	z-index:20;
 }
 
#bodyContent { 
	position:absolute;
	left: 0; 
	top: 0;
	width: 600px;
	}

#bodyContent p.left {
	font-family:TradeGothic, verdana, arial, san-serif;
	width:590px;
	text-align:left;
	color:#000000;
	font-weight:bold;
	font-size:18px;
	line-height: 20px;
	padding:0 15px 0 0;
}
#bodyContent p.left:first-line {
	font-size:24px;
	line-height:24px;
	color:rgb(238,0,0);}
	
 #bodyContent a {color:#EE0000;
 text-decoration:none;
 padding:0;
 margin:0;
 display:inline;
 }
 
 #scrollerButtons {
	position: absolute;
	top: 0px;
	left: 600px;
	width: 10px;
	height: 300px;
	z-index: 20;
	}
#scrollerButtons #track {
	position: absolute;
	top: 1px;
	left: 0;
	width: 10px;
	height: 300px;
	background-image: url(images/scrollbar_bg.gif);
	background-repeat: no-repeat;
	background-position: left top;
	}
#scrollerButtons #drag {
	position: absolute;
	top: 1px;
	left: 0;
	width: 10px;
	height: 22px;
	z-index: 30;
	cursor:pointer;
	background-image: url(images/scrollbar.gif);
	background-repeat: no-repeat;
	background-position: left top;
	}
#scrollerButtons #drag:hover {
	background-image: url(images/scrollbarO.gif);
	background-repeat: no-repeat;
	background-position: left top;
	}
 
#scrollerButtonsRed {
	position: absolute;
	top: 0px;
	left: 600px;
	width: 10px;
	height: 300px;
	z-index: 20;
	}
#scrollerButtonsRed #track {
	position: absolute;
	top: 1px;
	left: 0;
	width: 10px;
	height: 300px;
	background-image: url(images/scrollbar_redbg.gif);
	background-repeat: no-repeat;
	background-position: left top;
	}
#scrollerButtonsRed #drag {
	position: absolute;
	top: 1px;
	left: 0;
	width: 10px;
	height: 22px;
	z-index: 30;
	cursor:pointer;
	background-image: url(images/scrollbarRedBkgrd.gif);
	background-repeat: no-repeat;
	background-position: left top;
	}
#scrollerButtonsRed #drag:hover {
	background-image: url(images/scrollbarRedBkgrdO.gif);
	background-repeat: no-repeat;
	background-position: left top;
	}
	
#scrollerButtonsYellow {
	position: absolute;
	top: 0px;
	left: 600px;
	width: 10px;
	height: 300px;
	z-index: 20;
	}
#scrollerButtonsYellow #track {
	position: absolute;
	top: 1px;
	left: 0;
	width: 10px;
	height: 300px;
	background-image: url(images/scrollbar_yellowbg.gif);
	background-repeat: no-repeat;
	background-position: left top;
	}
#scrollerButtonsYellow #drag {
	position: absolute;
	top: 1px;
	left: 0;
	width: 10px;
	height: 22px;
	z-index: 30;
	cursor:pointer;
	background-image: url(images/scrollbarYellowBkgrd.gif);
	background-repeat: no-repeat;
	background-position: left top;
	}
#scrollerButtonsYellow #drag:hover {
	background-image: url(images/scrollbarYellowBkgrdO.gif);
	background-repeat: no-repeat;
	background-position: left top;
	}
 #clientcontainer {
 position:absolute;
 top:180px;
 left:250px;}
 
 #clientlist
 {
	position:absolute;
	top:180px;
	padding:0;
	margin:0;
	text-align:left;
	color:#FFFFFF;
	
	
	
}
 #clientlist ul#column
 {
	padding:0;
	margin:0;
	list-style-type: none;
	font-size: 11px;
	width:270px;
	line-height:18px;
	float:left;
	
}
 #clientlist ul a
 {
	color:#f4d35c;
	text-decoration:none;
	width:270px;
	text-align:left;
	border:0;
	padding:0;
	margin:0;
	height:18px;
	line-height:18px;
}

#campaign {
	background-color:#414141;
	position:absolute;
	top:180px;
	left:0;
	width:100%;
	height:240px;
	_width: 1280px;
	padding:0 0 5px 0;
	margin:0;
	border-collapse:collapse;
	clear:both;
	
}


#campaign tr{
	position:relative;
	left:0px;
	top:0;
	width:100%;
	list-style:none;
    white-space:nowrap;
	text-align:left;
	padding:0;
	float:left;
	
	}
#campaign td img {
	padding: 4px 2px 2px 0px;
	height: 225px;
	width: auto;
	border: 0;
	margin: 0;
	opacity: 0.6;
	filter: alpha(opacity=60);
}

#campaign td img:hover {
	opacity: 1.0;
	filter: alpha(opacity=100)
}

#block {
	position:absolute;
	top:420px;
	left:0px;
	width:100%;
	_width: 1280px;
	height:105px;
	background-color:#414141;
}

#textblock {
	position:absolute;
	left:250px;
	height:500px;
	width:650px;
	z-index:10;	
	}
	
#bodyContainerGray {
	background-color:#414141;
	height:75px;
	width:610px;
	position:absolute;
	clip: rect(0,610px,90px,0);
	padding:10px;
	overflow:hidden;
	z-index:20;
 }
 
 #bodyContentGray { 
	position:absolute;
	left: 0; 
	top: 0;
	width: 590px;
	z-index:30;
	}
	
	
#scrollerButtonsGray {
	position: absolute;
	top: 0;
	left: 600px;
	width: 10px;
	height: 90px;
	z-index: 30;
	}
#scrollerButtonsGray #track {
	position: absolute;
	top: 1px;
	left: 0;
	width: 10px;
	height: 90px;
	background-image: url(images/scrollbar_bg100pxhigh.gif);
	background-repeat: no-repeat;
	background-position: left top;
	}
#scrollerButtonsGray #drag {
	position: absolute;
	top: 1px;
	left: 0;
	width: 10px;
	height: 22px;
	z-index: 40;
	cursor:pointer;
	background-image: url(images/scrollbarGrayBkgrd.gif);
	background-repeat: no-repeat;
	background-position: left top;
	}
#scrollerButtonsGray #drag:hover {
	background-image: url(images/scrollbarGrayBkgrdO.gif);
	background-repeat: no-repeat;
	background-position: left top;
	}
	
#bodyContentGray p
{
	font-family:verdana, arial, sans-serif;
	font-weight:normal;
	font-size:11px;
	width:590px;
	line-height: 14px;
	text-align:left;
	color:#FFFFFF;
	padding:0 15px 0 0;
	}
	
#bodyContentGray p:first-line {
	color:#f4d35c;
	font-family:verdana, arial, sans-serif;
	font-weight:lighter;
	letter-spacing:.1em;
	font-size:14px;
	line-height:24px;
	text-align: left;}
	
div#arrows_alt_l
{
	position:absolute;
	width:40px;
	left:150px;
	text-align:right;
	vertical-align:top;
	margin:0;
	padding: 4px 0 0 0;
	text-align:right;
	
} 

div#arrows_alt_r
{
	position:absolute;
	width:40px;
	left:200px;
	text-align:right;
	vertical-align:top;
	margin:0;
	text-align:right;
	padding: 4px 0 0 0;
} 

div#arrows_alt_l a:link
{
	width:40px;
	}

div#arrows_alt_r a:link
{
	width:40px;
	}
ul.download {list-style-image:url(../menus/zip.gif);}
ul.download li {padding-left:5px; font-size:11px; line-height:1.5em;}


/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menu/lightbox3.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */



/* slides styling */

.photo {
	width:720px;
	height:600px;
	background:url(lbox/back.jpg) no-repeat center center;
	text-align:left;
	position:relative;
	margin: 0;
}

.photo dl {font-size:0.9em; position:absolute; width:400px; top:50px; left:30px;}
.photo dl dt {font-family:"times new roman", serif;font-size:1.8em; margin-bottom:2em;}
.photo dl dd {font-family:"TradeGothic", verdana, arial, sans-serif;  padding:0; margin:0; line-height:1.7em; margin-bottom:2em; font-size:11px;}
.photo dl dd:first-letter {font-weight:bold;}
.photo ul.topic {padding:0; margin:0; list-style:none; width:720px; height:auto; position:relative; z-index:10;}

.photo ul.topic li {display:block; min-width:50px; height:31px; float:left;}
.photo ul.topic li a.set {
	display:block;
	font-size:11px;
	width:auto;
	padding:0px 30px;
	height:30px;
	text-align:center;
	line-height:30px;
	color:#FFFFFF;
	text-decoration:none;
	border-width:0px;
	background:#666;
	font-family:verdana, arial, sans-serif;
	letter-spacing: .1em;
}

.photo ul.topic li a ul, 
.photo ul.topic li ul 
{display:none;}

.photo ul.topic li a:hover,
.photo ul.topic li:hover a
{color:#ffcc66; background:#333;}

.photo ul.topic li a:hover ul, 
.photo ul.topic li:hover ul 
{display:block; position:absolute; left:0; top:31px; list-style:none; padding:0; margin:0; height:425px; width:720px; padding:70px 0px;}

.photo ul.topic li a:hover ul li, 
.photo ul.topic li:hover ul li 
{display:inline; width:112px; height:87px; float:left; }

#gallery {width:720px; height:400px; padding:10px; position:relative; }
#gallery b.default {position:absolute; left:180px; top:41px; width:548px; height:400px; text-align:left;}
#gallery b.default img {display:block; margin:0 auto 10px 30px; }
#gallery b.default span {
	display:block;
	color:#fff;
	font-family:"TradeGothic", verdana, arial, sans-serif;
	font-weight:normal;
	font-size:11px;
	width:350px;
	margin:0 auto 10px 30px;
	text-align: left;
	background-color: #515151;
	line-height: 14px;
}
#gallery b.default span:first-line {
	color:#ffcc66;
	font-family:"TradeGothic-BoldTwo", verdana, arial, sans-serif;
	font-weight:bold;
	font-size:11px;
	text-align: left;
}
#gallery ul {list-style:none; padding:0; margin:0; width:180px; position:relative; float:left;}
#gallery ul li {display:inline; width:75px; height:75px; float:left; margin:0 5px 5px 0; border: 1px solid #fff; padding:3px; }
#gallery ul li a {display:block; width:73px; height:73px; text-decoration:none; border:1px solid #000; border-color:#eee #555 #333 #ddd;}
#gallery ul li a span {display:none;}
#gallery ul li a img {
	display:block;
	width:100%;
	height:100%;
	border:0;
}
#gallery ul li a:hover {white-space:normal; border-color:#555 #ddd #eee #333; background:#515151;}
#gallery ul li a:hover b {position:absolute; left:180px; top:0; width:548px; height:400px; text-align:left; background:#515151; z-index:20;}
#gallery ul li a:hover span {
	display:block;
	color:#fff;
	font-family:"TradeGothic", verdana, arial, sans-serif;
	font-weight:normal;
	font-size:11px;
	width:350px;
	margin:0 auto 10px 30px;
	text-align: left;
	line-height: 14px;
	
}
#gallery ul li a:hover span:first-line {color:#ffcc66;
	font-family:"TradeGothic-BoldTwo", verdana, arial, sans-serif;
	font-weight:bold;
	font-size:11px;
	text-align: left;
}
#gallery ul li a:hover img {margin:0 auto 10px 30px; width:auto; height:auto; }

#gallery ul li a:active, #gallery ul li a:focus {white-space:normal; border-color:#555 #ddd #eee #333; background:#515151;}
#gallery ul li a:active b, #gallery ul li a:focus b {position:absolute; left:180px; top:0; width:548px; height:400px; text-align:left; background:#515151; z-index:10;}
#gallery ul li a:active span, #gallery ul li a:focus span {
	display:block;
	color:#fff;
	font-family:"TradeGothic", verdana, arial, sans-serif;
	font-weight:normal;
	font-size:11px;
	width:350px;
	margin:0 auto 10px 30px;
	text-align: left;
	line-height: 14px;
}
#gallery ul li a:active span:first-line, #gallery ul li a:focus span:first-line {color:#ffcc66;
	font-family:"TradeGothic-BoldTwo", verdana, arial, sans-serif;
	font-weight:bold;
	font-size:11px;
	text-align: left;
}
#gallery ul li a:active img, #gallery ul li a:focus img{
	
	margin:0 auto 10px 30px;
	width:auto;
	height:auto;
	
}