@charset "UTF-8";
/* CSS Document */
* {
margin: 0px;
padding: 0px;
font: 10px Verdana, Arial, Helvetica, sans-serif;
}
body {
margin: 0px;
padding: 0px;
background: #fff;
text-align: center;
}
#wrapper {
width:800px;
_width:774px;
/*height:auto;*/
height: 400px;
border-top:solid 1px #758B1A;
border-left:solid 1px #758B1A;
border-right:solid 1px #758B1A;
margin:30px auto;
/*margin: 0px auto;*/
 background: #FFF;  
/* position:relative; */
}
#wrapper2 {
width:800px;
_width:774px;
height:auto;
border-top:solid 1px #758B1A;
border-left:solid 1px #758B1A;
border-right:solid 1px #758B1A;
margin:30px auto;
/*margin: 0px auto;*/
/* background: #FFF;  */
position:relative;
}
#header {
float:left;
width:800px;
height:80px;
background: url(../images/buttonback.jpg) repeat;
}
#menu {
float:left;
width: 774px;
height: 50px;
padding:0px 12px 0px 14px;
_padding:0px 12px 0px 12px;
text-align:left;
}
#menu ul{
list-style-type: none;
}
#menu ul li {
display: inline; /* Prevents "stepdown" */
}
#menu ul li a {
float:left;
display:block;
font: 12px Verdana, Arial, Helvetica, sans-serif;
color:#FFF;
text-decoration:none;
width: 112px;
height: 25px;
padding: 25px 0px 0px 15px;
margin:0px 2px 0px 0px;
background: url(../images/globalmenu_up.jpg) no-repeat;
}
#menu ul li a:hover {
background: url(../images/globalmenu_on.jpg) no-repeat;
}
#submenu {
float:right;
height: 20px;
text-align:right;
margin:5px 14px 0px 0px;
color:#fff;
}
#submenu a{
float:left;
display:block;
font: 11px Verdana, Arial, Helvetica, sans-serif;
text-decoration: none;
color:#BCC831;
padding:3px 0px 0px 15px;
background-image: url(../images/dot.gif);
background-repeat: no-repeat;
background-position: 5px;
}
#submenu a.sitemapright {
padding-right:10px;
}
#submenu_l {
float:left;
text-align:left;
width:265px;
}
#submenu_r {
float:left;
width:23px;
}
#submenu_r img {
padding:1px 0px 0px 3px;
}
/*mainimage*/
#mainimage {
clear:both;
float:left;
width:800px;
height:310px;
margin:0px 0px 0px 0px;
background: url(../images/mainimage.jpg) no-repeat;
}
/*logo*/
/*
#logo a, #logo a:hover {
float:left;
font: bold 18px Verdana, Arial, Helvetica, sans-serif;
text-indent:-9999px;
display:block;
width: 230px;
height: 140px;
margin:0px 0px 0px 50px;
background: url(../images/logo.gif) no-repeat;
}
*/
#logo a, #logo a:hover {
float:left;
font: bold 18px Verdana, Arial, Helvetica, sans-serif;
text-indent:-9999px;
display:block;
width: 230px;
height: 140px;
margin:0px 0px 0px 50px;
background: url(../images/logo.gif) no-repeat;
position:absolute;
left:0px;
top:80px;
}
/*topcontents*/
#topcontents {
float:left;
width:770px;
height:auto;
padding: 0px 15px 30px 15px;
text-align:left;
}
#about, #what, #story, #wellness  {
float:left;
height:138px;
margin-right:10px;
_margin-right:9px;
}
#about, #what, #aboutupper, #aboutlower, #whatupper, #whatlower  {
float:left;
width:220px;
}
#about {
height:140px;
width:220px;
background-color:#94A523;
}
#about h2#toptext {
font: bold 9px Verdana, Arial, Helvetica, sans-serif;
color:#333;
padding-bottom:3px;
}
#what {
width:218px;
border: solid 1px #666;
background: url(../images/what_back.gif) no-repeat;
}
#story, #wellness {
width:148px;
border: solid 1px #666;
z-index:1;
position: relative;
}
#wellness {
margin-right:0px;
}
#flashbutton{
position:absolute;
width:148px;
height:138px;
top:0px;
left:0px;
cursor:pointer;
}
#aboutupper {
height:25px;
text-indent:-9999px;
background: url(../images/lightcrunchy.jpg) no-repeat;
}
#aboutupper h1 {
text-indent:-9999px;
}
#aboutlower, #whatlower {
height:100px;
width:200px;
padding:0px 10px 5px 10px;
}
#aboutlower {
width:200px;
padding:5px 10px;
background: url(../images/lightcrunchy_back.jpg) no-repeat;
position:relative;
}
#whatupper, .upper150 {
height:35px;
background: url(../images/greenbar220.gif) no-repeat;
}
#whatlower {
height:88px;
padding:10px 10px 5px 10px;
background: none;
font: 10px Verdana, Arial, Helvetica, sans-serif;
position:relative;
}
dl.whatsnewlist {
width: 100%;
margin: 5px 0px 0px 0px;
_margin: 15px 0px 0px 0px;   
}
dl.whatsnewlist dt {
width: 40px;  
margin-bottom:10px;
float:left; 
}
dl.whatsnewlist dd {
margin-left:50px;
margin-bottom:10px; 
}
dl.whatsnewlist dd a {
text-decoration:none;
color:#000;
}
dl.whatsnewlist dd a:hover {
text-decoration:underline;
}
#linktonews, #linktonews a {
width:100px;
padding: 0px;
font: bold 10px Verdana, Arial, Helvetica, sans-serif;
color:#333;
text-align:right;
text-decoration:none;
display:block;
position:absolute;
left:55px;
top:43px;
}
#linktonews a:hover {
text-decoration:underline;
}
#linktodriedfruit, #linktodriedfruit a {
width:100px;
padding: 0px;
font: bold 10px Verdana, Arial, Helvetica, sans-serif;
color:#333;
text-align:right;
text-decoration:none;
display:block;
position:absolute;
left:55px;
top:48px;
}
#linktodriedfruit a:hover {
text-decoration:underline;
}
.upper150 {
width:148px;
height:35px;
z-index:2;
left: 0px;
top: 0px;
position: absolute;
background: url(../images/greenbar150.gif) no-repeat;
}
/*
.lower150 {
padding:5px 10px;
height:93px;
}
*/
#whatupper h3 a, .upper150 h3.link a {
font: bold 13px Verdana, Arial, Helvetica, sans-serif;
color:#FFF;
padding:10px 0px 0px 10px;
text-decoration:none;
}
#whatupper h3 a:hover, .upper150 h3.link a:hover {
text-decoration:underline;
}
/*template*/
#smalllogo a, #smalllogo a:hover {
float:left;
font: bold 18px Verdana, Arial, Helvetica, sans-serif;
text-indent:-9999px;
display:block;
width: 130px;
height: 80px;
margin:0px 0px 0px 25px;
background: url(../images/smalllogo.gif) no-repeat;
position:absolute;
left:0px;
top:80px;
}
/*contents*/
#templateimage, #producttemplate {
clear:both;
float:left;
width:775px;
height:500px;
padding:0px 0px 0px 25px;
}
#templateimage2 {
clear:both;
float:left;
width:775px;
height:350px;
padding:0px 0px 0px 25px;
background: url(../images/backgroundv2.jpg) no-repeat top right;
}
#templateimage {
background: url(../images/background.jpg) no-repeat top right;
}
#producttemplate {
background: url(../images/productback.jpg) no-repeat top right;
}
#frame {
float:left;
width:610px;
height:500px;
}
#frame2 {
float:left;
width:610px;
height:400px;
}
#productframe {
float:left;
width:750px;
height:500px;
}
#productbutton {
float:left;
width:610px;
height:25px;
margin:90px 0px 0px 0px;
}
#productbutton ul#product {
list-style-type: none;
}
#productbutton ul#product li {
list-style-type: none;
display: inline; /* Prevents "stepdown" */
text-indent:-9999px;
}
#productbutton ul#product li a{
float:left;
height:25px;
display:block;
text-indent:-9999px;
}
#productbutton ul#product li#original a {
width:145px;
background: url(../images/productbutton.png) no-repeat 0px 0px;
}
#productbutton ul#product li#cinnamon a {
width:80px;
background: url(../images/productbutton.png) no-repeat -145px 0px;
}
#productbutton ul#product li#golden a {
width:130px;
background: url(../images/productbutton.png) no-repeat -225px 0px;
}
#productbutton ul#product li#raisin a {
width:95px;
background: url(../images/productbutton.png) no-repeat -355px 0px;
}
#productbutton ul#product li#original a:hover {
width:145px;
background: url(../images/productbutton.png) no-repeat 0px -25px;
}
#productbutton ul#product li#cinnamon a:hover {
width:80px;
background: url(../images/productbutton.png) no-repeat -145px -25px;
}
#productbutton ul#product li#golden a:hover {
width:130px;
background: url(../images/productbutton.png) no-repeat -225px -25px;
}
#productbutton ul#product li#raisin a:hover {
width:95px;
background: url(../images/productbutton.png) no-repeat -355px -25px;
}
#gradationline {
float:left;
width:610px;
height:5px;
padding:0px 0px 30px 0px;
background: url(../images/gradationline.png) no-repeat;
}
#contents, #scroll{
float:left;
width:610px;
height:350px;
text-align:left;
font: 11px Verdana, Arial, Helvetica, sans-serif;
color:#333;
}
#scroll2{
float:left;
width:610px;
height:250px;
text-align:left;
font: 11px Verdana, Arial, Helvetica, sans-serif;
color:#333;
}
#titles {
float:left;
width:610px;
height:30px;
padding:70px 0 0 0;
margin:0px;
}
#titles h1{
font: bold 14px Verdana, Arial, Helvetica, sans-serif;
padding:0px 0px 15px 0px;
color:#758C1A;
}
#scroll h1, #scroll h2.scrollh2{
font: bold 14px Verdana, Arial, Helvetica, sans-serif;
padding:0px 0px 15px 0px;
color:#758C1A;
}
#scroll{
height:290px;
margin: 0px 0px 30px 0px;
overflow: auto;
}
#scroll img, #scroll2 img {
margin: 0px 15px 15px 0px;
}
#productcontents {
width:750px;
}
.contentsbox, .contentsbox2 {
float:left;
clear:both;
width:590px;
height:auto;
padding: 0px 0px 20px 0px;
}
.contentsbox2 {
padding: 0px 0px 5px 0px;
}
.contentsbox_r {
float:left;
width:165px;
height:auto;
}
.contentsbox_l {
float:right;
width:425px;
height:auto;
}
/*each page*/
#productleft, #productphoto, #productlink {
float:left;
width:220px;
height:350px;
}
#productphoto {
height:260px;
}
#productlink {
height:auto;
text-align:left;
}
#productlink ul li {
padding: 0px;
list-style-position: inside;
list-style-image: url(../images/leaficon.jpg);
}
#productlink ul li a {
font: bold 12px Verdana, Arial, Helvetica, sans-serif;
text-decoration:none;
}
#productlink ul li a:hover {
text-decoration:underline;
}
#productright {
float:right;
width:510px;
height:350px;
text-align:left;
padding:0px 0px 0px 20px;
}
#productright img{
padding: 0px 0px 15px 10px;
}
#productright h1 {
font: bold 14px Verdana, Arial, Helvetica, sans-serif;
padding:0px 0px 15px 0px;
}
#productright h1#originaltitle, #productlink ul li a.red, .contentsbox_l h2.originaltitle  a {
color:#C00;
}
#productright h1#cinnamontitle, #productlink ul li a.brown, .contentsbox_l h2.cinnamontitle a {
color:#630;
}
#productright h1#goldentitle, #productlink ul li a.pink, .contentsbox_l h2.goldentitle a {
color:#F96;
}
#productright h1#raisintitle, #productlink ul li a.purple, .contentsbox_l h2.raisintitle a {
color:#939;
}
ul.shoplist li {
float:left;
list-style-position: inside;
list-style-type: none;
display:block;
width:250px;
}
ul.shoplist li a {
font: 11px Verdana, Arial, Helvetica, sans-serif;
text-decoration:none;
color:#333;
}
ul.shoplist li a:hover {
text-decoration:underline;
}
dl.list {
border:none;
width:590px;
margin:0px;
padding:2px 0px;
}
dl.list dt {
float:left; 
width:110px;
padding:5px 0 10px 5px;
clear:both;
}
dl.list dd {
width:430px;
margin-left:120px;
padding:5px 5px 10px 30px;
border-left:1px solid #999;
}
dl.list dd a {
font: bold 11px Verdana, Arial, Helvetica, sans-serif;
color:#758C1A;
text-decoration:none;
}
dl.list dd a:hover {
text-decoration:underline;
}
#contact_left {
float:left;
width:215px;
height:auto;
}
#contact_right, .contact_rightbox  {
float:right;
_width:400px;
width:370px;
height:auto;
}
.contact_rightbox {
clear:both;
float:left;
padding:0px;
}
#contact_rightbox_l, #contact_rightbox_r {
float:left;
width:210px;
}
#contact_rightbox_r {
float:left;
_width:200px;
width:160px;
}
/*form*/
form label.formlist, form label.formlist2 {
font: 11px Verdana, Arial, Helvetica, sans-serif;
width: 90px;
float: left;
height: auto;
display: block;
padding: 2px 0px 0px 0px;
margin: 0px;
}
form label.formlist2 {
width: 80px;
}
.formtext {
font: 11px Verdana, Arial, Helvetica, sans-serif;
color:#333;
}
input.marginbottom {
margin-bottom:3px;
}
#form_l {
float:left;
width:230px;
height:auto;
}
#form_r, .form_rbox {
float:right;
width:355px;
_width:350px;
height:auto;
}
/*sitemap*/
#sitemapwrap {
float:left;
width:610px;
height:auto;
margin-bottom: 30px;
}
.sitemapbox {
float:left;
width:185px;
height:auto;
margin-right:13px;
padding-bottom:20px;
border-right: 1px dotted #758C1A;
}
.sitemapbox a.main {
background: url(../images/sitemaptitle.gif) no-repeat;
font: bold 12px/20px Verdana, Arial, Helvetica, sans-serif;
color:#758C1A;
text-decoration:none;
width:170px;
height:20px;
display:block;
padding: 0px;
margin-bottom:5px;
}
.sitemapbox strong a:hover {
text-decoration:none;
color:#067F40;
}
.sitemapbox ul {
list-style-type: none;
}
.sitemapbox ul li a {
font: normal 11px/17px Verdana, Arial, Helvetica, sans-serif;
color:#333;
padding-left: 15px;
text-decoration:none;
}
.sitemapbox ul li a:hover {
text-decoration:underline;
}
/*productbox*/

/*footer*/
#footer {
clear:both;
font: 10px Verdana, Arial, Helvetica, sans-serif;
color:#FFF;
background-color:#758B1A;
width:800px;
/*height:70px;*/
height:50px;
border-left:solid 1px #758B1A;
border-right:solid 1px #758B1A;
border-bottom:solid 1px ##758B1A;
margin: -1px;
}
#footernavi {
float:left;
width:100%;
height: auto;
text-align: center;
/*margin: 10px 0px 25px 0px;*/
margin: 10px 0px 10px 0px;
}
#footernavi a {
font: 9px Verdana, Arial, Helvetica, sans-serif;
color: #FFF;
text-decoration: none;
}
#footernavi a:hover {
text-decoration: underline;
}
#footercopyright {
clear:both;
float:left;
width:100%;
height: auto;
text-align: center;
font: 10px Verdana, Arial, Helvetica, sans-serif;
color: #000000;
}
/*font*/
h2, h2 a{
font: bold 12px Verdana, Arial, Helvetica, sans-serif;
color:#333;
padding: 0px 0px 10px 0px;
}
h2 a {
color:#758C1A;
text-decoration:none;
}
h2 a:hover {
text-decoration:underline;
}
h2#top {
font: bold 10px Verdana, Arial, Helvetica, sans-serif;
}
h3 {
clear:both;
padding: 0px 0px 5px 0px;
font: normal 11px Verdana, Arial, Helvetica, sans-serif;
color:#758C1A;
}
.smallestblack {
font: 9px Verdana, Arial, Helvetica, sans-serif;
color:#333;
padding: 0px 0px 10px 0px;
}
.smallblack {
font: 10px Verdana, Arial, Helvetica, sans-serif;
color:#333;
padding: 0px 0px 10px 0px;
}
.smallred {
font: 10px Verdana, Arial, Helvetica, sans-serif;
color:#C00;
}
.black {
font: 11px Verdana, Arial, Helvetica, sans-serif;
color:#333;
padding: 0px 0px 10px 0px;
}
.formblack {
font: 11px Verdana, Arial, Helvetica, sans-serif;
color:#333;
padding: 0px 0px 20px 0px;
}
.boldblack, .boldblack_nopad {
font: bold 11px Verdana, Arial, Helvetica, sans-serif;
color:#333;
padding: 0px 0px 10px 0px;
}
.boldblack_nopad {
padding:0px;
}
.boldgreen {
font: bold 11px Verdana, Arial, Helvetica, sans-serif;
color:#758B1A;
}
.green, .green a {
font: 11px Verdana, Arial, Helvetica, sans-serif;
color:#758C1A;
padding: 0px 0px 7px 0px;
text-decoration:none;
}
.green a:hover {
text-decoration:underline;
}
.red {
font: 11px Verdana, Arial, Helvetica, sans-serif;
color:#C00;
}
.italicblack {
font: italic 11px Verdana, Arial, Helvetica, sans-serif;
color:#333;
padding: 0px 0px 10px 0px;
}
.boldpink {
font: bold 11px Verdana, Arial, Helvetica, sans-serif;
color:#F96;
padding: 0px 0px 5px 0px;
}
.boldpurple {
font: bold 11px Verdana, Arial, Helvetica, sans-serif;
color:#939;
padding: 0px 0px 5px 0px;
}
/*nutrition*/
#nutrition, #nutritionupper, #nutritionlower {
float:left;
width:400px;
}
#nutrition {
height:375px;
background-color:#fff;
}
#nutritionupper {
height:335px;
padding: 0px 0px 10px 0px;
}
#nutritionlower {
height:30px;
text-align:right:
}
#nutritionlowerbox {
float:right;
width:auto;
height:30px;
text-align:right:
}
#nutritionlowerbox .biggestboldblack {
font: bold 13px Verdana, Arial, Helvetica, sans-serif;
color:#333;
padding: 7px 0px 0px 0px;
}
#nutritionlower img{
padding: 0px 15px 0px 15px;
}

/* Temporay Index Page */
#space {
width:auto;
height:550px;
}