/* CSS Document */
/* Dean Clamp Portfolio style sheet for http://www.deanclamp.com */
html, body, ul, ol, li, p, blockquote, q, h1, h2, h3, h4, h5, h6, form, fieldset, a, div, img {	
margin: 0;	
padding: 0;	
border: 0;
}

html {	
height: 100%;	
max-height: 100%;
}

body {	
height: 100%;	
max-height:100%;	
background-color: #fff;	
color: #999;	
font-size: 75%;	
font-family: Georgia, "Times New Roman", Times, serif;
text-align: center;
min-width:950px;
}

h1,h2,h3,h4,h5,h6 {	
font-family: Georgia, "Times New Roman", Times, serif;		
color: #999;	
font-weight: normal;
}

/* Acronym and abbreviation style */
acronym, abbr {
cursor: help;
}

#wrapper {
text-align: left;	
width: 850px;
height: 560px;	
background-color: #fff;	
position: absolute;	
top: 50%;	
left: 50%;	
margin: -295px auto auto -475px;	
padding: 10px 50px;	
border: 1px solid #999;
}

#section-wrapper {
width: 850px;	
float: left;
display: inline;
}

#section {
float: left;	
display: inline;
}

#section p {
font-size: 7em;	
color: #999;
}

#subnav {	
margin: .2em 0 0 0;	
padding: 0 0 .2em 0;	
}

#subnav, #subnav ul {	
float: left;	
width: 850px;	
list-style: none;
}

#subnav a {
display: block;	
padding: .5em .5em .5em 0;
margin-left: .5em; 
}
#subnav li a {
font-size: 1em;	
font-weight: bold;	
color: #999;
}

#subnav a:hover {
text-decoration: underline;
}

#subnav a.daddy {
background: url(../images/rightarrow.gif) center right no-repeat;
}

#subnav li {
float: left;
}

#subnav li ul {
position: absolute;
width: 13em;
left: -999em;
background-color:#fff;	
border-bottom: 1px dotted #999;
}

#subnav li ul li {
width: 13em;
display:block;
}

#subnav li ul li a {
color:#999;
border-top: 1px dotted #999;
}

#subnav li:hover, #menu li.over {
position: static;
} 

#subnav li ul li:hover {
background-color:#eee;
}

#subnav li ul li a:hover {
background-color:#eee;
}

#subnav li ul ul {
margin: -2em 0 0 12.9em;
}

#subnav li:hover ul ul, #subnav li:hover ul ul ul, #subnav li:hover ul ul ul ul, #subnav li.sfhover ul ul, #subnav li.sfhover ul ul ul, #subnav li.sfhover ul ul ul ul {
left: -999em;
}

#subnav li:hover ul, #subnav li li:hover ul, #subnav li li li:hover ul, #subnav li li li li:hover ul, #subnav li.sfhover ul, #subnav li li.sfhover ul, #subnav li li li.sfhover ul, #subnav li li li li.sfhover ul {	
left: auto;
}

#nav {
float: left;
display: inline;
}

#nav ul {
padding: 0 1em;
list-style: none;
margin-top: 1.5em;
}

#nav li a {
font-size: 1em;
font-weight: bold;
color: #999;
text-decoration: none;
}

#nav .nav-about:hover {
	color: #01AEF0;
}

#nav .nav-portfolio:hover {
	color: #0FE70F;
}

#nav .nav-lab:hover {
	color: #ff8000;
}

#nav .nav-contact:hover {
	color: #FF1B00;
}

.about {
	color: #01AEF0;
}

.portfolio {
	color: #0FE70F;
}

.lab{
	color: #ff8000;
}

.contact {
	color: #FF1B00;
}

#logo {
float: right;
margin: 1.5em 0 0 0;
width: 250px;
height: 50px;
}
#logo a {
display: block;
width: 250px;
height: 50px;
}

#content {
width: 100%;
float: left;
display: inline;
padding: 1.5em 0 0 0;
}
/* FORMS - ALL CSS FOR FORMS AND FORM ELEMENTS BELOW */
#content form { 
/* set width in form, not fieldset (still takes up more room w/ fieldset width */  
font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;  
color:#999;
margin: 0;
padding: 0;
float: left;
display: inline;
width: 100%;
}

#content form fieldset {  
/* clear: both; note that this clear causes inputs to break to left in ie5.x mac, commented out */
border-color: #999;
border-width: 1px;
border-style: solid;
padding: 1em;        /* padding in fieldset support spotty in IE */  
margin: 0;
}
#content form label {
display: block;  /* block float the labels to left column, set a width */
float: left;
width: 30%;
padding: 0;
margin: 0.5em 0 0 1em; /* set top margin same as form input - textarea etc. elements */
text-align: right; 
}
#content form fieldset legend {
color: #999;
font-size: 1.2em; /* bump up legend font size, not too large or it'll overwrite border on left */
margin: 0;                   /* be careful with padding, it'll shift the nice offset on top of border  */
}
#content form input, #content form textarea, #content form select {
/* display: inline; inline display must not be set or will hide submit buttons in IE 5x mac */
font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
font-size: 1em;
color: #999;
border: 1px solid #999;
width: 13em;      /* set width of form elements to auto-size, otherwise watch for wrap on resize */	
margin:0.5em 0 0 1em; /* set margin on left of form elements rather than right of                              label aligns textarea better in IE */
}

#content form input#reset {	
margin-left:0px; /* set margin-left back to zero on reset button (set above) */
}
textarea {
overflow: auto; 
}

#content form small {	
display: block;
margin: 0 0 0.5em 30%; /* instructions/comments left margin set to align w/ right column inputs */
padding: 1px 3px;
font-size: .95em;
}

#content form .required{
font-weight:bold;
} /* uses class instead of div, more efficient */

#content form .button{
width: 5em;
background-color:#fff;
color:#999;
} /* uses class instead of div, more efficient */

#content p {
font-family:"Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
color: #999;
font-size: 1em;
line-height: 1.5em;
margin-bottom: 1em;
}

#content h1 {
font-size: 1.5em;
margin-bottom: 0.2em;
}

#content h2 {
font-size: 1.2em;
margin-bottom: 0.2em;
}

#content ul {
font-family:"Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
color: #999;
font-size: 1em;
line-height: 1.5em;
margin-bottom: 1em;
list-style-type: square;
list-style-position: inside;
}

#credits {
	font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	width: 100%;
	position:absolute;
	left: 0;
	bottom: 0;
	text-align: center;
	margin-bottom: .5em;
}

#credits ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

#credits li {
	display: inline;
	font-size: 1em;
	padding: 0 .5em 0 .5em;
	margin-left: .5em;
	color: #999;
}

#credits li a {
	color: #999;
}

#credits li a:hover {
	text-decoration: none;
}

.text-wrapper {
width: 550px;
height: 400px;
overflow: auto;
padding: 0 10px 0 0;
}

.column-wrapper {
float: left;
display:inline;
width: 100%;
text-align: center;
}

.column {
float: left;
display:inline;
width: 170px;
}

.portfolio-column {
float: left;
display:inline;
width: 33%;
}

.column-left {
float:left;
display:inline;
width: 47%;
margin-right: 5%;
text-align: left;
}

.column-right {
float:left;
display:inline;
width: 47%;	
text-align: left;
}

.column-overflow {
float:left;
display:inline;
width: 47%;
margin-right: 5%;
padding-right: .5em;
text-align: left;
height: 325px;
overflow: auto;
}

.cv-wrapper {
float: left;
display:inline;
width: 530px;
}

.cv-left {
float: left;
display:inline;
width: 170px;
text-align: right;
margin-right: 10px;
}

.cv-right {
float: right;
width: 350px;
}

.cv-right a {
color: #999;
}

.divide {
margin: 1.5em 0 0 0;
padding: 1em 0 0 0;
border-top: 1px dotted #999;
}

#content .large {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 2.5em;
color: #999;
line-height: 1.2em;
}

#content .small-text {
font-size: .95em;
line-height: 1;
}

.sitemap-title {
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size: 1.2em;
}

.sitemap-url {
	font-size: .95em;
	font-style: italic;
}

/* Style for wrapping text around an image */
.floatleft {
float:left;
margin: 0 1em 1em 0;
}
.floatright {
float: right;
margin: 0 0 1em 1em;
}

/* ----------------------------------------------------------------------------- */
/* CSS FOR ACCESSIBILITY */
#skiplink {display:none}