html, body
{
  background: #5D4C6D;
}

strong { font-weight: bold; }
em { font-style: italic; }

.clear { clear: both; }

.button
{
  /* Firefox */
  vertical-align:middle;
  display:-moz-inline-block;
  display:-moz-inline-box;
  /* Everybody else */
  display:inline-block;
}

ul.error_list
{
  padding: 0 !important;
  margin: 0 !important;
}
ul.error_list li
{
  list-style: none !important;
}

/* STRUCTURE & BACKGROUNDS */
#page
{
  width: 782px;
  margin: 0 auto;
}

#headerWrapper
{
  background: url(/images/header.jpg) no-repeat center center;
  min-width: 782px;
}
#header
{
  height: 268px;
  position: relative;
  width: 782px;
  margin: 0 auto;
}

#logo
{
  width: 199px;
  height: 142px;
  position: absolute;
  top: 12px;
  left: 42px;
}

#nav
{
  width: 500px;
  position: absolute;
  top: 2px;
  right: 12px;
}

#nav li
{
  float: left;
  margin: 0 10px;
  padding-top: 20px; 
}

#nav li:hover, #nav li.hover,
body.about #nav li.about,
body.shop #nav li.shop,
body.flavors #nav li.flavors,
body.containers #nav li.containers,
body.wholesale #nav li.wholesale,
body.contact #nav li.contact
{
  /* png for capable browsers; use a gif in -ie6.css */
  background: url(/images/menu_pointer.png) no-repeat center top;
}

#samples
{
  width: 700px;
  height: 73px;
  position: absolute;
  top: 190px;
  left: 42px;
  overflow: hidden;
  background: url(/images/samples.jpg) no-repeat;
}

#contentWrapper
{
  background: #fff url(/images/content_background.jpg) no-repeat bottom right;
  position: relative;
  z-index: 1;
  width: 710px;
  margin: 0 36px;
  overflow:hidden;
}
#content
{
  background: url(/images/background.gif) repeat-y;
  padding: 20px 20px 100px 20px;
  min-height: 500px;
  position: relative;
  z-index: 2;
}

#breadcrumbs
{
  margin-bottom: 8px;
  color: #666;
}
#breadcrumbs a
{
  color: #666;
  text-decoration: none;
}
#breadcrumbs a:hover
{
  color: #222;
  text-decoration: underline;
}

.step
{
  width: 355px;
  margin: 30px 0 30px 30px;
  padding-left: 40px;
  padding-top: 7px;
  padding-bottom: 40px;
  border-bottom: 1px solid #222;
  color: #555;
}
.step .question
{
  font-size: 19px;
  line-height: 21px;
}
.step .descriptions
{
  font-size: 12px;
  line-height: 14px;
}
.step form
{
  margin-top: 8px;
}
.step select
{
  margin: 4px 0;
  width: 200px;
}
#howManyContainers
{
  background: url(/images/circ_1.gif) no-repeat;
}
#containerStyles
{
  background: url(/images/circ_2.gif) no-repeat;
}
#containerStyles select
{
  display: block;
}
#fillFlavors
{
  background: url(/images/circ_3.gif) no-repeat;
}
#fillFlavors .fillPhoto
{
  float: right;
  text-align:center;
  width:90px;
}

.stepActions
{
  width: 425px;
  text-align: right;
}
.stepActions #resetTrigger
{
  margin-right: 20px;
}

.closeUpTitle
{
  width: 400px;
}
.closeUpPhoto
{
  width: 250px;
  height: 250px;
  position: absolute;
  top: 32px;
  right: 20px;
  text-align: center;
}
.closeUpDescription
{
  width: 400px;
}
.closeUpActions
{
  margin-top: 10px;
}

#order_summary
{
  display: none;
  position: absolute;
  top: 120px;
  right: 130px;
  text-align: right;
  width: 200px;
}
#order_summary .title
{
  font-size: 21px;
  color: #5d4c6d;
}

#jumpToTop
{
  position: absolute;
  bottom: 20px;
  left: 20px;
}
body.home #jumpToTop
{
  left: 240px;
}

#footerWrapper
{
  background: #150921;
  min-width: 782px;
  height: 100px;
}
#footer
{
  height: 21px;
  background: url(/images/footer.png) no-repeat center top;
  text-align: center;
  padding: 16px;
  color: #fff;
  width: 750px;
  margin: 0 auto;
}
#credits
{
  text-align: center;
  color: #fff;
  padding: 4px 0;
  font-size: 11px;
}
#credits a
{
  color: #fff;
}

#productsList
{
  border-collapse: separate;
  border-spacing: 4px;
  width: 455px;
}
#productsList td
{
  vertical-align: top;
  background: transparent;
}
#productsList td.photo
{
  width: 90px;
  height: 90px;
  padding: 10px 10px 9px 10px;
  background: #e9f7cf;
}
#productsList td.photo .interior
{
  background: #fff;
  height: 90px;
  width: 90px;
  overflow: hidden;
  text-align: center;
}
#productsList td.description
{
  background: transparent;
}
#productsList td.description .interiorWrapper
{
  width: 286px;
  height: 109px;
  overflow: hidden;
  background: #e9f7cf;
  float: left;
}
#productsList td.description .interior
{
  border: 10px solid #e9f7cf;
  border-bottom-width: 9px;
  background: #f4fbe7;
  height: 82px;
  overflow: hidden;
  padding: 4px;
}
#productsList td.description .detail
{
  width: 47px;
  height: 108px;
  float: right;
}

#cartLink {
  position:absolute;
  right:50px;
  top:0;
}

.categories
{
  margin: 0 0 24px 4px;
}
.categories.all .all,
.categories.sweet .sweet,
.categories.savory .savory
{
  font-weight: bold;
}
.pagination
{
  width: 400px;
  margin: 4px 0 4px 4px;
}
.pager 
{
  float: right;
}

#cart
{
  border: 5px solid #e9f7cf;
  border-collapse: collapse;
  width: 100%;
  margin: 10px 0;
  background: #fff;
}
#cart tr.header
{
  background: #e9f7cf;
}
#cart th
{
  font-weight: bold;
  padding: 4px 0;
}
#cart th.item
{
  width: 340px;
}
#cart td
{
  padding: 4px;
  vertical-align: top;
}
#cart th.quantity, #cart td.quantity
{
  text-align: center;
}
#cart th.unit_price, #cart th.total_price,
#cart td.unit_price, #cart td.total_price
{
  text-align: right;
}
#cart div.description
{
  font-weight: bold;
}
#cart tr.subtotal
{
  border-top: 1px solid #e9f7cf;
}
#cart td.label, #cart td.amount
{
  text-align: right;
}
#cart tr.grandtotal td
{
  font-weight: bold;
}
#cart td.empty
{
  text-align: center;
  padding: 20px 0;
}
#cart .removeFromCart
{
  margin-top: 8px;
}

#cartActions
{
  text-align: right;
}
#cartActions a, #cartActions form
{
  display: inline; /* for forms */
  margin-left: 10px;
}

#orderActions
{
  text-align: right;
  margin-right: 20px;
}
#orderActions input
{
  margin-left: 10px;
}
#orderStep
{
  border: 1px solid #ccc;
  padding: 20px;
  margin: 10px 20px 10px 10px;
  position: relative;
  color: #888;
  background: #fff;
}
#orderStep #billingAndAddressTable
{
  width: 100%;
}
#orderStep #billingAndAddressTable th
{
  vertical-align: middle;
}
#orderStep #billingAndAddressTable td
{
  vertical-align: top;
}
#orderStep #billingTable
{
  margin-top: 40px;
}
#orderStep #shippingTable
{
  margin-top: 50px;
}
#orderStep tr.notes h2
{
  margin-top: 10px;
}
#orderStep tr.notes textarea
{
  width: 550px;
  height: 100px;
}
#orderStep tr.questions td
{
  padding: 10px 0;
}
#orderStep .checkoutTable th
{
  vertical-align: top;
}
#orderStep .checkoutTable input
{
  width: 160px;
}
#orderStep #payment_cvc
{
  /* override */
  width: auto;
}
#orderStep .checkoutTable td
{
  padding: 2px 0;
}
#orderStep .checkoutTable th
{
  padding-right: 8px;
}
#orderProgress
{
  margin-left: -8px;
}

#verifyTable
{
  width: 100%;
  margin-top: 10px;
}
#verifyTable td
{
  vertical-align: top;
  padding-right: 8px;
}
#verifyTable tr.info td
{
  width: 38%;
}
#verifyTable tr.info td#paymentDetails
{
  width: 20%;
}
#verifyTable tr.notes h3
{
  margin-top: 10px;
}
#verifyTable tr.notes .details
{
  border-left: 4px solid #E9F7CF;
  padding-left: 24px;
}

#textPageContent
{
  width: 500px;
  line-height: 1.5;
}

#homepageLayout
{
  width: 100%;
  margin-top: 12px;
}
#homepageLayout td
{
  vertical-align: top;
}
#homepageLayout #homepageBrowse
{
  width: 200px;
  border-right: 1px solid #666;
  text-align: center;
}
#homepageLayout #homepageBrowse ul
{
  padding: 0;
}
#homepageLayout #homepageBrowse li
{
  margin-bottom: 30px;
  list-style: none;
}
#homepageLayout #homepageContent
{
  padding: 0 20px;
}

body.contact textarea#contact_message
{
  width: 500px;
  height: 185px;
}

/* SPECIFIC TYPOGRAPHY */

#nav li a
{
  color: #fced8b;
}

#productsList .name
{
  font-weight: bold;
}