/*
CSS by RGdesign.org - 2009
*/
@import 'reset.css';
html{height:100%;}
body {
height: 100%;
background: #260301 url(../images/cupcakebackground.jpg) center top no-repeat;
}

sub { font-size: 9px; }

.w20 { width: 20px; }
.w34 { width: 34px; }
.w123 { width: 123px; }
.w307 { width: 307px; }

/* colors */
.browntext{color:#57271f !important;}
.error { color: red; }

/* fonts */
body{font-family: Arial, Helvetica, sans-serif;font-size: 13px; line-height: 16px; color:#57271f;}
p, h1, h2, h3, h4, h5, h6, small{padding-bottom:11px;}
p, ul { font-size: 13px; line-height: 16px; text-align: justify; }
a, a:active, a:link, a:visited{text-decoration:underline; color:#57271f;}
a:hover{text-decoration:none; color:#57271f;}

#content h2{font-size:26px; line-height:28px; color:#7dbac4; padding:0px 0 3px 0;}
#content h3{font-size:15px; color:#a4c86a; padding-bottom:7px; padding-top:16px; font-weight:bold;}
#content h3.no-top { padding-top: 0; }
#content h4{font-size:15px; color:#a4c86a; padding-bottom:0px; padding-top:0px; font-weight:bold;}
#content .products h2 { padding: 15px 0 0; }
#content .products h3 { padding-bottom: 3px; }
#content .products h3.solo { padding-bottom: 10px; }
#content .products h4 { padding-bottom: 10px; }
.bigTitle{padding:10px 0 10px 0 !important;}

/* general pourpose */
strong{font-weight:bold !important;}
.clearAll{font-size:0px; line-height:0px; height:0px; clear:both; width:1%;}
.floatLeft{float:left;}
.floatRight{float:right;}
small{font-size:10px !important; line-height:12px !important;}
.bigImage{margin-top:13px;}

/* layout */
#mainPage{width:811px; margin:0 auto; padding-bottom:37px;}
/* this div makes the brown line extends with content�s length always */
#container{background:transparent url(../images/mainPage-bg.gif) repeat-y; height:1%;}

/* reusable class for container */
.mainWrapper{width:741px; margin:0 auto;}

/* top and bottom rounded corners for main box */
.topBox{height:8px; line-height:8px; font-size:8px; background:transparent url(../images/mainPage-top.png) no-repeat top; width:741px; margin:0 auto;}
.bottomBox{height:33px; background:transparent url(../images/mainPage-bottom.png) no-repeat; width:741px; margin:0 auto;}

/* main divs */
#header{margin-top:41px;}
  #header h1{padding-bottom:0 !important;}
  #header .box{height:24px; background:#fff;}
  #innerheader{width:564px; height:90px; padding-top:4px;}
  
  /* menu */
  #menu{height:41px; margin:0 auto; padding: 0 71px 0 67px;}
  #menu ul{}
  #menu a{font-size:14px; color:#fff; text-decoration: none;}
  #menu li{float:left; margin-right: 1px;}
  #menu a:hover{cursor:pointer;} /* for ie */
  #menu li.selected .hidden{display:block !important;} /* for selected/current section */
  #menu li.selected .visible{display:none !important;} /* for selected/current section */
  
#content{width:535px; }
  .contentWrapper{padding:0 0 0 71px; }

#sidebar{width:212px; margin-right:35px; font-size:12px; line-height:14px; padding-top:3px;}
  #sidebar p { font-size: 12px; }
  .sidebarWrapper{padding:0 34px 0 24px;}
  
  /* reusable box with dotted line on bottom */
  .sidebarBox{background:transparent url(../images/sidebar-dotted.gif) 24px bottom no-repeat; padding: 0 0 17px 24px; margin-top:3px; margin-bottom:15px; text-align:left; width: 156px; }
  
  /* customs for sidebar */
  .sidebar-freezing-instructions-bt{display:block; margin-bottom:11px;}
  #randomImage{padding-left:1px;}

#footer{width:670px; margin:12px auto 0 auto; color:#b69c98; text-align:right;}

/* forms */
/* sign up on home */
#signUp .form-input{background:#F2F2F2; border:1px solid #C9BBB9; color:#43140D; padding:3px 5px; width:144px; font-size:12px;}
/* contact*/
.contact, #contact{background: url(../images/sidebar-dotted.gif) repeat-x top; padding-top:15px; margin-top:5px;}
.contact a {text-decoration: none;}
.contact a:hover {text-decoration: underline;}
#contact label { display: block; font-size: 13px; padding-bottom: 5px; }
#contact p label { display: inline; padding-bottom: 0; }
#contact .form-checkbox{background:#F2F2F2; border:1px solid #C9BBB9; color:#43140D; font-size:13px;}
#contact .form-input{background:#F2F2F2; border:1px solid #C9BBB9; color:#43140D; padding:3px 5px; width:380px; font-size:13px;}
#contact #contact-msg{height:180px; font-size:13px;}
/* quantity input for order-menu */
#orderMenuItems .basket .form input{background:#F2F2F2; border:1px solid #C9BBB9; color:#57271f; padding:3px 5px; width:17px; margin-left:5px; font-weight:bold;}


/* ------------- */
/* custom extras */

/* subnav - for subpages */
.subnav{}
  .subnav img{margin-right:10px;}
  
/* SUB NAVIGATION FOR ALL PAGES */
.innerHeader{padding-top:12px; border-bottom:1px solid #90716d; margin-bottom:4px; padding-bottom:0px;}
.ingredients .innerHeader { margin-bottom: 15px; }
.optional{margin-bottom:12px !important;}
  .innerHeader h3{font-size:24px !important; font-weight:bold !important; float:left; padding-bottom:0px; padding-top:0px;}
  .innerHeader .backToTop{display:block; height:33px;}
  .innerHeader .backToTop a{font-size:10px !important; background:transparent url(../images/order-menu-icon-top.gif) no-repeat right; padding-right:16px; float:right; margin-top:25px; }
  
/* 4 COLS UL LIST */
ul.cols4{width:25%; float:left;}
ul.cols4 li{padding-right:5px; padding-bottom:12px;}
ul.cols4 li li{ padding-bottom:0px !important;}
ul.cols4 li a{text-decoration:none}
ul.cols4 li a:hover{text-decoration:underline}
ul.cols4 li, ul.cols4 li a{color:#a4c86a !important; font-weight:bold !important;}
ul.cols4 li li, ul.cols4 li li a{color:#57271f !important; font-weight:normal !important;}

/* order.menu */
#cookiesbar{height:31px; background:transparent url(../images/order-menu-cookiesbar-bg.gif) repeat-x; padding-top:2px; margin-bottom:11px;}
#orderMenuBox{}
  #orderMenuBox .head{}
    #orderMenuBox .keys{margin-bottom:0px;}
    
  /* items */
  ul#orderMenuItems{}
  #orderMenuItems li{margin: 10px 0; position: relative;}
  #orderMenuItems .info{width:225px; float:left; padding-top:4px;}
    #orderMenuItems .info .title{font-size:14px; font-weight:bold;}
    #orderMenuItems .info .title a{font-size:14px; font-weight:bold; text-decoration:none !important;}
      span.vegan{background:transparent url(../images/order-menu-icon-vegan.gif) no-repeat right; padding-right:20px;}
      span.vegan-wheat{background:transparent url(../images/icon-vegan-wheat.png) no-repeat right; padding-right:37px;}
      span.vegan-gluten-wheat{background:transparent url(../images/icon-vegan-gluten-wheat.png) no-repeat right; padding-right:51px;}
    #orderMenuItems .info .smart{font-size:12px; padding-left:10px;}
    #orderMenuItems .info .ingredients{font-size:12px; margin-left:10px; height:1%; display:block;}
    
  #orderMenuItems .basket{width:200px; float:right; position:relative; padding-top:4px;}
    #orderMenuItems .basket .price{font-size:13px;}
    #orderMenuItems .basket .form{font-size:11px; position:absolute; right:0; top:0;}
    #orderMenuItems .basket .addToBasket{position:absolute; right:0; top:30px;}
    
/* treatAnatomy */
#treatAnatomy{margin-bottom:24px;}
#treatAnatomy .nav{border-bottom:1px solid #90716d; border-top:1px solid #90716d;}

/* treatClub */
.padding0 { padding-bottom: 0 !important; }
.padding6 { padding-bottom: 6px !important; }
.padding8 { padding-bottom: 8px !important; }
.violet { color: #A96DAE !important; }
#treat-club { margin-top: 20px; }
#treat-club h2.browntext { margin: 10px 0 20px; }
#treat-club .image { margin-bottom: 20px; }
#treat-club h5 { font-size: 14px; font-weight: bold; padding: 10px 0 0; }
#treat-club .help { font-size: 12px; padding-top: 9px !important; }
#treat-month { float: left; width: 220px; }
#treat-month h4 { padding-bottom: 11px !important; padding-top: 8px !important; }
#treat-month h5 { color: #A96DAE; }
#treat-week { float: right; width: 220px; }
#treat-week h5 { color: #B2CE84; }
#treat-week ul { list-style-position: inside; list-style-type: disc; padding-bottom: 6px; }

/* checkout */
#checkout .form-input{background:#F2F2F2; border:1px solid #C9BBB9; color:#43140D; padding:3px 5px; font-size:12px;}
#checkout label { display: block; }
#checkout table { margin-bottom: 15px; width: 100%; }
.cart thead th { background: url(../images/sidebar-dotted.gif) repeat-x bottom; font-weight: bold; padding: 5px; text-align: center; }
.cart thead th.a-left { text-align: left; }
.cart thead th.first, .cart tbody td { padding-left: 0 !important; }
.cart tbody td, .cart tbody th { padding: 5px; }
.cart tbody td, .cart tbody th.a-left { text-align: left; }
.cart tbody td.a-right { text-align: right; width: 100px; }
.cart tbody td span { font-size: 10px; line-height: 11px; }
.cart tbody th { text-align: center; }
.cart tbody th label { width: 90px; }
.cart tbody label { text-align: right; }
.cart tbody tr.separator th { padding: 0; }
.cart tfoot th { font-weight: bold; }
.cart tfoot td, .cart tfoot th { background-color: #F2F2F2; text-align: right; }
.cart tfoot tr.first th { background: #F2F2F2 url(../images/sidebar-dotted.gif) repeat-x top; padding: 15px 5px 1px; }
.cart tfoot tr.middle td { padding: 2px 5px; }
.cart tfoot tr.middle.line td { border-bottom: 1px solid #57271F; padding-bottom: 10px; }
.cart tfoot tr.last th { background: #F2F2F2 url(../images/sidebar-dotted.gif) repeat-x bottom; padding: 10px 5px 15px; }
.cart .shipping th { text-align: left; }
.cart .form-checkbox, .cart tr.checkbox span, .cart tr.checkbox label { float: left; }
.checkout td, .checkout th { padding: 5px; vertical-align: middle; }
.checkout td { padding-left: 0 !important; }
.checkout th { text-align: right; }
.checkout a.arrow-left { background: url(../images/icon-arrow-left.gif) 0 2px no-repeat; display: block; padding-left: 10px; }
.zone { border-bottom: 1px dotted #57271F; border-top: 1px dotted #57271F; margin-bottom: 15px; padding-top: 10px; }
.zone table { margin-bottom: 10px !important; }

.gift { background-color: #57271F; color: #FFF; font-weight: bold; }
.gift label, .gift ul li { float: left; }
.gift label { display: block; padding-right: 20px; }
.gift li label { display: inline; padding-right: 0; }

.promise { list-style: disc inside; }
.promise li { font-weight: bold; padding-bottom: 10px; }
.fun { list-style: disc inside; }
.fun li { padding-bottom: 10px; }

/* updater */
#updater { background-image: url(../images/bg-updating-basket.png); height: 100%; position: absolute; top: 0; width: 100%; z-index: 3; }
#updater div { height: 100%; position: relative; width: 100%; }
#updater div img { left: 50%; margin-left: -64px; margin-top: -9px; position: absolute; top: 50%; }

/* overlay */
body { position: relative; }
#overlay { background-color: #FFF; border: 1px solid #57271F; left: 50%; margin-left: -50px; margin-top: -30px; padding: 10px; position: absolute; top: 50%; width: 100px; }
#overlay p { padding: 0; }

.delivery { margin-bottom: 15px; width: 350px; }
.delivery thead td { padding: 5px 0 0; }
.delivery tbody th { background: transparent url(../images/sidebar-dotted.gif) no-repeat scroll left bottom; font-weight: bold; padding: 10px 0 5px; text-align: left; }
.delivery tbody tr.first td { padding-top: 5px; }

.gallery { margin: 10px auto 0; }
.gallery td { height: 100px; padding: 5px; vertical-align: middle; width: 100px; }

.article { background: url(../images/sidebar-dotted.gif) left bottom no-repeat; padding: 20px 0; }
#content .article h4, #content .article h4 a { color: #57271F; font-size: 13px; font-weight: bold; text-decoration: none; }
#content .article h4 a:hover { text-decoration: underline; }
#content .article p.date { font-size: 11px; padding: 0 0 15px; text-align: right; }
#content .article p.font { padding-bottom: 15px; text-align: right; }
#content .article p { padding: 0px 20px; }
#content .article a { color: #A4C86A; }
#payment_card_exp_date_day { display: none; }

.name li { margin-bottom: 10px; background-position: 0 0; background-repeat: no-repeat; padding-left: 30px; padding-top: 5px; }
.name li.one { background-image: url(../images/icon-one-spoon.gif); }
.name li.two { background-image: url(../images/icon-two-spoons.gif); }
.name li.three { background-image: url(../images/icon-three-spoons.gif); }

#letter { background-color: #FFF; border: 1px solid #57271F; height: 380px; left: 50%; margin-left: -210px; margin-top: -205px; padding: 15px 10px; position: absolute; top: 50%; width: 400px; -moz-border-radius: 7px; -webkit-border-radius: 7px; -khtml-border-radius: 7px; }
#letter .close { position: absolute; right: 10px; top: 15px; }