/* 

STYLE SHEET FOR www.Heinens.com WEB SITE
Created by MyWebGrocer development

ToC

	1. defaults
	2. structure
	3. logo
	4. welcome
	5. weekly circular left center
	6. center area with image
	7. recipe bottom left
	8. wine, cheese and gift cards
	9. email sign-up
	10. prefered card
	11. top navigation
	12. content area navigation
	13. bottom navigation
	14. footer

Notes

*/



/* --------- 1. defaults  --------- */

*      {
		margin: 0;
		padding: 0;
		}

body {
		font-family: Arial, Helvetica, sans-serif;
		font-size: 11px;
		color: #000;
		background-image:  url(../images/background_Pixel.gif);
		background-repeat: repeat-x repeat-y;
} 
		
/*  --------- 2. structure  --------- */
.background
{
BACKGROUND-COLOR: #808080;
}	
.backgroundch
{
BACKGROUND-COLOR:#FDBF57;
}		
.backgroundde
{
BACKGROUND-COLOR:#D9541E;

}
.backgrounddep
{
BACKGROUND-COLOR:#933C06;
}
.backgroundflo
{
BACKGROUND-COLOR:#F7BFC3;
}
.backgroundgro
{
BACKGROUND-COLOR:#E36F1E;
}
.backgroundpre
{
BACKGROUND-COLOR:#E7A614;
}
.backgroundpro
{
BACKGROUND-COLOR:#8EC63F;
}
.backgroundsea
{
BACKGROUND-COLOR:#F9A989;
}
.backgroundwin
{
BACKGROUND-COLOR:#762123;
}
.backgroundhea
{
BACKGROUND-COLOR:#B5121B;
}
.backgroundbak
{
BACKGROUND-COLOR:#F1C485;
}


#wrapper {
	       margin: 25px auto 0 auto;
	       width: 800px;
	       }
	  	       
#Subwrapper 
{
		   
	       margin: 25px auto 0 auto;
	       width: 792px;
	       height: 561px;
	       background-color: #fff;
	       border: solid 5px #939598;
	       }
	       
#bbContainer {
				position: relative;
				width: 800px; 
				height: 561px; 
				background-color: #000; /*#231F20;*/
				}
		   
		   
#byContainer {
				
				position: absolute;
				top:12px;
				left:13px;	
				width: 770px; 
				height: 533px; 
				background-color: #FFE384;
				border: 2px solid #fff;
				}
				
#bwContainer {
				margin: 12px 0 0 10px; 
				width: 750px; 
				height: 508px;
				position: relative; 
				background-color: #FFF;
				}
				
#contentSection {
				position: relative;
				top: 0px;
				left: 0px;
				width: 750px;
				height: 508px;
				background-color: Transparent
				}

#cover {
	    position: absolute;
	    top: 596px;
	    width: 792px;
	    height: 230px;
	    background-image:  url(../images/background_Pixel.gif);
		background-repeat: repeat-x repeat-y;	
		z-index:26;
}			
/*  ---------  3. logo --------- */
				
#logoBox1 {
				position: absolute;
				top: 2px;
				left: 2px;
				background-color: #93AA5C;
				width: 160px;
				height: 74px;
				}
		

#logoBox1 img { margin-left: 25px; margin-top: 6px; }

#facebookTwitter{padding: 28px 5px 0px 00px; float:right;}
				
/*  ---------  4. welcome --------- */
				
#welcomeBox2 {
				position: absolute;
				top: 2px;
				left: 164px;
				background-color: #93AA5C;
				width: 584px;
				height: 74px;
				}
				
#welcomeBox2 .text 
{
	position: absolute;
	top: 23px;
	left: 15px;
}

#welcomeBox2 .img 
{
	position: absolute;
	top: 23px;
	left: 13px;
}
				
/*  --------- 5. weekly circular left center --------- */
				
#shoppingBox3 {
				position: absolute;
				top: 78px;
				left: 2px;
				background-color: #a48860;
				width: 160px;
				height: 291px;
				}
				
#shoppingNav
{
	margin: 22px 0 0 27px;
	padding: 0;
}
#shoppingNav .shoppingNavHealthy 
{
	margin: 0 0 0 -16px;
	padding: 0;
}
					
#shoppingBox3 ul 

{
	
list-style-type: none;

}

#shoppingBox3 li 

{
	margin: 12px 0 0 0px;
	padding-top: 15px;
	font-family: Copperplate Gothic Light;
	font-size: 15px;
	font-weight: bold;
	 

}
			
 					
/*  ---------  6. center area with image --------- */

#cenImgBox5 {
				position: absolute;
				top: 106px;
				left: 165px;
				background-color: #FFE89B;
				width: 335px;
				height: 263px;
				}
				
#cenTxtBox
{
	position: absolute;
	top: 106px;
	left: 502px;
	background-color: #FFE89B;
	width: 246px;
	height: 263px;
}

#cenTxtBox img 
{
	position: absolute;
	top: 90px;
	left: 20px;
}
							
/*  ---------  7. recipe bottom left --------- */
				
#recipesBox6 {
				position: absolute;
				top: 371px;
				left: 2px;
				background-color: #A07C4D;
				width: 160px;
				height: 108px;
				}
				
#recipesBox6 img {
					position: absolute;
					top: 0px;
					left:0px;
				/*	z-index: 20;*/
					}
					
/*  ---------  8. wine, cheese and gift cards --------- */
				
#giftBox7 {
				position: absolute;
				top: 371px;
				left: 164px;
				background-color: #FFE89B;
				width: 142px;
				height: 108px;
				}
				
#giftBox7 img { padding-left: 12px; }	 				
#giftBox7 ul { margin-top: 14px; margin-left: 10px; list-style-type: none; }

#giftBox7 li
{
		padding-left: 5px; 
		padding-bottom: 14px;
		background-image:  url(../images/diamondBullet_bby.gif);
		background-repeat: no-repeat;
		background-position: top left;
	}
										
/*  ---------  9. email sign-up --------- */
	
				
#signupBox8 {
				position: absolute;
				top: 371px;
				left: 308px;
				background-color: #FFE89B;
				width: 274px;
				height: 108px;
				}
				
#signupBox8 h2 {
				margin: 12px 0 0 12px;
				}

#signupBox8 ul { margin-top: 6px; margin-left: 25px; list-style-type: none; }
#signupBox8 li 
{ 
	padding-left: 1px;
	padding-top: 3px; 
	}


.style
{

FONT-SIZE: 10px;
 MARGIN-LEFT: 20px; 
 COLOR: #000
}	

.style1
{
margin-bottom: 0px;
MARGIN-TOP: 0px; 
FONT-SIZE: 12px;
COLOR: #000
}
.style2
{
FONT-WEIGHT:bold;
 COLOR:#93AA5C
}


.heading
{
margin-top: 10px; 
margin-bottom: 0px;
font-size: 11px;
color: #BA2129;
FONT-VARIANT: small-caps
}
.head
{
margin-top: 10px; 
margin-bottom: 0px;
font-size: 11px;
color: #BA2129;

}

.content
{
margin-top: 10px; 
margin-bottom: 0px;
font-size: 10px;
font-weight: normal;
color: #BA2129;
 
}
.colOne {
			position: absolute;
			top: 416px;
			left: 465px;
			font-size: 9px;
			font-weight: bold;
			z-index: 20;
			}
		
	
.colOne img {
				padding-top: 1px;
				padding-left: 10px;
				}

.colTwo {
			position: absolute;
			top: 444px;
			left: 465px;
			font-size: 9px;
			font-weight: bold;
			z-index: 22;
			}

.colTwo img {
				padding-top: 1px;
				padding-left: 10px;
				}

.colThree {
			float: left;
			padding-left: 4px;
			}
			
/*  ---------  10. prefered card --------- */
				
#prefcardBox9 {
				position: absolute;
				top: 371px;
				left: 584px;
				background-color: #FFE89B;
				width: 164px;
				height: 108px;
				}
				
#prefcardBox9 .key {
						position: absolute;
						top: -2px;
						left: 10px;
						width: 104px;
						height: 63px;
						}

#prefcardBox9 .signup {
						font-size: 11px;
						font-weight: 600;
						color: #93AA5C;
						padding-left: 25px;
						line-height: 27px;
 						}
 
 #prefcardBox9 p {
					margin: 12px 0 0 15px;
 					}
				

/*  --------- 11. top navigation --------- */

				
#mainNavBox4 {
				position: absolute;
				top: 78px;
				left: 164px;
				background-color: #000; /*#231F20;*/
				width: 584px;
				height: 25px;
				}
				
#mainNavBox4 ul {
						position: absolute;
						top: 4px; 
						left: 0px;
						padding: 2px 0 0 0;
						}

#mainNavBox4 li {
						margin-left: 10px;
						padding-left: 20px;
						font-size: 10px;
						color: #fff;
						display: inline;
						list-style-type: none;
						background-image:  url(../images/diamondBullet_subpg.gif);
						background-repeat: no-repeat;
						background-position: left center;
						}
#mainNavBox4 a:link { text-decoration: none; }
#mainNavBox4 a:visited { text-decoration: none; }
#mainNavBox4 a:active { text-decoration: none; }
#mainNavBox4 a:hover { text-decoration: none; }
						
/*  ---------  12. content area navigation --------- */						
 
 a.prefcard:link {color: #93AA5C; }
 a.prefcard:visited {color: #93AA5C; }
 a.prefcard:active {color: #93AA5C;}
 a.prefcard:hover {color: #93AA5C;}
 
 a.nav2:link {font-weight: bold; color: #fff;}
 a.nav2:visited {font-weight: bold; color: #fff;}
 a.nav2:active {font-weight: bold; color: #fff;}
 a.nav2:hover {font-weight: bold; color: #fff;}
 
 #shoppingBox3 a:link { text-decoration: none; color: #fff; }
 #shoppingBox3 a:visited { text-decoration: none; color: #fff; }
 #shoppingBox3 a:active { text-decoration: none; color: #fff; }
 #shoppingBox3 a:hover { text-decoration: none; color: #fff; }
 
 #topNavBlock a:link { text-decoration: none; color: #fff; }
 #topNavBlock a:visited { text-decoration: none; color: #fff;  }
 #topNavBlock a:active { text-decoration: none; color: #fff;  }
 #topNavBlock a:hover { text-decoration: none; color: #fff;  }
 
 #subPgFooter a:link { text-decoration: none; color: #fff;}
 #subPgFooter a:visited {text-decoration: none; color: #fff;}
 #subPgFooter a:active {text-decoration: none; color: #fff;}
 #subPgFooter a:hover {text-decoration: none; color: #fff;}
 
 #SidebartopBox a:link { text-decoration: none; color: #fff; font-weight: bold;}
 #SidebartopBox a:visited { text-decoration: none; color: #fff; }
 #SidebartopBox a:active { text-decoration: none; color: #fff; }
 #SidebartopBox a:hover { text-decoration: underline; color: #fff; }
 
 #SidebartopBoxNew a:link { text-decoration: none; color: #fff; font-weight: bold;}
 #SidebartopBoxNew a:visited { text-decoration: none; color: #fff; }
 #SidebartopBoxNew a:active { text-decoration: none; color: #fff; }
 #SidebartopBoxNew a:hover { text-decoration: underline; color: #fff; }
 
 #SidebarbottomBox a:link { text-decoration: none; color: #fff; font-weight: bold;}
 #SidebarbottomBox a:visited { text-decoration: none; color: #fff; }
 #SidebarbottomBox a:active { text-decoration: none; color: #fff; }
 #SidebarbottomBox a:hover { text-decoration: underline; color: #fff; }
 
 a.signLinks:link { text-decoration: none; color: #939598; }
 a.signLinks:visited { text-decoration: none; color: #939598; }
 a.signLinks:active { text-decoration: none; color: #939598; }
 a.signLinks:hover { text-decoration: none; color: #939598; }
 
 
/*  ---------  13. bottom navigation --------- */ 
 		
#botNavBox10 {
				position: absolute;
				top: 481px;
				left: 2px;
				background-color: #000;
				width: 746px;
				height: 25px;
				}
				
#botNavBox10 ul {
					position: absolute;
					top: 4px; 
					left: 162px;
					padding: 3px 0 0 0;
					}
				
					
#botNavBox10 ul li {
						margin-left: 10px;
						padding-left: 20px;
						font-size: 10px;
						color: #fff;
						display: inline;
						list-style-type: none;
						background-image:  url(../images/diamondBullet_subpg.gif);
						background-repeat: no-repeat;
						background-position: left center;
						}

#botNavBox10 a:link { text-decoration: none; }
#botNavBox10 a:visited { text-decoration: none; }
#botNavBox10 a:active { text-decoration: none; }
#botNavBox10 a:hover { text-decoration: none; }
						
/*  ---------  14. footer --------- */
#footer {
			position: absolute;
			top: 535px;
			left: 203px;
			font-size: 9px;
			color: #808080;
			}
			
#footer a:link { text-decoration: none; color: #808080; font-weight: bold;}
#footer a:visited {text-decoration: none; color: #808080; font-weight: bold;}
#footer a:active {text-decoration: none; color: #808080; font-weight: bold;}
#footer a:hover {text-decoration: none; color: #808080; font-weight: bold; }
				

				
/*  --------- subpage structure --------- */

#header {
			margin: 0;
			width: 792px;
			height: 114px;
			background-color: #fff;
			}	
			
			
#logoBlock {
				margin: 3px;
				width: 144px;
				height: 60px;
				background-color: #93AA5C;
				}
#logoBlank {
			margin: -63px 0px 3px 150px; 
			width: 639px;
			height: 60px;
			background-color: #93AA5C;
}				
#logoBlock img
{
	margin-left: 10px;
	/*margin-top: 2px;*/
}
	
				
#titleBlock {
					margin:3px 0 0 3px;
					width: 786px;
					height: 24px;
					}	
 				
#titleBlock img 
{
	margin-right: 10px;
}
#titleBlock h1 
{
	padding-top: 4px;
	font-size: 14px;
	font-family: Copperplate Gothic Light;
	color: #fff;
}
					
#topNavBlock {
			   margin-left: 3px;
			   width: 786px;
			   height: 24px;
			   background-color: #000;
			   }
			
#contentBlock {
	position: relative;
	width: 792px;
	height: 420px;
	background-color: #939598;
                }
				
#contentBlockNew {
	position: relative;
	width: 792px;
	height: 410px;
	background-color: #939598;
                }

#subPgFooter {
	          position: absolute;
	          top: 407px;
	          left: 0px;
	          width: 789px;
	          height: 35px;
	          background-color: #000;
	          border: solid 2px #fff;
	         
              }
              
#subPgFooter table
{
	margin: 2px auto 0 auto;
	color: #000;
	
}

td.bottomNavSp  {
		        text-align: left;
	            padding-left: 10px;
	            font-size: 10px;
                }
                
 .copyright 
 {
	font-size: 9px;
	color: #939598;
	text-align:center;
 }
			
#topNavBlock table
{
	margin: 3px auto 0 auto;
	font-size: 11px;
	font-weight: 600;
	color: #fff;
}

td.topNavSp  {
		        text-align: left;
	            padding-left: 5px;
                }
                
                

.logo 
{
	margin: 2px 0 0 2px;
} 

#colOne 
{
	position: absolute;
	background-color: #fff;
	top: 0;
	left: 0;
	width: 152px;
	height:403px;
	z-index: 10;	
}

#colOneNew 
{
	position: absolute;
	background-color: #fff;
	top: 0;
	left: 0;
	width: 204px;
	height:403px;
	z-index: 10;	
}

#SidebartopBox 
{
	position: absolute;
	top: 4px;
	left: 4px;
	width: 144px;
	height: 281px;
	background-color: #93AA5C;
	
	}
	
	#SidebartopBoxNew 
{
	position: absolute;
	top: 3px;
	left: 3px;
	width: 199px;
	height: 403px;
	background-color: #93AA5C;
	height: 397px;
	
	}
	
#SidebartopBox ul
{
	margin-top: 20px;
	margin-left: 25px;
}

#SidebartopBoxNew ul
{
	margin-top: 20px;
	margin-left: 25px;
}

#SidebartopBox ul li 
{
	margin-top: 7px;
	list-style: none;
	color: #fff;
	font-weight: bold;
}

#SidebartopBoxNew ul li 
{
	margin-top: 7px;
	list-style: none;
	color: #fff;
	font-weight: bold;
}


#SidebarbottomBox 
{
	position: absolute;
	top: 289px;
	left: 4px;
	width: 144px;
	height: 110px;
	background-color: #93AA5C;
	
	}
	
#SidebarbottomBox ul
{
	margin-top: 19px;
	margin-left: 25px;
}

#SidebarbottomBox ul li 
{
	margin-top: 8px;
	list-style: none;
	color: #fff;
	font-weight: bold;
}

#colTwo
{
	position:absolute;
	top: 0px;
	left: 150px;
	width: 245px;
	height: 403px;
	background-color: #fff;
}

#colTwo .topPicDept { margin-left: 2px; margin-top: 2px;}

#colTwo .botPicDept { margin-left: 2px; margin-top: 1px;}

#colTwo .topPic { margin-left: 4px; margin-top: 5px;}
#colTwo .botPic { margin-left: 4px; margin-top: 2px;}


#nonDept 
{
	position: absolute;
	top: 0px;
	left: 152px;
	width: 640px;
	height: 403px;
	background-color: #fff;
	overflow: auto;
	}
	
#nonDept h2 { margin-bottom: 10px; padding-left: 265px; font-size: 11px; font-weight: bold; color: #BA2129; }

#nonDept h3 { margin-bottom: 0; padding-left: 265px; font-size: 11px; font-weight:normal; color: #BA2129; }

#nonDept .titleHighlight { margin-bottom: 5px; padding-left: 20px; font-size: 11px; font-weight: bold; color: #BA2129; }

#nonDept .titleUnderline { margin-bottom: 5px; padding-left: 20px; font-size: 11px; font-weight: bold; text-decoration: underline; }

#nonDept p { margin-bottom: 10px; padding-left: 265px; padding-right: 20px; font-size: 11px; color: #000; }
#nonDept .txt { padding-left: 20px; padding-right: 40px; }
#nonDept .rightTxt { margin-top: -5px; margin-left: 265px; }
#nonDept table { margin-left: 100px; margin-top: -5px; margin-bottom: 10px;}
#nonDept td {padding-top: 7px; padding-left: 0px; padding-right: 10px; }


#listLeft 
{
	position: absolute;
	left: 20px;
	top: 30px;
	width: 300px;
	height: 373px;
	
}

#listRight 
{
	position: absolute;
	left: 350px;
	top: 30px;
	width: 200px;
	height: 373px;
}

.level0 {margin-left: 20px; list-style: circle; list-style-position:inside; }
.level1 {margin-left: 50px; list-style: square; list-style-position:inside;}
.level2 {margin-left: 80px; list-style: disc; list-style-position:inside;}
.default li{ margin-bottom: 5px; margin-left: 40px; padding-left: 3px; list-style:disc; }

.highlightList li
{ 
margin-bottom: 5px; 
margin-left: 3px; 
padding-right: 0px;
 padding-left: 10px;
  background-image:  url(../images/star.gif);
   background-repeat: no-repeat; 
   }
  .list
  {

margin-bottom: 5px; 
margin-left: 3px; 
padding-right: 0px;
 padding-left: 10px;
  background-image:  url(../images/star.gif);
   background-repeat: no-repeat; 
   }

  

#tblContent 
{
	position: absolute;
	top: 0px;
	left: 152px;
	width: 640px;
	height: 403px;
	background-color: #fff;
	overflow: auto;
	}
	
	#tblContentNew 
{
	position: absolute;
	top: 0px;
	left: 203px;
	width: 589px;
	height: 403px;
	background-color: #fff;
	overflow: auto;
	}

#tblContent h2 { margin-top: 10px; margin-bottom: 0px; font-size: 11px; font-weight: bold; color: #BA2129; }
#tblContent table {margin-bottom: 10px; }
#tblContent td {padding-right: 20px; padding-top: 2px; vertical-align: top;}
#tblContent p { padding-top: 5px;}
#tblContent h3 { margin-bottom: -2px; margin-top: 15px; font-size: 11px; font-weight: bold; color: #BA2129; }
#tblContent h4 { margin-bottom: 7px; margin-top: 10px; font-size: 11px; font-weight: bold; color: #BA2129; }
#tblContent ul { padding-top: 10px; list-style-type: none; }

#tblContentNew h2 { margin-top: 10px; margin-bottom: 0px; font-size: 11px; font-weight: bold; color: #BA2129; }
#tblContentNew table {margin-bottom: 10px; }
#tblContentNew td {padding-right: 20px; padding-top: 2px; vertical-align: top;}
#tblContentNew p { padding-top: 5px;}
#tblContentNew h3 { margin-bottom: -2px; margin-top: 15px; font-size: 11px; font-weight: bold; color: #BA2129; }
#tblContentNew h4 { margin-bottom: 7px; margin-top: 10px; font-size: 11px; font-weight: bold; color: #BA2129; }
#tblContentNew ul { padding-top: 10px; list-style-type: none; }

#colThree 
{
	position: absolute;
	top: 0px;
	left: 395px;
	width: 397px;
	height: 403px;
	z-index: 24;
}

#colThree h2
{
	padding-left: 18px;
	padding-top: 12px;
	font-weight: bold;
	font-size: 11px;
	color: #BA2129;
}

#colThree p 
{
	padding: 12px 12px 12px 18px;
	color: Black;
}

#colThreeTBox 
{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 397px;
	height: 193px;
	background-color: #fff;	
}

#colThreeWithScroll 
{
	position: absolute;
	top: 0px;
	left: 395px;
	width: 397px;
	height: 403px;
	z-index: 25;
	background-color: #fff;	
	overflow: auto;
}

#colThreeWithScroll p 
{
	padding: 12px 12px 12px 18px;
	width: 330px;
	color: #000;
}

#colThreeWithScroll h2
{
	padding-left: 18px;
	padding-top: 12px;
	margin-bottom: -10px;
	font-weight: bold;
	font-size: 11px;
	color: #BA2129;
	
}
#colThreeWithScroll h5
{
	padding: 12px 12px 12px 18px;
	width: 330px;
	color: #000;
	font-size: 9px;
	font-weight: normal;
}


#colThreeTBox p 
{
	padding: 12px 12px 12px 18px;
	color: Black;
}

#colThreeTBox h2
{
	padding-left: 18px;
	padding-top: 12px;
	font-weight: bold;
	font-size: 11px;
	color: #BA2129;
}

#colThreeBBox p
{
	padding: 12px 18px 12px 18px;
	color: Black;
}

#colThreeBBox
{
	position: absolute;
	top: 193px;
	left: 0px;
	width: 397px;
	height: 210px;
	background-color: #fff;
}



.extraDiv {
			margin: 25px 0 25px 0;
			}
			
.extraDiv2 {
			margin: 12px 0 12px 0;
			}			
/*  ---------  flash  --------- */				
#mainPicFinal
{
	position:absolute;
	top: 0px;
	left: 0px;
}

			
/* ---------------scroller ------------			
.scroll-track{	height:12px; width:18px; background-color: #fff; }
.scroll-innerBox { position:relative; top: 0; }
.scroll-handle{	height:12px; width:18px; cursor: default; } 
 /*background-image:url(images/bartab.gif)
background-position:center; background-repeat:no-repeat;*/

/*---------Server-side Messages-------*/
.tError 
{
	color: red;
}


.tSuccess
{
	color: #008241;
	margin-left: 264px;
	font-size: 12px;
}
/*---------Store Locator --------------*/
#LeftCell
{
	
	position:absolute;
	top:3px;
	left: 3px;
	width: 199px;
	height: 396px;
	background-color: #93AA5C;
	z-index:30;
}
.hours {text-align: center;}
#LeftCell img
{
	padding: 0px;
	margin: 10px 0px 5px 12px;
	border: none 0px; 
}
