/*	===============================================================
	© Eko Direct
	
    http://www.eko-direct.com/	

	Type:				Structural Styles
	Build by:			

    TDG Digital
	Document Author:	James Lester
	Author Email:		james@shorelinedesign.co.uk
	

    Creation Date:		17th July 2007
	---------------------------------------------------------------
	Version number: 	1.0
	Last edited:		NA - Still in developement
	

============================================================ */
/*===============================================================

	DOCUMENT CONTENTS
	
	1.	Global settings
	2.	Positioning & Structure rules
	3.	Primary navigation
	4.	Secondary Navigation
    5.  Sidebar
	6.	Footer
    7.	Hidden Elements (print only elements)
	------------------------------------------------------------ */
	
	
/*	---------------------------------------------------------------
	#1 GLOBAL SETTINGS
	---------------------------------------------------------------
	these are mostly font sizing and positional issues
	------------------------------------------------------------ */



body {
    margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	background-color: #666699;
}




/*	---------------------------------------------------------------
	#2 POSITIONING & STRUCTURE RULES
	---------------------------------------------------------------
	Outlines the main structure of the website
	------------------------------------------------------------ */

#header-outer {
	height: 100px;
	display: block;
	width: 100%;
	background-color: #000033;
	border-bottom: 2px solid #d6d6e0;
	margin: 0px auto 0px auto;
}

#header {
	display: block;
	width: 700px;
	margin: 0px auto 0px auto;
	height: 79px;
	position: relative;
	background-color: Transparent;
}




#logo { border: none; margin: 0px; padding: 0px; }

#logo a {
    width: 224px;
    height: 28px;
    background-image: url(../images/global/eko-direct.gif);
    background-repeat: no-repeat;
    position: absolute;
    top: 25px;
    left: 5px;
	padding-top: 28px;
	height/* */:/**/0;
	height: /**/0;
	overflow: hidden;
}


#celebration-of-nature {
    width: 240px;
    height: 35px;
    background-image: url(../images/titles/a-celebration-of-nature.gif);
    background-repeat: no-repeat;
    position: absolute;
    top: 27px;
    right: 6px;
	padding: 35px 0px 0px 0px;
	margin: 0px;
	height/* */:/**/0;
	height: /**/0;
	overflow: hidden;
}



#mainbody-outer {
	height: 79px;
	display: block;
	width: 100%;
	background: #000033 url(../images/global/main-background.jpg) top;
	margin: 0px auto 0px auto;
	min-height: 560px;
	height: auto !important;
	height: 560px;
    border-bottom: 2px solid #d6d6e0;
}


#mainbody {
	display: block;
	width: 414px;
	margin: 0px auto 0px auto;
	position: relative;
	background-color: #000033;
	min-height: 222px;
	height: auto !important;
	height: 222px;
	padding: 45px 265px 20px 21px;
}

#mainbody2 {
	display: block;
	width: 414px;
	margin: 0px auto 0px auto;
	position: relative;
	background-color: #000033;
	min-height: 222px;
	height: auto !important;
	height: 222px;
	padding: 10px 265px 20px 21px;
}

#mainbody-page {
	display: block;
	width: 658px;
	margin: 0px auto 0px auto;
	position: relative;
	background-color: #000033;
	min-height: 222px;
	height: auto !important;
	height: 222px;
	padding: 10px 21px 20px 21px;
}

#mainbody-page2 {
	display: block;
	width: 434px;
	margin: 0px auto 0px auto;
	position: relative;
	background-color: #000033;
	min-height: 222px;
	height: auto !important;
	height: 222px;
	padding: 10px 245px 20px 21px;
}



#strap {
	height: 253px;
	display: block;
	width: 700px;
	background-repeat: no-repeat;
	position: relative;
	background-color: #000033;
	margin: 0px auto 0px auto;
    border-bottom: 2px solid #d6d6e0;
}
.strap-home { background-image: url(../images/strap/main_home1.jpg); }
.strap-products { background-image: url(../images/strap/main_product.jpg); }
.strap-measure-guide { background-image: url(../images/strap/main_measureguide.jpg); }
.strap-brochure-request { background-image: url(../images/strap/main_brochurerequest.jpg); }
.strap-care-sheet { background-image: url(../images/strap/main_careguide.jpg); }
.strap-mission-statement { background-image: url(../images/strap/main_missionstatement.jpg); }
.strap-sample-request { background-image: url(../images/strap/main_sample.jpg); }
.strap-order { background-image: url(../images/strap/main_order.jpg); }
.strap-contact-us { background-image: url(../images/strap/main_contact.jpg); }
.strap-accessibility { background-image: url(../images/strap/splash-image9.jpg); }
.strap-terms { background-image: url(../images/strap/splash-image5.jpg); }
.strap-ekoplank1strip { background-image: url(../images/strap/main_product_ekoplank.jpg); }
.strap-ekowood3strip { background-image: url(../images/strap/main_product_ekowood.jpg); }
.strap-ekoloc { background-image: url(../images/strap/main_product_ekoloc.jpg); }
.strap-fineline { background-image: url(../images/strap/main_product_fineline.jpg); }





#home-brochure a {
    width: 209px;
    height: 115px;
    background-image: url(../images/home/home-brochure-request.jpg);
    background-repeat: no-repeat;
    position: absolute;
    top: 26px;
    right: 21px;
	padding-top: 115px;
	height/* */:/**/0;
	height: /**/0;
	overflow: hidden;
}


#home-sample a {
    width: 209px;
    height: 115px;
    background-image: url(../images/home/home-sample-request.jpg);
    background-repeat: no-repeat;
    position: absolute;
    top: 159px;
    right: 21px;
	padding-top: 115px;
	height/* */:/**/0;
	height: /**/0;
	overflow: hidden;
}


#home-guide a {
    width: 209px;
    height: 115px;
    background-image: url(../images/home/home-measure-guide.jpg);
    background-repeat: no-repeat;
    position: absolute;
    top: 159px;
    right: 21px;
	padding-top: 115px;
	height/* */:/**/0;
	height: /**/0;
	overflow: hidden;
}

#home-brochure-request {
    width: 212px;
    height: 247px;
    background-image: url(../images/home/brochure-request-image.jpg);
    background-repeat: no-repeat;
    position: absolute;
    top: 26px;
    right: 21px;
	padding-top: 247px;
	height/* */:/**/0;
	height: /**/0;
	overflow: hidden;
}



#pagetitle {
	height: 31px;
	display: block;
	background-repeat: no-repeat;
	background-color: #000033;
	margin: 0px 0px 22px 0px;
	padding: 31px 0px 0px 0px;
	height/* */:/**/0;
	height: /**/0;
	overflow: hidden;
}

#pagetitle-page {
	height: 47px;
	display: block;
	background-repeat: no-repeat;
	background-color: #000033;
	margin: 20px 0px 1px 0px;
	padding: 47px 0px 0px 0px;
	height/* */:/**/0;
	height: /**/0;
	overflow: hidden;
	font-size: 8px;
}


.pagetitle-home { background-image: url(../images/titles/title-home.gif); width: 410px; }
.pagetitle-products { background-image: url(../images/titles/title-products.gif); width: 114px; }
.pagetitle-measure-guide { background-image: url(../images/titles/title-measure-guide.gif); width: 179px; }
.pagetitle-brochure-request { background-image: url(../images/titles/title-brochure-request.gif); width: 241px; }
.pagetitle-care-sheet { background-image: url(../images/titles/title-care-sheet.gif); width: 248px; }
.pagetitle-mission-statement { background-image: url(../images/titles/title-mission-statement.gif); width: 222px; }
.pagetitle-order { background-image: url(../images/titles/title-order.gif); width: 146px; }
.pagetitle-contact-us { background-image: url(../images/titles/title-contact-us.gif); width: 146px; }
.pagetitle-accessibility { background-image: url(../images/titles/title-accessibility.gif); width: 161px; }
.pagetitle-terms { background-image: url(../images/titles/title-website-terms.gif); width: 179px; }
.pagetitle-sample-request { background-image: url(../images/titles/title-sample-request.gif); width: 211px; }
.pagetitle-ekoplank1strip { background-image: url(../images/titles/title-ekoplank1strip.gif); width: 211px; }
.pagetitle-ekowood3strip { background-image: url(../images/titles/title-ekowood3strip.gif); width: 211px; }
.pagetitle-ekoloc { background-image: url(../images/titles/title-ekoloc.gif); width: 81px; }
.pagetitle-fineline { background-image: url(../images/titles/title-ekowoodfineline.gif); width: 199px; }
.pagetitle-sample-request{ background-image: url(../images/titles/title-sample-request.gif); width: 213px; }













#product-sections-ekoplank a {
    width: 208px;
    height: 90px;
    background-repeat: no-repeat;
	background-image: url(../images/products/product-ekoplank.jpg);
	float: left;
	padding-top: 90px;
	height/* */:/**/0;
	height: /**/0;
	overflow: hidden;
	margin: 0px 10px 10px 0px;
}

#product-sections-ekowood a {
    width: 208px;
    height: 90px;
    background-repeat: no-repeat;
	background-image: url(../images/products/product-ekowood.jpg);
	float: left;
	padding-top: 90px;
	height/* */:/**/0;
	height: /**/0;
	overflow: hidden;
	margin: 0px 0px 10px 0px;
}

#product-sections-ekoloc a {
	clear: left;
    width: 208px;
    height: 90px;
    background-repeat: no-repeat;
	background-image: url(../images/products/product-ekoloc.jpg);
	float: left;
	padding-top: 90px;
	height/* */:/**/0;
	height: /**/0;
	overflow: hidden;
	margin: 0px 10px 0px 0px;
}

#product-sections-fineline a {
    width: 208px;
    height: 90px;
    background-repeat: no-repeat;
	background-image: url(../images/products/product-fineline.jpg);
	float: left;
	padding-top: 90px;
	height/* */:/**/0;
	height: /**/0;
	overflow: hidden;
}











#sidebar-sections-ekoplank a {
    width: 208px;
    height: 90px;
    background-repeat: no-repeat;
	background-image: url(../images/products/product-ekoplank.jpg);
	float: left;
	padding-top: 90px;
	height/* */:/**/0;
	height: /**/0;
	overflow: hidden;
	position: absolute;
	top: 26px;
	right: 21px;
}

#sidebar-sections-ekowood a {
    width: 208px;
    height: 90px;
    background-repeat: no-repeat;
	background-image: url(../images/products/product-ekowood.jpg);
	float: left;
	padding-top: 90px;
	height/* */:/**/0;
	height: /**/0;
	overflow: hidden;
	position: absolute;
	top: 126px;
	right: 21px;
}

#sidebar-sections-ekoloc a {
	clear: left;
    width: 208px;
    height: 90px;
    background-repeat: no-repeat;
	background-image: url(../images/products/product-ekoloc.jpg);
	float: left;
	padding-top: 90px;
	height/* */:/**/0;
	height: /**/0;
	overflow: hidden;
	position: absolute;
	top: 226px;
	right: 21px;
}

#sidebar-sections-fineline a {
    width: 208px;
    height: 90px;
    background-repeat: no-repeat;
	background-image: url(../images/products/product-fineline.jpg);
	float: left;
	padding-top: 90px;
	height/* */:/**/0;
	height: /**/0;
	overflow: hidden;
	position: absolute;
	top: 326px;
	right: 21px;
}

/*	---------------------------------------------------------------
	#3 PRIMARY NAVIGATION
	---------------------------------------------------------------
	Outlines the primary navigational elements of the website
	------------------------------------------------------------ */

#navbar ul,li { margin: 0px; padding: 0px; list-style: none !important; }
#navbar {
	display: block;
	width: 700px;
	margin: 0px auto 0px auto;
	height: 21px;
	position: relative;
	background-color: Transparent;
}

#navbar li { float: left; }

#navbar li a {
	display: block;
	margin: 0px;
	height: 21px;
	background-color: #656598 !important;
	background-image: url(../images/global/navigation.gif) !important;
	background-repeat: no-repeat !important;
	padding: 21px 0px 0px 0px;
	height/* */:/**/0;
	height: /**/0;
	overflow: hidden;
}

#navbar-products a                { background-position: 0px 0px !important; width: 75px !important; margin-right: 7px !important; }
#navbar-products a.navon          { background-position: 0px -21px !important; width: 75px !important; margin-right: 7px !important; }
#navbar-products a:hover          { background-position: 0px -21px !important; }

#navbar-measure-guide a           { background-position: -82px 0px !important; width: 103px !important; margin-right: 7px !important; }
#navbar-measure-guide a.navon     { background-position: -82px -21px !important; width: 103px !important; margin-right: 7px !important; }
#navbar-measure-guide a:hover     { background-position: -82px -21px !important; }

#navbar-brochure-request a        { background-position: -192px 0px !important; width: 131px !important; margin-right: 7px !important; }
#navbar-brochure-request a.navon  { background-position: -192px -21px !important; width: 131px !important; margin-right: 7px !important; }
#navbar-brochure-request a:hover  { background-position: -192px -21px !important; }

#navbar-care-sheet a              { background-position: -330px 0px !important; width: 81px !important; margin-right: 7px !important; }
#navbar-care-sheet a.navon        { background-position: -330px -21px !important; width: 81px !important; margin-right: 7px !important; }
#navbar-care-sheet a:hover        { background-position: -330px -21px !important; }

#navbar-mission-statement a       { background-position: -418px 0px !important; width: 128px !important; margin-right: 8px !important; }
#navbar-mission-statement a.navon { background-position: -418px -21px !important; width: 128px !important; margin-right: 8px !important; }
#navbar-mission-statement a:hover { background-position: -418px -21px !important; }

#navbar-order a                   { background-position: -553px 0px !important; width: 53px !important; margin-right: 8px !important; }
#navbar-order a.navon             { background-position: -553px -21px !important; width: 53px !important; margin-right: 8px !important; }
#navbar-order a:hover             { background-position: -553px -21px !important; }

#navbar-contact-us a              { background-position: -613px 0px !important; width: 85px !important; margin-right: 0px !important; }
#navbar-contact-us a.navon        { background-position: -613px -21px !important; width: 85px !important; margin-right: 0px !important; }
#navbar-contact-us a:hover        { background-position: -613px -21px !important; }



/*	---------------------------------------------------------------
	#4 SECONDARY NAVIGATION
	---------------------------------------------------------------
	Outlines the secondary navigational elements of the website
	------------------------------------------------------------ */



#strap-navigation-outer {
	height: 229px;
	display: block;
	padding-top: 24px;
	width: 134px;
	position: relative;
	background-repeat: no-repeat;
	background-color: #d6d6e0;
	filter:alpha(opacity=80);-moz-opacity:.80;opacity:.80;
}


#strap-navigation ul,li { margin: 0px; padding: 0px; list-style: none; }
#strap-navigation {
	height: 229px;
	display: block;
	padding-top: 24px;
	width: 134px;
	position: absolute;
	left: 0px;
	top: 0px;
	background-repeat: no-repeat;
	background-color: Transparent;
}

#strap-navigation li a {
	display: block;
	margin: 0px;
	width: 112px;
	padding: 8px 11px 8px 11px;
	background-color: Transparent; !important;
	
}
#strap-navigation li a.navon {
	display: block;
	margin: 0px;
	width: 112px;
	padding: 8px 11px 8px 11px;
	background-color: #000033 !important;
	color: #FFFFFF !important;
}
#strap-navigation li a:hover.navon { background-color: #000033 !important; color: #FFFFFF !important; }


#strap-navigation li a:hover {
	background-color: #ffffff !important;
	filter:alpha(opacity=100) !important;-moz-opacity:1.0 !important;opacity:1.0 !important;
}


/*	---------------------------------------------------------------
	#5 SIDEBAR
	---------------------------------------------------------------
	Outlines the sidebar elements of the website
	------------------------------------------------------------ */

#sidebar {
	display: block;
	width: 193px;
	background-color: #333333;
	filter:alpha(opacity=70);-moz-opacity:.70;opacity:.70;
	height: 500px;
	float: right;
}

/*	---------------------------------------------------------------
	#6 FOOTER
	---------------------------------------------------------------
	Outlines the footer elements of the website
	------------------------------------------------------------ */


#call-to-action {
	display: block;
	width: 700px;
	margin: 0px auto 0px auto;
	position: relative;
	background-color: #000033;
	min-height: 20px;
	height: auto !important;
	height: 20px;
	text-align: center;
}


#footer {
	display: block;
	width: 700px;
	margin: 10px auto 0px auto;
	position: relative;
	background-color: Transparent;
	text-align: center;
	text-transform: uppercase;
}


/*	---------------------------------------------------------------
	#7 HIDDEN ELEMENTS
	---------------------------------------------------------------
	Outlines the footer elements of the website
	------------------------------------------------------------ */

hr { display: none; }



.product-section {
	width: 100%;
	border-bottom: 2px solid #6b6b8a;
	padding-bottom: 10px;
}

.product-section ul,li{
	list-style: disc; margin: 0px; padding: 0px;
}

.product-section li{
	margin-left: 15px; list-style: disc !important;
}

.product-name {
	width: 100%;
	font-weight: bold;
	text-align: center;
	color: #FFFFFF !important;
}


a.button-sample {
	display: block;
	margin: 0px;
	width: 110px;
	height: 19px;
	background-color: Transparent !important;
	background-image: url(../images/buttons/button-sample.jpg) !important;
	background-repeat: no-repeat !important;
	margin: 0px 0px 0px 0px;
	padding-top: 19px;
	height/* */:/**/0;
	height: /**/0;
	overflow: hidden;
}
a:hover.button-sample {
	background-image: url(../images/buttons/sample-on.jpg) !important;
}

.button-order a {
	display: block;
	margin: 0px;
	width: 110px;
	height: 19px;
	background-color: Transparent !important;
	background-image: url(../images/buttons/button-order.jpg) !important;
	background-repeat: no-repeat !important;
	margin: 0px 0px 9px 0px;
	padding-top: 19px;
	height/* */:/**/0;
	height: /**/0;
	overflow: hidden;
}
.button-order a:hover {
	background-image: url(../images/buttons/order-on.jpg) !important;
}



sup { font-size: 8px !important; }



.ultitle { margin-bottom: 0px; text-transform: capitalize !important; }
.li1 { margin-top: 0px; }