@charset "UTF-8";

/* MAGNET PRODUCT DESIGN AND DEVELOPMENT */
/* MASTER STYLE DOCUMENT FOR HOME PAGE */
/* Common styles between all versions */
html {height:100%;}
body {
	margin:0 auto;
	padding:0;
	font-family: Tahoma, Verdana, Arial, sans-serif;
	text-align:center;
	color:#000;
	font-size:smaller;
	height:100%;
}
h2 {
	font-size:1.4em;
	color:#C50;
	font-weight:normal;
	color:#000;
}
h3 {
	font-size:1.5em;
	color:#ffcc00;
	font-weight:normal;
	margin:0;
	padding:0;
}

p.case {
	width:315px;
	font-size:1.1em;
	line-height:1.6em;
	color:#fff;
	margin:0 0 1em;
}
ul {
	color:#464646;
}
li {
	line-height:1.4em;
}

#header {
	height:35px;
	background:#000;
	width:100%;
	min-width:600px;
	z-index:10;
	margin:0;
	position:relative;
}
#header a {
	display:block;
	float:right;
	margin:10px 20px 0 0;
}

#bg_image {
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	position: absolute;
	z-index: 0;
}
#bg_image img{width:100%;height:100%;}

/*-------------------------------------------------------------------------------------------------------------------------------------------------*/

#container {
	margin:0;
	padding:0;
	/*position:relative;
	height:auto !important;*/
	height:100%;
	min-height:100%;
	background-color:#222;	
}
#middle {
	margin: 0 auto;
	text-align:left;
	width:100%;
	height:auto;
	min-width:525px;
	position:relative;
	padding-top:10px;
}
	* html #middle {padding-top:40px;}
#content-box {
	width:815px;
	height:450px;
	color:#FFFFFF;
	position:relative;
	z-index:1;
	overflow:hidden;
	-moz-border-radius: 0.3em;
	border:solid #fff 1px;
	height:450px;
	margin:-340px auto 0px auto;}
	
* html #content-box {margin:-300px auto 0px auto;}
	
#content-box .transparency {
	-moz-border-radius: 0.3em;
	opacity:0.8;
	filter:alpha(opacity=80);
    -moz-opacity:0.8;
	width:815px;
	height:450px;
	position:absolute;
	z-index:-1;
	margin:0 auto;
	top:0px;
	left:0px;}
	
#content-box .content {
	position:absolute; /*changed from relative to fix IE6 display*/
	color:#FFFFFF;}


#content-box .content .ttl{position:relative;filter:none !important;text-align:left;padding:20px 20px 30px 20px;}
#content-box .content .left-col{width:210px;height:310px;float:left;padding:5px 20px;text-align:left;color:#fff;}
#content-box .content .left-col a{font-size:1em;color:#ffcc00;font-weight:normal;margin:0;padding:0;}
#content-box .content .left-col ul.news{text-align:left;color:#fff;list-style:none;margin:0;padding:0 20px 0 0;font-size:1em;}
#content-box .content .left-col ul.news li{padding-bottom:10px;}
#content-box .content .left-col ul.news li a{color:#fff;}
#content-box .content .left-col ul.news li .date{color:#999999;}

#content-box .content .right-col {float:left; padding:5px 15px; text-align:left; width:450px;}
#content-box .content .right-col .case-study {padding:0 35px;}
#content-box .content .right-col .case-study .case {line-height:20px; width:310px; margin:0 0 10px 0;}

#content-box .content .right-col .slideshow {overflow:hidden; padding-top:10px;}
* html #content-box .content .right-col .slideshow {overflow:hidden; padding-top:0px;}
#content-box .content .right-col .slideshow .titleI {margin-left:33px; color:#fff; font-weight:bold; font-size:12px;}
#content-box .content .right-col .slideshow .gallery {height:70px;}
#content-box .content .right-col .slideshow .gallery a {float:left; margin:22px 3px 0px 3px;}
/*#content-box .content .right-col .slideshow .gallery .photos {list-style:none; float:left; margin:0;padding:0 5px; filter:none !important;}
#content-box .content .right-col .slideshow .gallery .photos li {float:left; width:59px; height:59px; border:solid #fff 2px; margin:0 5px; font-size:0px;}*/

#photosContainer {width:360px; height:62px; margin:0px; padding:0px; float:left;}
	/* From inline- width: 390px; height: 64px;  */
	/* Original values- width: 360px; height: 62px;  */
#photosContainer #photoInner {/*position:absolute;*/ width:420px; height:62px; margin:0px; padding:0px;} 
	* html #photosContainer {overflow:hidden; width:450px;}
	* html #photosContainer #photoInner {white-space:nowrap;}

#photosContainer #photoInner a{margin: 2px;}
#photosContainer #photoInner a img{border:solid #ffffff 1px;}

.img-right {width:815px; height:300px; margin:0 auto 0 auto;}
.img-right .image {width:330px; margin-top:80px; background-repeat:no-repeat; background-position:top right; position:relative; z-index:200;}
	* html .img-right .image{margin-top:0px; top:80px;}



/* SECONDARY NAVIGATION */

.subNav {
	width:100%;
	min-width:600px;
	background:#5C5C5C url(/graphics/nav/subnav_bg.gif) repeat-x top;
	position:absolute;
	bottom:30px;
	left:0;
	padding:5px 0;
	z-index:10;
}
.bioNav {
	bottom:55px;
	z-index:5;
}
.subNav ul {
	list-style-type:none;
	margin:0 17px 0 35px;
	padding:0;
}
.subNav li {
	margin:0;
	padding:0 25px 0 0;
	float:left;
	font-size:.95em;
	line-height:1.0em;
}
.subNav a {
	color:#FFF;
	text-decoration:none;
}
.subNav a img {	
	border:1px solid #FFF;
	margin:1px;
}
.subNav a:hover img {
	border-width:2px;
	margin:0;
}

/* BOTTOM-NAV HEIGHT FIX */
body.purpose #Zspacer { padding:0 0 70px; }
body.process #Zspacer { padding:0 0 70px; }
body.passion #Zspacer { padding:0 0 70px; }
body.people #Zspacer { padding:0 0 120px; }
body.portfolio #Zspacer { padding:0 0 120px; }
body.contact #Zspacer { padding:0 0 40px; }

/* PRIMARY NAVIGATION */
	
#primaryNav {
	height:30px;
	width:100%;
	min-width:600px;
	position:absolute;
	bottom:0;
	left:0;
	background:#000 url(/graphics/nav/bottom_bg.gif) top;
	z-index:10;
}
#primaryNav ul {
	list-style-type:none;
	margin:0 0 0 25px;
	padding:0;
}
#primaryNav li {
	padding:0 1px 0 0;
	margin:0;
	float:left;
	text-align:left;
	line-height:1.0em;
}
#primaryNav a {
	width:92px;
	height:24px;
	padding:0;
	display:block;
	color:#FFF;
}
#primaryNav a:hover {
   background: url(/graphics/nav/tab_o.gif) top left no-repeat;
}
.purpose #primaryNav #purpose a,
  .process #primaryNav #process a,
  .passion #primaryNav #passion a,
  .portfolio #primaryNav #portfolio a {
	 background: lime url(/graphics/nav/tab_a.gif) top left no-repeat;
}
.contact #primaryNav #contact a {
  background: lime url(/graphics/nav/tab_contact.gif) top left no-repeat;
}

#primaryNav #contact {
	float:right;
	margin:0 25px 0;
}


/* PNG TRANSPARENCY FIX */
/* Special thanks to Angus Turnbull - http://www.twinhelix.com */

* html img { behavior: url(/inc/iepngfix.htc); }