/*-------------------------------------
Project: 
	Fuzzyface - Web Site Design
	Reference#: dazil-002
File:
	screen.css
Media: 
	Screen
Date: 
	05 November 2005
Author:
	Marco Battilana
	Crazy Bat Designs - http://crazybat.ca
-------------------------------------*/
/*-------------------------------------
Globals
-------------------------------------*/
* {
	margin: 0;
	padding: 0;
}
html, body {
    height: 100%;
    color: #fff;
    background: url(../gfx/bg.jpg) 0 0 #ac9c78;
    /*filter: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=white,endColorStr=#cccccc);*/
    border: 0;
    font: 90%/125% "Trebuchet MS", sans-serif;
}



img {
	border: 0;
}
a {
	color: #fff;
	text-decoration: none;
}

	body#doclinks #container #content dt a {
	color: #fff;
	}

p.center {
display: block
text-align: center;
}
.skip,
.offleft {
	/*----------
	Content - off-left image replacement
	http://css-discuss.incutio.com/?page=ScreenreaderVisibility
	----------*/
	position: absolute;
	left: -9999px;
	width: 990px;
	overflow: hidden;
}

table {

}
/*-------------------------------------
Container styles
-------------------------------------*/
#container {
    position: relative;
    width: 780px;
    margin: 0 auto;
    min-height: 100%;
} 
* html #container
{
	height: 100%;
}
/*-------------------------------------
Banner styles 
-------------------------------------*/
#banner {
	float: left;
	padding: 20px 0 0 0;
}
#banner h1 {
	display: block;
	width: 235px;
	height: 305px;
	color: #000;
	background: transparent url(../gfx/logo.png) 0% 0% no-repeat;
}
	/*-------------------------------------
	Banner - Unique quotes
	to show the quotes for each apropriate page
	-------------------------------------*/
#docalwaysshare #banner .quote,
#doccontact #banner .quote,
#docfanclub #banner .quote,
#docfetch #banner .quote,
#docflavors #banner .quote,
#docgear #banner .quote,
#doclinks #banner .quote,
#docourstory #banner .quote {
	display: block;
	width: 235px;
	height: 230px;
}
#docalwaysshare #banner .quote {
	color: #000;
	background: transparent url(../gfx/quote-alwaysshare.gif) 50% 0% no-repeat;
}
#doccontact #banner .quote {
	color: #000;
	background: transparent url(../gfx/quote-contact.gif) 50% 0% no-repeat;
}
#docfanclub #banner .quote {
	color: #000;
	background: transparent url(../gfx/quote-fanclub.gif) 50% 0% no-repeat;
}
#docfetch #banner .quote {
	color: #000;
	background: transparent url(../gfx/quote-fetch.gif) 50% 0% no-repeat;
}
#docflavors #banner .quote {
	color: #000;
	background: transparent url(../gfx/quote-flavors.gif) 50% 0% no-repeat;
}
#docgear #banner .quote {
	color: #000;
	background: transparent url(../gfx/quote-gear.gif) 50% 0% no-repeat;
}
#doclinks #banner .quote {
	color: #000;
	background: transparent url(../gfx/quote-links.gif) 50% 0% no-repeat;
}
#docourstory #banner .quote {
	color: #000;
	background: transparent url(../gfx/quote-ourstory.gif) 50% 0% no-repeat;
}
/*-------------------------------------
Toolbar styles
-------------------------------------*/
#toolbar {
	width: 540px;
	color: #000;
	margin: 0 0 0 235px;
	padding: 20px 0 10px 0;
}
#toolbar ul {
	height: 100px;
	list-style: none;
}
#toolbar ul li {
	float: left;
}
#toolbar ul li a {
	display: block;
	width: 67px;
	height: 80px;
}
#toolbar ul li#ourstory {
	color: #000;
	background: transparent url(../gfx/nav-ourstory-mo.gif) center top no-repeat;
}
#toolbar ul li#ourstory a {
	color: #000;
	background: transparent url(../gfx/nav-ourstory.gif) center top no-repeat;
}
#toolbar ul li#flavors {
	color: #000;
	background: transparent url(../gfx/nav-flavors-mo.gif) center top no-repeat;
}
#toolbar ul li#flavors a {
	color: #000;
	background: transparent url(../gfx/nav-flavors.gif) center top no-repeat;
}
#toolbar ul li#gear {
	color: #000;
	background: transparent url(../gfx/nav-gear-mo.gif) center top no-repeat;
}
#toolbar ul li#gear a {
	color: #000;
	background: transparent url(../gfx/nav-gear.gif) center top no-repeat;
}
#toolbar ul li#fetch {
	color: #000;
	background: transparent url(../gfx/nav-fetch-mo.gif) center top no-repeat;
}
#toolbar ul li#fetch a {
	color: #000;
	background: transparent url(../gfx/nav-fetch.gif) center top no-repeat;
}
#toolbar ul li#alwaysshare {
	color: #000;
	background: transparent url(../gfx/nav-alwaysshare-mo.gif) center top no-repeat;
}
#toolbar ul li#alwaysshare a {
	color: #000;
	background: transparent url(../gfx/nav-alwaysshare.gif) center top no-repeat;
}
#toolbar ul li#fanclub {
	color: #000;
	background: transparent url(../gfx/nav-fanclub-mo.gif) center top no-repeat;
}
#toolbar ul li#fanclub a {
	color: #000;
	background: transparent url(../gfx/nav-fanclub.gif) center top no-repeat;
}
#toolbar ul li#contact {
	color: #000;
	background: transparent url(../gfx/nav-contact-mo.gif) center top no-repeat;
}
#toolbar ul li#contact a {
	color: #000;
	background: transparent url(../gfx/nav-contact.gif) center top no-repeat;
}
#toolbar ul li#links {
	color: #000;
	background: transparent url(../gfx/nav-links-mo.gif) center top no-repeat;
}
#toolbar ul li#links a {
	color: #000;
	background: transparent url(../gfx/nav-links.gif) center top no-repeat;
}
#toolbar ul li#ourstory a:hover,
#toolbar ul li#flavors a:hover,
#toolbar ul li#gear a:hover,
#toolbar ul li#fetch a:hover,
#toolbar ul li#alwaysshare a:hover,
#toolbar ul li#fanclub a:hover,
#toolbar ul li#contact a:hover,
#toolbar ul li#links a:hover {
	background: none;
}
	/*-------------------------------------
	Toolbar - You are here styles
	-------------------------------------*/
#docourstory #ourstory #navourstory {
	color: #000;
	background: transparent url(../gfx/nav-ourstory-mo.gif) 50% 0% no-repeat;
}
#docflavors #flavors #navflavors {
	color: #000;
	background: transparent url(../gfx/nav-flavors-mo.gif) 50% 0% no-repeat;
}
#docgear #gear #navgear {
	color: #000;
	background: transparent url(../gfx/nav-gear-mo.gif) 50% 0% no-repeat;
}
#docfetch #fetch #navfetch {
	color: #000;
	background: transparent url(../gfx/nav-fetch-mo.gif) 50% 0% no-repeat;
}
#docalwaysshare #alwaysshare #navalwaysshare {
	color: #000;
	background: transparent url(../gfx/nav-alwaysshare-mo.gif) 50% 0% no-repeat;
}
#docfanclub #fanclub #navfanclub {
	color: #000;
	background: transparent url(../gfx/nav-fanclub-mo.gif) 50% 0% no-repeat;
}
#doccontact #contact #navcontact {
	color: #000;
	background: transparent url(../gfx/nav-contact-mo.gif) 50% 0% no-repeat;
}
#doclinks #links #navlinks {
	color: #000;
	background: transparent url(../gfx/nav-links-mo.gif) 50% 0% no-repeat;
}
/*-------------------------------------
Content styles
-------------------------------------*/
#content {
	margin: 0 0 60px 235px;
	text-align: center;
}
#content dd {
	padding: 0 0 25px 0;
}
#content h3 {
	padding: 0 0 10px 0;
}
#content p {
	padding: 0 0 10px 0;
}
#content .smalltext {
	font-size: 0.9em;
}
	/*-------------------------------------
	Content styles - imagecontainer
	-------------------------------------*/
#content .imagecontainer {
	padding: 0 5px 5px 0;
}
	/*-------------------------------------
	Content styles - index page
	-------------------------------------*/
body#docindex {
	filter: none;
	width: 100%;
}
#index-layout {
	width: 780px;
	height: 95%;
	min-height: 95%;
	margin: 0 auto;
	padding: 0;
	text-align: center;
}
#index-banner h2 {
	display: block;
	width: 99%;
	height: 20px;
	color: #000;
	/*background: transparent url(../gfx/index-header-bg.gif) 50% 0% no-repeat;*/
}
#index-footer h3 {
	display: block;
	width: 99%;
	height: 45px;
	background: transparent url(../gfx/footer-bg.gif) 50% 0% no-repeat;
}
	/*-------------------------------------
	Content styles - flavor page
	-------------------------------------*/
#content ul#flavorimages {
	list-style: none;
	width: 450px;
	height: 90px;
	margin: 10px 82px;
}
#content ul#flavorimages li,
#content ul#flavorimages li a {
	float: left;
	display: block;
	width: 100px;
	height: 100px;	
}
#content ul#flavorimages li {
	margin: 0 10px 5px 0;
}
#content li#choconana {
	background: url(../gfx/flavors/icon-choco-nana.gif) 0% 0% no-repeat;
}
#content li#applecarrot {
	background: url(../gfx/flavors/icon-apple-carrot.gif) 0% 0% no-repeat;
}
#content ul#flavorimages li#carrotginger {
	background: url(../gfx/flavors/icon-carrot-ginger.gif) 0% 0% no-repeat;
	margin-left: -7px;
}
#content li#nutsberries {
	background: url(../gfx/flavors/icon-nuts-berries.gif) 0% 0% no-repeat;
}
#content li#cinnamonpumpkin {
	background: url(../gfx/flavors/icon-cinnnamon-pumpkin.gif) 0% 0% no-repeat;
}
#content li#nanacoconuts {
	background: url(../gfx/flavors/icon-nanas-coconut.gif) 0% 0% no-repeat;
}
#content li#yamsgreens {
	background: url(../gfx/flavors/icon-yams-greens.gif) 0% 0% no-repeat;
}
#content li#applescinnamon {
	background: url(../gfx/flavors/icon-apple-cinnamon.gif) 0% 0% no-repeat;
}
#content li#peanutbutter {
	background: url(../gfx/flavors/icon-peanutbutter.gif) 0% 0% no-repeat;
}
	/*-------------------------------------
	Content styles - Misc
	-------------------------------------*/
#content .leftalign {
	float: left;
}
#content .clearleft {
	clear: left;
}
#content .clearright {
	clear: right;
}
#content .clear {
	clear: both;
}
/*-------------------------------------
Footer styles
-------------------------------------*/
#footer {
	position: relative;
	margin: -60px 0 0 0;
}
#footer h3 {
	display: block;
	width: 99%;
	height: 45px;
	color: #000;
	background: transparent url(../gfx/footer-bg.gif) 50% 0% no-repeat;
}