/* Site: Whole Earth Farms */

* {
  margin: 0;
  padding: 0;
}

body{
  background: #ad8d47 url(/_img/bg_body.jpg);
  font-family: Arial, Helvetica, Verdana, Tahoma, sans-serif;
  line-height: 1;
}

hr{
  display: none;
}

#skip{
  position: absolute;
  left: -9999px;
}

a{
  overflow: hidden;
}

/* =container
---------------------------------------------------------------------
*/

#container{
  width: 1080px;
  margin: 0 auto;
}

body.home #container{
  background: url(/_img/bg_container_home.png) no-repeat;
}

body.interior-farm #container{
  background: #ffeab8 url(/_img/bg_container_interior-farm.png) no-repeat left bottom;
}

body.manufacturing #container{
  background: #ffeab8 url(/_img/bg_container_manufacturing.png) no-repeat left bottom;
}

body.interior-truck #container{
  background: #ffeab8 url(/_img/bg_container_interior-truck.png) no-repeat left bottom;
}

body.wholesome #container{
  background: #ffeab8 url(/_img/bg_container_wholesome.png) no-repeat left bottom;
}

body.blog #container{
  background: #ffeab8 url(/_img/bg_container_blog.png) no-repeat left bottom;
}

/* =header
---------------------------------------------------------------------
*/

#header h1{
  display: inline; /* IE6 double margin float bug hack */
  float: left;
  width: 303px;
  height: 72px;
  margin: 30px 0 25px 388px;
  background: url(/_img/bg_h1.png) no-repeat;
  text-indent: -9999px;
}

#header h1 a{
  display: block;
  width: 303px;
  height: 72px;
}

/* =nav
---------------------------------------------------------------------
*/

#nav{
  display: inline; /* IE6 double margin float bug hack */
  clear: left;
  float: left;
  width: 1002px;
  margin: 0 0 22px 137px;
  background: url(/_img/bg_nav.png) no-repeat;
  list-style: none;
}

/*body.interior-farm #nav,
body.manufacturing #nav{
  margin-bottom: 70px;
}

body.interior-truck #nav{
  margin-bottom: 45px;
}*/

#nav li{
  float: left;
}

#nav li a{
  display: block;
  height: 22px;
  margin: 0 1px;
  text-indent: -9999px;
}

#nav li#nav_the-story a{width: 143px;}
#nav li#nav_nutrition a{width: 147px;}
#nav li#nav_wholesome-fun a{width: 205px;}
#nav li#nav_maddies-blog a{width: 193px;}
#nav li#nav_brochure a{width: 146px;}
#nav li#nav_contact-us a{width: 156px;}

#nav li ul{
  display: none;
  margin: 6px 0 0 14px;
}

#nav li.current ul{
  display: block;
  position: absolute;
}

#nav li ul li{
  float: none;
  border-bottom: 1px solid #6c5635;
  font-size: 12px;
  font-weight: bold;
  text-transform: uppercase;
  list-style: none;
  letter-spacing: .06em;
}

#nav li ul li a{
  width: auto !important;
  height: auto;
  padding: 5px 0 4px;
  color: #6c5635;
  text-decoration: none;
  text-indent: 0;
}

/* =content
---------------------------------------------------------------------
*/

#content{
  clear: both;
  width: 712px;
  margin: 0 0 422px 198px;
}

body.home #content{
  height: 568px;
  margin: 0;
}

body.interior-truck #content{
  display: inline; /* IE6 double margin float bug hack */
  float: left;
  width: 365px;
  margin: 0 0 365px 54px;
}

body.interior-truck.feeding #content{
  width: 430px;
  height: 317px;
  margin: 0 0 377px 47px;
}

#content h2{
  margin-bottom: .1333em;
  color: #6c5635;
  font-size: 30px;
  letter-spacing: .05em;
}

body.manufacturing #content h2{
  margin-bottom: .5em;
  text-align: center;
}

#content h3,
#content h4,
#content h5,
#content h6{
  color: #6c5635;
}

#content p,
#content li{
  margin-bottom: 1em;
  color: #6c5635;
  font-size: 14px;
  line-height: 1.5;
}

#content ul,
#content ol{
  margin: 0 0 1em 3em;
}

#content ul#byline{
  display: inline; /* IE6 double margin float bug hack */
  float: left;
  margin-bottom: 10px;
  list-style: none;
}

#content li{
  margin: 0;
}

#content blockquote{
  margin-left: 3em;
}

#content hr{
  display: block;
  margin-bottom: 1em;
}

#content a{
  color: #6c5635;
  font-weight: bold;
}

#content a:hover{
  text-decoration: none;
}

body.wholesome #contentWrap{
  position: relative;
  float: left;
  width: 1080px;
  margin: 22px 0 82px;
  background:  url(/_img/bg_content_wholesome.png) no-repeat 448px bottom;
}

body.wholesome #content{
  display: inline; /* IE6 double margin float bug hack */
  float: left;
  width: 655px;
  padding-bottom: 91px;
  margin: 0 0 0 36px;
}

body.wholesome #content .lower{
  width: 446px;
}

body.wholesome #content h3{
  margin-bottom: .25em;
  color: #6c5635;
  font-size: 13px;
  text-transform: uppercase;
}

body.wholesome #content img{
  display: block;
  margin: 10px 0;
}

body.wholesome #content p,
body.wholesome #content li{
  margin-bottom: 1.25em;
  font-size: 13px;
  line-height: 1.15;
}

body.wholesome #content ol{
  margin: 0 0 0 20px;
}

/* =clickHere
---------------------------------------------------------------------
*/

#clickHere{
  float: left;
  width: 437px;
  margin-top: 74px;
}

#clickHere p{
  margin-bottom: 3.5em;
  font-size: 20px;
  text-transform: uppercase;
  text-align: center;
  line-height: 1.2;
  letter-spacing: .025em;
}

#clickHere p a{
  display: block;
  padding-right: 100px;
  background: url(/_img/bg_clickHere.png) no-repeat right center;
  text-decoration: none;
}

#clickHere p.last a{
  padding-left: 85px;
  padding-right: 95px;
}

/* =contactInfo
---------------------------------------------------------------------
*/

#contactInfo{
  float: right;
  width: 317px;
  margin-top: 27px;
  padding-left: 64px;
  border-left: 3px solid #6c5635;
}

#contactInfo h3{
  margin-bottom: .15em;
  font-size: 14px;
  text-transform: uppercase;
}

#contactInfo p{
  margin-bottom: 1.4em;
  line-height: 1.3;
}

#contactInfo p.last{
  margin-bottom: 0;
}

#contactInfo a{
  font-weight: normal;
  text-decoration: none;
}

#contactInfo a:hover{
  text-decoration: underline;
}

/* =feeding
---------------------------------------------------------------------
*/

body.feeding #content img{
  float: left;
}

body.feeding #content p{
  float: left;
  line-height: 1.25;
}

body.feeding #content ul#feedingMenu{
  float: left;
  margin: 50px 0 7px 0;
}

body.feeding #content ul li{
  border-bottom: 1px solid #6c5635;
  font-size: 14px;
  text-transform: uppercase;
  list-style: none;
}

body.feeding #content ul li a{
  display: block;
  padding: 5px 1px;
  color: #6c5635;
  text-decoration: none;
  outline: 0;
}

body.feeding #content ul li a.current,
body.feeding #content ul li a:hover{
  color: #a84d0f;
}

/* =sidebar
---------------------------------------------------------------------
*/

#sidebar{
  display: inline; /* IE6 double margin float bug hack */
  float: right;
  width: 268px;
  margin-right: 34px;
}

#sidebar h3{
  margin-bottom: .25em;
  color: #6c5635;
  font-size: 13px;
  text-transform: uppercase;
}

#sidebar p{
  margin-bottom: 1.14em;
  color: #6c5635;
  font-size: 13px;
  line-height: 1.15;
}

#sidebar p strong,
#sidebar p b{
  display: block;
}

/* =blog
---------------------------------------------------------------------
*/

body.blog #contentWrap{
  clear: left;
}

#welcome{
  display: inline; /* IE6 double margin float bug hack */
  float: left;
  width: 209px;
  margin: 20px 0 0 36px;
  padding: 0 18px 100px 0;
  border-right: 3px solid #6c5635;
}

#welcome img{
  display: block;
  margin-bottom: 18px;
}

#welcome h3{
  margin-bottom: 1em;
  padding-bottom: 5px;
  border-bottom: 3px solid #6c5635;
  color: #6c5635;
  font-size: 12px;
  font-weight: bold;
  text-transform: uppercase;
}

#welcome h4{
  margin-bottom: .25em;
  color: #6c5635;
  font-size: 12px;
  font-weight: bold;
  text-transform: uppercase;
  line-height: 1.25;
}

#welcome h4 a{
  color: #6c5635;
  text-decoration: none;
}

#welcome h4 a:hover{
  text-decoration: underline;
}

#welcome p{
  margin-bottom: 1.5em;
  color: #6c5635;
  font-size: 12px;
}

#welcome p a{
  color: #6c5635;
  font-weight: bold;
  text-transform: uppercase;
}

#welcome p a:hover{
  text-decoration: none;
}

body.blog #content{
  display: inline; /* IE6 double margin float bug hack */
  clear: none;
  float: left;
  margin: 20px 0 183px 30px;
  width: 398px;
}

body.blog #content h2{
  float: left;
  width: 300px;
  margin-bottom: 1em;
  font-size: 18px;
  text-transform: uppercase;
  letter-spacing: 0;
}

body.blog #content h2 span{
  font-size: 13px;
  font-weight: normal;
  text-transform: none;
}

body.blog #content p{
  clear: both;
  margin-bottom: 1.15em;
  font-size: 13px;
  line-height: 1.15;
}

body.blog #content p.commentCount{
  clear: none;
  float: right;
  margin: 5px 0 0 0;
  padding: 1px 0 2px 21px;
  background: url(/_img/bg_commentCount.png) no-repeat;
  font-size: 11px;
}

body.blog #content p.commentCount a{
  color: #007aa6;
  font-weight: normal;
  text-decoration: none;
}

body.blog #content img.friend{
  float: right;
}

body.blog #content div.post{
  margin-bottom: 40px;
}

body.blog #content #comments{
  margin-top: 25px;
}

body.blog #content #comments .comment{
  border-top: 1px solid #6c5635;
  padding-top: 10px;
}

body.blog #content #comments label{
  display: none;
}

body.blog #content #comments input#name,
body.blog #content #comments textarea{
  display: block;
  width: 382px;
  margin-bottom: 10px;
  padding: 5px 7px;
  border: 1px solid #6c5635;
  color: #6c5635;
  font-family: Arial, Helvetica, Verdana, Tahoma, sans-serif;
  font-size: 13px;
  font-weight: bold;
  text-transform: uppercase;
}

body.blog #content #comments input#name.typing,
body.blog #content #comments textarea.typing{
  font-weight: normal;
  text-transform: none;
}

body.blog #content #comments input#commentSubmit{
  float: right;
}

body.blog #content p#pagination{
  text-align: right;
}

body.blog #content p#pagination a{
  margin: 0 5px;
}

body.blog #content p#pagination a#off{
  display: none;
}

/* subscribe */

#subscribe_top{
  display: inline; /* IE6 double margin float bug hack */
  float: right;
  width: 332px;
  height: 26px;
  margin-right: 17px;
  background: url(/_img/bg_subscribe_top.png) no-repeat;
}

#subscribe{
  display: inline; /* IE6 double margin float bug hack */
  float: right;
  width: 262px;
  margin-right: 17px;
  padding: 0 35px;
  background: url(/_img/bg_subscribe.png) repeat-y;
}

#subscribe_bottom{
  display: inline; /* IE6 double margin float bug hack */
  clear: right;
  float: right;
  width: 332px;
  height: 148px;
  margin: 0 17px 100px 0;
  background: url(/_img/bg_subscribe_bottom.png) no-repeat;
}

#subscribe_bottom p{
  margin: 9px 35px;
  color: #6c5635;
  font-size: 12px;
}

#subscribe_bottom p a{
  color: #6c5635;
  font-weight: bold;
  text-transform: uppercase;
}

#subscribe h3{
  clear: left;
  margin: 0 -6px 1em;
  padding: 0 6px 5px;
  border-bottom: 3px solid #6c5635;
  color: #6c5635;
  font-size: 12px;
  font-weight: bold;
  text-transform: uppercase;
}

#subscribe h4{
  margin-bottom: .25em;
  color: #6c5635;
  font-size: 12px;
  font-weight: bold;
  text-transform: uppercase;
  line-height: 1.25;
}

#subscribe h4 a{
  color: #6c5635;
  text-decoration: none;
}

#subscribe h4 a:hover{
  text-decoration: underline;
}

#subscribe li{
  float: left;
  margin: 0 5px 20px 0;
  list-style: none;
}

#subscribe li img{
  border: 0;
}

#subscribe p{
  margin-bottom: 1.5em;
  color: #6c5635;
  font-size: 12px;
}

#subscribe p a{
  color: #6c5635;
  font-weight: bold;
  text-transform: uppercase;
}

#subscribe p a:hover{
  text-decoration: none;
}

/* =diagram
---------------------------------------------------------------------
*/

#diagram{
  float: right;
  width: 514px;
  padding: 0 43px;
  border-left: 3px solid #6c5635;
}

body.feeding #diagram{
  width: 487px;
}

#diagram p,
#diagram li{
  clear: left;
  margin-bottom: 1em;
  color: #6c5635;
  font-size: 14px;
  line-height: 1.5;
}

#diagram a{
  color: #6c5635;
  font-weight: bold;
}

#diagram img{
  display: block;
  margin: 0 0 23px -9px;
}

#diagram ul{
  float: left;
  margin-bottom: 1em;
}

#diagram ul li{
  clear: none;
  float: left;
  margin: 0 15px 0 0;
  list-style: none;
}

/* ingredients */

#ingredients{
  width: 530px;
  height: 420px;
  margin-bottom: 23px;
  /*background: url(/_img/bg_ingredients.png) no-repeat center center;*/
}

#ingredients a{
  float: left;
  width: 106px;
  height: 90px;
  margin-bottom: 16px;
  text-indent: -9999px;
}

#ingredients img{
  border: 0;
  margin: 0;
}

/* ingredientPopup */

#ingredientPopup{
  display: none;
  position: absolute;
  left: 50%;
  z-index: 100;
  width: 923px;
  height: 510px;
  margin: 109px 0 0 -461px;
  background: url(/_img/bg_ingredientPopup.png) no-repeat;
}

body.wholesome #ingredientPopup{
  position: fixed;
}

#ingredientPopup img{
  display: inline; /* IE6 double margin float bug hack */
  float: left;
  margin: 130px 0 0 85px;
}

#ingredientPopup p{
  display: inline; /* IE6 double margin float bug hack */
  float: right;
  width: 417px;
  margin: 130px 80px 0 0;
  color: #ffedc3;
  font-size: 18px;
  line-height: 1.3333;
  letter-spacing: .025em;
}

#ingredientPopup p strong{
  font-weight: bold;
  text-transform: uppercase;
}

/* =homeBoxes
---------------------------------------------------------------------
*/

ul#homeBoxes{
  clear: left;
  float: left;
  width: 1068px;
  padding: 0 0 3px 12px;
}

ul#homeBoxes li{
  display: inline; /* IE6 double margin float bug hack */
  float: left;
  margin: 0 6px;
  list-style: none;
}

ul#homeBoxes a{
  display: block;
}

ul#homeBoxes img{
  display: block;
  border: 0;
}

/* =footer
---------------------------------------------------------------------
*/

#footer{
  position: relative;
  clear: both;
  padding: 19px;
}

body.interior-farm #footer,
body.interior-truck #footer{
  padding-bottom: 14px;
}

body.wholesome #footer{
  padding-right: 37px;
  padding-bottom: 14px;
}

#footer p{
  color: #ffeab8;
  font-size: 8px;
  font-weight: bold;
  letter-spacing: .06em;
}

body.wholesome #footer p{
  color: #522c1b;
  text-align: right;
}

#footer p a{
  color: #ffeab8;
  text-decoration: none;
  text-transform: lowercase;
}

body.wholesome #footer p a{
  color: #522c1b;
}

#footer p a:hover{
  text-decoration: underline;
}

#footer #buyNow{
  position: absolute;
  bottom: 38px;
  left: 29px;
  text-indent: -9999px;
}

body.home #footer #buyNow{
  bottom: 214px;
}

body.wholesome #footer #buyNow{
  display: none;
}

#footer #buyNow a{
  display: block;
  width: 121px;
  height: 121px;
}
