/*************************************************************************/
/**************************** general ***********************************/

html, body{
	height:100%;
	margin:0;
	padding:0;
	font:12px/16px Arial, Helvetica, sans-serif;
	color:#4E4A40;
	background:#FDFDFC url(/images/bg-bodyRepeat.gif) repeat-x;
}
#outer{
	min-height:100%;
	background:transparent url(/images/bg-top.gif) repeat-x top center;
}
* html #outer{ /* IE6 */
	height:100%;
}
#container, #containerHome{
	width:950px;
	margin:0 auto;
	padding-bottom:80px; /* space between content and footer */
	background:transparent url(../images/bg-sideNav.png) top left no-repeat;
}
#containerHome{
	background:none;
}
a.logo{
	width:250px;
	height:110px;
	float:left;
	display:block;
	background:url(/images/logo-DeWils.gif) no-repeat;
}

/*************************************************************************/
/****************************** main nav *********************************/

#nav{
	padding:80px 0 14px 0;
	font-size:13px;
	font-weight:bold;
	text-align:right;
}
#nav a{
	padding:0 3px 0 3px;
}

/*************************************************************************/
/****************************** side nav *********************************/

/* general pages */
#sideNav{
	margin:0;
	padding:0;
	clear:both;
	font-size:14px;
}
#sideNav ul{
}
#sideNav li{
	margin:0;
	padding:8px 0 0 14px;
	list-style:none;
	background:url(/images/li-bullet.gif) no-repeat 0 12px;
}

/* accordion pages */
#sideNavAccordion{
	margin:0;
	padding:0;
	clear:both;
}
#sideNavAccordion ul{
}
#sideNavAccordion li{
	margin:0;
	padding:0 0 0 14px;
	list-style:none;
	background:url(/images/li-bullet.gif) no-repeat 0 3px;
}

/*************************************************************************/
/***************************** home DIVs *********************************/

#homeFlash{
	padding-top:30px;
}
#canvasContainer, #fallback, #myCanvas {
	width:952px;
	height:502px;
	margin:0 auto;
	position:relative;
	overflow:hidden;
}
#fallback, #myCanvas {
	height:365px;
	width:950px;
	border:1px solid #beb4a5;
	border-bottom:1px solid #ffffff;	
}
#myCanvas {
	display:block;
	text-decoration:none;
	color:inherit;
}
#myCanvas:hover {
	color:inherit;
}
#fallback {
	border:none;
}
.fancy {
	position:absolute;
	width:0;
	height:73px;
	top:0;
	left:0;
	opacity:0;
}
.fancy div {
	opacity:0;
	height:45px;
	text-align:center;
	font-weight:bold;
	font-size:20px;
	padding-top:28px;
	width:0;
	font-family:"Century Gothic",Arial,Helvetica,sans-serif;
}
#bannerimg {
	width:950px;
	height:365px;
}
#canvasFooter {
	width:950px;height:134px;border:1px solid #beb4a5;border-top:none;
}
.canvasBucket {
	display:block;
	position:relative;
	width:316px;
	height:134px;
	float:left;
	font-family:"Century Gothic",Arial,Helvetica,sans-serif;
	cursor:pointer;
}
.canvasBucket div {
	position:absolute;
	left:170px;
	top:20px;
	width:138px;
}
.canvasBucket div h3 {
	font-weight:bold;
	font-size:14px;
	margin:0 0 5px;
}
.canvasBucket div p {
	font-weight:normal;
	font-size:12px;
	margin:0 0 5px;
	line-height:14px;
}
.canvasBucket div h4 {
	font-weight:normal;
	font-size:12px;
	color:#88322e;
	background:url(../images/bullet.png) no-repeat 4px left;
	margin:0 0 5px;
	padding-left:12px;
}
#bucket1, #bucket2 {
	border-right:1px solid #ffffff;
}
#bucket1 {
	background:url(../images/bucket1.jpg) no-repeat top left;
}
#bucket2 {
	background:url(../images/bucket2.jpg) no-repeat top left;
}
#bucket3 {
	background:url(../images/bucket3.jpg) no-repeat top left;
}
#canvasFooter .canvasBucket {
	text-decoration:none;
	color:inherit;
}
#canvasFooter .canvasBucket:hover {
	background-position:0px -134px;
	text-decoration:none;
	color:inherit;
}
#frontvidcontainer {
	height:365px;
	width:950px;
	display:none;
	position:relative;
	background:#ffffff;
}
#frontvid {
	width:569px;
	height:320px;
	position:absolute;
	top:32px;
	left:190px;
}
#closefrontvid {
	position:absolute;
	cursor:pointer;
	height:11px;
	width:48px;
	text-align:right;
	top:10px;
	left:712px;
	background:url(../images/btn-close.png) no-repeat top right;
}

/*************************************************************************/
/*************************** content DIVs ********************************/

#left{
	width:210px;
	float:left;
	margin:20px 0 0 40px;
	_margin:20px 0 0 20px; /* IE6 */
	position:relative;
}
#right{
	width:655px;
	margin:20px 0 0 0;
	float:right;
}
#clear{ /* brings #copy div back into the flow */
	clear:both;
}
#productLine{ /*product line descriptions in the 'why dewils' section */
	height:135px;
	margin-bottom:20px;
	clear:both;
}

/*************************************************************************/
/************************** order brochure *******************************/

#brochure{
	height:500px;
	padding-top:30px;
	background:transparent url(/images/photo-brochureBg.jpg) no-repeat bottom;
}
#brochureForm{
	width:400px;
	padding:90px 0 0 42px;
}

/*************************************************************************/
/*************************** submit recipe *******************************/

#recipe{
	height:500px;
	padding-top:30px;
	color:#25231D;
	background:transparent url(/images/photo-recipeBg.jpg) no-repeat bottom;
}
#recipeForm{
	width:392px;
	height:408px;
	margin-top:90px;
	padding:0 0 0 42px;
	overflow:auto;
}
#recipeResults{
	margin-bottom:15px;
	background:#FFFFFF;
	border:1px solid #B3B3B3;
}
#recipeResults td{
	border-right:1px solid #B3B3B3;
}

/*************************************************************************/
/************************** dealer locator *******************************/

#dealer{
	height:500px;
	padding-top:30px;
	background:transparent url(/images/photo-dealerBg.jpg) no-repeat bottom;
}
#dealerForm, #international{
	width:315px;
	height:410px;
	margin:90px 0 0 42px;
	float:left;
	overflow-y:scroll;
}
#dealerForm{
	overflow:hidden;	
}
*html #dealerForm, *html #international{ /* IE6 */
	margin-top:120px;
}
*:first-child+html #dealerForm, *:first-child+html #international{ /* IE7 */
	margin-top:120px;
}
#internationalLinks{ /* flag links on locator page */
	width:430px;
	margin:20px 0 0 0;
	padding:0;
	float:right;
	list-style:none;
	display:inline;
	color:#FFFFFF;
}
#internationalLinks li{
	margin:0;
	padding:0 0 0 10px;
	list-style:none;
	display:inline;
}
#intLocation{ /* international addresses */
	margin-bottom:15px;
	padding-bottom:15px;
	border-bottom:1px solid #BEB4A5;
}

/***** map popup *****/
#address-bar{
	width:760px;
	margin:0 20px;
	padding:10px 0 5px 0;
	float:left;
	font-size:14px;
	border-bottom:1px solid #3C3932;
}
#address{
	float:left;
}
#print-address{
	float:right;
}
#map-canvas{ /* size of google map */
	width:760px;
	height:350px;
	margin-left:20px;
	clear:both;
}
#directions-form{
	margin:0 20px;
	padding:5px 0=;
	border-top:1px solid #3C3932;
}
#directions-panel{
	margin:0 20px;
	padding:10px;
	border-top:1px solid #3C3932;
}

/*************************************************************************/
/***************************** sitemap ***********************************/

#sitemap{
	height:500px;
	padding-top:30px;
	background:transparent url(/images/photo-sitemapBg.jpg) no-repeat bottom;
}
#sitemapLinks{
	width:315px;
	height:410px;
	padding:90px 0 0 42px;
}
#sitemapLinks ul{
	margin:0;
	padding:0;
	list-style:none;
}
#sitemapLinks li{
	padding:8px 0 0 14px;
	background:url(/images/li-bullet.gif) no-repeat 0 12px;
}
#sitemapLinks #sub{
	margin:0;
	padding:3px 0 0 20px;
}
#sitemapLinks #sub li{
	margin:0;
	padding:1px 0 1px 15px;
	background:url(/images/li-bullet.gif) no-repeat 0 4px;
}

/*************************************************************************/
/***************************** 404 page **********************************/

#error404{
	height:500px;
	padding-top:30px;
	background:transparent url(/images/photo-404Bg.jpg) no-repeat bottom;
}

/*************************************************************************/
/****************************** footer ***********************************/

#btm{
	height:50px;
	position:relative;
	clear:both;
	margin:-51px auto 0 auto; /* bottom of page minus height of footer; center */
	background-color:#D1C6B6;
	border-top:1px solid #BEB4A5;
}
#btmInner{
	width:950px;
	margin:0 auto;
	font-size:11px;
	font-weight:bold;
}
.btmLeft{
	width:250px;
	height:50px;
	float:left;
	text-align:center;
	line-height:48px;
	background:#FFFFFF;
}
.btmRight{
	float:right;
	line-height:48px;
	text-align:right;
}
.btmCenter{
	height:50px;
	margin-left:45px;
	float:left;
	text-align:center;
	line-height:48px;
}

/*************************************************************************/
/**************************** text styles ********************************/

p{
	padding:0;
	margin-top:0;
	margin-bottom:15px;
}
h1, h2{
	margin:0 0 15px 0;
	padding:7px 0 20px 0;
	font-size:16px;
	border-bottom:1px solid #BBB39E;
}
h3{
	font-size:14px;
}
.pullQuote{
	margin:20px;
	padding:15px 15px 5px 15px;
	clear:both;
	background:#ECE5DA;
	font-style:italic;
}
.floatLeft{
	float:left;
	padding:2px 20px 10px 0;
}
.floatRight{
	float:right;
	padding:13px 0 2px 10px;
}
input, textarea, select{
	width:230px;
	height:18px;
	margin:4px 0 4px 0;
	background:#FFFFFF;
	border:1px solid #3B3B3B;
}
textarea{
	height:70px;
}
select{
	height:20px;
}

/*************************************************************************/
/***************************** linkage ***********************************/

/* default */
a:link, a:visited, a:active {color:#88322E; text-decoration:underline;}
a:hover{color:#660000; text-decoration:underline;}

/* nav */
#nav a:link, #nav a:visited, #nav a:active{color:#4E4A40; text-decoration:none;}
#nav a:hover, #nav a.selected, #container #nav a.selected{color:#88322E; text-decoration:none;}

/* footer */
#btm a:link, #btm a:visited, #btm a:active{color:#4E4A40; text-decoration:none;}
#btm a:hover, #btm a.selected{color:#88322E; text-decoration:none;}

/* side nav */
#left a:link, #left a:visited, #left a:active {color:#4E4A40; text-decoration:none;}
#left a:hover{color:#88322E; text-decoration:none;}
#left a.selected{color:#88322E; font-weight:bold; text-decoration:none;}

/* sitemap links */
#sitemap a:link, #sitemap a:visited, #sitemap a:active {color:#4E4A40; text-decoration:none;}
#sitemap a:hover{color:#88322E; text-decoration:none;}

#error404 a:link, #error404 a:visited, #error404 a:active {color:#4E4A40; text-decoration:none;}
#error404 a:hover{color:#88322E; text-decoration:none;}

