/* Color Key 
navbg&footertxt = e3e3e3
border = c0c0c0
mainbg = f0f0f0
footer&tabs = 5d5d5d
blue = 18dcff
navrollover = efefef
*/

body {
	font-size: 62.5%;
	margin: 15px 0 15px 0;
	background: url('images/bg.gif') repeat #dedede;
	text-align: center;
	font-family: Helvetica, Arial, sans-serif;
}

div { position: relative; }

a img { border: none; }

div#all {
	width: 942px;
	text-align: left;
	margin: auto;
	border: 1px solid #000;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-khtml-border-radius: 10px;
	-moz-box-shadow: 3px 3px 8px #888;
	-webkit-box-shadow: 3px 3px 8px #888;
	background-color: #f0f0f0;
	padding: 16px 0 12px 18px;
}

div#main {
	width: 927px;
	background-color: #f0f0f0;
}

div#main #header {
	width: 923px;
	height: 132px;
	margin-bottom: 10px;
	background: url('images/header.png') no-repeat transparent;
}

#header #myinfo {
	width: 450px;
	height: 100px;
	text-align: right;
	left: 470px;
	top: 20px;
}

#myinfo2 {
	width: 480px;
	height: auto;
	text-align: right;
	left: -53px;
	margin-top: 7px;
}

div#nav {
	width: 805px; /* - for more padding | + for less = 860 = 7 */
	height: 40px;
	background-color: #e3e3e3;
	border: 1px #c0c0c0 solid;
	-moz-border-radius-bottomleft: 10px;
	-moz-border-radius-topright: 10px;
	-moz-border-radius-topleft: 10px;
	-webkit-border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	-webkit-border-bottom-left-radius: 10px;
	-khtml-border-radius-topright: 10px;
	-khtml-border-radius-topleft: 10px;
	-khtml-border-radius-bottomleft: 10px;
	padding: 5px 0 15px 122px; /*adjust position | 67px = 7*/

}

div#nav ul li {
	display: inline; 
	float: left;
	margin-right: 14px;
	width: 86px;
	height: 26px;
	border: 1px solid #858384;
	background-color: #18dcff;
	padding: 0px;
	text-align: center;
}


div#nav ul li a {
	width: 82px;
	height: 17px;
	background-color: #161616;
	display: block;
	padding: 3px 0 2px 0;
	position: relative;
	top: 2px;
	left: 2px;
}

div#nav ul li a:hover {
	background: #efefef; 
	color: #161616;
	display: block;
}

div#connect {
	width: 186px;
	height: 26px;
	padding: 4px 0 4px 120px;
	border: 1px solid #c0c0c0;
	border-top: 0px;
	background-color: #fff;
	-webkit-border-bottom-left-radius: 5px;
	-webkit-border-bottom-right-radius: 5px;
	-moz-border-radius-bottomleft: 5px;
	-moz-border-radius-bottomright: 5px;
	-khtml-border-radius-bottomleft: 5px;
	-khtml-border-radius-bottomright: 5px;
	left: 621px;
	background: url('images/connect.png') no-repeat;
	background-position-x: 6px;
	background-position-y: 10px;
	background-position: 6px 10px;
}

div#connect img {
	display: inline;
	margin-right: 5px;
}

div#titletab {
	width: 170px;
	height: 29px;
	background-color: #5d5d5d;
	padding: 4px 3px 4px 20px;
	-webkit-border-top-left-radius: 5px;
	-webkit-border-top-right-radius: 5px;
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-topright: 5px;
	-khtml-border-radius-topleft: 5px;
	-khtml-border-radius-topright: 5px;
}

div#contentarea {
	width: 927px;
	height: auto;
	margin-bottom: 10px;
}

div#contentarea div#content, div#content2 {
	height: auto;
	border: 1px solid #c0c0c0;
	background-color: #fff;
	padding: 7px 5px 10px 10px;	
}

div#content { width: 598px; }

div#content2 { width: 910px; }

div#demoleft {
	

}

div#contentarea div#sidecontent {
	width: 255px;
	height: 240px;
	float: right;
	left: -20px;
}

div#contentarea div#sidecontentbox {
	width: 245px;
	height: auto;
	float: right;
	left: -20px;
	background: #fff;
	border: 1px #000 solid;
	padding: 5px;
	margin: 0px;
}

div#footer {
	width: 917px;
	height: 37px;
	padding: 5px;
	background-color: #5d5d5d;
	clear: both;
}

div#footer #mininav {
	width: 350px;
	float: right;
}

#mininav ul { margin: -5px; }

#mininav ul li {
	display: inline;
	margin: 0 3px;
}



/* PRESENTATION */

div#contentarea div#sidecontent div#caption, div#contentarea div#sidecontent div#caption a { /*beneath right-side index pic*/
	font-size: 11px;
	margin-top: 6px;
}

#footer, #mininav ul li a {
	font-size: 10px;
	color: #fff;
	letter-spacing: 1px;
	font-weight: bold;
}

#mininav ul li a { text-decoration: none; }

#mininav ul li a:hover { text-decoration: underline; }

p { 
	margin-bottom: 10px;
	margin-top: 0;
	letter-spacing: 1px;
}

#content2 ul li, #content ul li { 
	font-size: 14px;
	list-style-type: square;
	line-height: 20px;
	margin-bottom: 10px;	
}

p, a, table { font-size: 14px; line-height: 22px; }

p a, td a, #content2 ul li a, #content ul li a { 
	color: #009ebb;
	text-decoration: underline;
	font-style: normal;
}

#content2 ul li a.sm, #content ul li a.sm {
	color: #009ebb;
	text-decoration: underline;
	font-style: italic;
	font-size: 11px;
}

a:hover, #content2 ul li a:hover, #content ul li a:hover { text-decoration: none; }

div#nav ul li a, .tabheader, .headermaintxt, .headersubtxt, .title, .date, #legend, h2, h3, h4 { font-family: Lucida Sans Unicode, Verdana, Helvetica, Arial, sans-serif; }

div#nav ul li a {
	font-size: 12px;
	color: #efefef;
	text-decoration: none;	
	text-transform: uppercase;
	letter-spacing: 1px;
	line-height: 19px;
}

div#nav ul li a:hover { text-decoration: none; }

.tabheader {
	font-size: 18px;
	text-shadow: 2px 2px 2px #000;
	color: #fff;
	letter-spacing: 3px;
	text-transform: uppercase;
}

div#header a { text-decoration: none; }

.headermaintxt, .headersubtxt { 
	color: #000;
	text-shadow: 1px 2px 3px #333;
}

.headermaintxt { 
	font-size: 52px; 
	line-height: 25px;
	letter-spacing: 5px; 
}

.headersubtxt { 
	font-size: 18px; /*13px*/
	line-height: 24px; /*18px*/
	letter-spacing: 2px; 
}

/* For Photos */

img.photo {
	border: 2px solid #000; 
	-moz-box-shadow: 4px 4px 3px #666;
	-webkit-box-shadow: 4px 4px 3px #666;
	box-shadow: 4px 4px 3px #666;
}

/* UPDATE LEGEND 

table { border: 1px solid #a0a0a0; }

#legend { font-size: 11px; }

td { vertical-align: top; border: 1px solid #c9c9c9; padding: 3px 6px; }

div#keyva, div#keydesign, div#keycode, div#keyproject { 
	border: 1px solid #c9c9c9; 
	width: 40px; 
	height: 10px; 
	float: right;
	margin-top: 2px;	 
}

table tr.va, div#keyva { background-color: #dbedf0; /*blue*/ }

table tr.design, div#keydesign { background-color: #faebd1; /*orange*/ }

table tr.code, div#keycode { background-color: #dbf0dd; /*green*/ }

table tr.project, div#keyproject { background-color: #dbddf0; /*purple */ }

/*.title { 
	color: #5d5d5d; 
	font-size: 14px; 
	line-height: 16px;
	font-weight: bold;
}

.date { 
	font-size: 11px;
	color: #333;
	line-height: 15px;
}

.subtxt, .subtxt a{
	font-size: 10px;
	font-style: italic;
}

.subtxt { color: #5d5d5d; }

/* END UPDATE LEGEND */

h2 { 
	font-size: 20px;
	margin: 0;
	text-decoration: underline;	
}

h3 { font-size: 16px;}


/*START GRAPHIC TABLE - may use for credits */

div#design { width:598px; }

div#gfxholder { float: left; width:330px; }

table#gfx { width: 210px; border: none; }

table#gfx td, table#sitedes td, table#sitecode td { border: none; vertical-align: top; }

table#gfx a img, table#sitedes a img, table#sitecode a img { 
	border: 1px solid #666; 
	-moz-box-shadow: 2px 2px 3px #666;
	-webkit-box-shadow: 2px 2px 3px #666;
	box-shadow: 2px 2px 3px #666;
 }
 
table#sitedes { width: 220px; border: none; }

table#sitecode /* FOR CODE PAGE */ { width: 100%; border: none; }

table#sitedes td a, table#sitedes td, table#sitecode td a, table#sitecode td { font-size: 10px; line-height: 15px; }

/* END GRAPHIC TABLE */


/* START TESTIMONIAL */

h4 { 
	margin: 0;
	font-size: 14px;
	text-decoration: underline;
}
.quote { 
	font-size: 12px;
	color: #a3a3a3;
	font-family: Tahoma, Helvetica, Arial, sans-serif;
	font-style: italic;
	line-height: 16px;
}

/* END TESTIMONIAL */

hr { margin: 6px 0; }

table#demos, table#demos td { border: none; }

table.contact, table.contact td { border: none; padding: 3px 6px; }

table.credits, table.credits td { padding: 3px; text-align: center; }

table.credits { border: none; }

table.credits td { border: 1px solid #cacaca; }

td.title { padding: 2px; text-align: center; background-color: #dcdcdc; }