﻿/***************** meyerweb.com reset v1.0 | 20080212 *****************/

.print-only { display: none; }

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
caption {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	/*vertical-align: baseline;*/
	background: transparent;
}

ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

img { border: 0; }

/********************* text elements ********************/

p
{
	padding: 3px 0 9px 0;
    margin: 0;
}

.small { font-size: 90%; }



a, a:link, a:visited, a:active
{
	color: #057eb9;
	text-decoration: none;
}

a:hover
{
	color: #24a4e1;
	text-decoration: none;
}

hr
{
	color: #eee;
    background-color: #dddddd;
    height: 1px;
}

.replace span
{
	padding: 0;
	margin: 0;
	display:block;
	width: 100%;
	height: 100%;
	z-index: 1;
	position: absolute;
	top: 0;
	left: 0;
}

#main-sub-left h2
{
    font-size: 120%;
    color: #444;
    padding: 4px 0 8px 0;
}

/*************** main layout ******************/

.left { float: left; }
.right { float: right; }
.clear { clear: both; }
.no-text { font-size: 1px; line-height: 1px; }

body 
{
	text-align: left;
	color: #163746;
	font-family: Verdana, Helvetica, Arial,  sans-serif;
	font-size: 13px;
	padding-bottom: 40px;
}

div#frame-header
{
	margin: 0 auto;
    background: url("../images/bg-header.gif") #ffffff 0px 0px repeat-x;
}

div#frame-main
{
	width: 1000px;
	margin: 0 auto;
    background: url("../images/bg-body.gif") #ffffff 0px 0px repeat-x;
}

div#header 
{
	width: 960px;
	padding: 0 20px 0 20px;
	margin: 0 auto;
	position: relative;
	height: 178px;
    background: url("../images/bg-header.gif") #ffffff 0px 0px repeat-x;
}

div#main 
{
	width: 978px;
	padding: 0 11px 0 11px;
	margin: 0 auto;
	position: relative;
}


/*
div#main 
{
	width: 978px;
	padding: 0 11px 0 11px;
	margin: 0 auto;
	position: relative;
}*/

div#nav-outer
{
    width: 960px;
    height: 37px;
    margin-top: 0px;
    background: url("../images/nav-bg.png") no-repeat;
    
}

/**************************** home ******************************/


div#frame-main-home
{
	margin: 0 auto;
    background: url("../images/bg-body-home.gif") #ffffff 0px 0px repeat-x;
}

div#frame-main-home div#main 
{
	background: url("../images/bg-body-home.gif") #ffffff 0px 0px repeat-x;
}


div#main-home-left
{
    width: 284px;
    padding: 0 0 0 9px;
    float: left;
}

div#main-home-right
{
    width: 672px;
    height: 374px;
    float: right;
    padding: 16px 0 0 13px;
    background: url("../images/home-banner-bg.png") no-repeat;
    position: relative;
}

div#banner-links
{
    bottom: 0;
    left: 13px;
    position: absolute;
    z-index: 5000;
    width: 100%;
}

div#banner-link-bgs
{
    bottom: 0;
    left: 13px;
    position: absolute;
    z-index: 3000;
    width: 100%;
}


div#banner-links a
{
    z-index: 5000;
    float: left;
}
div#banner-links:hover
{
    cursor: pointer;
}

a#banner-link-1
{
    width: 214px;
    height: 117px;
    display: block;
    /*background: url("../images/banner-link-1-bg.png") no-repeat;*/
    overflow: hidden;
    position: relative;
}


div#banner-link-bg1
{
    width: 214px;
    height: 117px;
    float: left;
    background: url("../images/banner-link-1-bg.png") no-repeat;
}


div#banner-link-bg2
{
    width: 221px;
    height: 117px;
    float: left;
    background: url("../images/banner-link-2-bg.png") no-repeat;
}


div#banner-link-bg3
{
    width: 228px;
    height: 117px;
    float: left;
    background: url("../images/banner-link-3-bg.png") no-repeat;
}

a#banner-link-2
{
    width: 221px;
    height: 117px;
    display: block;
    /*background: url("../images/banner-link-2-bg.png") no-repeat;*/
    overflow: hidden;
}

a#banner-link-3
{
    width: 228px;
    height: 117px;
    display: block;
    /*background: url("../images/banner-link-3-bg.png") no-repeat;*/
    overflow: hidden;
}



/**************************** sub *************************/




div#frame-main-sub
{
	margin: 0 auto;
    background: url("../images/bg-body-sub.png") #ffffff 0px 0px repeat-x;
}

div#frame-main-sub div#main 
{
	background: url("../images/bg-body-sub.png") #ffffff 0px 0px repeat-x;
}

div#subpage-title-outer 
{
    background: url("../images/bg-banner-sub.png") no-repeat;
    margin-bottom: 43px;
}

h1#subpage-title 
{
	height: 64px;
	position: relative;
	display: block;
}

h1.title-lightweight, h1.title-about, h1.title-timber, h1.title-testimonials
{
    width: 166px;
}

h1.title-outdoor
{
    width: 204px;
}

h1.title-lightweight span
{
    background: url("../images/title-lightweight.png") no-repeat;
}

h1.title-outdoor span
{
    background: url("../images/title-outdoor.png") no-repeat;
}

h1.title-timber span
{
    background: url("../images/title-timber.png") no-repeat;
}

h1.title-about span
{
    background: url("../images/title-about.png") no-repeat;
}

h1.title-testimonials span
{
    background: url("../images/title-testimonials.png") no-repeat;
}

div#main-sub-left
{
    float: left;
    margin-left: 10px;
    width: 550px;
    padding-bottom: 15px;
	
	min-height:250px;
	height:auto !important;
	height:250px;
	display: inline;
}

div#main-sub-left li {
	margin-bottom:5px;
}

div#main-sub-left ul {
    list-style-image:none;
    list-style-position:outside;
    list-style-type:disc;
    margin-bottom:5px;
    margin-left:26px;
    margin-top:5px;
    padding:0 0 8px;
}

div#main-sub-right
{
    float: right;
    margin: 2px 0px 0 0px;
    width: 407px;
    padding-bottom: 15px;
}

a.gallery
{
    margin: 0 10px 17px 7px;
    width: 183px;
    height: 131px;
    display: block;
    float: left;
    display:inline;
    border: 1px solid #ccc;
}

a.gallery:hover
{
    border: 1px solid #888;
}

p.click-instructions
{
    font-size: 80%;
    padding: 0 0 7px 7px;
}

/*************************************** global **************************/


div#content 
{
	width: 960px;
	margin: 0 auto;
	/*padding-bottom: 40px;*/
}

div#site-title 
{
	width: 282px;
	height: 112px;
	float: left;
	position: relative;
	display: block;
	margin-bottom: 15px;
}

div#site-title span
{
    background: url("../images/site-title.gif") no-repeat;
}

div#contact-info 
{
	width: 403px;
	height: 70px;
	float: right;
	position: relative;
	display: block;
	margin-top: 30px;
}

a.contact-email
{
    position: absolute;
    bottom: 10px;
    right: 95px;
    /*border: 1px solid red;*/
    display: block;
    width: 193px;
    height: 17px;
    z-index: 3;
}

div#contact-info span
{
    background: url("../images/contact-info.gif") no-repeat;
}

div#intro 
{
	width: 284px;
	height: 195px;
	margin: auto;
	position: relative;
	display: block;
}

div#intro span
{
    background: url("../images/home-intro-1.png") no-repeat;
}

div#intro-below
{
	width: 284px;
	height: 109px;
	margin: 29px 0 0 0;
	position: relative;
	display: block;
}

div#intro-below span
{
    background: url("../images/home-intro-2.png") no-repeat;
}

#footer
{
    width: 960px;
    height: 97px;
    margin: 10px 0 0 10px;
    background: url("../images/footer-bg.png") #ffffff no-repeat;
    color: #163746;
    font-size: 90%;
}

#footer-inner
{
    padding: 12px;
}

#footer a, #footer a:link, #footer a:visited, #footer a:active
{
	color: #163746;
	text-decoration: none;
}

#footer a:hover
{
	color: #215b75;
	text-decoration: none;
}




/************************* main nav *********************/



div#nav
{
	height: 22px;
    /*background: url("../images/bg-nav.png") #333 0px -78px no-repeat;*/
	font-size: 8px;
	margin: 13px 0 0 0px;
	z-index: 2;
	/*border: 1px solid red;*/
	width: 616px;
	float: right;
}

#nav-ul {
	padding: 0;
	margin: 0;
	list-style: none;
	font-size: 8px;
}

#nav-ul {
	margin: 8px 10px 0 0px;
	width: 616;
	float: right;
	display: inline;
}

#nav-ul li a {
	display: block;
	width: 70px;
	color: #fff;
	height: 22px;
	padding: 0px;
	text-decoration: none;
	text-align: center;
}

#nav-ul li {
	float: left;
	/*width: 7em;*/
	position: relative;
	/*background-color: #333;*/
    display:inline;
}



/****************************************/


#nav-ul li a span {
    display: block;
    height: 100%;
    width: 100%;
    cursor: pointer;
    cursor: hand; /* for IE5.x/Win */
    background-position: 0 0;
    position: absolute;
    top: 0;
    left: 0;
    background: url(/images/nav-items.png) no-repeat;
}


#nav-ul li#home a, #nav-ul li#home { width:45px; margin: 0 30px 0 0; }
#nav-ul li#home a, #nav-ul li#home a span { background-position: -21px -0px;}
#nav-ul li#home:hover a span, #nav-ul li#home.sfhover a span {  background-position: -21px -22px; }
#nav-ul li#home a.selected, #nav-ul li#home a.selected span, 
#nav-ul li#home:hover a.selected span, #nav-ul li#home.sfhover a.selected span { background-position: -22px -44px;}

#nav-ul li#about a span, #nav-ul li#about { width:50px; margin: 0 30px 0 0; }
#nav-ul li#about a, #nav-ul li#about a span { background-position: -98px -0px;}
#nav-ul li#about:hover a span, #nav-ul li#about.sfhover a span {  background-position: -98px -22px; }
#nav-ul li#about a.selected, #nav-ul li#about a.selected span, 
#nav-ul li#about:hover a.selected span, #nav-ul li#about.sfhover a.selected span { background-position: -98px -44px;}

#nav-ul li#testimonials a span, #nav-ul li#testimonials { width:92px; margin: 0 30px 0 0; }
#nav-ul li#testimonials a, #nav-ul li#testimonials a span { background-position: -178px -0px;}
#nav-ul li#testimonials:hover a span, #nav-ul li#testimonials.sfhover a span {  background-position: -178px -22px; }
#nav-ul li#testimonials a.selected, #nav-ul li#testimonials a.selected span, 
#nav-ul li#testimonials:hover a.selected span, #nav-ul li#testimonials.sfhover a.selected span { background-position: -178px -44px;}

#nav-ul li#lightweight a span, #nav-ul li#lightweight { width:86px; margin: 0 30px 0 0; }
#nav-ul li#lightweight a, #nav-ul li#lightweight a span { background-position: -300px -0px;}
#nav-ul li#lightweight:hover a span, #nav-ul li#lightweight.sfhover a span {  background-position: -300px -22px; }
#nav-ul li#lightweight a.selected, #nav-ul li#lightweight a.selected span, 
#nav-ul li#lightweight:hover a.selected span, #nav-ul li#lightweight.sfhover a.selected span { background-position: -300px -44px;}

#nav-ul li#timber a span, #nav-ul li#timber { width:54px; margin: 0 30px 0 0; }
#nav-ul li#timber a, #nav-ul li#timber a span { background-position: -412px -0px;}
#nav-ul li#timber:hover a span, #nav-ul li#timber.sfhover a span {  background-position: -412px -22px; }
#nav-ul li#timber a.selected, #nav-ul li#timber a.selected span, 
#nav-ul li#timber:hover a.selected span, #nav-ul li#timber.sfhover a.selected span { background-position: -412px -44px;}

#nav-ul li#outdoor a span, #nav-ul li#outdoor { width:113px; margin: 0 30px 0 0; }
#nav-ul li#outdoor a, #nav-ul li#outdoor a span { background-position: -494px -0px;}
#nav-ul li#outdoor:hover a span, #nav-ul li#outdoor.sfhover a span {  background-position: -494px -22px; }
#nav-ul li#outdoor a.selected, #nav-ul li#outdoor a.selected span, 
#nav-ul li#outdoor:hover a.selected span, #nav-ul li#outdoor.sfhover a.selected span { background-position: -494px -44px;}


/*************************************/
