﻿body
{
	background: url(../img/wood_background.jpg) repeat;
	font: 80% 'Trebuchet MS', 'Lucida Grande', Verdana, Helvetica, sans-serif;
	color: #444;
}

/* main wrapper that holds it all centrally */

#wrapper 
{
	width: 750px;
	/*background-color: #d2f0dc;*/
	background-color: #ddd;
	margin: 0 auto;
	padding: 0 10px 0px 10px;
}


/* default masthead holding the banner and headerMenu */

#header 
{
	position: relative;
	width: 750px;
	height: 170px;
	/*background:url(../img/Header.jpg);*/
	/*background: url(../img/header.gif);*/
}

#header_i 
{
	vertical-align: bottom;
	background: #fff;
	border: 0px;
}

#headerMenu
{
	position: absolute;
	left: 180px;
	bottom: 8px;
	width: 380px;
	font: .75em 'Trebuchet MS', 'Lucida Grande',Verdana, Helvetica, sans-serif;
	background: transparent;
}

#headerMenu ul
{
	margin: 0;
	padding: 0;
	list-style: none;
	width: 380px;
	float: left;
	background: #fff url(../img/bg_headerMenu.gif) repeat-x;
}

#headerMenu ul li
{
	float: left;
}

#headerMenu ul a
{
	display: block;
	padding: 0 2em;
	line-height: 24px;
	background: url(../img/divider.gif) repeat-y left top;
	text-decoration: none;
	color: #fff;
}

#headerMenu ul .first a
{
	background: none;
}

#headerMenu ul a:hover
{
	color: #333;
}

/* side content and primary content */

#middle
{
	background: #eef1f1 url(../img/wrapperbg.gif) repeat-y;
}

#sideContent
{
	float: left;
	width: 180px;
	margin-bottom: 20px;
	background: url(../img/bg_lightbot.gif) repeat-x top left;
}

#OneStatTag
{
	margin-top: 2em;
}

#established
{
	font: .9em 'Trebuchet MS', 'Lucida Grande',Verdana, Helvetica, sans-serif;
	margin: 0 0 30px 0;
	padding: 15px 0 0 5px;
	width: 85%;
	color: #48546a;
}

#primaryContent
{
	width:570px;
	float:right;
	margin-bottom: 20px;
	background: url(../img/bg_darkbot.gif) repeat-x top right;
}

#primaryContent h1
{
	margin: 0 auto;
	padding: 15px 0 0 15px;
	width: 95%;
	font: normal 1.6em Georgia, serif;
	color: #48546a;
	letter-spacing: -1px;	
}

#primaryContent h2
{
	margin: 0 auto;
	padding: 15px 0 0 15px;
	width: 95%;
	font: normal 1.55em Georgia, serif;
	color: #48546a;
	letter-spacing: -1px;	
}

#primaryContentMain
{
	padding: 20px;
}

/* footer */

#barbottom
{
	clear: both;
	width: 100%;
	height: 6px;
	background: #eee url(../img/bg_barbottom.gif) repeat-x;
}

#footer
{
	clear: both;
	width: 750px;
	height: 85px;
	/*background: #d2f0dc url(../img/footer.jpg) no-repeat top left;*/
	background: #ddd url(../img/footer.jpg) no-repeat top left;
	padding: 10px 0;
	text-align: center;
	font: 14px 'Trebuchet MS', 'Lucida Grande',Verdana, Helvetica, sans-serif;
	margin-top: 0px !important;  /* for other browsers */
	margin-top: -10px;            /* for IE6 to close gap above the footer */
}

.clearDiv
{
	clear: both;
}

/********** Div with the building picture as background ************/

#building
{
	background: #fff url(../img/building1.jpg) no-repeat top left;
	padding: 300px 20px 20px 20px;
}

#background
{
	background: #fff url(../img/background.jpg) no-repeat top left;
	padding: 5px 20px 20px 20px;
}

/*************** Popout menu section **************/

#menu
{
	width: 160px;
	background: #ccc;
}

#menu ul
{
	list-style: none;
	margin: 0;
	padding: 0;
}

#menu a, #menu h2
{
	font: bold 12px/16px "Trebuchet MS", arial, helvetica, sans-serif;
	display: block;
	border-width: 1px;
	border-style: solid;
	/*border-color: #ccc #888 #555 #bbb;*/
	border-color: #bbb;
	margin: 0;
	padding: 3px 3px;
}

#menu h2
{
	color: #444;
	/*background: #c6cce0;*/
	background: #a6acc0;
	text-transform: uppercase;
}

#menu a
{
	color: #555;
	background: #ededcf;
	text-decoration: none;
}

#menu a:hover
{
	color: #a00;
	background: #ccc;
}

#menu ul ul ul
{
	position: absolute;
	top: 0;
	left: 100%;
	width: 100%;
}

#menu li
{
	position: relative;
}

#menu a.more
{
	background: #ededcf url(../img/arrow2.gif) no-repeat right center;
	padding-right: 12px;
}

div#menu ul ul ul,             /* hide the popout in third-level ul */
div#menu ul ul li:hover ul ul  /* hide popouts that are two or more descendant children of the hovered <li> */
{
	display: none;
}

div#menu ul ul li:hover ul,
div#menu ul ul ul li:hover ul
{
	display: block;          /* make popout re-appear when a second-level <li> is hovered over */
}

/****** C-TPAT section *******/

#ctpat
{
	margin-top: 30px;
}

#ctpat img
{
	border: 0px;
}

/****** Image Wrapper - with shadow *******/

.img-wrapper-left
{
	margin: 1.5em 1.5em 1.5em 0;
	background: url(../img/shadow.gif) no-repeat bottom right;
	float: left;      /* Necessary to shrink wrap image */
	line-height: 0;
}

.img-wrapper-right
{
	margin: 1.5em 0 .5em 1.5em;
	background: url(../img/shadow.gif) no-repeat bottom right;
	float: right;     /* Necessary to shrink wrap image */
	line-height: 0;
}

.img-wrapper-left img,
.img-wrapper-right img
{
	display: block;
	background: #fff;
	padding: 4px;
	border: 1px solid #a9a9a9;
	position: relative;
	left: -5px;
	top: -5px;
}

/****** Navigation controls ********/
.wrapper-right
{
	float: right;
}

.image_link 
{
	margin-top: 8px;
	margin-right: 5px;
	vertical-align: bottom;
	background: #fff;
	border: 0px;
}

/****** News Section ******/

.newsSection
{
	clear: both; 
	padding-top: 1.5em; 
	border-bottom: 3px double #E5E5DA; 
}

.newsSection_pic 
{
	float: left; 
	margin-right: 1.25em; 
	width: 95px; 
	height: 70px; 
	border: 4px solid #EBEBE5;
	text-indent: -9000px;
}

#hpic1 
{
	background: #EBEBE5 url(../img/hpic1.jpg) no-repeat center center;
}

#hpic2
{
	background: #EBEBE5 url(../img/hpic2.jpg) no-repeat center center;
}

.newsSection h3 
{
	margin: 0; 
	font: 1.5em Georgia, serif; 
	color: #48546A; 
	letter-spacing: -1px;
}

.newsSection h3 a 
{
	text-decoration: none;
}

.newsSection h3 a:hover 
{
	background: #E2E2D2;
}

.newsSection p 
{
	margin-bottom: 1.5em; 
	color: #555;
}

/******* Actual news article ********/

.newsBody h3
{
	margin-bottom: 1em;
	font: normal 1.5em Georgia, serif;
}

/****** Contact Us Section ******/

.contactUsSection
{
	clear: both;
	padding: 1.5em 0; 
	border-bottom: 3px double #E5E5DA; 
}

.contactUsSection_pic 
{
	float: left; 
	margin-right: 1.25em; 
	width: 95px; 
	height: 70px; 
	border: 3px solid #E5E5DA;
	text-indent: -9000px;
}

.contactUsSection h3 
{
	width: 75%;
	height: .8em;
	float: right;
	margin: 0; 
	font: 1.5em Georgia, serif; 
	color: #48546A; 
	letter-spacing: -1px;
}

.contactUsSection p 
{
	width: 75%;
	float: right;
	color: #555;
}

.contactUsFooter
{
	clear: both;
}

#mail
{
	background: #EBEBE5 url(../img/envelope.jpg) no-repeat center center;	
}

#phone
{
	background: #EBEBE5 url(../img/cell_phone.jpg) no-repeat center center;	
}

#fax
{
	background: #EBEBE5 url(../img/fax.jpg) no-repeat center center;	
}

#email
{
	background: #EBEBE5 url(../img/email.jpg) no-repeat center center;	
}

/****** Employment Section ******/

.employmentSection
{
	clear: both;
	padding: 1.5em 0; 
	border-bottom: 3px double #E5E5DA; 
}

#employmentSectionTitle
{
	width: 100%;
	height: 55px;
	padding: 5px 2px 5px 2px;
	text-align: center;
	color:#006699;
	font: normal 1.6em Georgia, serif;
	letter-spacing: -1px;
	background: url(../img/careerphrasebg.jpg) repeat-x top left;
}

.employmentText
{
	clear: both;
	padding: 1em 0; 	
}
.employmentText img
{
	float: left;
}
.employmentText p
{
	width: 72%;
	float: right;
}

.employmentSection_pic 
{
	float: left; 
	margin-right: 1.25em; 
	width: 95px; 
	height: 70px; 
	border: 2px solid #E5E5DA;
	text-indent: -9000px;
	background: #fff url(../img/employment.gif) no-repeat top left;
}

.employmentSection_pic_trucking 
{
	float: left; 
	margin-right: 1.25em; 
	width: 78px; 
	height: 75px; 
	text-indent: -9000px;
	background: #fff url(../img/trucking_icon.jpg) no-repeat top left;
}

.employmentSection_pic_sales 
{
	float: left; 
	margin-right: 1.25em; 
	width: 78px; 
	height: 75px; 
	text-indent: -9000px;
	background: #fff url(../img/sales_icon.jpg) no-repeat top left;
}

.employmentSection_pic_accounting
{
	float: left; 
	margin-right: 1.25em; 
	width: 78px; 
	height: 90px; 
	text-indent: -9000px;
	background: #fff url(../img/accounting.jpg) no-repeat top left;
}

.employmentSection_pic_typing
{
	float: left; 
	margin-right: 1.25em; 
	width: 78px; 
	height: 90px; 
	text-indent: -9000px;
	background: #fff url(../img/typing_icon.jpg) no-repeat top left;
}

.employmentSection_pic_port
{
	float: left; 
	margin-right: 1.25em; 
	width: 78px; 
	height: 90px; 
	text-indent: -9000px;
	background: #fff url(../img/port.jpg) no-repeat top left;
}

.employmentSection h3 
{
	width: 75%;
	height: .8em;
	float: right;
	margin: 0; 
	font: 1.5em Georgia, serif; 
	color: #48546A; 
	letter-spacing: -1px;
}

.employmentSection h3 a 
{
	text-decoration: none;
}

.employmentSection h3 a:hover 
{
	background: #E2E2D2;
}

.employmentSection p 
{
	width: 75%;
	float: right;
	color: #555;
}

.employmentFooter
{
	clear: both;
}

/****** Job Description section ******/

.jobDescription
{
	float: left;
	clear: both;
	width: 98%;
	border: 1px solid #ccc;
}

.jobDescription h3
{
	margin: 0 0 5px 0;      
	height: 30px;
	background: #f5ebe1 url(../img/folderGlobe.jpg) no-repeat left center;
	padding-left: 40px;
	padding-bottom: 0;
	color: #557722;
	font: normal 1.3em Georgia, serif;
	letter-spacing: -1px;
}

.jobDescription div
{
	padding: 5px 15px 10px 15px;
}

/******* Photo Shuffler section *********/

.photoShufflerText
{
	float: left;
	margin-left: 10px;
}

.photoShufflerWrapper
{
	float: left;
	width: 480px;
	height: 360px;
	border: 2px gray solid;
	padding: 5px;
	margin-left: 10px;
}

#photoShufflerDiv 
{
	background-repeat: no-repeat;
}

/******* Website info section *******/

.imgTextNoWrapSection
{
	clear: both;
	padding: 1.5em 0; 
	border-bottom: 3px #E5E5DA solid; 
}

.imgTextNoWrap_pic 
{
	float: left; 
	margin-right: 1.25em;
	width: 30%; 
	border: 3px solid #c5c5ca;
}

.imgTextNoWrap_pic img
{
	border: 0;
}

.imgTextNoWrapSection h3 
{
	width: 65%;
	height: .8em;
	float: right;
	margin: 0; 
	font: 1.5em Georgia, serif; 
	color: #48546A; 
	letter-spacing: -1px;
}

.imgTextNoWrapSection p 
{
	width: 65%;
	float: right;
	color: #555;
}

/****** Wood Description section ******/

.woodDescription
{
	float: left;
	clear: both;
	width: 98%;
	height: 1%;
	border: 1px solid #ccc;
	padding-left: 15px;             /*** to leave room for framed image ***/
}

.woodDescription .header
{
	background: transparent url(../img/woodDescriptionHeader.gif) repeat-y right;
}

.woodDescription h3
{
	margin: 0 auto 10px -15px;      /*** to counter padding-left in DIV ***/
	height: 30px;
	background: transparent url(../img/tree.gif) no-repeat left center;
	padding-left: 40px;
	padding-bottom: 0;
	color: #666;
	font: normal 1.25em Georgia, serif;
	letter-spacing: -1px;
	text-align: left;
}

.woodDescription span
{
	display: block;
	padding: 0 10px 12px 10px;
}


/******  Links section *******/

.linksSection
{
	float: left;
	clear: both;
	width: 98%; 
}

.linksSection .header
{
	height: 25px;
	background: transparent url(../img/woodDescriptionHeader.gif) repeat-y left;	
}

.linksSection h3
{
	color: #963;
	font: normal 125% Georgia, serif;
}

.linksSection h3 a
{
	text-decoration: none;
}

.linksSection p
{
	float: right;
	width: 60%;
	padding: 15px 10px 5px 5px;
	color: #38343A;	
}


/******* Business Position section *******/

.services
{
	float: left;
	clear: both;
	width: 98%;
}

.services .header
{
	height: 26px;
	background: transparent url(../img/woodDescriptionHeader.gif) repeat-y left;
}

.services h3
{
	background: transparent url(../img/leaf.gif) no-repeat left center;
	padding-left: 40px;
	padding-bottom: 0;
	color: #963;
	font: bold 140% Georgia, serif;
}

.services .text
{
	padding: 7px 10px 15px 15px;
	color: #38343A;	
}

.services .more
{
	height: 13px;
	vertical-align: bottom;
	background: #fff;
	border: 1px #ddd solid;
}

/********** Image Gallery Section *************/

/* default link style - needed to make the :active work correctly in IE */
a, a:visited, a:hover, a:active 
{
	color:#000;
}
/* style the outer cntaining div to fit the landscape, portrait and buttons */
#album 
{
	width:480px; 
	height:auto; 
	background:#eee url(../photos/camera.jpg) 0 40px no-repeat;
	border:1px solid #aaa;
	margin: 30px auto 0 auto;
}
/* remove the padding margin and bullets from the list. Add a top margin and width to fit the images and a position relative */
.gallery 
{
	padding:0; 
	margin:480px 0 0 0;
	list-style-type:none; 
	position:relative; 
	width:480px;
}
/* remove the default image border */
.gallery img 
{
	border:0;
}
/* make the list horizontal */
.gallery li 
{
	float:left;
}
/* style the link text to be central in a surrounding box */
.gallery li a, 
.gallery li a:visited 
{
	font-size:11px;
	float:left; 
	text-decoration:none; 
	color:#000; 
	background:#fff; 
	text-align:center; 
	width:26px; 
	height:26px; 
	line-height:24px; 
	border:1px solid #444;
	margin:2px;
}
/* position the images using an absolute position and hide them from view */
.gallery li a img 
{
	position:absolute; 
	top:-680px; 
	left:0; 
	visibility:hidden; 
	border:0;
}
/* fix the top position for the landscape images */
.gallery li a img.landscape 
{
	top:-440px;
}
/* fix the left position for the portrait images */
.gallery li a img.portrait 
{
	top: -480px;
	left:0;
	border-left:60px solid #eee;
	border-right:60px solid #eee;
}
/* style the hover background color for the text boxes */
.gallery li a:hover 
{
	background:#ddd;
}
/* style the active/focus colors for the text boxes (required for IE) */
.gallery li a:active, 
.gallery li a:focus 
{
	background:#444; 
	color:#fff;
}
/* make the images visible on active/focus */
.gallery li a:active img, 
.gallery li a:focus img 
{
	visibility:visible;
}

/********** End of Image Gallery Section *************/


/********** All Products thumbnail section **********/
.thumbnail
{
	float: left;
	width: 104px;
	border: 1px solid #999;
	margin: 0 15px 10px 0;
	padding: 5px;
	font-size: .85em;
	color: #444;
	background: #dde;
	text-align: center;
}

.thumbnail img
{
	border: 0;
}
/********** End of All Products thumbnail section **********/

/********** Silverlight ***********/
#silverlightControlHost 
{
	height: 100%;
}
