body {
  background: #222222 url(../images/bg.jpg) repeat-x center top;
  background-attachment: fixed;
  text-align: center;
  font: 75%/1.5em arial, helvetica, sans-serif;
  padding: 0px;
  margin: 0px;
  color: #333333;
}

form { margin: 0px; padding: 0px; }
input, select { vertical-align: middle; }
a { color: #e37c27; text-decoration: none; outline: none; }
a:hover { color: #828282; text-decoration: underline; }
a.current { color: #e37c27; }
a.gray { color: #666666; text-decoration: none; }
a.gray:hover { color: #e37c27; text-decoration: underline; }
img { border: 0px; vertical-align: middle; }
hr { border: none; border-bottom: 1px solid #cccccc; margin: 1em 0px; }

h1 {
  font-weight: bold;
  font-size: 44px;
  color: #e37c27;
  margin: 0px 0px 10px 0px;
  line-height: 0.9em;
  letter-spacing: -2px;
}

h2 {
  font-weight: bold;
  font-size: 32px;
  color: #e37c27;
  margin: 0px 0px 10px 0px;
  letter-spacing: -2px;
}

h3 {
  font-weight: bold;
  font-size: 26px;
  color: #666666;
  margin: 0px 0px 5px 0px;
  letter-spacing: -2px;
}

h4 {
  font-weight: bold;
  font-size: 1.2em;
  color: #666666;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
}

a.button {
  display: block;
  float: left;
  padding: 1px 6px;
  border: 1px solid #b3b3b3;
  background: url(/images/button.png) repeat-x center center;
  color: #666666;
}

input.button {
  padding: 1px 6px;
  border: 1px solid #b3b3b3;
  background: url(/images/button.png) repeat-x center center;
  color: #666666;
  font: 100%/1.5em arial, helvetica, sans-serif
}

.acenter { text-align: center; }
.aright { text-align: right; }

.fright { float: right; }

form dl { margin: 0px; }
form dt { font-weight: bold; }
form dd { margin: 0px 0px 5px 0px; }

.error { color: red; }
span.small { font-size: 90%; }

div.fieldWithErrors { display: inline; }

/* Header
 *****************************************************************************/

div#header {
  width: 995px;
  background: transparent url(../images/header_bg.png) no-repeat left top;
  padding: 50px 45px 0px 45px;
  margin: 0px auto 0px auto;
  height: 94px;
  position: relative;
}

div#header a#logo {
  position: absolute;
  left: 69px;
  top: 71px;
  width: 322px;
  height: 63px;
  text-indent: -9000px;
  background: url(../images/logo.png) no-repeat left top;
}

div#header-right { padding: 25px 20px 0px 0px; }

div#header-right a#phone {
  display: block;
  float: right;
  text-indent: -9000px;
  background: url(/images/phone.png) no-repeat left top;
  width: 141px;
  height: 39px;
  margin-top: 8px;
}

div#header-right ul {
  float: right;
  list-style: none;
  margin: 0px 16px 0px 0px;
  padding: 0px;
  text-align: left;
}
div#header-right ul a { font-weight: bold; }

div#header-right a#bag {
  display: block;
  float: right;
  background: url(/images/bag.png) no-repeat center top;
  padding-top: 30px;
  margin: 0px 20px 0px 0px;
  width: 60px;
  position: relative;
  color: #666;
}

a#bag div#bag-added {
  position: absolute;
  right: 60px;
  top: -5px;
  width: 101px;
  height: 57px;
  overflow: hidden;
  display: none;
}

div#bag-added div#slit {
  position: absolute;
  right: 0px;
  top: -5px;
  background: url(/images/slit.png) no-repeat right top;
  width: 12px;
  height: 57px;
  z-index: 2;
}
div#bag-note {
  position: absolute;
  right: -100px;
  top: 5px;
  height: 30px;
  width: 90px;
  padding: 5px;
  background: #e37c27;
  color: white;
  z-index: 1;
  font-size: 90%;
  line-height: 1.3em;
  text-align: left;
}

div#menu {
  position: absolute;
  top: 0px;
  right: 25px;
  z-index: 10;
}

div#menu ul {
  list-style: none;
  margin: 0px;
  padding: 0px;
}

div#menu li {
  float: left;
  margin-left: 14px;
}
div#menu a { color: #666666; }
div#menu li a:hover, div#menu li.current a { color: #e37c27; }
div#menu li.current li a { color: #fff; }
div#menu li.current li a:hover { color: #e37c27; }

div#menu ul, div#menu ul ul { /* all lists */
  padding: 0;
  margin: 0;
  list-style: none;
  line-height: 1;
}

div#menu li ul a {
  text-align: left;
  display: block;
  padding: 7px;
  width: 10em;
  color: white;
}

div#menu li ul li { /* all list items */
  margin: 0px;
  float: left;
  width: 12em; /* width needed or else Opera goes nuts */
  background: #333333;
}
div#menu ul li div {
  padding-top: 8px;
  position: absolute;
  background: transparent;
  width: 12em;
  z-index: 1000000;
  left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
}
div#menu ul li ul { /* second-level lists */
  -moz-box-shadow: 0 0 5px black;
  -webkit-box-shadow: 0 0 5px black;
  opacity: 0.9;
  overflow: hidden;
}

div#menu ul li ul a { padding-left: 1.5em; }
div#menu ul li ul a:hover { background: url(/images/menudot.png) no-repeat 5px 9px; text-decoration: none; }

div#menu ul li ul ul { /* third-and-above-level lists */
  margin: -1em 0 0 10em;
}

div#menu ul li:hover ul ul, div#menu ul li.sfhover ul ul {
  left: -999em;
}

div#menu ul li:hover div, div#menu ul li li:hover div, div#menu ul li.sfhover div, div#menu ul li li.sfhover div { /* lists nested under hovered list items */
  left: auto;
  clear: left;
}

/* Body
 *****************************************************************************/

div#container {
  width: 995px;
  background: transparent url(../images/container_bg.png) repeat-y left top;
  padding: 0px 45px;
  margin: 0px auto;
  text-align: left;
}

div#fader {
  background: transparent url(../images/fade.png) repeat-x left bottom;
  position: relative;
  padding-top: 20px;
}

div#content {
  min-height: 400px;
  padding: 0px 20px 0px 20px;
  overflow: hidden;
}



/* Footer
 *****************************************************************************/
div#footer {
  clear: both;
  overflow: hidden;
  color: #828282;
  padding: 45px 20px 10px 20px;
  font-size: 90%;
}

div#footer a { color: #828282; }
div#footer a:hover { color: #e37c27; }

div#footer div#footer-right {
  float: right;
  width: 300px;
  padding-left: 100px;
}

div#footer div#footer-right p { margin-top: 0px; padding-top: 0px; line-height: 1.4em; }
div#footer div#footer-right a { font-size: 130%; font-weight: bold; color: #666666; }

div#footer a#bafts {
  display: block;
  margin-left: -100px;
  width: 74px;
  height: 76px;
  background: url(../images/bafts.png) no-repeat left top;
  text-indent: -9000px;
  float: left;
}

div#footer a#ifat {
  display: block;
  margin-left: -100px;
  margin-top: 85px;
  width: 76px;
  height: 53px;
  background: url(../images/ifat.png) no-repeat left top;
  text-indent: -9000px;
  float: left;
}
div#footer p { margin: 0px; padding: 0px; }

div#footer ul { float: left; list-style: none; margin: 0px 0px 0px 40px; padding: 0px; line-height: 1.6em; }
div#footer ul li.title {
  font-size: 140%;
  font-weight: bold;
  margin: 2px 0ox;
}
div#footer ul li.kazuri { color: #e37c27; }
div#footer ul.taguabella a:hover { color: #c20c29; }
div#footer ul li.taguabella { color: #c20c29; }

div#footer p#cards {
  text-indent: -9000px;
  background: url(../images/cards.png) no-repeat left center;
  margin: 0px;
  padding: 0px;
  height: 40px;
}


/* Decorations
 *****************************************************************************/

div#overlay {
 position: absolute;
 left: 0px;
 right: 0px;
 top: 0px;
 background: #000;
}

div#popup {
 position: absolute;
 left: 0px;
 top: 0px;
 width: 500px;
 height: 500px;
 overflow: auto;
 padding: 15px;
 background: white;
 text-align: left;
 z-index: 2000;
}

div#share {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 300px;
  padding: 15px;
  background: white;
  text-align: left;
}

div#boxes {
  float: right;
  clear: right;
  width: 233px;
}

div#boxes div.box {
  width: 225px;
  height: 152px;
  background: #ccc;
  margin: 20px 0px 0px 8px;
  position: relative;
  float: left;
}

div#boxes div.box p { margin: 0px; padding: 0px; }

div#boxes div.testimonial {
  width: 225px;
  margin: 20px 0px 0px 8px;
  position: relative;
  float: left;
}
div#boxes div.testimonial h3 { color: #e37c27; }
div#boxes div.testimonial p { line-height: 1.4em; font-size: 110%; }

div#boxes div.box-inner {
  position: absolute;
  left: 0px;
  bottom: 0px;
  width: 216px;
  height: 37px;
  background-repeat: no-repeat;
  background-position: bottom left;
  margin-left: -8px;
  padding-top: 115px;
  padding-left: 15px;
  padding-right: 10px;
  line-height: 1.2em;
  color: white;
}

div#boxes a.boxlink {
  position: absolute;
  left: 0;
  top: 0;
  display: block; 
  width: 241px;
  height: 152px;   
  z-index: 51;

}

div.box-inner.deliveryinformation { background: url(/images/box_small_delivery_information.png); }
div.box-inner.naturallybeautiful { background: url(/images/box_small_naturally_beautiful.png); }
div.box-inner.specialoffers { background: url(/images/box_small_special_offers.png); }

div#navigation {
  float: left;
  width: 240px;
  padding-top: 15px;
}
div#navigation ul { list-style: none; margin: 15px 0px 20px 0px; padding: 0px; }
div#navigation li { padding: 2px 0px; }

div#body-with-navigation {
  margin-left: 260px;
}

/* Home
 *****************************************************************************/
 
div#home-splash-container {
  width: 950px;
  height: 350px;
  position: relative;
  overflow: hidden;
  margin-bottom: 15px;
  z-index: 1;
}

div#home-splash-container a {
color: #ffffff;
}

div.home-splash {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 315px;
  height: 249px;
  background-repeat: no-repeat;
  background-position: left top;
  padding: 98px 590px 0px 48px;
  color: white;
}
div.home-splash.right { text-align: right; padding: 98px 48px 0px 590px; }

div#home-big-boxes {
  margin-left: -12px;
  margin-bottom: 20px;
  padding-left: 12px;
  height: 217px;
}

div#home-big-boxes div.big-box {
  width: 302px;
  height: 202px;
  margin-left: 22px;
  position: relative;
  z-index: 50;
  float: left;
}
div#home-big-boxes div.big-box.first { margin-left: 0; }

div#home-big-boxes div.big-box-inner {
  position: absolute;
  left: 0px;
  bottom: 0px;
  width: 284px;
  height: 45px;   
  padding-top: 157px;
  padding-left: 30px;  
  background-repeat: no-repeat;
  background-position: bottom left;
  margin-left: -12px;
  color: white;  
}
div#home-big-boxes a.boxlink {
  position: absolute;
  left: 0;
  top: 0;
  display: block; 
  width: 272px;
  height: 202px;   
  z-index: 51;

}
div.big-box-inner.handmadeinkenya { background: url(/images/box_big_fair_trade_in_kenya.png); }
div.big-box-inner.naturallybeautiful { background: url(/images/box_big_naturally_beautiful.png); }
div.big-box-inner.shoponline { background: url(/images/box_big_shop_online.png); }

div#home-content {
  width: 580px;
  float: left;
}

div#home-latest {
  margin-left: 650px;
}
div#home-latest div.details {
  min-height: 80px;
  position: relative;
  padding-left: 85px;
  margin: 15px 0px;
}
div#home-latest div.details img {
  position: absolute;
  left: 0px;
  top: 0px;
}
div#home-latest a.gray { font-weight: bold; }

/* Catalogue
 *****************************************************************************/

div#category-body { margin-right: 260px; }

div.pagination {
  float: right;
  font-weight: bold;
  color: #666666;
  margin: 0px;
  text-transform: lowercase;
  font-size: 16px;
}

div.filters {
  font-size: 16px;
  font-weight: bold;
  color: #666666;
  margin: 5px 0px 10px 0px;
  text-transform: lowercase;
  line-height: 1.6em;
}
div.filters select { margin-right: 10px; width: 120px; }

a.product-thumb {
  display: block;
  height: 100px;
  margin: 0px 0px 8px 0px;
}

ul.category-icons {
  margin: 0px;
  padding: 0px;
  list-style: none;
  overflow: hidden;
}

ul.category-icons li {
  float: left;
  width: 175px;
  list-style: none;
  text-align: center;
  margin: 15px 0px 0px 0px;
  padding: 0px 0px 5px 65px;
  font-size: 22px;
  font-weight: bold;
  letter-spacing: -1px;
}
ul.category-icons li.first { clear: both; padding-left: 0px; }
ul.category-icons li a { color: #666666; }
ul.category-icons img { margin: 0px 0px 5px 0px; }

ul.product-icons {
  margin: 0px;
  padding: 0px;
  list-style: none;
  overflow: hidden;
}

ul.product-icons li {
  float: left;
  width: 162px;
  list-style: none;
  margin: 15px 0px 0px 0px;
  padding: 0px 0px 3px 15px;
}
ul.product-icons li.first { clear: both; padding-left: 0px; }


div.product-name {
  font-weight: bold;
  font-size: 22px;
  color: #666666;
  margin: 0px 0px 5px 0px;
  line-height: 0.9em;
  letter-spacing: -1px;
}

div.product-name a {
  color:#828282;
}

p.product-introduction {
  color: #666666;
  margin: 7px 0px;
  line-height: 1.3em;
}

span.product-price {
  font-size: 22pt;
  font-weight: bold;
  color: #e37c27;
  letter-spacing: -2px;
  line-height: 0.85em;
}
span.product-price.reduced { color: #e33d27; }
.was { color: #aaa; text-decoration: line-through; font-size: 13pt; }
span.product-details { margin-left: 5px; }

/* Product
 *****************************************************************************/
div#product-description { margin-top: 20px; }

div#product-magnifier {
  padding-top: 20px;
  margin: 0px 0px 10px 0px;
  font-size: 14px;
  font-weight: bold;
  color: #666666;
  text-align: right;
}

div#product-picture-container {
  border: 1px solid #666666;
}

div#product-images {
  text-align: center;
  margin-left: 460px;
  height: 500px;
}
div#product-images ul { list-style: none; padding: 0px; margin: 10px 0px 0px 0px; height: 107px; float: right;   }
div#product-images li {
  background: white;
  text-align: center;
  border: 1px solid #666666;
  width: 145px;
  height: 107px;
  float: left;
  margin-left: 27px;
}
div#product-images li a { display: block; height: 107px; line-height: 107px }
div#product-images li a img { vertical-align: middle; }
div#product-images li.first { margin-left: 0px; }

div#product-body {
  width: 415px;
  float: left;
  margin-bottom: 30px;
}

div#product-info {
  margin-top: 30px;
}

div#product-suggestions {
  clear: both;
  border: 1px solid #666666;
  overflow: hidden;
  padding: 15px;
  background: white;
  margin-top: 40px;
}
div#product-suggestions ul { list-style: none; margin: 10px 0px 0px 0px; padding: 0px; }

p#product-price { margin: 20px 0px; }

p#product-price span {
  color: #e37c27;
  font-size: 28px;
  letter-spacing: -2px;
  margin-right: 20px;
  font-weight: bold;
}

p#product-price .reduced .was {
  color: #aaa;
  text-decoration: line-through;
  font-size: 15pt;
}

p#product-price .reduced {
  color: #e33d27
}

span.option-name {
  color: #666666;
  font-size: 22px;
  letter-spacing: -1px;
  font-weight: bold;
  vertical-align: middle;
}


/* Basket
 *****************************************************************************/

div#basket-related-products {
  width: 306px;
  border: 1px solid #666666;
  padding: 15px;
  float: right;
  margin-top: 30px;
  background: white;
}

div#basket-related-products ul { list-style: none; margin: 0px; padding: 0px; overflow: hidden; }
div#basket-related-products li {
  float: left;
  width: 145px;
  margin-left: 15px;
  margin-top: 15px;
}
div#basket-related-products li.first { margin-left: 0px; clear: left; }

div#basket-related-products li strong {
  color: #666666;
  font-size: 130%;
  letter-spacing: -1px;
}

div#basket {
   width: 590px;
}

table#basket-table {
  width: 590px;
  border-collapse: collapse;
}

table#basket-table thead td {
  border-bottom: 1px solid #666666;
  padding: 2px 10px;
}

table#basket-table tbody td {
  border-bottom: 1px solid #666666;
  font-size: 14px;
  font-weight: bold;
  padding: 15px 6px;
}


table#basket-table tbody tr.discount-row td {
  border-bottom: none;
}

table#basket-table td.links { width: 110px; text-align: right; }
table#basket-table td.links a { font-size: 85%; font-weight: normal; }


div#register-existing {
  width: 300px;
  float: left;
  padding-top: 4px;

}

div#register-new {
  margin-left: 330px;
  padding-left: 50px;
  border-left: 1px solid #ddd;
  padding-top: 4px;
}

div#register-new h2 {
}

div#basket-buttons p {
  overflow: hidden;
  text-align: right;
}
div#basket-buttons p.price { overflow: visible; font-size: 160%; font-weight: bold;}
div#basket-buttons p.price span.small { font-size: 70%; font-weight: normal; }
div#basket-buttons p.price strong { color: #e37c27; font-size: 150%; letter-spacing: -2px; }
div#basket-buttons a.button { float: right; }

/* Checkout
*****************************************************************************/

table#checkout { width: 720px; border-collapse: collapse; }
table#checkout thead td { border-bottom: 1px solid #666666; }
table#checkout tbody td { border-bottom: 1px solid #cccccc; }
table#checkout tfoot td { border-bottom: 1px solid #cccccc; }

#checkout-container {
  overflow: hidden;
  position: relative;
}

#checkout-sidebar {
   position: absolute;
   left: 0px;
   top: 0px;
   width: 180px;
   padding-bottom: 20px;
}
#checkout-sidebar h4 { margin: 5px 0px 5px 0px; border-bottom: 1px solid #666666; }

#checkout-inner {
  width: 700px;
  margin-left: 220px;
}

#checkout-pay {
  margin: 10px 0px 20px 0px;
  padding: 10px;
  text-align: center;
}
#checkout-pay p {
  margin: 0px 0px 10px 0px;
}

.checkout-address {
  margin: 5px 0px 0px 0px;
}

.checkout-edit {
  float: right;
  margin-top: 4px;
  margin-right: 3px;
  font-size: 10px;
}

#checkout-progress {
  height: 20px;
  line-height: 20px;
  margin: 0px 0px 20px 0px;
  padding: 0px;
  list-style: none;
}
#checkout-progress li {
  float: left;
  padding: 0px 20px;
  background: #eee;
  border-right: 1px solid white;
}
#checkout-progress a { padding: 0px 20px; background: #ddd; display: block; }
#checkout-progress li.current, #checkout-progress li.active { padding: 0px 0px; }

/* Trade
 *****************************************************************************/

form#trade-form { display: block; margin: 20px 0px 80px 0px; }

form#trade-form dt { font-weight: normal; }

table#trade-products {
  width: 950px;
  border-collapse: collapse;
  margin-top: 20px;
}

table#trade-products td {
  border: 1px solid #ddd;
  padding: 2px 3px;
  background: white;
}

table#trade-products thead td {
  background: #ddd;
  padding: 2px 3px;
}

table#trade-products tr.highlight td { background: #ccdba0; }

span#trade-loading { display: none; margin-left: 20px; }

dl#trade-header { margin-bottom: 20px; }
dl#trade-header dt { float: left; width: 150px; }
dl#trade-header dd { margin-left: 160px; }

div#trade-totals { margin-top: 20px; }
div#trade-totals dt { float: left; width: 100px; }
div#trade-totals dd { margin-left: 110px; width: 60px; text-align: right; }

dl#trade-special { margin-top: 20px; }
dl#trade-special dt { float: left; width: 100px; }
dl#trade-special dd { margin-left: 110px; width: 60px; text-align: right; }

dl#trade-payment dt { float: left; width: 270px; }
dl#trade-payment dd { margin: 0px 0px 5px 290px; }

table#trade-basket {
  width: 950px;
  border-collapse: collapse;
  margin-top: 20px;
}

table#trade-basket td {
  border: 1px solid #ddd;
  padding: 2px 3px;
  background: white;
}

table#trade-basket tfoot td { border: none; }

table#trade-basket thead td {
  background: #ddd;
  padding: 2px 3px;
}
table#trade-basket dt { float: left; width: 140px; text-align: right; }
table#trade-basket dd { text-align: right; }
a#active-currency  { color: #666666;}
a:hover#active-currency { color: #666666; text-decoration: none;}
a#inactive-currency  { color: #E37C27;}
a:hover#inactive-currency { color: #E37C27; text-decoration: none;}

/* Account
*****************************************************************************/

table#history { width: 100%; border-collapse: collapse; }
table#history thead td { border-bottom: 1px solid #666666; }


/* Page
 *****************************************************************************/
 
div#page-body { margin-right: 260px; }

div#page-featured { float: right; width: 233px; padding-top: 20px; }

div#page-featured h2 { font-size: 20pt; }

div#page-featured ul {
  list-style: none;
  margin: 0px;
  padding: 0px;
}

div#page-featured li { margin: 5px 0px; overflow: auto; }
div#page-featured li img { float: left; margin: 0px 5px 5px 0px; }

img.page-banner { margin: 0px 0px 15px 0px; }

/* News
 *****************************************************************************/

ol.news-articles {
  list-style: none;
  margin: 0px;
  padding: 0px;
}

ol.news-articles li {
  margin: 15px 0px;
  overflow: hidden;
}

div.news-article-thumb { float: left; width: 80px;  margin: 0px 10px 10px 0px; }

div.event-thumb { float: left; width: 80px;  margin: 0px 10px 10px 0px; }

div.event { height: 85px;}

ul.product-thumbs
{
  list-style: none;
}
