@charset "UTF-8";
/* CSS Document */

<!--
body {
	background-image:url(imgs/bgPattern_02.gif);
	background-repeat:repeat;
	margin: 0;
	padding: 0;
	text-align: center;
	color: #FFFFFF;
	font-size:12px;
	font:sans-serif;

}
#container {
	width: 1024px; 
	background:#414141;
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
	
}

* html body #container {
\width: 1024px; 
w\idth: 1024px;
}

#header {
	padding: 0;
	height:140px;  
}

#mainContent { 
	margin:0 50px 75px 50px;/* remember that padding is the space inside the div box and margin is the space outside the div box */
	font-size:11px;
	min-height:500px;
}


h1, h1 strong {
font-size:26px;
font-weight:100;
margin-bottom:30px;
}

h1 strong {
color:#FF3500;
}

h2 {
font-size:21px;
color:#FF3500;
font-weight:normal;
margin-bottom:5px;
}

h3 {
font-size:16px;
color:#FF3500;
font-weight:bold;
margin: 10px 0 0 0;
}

h4 {
	margin-top:2px;
	font-size:11px;
	font-weight:normal;
}

p{
font-family:Arial, Helvetica, sans-serif;
line-height:18px;
}

.para-split {
float:left;
clear:both;
margin-bottom:10px;
}

.para-left{
float:left;
width:400px;
clear:none;
padding-right:40px;
}


.para-left p, .para-right p{
	text-align:justify;
	margin:0 0 10px 0;
}

.para-index {
	height:150px;
}

.para-right {
	width:420px;
	float:right;
	clear:none;
}
/* BECAUSE INTERNET EXPLORER IS THE DEVIL */

* html body #container #mainContent .para-split .para-right {
	float:left;
	clear:none;
	display: block;
	position:relative;
	left:70px;
}

.box {
	position:relative;
	top:-15px;
	right:15px;
}


.box p {
	background-color:#3b3b3b;
	background-image:url('imgs/bg_line.jpg');
	padding:3px 15px 5px 15px;
	width:390px;
	margin-bottom:5px;
	
}

.box h2 {
	padding:15px 15px 10px 15px;
	width:390px;

}
.box h3 {
	background-color:#3b3b3b;
	background-image:url(imgs/bg_line.jpg);
	margin:0px;
	padding:5px 15px 0px 15px;
	width: 390px;
	font-family: Arial,Helvetica,sans-serif;
	font-weight:normal;
	font-size:14px;
}
.box .index-thumbs {background-color: #3b3b3b; background-image:url('imgs/bg_line.jpg');padding:26px 0px 27px 10px; width:410px; height: 260px; margin-bottom: 5px;}
.box div.card {float:left; width:132px;margin-right: 2px; margin-top:2px;}
.box div.card div {border: 3px double #666666;}
.box div.card img{margin:1px; width:124px; height: 73px;}

.end-link {font-size: 14px; text-decoration:none; margin-top:3px;}

#para-who strong {
	color:#beb9b6;
	font-family:Arial, Helvetica, sans-serif;
}

.para-services {
	width:308px;
	float:left;
	clear:none;
	margin-bottom:30px;
}

.para-services p {
	margin:0;
}

.para-project {
	height:425px;
	padding-right:16px;
}

.para-project h3{
	font-weight:bold;
}

.para-project h4 {
	font-size:11px;
	font-weight:lighter;
}

#para-contact-info{
	width:300px;
	float:left;
	clear:none;
	padding-right:40px;
}

para-contact-info p a {
	color:white;
}

#contact-split {
float:none;
width:924px;
}

* html body #container #mainContent #contact-split {
float:left;
clear:both;
display:block;
margin-bottom:10px;
}

#para-contact-form{
	border:#333333 2px solid;
	background-color:#434343;
	padding:10px 10px 10px 15px;
	position:relative;
	top:-10px;
	width:485px;
	float:right;
	clear:none;
}

* html body #container #mainContent .para-split #para-contact-form{
	border:#333333 2px solid;
	background-color:#434343;
	padding:10px 10px 10px 15px;
	position:relative;
	top:-10px;
	width:470px;
}

#para-buffer {
	height:150px;
}

/* CONTACT FORM STUFF */

.contact-form-single {
	width:250px;
	border:1px solid;
	border-color:#999999;
	padding:2px 2px 2px 3px;
	font:Arial, Helvetica, sans-serif;
	font-size:11px;
	color:#666666;
}

.contact-form-multiple {
	width:250px;
	border:1px solid;
	border-color:#999999;
	padding:2px 2px 2px 3px;
	font:Arial, Helvetica, sans-serif;
	font-size:11px;
	color:#666666;
}

.contact-label {
	font-family:Arial, Helvetica, sans-serif;
}

.contact-header {
	color:white;
}

/* THE LINK STYLES BE HERE */

a {
	color:#FF3500;
	outline: none;
}

#footer a{
	font-family:Arial, Helvetica, sans-serif;
	text-transform:uppercase;
	font-size:10px;
	color:#999999;
	text-decoration:none;
}

/* FOOTER HERE */


#footer { 
	padding:10px 10px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	height:59px;
	margin-top:25px;
	background-color:#333333;
	clear:both;
} 
#foot-links {
	float:right;
	clear:none;
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	padding: 25px; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
	font-size:11px;
	color:#666666;
	
}

#foot-links a:hover {
	color:#ff3500;
}

#foot-rights {
	float:left;
	clear:none;
	width:250px;
	margin: 0 0 0 20px; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	padding: 25px; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
	font-size:10px;
	font-family:Arial, Helvetica, sans-serif;
	text-transform:uppercase;
	color:#999999;
}

/* HEADER STYLES */
#logo {
	float:left;
	clear:none;
	margin-top:58px;
	margin-left:38px;
}

* html body #container #header #logo {
	float:left;
	clear:none;
	margin-top:58px;
	margin-left:18px;
}


#logo a img {
	border:none;
}


#nav a img {
	border:none;
}

#nav {
	float:right;
	clear:none;
	margin-top:56px;
	margin-right:30px;
	}
	
#nav img, #nav a img{
	padding:0;
	margin:0;
	}
-->


/* Project Section: John */
.projects h1{background-color:#333333;background-image:url('../imgs/bg_h1.jpg'); background-position:top right; background-repeat:no-repeat; color:#FF3300; font-size:18px; float:left; height:26px; margin:5px 0px 5px 0px; padding: 8px 0px 0px 8px; width: 912px;}
.projects div.row {float:left;}
div.card {float:left; width:150px;margin-right: 4px; margin-top:5px;}
div.card div {border: 3px double #666666;}
div.card img{margin:2px; width:140px; height: 82px; #margin-bottom:-1px;}
div.card p{color:#CCCCCC;line-height: 12px; margin-top:4px; border-left: 1px solid #CCCCCC; padding:7px;}
div.card a{color:#CCCCCC; text-decoration:none;}
div.card a:hover{color:#FF3300; text-decoration:underline;}