/*****************************************************
 FILE LOCATION: http://www.nothingness.ca/
 Handles all layout & styling for the Nothingness
 web site.
 
 Site Name: Nothingness.ca
 Author: Derek Lapp, Tim McLennan
 Started: 01/10/07
 For: www.nothingness.ca/
 All rights reserved DEREK LAPP 2006+
*****************************************************/

/*****************************************************
 DEFAULT HTML ELEMENTS
*****************************************************/
html {
	margin: 0;
	padding: 0;
}
body {
	background: #333 url(images/htile.jpg) repeat-x;
	background-position: 0px 0px;
	margin: 0;
	padding: 0;
	font: 62.5% Arial, Verdana, Tahoma, Sans-Serif;
	text-align: left;
	color: #616161;
}
h1 {
	margin: 0;
	padding: 0;
	font-size: 1.6em;
	color: #ED671F;
}
h2 {
	margin: 0.5em 0 0 0;
	padding: 0;
	font-size: 1.1em;
}
h3 {
	margin: 0 0 1em 0;
	padding: 0;
	font-size: 0.9em;
	color: #999;
}
h4 {
	margin: 0;
	padding: 0;
	font-size: 1em;
	color: #787878;
}
pre {
	font-size: 1.5em;
}
p, .clear li {
	font-size: 1.1em;
}
a:link, a:visited, a:active {
	text-decoration: none;
	color: #ED671F;
}
a:hover {
	text-decoration: underline;
	color: #ED671F;
}
hr {
	height: 1px;
	background: transparent url(images/logo.gif) repeat-x;
	background-position: 0px -151px;
	border: none;
	margin: 15px 0;
	color: #9C8D68;
}
img, td {
	vertical-align: top;
	border: none;
}
form, fieldset, legend {
	border: none;
	margin: 0;
	padding: 0;
}
legend {
	font-size: 1.16em;
	font-weight: bold;
	color: #ED671F;
}
label {
	display: block;
	margin: 5px 0 1px 0;
	font-size: 1.1em;
}

/*****************************************************
 INTERFACE DIVS
*****************************************************/
.wrapStar { /* centers the web site */
	width: 740px;
	margin: 0 auto;
	padding: 0;
}
#header {
	width: 740px;
	height: 150px;
	background: transparent url(images/logo.gif) no-repeat center left;
}
#menu {
	float: left;
	width: 254px;
	height: 150px;
	padding-left: 486px;
}
#white{
	float: left;
	width: 100%;
	/*background: #FFF url(images/glare.gif) repeat-x;*/
	background: #FFF url(images/htile.jpg) repeat-x;
	background-position: 0px -199px;
}
.floater {
	float: left;
	width: 740px;
}
.focus {
	float: right;
	width: 432px;
	padding: 1em 3em 0 0;
}
.related {
	float: right;
	width: 254px;
	padding: 1em 0 0 2.4em;
}
#shadow {
	float: left;
	background: transparent url(images/shadow.jpg) no-repeat top right;
	padding-top: 2em;
}
#footer {
	float: left;
	width: 100%;
	height: 49px;
	background: #333 url(images/htile.jpg) repeat-x;
	background-position: 0px -150px;
	color: #FFF;
}
.error {
	margin: 10px;
	padding: 10px;
	color: #FFFFFF;
	font-weight: bold;
	background-color: #444444;
	border: 2px solid #888888;
}

/*****************************************************
 TYPE CLASSES
*****************************************************/
#menu ul {
	display: block;
	float: left;
	list-style-type: none;
	height: 15px;
	margin: 71px 0 0 0;
	padding: 0;
}
#menu ul li {
	float: left;
	margin: 0;
	padding: 0;
}
#menu a {
	display: block;
	height: 15px;
	text-indent: -9999px;
	overflow: hidden;
}
a.home {
	background: transparent url(images/icons.gif) no-repeat;
	background-position: 0px 0px;
	width: 21px;
}
a.home:hover, #home {
	background: transparent url(images/icons.gif) no-repeat;
	background-position: -21px 0px;
}
a.portfolio {
	background: transparent url(images/icons.gif) no-repeat;
	width: 24px;
	background-position: -42px 0px;
}
a.portfolio:hover, #portfolio {
	background: transparent url(images/icons.gif) no-repeat;
	background-position: -66px 0px;
}
a.resume {
	background: transparent url(images/icons.gif) no-repeat;
	width: 22px;
	background-position: 0px -13px;
}
a.resume:hover, #resume {
	background: transparent url(images/icons.gif) no-repeat;
	background-position: -22px -13px;
}
a.contact {
	background: transparent url(images/icons.gif) no-repeat;
	width: 20px;
	background-position: -44px -13px;
}
a.contact:hover, #contact {
	background: transparent url(images/icons.gif) no-repeat;
	background-position: -64px -13px;
}
a.articles {
	width: 28px;
	background: transparent url(images/articles_off.gif) no-repeat;
}
a.articles:hover, #articles {
	background: transparent url(images/articles_over.gif) no-repeat;
}
.clear {
	list-style-type: none;
	margin: 0 0 1em 0;
	padding: 0
}
.clear li ul {
	list-style-type: square;
	margin-bottom: 1em;
}
.clear li ul li {
	font-size: 0.92em;
}
#related strong {
	color: #ED671F;
}
.caps {
	text-transform: uppercase;
}
.related .clear a {
	color: #616161;
}
.phone, .email, .doc, .pdf, .lock {
	background: transparent url(images/icons.gif) no-repeat;
	margin: 0px;
	padding: 0 0 0 20px;
	overflow: hidden;
	background-position: -90px -28px;
}
.lock {
	background-position: -90px -58px;
}
.email {
	background-position: -90px -43px;
}
.doc {
	background-position: -90px 0px;
}
.pdf {
	background-position: -90px -14px;
}
.newsFooter {
	text-align: right;
}
.attention {
	color: #ED671F;
}
.codeTop, .code {
	width: 100%;
	margin-bottom: 5px;
	padding: 5px;
	border: 1px solid #F0F0F0;
	background-color: #E3E3E3;
	font: 150% Courier New, Courier, Sans-Serif;
	color: #000000;
}
.codeTop {
	margin-top: 5px;
	margin-bottom: 0px;
	padding: 5px;
	background-color: #080808;
	color: #FEFEFE;
	font-weight: bold;
}
/*****************************************************
 HEADER BACKGROUND CLASSES
*****************************************************/
.homeType, .portType, .resumeType, .contactType {
	background: transparent url(images/type.gif) no-repeat;
	background-position: 0px 0px;
}
.portType {
	background-position: 0px -108px;
}
.resumeType {
	background-position: 0px -216px;
}
.contactType {
	background-position: 0px -324px;
}

/*****************************************************
 FORM / INPUT CLASSES
*****************************************************/
.textarea {
	border: 1px solid #CCC;
	margin-bottom: 5px;
	padding: 3px;
	height: 112px;
	width: 330px;
	overflow: auto;
	background-color: #FDFDFD;
}
.req {
	color: #ED671F;
	font-weight: bold;
}
.textfield {
	width: 200px;
	border: 1px solid #CCC;
	padding: 2px;
	margin-right: 20px;
	background-color: #FDFDFD;
}
.fields_left {
	width: 100px;
	padding-bottom: 5px;
}
.fields_right {
	padding-bottom: 5px;
}
.button {
	border: 1px solid #CCC;
	background-color: #FDFDFD;
	color: #616161;
}