/********************************************************************************
* 
* © 2007 Ecliptic Technologies, Inc. - All Rights Reserved
* Unauthorized use or reproduction of this product is strictly prohibited by law.
*
* Name: Style CSS
* Description: CSS file for the entire Crane Johnson Lumber website
*
*********************************************************************************/


/* Body
--------------------------------------------------------------------------------*/

*
	{
	margin:0px;
	padding:0px;
	}

html, body 
	{
	margin:5px 0px;
	padding:0px;
	background-color:#4c994c;
	font:10px Arial, Helvetica, sans-serif;
	}
	
h1
	{
	margin:0px 0px 0.5em 0px;
	padding:0px;
	font:bold 2.5em "Times New Roman", Times, serif;
	color:#4c994c;
	}
	
h2
	{
	margin:0px 0px 1em 0px;
	padding:0px;
	font:bold 1.8em "Times New Roman", Times, serif;
	color:#4c994c;
	}
	
h3
	{
	margin:0px 0px 1.2em 0px;
	padding:0px;
	font:bold 1.6em "Times New Roman", Times, serif;
	color:#4c994c;
	}
	
h4
	{
	margin:0px 0px 1.4em 0px;
	padding:0px;
	font:bold 1.4em "Times New Roman", Times, serif;
	color:#4c994c;
	}
	
h5
	{
	margin:0px 0px 1.4em 0px;
	padding:0px;
	font:bold 1.2em "Times New Roman", Times, serif;
	color:#4c994c;
	}
	
h6
	{
	margin:0px 0px 1.4em 0px;
	padding:0px;
	font:bold 1em "Times New Roman", Times, serif;
	color:#4c994c;
	}
	
hr
	{
	display:none;
	}
	
	
/* Links
--------------------------------------------------------------------------------*/

a:link, a:visited
	{
	margin:0px;
	padding:0px;
	font:Arial, Helvetica, sans-serif;
	text-decoration:none;
	line-height:1.4em;
	color:#0053a0;
	border-bottom:1px dotted #0053a0;
	}

a:hover 
	{
	color:#4c994c;
	border-bottom:1px solid #4c994c;
	}
	
a.active
	{
	color:#4c994c;
	border-bottom:1px solid #4c994c;
	}
	

/* Container
--------------------------------------------------------------------------------*/

#container 
	{
	width:798px;
	margin:0px auto;
	padding:0px;
	background:transparent;
	}

/*star hack to correct discrepencies between IE7 and older versions */

* html #container 
	{
	position:absolute;
	left:50%;
	width:798px;
	margin:0px 0px 0px -399px;
	padding:0px;
	background:transparent;
	}


/* Header
--------------------------------------------------------------------------------*/

#header 
	{
	float:left;
	width:798px;
	height:123px;
	margin:0px;
	padding:0px;
	background:url(../images/cjl_headerbg01.gif) no-repeat;
	}

#anniversary
	{
	width:140px;
	margin:55px 0px 0px 8px;
	font:bold italic 1.2em Arial, Helvetica, sans-serif;
	text-transform:uppercase;
	text-align:center;
	color:#ffffff;
	}

#header img
	{
	float:right;
	margin:43px 26px 0px 0px;
	padding:0px;
	}


/* Navbar
--------------------------------------------------------------------------------*/
	
#topnav
	{
	float:left;
	width:798px;
	height:35px;
	margin:0px;
	padding:0px;
	background:url(../images/cjl_navbarbg01.gif) no-repeat;
	}
	
#topnavcontainer
	{
	float:left;
	width:780px;
	margin:-10px 0px 0px 9px;
	padding:0px;
	border-bottom:1px solid #144898;
	z-index:1;
	}
	
/* star html hack to correct discrepencies between IE7 and older verions */

* html #topnavcontainer
	{
	float:left;
	width:780px;
	margin:-10px 0px 0px 4px;
	padding:0px;
	border-bottom:1px solid #144898;
	z-index:1;
	}


/* Main
--------------------------------------------------------------------------------*/
	
#topmain
	{
	float:left;
	width:798px;
	height:5px;
	margin:0px;
	padding:0px;
	background:url(../images/cjl_maintop01.gif) no-repeat;
	}
	
/* star html hack to correct discrepencies between IE7 and older verions */

* html #topmain
	{
	float:left;
	width:798px;
	height:5px;
	margin:0px 0px -8px 0px;
	padding:0px;
	background:url(../images/cjl_maintop01.gif) no-repeat;
	}
	
#main 
	{
	float:left;
	width:798px;
	margin:0px;
	padding:0px;
	background:url(../images/cjl_mainbg01.gif) repeat-y;
	}


/* Subnav
--------------------------------------------------------------------------------*/

#navbar
	{
	float:left;
	width:163px;
	margin:0px;
	padding:5px 13px 0px 16px;
	background:transparent;
	}
	
#nav_hr
	{
	width:100%;
	height:1px;
	margin:1.4em 0px 1.4em 0px;
	padding:0px;
	background:#000000;
	}


/* Content
--------------------------------------------------------------------------------*/

#mainbody 
	{
	float:left;
	width:590px;
	margin:0px 0px 0px 0px;
	padding:0px;
	background:transparent;
	}

#flashcontainer
	{
	background:url(/images/cjl_11.jpg) no-repeat;
	}
	
#topimage
	{
	margin:0px 0px 1.4em 0px;
	padding:0px;
	border:none;
	}
	
#topimage img
	{
	margin:0px;
	padding:0px;
	border:none;
	}
	
#aboutimage
	{
	float:right;
	width:275px;
	margin:0px 0px 1.4em 1.4em;
	padding:1em;
	border:1px solid #0053a0;
	}
	
#aboutimage img
	{
	margin:0px 0px 1em 0px;
	padding:0px;
	border:none;
	}
	
#aboutimage p
	{
	margin:0px;
	padding:0px;
	font:1em Arial, Helvetica, sans-serif;
	line-height:1.4em;
	}

#truckonroof
	{
	float:right;
	width:250px;
	margin:0px 0px 1.4em 1.4em;
	}
	
#bottommain
	{
	float:left;
	width:798px;
	height:4px;
	margin:0px;
	padding:0px;
	background:url(../images/cjl_mainbottombg01.gif) no-repeat;
	}
	
/* star html hack to correct discrepencies between IE7 and older verions */

* html #bottommain
	{
	float:left;
	width:798px;
	height:4px;
	margin:0px 0px -9px 0px;
	padding:0px;
	background:url(../images/cjl_mainbottombg01.gif) no-repeat;
	}


/* Footer
--------------------------------------------------------------------------------*/

#footer 
	{
	float:left;
	width:798px;
	height:30px;
	margin:0px;
	padding:0px;
	background:url(../images/cjl_footerbg01.gif) no-repeat;
	}
	
#footer p
	{
	margin:5px 0px 0px 14px;
	padding:0px;
	font:0.9em Arial, Helvetica, sans-serif;
	color:#000000;
	}

#footer a:link, #footer a:visited 
	{
	text-decoration:none;
	color:#005b98;
	border:none;
	}

#footer a:hover 
	{
	text-decoration:underline;
	}
	
#footer a:active
	{
	text-decoration:underline;
	}


/* Classes
--------------------------------------------------------------------------------*/

.pagecontent
	{
	margin:0px;
	padding:15px 15px 0px 15px;
	}
	
.pagecontent p
	{
	margin:0px 0px 1.4em 0px;
	padding:0px;
	font:1.2em Arial, Helvetica, sans-serif;
	line-height:1.4em;
	color:#ffffff;
	}
	
.pagecontent ul
	{
	margin:0px 0px 1.4em 0px;
	padding:0px;
	font:1.2em Arial, Helvetica, sans-serif;
	line-height:1.4em;
	list-style:none;
	}

.pagecontent .non-menu
	{
	margin:0px 0px 1.4em 25px;
	padding:0px;
	font:1.2em Arial, Helvetica, sans-serif;
	line-height:1.4em;
	color:#ffffff;
	list-style:disc;
	}

.pagecontent .rightimage
	{
	float:right;
	margin:0px 0px 1.4em 1.4em;
	padding:1em 1em 0em 1em;
	border:1px solid #0053a0;
	}

.pagecontent .rightimage img
	{
	margin:0px 0px 1em 0px;
	}

.pagecontent .rightimage p
	{
	font:1em Arial, Helvetica, sans-serif;
	line-height:1.4em;
	}

.pagecontent .leftimage
	{
	float:left;
	margin:0px 0px 1.4em 1.4em;
	padding:1em 1em 0em 1em;
	border:1px solid #0053a0;
	}

.pagecontent .leftimage img
	{
	margin:0px 0px 1em 0px;
	}

.pagecontent .leftimage p
	{
	font:1em Arial, Helvetica, sans-serif;
	line-height:1.4em;
	}
	
.pagecontent img
	{
	border:none;
	}

.pagecontent .image
	{
	float:left;
	margin:0px 1.4em 1.4em 0px;
	}

/* star hack to correct discrepencies between IE7 and older versions */

* html .pagecontent .image
	{
	float:left;
	margin:0px 0.7em 0px 0px;
	}

.pagecontent .image a
	{
	border:none;
	}
	
.pagecontent object
	{
	margin:0px 0px 1.4em 0px;
	border:none;
	}
	
.hr
	{
	width:100%;
	height:1px;
	margin:0px 0px 1.4em 0px;
	padding:0px;
	background:#0053a0;
	}
	
.nav_hr
	{
	width:100%;
	height:1px;
	margin:1.4em 0px 1.4em 0px;
	padding:0px;
	background:#000000;
	}
	
.subheading
	{
	margin:0px 0px 1.4em 0px;
	padding:0px;
	font:bold italic 1.4em Arial, Helvetica, sans-serif;
	line-height:1.4em;
	color:#4c994c;
	}
	
.logo_row
	{
	float:left;
	width:100%;
	margin:0px;
	padding:0px 0px 1.4em 0px;
	}

.logo
	{
	float:left;
	width:33%;
	margin:0px;
	padding:0px;
	color:#ffffff;
	border:none;
	}
	
.logo a
	{
	font:1.2em Arial, Helvetica, sans-serif;
	border:none;
	}
	
.logo img
	{
	border:none;
	}
	
.locations_address_row
	{
	float:left;
	width:100%;
	margin:0px 0px 1.4em 0px;
	padding:0px;
	}
	
.locations_address
	{
	float:left;
	width:50%;
	margin:0px;
	padding:0px;
	}
	
.services_row
	{
	float:left;
	width:100%;
	margin:0px 0px 1.4em 0px;
	padding:0px;
	}
	
.services_item
	{
	float:left;
	width:40%;
	}

.services_item p
	{
	font:bold italic 1.4em Arial, Helvetica, sans-serif;
	color:#4c994c;
	}
	
.services_description
	{
	float:left;
	width:60%;
	}

.contentpiece 
	{
    margin:10px;
	}

.contenttitle 
	{
    font-weight:bold;
	}


/* Forms
--------------------------------------------------------------------------------*/

.form-contact-div
	{
	margin:0px;
	padding:0px;
	text-align:center;
	}
	
form#contact
	{
	font:normal 11px Arial, Helvetica, sans-serif;
	text-align:left;
	}
	
form#contact fieldset
	{
	margin:0px 0px 1.4em 0px;
	padding:0px;
	border:1px solid #ffffff;
	color:#ffffff;
	}
	
form#contact fieldset legend
	{
	margin:0px 3px;
	padding:2px;
	font-weight:bold;
	color:#ffffff;
	}
	
form#contact input
	{
	font:normal 11px Arial, Helvetica, sans-serif;
	}
	
form#contact .button
	{
	float:right;
	width:60px;
	margin:5px 2px;
	border:1px solid #666666;
	background:#ffffff;
	font:normal 11px Arial, Helvetica, sans-serif;
	}
	
form#contact fieldset ul
	{
	list-style:none;
	margin:0px 0px 0px 15px;
	padding:0px;
	}
	
form#contact fieldset ul li
	{
	margin:2px 0px;
	padding:0px;
	}
	
.frmLabel
	{
	float:left;
	width:100px;
	position:relative;
	margin:0px 5px 0px 0px;
	padding:1px 5px 1px 1px;
	}
	
.frmLabelReq
	{
	float:left;
	width:100px;
	position:relative;
	margin:0px 5px 0px 0px;
	padding:1px 5px 1px 1px;
	background:url(/images/bullet_red.gif) no-repeat top right;
	}