/*******************************************************************************************************************************
		$$$$$$$\            $$\       $$\ $$\                  $$$$$$\  $$\                               
		$$  __$$\           $$ |      $$ |\__|                $$  __$$\ $$ |                              
		$$ |  $$ |$$\   $$\ $$$$$$$\  $$ |$$\  $$$$$$$\       $$ /  \__|$$ | $$$$$$\   $$$$$$$\  $$$$$$$\ 
		$$$$$$$  |$$ |  $$ |$$  __$$\ $$ |$$ |$$  _____|      $$ |      $$ | \____$$\ $$  _____|$$  _____|
		$$  ____/ $$ |  $$ |$$ |  $$ |$$ |$$ |$$ /            $$ |      $$ | $$$$$$$ |\$$$$$$\  \$$$$$$\  
		$$ |      $$ |  $$ |$$ |  $$ |$$ |$$ |$$ |            $$ |  $$\ $$ |$$  __$$ | \____$$\  \____$$\ 
		$$ |      \$$$$$$  |$$$$$$$  |$$ |$$ |\$$$$$$$\       \$$$$$$  |$$ |\$$$$$$$ |$$$$$$$  |$$$$$$$  |
		\__|       \______/ \_______/ \__|\__| \_______|       \______/ \__| \_______|\_______/ \_______/ 
******************************************************************************************************************************/	


/* Reset
---------------------------------------------*/

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-collapse:collapse;border-spacing:0 }

/* Standard elements
---------------------------------------------*/

body {
	font:100%/1 "Courier new", sans-serif, Arial;
	color: #646567;
	padding-bottom: 70px;
}

a {
	color: #646567;
}

a,
a:link {
	border-bottom: 1px solid;
	text-decoration: none;
}

a:hover,
a:focus {
	border-bottom: 0px;
	color: #000;
}

strong {
	font-weight: bold;
}

h2 {
	font-size: 24px;
	font-weight: 100;
}

h3 {
	font-size: 18px;
	font-weight: 100;
}

p {
	font-size: .75em;
	line-height: 1.5;
}

/* Specific elements
---------------------------------------------*/

#item-holder,
#content {
	position: relative;
	left: 70px;
}

#item-holder {
	padding-bottom: 70px;
	width: 90%;
}

#menu {
	position: relative;
	float: right;
	width: 180px;
	padding-left: 70px;
	padding-right: 30px;
}

#menu a:hover {
	-moz-opacity:.60; filter:alpha(opacity=60); opacity:.60;
}


#header {
	padding: 70px 0 70px 70px;
}

#header a {
	float: left;
	border: none;
}

#header h1 {
	background: url(../images/publicclass-logo.png);
	width: 605px;
	height: 95px;
}
	
#header h1 span {
	display: none;
	height: 95px;
}
	
#menu li {
	float: right;
	margin: 1px 1px 1px 1px; 
	height: 21px;
	overflow: hidden;
}

#menu ul {
	font-size: 20px;
	list-style: none;
}

#menu a {
	height: 21px;
	padding-left: 4px;
	padding-right: 4px;
}

#show-more {
	opacity: 0;
	margin-left: 70px;	
	background-color: #C7C8CB;
	height: 25px;
	cursor: pointer;
}

#show-more p {
	text-align: center;
	padding-top: 6px;
}

#preloader {
	width: 150px;
	height: 150px;
	position: absolute;
	z-index: 2000;
}

#noscript-warning {
	background-color: rgb(174, 0, 0);
	color: white;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 120%;
	font-weight: bold;
	left: 0px;
	padding: 5px 0px 5px 0px;
	position: fixed;
	text-align: center;
	top: 0px;
	width: 100%;
	z-index: 101;
}

/* Grid classes 
---------------------------------------------*/

div.grid-container {
	background-color: #f0f0f0;
	position: absolute;
	overflow: hidden;
	opacity: 0;
	word-wrap: break-word;
}

div.grid-content {
	position: absolute;
	bottom: 0px;
}

div.grid-content span {
	color: #cfd0d2;
}


/* About classes
---------------------------------------------*/

p.about {
	float: left;
	font-size: 18px;
	color: #9c9d9f;
}

p.about-sign {
	float: left;
	font-size: 35px;
	margin-top: -10px;
	margin-bottom: 5px;
	height: 30px;
}

p.tool {
	background: url(../images/toolIcon.png);
	background-repeat: no-repeat;
	margin-top: 16px;
	margin-left: 10px;
	margin-bottom: -6px;
	width: 14px;
	height: 6px;
} 

p.tool span {
	display: none;
}

p.quotemark {
	font-family: Georgia;
	font-size: 85px;
	margin-top: -25px;
	margin-bottom: 5px;
}

/* Contact classes 
---------------------------------------------*/

div.vcard {
	position: absolute;
	font-size: .75em;
	line-height: 1.5em;
	padding: 10px 1px 0px 10px;
	bottom: 10px;
}

a.email {
	font-size: .88em;
}

/* Project classes 
---------------------------------------------*/

div.projectGridBox {
	cursor: pointer;
}

div.project {
	background-color: #cfd0d2;
}

div.project-hover {
	background-color: #646567;
	color: #cfd0d2;
}

.project-hover p {
	color: #cfd0d2;
}

div.project-description h2,
div.project-description p,
div.project-description ul {
	padding: 10px;
}

div.project-description ul {
	font-size: .73em;
	position: absolute;
	bottom: 0px;
	color: #9c9d9f;
	list-style: none;
	line-height: 1.3em;
}

div.project-content {
	position: absolute;
	bottom: 0px;
}

div.project-content h2,
div.project-content h3,
div.project-content p {
	padding: 0 10px 10px 10px;
}

div.text-box p,
div.text-box h2,
div.text-box h3,
div.text-box ul {
	padding: 10px;
}

/* Thought classes 
---------------------------------------------*/

div.thoughts a {
	text-decoration: none;
}

div.hover {
	background-color: #646567;
}

div.hover p {
	color: #f9c7d0;
}

/* Clear
---------------------------------------------*/

.clear {
	clear: both;
	float: none;
}

/* Twitter classes 
---------------------------------------------*/

p.box {
	padding: 10px;
}


p.tweets {
	font-size: .67em;
	line-height: 1.1em;
	padding-bottom: 14px;
}

p.tweets a {
	border-bottom: 0px;
	text-decoration: underline;
}

/* Home classes 
---------------------------------------------*/

div.home {
	background-color: #fff; 
}

div.home p {
	font-size: 1.3em;
	line-height: 1.04em;
	font-weight: 500;
}

div.home span {
	color: #c4c5c7;
}

/* Color setup 
---------------------------------------------*/

div.work,
a.work { background-color: #cfd0d2; }

div.about,
a.about { background-color: #9ae3ef; }

div.contact,
a.contact { background-color: #a8efe1; }

div.tweets,
a.tweets { background-color: #f7f6a1; }

div.photos,
a.photos { background-color: #e4ceed; }

div.thoughts,
a.thoughts { 
	background-color: #f9c7d0; 
}

/* SEO version of displaying raw data
---------------------------------------------*/

.raw {
	width: 605px;
	list-style: none;
}

.raw li {
	margin-top: 20px;
	margin-bottom: 20px;
}

.raw ul {
	font-size: .7em;
	list-style: none;
}

.raw ul li {
	margin-top: 5px;
	margin-bottom: 0px;
}

.raw span img {
	display: none;
}

.raw .vcard {
	position: relative;
}