html, body { 
	text-align: center;
	font: 14px Century Gothic, Apple Gothic, sans-serif ; 
	color : #888; 
	background-color: #444;
}
a:link 		{ text-decoration: none; color: #888; }
a:visited 	{ text-decoration: none; color: #888; }
a:hover 	{ text-decoration: none; color: #888; }
a:active 	{ text-decoration: none; color: #888; }
h1 { font-size: 1.4em; font-style: bold; margin-top: 5px; }
.hideme { display: none; }
.showme { display: block; }
.spinner { background:url('../images/spinner.gif') no-repeat center;}
.spinner1 { background:url('../images/spinner1.gif') no-repeat center;}
h3 {
    font: normal 1.1em verdana, arial, helvetica, sans-serif;
    line-height: 2em;
    margin: 0 0 10px 0;
    padding: 0 10px;
    color: #369;
}
#amazon { clear: both; position: absolute; bottom: 10px; left: 10px;}
#toggleBox { float: right; margin: 10px 10px 0 0; width: 150px; border: solid 1px #aaa; background-color: #fff;
	opacity: .9;
	filter: alpha(opacity=90);
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
}
#toggleBox p { font-weight: bold; margin-top: 10px; } 
.toggleButton{
	border: solid 1px #444;
	background:#888;
	text-align: center;
	line-height: 1.4em;
    margin: 1em auto;
    padding: 0 10px;
	width: 60%;
}	
.toggleButton a {
	font: normal 1em verdana, arial, helvetica, sans-serif;
	font-weight: normal;
    color: #fff;
	}#top {
	position: relative;
	width: 100%;
	height: 140px;
	background-color: #0f1923;
	background-image: url('../images/decss.png');
	background-position: top right;
	background-repeat: no-repeat;
	border-bottom: 30px solid #2c3033;
}
#top img {
	position: absolute;
	bottom: -10px;
	left: 80px;
}	
#header {
	font: 4em Century Gothic, Apple Gothic, sans-serif;
	position: absolute;
	left: 170px;
	bottom: -10px;
	color: #0f67a1;	
}	
#header span {
	color: #0fa167; 
}	
#page { 
	text-align: left; 
	position: relative; 
	background-color: #0f1923;
	width: 780px; 
	min-height: 720px; 
	margin: 0 auto 20px auto;
	padding: 60px 20px 20px 20px;
	background-repeat: no-repeat; 
    background-position: left; 
}
.sectionHeader { display: none; }
.demoBox {
	float: left;
	width: 50%;
	margin-top: 20px;
}
.demoBox a {
	margin: 0 auto;
}
#tooltip {
    font-size: 10px;
    line-height: 14px;
    position: absolute;
    z-index: 3000;
    border: 1px solid #AAA;
    background-color: #e0e0f0;
    width: 150px;
    padding: 1em;
    opacity: 0.85;
}
#tooltip h3, #tooltip div { 
	margin: 0;     
	font-size: 10px;
    line-height: 14px; }

.button{
	background:#FAFAFA repeat-x scroll 0 0;
	font: normal 1em verdana, arial, helvetica, sans-serif;
	font-weight: normal;
	text-align: center;
	line-height: 2.3em;
    margin: 1em auto;
    padding: 0 10px;
    color: #369;
	width: 140px;
}	
.button:hover {
	cursor:pointer;
	color: #4444dd;
}
#subtext { 
	font-size: .7em; 
	position: absolute; 
	top: 0px; 
	right: 0px; 
}
#resume { display: block; width: 200px; height: 175px; clear: both; text-align: center; background: url('../images/resume.png') no-repeat;}
#resume:hover { background-position: -200px 0; }
#resume p { width: 200px; margin: 0; padding: 135px 3px 0 3px; }

#portfolio { display: block; width: 200px; height: 175px; clear: both; text-align: center; background: url('../images/portfolio.png') no-repeat;}
#portfolio:hover { background-position: -200px 0; }
#portfolio p { width: 200px; margin: 0; padding: 135px 3px 0 3px; }

#starbucks { display: block; width: 200px; height: 175px; clear: both; text-align: center; background: url('../images/usa.png') no-repeat;}
#starbucks:hover { background-position: -200px 0; }
#starbucks p { width: 200px; margin: 0; padding: 135px 3px 0 3px; }

#twitter { display: block; width: 200px; height: 175px; clear: both; text-align: center; background: url('../images/twitterx2side.png') no-repeat;}
#twitter:hover { background-position: -200px 0; }
#twitter p { width: 200px; margin: 0; padding: 135px 3px 0 3px; }

#blog { display: block; width: 200px; height: 175px; clear: both; text-align: center; background: url('../images/coffeeCupBlog.png') no-repeat;}
#blog:hover { background-position: -200px 0; }
#blog p { width: 200px; margin: 0; padding: 135px 3px 0 3px; }

/* map styles */
#mapHeader {
	margin-left: 200px;
	font: 2em Century Gothic, Apple Gothic, sans-serif;
	color: #4cb852;	
}	

#map { float: left; width:660px; height:570px; }

#states { width: 95px; float: left; height: 600px; margin-right: 5px; text-align: center; }
#states ul { float: left; width: 45%; list-style: none; margin-left: 0; padding-left: 0; }
#states ul li:before { content: ""; }
#states li { border: solid 1px #4a4; margin: 1px; padding: 1px 1px 1px 10px; }
.stateList { margin-right: 3px; font-size: .85em; cursor: pointer; }