/* -------------------------------
   JohnBossley.com style sheet
   Author: John Bossley
   Version: 2.0 2008 
   Copyright: John Bossley, 2008
   ------------------------------ */
   
/* SECTION: Reset Elements ------------------------------------------------------------------*/

	body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin: 0; padding: 0; }
	fieldset,img { border: 0; } 
	address,caption,cite,code,dfn,em,strong,th,var { font-style: normal; font-weight: normal; } 
	ol,ul { list-style: none; } 
	h1,h2,h3,h4,h5,h6 { font-size: 100%; font-weight: normal; } 
			
/* SECTION: General Elements -----------------------------------------------------------------*/

	body {
		font-family: Georgia, "Times New Roman", Times, serif;
		font-size: 1em;
		color: #231C0F;
		margin: 0 auto; padding: 0;
		background: url(../img/bg-top.jpg) top #000 no-repeat;
		}
	
	p {}
	
	a img  { border: none; }
	
	a { color: #e44141; text-decoration: none; }
	
	#theMightyContainer { float: left; width: 100%; background: url(../img/bg-bottom.jpg) bottom no-repeat; }

/* SECTION: Header Elements ------------------------------------------------------------------*/

	#header { 
		margin: 0 0 10px 0; padding: 0;
		height: 163px;
		background: url(../img/header-bg.jpg) bottom #FFF7EC repeat-x;
		}
		
	#header ul {
		width: 720px; height: 22px;
		margin: 0 auto; padding: 0;
		text-align: right; vertical-align: middle;
		}
		
	#header li { 
		font-size: .7em;
		text-transform: uppercase;
		display: inline;
		margin-left: 15px;
		}
	
	#header li a { color: #321C0F; }
	#header li a:hover { color: #E44141; text-decoration: underline; }
		
	#header h1 {
		width: 720px;
		margin: 0 auto;
		}
		
	#header h1 img { float: left; margin: 19px 30px 0 0; }
	
	.tagline { 
		font-style: italic; 
		text-align: right; 
		line-height: 140%; 
		float: right; 
		margin: -100px 0 0 0; padding: 0; 
		width: 450px; 
		}

/* SECTION: Navigation Elements --------------------------------------------------------------*/

	#subNav {
		margin: 0 auto;
		width: 720px;
		}
		
	#subNav li {
		display: inline;
		margin: 0 24px 0 0;
		}
	
	#subNav li a { color: #E44141; }
	#subNav li a:hover, #subNav .active { color: #FFF7EC; padding-bottom: 10px; background: url(../img/subnav-active.jpg) no-repeat 0 20px; }

/* SECTION: Content Area Elements ------------------------------------------------------------*/

	#content {
		width: 720px;
		margin: 0 auto;
		}
	
	dl { font-size: .8em; margin-top: 10px; }
		dl a:hover { text-decoration: underline; }
	dt { font-weight: bold; color: #A5C4CE; margin-right: 3px; float: left; clear: left; }
	dd { color: #FFF7EC; }
	
		dl.webStatus { width: 240px; margin-right: 30px; }
		dl.webScope { position: relative; float: right; margin: -32px 0 0 0; width: 450px; }
		
		dl.printScope { width: 700px; }
		
		dl.identityStatus, dl.identityScope { width: 234px; height: 80px; }
	
	.webProjectContainer, .printProjectContainer { margin: 10px 0 0 0; }
	.identityProjectContainer { width: 234px; height: 21em; float: left; margin: 0 9px 15px 0; }
		.identityRight { margin-right: 0; }
	
		.webProjectContainer h2, .identityProjectContainer h2, .printProjectContainer h2  {
			font-size: 1.1em;
			font-weight: normal;
			margin: 40px 0 10px -1px; padding: 3px 6px 3px 6px;
			width: 228px; height: 21px;
			background: url(../img/project-title-bg.jpg) no-repeat;
			}
			
			.identityProjectContainer h2 { 
				width: 220px; background: url(../img/logo-title-bg.jpg) no-repeat; }
			
		.webProjectContainer h2 a, .identityProjectContainer h2 a, .printProjectContainer h2 a {
			color: #231C0F;
			display: block;
			}
			
		.webProjectContainer h2 a:hover, .identityProjectContainer h2 a:hover, .printProjectContainer h2 a:hover {
			color: #E44141;
			}
			
		.webProjectContainer div, .printProjectContainer div {
			background: url(../img/web-sample-bg.jpg) no-repeat;
			width: 720px; height: 190px;
			}
		
		.identityProjectContainer div {
			background: url(../img/logo-sample-bg.jpg) no-repeat; 
			width: 234px; height: 193px; 
			}
		
		.webProjectContainer img, .identityProjectContainer img, .printProjectContainer img  { margin: 9px 0 0 9px; border: 3px solid #fff; }

		
		
/* SECTION: Footer Elements ------------------------------------------------------------------*/

	#footer { 
		margin: 90px 0 0 0; padding: 0;
		height: 330px; width: 100%;
		float: left;
		background: url(../img/footer-bg.jpg) bottom #FFF7EC repeat-x;
		}
	
	#footerContent { margin: 0 auto; width: 720px; }
		
	#about {
		float: left; clear: left;
		width: 450px; height: 17.3em;
		padding: 0 30px 0 0;
		}
	
	#contact, #message { float: left; width: 240px; height: 17.3em; }
	
	#about h3, #contact h3, #message h3 {
		font-size: 1.1em;
		margin: 25px 0 10px 0;
		}
	
	#about p, #contact p, #message p{
		font-size: .75em;
		line-height: 145%;
		padding: 5px 0 5px 0;
		}
	
	#about span { font-size: .75em; padding: 3px 0 0 0; float: left; margin-top: 5px; }
	#about span img { padding: 0 5px 0 0; float: left; }
	
	#about a:hover, #contact a:hover { text-decoration: underline; }

	.copyright { font-size: .7em; float: left; margin: 30px 0 0 0; width: 480px; }

	#footer ul { float: right; margin: 30px 0 0 0; width: 240px; }
		
	#footer li { 
		font-size: .7em;
		text-transform: uppercase;
		display: inline;
		margin-left: 15px;
		}
	
	#footer li a { color: #321C0F; }
	#footer li a:hover { color: #E44141; text-decoration: underline; }

	fieldset { margin: 10px 0 0 0; }
	
	label { 
		font-size: .75em; 
		text-align: right; 
		float: left; 
		display: block; 
		width: 40px; 
		margin: 5px 0 5px 0; padding: 3px 3px 0 0;  
		}
		
	input { 
		width: 183px; 
		border: none; 
		background: url(../img/input-bg.jpg) no-repeat;
		margin: 5px 0 5px 0; padding: 2px;  
		}
		
	textarea { 
		width: 183px; height: 50px;
		border: none; 
		background: url(../img/input-bg.jpg) repeat-y; margin: 5px 0 5px 0; 
		padding: 2px;
		}
	
	.submitBtn { width: 57px; height: 24px; float: right; margin: 0 8px 0 0; padding: 0; }

	.error { font-size: .6em; color: #E44141; width: 240px; position: relative; float: left; margin: -8px 0 0 -35px;}