/*******************************************************/
/*             PAGE-SPECIFIC STYLES                     /
********************************************************/
/* NOTES  This file contains styles that are specific to certain  pages in the Caribou website.
********************************************************/
/* TRIVIA
This is the trivia blackboard that appears on the home
page. It has one parent: leftbar.
********************************************************/
div#trivia {
  position: absolute;
  right: 0;
  top: 64px;
  color: #FFF;
  width: 146px;
  height: 145px;
  padding: 22px;
  font-size: 85%;
  background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/bg_trivia.png) no-repeat;
  z-index: 700;
}
div#trivia h2 {
  text-transform: none;
  margin: 0 0 8px 22px;
  padding: 0;
  color: #FFF;
  text-indent: -9999em;
  height: 15px;
  width: 101px;
  background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/bg_triviahdr.png) no-repeat;
}
div#trivia div#triviaContent { position: relative; z-index: 800; height: 125px;}
div#trivia p {text-align: center; margin: 0; padding: 0;}
div#trivia p b,
div#trivia p strong {
  font-size: 108%;
  font-weight: bold;
  text-transform: none;
}
div#trivia p.getAnswer, div#trivia p.answer {
  display: block;
  position: absolute;
  bottom: 0;
}
div#trivia p.getAnswer b a {
  display: block;
  font-weight: bold;
  text-transform: none;
  color: #FFF;
  text-indent: -9999em;
  height: 12px;
  width: 131px;
  background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/bg_triviaanswer.png) no-repeat;
  margin: 10px 0 0 10px;
  position: relative;
  z-index: 900;
}
div#trivia p { color: #fff;}

/* HIGHLIGHTS  This is a container for the links that appear under the
trivia blackboard on the home page. It has one parent:  leftbar.
********************************************************/
div#highlights { position: relative; float: left; top: -18px; }
div#highlights p {padding-bottom: 5px;}


/* CONTENT HOME
This is the content column on the home page.
********************************************************/
div#contentHome {
  float: left;
  width: 724px;
  position: relative;
  margin-left: -29px;
  padding: 0 20px 0 0;
  background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/bg_flashshadow.png) no-repeat right bottom;
  z-index: 800;
}

/* FEATURE BAR
This is the bar below the flash on the homepage, featuring
promos and the At Home and AT Work links
********************************************************/
#mainHome div#featureBar { float: left; width: 685px; }
div#featureBar, div#featureBar h4 { color: #2f1e0b; }
div#featureBar h4 { padding-top: 10px; display: block; }
div#featureBar div.feature {
  padding: 20px 20px 0 0;
  width: 180px;
}
div#featureBar div.feature a {
  display: block;
  float: left;
  text-transform: uppercase;
  color: #208d9e;
  margin-top: 10px;
  background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/blt_featurelink.gif) no-repeat center right;
}

div#featureBar div#getCaribou {   float: left;   width: 260px;   padding: 20px 0 0 15px;   font-size: 80%;   background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/divider_homefeature.gif) no-repeat;  }
div#getCaribou img { float: left; margin-right: 15px; }
div#getCaribou h4 {   float: left;   text-indent: -9999em;   background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/bg_getcaribou.png) no-repeat;   height: 21px;   width: 114px;  }
div#getCaribou p { padding: 0 0 10px 0; width: 177px; float: right; }
div#getCaribou p a#atWork, div#getCaribou p a#atHome {   text-indent: -9999em;   display: block;   height: 19px;   width: 164px;   float: left;  }
div#getCaribou p a#atHome { background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/btn_homeathome.png) no-repeat; }
div#getCaribou p a#atWork { background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/btn_homeatwork.png) no-repeat; }

/* Interaction Column Bar HOME
This is the Right bar column on the home page.
The Location form, and the Stay Awake for dynamic
content
********************************************************/
div#interaction {
 position: relative;
 margin-top: 130px;
 float: right;
 width: 235px;
}
div#interaction form {float: left;}
div#interaction form h4 {   background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/bg_hdrfindcaribouhome.gif) no-repeat;   text-indent: -9999em;   float: left;   width: 217px;   height: 47px;   padding-bottom: 5px;  }
div#interaction form input.btn { float: left; }
div#interaction form input.text {   background-color: #f3efeb;
  border: 1px solid #c5c2bd;
  width: 162px;
  color: #91877e;
  font-size: 80%;
  padding: 7px .25em 4px;
  margin-right: 3px;
  float: left;
}
div#interaction div#napkin {
  background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/bg_napkin.png) no-repeat;
  padding: 50px 0 0 50px;
  width: 207px;
  height: 208px;
  float: left;
  margin: 25px 0 0 -46px;
  position: relative;
}
div#interaction div#stayAwake p#stayAwakeType { width: 175px; }
div#interaction div#napkin h4 {
  background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/bg_hdrstayawake.png) no-repeat;
  text-indent: -9999em;
  height:12px;
  width: 127px;
  margin-bottom: 15px;
}
div#napkin span#sIFR_replacement_0_alternate { display: none; }
p#stayAwakeTypeBy {
  font-family:Georgia, "Times New Roman", Times, serif;
  font-size:12px;
  color:#2f1e0b;
  font-weight:bold;
  font-style:italic;
  padding-top: 10px;
}
div#napkin a.thickbox {
  position:absolute;
  bottom: 30px;
  left: 50px;
  text-decoration: underline;
  font-size: 80%;
}

div#interaction ul#socialMedia { padding: 0 20px 0 0; float: right; list-style: none; font-size: 90%; }
div#interaction ul#socialMedia li { font-weight: bold; float: left; }

/* AT HOME / AT WORK
These are sections that appear near the top of the
page on the Caribou at Home & Caribou at Work pages.
********************************************************/
div#atHome, div#atWork {      float: left;      width: 890px;      padding: 10px 15px;      font-size: 100%;      color: #534732;  }
div#atHome h1,  div#atWork h1 {      float: left;      padding: 0 0 10px 20px;      font-size: 167%;      text-transform: uppercase;      color: #36332f;  }
div#atHome a#atWork,  div#atWork a#atHome {      float: right;      margin: 0 28px 10px 0;  }
div#promotions {float: left;width: 890px;padding-bottom: 30px;}
div.promotion {      float: left;      width: 210px;      padding: 0 6px;      text-align: center;  }
div.promotion p {padding-top: 5px;}
div#atWork div#officeCoffee {float: left;width: 248px;padding-left: 50px;}
div#atWork div#officeCoffee p {padding: 5px 0 0 30px;text-align: center;}
div#atWork div#onlyCoffee {float: left;width: 232px;padding-top: 1px;}
div#atWork div#onlyCoffee p {margin-top: -100px;padding: 0 60px 0 50px;font-size: 85%;}
div#atWork div#onlyCoffee p a {color: #534732;}
div#atWork div#onlyCoffee p a:hover {text-decoration: none;}
div#atWork div#tellThem {float: left;width: 284px;padding-left: 20px;}
div#atWork div#tellThem p {padding: 5px 20px 0 20px;text-align: center;}

/* ABOUT OUR COFFEE
The section page for about our coffee
********************************************************/
div#main div.about div.featureRow { width: 630px; padding-bottom: 20px;}
/* From Our Roastmasters style note */
div#leftbar div#about { background: transparent; }
div.aboutStyle div.note { width: 241px;}
div#leftbar div#about h4 {
  background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/bg_roastmasterheader.png) no-repeat;
  height: 71px;
  width: 242px;
  text-indent: -999em;
}

div#leftbar div#about div.video h4 {
  background: none;
  text-indent: 0;
  height: auto;
  width: auto;
}

div#leftbar div#about h5 { font-size: 95%; }
div#leftbar div#about a#blogLink {    display: block;    padding-left: 56px;  }
div#leftbar div#about img.profilePic {
  width: 37px;
  height: 37px;
  border: 1px solid #8cbcc5;
  float: left;
}
div.articleSnippet {
  float: left;
  padding-top: 12px;
}
div.linkAll {width: 200px;}

div.articleSnippet h5, div.articleSnippet p.date  {
  float: right;
  width: 150px;

}

div.leftBar div.articleSnippet p.date  {
  padding-bottom: 0;
}

div.aboutStyle div.noteContent {
  float: left;
  padding: 15px 15px 30px 28px;
  width: 198px;
}

/* COFFEE DESCRIPTION
This is the coffee description that appears on the Our
Coffees and Coffee Recommender Results pages.
********************************************************/
h1#coffeeRecommender {
  background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/bg_hdrcoffeeresults.gif) no-repeat;
  text-indent: -9999em;
}
div.coffeeDesc {
  position: relative;
  float: left;
  width: 100%;
  background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/divider_widecontent.gif) no-repeat bottom;
  padding: 20px 0 20px 0;
}

div.coffeeDesc div.coffeeData {float: left; width: 458px;}
div.coffeeDesc div.image {      float: left;      width: 80px;}
div.coffeeDesc div.info {      position: relative;      float: left;      width: 348px;      padding: 0 14px 0 10px;  }
div.coffeeDesc div.info img {      float: left;  }
div.coffeeDesc ul.loveIt { float: left; width: 350px; list-style: none; padding-left: 20px;}
div#content div.coffeeDesc div.info h3 {      padding: 0;  }
div#content div.coffeeDesc div.info p {      padding-bottom: 2px;  }
div.coffeeDesc div.indicator {
  position: relative;
  height: 11px;
  float: left;
  padding: 10px 0 0 10px;
  margin-bottom: 20px;
  width: 257px;
}
div#content div.coffeeDesc div.indicator p { float: none; padding-bottom: 0; height: 0;}
div.coffeeDesc div.indicator span {
  position: absolute;
  bottom: -4px;
  width: 20px;
  height: 20px;
  text-indent: -99999px;
  background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/icon_turquoise_play.png) no-repeat;
}
div.coffeeDesc span.lightness1 {      left: 17px;  }
div.coffeeDesc span.lightness2 {      left: 42px;  }
div.coffeeDesc span.lightness3 {      left: 67px;  }
div.coffeeDesc span.lightness4 {      left: 92px;  }
div.coffeeDesc span.lightness5 {      left: 117px;  }
div.coffeeDesc span.lightness6 {      left: 142px;  }
div.coffeeDesc span.lightness7 {      left: 167px;  }
div.coffeeDesc span.lightness8 {      left: 192px;  }
div.coffeeDesc span.lightness9 {      left: 217px;  }
div.coffeeDesc span.lightness10 {      left: 242px;  }
div.coffeeDesc div.coffeeRater {
  background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/bg_coffeerating_body.gif) no-repeat left top;
  float:left;
  width: 176px;
  margin-bottom: 10px;
  color: #36332f;
  font-size: 90%;
}
div.coffeeDesc div.coffeeRater h4.rating {
  font-size: 225%;
  width: 45px;
  padding-right: 5px;
  text-align: center;
  float: left;
  color: #75b1be;
}
div.coffeeDesc div.coffeeRater h4.rating span { text-transform: uppercase; font-size: 40%; }
div.coffeeDesc div.coffeeRater p.desc { float: left; text-align: center; width: 95px;}
div.coffeeDesc div.coffeeRater p { width: 146px; padding-top: 5px;}
div.coffeeDesc div.coffeeRater p a {
  display: block;
  width: 146px;
  text-transform: uppercase;
  font-weight: bold;
  color: #75b1be;
}
div.coffeeDesc div.coffeeRater form { float: left; padding: 10px 13px 0; width: 150px; height: 100px; }
div.coffeeDesc div.coffeeRater div.coffeeRaterBtm {
  background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/bg_coffeerating_btm.gif) no-repeat left bottom;
  float: left;
  width: 176px;
  height: 6px;
}
div.coffeeDesc img.coffeeSymbol {    float: left;    padding: 5px 0 0 10px;  }
div.coffeeDesc div.buyNow {
  width: 80px;
  float: left;
}
div.coffeeDesc div.image img { margin-bottom: 5px;}
div.coffeeDesc div.buyNow img { margin-bottom: 0; }
div.coffeeDesc div.buyNow a {
  width:80px;
  float: left;
  padding: 2px 0;
}

/********* Coffee Rating styles *********/
/* jQuery.Rating Plugin CSS - http://www.fyneworks.com/jquery/star-rating/ */
div.star-rating {
  float:left;
  width:20px;
  height:25px;
  text-indent: -9999em;
  cursor:pointer;
  display:block;
  background:transparent;
  overflow:hidden;
}

div.rating-cancel { display: none; }
div.star-rating a {
  background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/icon_bean.png) no-repeat 0 0px;
  display: block;
  width:20px;
  height:100%;
  background-position:0 0px;
  border:0;
}

div.star-rating-on a { background-position:0 -37px !important }
div.star-rating-hover a { background-position:0 -37px !important }

/** Smaller bean size on review Thickbox **/
form.small div.star-rating { width:15px; height:18px; }
form.small div.star-rating a { background:url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/icon_bean_sm.png) no-repeat 0 0px}
form.small div.star-rating a {
  display: block;
  width:15px;
  height:100%;
  background-position:0 0px;
  border:0
}

form.small div.star-rating-on a{background-position:0 -28px!important}
form.small div.star-rating-hover a{background-position:0 -28px}

/********** Coffee Recommender Leftbox specific style ******/
div#leftbar div#fProfile h4 {
  background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/bg_hdrflavorprofile.png) no-repeat;
  text-indent: -9999em;
  height: 69px;
  width: 241px;
}

div#leftbar div#fProfile h5 {
  color:#75B1BE;
  font-size:110%;
  padding-bottom: 5px;
}

/* FORUM
List of comments/articles in AMY'S STORY
********************************************************/
div.forum {      position: relative;      float: left;      width: 100%;      border-top: 1px solid #bdb4a1;      padding: 10px 0 10px 0;  }
div.forum a {    float: left;  }
div.forum div.comment {      position: relative;      float: left;      width: 520px;      padding: 0 30px 0 0px;  }
div.forum div.comment h3 {      color:#36332F;      font-size:93%;      text-transform:uppercase;  }
div.forum div.comment h4 {      font-size: 80%;      margin: 4px 0 8px 0;  }
div.forum div.actions {      position: absolute;      top: 10px;      right: 15px;      width: 50px;      height: 50px;  }

/* COFFEE FINDER
This is the tall list that appears on the Find Your
Coffee page.
********************************************************/
div#coffeeFinder {      float: left;      width: 100%;      min-height: 990px;      margin-top: 10px;      background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/vertical_gradient_transparent.png) no-repeat;  }
div#coffeeFinder ul {      list-style: none;      padding: 30px 0 0 45px;  }
div#coffeeFinder li {      padding-left: 70px;      background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/icon_about_findyourcoffee.png) 0 .7em no-repeat;  }
div#coffeeFinder h3 {      font-size: 108%;  }
div#coffeeFinder p {      font-size: 91%;  }

/* CUSTOMIZE YOUR DRINK
Form elements on the Find Your Coffee page.
********************************************************/
form select#size,
form select#milk,
form select#whip,
form select#chocolate,
form select#base {width: 170px;}

/* NUTRITION
This is the nutrition table on the Find Your Coffee page.
********************************************************/
div#nutrition table {    width: 100%;    padding-top: 10px;    margin-bottom: 10px;  }
div#nutrition table th {
  padding-bottom: 3px;
  text-align: left;
  font-weight: normal;
  background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/divider_tablethick.gif) no-repeat bottom;
}
div#nutrition table th.title {    font-weight: bold;    font-size: 116%;    color: #36332f;  }
div#nutrition table th.calories {width: 100px;}
div#nutrition table th.fat {width: 50px;}
div#nutrition table td {    padding: 4px 0;    background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/divider_table.gif) no-repeat bottom;  }
div#nutrition table tr.border td {    padding-bottom: 7px;    background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/divider_tablethick.gif) no-repeat bottom;  }
div#nutrition p.disclaimer {padding-top: 20px; font-size: 77%;  }

/* MENU
   This is the menu list on the Menu & Nutrition page.
********************************************************/
div#main div.menu { width: 693px; padding: 8px 0 0 27px;}
div#menu { float: left; }
div.menuList {
  float: left;
  width: 165px;
  padding-right: 8px;
}
div#content div.menuList h3 {    position: relative;    width: 165px;    height: 34px;    text-indent: -9999em;  }
div#content div.menuList img {margin-bottom: 20px;}
div#content div.menuList h3#classics { background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/bg_menuclassic.jpg) no-repeat; }
div#content div.menuList h3#cold { background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/bg_menucold.jpg) no-repeat; }
div#content div.menuList h3#wild { background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/bg_menuwild.jpg) no-repeat; }
div#content div.menuList h3#tea { background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/bg_menutea.jpg) no-repeat; }
div#content div.menuList h4 {    padding-left: 10px;    font-weight: bold;    color: #36332f;  }
div#content div.menuList p {    padding: 5px 0 20px 10px;    font-size: 75%;    line-height: 153.9%;    font-weight: bold;    color: #36332f;  }
div#content div.menuList p a { text-decoration: underline; padding-right: 5px; }
div#content div.menuList ul { list-style: none; padding: 0 0 0 10px; }
div#content div.menuList li {     padding-bottom: 15px;     font-weight: bold;  }
div#leftbar div.coffeeFeature {     background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/bg_menusidefeature.png) no-repeat;    width: 118px;    height: 227px;    padding: 25px 35px 0 35px;    margin-bottom: 20px;    text-align: center;  }
div#leftbar div.coffeeFeature h4,  #leftbar div.coffeeFeature b,   #leftbar div.coffeeFeature p {     text-align: left;  }
div#leftbar div.coffeeFeature h4 { padding-bottom: 5px; }
div#leftbar div.coffeeFeature img {margin-bottom: 10px;}

/* FOOD ITEM     The food sections on pages such as Popular Drinks.  ********************************************************/  div#content div.foodItem {      float: left;      width: 458px;      padding: 10px 0 0 0;      border-top: 1px solid #bdb4a1;  }
div#content div.foodItem h3 {      padding: 0 0 10px 0;      text-transform: none;  }
div#content div.foodItem p b a,      div#content div.foodItem p strong a {      background: none;  }
div#content div.foodItem ul {      float: left;      width: 458px;      padding: 0;      list-style: none;  }

/* layout will still look not so great if item title wraps to 4 lines */  div#content div.foodItem ul li {      float: left;      width: 105px;      padding: 0 9px 3px 0;    /* had to fix height to avoid IE clear/float issue*/      min-height: 10.5em;  /*height: auto;*/  /*margin-bottom: 3px;*/  /*padding-right: 9px;*/  }
  div#content div.foodItem ul li p {font-size:83%;      font-weight: bold;      padding: 3px 0 3px 0;      margin: 0;      line-height: 98%;      text-transform: uppercase;      text-align: center;  }

/* Locations
   The main page of the section.
********************************************************/
/* amenities section */
div.location div#amenities {   line-height: 1.5; color: #402a1c; float: left; padding-top: 35px; width: 650px;}
div.location div#amenities a {text-decoration: underline; }
div.location div#amenities h2 {    background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/bg_hdrlocationamenities.jpg) no-repeat;    text-indent: -9999em;    height: 34px;    width: 253px;    float: left;  }
  div.location div#amenities p#disclaimer { padding-left: 20px;float: left; padding-top: 15px; }
div.location div#amenities a#tourLink { font-weight: bold; float: right; padding-top: 15px; padding-left: 20px;}
div.location div#amenities p#locfaq { float: left; padding-top: 20px;}
div.location div#amenities div.header { width: 100%; padding: 0; margin: 0; }
div.location div#amenities div {    float: left;    width: 165px;    padding: 0 50px 20px 110px;    margin-top: 15px;  }
div.location div#amenities div a { text-decoration: none; }
div.location div#amenities div h3 { padding-top: 0;}
  div.location div#amenities div#wifi { background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/icon_locwifi.png) no-repeat; }
div.location div#amenities div#driveThru { background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/icon_locdrivethru.png) no-repeat; }
div.location div#amenities div#meetingRooms { background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/icon_locmeetingrooms.png) no-repeat; }
div.location div#amenities div#music { background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/icon_locmusic.png) no-repeat; }

/* Grocery store side column */
div.location div#grocery {    float: right;    width: 241px;    padding-top: 10px;    background: transparent;  }
  div.location div#grocery h4 {    background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/bg_groceryboxhdr.png) no-repeat;    text-indent: -9999em;    width: 241px;    height: 87px;  }
  div.location div#grocery div#columnContent {    line-height: 1.5;    float: left;    background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/bg_groceryboxbody.gif) no-repeat bottom;    padding: 15px 15px 30px 28px;  }
  div#grocery div#columnContent a {    font-weight: bold;    dislay: block;    padding-top: 15px;    float: left;    color: #402a1c;  }

/* QUESTION
  The question sections on the Coffee Recommender page.
********************************************************/
div#content div.question {      float: left;      width: 668px;      padding: 20px 0 10px 0;      border-bottom: 1px solid #bdb4a1;  }
div#content div.question h2 {      padding: 8px 0 16px 34px;      font-size: 93%;      text-transform: uppercase;  }
div#content div.question h2.question1 {      background: url(../media/image/1/icon_step1_blue.png) no-repeat;  }
div#content div.question h2.question2 {      background: url(../media/image/1/icon_step2_blue.png) no-repeat;  }
div#content div.question h2.question3 {      background: url(../media/image/1/icon_step3_blue.png) no-repeat;  }
div#content div.question h2.question4 {      background: url(../media/image/1/icon_step4_blue.png) no-repeat;  }
div#content div.question h2.question5 {      background: url(../media/image/1/icon_step5_blue.png) no-repeat;  }
div#content div.question h4 {font-size: 84%;}
div#content p.seeResults {      float: left;      width: 100%;      padding: 20px 0;  }
div#content div.question p {      padding: 0;      font-size: 84%;  }
div#content div.question img {      padding-bottom: 3px;  }
div#content div.question ul {      float: left;      width: 668px;      padding: 0 0 3px 0;      list-style: none;  }
div#content div.question ul li {      float: left;      width: 90px;      padding-right: 20px;  }
div#content div.question li a {      float: left;      width: 78px;      padding: 3px 5px;      border: 1px solid #36332f;      text-align: center;      text-transform: uppercase;      font-weight: bold;   color: #36332f;      background: #add3ca url(../media/image/1/btn_coffeerec_unselected_bg.gif) repeat-x;  }
div#content div.question li a:hover {      text-decoration: none;  }
div#content div.question li.selected a {      color: #fff;      background: #99886c url(../media/image/1/btn_coffeerec_selected_bg.gif) repeat-x;  }
div#content div.question div.why {      float: left;      width: 200px;      min-height: 60px;      padding: 3px;      color: #36332f;  }

/* Locations
********************************************************/
div#wrap div.location { width: 900px; }
div.location iframe { border: 0; width: 891px; height: 649px;}
div#locationsWrap {width: 891px; height: 649px;}

/* FLASH TOUR
   This is a container for the flash tour on the  Take a Tour page.
********************************************************/
div#flashTour {      float: left;      width: 458px;      padding: 10px 0 20px 0;  }

/* FAQ
   Styling for pages that contain an FAQ section.
********************************************************/
div#content div.faq h2 {padding-top: 20px;}
div#content div.faq ul {      list-style: none;      padding: 0;  }
div#content div.faq li {      padding: 0 0 10px 0;  }

/* FRANCHISING
  Styling for the Franchising page.
********************************************************/
a#getStarted {      float: right;      margin-top: -28px;  }
div#franchiseInquiry {      float: left;      width: 458px;      min-height: 261px;      padding-top: 20px;      overflow: hidden;      background: url(../media/image/1/bg_franchise.gif) 0 100% repeat-x;  }
div#content div#franchiseInquiry ol {      float: left;      list-style: none;      width: 468px;      padding: 0;  }
div#franchiseInquiry ol li {      position: relative;      float: left;      width: 134px;      min-height: 163px;      padding: 5px;      margin-right: 10px;      border: 1px solid #d0c4a5;  }
div#franchiseInquiry ol li span {      position: absolute;      top: 20px;      left: 60px;      width: 21px;      height: 21px;  }
div#franchiseInquiry ol li span.step1 {      background: url(../media/image/1/icon_step1.gif) no-repeat;  }
div#franchiseInquiry ol li span.step2 {      background: url(../media/image/1/icon_step2.gif) no-repeat;  }
div#franchiseInquiry ol li span.step3 {      background: url(../media/image/1/icon_step3.gif) no-repeat;  }
div#franchiseInquiry ol li h4 {      text-align: center;      font-size: 85%;      line-height: 100%;      font-weight: bold;      text-transform: uppercase;      color: #36332f;      background: #b7a57e;      padding: 40px 15px 10px 15px;  }
div#franchiseInquiry ol li p {      min-height: 61px;      padding: 15px 15px;      font-size: 85%;      color: #cfc8b7;      background: #9f8d6c;  }

/* FRANCHISE STEPS
   Styling for the Franchising pages.
********************************************************/
div#franchiseSteps {      float: left;      width: 458px;      min-height: 60px;      padding: 20px 0 20px 0;      overflow: hidden;  }
div#content div#franchiseSteps ol {      float: left;      list-style: none;      width: 455px;      padding: 0;  }
div#franchiseSteps ol li {      position: relative;      float: left;      width: 125px;      min-height: 50px;      padding: 5px;      margin-right: 5px;      border: 1px solid #d0c4a5;  }
div#franchiseSteps ol li span {      position: absolute;      top: 18px;      left: 18px;      width: 21px;      height: 21px;  }
div#franchiseSteps ol li span.step1 {      background: url(../media/image/1/icon_step1_tan.gif) no-repeat;  }
div#franchiseSteps ol li span.step2 {      background: url(../media/image/1/icon_step2_tan.gif) no-repeat;  }
div#franchiseSteps ol li span.step3 {      background: url(../media/image/1/icon_step3_tan.gif) no-repeat;  }
div#franchiseSteps ol li.current span.step1 {      background: url(../media/image/1/icon_step1.gif) no-repeat;  }
div#franchiseSteps ol li.current span.step2 {      background: url(../media/image/1/icon_step2.gif) no-repeat;  }
div#franchiseSteps ol li.current span.step3 {      background: url(../media/image/1/icon_step3.gif) no-repeat;  }
div#franchiseSteps ol li h4 {      padding:12px 0px 15px 37px;      text-align: left;      font-size: 86%;      line-height: 131%;      font-weight: bold;      text-transform: uppercase;      color: #988f76;      background: #dacca5;  }
div#franchiseSteps ol li.current h4 {      color: #36332f;      background: #b7a57e;  }
div#franchiseSteps ol li p {      min-height: 61px;      padding: 15px 15px;      font-size: 85%;      color: #cfc8b7;      background: #9f8d6c;  }

/* FRANCHISE TABS
   Tabs above the map on the Franchise page.
********************************************************/
div#content ul#franchiseTabs {      float: left;      width: 458px;      padding: 0 20px 5px 0;      list-style: none;  }
div#content ul#franchiseTabs li {      float: left;      margin-right: 5px;      font-size: 85%;      text-transform: uppercase;      font-weight: bold;  }
div#content ul#franchiseTabs li a {      display: block;      padding: 10px;      background: #cfc8b6;  }
div#content ul#franchiseTabs li.current {      padding: 10px;      color: #36332f;      background: #b7a57e;  }

/* FRANCHISE MAP
   Tabs above the map on the Franchise page.
********************************************************/
div#franchiseMap {      float: left;      width: 440px;      padding: 9px;      margin-bottom: 20px;      background: #cfc8b6;  }
div#franchiseMapHeader {      float: left;      width: 438px;      border: 1px solid #000;      border-bottom: none;      background: #e7dcbc;  }
div#content p#franchiseMapNav {      float: left;      width: 210px;      padding: 11px 10px 11px 10px;      border-right: 1px solid #000;  }
p#franchiseMapNav a {      padding-left: 10px;      font-size: 77%;      font-weight: bold;      text-transform: uppercase;      background: url(../media/image/1/icon_orange_arrow_left.gif) 0 50% no-repeat;  }
img.franchiseMapKey {      float: left;      padding: 10px 17px;  }
img.franchiseMapImage {      border: 1px solid #000;  }

/* TWINS LANDING PAGE
********************************************************/
img#twinsMainImg { margin-top: 25px; float: left; }
div.lpContentColumn {
  margin-top: 25px;
  padding-left: 35px;
  float: left;
  width: 430px;
  color: #4c453c;
  font-size: 85%;
}

div.lpContentColumn h1 {
  font-size: 125%;
  color: #4e463d;
  padding-bottom: 10px;
}
div.lpContentColumn h2 {
  font-size: 250%;
  color: #4e463d;
  font-weight: normal;
  padding: 25px 0;
  text-transform: uppercase;
}
div.lpContentColumn h2.saveStatus { width: 430px; font-size: 240%; }
div.lpContentColumn h3 { font-size: 95%;}

div.lpContentColumn a {
  font-weight: bold;
  text-decoration: underline;
  color: #4C453C;
  padding-left: 23px;
  padding-bottom: 5px;
}

div.lpContentColumn div#TwinsNextChance a {
  padding-left: 0;
}

div.lpContentColumn a.emeddedFacebook {
  background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/icon_facebook.png) no-repeat;
}

div.lpContentColumn a.emeddedTwitter {
  background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/icon_twitter.png) no-repeat;
}

div.lpContentColumn a#print {
  display: block;
  background: url(http://d3qy9geyi9eh4r.cloudfront.net/redesign/twins_btn_print.jpg) no-repeat;
  width: 91px;
  height: 22px;
  text-indent: -999em;
  outline: none;
  padding-bottom: 5px;
  margin-top: 10px;
}
div.lpContentColumn p.noSave { line-height: 2;}

div#TwinsNextChance { padding-top: 10px;}
div#TwinsNextChance p { color: #ca2340; font-weight: bold; }

div#twinsFooter {
  padding-top: 40px;
  color: #4e463d;
  font-size: 120%;
}

div#twinsFooter p { float: left; padding-top: 15px; }
div#twinsFooter img { margin: 10px 0 0 170px; }

/* RAIN FOREST ALLIANCE LANDING PAGE
********************************************************/
div.raBanner div#banner { width: 918px; margin-bottom: 0; background-color: #f8f2ea; }
div.backgroundVariant {
  float: left;
  width: 918px;
  background-color: #f8f2ea;
}

h1#bigNews {
  background: url(http://cboucache.s3.amazonaws.com/redesign/hdr_title.gif) no-repeat;
  text-indent: -9999em;
  padding-bottom: 30px;
}

div#main div.raBeans {
  width: 340px;
  padding: 55px 30px 28px 28px;
}

div.backgroundVariant div#lpContentColumn,
div.lpflashColumn {
  color: #402a1c;
  font-size: 85%;
  padding-top: 70px;
}

div.lpflashColumn {
  float: right;
  width: 510px;
}

div.lpflashColumn p {
    padding: 20px 30px 0 0;
}

div.raBeans form {
  margin-top: 85px;
}

form h2#formTitle {
  background: url(http://cboucache.s3.amazonaws.com/redesign/hdr_form-title.gif) no-repeat;
  text-indent: -9999em;
  padding: 0 0 0 0;
  height: 44px;
}

div.raBeans form ol {
  float: left;
  list-style: none;
  width: 340px;
}

div.raBeans form li { float: left; padding-top: 20px; }
div.raBeans form li.first { padding-right: 29px; }
div.raBeans form li.legal { padding-left: 15px; width: 200px; font-size: 80%; }
div.raBeans form li.btn input { 
  background: none;
  width: 124px; 
  height: 34px;
  border: 0px #FFF solid;
}

div.raBeans form a {
 padding-left: 0;
  color: #75B1BE;
}

div.raBeans input { 
  width: 263px;
  background-color: #FFF; border: 1px #463022 solid; padding: 5px 0;
}

div.raBeans li.short input { width: 116px; }
div.raBeans label { text-indent: -9999em; display: block; }
label#labelFirstName {background: url(http://cboucache.s3.amazonaws.com/redesign/label_firstname.gif) no-repeat;}
label#labelLastName {background: url(http://cboucache.s3.amazonaws.com/redesign/label_lastname.gif) no-repeat;}
label#labelEmail {background: url(http://cboucache.s3.amazonaws.com/redesign/label_email.gif) no-repeat;}
label#labelStoreNum {background: url(http://cboucache.s3.amazonaws.com/redesign/label_storenumber.gif) no-repeat;}
label#labelGuess {background: url(http://cboucache.s3.amazonaws.com/redesign/label_guess.gif) no-repeat;}


/*******************************************************/
/*                 SIMPLICIS COMPONENTS                 /
********************************************************/
/* WIDGET TOOLBAR
********************************************************/
div.widgetToolbar {width: 180px; float: left; }
div.widgetToolbar ul { list-style: none; float: left; padding: 0; }
div#leftbar div.widgetToolbar ul { list-style: none; float: left; padding: 0; }
div.widgetToolbar li { float: left; margin: 0 5px 0 0;  }

/* CAREERS HUB
********************************************************/
div.careersHub input.button { float: right; }
div.careersHub p.jobStats b,  div.careersHub p.jobStats strong {      color: #000000;  }

/*******************************************************/
/*                 CHRISTINE                            /
********************************************************/
/* YOUR ACCOUNT christine scott
********************************************************/
div#content div.featureAccountColumn {float: left; width: 330px;}
div#content div.featureAccountColumn div.feature {width: 300px; padding: 0 14px 10px 14px;}
div#form div.yourAccount label { width: 100px; padding-right: 10px; text-align: right; color: #36332f; }
div#form div.yourAccount label.wide { width: 300px; }
div#form div.yourAccount input.long { width: 300px; padding:2px; }
div#form div.yourAccount select.long { width: 308px; padding:2px; }
div#form div.yourAccount input.medium { width: 140px; padding:2px;}
div#form div.yourAccount select.medium{ width: 148px; padding:2px;}
div#form div.yourAccount input.short { width: 57px; padding:2px;}
div#form div.yourAccount select.short { width: 65px; padding:2px;}
div#form div.yourAccount input.button {width:auto;}
hr.account {margin: 2px 0 10px 0; }
div#form div.yourAccount ol li.accountWithHRBelow {padding: 0px 0px 10px 0px;}
 /*Added by Ben Seymour 1/14/08*/  div#form div.yourAccount ol li.accountWithHRAbove {padding: 5px 0px 15px 0px;}
 /*Added by Ben Seymour 1/14/08*/  div#form div.yourAccount ol li.accountWithHRAboveAndBelow {padding: 5px 0px 10px 0px;}
 /*Added by Ben Seymour 1/14/08*/  div#form div.yourAccount ol li.accountWithHR {padding: 0px 0px 0px 0px;}
 /*Added by Ben Seymour 1/14/08*/  div#form div.yourAccount ol li.accountWithHR hr {margin: 0px 0px 0px 0px;}
 /*Added by Ben Seymour 1/14/08*/  /* div#form div.yourAccount ol li hr.account {margin: 0;} */ /*Added by Ben Seymour, 1/14/08*/  span.spaceBetween2Btns {margin-left: 20px;}
 /*Added by Ben Seymour 1/15/08 -- changed 1/17/08*/  div#managecards table {width: 100%; padding-top: 10px; margin-bottom: 10px;}
div#managecards table th { text-align: left; border-bottom: 1px solid #bdb4a1; font-weight: normal;}
div#managecards table th.title {font-weight: bold; font-size: 90%; color: #36332f;}
div#managecards table td {padding: 3px 0; border-bottom: 1px solid #bdb4a1; font-size: 90%;}
div#managecards table tr.border td {border-bottom: 5px solid #bdb4a1;}
div#question1,div#question2,div#question3,  div#question3,div#question4,div#question5,  div#question6,div#question7,div#question8,  div#question9,div#question10,div#question11,  div#question12,div#question13,div#question14,  div#question15,div#question16 {display: none;}
  /* INVESTORS christine scott  ********************************************************/  div#leftbar div.investornav strong {padding-right: 7px;font-size: 91%;font-weight: bold;text-transform: uppercase;}
div#leftbar div.investornav strong a {padding-right: 7px;font-size: 91%;font-weight: bold;text-transform: uppercase; background: url(/media/image/1/icon_orange_arrow.gif) 100% 50% no-repeat;}
div#form.investorsform {background: #e7dcbc;}
div.careersHub p.jobStats b,  div.careersHub p.jobStats strong {      color: #000000;    }

/* FIND A LOCATION  (banner is 880 px wide) -- Ben Seymour
********************************************************/
div#divFindLocationCategoryHeader {position: relative; float: left; width: 920px; height:290px; margin-bottom: -30px; background: #c0b8a7 url(/media/image/1/bg_newyork_strip_btm.jpg) bottom no-repeat;}
div#divFindLocationCategoryHeader div#accentTop {float: left; width: 920px; height: 22px; background: url(/media/image/1/bg_newyork_strip_top.jpg) no-repeat; }
div#divFindLocationBanner { position: relative; left: -20px; float: right; width: 880px; padding-top: 0px; background: url(/media/image/main_findalocation_880x245.jpg) no-repeat; min-height: 255px;}
div#divFindLocationBanner div#heading {position: absolute; bottom: 42px; right: 47px;}
div#divFindLocationBanner div#heading h1 {text-align: right; font-size: 167%; line-height: 100%; text-transform: uppercase; color: #fff; }
div#divFindLocationBanner div#heading p {text-align: right; font-size: 100%; font-weight: bold; text-transform: uppercase; color: #fff; }
div#divFindLocationText {position: absolute; width: 325px; height: 220px; font-size: 90%; color:#ffffff; margin: 15px 0px 0px 23px;}
div#divFindLocationText span#spnFindLocationHeading {font-size: 100%;}
div#divFindLocationText a {font-size: 90%;}
div#divFindLocationText label {font-weight: bold;}
div#divFindLocationText label span {font-weight: normal;}
div#divFindOptions {margin-bottom: 10px;}
div#divAddressCityAndState1 {display:none;}
div#divFindAlongARoute1 {display:none;}
div.divAddressForm {font-size: 100%; color:#ffffff;}
div.divAddressForm label {font-weight: bold; font-size:100%;}
div.divAddressForm label span {font-weight: normal;}
div.divAddressForm div.horRule {border-top: solid 1px #c0750b; margin-bottom: 2px; margin-top:5px;}
div.divAddressForm input.findLocCheckbox {margin: 0px 3px 0px 0px;}
div.divAddressForm input.textBx {border: 0; font-size: 90%; padding: 3px;}
div.divAddressForm select.addrSlct {font-size: 90%;}
div#divAddressFormMapQuest {color:#000000; margin-top:10px;}
/*divAddressCityAndState and divCityStateAndZip are classes, because they will be reused by the MapQuest code */
div.divAddressCityAndState input#txtAddress {width: 190px; margin: 2px 0px 5px 0px;}
div.divAddressCityAndState input#txtCityWithAddress {width: 130px; margin: 2px 0px 7px 0px;}
div.divAddressCityAndState select#slctStateWithAddress {width: 90px; margin: 2px 0px 7px 1px;}

/*The next ones are for the mapquest code -- when there are multiple matches for an address, for example */
div.divAddressCityAndState select#slctAddress {margin: 2px 0px 7px 0px;}
select.slctCityCountyState {margin: 2px 0px 7px 0px;}
div.divCityStateAndZip input#txtCity {width: 130px; margin: 2px 0px 5px 0px;}
div.divCityStateAndZip select#slctState {width: 90px; margin: 2px 0px 5px 1px;}
div.divCityStateAndZip input#txtZip {width: 50px; margin: 2px 0px 7px 0px;}
/* Find Along a Route*/  div.divFindAlongARoute div.divFromGroupLine1 {margin-top: 5px;}
div.divFindAlongARoute input#txtFromAddress {width: 190px; margin: 0px 0px 0px 0px; position: absolute; left: 40px;}
div.divFindAlongARoute div.divFromGroupLine2 {margin-left: 40px;}
div.divFindAlongARoute input#txtFromCity {width: 130px; margin: 8px 0px 7px 0px;}
div.divFindAlongARoute select#slctFromState {width: 90px; margin: 0px 0px 7px 1px;}
div.divFindAlongARoute input#txtFromZip {width: 40px; margin: 0px 0px  7px 1px;}
div.divFindAlongARoute input#txtToAddress {width: 190px; margin: 0px 0px 0px 0px; position: absolute; left: 40px;}
div.divFindAlongARoute div.divToGroupLine2 {margin-left: 40px;}
div.divFindAlongARoute input#txtToCity {width: 130px; margin: 8px 0px 5px 0px;}
div.divFindAlongARoute select#slctToState {width: 90px; margin: 0px 0px 5px 1px;}
div.divFindAlongARoute input#txtToZip {width: 40px; margin: 0px 0px 5px 1px;}

/* Optional Items */
div.divOptionalItems {position: absolute; left: 0px; bottom: 0px;}
/* Changes for MapQuest code*/
input#txtCityWithAddressMQ {margin: 2px 0px 5px 0px;}
select#slctStateWithAddressMQ {margin: 2px 0px 5px 5px;}
select#slctStateMQ {margin: 2px 0px 5px 5px;}
/***** END OF FIND A LOCATION *******************************************/
/* ALL LOCATIONS and NON-US LOCATIONS -- Ben Seymour
*******************************************************/
div#divShowLocations div.divStateHeading {padding: 10px 0 20px 0; font-size: 116%; color: #36332f; font-weight: bold;}
div#divShowLocations div.divCountryHeading {padding: 10px 0 20px 0; font-size: 116%; color: #36332f; font-weight: bold;}
div#divShowLocations div.divRegionHeading {padding: 10px 0 10px 0; font-size: 130%; color: #36332f; font-weight: bold;}
div#divShowLocations div.divAddrListing {width: 300px; line-height: 120%; font-size: 90%;}
div#divShowLocations div.divOptions {float: right; padding: 0px 0px 15px 15px;}
div#divShowLocations div.divWifi {text-align: center; padding-bottom: 10px;}
div#divShowLocations div.divDriveThru  {}
/***** END OF ALL LOCATIONS **************************/    /* LOGIN PAGES (ACCOUNT & SHOP) -- Ben Seymour */  /*********************************************************/  div#divLogin{height: 300px; width:670px;}
div#divLogin label{color: #36332F;}
div#divLogin div#divLoginError      {position: relative; width: 610px; text-align: left; left: 35px;}
div#divLogin div#divLoginNoErrorSpacer  {position: relative; height: 10px;}
div#divLogin div#divCenterLogin     {position: relative; width: 610px; height: 200px; text-align: left; left: 15px;}
div#divLogin div#divNewToCaribou    {position: relative; top: 0px; width: 264px; padding: 5px 20px 5px 20px;  height:85%; background-color:#E7DCBC;}
div#divLogin div#divNewToCaribouContent  {position: absolute; bottom: 30px; width: 264px; height: 75px;}
div#divLogin div#divAlreadyACustomer {position: absolute; top: 0px; left: 325px; height: 85%; width: 264px; padding: 5px 20px 5px 20px; background-color:#E7DCBC;}
div#divLogin div#divAlreadyACustomerContent {}
div#divLogin div.divLoginHeading     {font-size: 116%; color: #36332f; font-weight: bold; border-bottom: solid 1px #bcb5a3; padding-bottom: 5px; margin-bottom: 20px; padding-top: 5px;}
div#divLogin div.divBottomLoginButtons     {position: absolute; bottom:7px; width: 264px; text-align: center;}
div#divLogin div#divInputsEmail {position: relative; margin-bottom: 15px; height:20px;}
div#divLogin input#txtEmail    {position: absolute; left: 70px; width: 180px; top:0px;}
div#divLogin div#divInputsPwd {position: relative; height: 20px;}
div#divLogin input#txtPwd    {position: absolute; left: 70px; width: 180px; top: 0px;}
div#divLogin div#divForgotPwd {text-align:center; margin-top: 10px; line-height:100%;}
/***** END OF LOGIN **************************/
/* MANAGE CARIBOU CARD PAGES -- Ben Seymour */
/*********************************************************/
div.divNameYourBouCard                          {display: none;}
div#divCardRemoveConfirmation                   {display: none;}
div.divNameYourBouCard input.txtNewBouCardName  {width: 120px;}
div#divSubscriptionRemoveConfirmation           {display: none;}
/***** END OF MANAGE CARIBOU CARD **************************/
/* VIEW CARD HISTORY -- Ben Seymour */  div#viewCardHistory table {width: 100%;}
div#viewCardHistory table th { text-align: left; border-bottom: 1px solid #bdb4a1; font-weight: normal;}
div#viewCardHistory table th.title {font-weight: bold; font-size: 90%; color: #36332f;}
div#viewCardHistory table th.titleRightAlign {font-weight: bold; font-size: 90%; color: #36332f; text-align: right;}
div#viewCardHistory table td {padding: 5px 0; font-size: 90%;}
div#viewCardHistory table td.totalBalance {padding: 5px 0; font-size: 90%; text-align: right; font-weight: bold;}
div#viewCardHistory table tr.trShaded {background-color: #C0B8A7;}
/***** END OF VIEW CARD HISTORY **************************/
/* VIEW ORDER HISTORY -- Ben Seymour */
div#divOrders table {width: 300px;}
div#divOrders table th {text-align: left; border-bottom: 1px solid #bdb4a1; font-weight: normal;}
div#divOrders table th.title {font-weight: bold; font-size: 90%; color: #36332f;}
div#divOrders table th.titleRightAlign {font-weight: bold; font-size: 90%; color: #36332f; text-align: right;}
div#divOrders table td {padding: 5px 0; font-size: 90%;}
div#divOrders table tr.trShaded {background-color: #C0B8A7;}
/***** END OF VIEW ORDER HISTORY **************************/

/* VIEW ORDER DETAIL (used for order detail and verify.asp -- Ben Seymour */
div#divOrderDetail table#tblOrderMain {width: 100%;}
div#divOrderDetail table td {font-size: 100%;}
div#divOrderDetail table#tblOrderMain td {font-size: 90%;}
div#divOrderDetail table.tblBillToShipTo {width: 400px;}
div#divOrderDetail table th {text-align: left; border-bottom: 1px solid #bdb4a1; font-weight: normal;}
div#divOrderDetail table th.title {font-weight: bold; font-size: 90%; color: #36332f;}
div#divOrderDetail table td {padding: 3px 0;}
div#divOrderDetail table.tblBillTo td {font-size:90%;}
div#divOrderDetail table.tblShipTo td {font-size:90%;}
div#divOrderDetail table#tblPersonalizedMessage td {font-size:90%;}
div#divOrderDetail table.tblPaymentSummary td {font-size: 90%;}
div#divOrderDetail table#tblPaymentInfo td {font-size: 90%;}
/***** END OF VIEW ORDER DETAIL **************************/

/* LANDING PAGE  May, 2008 Valtira  The Landing pages were a later addition with a fairly unique design.  The banner stretches the entire (920px) width and the content area  is divided into 2 fairly equal width columns.  The banner is distinguished by class="biggest" because is longer than  the class="big" banner.  ********************************************************/
/* landing page: banner styles */
div#wrap div#categoryHeader div.biggest { width: 920px; margin-bottom:13px; left: 0; padding-top: 0; }
div.biggest div#bannerContent { color: #36332F; left: 539px; position: absolute; top: 70px; width: 325px; }
div.biggest div#bannerContent h1 { text-transform: uppercase; font-size: 167%; line-height: 100%; padding-bottom: 4px; }
div.biggest div#bannerContent ul, div.biggest div#bannerContent ol { padding: 11px 0 10px 0; font-size: 108%; list-style: none; line-height: 1.6; }
div.biggest div#bannerContent li { padding: 0 0 0 8px; background: url(../media/image/1/bullet_banner.gif) 0 50% no-repeat; }

/* landing page: content area */
div#wrap div#main div.landingPage { width: 880px; padding: 16px 0 0 0; margin: 18px 0 0 20px; background: url(../media/image/1/landing_content_bkgd.gif) left bottom no-repeat; position: relative; z-index: 900; display: inline; }
div.landingPage div.contentColumn { position: relative; float: left; margin: 0 17px 14px 40px; display: inline; }
div.landingPage div.colLeft { width: 383px; }
div.landingPage div.colRight { width: 357px; margin-right: 43px; }
div.landingPage div.contentColumn span.callout { display: block; position: absolute; right: 0; bottom: 12px; }

/* Landing page: text and list styles */
div#main div.landingPage p.leadingText { padding-left: 40px; width: 400px; color: #36332f; font-weight: bold; text-tranform: uppercase; font-size: 108%; padding-bottom: 14px; }
div#main div.landingPage h1, div#main div.landingPage h2, div#main div.landingPage h3, div#main div.landingPage h4, div#main div.landingPage h5 { color: #36332f; }
div#main div.landingPage h4 { padding: .5em 0 .1em 0; font-size: 95%;}
div#main div.landingPage p, div#main div.landingPage ol, div#main div.landingPage ul { font-size: 85%; line-height: 1.2; }
div#main div.landingPage ul ul, div#main div.landingPage ol ol { font-size: 100%; }
div#main div.landingPage ul { padding-bottom: .2em; }

/*
  Roastmaster Blogs  Styling for Blog pages.
********************************************************/
div.blogEntry label { padding-right: 10px; }
div.blogEntry li#toolbar label {float: left;}
div.blogEntry li#toolbar span { display: block; float: left;}
div.blogEntry div#linkForm {    padding-bottom: 10px;    float: left;    background-color: #CFC8B7;    padding: 5px;    border: 1px solid #A6A092;    margin-bottom: 20px;  }
div.blogEntry div#linkForm div.row { width: 400px; float: left; padding-bottom: 5px; }
div.blogEntry div#linkForm span.label { font-weight: bold; color: #36332F; float: left; padding-right: 10px;}
div.blogEntry div#linkForm input.text { float: left; width: 200px;}
div#blogWrapper div#content { padding: 46px 15px 0 5px; width: 470px;}
div#roastMasterBlog div.bloggerInfo { float: left; width: 340px; padding: 10px 0 20px; }
div#roastMasterBlog div.bloggerInfo img { float: left; padding-right: 14px;}
div#roastMasterBlog div.bloggerInfo h3 { float: left; padding-bottom: 3px; }
div#roastMasterBlog div.bloggerInfo p { float: left; width: 250px; }
div#roastMasterBlog div.blogInfo { float: left;font-weight: bold; color: #36332F;}
div#roastMasterBlog div.blogInfo h2 { padding: 0}
div#roastMasterBlog div.blogInfo p { padding: 0}
div#roastMasterBlog div.blogInfo a.editEntry { background: url(/media/image/1/edit_widget.png) no-repeat; padding: 0 0 0 25px; text-transform: uppercase;}
div#roastMasterBlog div.entry {    padding: 20px 0;    float: left;    border-bottom: 1px solid #bdb4a1;    width: 470px;  }
div#roastMasterBlog div.entry p { float: left; width: 470px;}
div#roastMasterBlog div.entry img { float: left; padding: 10px; }
div#content div#roastMasterBlog div.entry ol { margin-left: 8px;}
div#roastMasterBlog a.askRoastmaster {    display: block;    float: right;    background: url(../media/image/1/btn_ask_roastmaster.gif) no-repeat center top;    height: 20px;    width: 120px;    margin-top: 60px;    padding-top: 62px;    text-align: center; font-size: 83%;    text-transform: uppercase;    font-weight: bold;  }
div#roastMasterBlog div.blogComments {    background: url(../media/image/1/bg_blog_comment.gif) no-repeat center bottom;    color: #36332F;    float: left;    width: 434px;    padding: 20px 20px 10px 20px;    margin-bottom: 20px;  }
div#roastMasterBlog div.blogComments div.comment { border-bottom:1px solid #BDB4A1; margin-bottom: 10px; }
div#roastMasterBlog div.blogComments a.thickbox { float: right; }
div#roastMasterBlog div.blogComments h4 { width: 300px; padding-bottom: 10px; }
div#roastMasterBlog div.blogComments h4 a.comToggle { color:#36332F; }
div#roastMasterBlog div.blogComments div.comment h4 span { font-weight: normal; }
div#roastMasterBlog div.blogComments form input.button { float: right; }
p.error {color: #CC0000;}
p span.divi { border-bottom: 1px #a6a092 solid; float:left; height:2px; width:100%;}
div#blogArchiveLinks ul {list-style: none; padding-left: 0;}
div#blogArchiveLinks ul b a { background: 0; }

/*
  meet the roastmaster page
********************************************************/
div.roastmasterDesc {      position: relative;      float: left;      width: 100%;      border-top: 1px solid #bdb4a1;      padding: 20px 0 10px 0;  }
div.roastmasterDesc div.image {      float: left;      width: 120px;      height: 100px;  }
div.roastmasterDesc div.info {      position: relative;      float: left;      width: 450px;      padding: 0 30px 0 12px;  }
div.roastmasterDesc div.info img {      float: left;  }
div#content div.roastmasterDesc div.info h3 {      padding: 0;  }
div#content div.roastmasterDesc div.info p.roastmasterTitle {    font-weight: bold;  }