/* CSS Document */

/*
$Id: assets/css/main.css,v 1.1 2009/12/28

Project: Personal Web Portfolio
URL: http://www.itwerx.biz
Copyright (c) 2009 Justin Wellesley-Smith

All Rights Reserved
*/
/* =GENERAL RULES */

* {
	border:none;
	list-style:none;
	text-decoration:none;
	margin:0;
	padding:0;
	font-family:Helvetica, Avant Garde, Arial, Verdana, sans-serif;
}
h1, h2, h3, h4, h5, h6, p {
	font-weight:normal;
	color:#FFFFFF;
}
/* Clear floats */
.clear {
	clear:both;
}
/* Link rules */

a {
	text-decoration:underline;
}
a:hover {
	text-decoration:underline;
}
/* -----------------------------------------------------------------------------*/


body {
	margin:0;
	padding:0;
	background-image:url(../images/bg.png);
	background-repeat:repeat-x;
}
/* -----------------------------------------------------------------------------*/

/* Main Blocks */

#banner {
	margin-left:8px;
	margin-right:8px;
	
}
#left {
	float:left;
	width:300px;
	margin-left:10px;
	margin-top:10px;
}
#right {
	float:right;
	width:580px;
	margin-right:10px;
	margin-left:10px;
	margin-top:24px;
}
#header {
	float:left;
	width:100%;
	height:60px;
	background-image:url(../images/banner_bg.gif);
	background-repeat:repeat-x;

}
#footer {
	font-size: 0.5em;
	text-transform: uppercase;
	letter-spacing: 1px;
	background-color:#FF6600;
	color:#FFFFFF;
	font-weight: 100;
	margin-left:8px;
	margin-right:8px;
	padding:6px;
	margin-top:36px;
	text-align:left;
}
/* -----------------------------------------------------------------------------*/
/* Sub Blocks */
.sub-wrapper {
	width:100%;
	margin-left:auto;
	margin-right:auto;
	display:block;
}
.sub-left {
	float:left;
	width:180px;
	margin-left:8px;
	margin-top:10px;
}
.sub-middle {
	float:left;
	width:225px;
	margin-left:8px;
	margin-top:60px;
	margin-right:8px;
}
.sub-right {
	float:right;
	width:100px;
	margin-right:8px;
	margin-top:40px;
}
/* -----------------------------------------------------------------------------*/
/* Thumbnail block on portfolio page */
.thm-wrapper {
	width:100%;
	margin-left:auto;
	margin-right:auto;
}
.thm-left {
	float:left;
	width:33%;
}
.thm-middle {
	float:left;
	width:34%;
	margin-top:14px;
}
.thm-right {
	float:right;
	width:33%;
	margin-top:14px;
}
/* -----------------------------------------------------------------------------*/

/* Cosmetic Elements */

.title {
	float:right;
	margin:0.6em 0.4em 0.4em 0.4em;
}
.line {
	float:left;
	width:100%;
	border-top:1px #FFFFFF solid;
	height:8px;
}
#mail {
	float:left;
	margin-left:40px;
}
.icon {
	margin-bottom:0.4em;
	}
#man {
	margin-left:60px;
	margin-top:40px;	
}
.valid {
	margin:0.4em 0.4em 0.4em 0.4em;
	padding:0.4em 0.4em 0.4em 0.4em;
	text-align:center;
}
.page_title {
	float:right;
	margin-right:8px;
	margin-bottom:8px;
}
/* -----------------------------------------------------------------------------*/


/* Navigation Elements */
#top_right {
	float:right;
}
.nav {
	text-align:center;
	height: 35px;
}
#nav, #nav ul {
	padding:0;
	margin:0;
	list-style:none;
}
#nav li {
	float:right;
	position:relative;
	margin-right:0px;
	list-style:none;
}
#nav a:link, #nav a:visited {
	width:172px;
	display:block;
	padding: 20px 0 0px 0px;
	font: bold 100% Arial, Helvetica, sans-serif;
	color:#FFFFFF;
	text-decoration:none;
}
#nav a:hover, #nav a:active {
	background-position: 0 -76px;
}
li.home, li.home a:link, li.home a:hover, li.home a:active, li.home a:visited {
	background:url(../images/navsprite_home.png) top left no-repeat;
}
li.about, li.about a:link, li.about a:hover, li.about a:active, li.about a:visited {
	background:url(../images/navsprite_about.png) top left no-repeat;
}
li.portfolio, li.portfolio a:link, li.portfolio a:hover, li.portfolio a:active, li.portfolio a:visited {
	background:url(../images/navsprite_portfolio.png) top left no-repeat;
}
li.empty {
	width:35px;
}

/* -----------------------------------------------------------------------------*/


/* Content Wrapper */

#wrapper {
	background-image:url(../images/wrapper_bg.png);
	background-repeat:repeat-y;
	width:914px;
	margin-left:auto;
	margin-right:auto;
}
.contentbox {
	margin: 0.4em 0.4em 0.4em 0.4em;
}
.contentbox p {
	margin: 0.4em 0.4em 0.4em 0.4em;
}
.contentwrapper {
	vertical-align:top;
	margin-top:40px;
	padding:12px;
}


/* Gallery */
.gallery {
	margin:5px 5px 5px 5px;
}
.gallery ul {
	list-style:none;
}
.gallery ul li {
	list-style:none;
}
.gallery img {
	display:block;
}
/* -----------------------------------------------------------------------------*/


/* Font Blocks */

h1 {
	font-size: 16px;
	line-height: 16px;
	letter-spacing: 1px;
	font-weight: bold;
	margin-bottom:0.2em;
}
h2 {
	font-size: 14px;
	line-height: 14px;

}

p {
	font-size:13px;
	padding-top:6px;
}
li {
	list-style:circle;
	list-style-position:inside;
	font-size:12px;
}
/* -----------------------------------------------------------------------------*/


/* Hacks */

.clearfix:after {
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}
.clearfix {
	display:block;
}
* html .clearfix {
	height:1%;
}
