﻿/* 
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; } 
img {border:none;}
.redText {color:#800000;}
		
/*  --------- 2. structure  --------- */
#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: absolute; 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: 15px; margin-top:7px; }
				
/*  ---------  4. welcome --------- */
#welcomeBox2 { position: absolute; top: 2px; left: 164px; background-color: #93aa5c; width: 584px; height: 74px; overflow:hidden; }
#welcomeBox2 > img { position: absolute; top: 0px; left: 584px; }
#welcomeBox2 > noscript > img { position: absolute; top: 0px; left: 4px; }

#facebookTwitter{float:right; margin: 42px 5px 0px 0px;}
				
/*  --------- 5. weekly circular left center --------- */
#shoppingBox3 { position: absolute; top: 78px; left: 2px; background-color: #a48860; width: 160px; height: 291px; }
#shoppingNav { margin:-5px 0 0 8px; padding:0; }
#shoppingNav .shoppingNavHealthy { margin: 0 0 0 8px; padding: 0; height:297px; }
#shoppingBox3 ul { list-style-type: none; }
#shoppingBox3 li { margin: 12px 0 0 0px; padding-top: 3px; 
                    font-family: Copperplate Gothic Light; font-size: 15px; font-weight: bold; }
#shoppingBox3Image { position:relative; bottom:53px; left:86px;}                    
                    
#RIContent_0{float:left; width:333px; height:259px;background-repeat:repeat-x; margin: 0px 0px 0px 0px;}
	#loadBar_0{ position:relative; top:110px; left:60px; border:2px solid #92AA5C; height:20px; width:200px; padding: 2px 5px 2px 5px;}
		#loadTxt_0{ position:relative; top:-19px; height:20px; width:200px; font-size:14px; text-align:center; color:#A48860; font-weight:600; }
		.FullDot_0{  background-color:#BED7A1; cursor:default; height:20px; width:20px; display:block; float:left;}
		.EmptyDot_0{ background-color:Transparent; cursor:default; height:20px; width:20px; display:block; float:left;}
	#RIcontrols_0{width:100%; position:relative; top:-20px; z-index:999; display:none; font-size:12px; font-weight:600;}
		.prev{float:left; padding-left:5px; margin-top:-5px;} 
		.next{float:right; padding-right:10px; margin-top:-5px;}
		.arrow{font-size:20px; font-weight:500; display:inline;} 
		.RIcontrols a:link{color:#F1E3A6; text-decoration:none;}
		.RIcontrols a:visited{color:#F1E3A6; text-decoration:none;}
		.RIcontrols a:active{color:#F1E3A6; text-decoration:none;}
		.RIcontrols a:hover{color:#CCCCCC; text-decoration:none;}	
	.IMAGE{display:none;}                    
			
 					
/*  ---------  6. center area with image --------- */
#cenImgBox5 {position: absolute; top: 106px; left: 165px; width: 336px; height: 264px; }
#cenTxtBox { position: absolute; top: 106px; left: 502px; background-color: #FFE89B; width: 246px; height: 263px; }
#cenTxtBox ul { position: absolute; top: 64px; left: 10px; padding: 2px 0 0 0; }
#cenTxtBox ul li { background-image:url(../images/diamondBullet_red.gif); background-repeat:no-repeat; 
                    list-style-type:none; background-position:left center; margin-left:30px; margin-top:15px; }
.redBulletSpacing { margin-top:50px; }
#cenTxtBox img { position:relative; top: 0px; left: 20px;  }
#centTxtBoxIMG { position:relative; margin-top:15px; }
							
/*  ---------  7. recipe bottom left --------- */
#recipesBox6 { position: absolute; top: 371px; left: 2px; background-color: #FFE89B; width: 160px; height: 108px; }
#recipesBox6 img { position: absolute; top: 2px; left:12px; }
					
/*  ---------  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: 5px; margin-left: 10px; list-style-type: none; }
#giftBox7 li { padding-left: 5px; padding-bottom: 5px; 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: 230px; 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: 5px; padding-top: 3px; background-image: url(../images/diamondBullet_bby.gif);
		            background-repeat: no-repeat; background-position: left center;   }
#signupBox8 img { padding: 5px 0px 0px 30px; }			
.colOne img { padding-top: 1px; padding-left: 10px; }
#registerBtn { position:relative; margin: 0 0 0 350px; padding-right:10px;}
#signInBtn { position:relative; margin: 450px 230px 0 0px; }
.colTwo img { padding-top: 1px; padding-left: 10px; }
.colThree { float: left; padding-left: 4px; }
			
/*  ---------  10. prefered card --------- */			
#prefcardBox9 { position: absolute; top: 371px; left: 541px; background-color: #FFE89B; width: 208px; 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; }
#prefcardBox9 img { position:relative; top: 4px; left: 6px; border:0px; }
				

/*  --------- 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: 15px; padding: 2px 0 0 0; }
#mainNavBox4 ul li { margin-left:5px; margin-right:5px; 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; padding-left:17px; }
#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; }
 
 #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: 8px; padding: 2px 0 0 0; }					
#botNavBox10 ul li { margin-left: 15px; padding-left: 18px; 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: 521px; 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: 8px; }
#titleBlock { margin:3px 0 0 3px; width: 786px; height: 24px; background-color: #808080; }	
#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; }
#subPgFooter { position: absolute; top: 407px; left: 0px; width: 789px; height: 35px; background-color: #000; border: solid 2px #fff; }            
#subPgFooter table { margin-top: 2px; margin-left: 100px; 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 0 0 135px; font-size: 11px; font-weight: 600; color: #fff; }

td.topNavSp { text-align: left; padding-left: 7px; }

.logo { margin: 2px 0 0 2px; } 

#colOne { position: absolute; background-color: #fff; top: 0; left: 0; width: 152px; height:403px; z-index: 10;	}
#SidebartopBox { position: absolute; top: 4px; left: 4px; width: 144px; height: 281px; background-color: #93AA5C; }
#SidebartopBox ul { margin-top: 20px; margin-left: 25px; }
#SidebartopBox 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; }

#tblContent 
{
	position: absolute;
	top: 0px;
	left: 152px;
	width: 640px;
	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; }
#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; 
}

