﻿/* 
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
*/

.clearfix:after
{
    clear: both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
}

.clearfix
{
    display: inline-block;
}

/* Hide from IE Mac \*/
.clearfix
{
    display: block;
}
/* End hide from IE Mac */

/* --------- 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;
    width: 790px;
    background-color: #fff;
    border: solid 5px #939598;
}
#bbContainer
{
    background-color: #000;
}
#byContainer
{
    float: left;
    margin: 13px;
    width: 770px;
    background-color: #FFE384;
    border: 2px solid #fff;
}
#bwContainer
{
    margin: 12px 0 0 10px;
    width: 750px;
    position: relative;
    background-color: #FFF;
}
#contentSection
{
    width: 750px;
    height: 510px;
    position: relative;
    background-color: #fff;
    margin:10px;
}
#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: 372px;
    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: 372px;
    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: 168px;
    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;
}

/*  ---------  video section --------- */
#video
{
    background-color: #ffe69c;
    width: 208px;
    height: 108px;
    position: absolute;
    top: 372px;
    left: 540px;
    overflow: hidden;
}
#video a
{
    display: block;
}
#video-thumbnail
{
    background: #ffe69c url(../images/videolink-bkg.jpg) center top no-repeat;
    text-align: center;
    width: 213px;
    height: 73px;
}
#video-thumbnail img
{
    width: 120px;
    height: 67px;
    overflow: hidden;
    padding: 2px 0 0 0;
}
#diamond
{
    width: 63px;
    height: 64px;
    position: absolute;
    top: 215px;
    left: 89px;
    overflow: hidden;
}
#ytPlayer
{
}

/*  ---------  10. prefered card --------- */
#prefcardBox9
{
    position: absolute;
    top: 371px;
    left: 145px;
    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: 0px;
    padding: 2px 0 0 0;
}
#mainNavBox4 ul li
{
    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: 15px;
}
#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: 483px;
    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: 5px;
    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
{
    text-align:center;
    font-size: 9px;
    color: #808080;
}
#footer p
{
    margin:10px 0;
}
#footer span
{
    background-color:#e0e7d2;
}
#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: 790px;
    height: 114px;
    background-color: #fff;
}
#logoBlock
{
    margin: 3px;
    width: 144px;
    height: 60px;
    background-color: #93AA5C;
}
#logoBlank
{
    margin: -63px 0px 3px 150px;
    width: 637px;
    height: 60px;
    background-color: #93AA5C;
}
#logoBlock img
{
    margin-left: 8px;
}
#titleBlock
{
    margin: 3px;
    width: 784px;
    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: 3px;
    width: 784px;
    height: 24px;
    background-color: #000;
}
#contentBlock
{
    position: relative;
    width: 784px;
    min-height: 409px;
    margin: 3px;
    background-color: #fff;
    overflow: hidden;
}
#subPgFooter
{
    width: 784px;
    height: 35px;
    background-color: #000;
    margin:3px;
    clear:both;
}
#subPgFooter table
{
    margin-top: 2px;
    margin-left: 20px;
    color: #000;
}

td.bottomNavSp
{
    text-align: left;
    padding-left: 10px;
    font-size: 10px;
}
.copyright
{
    font-size: 9px;
    color: #939598;
    text-align: center;
}

#mainContent
{
    float: left;
    width:637px;
}
#mainContent.nosidebar
{
    float:left;
    width:784px;
}

#topNavBlock table
{
    margin: 3px auto;
    font-size: 11px;
    font-weight: 600;
    color: #fff;
}

td.topNavSp
{
    text-align: left;
    padding-left: 7px;
}

.logo
{
    margin: 2px 0 0 2px;
}

#colOne
{
    width: 150px;
    float:left;
    z-index: 10;
}
.sidebar-section
{
    margin:3px;
    background-color: #93AA5C;
    padding: 20px;
}
.sidebar-section ul li
{
    margin-top: 7px;
    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: 630px;
    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;
}


