/* Main Styles */

body { 
	margin: 50px; 
	width: 90%; 
	background: #fff; 
	color: #2e373b; 
	font-family: "droid-sans-1","droid-sans-2",sans-serif;
//	font-family: "colaborate-1","colaborate-2",sans-serif; 
	font-size: 10pt; 
	} 

a { 
	color: #11AAFF; 
	text-decoration: none; 
	} 

a:hover { 
	text-decoration: underline; 
	} 

a#thumb:hover { 
	border-bottom: 3px solid;
	padding-bottom: 5px;
	}


h1 { 
	font-size: 16pt; 
	line-height: 24pt; 
	} 

h2 { 
	font-size: 8pt; 
	border-top: 1px solid #e1dfd9; 
	padding-top: 3px; 
	width: 100%; 
	color: #000; 
	line-height: 12pt; 
	} 

h3 { 
	font-size: 8pt; 
	line-height: 12pt; 
	} 

.strong {
	font-weight: bold; 
	}

span.header { 
	color: #000; 
	font-size: 8pt; 
	font-weight: bold; 
	line-height: 12pt; 
	} 

#twit-div { 
	position: relative;
	top: 3px;
	left: -40px;
	width: 175px; 
//	height: 500px; 
	padding: 0;
	margin: 0;
	}

ul#twitter_update_list { 
	list-style: none; 
	font-size: 9pt;
	line-height: 12pt;
	width:175px
	}

ul#twitter_update_list li { 
	padding-bottom: 20px;
	}




/* Colors */

#lightblue { color: #11AAFF; }
#darkblue {	color: #1D6479; }
#teal { color: #51B9B4; }
#purple { color: #BE96C5; }
#orange { color: #F8C961; }
#red { color: #EE3823; }		
#black { color: #000000; }
#white { color: #FFFFFF; }
#grey { color: #909090; }





/* Main Layout */


#navleft { 
	position: absolute;
	overflow: hidden;
	left: 50px;
	top: 5px; 
	width: 525px; 
	height: 25px;
	} 
		#navleft a.home { 
			position: absolute;
			}

		#navleft a.clientprojects { 
			position: absolute;
			left: 85px;
			}

		#navleft a.resume { 
			position: absolute;
			left: 235px;
			}

		#navleft a.process { 
			position: absolute;
			left: 352px;
			}
		
#navright { position: absolute; top: 5px; left: 525px; width: 325px; } 
#navlinks { position: absolute; top: 5px; left: 875px; width: 250px; } 


/*
#links { position: absolute; top: 5px; left: 0px; width: 100%; } 

		#links a { padding-left: 50px; }

				#links a.blog { position: absolute; left: 525px; padding: 0px; }
				#links a.contact { position: absolute; left: 875px; padding: 0px; }
*/


#intro {
	position: absolute;
	top: 150px;
	left: 50px;
	}





/* Portfolio Layout */

#portfolio_browse {
	width: 850px;
	position: absolute;
	left: 50px;
	top: 341px;
	}

		#portfolio_browse div.left {
			width: 450px;
			float: left;
			margin-top: 79px;
			margin-left: 275px;
			margin-bottom: 42px;
			}

		#portfolio_browse div.right {
			position: absolute;
			width: 325px;
			margin-top: 0px;
			margin-left: 475px;
			}




#portfolio_browse_left {
	width: 430px;
	position: absolute;
	left: 50px;
	top: 420px;
	}

		#portfolio_browse_left div.left {
			width: 212px;
			float: left;
			margin-bottom: 42px;
			}

		#portfolio_browse_left div.right {
			float: right;
			width: 200px;
			}


#portfolio_browse_right {
	width: 430px;
	position: absolute;
	left: 525px;
	top: 420px;
	}

		#portfolio_browse_right div.left {
			width: 212px;
			float: left;
			margin-bottom: 42px;
			}

		#portfolio_browse_right div.right {
			width: 200px;
			float: right;
			}






#portfolioleft { 
	width: 450px; 
	position: absolute;
	left: 50px;
	top: 420px;
	} 

		#portfolioleft div.left{
			margin-top: 12px;
			float: left;
			width: 212px;
			}

		#portfolioleft div.right{ 
			margin-top: 12px;
			float: right;
			width:213px;
			}

#portfolioright { 
	position: absolute;
	width: 325px; 
	left: 525px;
	top: 341px; 
	} 

#projectlist { 
	position: absolute; 
	width: 175px; 
	left: 875px; 
	top: 350px; 
	} 





/* Resume Layout */

#resumeleft { 
	width: 450px; 
	position: absolute;
	left: 50px;
	top: 350px;
	} 

#resumeright { 
	position: absolute;
	width: 325px; 
	left: 525px;
	top: 350px; 
	} 

#contact { 
	position: absolute; 
	width: 175px; 
	left: 875px; 
	top: 350px; 
	} 





/* Resume Styles */

a#resume_link { color: #11AAFF; }


span.client { 
	color: #000; 
	font-size: 8pt; 
	font-weight: bold; 
	line-height: 12pt; 
	} 

span.client_smcaps { 
	color: #404040; 
	font-size: 7.5pt; 
	font-weight: bold; 
	line-height: 12pt; 
	} 

span.smcaps { 
	color: #000; 
	font-size: 7.5pt; 
	font-weight: bold; 
	line-height: 12pt; 
	}	

span.company { 
	font-size: 8pt; 
	line-height: 12pt; 
	} 

span.dates { 
	font-size: 8pt; 
	color: #B0B0B0; 
	line-height: 12pt; 
	} 

span.description { 
	width: 390px; 
	font-size: 9pt; 
	line-height: 12pt; 
	color: #2e373b; 
	} 

span.description_intro { 
	width: 390px; 
	font-size: 9pt; 
	line-height: 12pt; 
//	font-weight: bold;
	color: #2e373b; 
	} 

span.role { 
	color: #000; 
	font-size: 8pt; 
	font-weight: bold; 
	line-height: 12pt; 
	} 

span.contact { 
	font-size: 9pt; 
	line-height: 12pt; 
	} 

span.black { 
	color: #000; 
	}





/* Process Layout */

#processleft {
	width: 345px; 
	position: absolute;
	left: 50px;
	top: 350px;
	}

#processcenter { 
	width: 350px;
	position: absolute;
	left: 435px;
	top: 350px;
	}

		#processcenter span.whatIS {
			position: absolute; 
			top: -15px; 
			left: 50px; 
			color: #909090;
			z-index: 5;
			}

		#processcenter span.whatMightBe {
			position: absolute; 
			top: -15px; 
			left: 30px; 
			color: #909090;
			z-index: 5;
			}

		#processcenter div.arrow { 
			background-image: url('images/processarrows.png');
			position: absolute;
			width: 372px;
			height: 364px;
			left: -26px;
			top: -15px;
			z-index: 15;
			}

		#processcenter div.boxUL { 
			background: #909090;
			width: 150px; height: 150px; 
			position: absolute;
			left: 0px;
			top: 8px;
			text-align: center;
			z-index: 5;
			}


		#processcenter div.boxUR { 
			background: #909090;
			width: 150px; height: 150px; 
			position: absolute;
			left: 175px;
			top: 8px;
			text-align: center;
			z-index: 5;
			}

		#processcenter div.boxLR { 
			background: #909090;
			width: 150px; height: 150px; 
			position: absolute;
			left: 175px;
			top: 183px;
			text-align: center;
			z-index: 5;
			}

		#processcenter div.boxLL { 
			background: #909090;
			width: 150px; height: 150px; 
			position: absolute;
			left: 0px;
			top: 183px;
			text-align: center;
			z-index: 5;
			}

#processright { 	
	width: 345px; 
	position: absolute;
	left: 785px;
	top: 350px;
	}






/* Process Styles */

span.description_process { 
	font-size: 8pt; 
	line-height: 11pt; 
	color: #2e373b; 
	} 

div.abstract {
	position: absolute;
	writing-mode:tb-rl;
	-webkit-transform:rotate(-90deg);
	-moz-transform:rotate(-90deg);
	-o-transform: rotate(-90deg);
	white-space:nowrap;
	display:block;
	left: -40px;
	top: 75px;
	}

div.concrete {
	position: absolute;
	writing-mode:tb-rl;
	-webkit-transform:rotate(-90deg);
	-moz-transform:rotate(-90deg);
	-o-transform: rotate(-90deg);
	white-space:nowrap;
	display:block;
	left: -40px;
	top: 250px;
	}





/* Image Slideshow on Portfolio Pages */

a {outline: none; } /* For Firefox */

div#slideshow {
	width: 450px; height: 300px; padding: 0; margin: 0;
	border: 1px solid #e1dfd9;
	overflow: scroll; /* In case javascript is disabled */
	position: relative; z-index: 5;
	}

	div#slideshow ul#nav {
		display: none;
		list-style: none;
		position: relative;
		top: 125px;
		z-index: 15;
		}

		div#slideshow ul#nav li#prev {
			float: left;
			margin: 0;
			}

		div#slideshow ul#nav li#next {
			float: right;
			margin: 0 40px 0 0;
			}

		div#slideshow ul#nav li a {
			text-decoration: none;
			border: 0;
			display: block;
			width: 40px;
			height: 40px;
			text-indent: -9999px;
			}

			div#slideshow ul#nav li#prev a {
				text-decoration: none;
				background: url(images/prev.png);
				}

			div#slideshow ul#nav li#next a {
				text-decoration: none;
				background: url(images/next.png);
				}

		div#slideshow ul#slides {
			list-style: none;
			}
	
			div#slideshow ul#slides li {
				margin: -13px 0 0 0;
				}