/*
Styles for the Naturall Web Site
Site Designed and Developed by Rhaya Shilts www.rhaya.com
*/


/* ------------- UNIVERSAL ------------- */

* {margin:0; padding:0; }

* html ul li a {height:1em;}

html,body {
font-family: "Lucida Grande", "Lucida Sans Unicode", Geneva, Verdana, sans-serif;
font-size: 12px;
color: #4b4b4b;
line-height: 160%;
text-align:center;
background: #83b2e8 url(images/template/bodybg.jpg) no-repeat top center ;
}

/* ------------- LAYOUT ------------- */

#frame {
width:752px;
margin:0 auto;
text-align:left;
}

#header {
height: 121px;
width:752px;
display: block;
text-indent: -9999px;
background:url(images/template/headerbg.gif) no-repeat;
}

#headerleft {
height: 121px;
width:560px;
display: block;
text-indent: -9999px;
float:left;
}

#headerleft a {
height: 72px;
width: 212px;
left: 0;
top:42px;
display: block;
text-indent: -9999px;
position:relative;
overflow:hidden;
}

#headerright {
height: 121px;
width:192px;
float:left;
}

/* ------------- NAVIGATION ------------- */

#nav {
height: 72px;
width:192px;
margin:16px 0 0 0;
}

ul#nav_main {
list-style-type:none;
width:192px;
}

li#story {
width:192px;
height:24px;
background: url(images/nav/story.gif) no-repeat;
}

li#story a {
display:block;
width:115px;
position:relative;
left:78px;
height:24px;
text-indent:-9999px;
text-decoration:none;
overflow:hidden;
}

li#products {
width:192px;
height:24px;
background: url(images/nav/products.gif) no-repeat;
}

li#products a {
display:block;
width:161px;
position:relative;
left:31px;
height:24px;
text-indent:-9999px;
text-decoration:none;
overflow:hidden;
}

li#howitworks {
width:192px;
height:24px;
background: url(images/nav/howitworks.gif) no-repeat;
}

li#howitworks a {
display:block;
width:161px;
position:relative;
left:31px;
height:24px;
text-indent:-9999px;
text-decoration:none;
overflow:hidden;
}

/* OLD NAV ITEM
li#findus {
width:192px;
height:24px;
background: url(images/nav/findus.gif) no-repeat;
}

li#findus a {
display:block;
width:192px;
height:24px;
text-indent:-9999px;
text-decoration:none;
overflow:hidden;
} */

li#findus {
width:192px;
height:24px;
background: url(images/nav/howtobuy.gif) no-repeat;
}

li#findus a {
display:block;
width:135px;
position:relative;
left:57px;
height:24px;
text-indent:-9999px;
text-decoration:none;
overflow:hidden;
}

li#story a:hover { background: url(images/nav/storyhover.gif) no-repeat; width:192px; position:static;}
li#products a:hover { background: url(images/nav/productshover.gif) no-repeat; width:192px; position:static;}
li#howitworks a:hover { background: url(images/nav/howitworkshover.gif) no-repeat; width:192px; position:static;}
li#findus a:hover { background: url(images/nav/howtobuyhover.gif) no-repeat; width:192px; position:static;}


/* ------------- PAGE TITLES ------------- */


#pagetitle {
height: 75px;
width:752px;
}



#pagetitle h1.ourstory {
height: 75px;
width:752px;
background: url(images/pagetitle/ourstory.jpg) no-repeat;
text-indent:-9999px;
display:block;
}

#pagetitle h1.ourproducts {
height: 75px;
width:752px;
background: url(images/pagetitle/ourproducts.jpg) no-repeat;
text-indent:-9999px;
display:block;
}

#pagetitle h1.wheretofindus {
height: 75px;
width:752px;
background: url(images/pagetitle/wheretofindus.jpg) no-repeat;
text-indent:-9999px;
display:block;
}

#pagetitle h1.thankyou {
height: 75px;
width:752px;
background: url(images/pagetitle/thankyou.jpg) no-repeat;
text-indent:-9999px;
display:block;
}


#pagetitlehome {
height: 58px;
width:752px;
}

#pagetitlehome h1.home {
height: 58px;
width:752px;
background: url(images/pagetitle/homeheader.jpg) no-repeat;
text-indent:-9999px;
display:block;
}

#pagetitlecrop {
height: 56px;
width:752px;
}

#pagetitlecrop h1.ourproducts {
height: 56px;
width:752px;
background: url(images/pagetitle/ourproductscrop.jpg) no-repeat;
text-indent:-9999px;
display:block;
}

#pagetitlecrop h1.howitworks {
height: 56px;
width:752px;
background: url(images/pagetitle/howitworks.jpg) no-repeat;
text-indent:-9999px;
display:block;
}

/* ------------- SUB NAVIGATION ------------- */


#subnav {
height: 52px;
width:752px;
background: url(images/template/subnavbg.gif) no-repeat;
font-family:Arial, Helvetica, sans-serif;
}

#subnavlinks {
height:34px;
width:752px;
float: left;
padding:0 0 0 7px;
display:inline;
}

#subnavlinks ul {
list-style-type:none;
font-size: 12px;
color: #4569aa;
font-weight:bold;
text-transform:uppercase;
}

#subnavlinks ul li {
display:inline;
}

#subnavlinks ul li a {
color: #4569aa;
text-decoration: none;
border-right: 1px solid #bfd0ee;
float: left;
padding: 7px 10px 7px 10px;
}

#subnavlinks ul li a:hover {
color: #213a67;
}


/* ------------- CONTENT ------------- */

#contentcontainer {
width:740px;
background: #d7e2f5 url(images/template/contentbg.jpg) repeat-x top center;
border-left:solid 1px #90b0e4;
border-right:solid 1px #90b0e4;
border-bottom:solid 1px #90b0e4;
padding:0 5px 5px 5px;
margin:-3px 0 25px 0;
}

#content {
width:688px;
background:#ffffff;
border-left:solid 1px #bfd0ee;
border-right:solid 1px #bfd0ee;
border-bottom:solid 1px #bfd0ee;
padding:8px 25px 2px 25px;
min-height:300px;
height:auto !important;
height:300px;
}

#contenthome {
width:698px;
background:#ffffff;
border-left:solid 1px #bfd0ee;
border-right:solid 1px #bfd0ee;
border-bottom:solid 1px #bfd0ee;
padding:20px 20px 2px 20px;
}

#content p, #contenthome p {
margin:0 0 18px 0;
}

#content a, #contenthome a {
color:#5a6f27;
}

#content a:hover, #contenthome a:hover {
color:#4569aa;
}

#content ol {
margin: 15px 0 18px 24px;
}

#content ul {
margin: 15px 0 18px 24px;
}

ul#speciallist {
margin: 15px 0 18px 188px;
}

ol#speciallist {
margin: 15px 0 18px 272px;
}


#content li {
margin: 0 0 8px 0;
}


hr {
border:none 0;
border-top:1px solid #bfd0ee;
height:1px;
margin:0 0 18px 0;
}


#content h1, #contenthome h1 {
margin:0 0 12px 0;
color:#4569aa;
font-size:24px;
font-weight:normal;
}


#content h2, #contenthome h2 {
margin:0 0 8px 0;
color:#4569aa;
font-size:14px;
border-bottom:1px solid #bfd0ee;
font-weight:normal;
text-transform:uppercase;
}

#content h3 {
margin:0 0 8px 0;
color:#4569aa;
font-size:14px;
font-weight:normal;
}

.smalltext {
font-size:11px;
line-height: 150%;
}

.alignright {float: right;}

.alignrightmarg {float: right; margin:0 0 15px 15px;}

.alignleft {float: left}

#imgandgraphic  {float: right; margin:0 0 15px 15px; width:230px; display:inline;}

.topmargin {margin:15px 0 0 0;}

#homenewscont {
width:250px;
float:right;
margin:0 0 40px 20px;
display:inline;
}

#homenewscont ul {
list-style-type:none;
font-size : 11px;
display: block;
font-weight:bold;
border-top:solid 1px #bfd0ee;
border-right:solid 1px #bfd0ee;
border-left:solid 1px #bfd0ee;
line-height:140%;
}

#homenewscont ul li a {
font-size : 11px;
border-bottom:solid 1px #bfd0ee;
display: block;
color:#5269aa;
text-decoration:none;
padding:8px 12px;
}

#homenewscont ul li a:hover {
background:#e8f0fb;
color:#5269aa;
text-decoration:underline;
}




/* ------------- FORM ------------- */


label{
float: left;
width: 114px;
text-align:left;
margin:0 6px 0 0;
}

input, textarea{
width: 200px;
margin-bottom: 5px;
}

textarea{
width: 250px;
height: 100px;
}

.boxes{
width: 1em;
}

#submitbutton{
margin: 5px 0 0 126px;
width: 90px;
} 

/* ------------- FLASH FEATURE ------------- */

/* FROM WHEN THE FLASH FEATURE WAS ON THERE #flashfeature {
height: 311px;
width:744px;
background: url(images/home/featurebg.gif) no-repeat;
padding:0 0 0 8px;
} */

#flashfeature {
height: 290px;
width:744px;
background: url(images/home/featurebg.gif) no-repeat;
padding:0 0 0 8px;
}

#flashfeature img {
border: 1px solid #4569aa;
}

/* ------------- FOOTER ------------- */

#footer {
text-align:center;
font-size:11px;
margin:4px 0 0 0;
color:#4569aa;
}

#footer a {
color:#203966;
text-decoration:none;
}

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