/* colour reference */
/* purple: 3E1C3B 
   nav: A986AB 
   footer line: 4d3348,
   footer text: 8d6089 */

/* sitewide & sifr fallback */
  html { height:100%; overflow: auto }
  
  body { font-family: Arial, sans-serif; font-size:76.5%; height:100%; padding:0; /*width:100%;*/ color:white; overflow:auto; position:relative; background:top center no-repeat fixed } 
  #nav li { color:white; text-decoration:none; }
  #nav li a { color:inherit }
  #nav li a:hover { color:white; text-decoration:none }

/* structural */
  #inner { background: top left repeat-y; margin:0 auto; min-height:100%; position:relative; width:830px; z-index:50 }
  * html #inner { height:100% }
  #content { height: 100%; margin:0 60px; min-height:1000px; padding: 30px 0; position:relative; width:710px; z-index: 100 }
  * html #content { height:1000px; margin: 0 30px 0 60px; width:740px } /* prevent float drop */
  #main #nav { background:bottom center no-repeat; float:right; font-size:1em; line-height:13px; padding:0 0 30px; position:relative; text-align:center; width:550px; margin:16px -30px 38px -30px }
  #main { float:right; height:auto; min-height:0; padding-bottom:1em; position:relative; width:470px }
  #secondary { float:left; padding-bottom:1em; width:226px }
  .box { background: bottom left no-repeat; padding:20px 0 32px 0 }
  #content .box:last-child { background:none; padding-bottom:0 }
  
  /* for pages with wide boxes */
    #first-box { min-height:660px } /* to clear quote in left col */
    * html #first-box { height:500px } /* col is wider in IE6 to avoid float drop */
    .widebox { background: top center no-repeat; margin:0 -40px 0 -280px; padding:48px 0 11px; position:relative }
    * html .widebox { height:232px } /* cure guillotine bug */
    .widebox p, .widebox h3 { padding-right: 40px; padding-left: 280px }
    .widebox h3 { padding-top:0 }
    .widebox img { float:left; margin:0 10px 0 0 }
    .widebox img.product-shot { margin:0 0 0 42px }
  
  .box img { float:left; margin-right:8px }
  .box h3 { clear:left }
  #footer { border-top:1px solid white; clear:both; padding-top:10px }
  
/* footer */
  #footer p { font-weight:normal }
  #footer #terms { float:left; margin-left:-8px }
  #footer #copyright-notice { margin-right:-8px; text-align:right }
  #footer p a { padding:0 8px }
  #content #footer p a:hover { color:white }

/* typography */
  #content a { color:white }
  #content a:hover { text-decoration:underline }
  h3 { color:white; padding:1em 0; text-transform:uppercase }
  p { font-size:1.1em; line-height:1.17em }
  #main p { margin:0 0 18px 8px }
  #main h2, #main cite { font-size:1.6em; font-style:normal; margin-left:8px; line-height:1.2em }
  #main cite { padding-bottom:1em; display:block }
  #main h3 { margin:0 0 0 8px; padding-top:0 }
  #main h4 { margin:-4px 0 0 8px; color:white }
  #main img { margin-bottom:28px; margin-right: 10px }
  #secondary p { font-size:.9em; line-height:1.3em; padding-top:1em; clear:both }
  ul.col { float:left; width:49%; margin-bottom:2em }
  ul.col li { padding-left:8px }
  .orange-skin #main ul { margin:0 0 2em 8px; list-style:disc; padding-left:2em }
  .orange-skin #main ul li { margin:0 0 .5em }
  #main ul.col h3 { margin:1em 0 0 }
  #Avon, #England { clear:left }
  
/* nav */
  #nav li { background: center right  no-repeat; float:left; height:13px; margin:0; overflow:hidden; padding:0 16px 0 9px; position:relative; text-align:center }
  #content #main #nav li:last-child, #content #main #nav li.last { background:none no-repeat; padding-right:0 }
  #nav a { display:block; height:13px; overflow:hidden; position:relative; white-space: nowrap }
  * html #nav a span {  }
  #nav li a:hover { color:white }
  #nav li a span { background-position:0px 13px; display:block; height:13px; position:absolute; top:0; left:0 }
  #nav li a:hover span, #nav li.here a span { background-position:0px 0px }
  
  #nav li#nav-home a, li#nav-home span { width:46px }
  #nav li#nav-products a, li#nav-products span { width:84px}
  #nav li#nav-get-involved a, li#nav-get-involved span { width:114px }
  #nav li#nav-distribution a, li#nav-distribution span { width:108px }
  #nav li#nav-harvest a, li#nav-harvest a span { width:69px }

/* subnav */
  .subnav { border-bottom:1px solid white; margin:32px 0 60px; width:200px }
  .subnav li { border-top:1px solid white; font-size:1.2em; padding:11px 0 2px; text-align:left }
  .subnav li ul { display:none }
  
/* buttons */
  #content a.button { float:left; width:58px; height:61px; margin-right:10px; background:bottom left no-repeat; overflow:hidden; text-indent:-1000em }
  #content a.button:hover { background-position:top left }
  .pink-skin #content a.more-info { background-image: url(../images/buttons/buttons_more_info_pink.gif) }
  .pink-skin #content a.order-form { background-image: url(../images/buttons/buttons_order_form_pink.gif) }

/* skinning */
  /* purple */
    .purple-skin { color:#c494be; background-image:url(../images/backgrounds/background_home.jpg) }
    .purple-skin #inner { background-image: url(../images/backgrounds/purple-bg-texture.png) }
    * html .purple-skin #inner { background-image: url(../images/backgrounds/purple-bg-texture.gif) }
    .purple-skin #content { background-color:#3E1C3B }
    .purple-skin #main #nav { background-image: url(../images/purple-nav-underline.gif) }
    .purple-skin #main #nav li { background-image:url(../images/nav/purple-bullet.gif) }
    .purple-skin li#nav-home span { background-image:url(../images/nav/home_purple.gif) }
    .purple-skin li#nav-products span { background-image:url(../images/nav/products_purple.gif) }
    .purple-skin li#nav-get-involved span { background-image:url(../images/nav/get-involved_purple.gif) }
    .purple-skin li#nav-distribution span { background-image:url(../images/nav/distribution_purple.gif) }
    .purple-skin li#nav-harvest a span { background-image:url(../images/nav/harvest_purple.gif) }
    .purple-skin .subnav { border-bottom-color:#4e2b4b }
    .purple-skin .subnav li { border-top-color:#4e2b4b }
    .purple-skin .box { background-image:url(../images/furniture/box_underline_purple.gif) }
    .purple-skin #footer { border-top-color:#4d3348 }
    .purple-skin #footer p, .purple-skin #footer p a { color:#8d6089 }
  
  /* green */
    .green-skin { color:#88ad80; background-image:url(../images/backgrounds/background_harvest.jpg) }
    .green-skin #inner { background-image: url(../images/backgrounds/green-bg-texture.png) }
    * html .green-skin #inner { background-image: url(../images/backgrounds/green-bg-texture.gif) }
    .green-skin #content { background-color:#253322 }
    .green-skin #main #nav { background-image: url(../images/green-nav-underline.gif) }
    .green-skin #main #nav li { background-image:url(../images/nav/green-bullet.gif) }
    .green-skin li#nav-home span { background-image:url(../images/nav/home_green.gif) }
    .green-skin li#nav-products span { background-image:url(../images/nav/products_green.gif) }
    .green-skin li#nav-get-involved span { background-image:url(../images/nav/get-involved_green.gif) }
    .green-skin li#nav-distribution span { background-image:url(../images/nav/distribution_green.gif) }
    .green-skin li#nav-harvest a span { background-image:url(../images/nav/harvest_green.gif) }
    .green-skin .subnav { border-bottom-color:#2b3d27 }
    .green-skin .subnav li { border-top-color:#2b3d27 }
    .green-skin .box { background-image:url(../images/furniture/box_underline_green.gif) }
    .green-skin #footer { border-top-color:#374732 }
    .green-skin #footer p, .green-skin #footer p a { color:#758672 }
  
  /* orange */
    .orange-skin { color:#e8c2a5; background-image:url(../images/backgrounds/background_get_involved.jpg) }
    .orange-skin #inner { background-image: url(../images/backgrounds/orange-bg-texture.png) }
    * html .orange-skin #inner { background-image: url(../images/backgrounds/orange-bg-texture.gif) }
    .orange-skin #content { background-color:#96381c }
    .orange-skin #main #nav { background-image: url(../images/orange-nav-underline.gif) }
    .orange-skin #main #nav li { background-image:url(../images/nav/orange-bullet.gif) }
    .orange-skin li#nav-home span { background-image:url(../images/nav/home_orange.gif) }
    .orange-skin li#nav-products span { background-image:url(../images/nav/products_orange.gif) }
    .orange-skin li#nav-get-involved span { background-image:url(../images/nav/get-involved_orange.gif) }
    .orange-skin li#nav-distribution span { background-image:url(../images/nav/distribution_orange.gif) }
    .orange-skin li#nav-harvest a span { background-image:url(../images/nav/harvest_orange.gif) }
    .orange-skin .widebox { background-image: url(../images/furniture/orange-wide-underline.gif) }
    .orange-skin .subnav { border-bottom-color:#a95036 }
    .orange-skin .subnav li { border-top-color:#a95036 }
    .orange-skin .box { background-image:url(../images/furniture/box_underline_orange.gif) }
    .orange-skin #footer { border-top-color:#9a4b2d }
    .orange-skin #footer p, .orange-skin #footer p a { color:#d0836c }
  
  /* "brown" (red) */
    .brown-skin { color:#cd9989; background-image:url(../images/backgrounds/background_distribution.jpg) }
    .brown-skin #inner { background-image: url(../images/backgrounds/brown-bg-texture.png) }
    * html .brown-skin #inner { background-image: url(../images/backgrounds/brown-bg-texture.gif) }
    .brown-skin #content { background-color:#5a1400 }
    .brown-skin #main #nav { background-image: url(../images/brown-nav-underline.gif) }
    .brown-skin #main #nav li { background-image:url(../images/nav/brown-bullet.gif) }
    .brown-skin li#nav-home span { background-image:url(../images/nav/home_brown.gif) }
    .brown-skin li#nav-products span { background-image:url(../images/nav/products_brown.gif) }
    .brown-skin li#nav-get-involved span { background-image:url(../images/nav/get-involved_brown.gif) }
    .brown-skin li#nav-distribution span { background-image:url(../images/nav/distribution_brown.gif) }
    .brown-skin li#nav-harvest a span { background-image:url(../images/nav/harvest_brown.gif) }
    .brown-skin .subnav { border-bottom-color:#691d08 }
    .brown-skin .subnav li { border-top-color:#691d08 }
    .brown-skin .box { background-image:url(../images/furniture/box_underline_brown.gif) }
    .brown-skin #footer { border-top-color:#662c14 }
    .brown-skin #footer p, .brown-skin #footer p a { color:#b5755f }
  
  /* pink */
    .pink-skin { color:#d6a5b8; background-image:url(../images/backgrounds/background_products.jpg) }
    .pink-skin #inner { background-image: url(../images/backgrounds/pink-bg-texture.png) }
    * html .pink-skin #inner { background-image: url(../images/backgrounds/pink-bg-texture.gif) }
    .pink-skin #content { background-color:#741e3f }
    .pink-skin #main #nav { background-image: url(../images/pink-nav-underline.gif) }
    .pink-skin #main #nav li { background-image:url(../images/nav/pink-bullet.gif) }
    .pink-skin li#nav-home span { background-image:url(../images/nav/home_pink.gif) }
    .pink-skin li#nav-products span { background-image:url(../images/nav/products_pink.gif) }
    .pink-skin li#nav-get-involved span { background-image:url(../images/nav/get-involved_pink.gif) }
    .pink-skin li#nav-distribution span { background-image:url(../images/nav/distribution_pink.gif) }
    .pink-skin li#nav-harvest a span { background-image:url(../images/nav/harvest_pink.gif) }
    .pink-skin .widebox { background-image: url(../images/furniture/pink-wide-underline.gif) }
    .pink-skin .subnav { border-bottom-color:#863051 }
    .pink-skin .subnav li { border-top-color:#863051 }
    .pink-skin .box { background-image:url(../images/furniture/box_underline_pink.gif) }
    .pink-skin #footer { border-top-color:#7c344c }
    .pink-skin #footer p, .pink-skin #footer p a { color:#c45f86 }