/* 
Content First Model
CSS Document
For http://design.leerjohnson.com
Created by Lee R Johnson
http://design.leerjohnson.com

ToC

	1. defaults
	2. structure
	3. links and navigation
	4. fonts
	5. images
	6. tables
	7. forms
	
Notes
Colors:
Light = #e2e4e8;
Dark = #1c2c5c;
Bright = #b00b0b;

*/

/* --------- 1. defaults  --------- */

@import url(http://design.leerjohnson.com/reset/);

body{width:100%;
	min-width:900px;
	height:auto;
	background:#e2e4e8 url(../images/large-vertical-gradiant.64x.gif) repeat-x center 128px;
	}

hr{display:none;}
img{border:0;
	text-decoration:none;
	max-width:100%;}

h1, h2 {
	border-bottom:solid .01em #b00b0b;
	line-height:120%;
	margin:.5em;
	}

h1, h2, h3, h4, h5, h6 {
	margin:.2em;
}
p {
	margin:.5em;
	}
ul, ol{
	margin:.5em;
	}
li{
	line-height:120%;
	padding-bottom:.2em;
	list-style:middle;
	vertical-align:top;
	}
/* Generic Classes */

.header {
	font-weight:bold;
	vertical-align:baseline;
	}
.list {
	}
.tech {
	background:#fff;
	}
.header .given-name{
}	
.header .additional-name{
	}
.header .family-name{
	}
.feature{
padding-bottom:.5em;
}	
.icon{
	vertical-align:-.1em;
}
		
/*  --------- 2. structure  --------- */


#PageContainer {
	background:url(../images/compass-rose-mono-gray.gif) -256px 400px no-repeat ;
		}
		
#SiteHeader {
	background:#000;
	padding:.0em;
		}

#PageTitle{
	color:#e2e4e8;
	background:#333 url(../images/volume_32.gif) 99% center no-repeat;
	line-height:1.5em;
	padding-right:2em;;
	border-top:solid .1em #222;
	border-bottom:solid .1em #666;
	text-align:right;
	margin:0;	}


#SiteTitle{
	color:#1c2c5c;
	width:100%;
	height:128px;
	margin:0;
	border:0;
	}
#SiteHeader .org,
#SiteHeader .fn,
#SiteHeader .n{
	text-indent:-9999px;
	background:#1c2c5c url(../images/Lee-R-Johnson-logo.jpg) no-repeat;
	}		
#SiteHeader .logo {
	display:none;
	}

#PageContent {
	padding:0;
	text-align:center;
	margin:auto;
	width:900px;
	height:100%;
	}
	
/* Site Introductions */

#Introduction{
	background:transparent;
	width:512px;
	padding:8px;
	border-bottom:inset 0 #1c2c5c;
	float:left;
	margin:1em 16px;
	text-align:left;
	}
#Introduction h1.header{
	background:transparent url(../images/map-pins.512x228.jpg) no-repeat;
	padding-top:192px;
	border:0;
	text-align:center;
	text-transform:uppercase;
	font-weight:bold;
	}
#Introduction .header em{
	display:block;
	color:#1c2c5c;
	font-weight:normal;
	}
#Introduction li{
	margin-left:3em;
	padding-left:4px;
	line-height:125%;
	list-style:url(../images/electricity_16.gif) inside;
	vertical-align:super;
	font-weight:bold;
	}
/* End Introduction */

/* Secondary Content */
.secondary{
	width:256px;
	background:none;
	padding:8px;
	margin:1em 0;
	border-left:solid .01em #1c2c5c;
	float:left;
	text-align:left;
	}
.secondary:after{
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}
.secondary .list{
	font-size:80%;
	}
.secondary li.hover{
	background:#fff;
}
#Work .site{
	border-bottom:solid .1em #ccc;
}
#Work .site img.screenshot{
	width:224px;
	height:64px;
}
#SiteFooter{
border-top:solid .1em #999;
border-bottom:solid .1em #bbb;
background:#b00b0b;
margin:1em 0;
padding:2em;
clear:both;
color:#e2e4e8;
}
#ProfilePhoto{
	position:absolute;
	top:0px;
	left:512px;
	border:solid 4px #eee;
	width:92px;
	height:92px;
	margin:16px;
	}
#SiteContact {
	position:absolute;
	top:0px;
	left:640px;
	color:#e2e4e8;
	margin:16px;
	padding:8px;
	height:92px;
	font-size:28px;
	border-left:solid .01em #e2e4e8;
	white-space:nowrap;
	overflow:hidden;
}
#SiteStatements{}
#SiteStatements .header {
	font-size:x-small;
	color:#ccc;
}
#SiteStatements .list {
	border-top:.1em solid #fff;}
#SiteStatements .list li{
	padding:.2em;
	border-bottom:.1em solid #fff;
}
#SiteStatements span{}



/* ---------- 3. links and navigation ---------- */

a {color:#b00b0b; font-weight:bold;}
a:link{}
a:visited{}
a:hover {}
a:focus{}
a:active{}


.header a {
	text-decoration:none;
	}
#Work a.view{
	background:#fff;
	text-align:center;
	display:block;
	text-decoration:none;
	padding:8px;
	border:solid 1px #999;
	border-bottom:solid 3px #999;
	}
#Work a.view img{
	border:solid 1px #999;
}
#SiteNavigation {
	
		}
#SiteNavigation:after{
		
		}		
#SiteNavigation .header{
	
}

#SiteNavigation .list {
		}

#SiteNavigation li {
		}

#SiteNavigation a {
		}
#SiteNavigation a:link {}
#SiteNavigation a:visited {}
#SiteNavigation a:hover {}
#SiteNavigation a:focus {}
#SiteNavigation a:active {}

#SiteFooter a{
	color:#e2e4e8;
	text-decoration: none;
}

/* ---------- 4. fonts ---------- */

html {
		font-size: 100%;
		}

body {
	font-family: Arial, Helvetica, sans-serif;
	color:#1c2c5c;
}

h1, h2, h3, h4, h5, h6 {
	font-family:"Times New Roman", Times, serif;
	font-weight: normal;
	color:#b00b0b;
}

h1 {
	font-size: 218%;
}

h2 {
	font-size: 164%;
}

h3 {
	font-size: 145%;
}

h4 {
	font-size: 118%;
}

address {
	font-family:"Times New Roman", Times, serif;
	}

p {
		}

ul {
		}

blockquote {
		}

/* ---------- 5. images ---------- */

a img {
		border: 0;
		}
		
/* ---------- 6. tables ---------- */

table {
		}
		
caption {
		}
		
tr {
		}

th, td {
		}
		
th {
		}
		
td {
		}

/* ---------- 7. forms ---------- */	
		
form {
		}