html {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
}

* {
	margin: 0;
	padding: 0;
}

img {
	border: none;
}

body {
	background: #72C9E4 url("/images/HO_Back_Top.jpg") top center repeat-x;
	font-size: 14px;
	font-family: Arial, Helvetica, sans-serif;
	width: 100%;
	height: 100%;
}

h1 {
	font-size: 2.2em;
	padding: 20px 20px;
	margin: 0 0 10px 0;
	color: #003c18;
	}
h2 {
	font-size: 1.9em;
	text-shadow: #026435 0.05em 0.05em 0.1em;
	font-weight: normal;
	padding: 40px 20px 20px 20px;
	margin: 10px 0 0 0;
	line-height: 140%;
	color: #026435;
}
h3 {
    color: #fff;
    text-shadow: #026435 0.05em 0.05em 0.1em;
    font-size: 1.5em;
    padding: 0 20px;
	margin: 5px 0 10px 0;
	line-height: 120%;
}
h4 {
    color: #fff;
    text-shadow: #026435 0.05em 0.05em 0.1em;
    font-size: 1.2em;
    padding: 20px 20px 0 20px;
	margin: 5px 0 10px 0;
}
p  {
    color: #fff;
    text-shadow: #026435 0.05em 0.05em 0.1em;
    font-size: 1em;
    padding: 0 20px;
	margin: 5px 0 10px 0;
	line-height: 120%;
}

a  {
    color: #fff;
    text-shadow: #026435 0.05em 0.05em 0.1em;
    font-size: 1.2em;
    padding: 0;
	margin: 0;
	line-height: 100%;
	text-decoration: none;
}

#topheader {
    float: left;
    height: 167px;
    width: 100%;
}

#topheader .since1959 {
    float: left;
    width: 231px;
    height: 167px;
    margin: 0;
    padding: 0;
}

/** Header **/
#header-wrap, #content-wrap {
	width: 100%;
}

#header {
	position: relative;
	width: 974px;
	height: 50px;
	margin: auto;
	padding: 0;
	clear: both;
}

.wrapper {
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -199px;
}

.footer, .push {
    position: relative;
	height: 199px; /* .push must be the same height as .footer */
    width: 100%;
    margin: 0 0 0 0;
}

.footer {
	background: url("/images/HO_Back_Bottom.jpg") repeat-x;
}

/** navigation **/
#nav { margin: 9px 0 0 175px; height: 20px; float: left; overflow: hidden; background: url("/images/HO_MainNav.png"); background-repeat: none; width: 625px; z-index: 1; clear: both; }
#nav ul { margin: 0; padding: 0; height: 20px; width: 625px; list-style-type: none; z-index: 1; }
#nav ul li { margin: 0; padding: 0; display: block; height: 20px; float: left; z-index: 1; }
#nav ul li a { margin: 0; padding: 0; display: block; float: left; text-indent: -9999em; overflow: hidden; height: 20px; z-index: 1; }

#nav ul li a.home { width: 70px; background: url("/images/HO_MainNav.png") 0 0; }
#nav ul li a:hover.home { background: url("/images/HO_MainNav.png") 0 -20px; }
#nav ul.home li a.home { background: url("/images/HO_MainNav.png") 0 -20px; }

#nav ul li a.product { width: 105px; background: url("/images/HO_MainNav.png") -70px 0; }
#nav ul li a:hover.product { background: url("/images/HO_MainNav.png") -70px -20px; }
#nav ul.product li a.product { background: url("/images/HO_MainNav.png") -70px -20px; }

#nav ul li a.history { width: 105px; background: url("/images/HO_MainNav.png") -175px 0; }
#nav ul li a:hover.history { background: url("/images/HO_MainNav.png") -175px -20px; }
#nav ul.history li a.history { background: url("/images/HO_MainNav.png") -175px -20px; }

#nav ul li a.availability { width: 140px; background: url("/images/HO_MainNav.png") -280px 0; }
#nav ul li a:hover.availability { background: url("/images/HO_MainNav.png") -280px -20px; }
#nav ul.availability li a.availability { background: url("/images/HO_MainNav.png") -280px -20px; }

#nav ul li a.news { width: 85px; background: url("/images/HO_MainNav.png") -420px 0; }
#nav ul li a:hover.news { background: url("/images/HO_MainNav.png") -420px -20px; }
#nav ul.news li a.news { background: url("/images/HO_MainNav.png") -420px -20px; }

#nav ul li a.contact { width: 120px; background: url("/images/HO_MainNav.png") -505px 0; }
#nav ul li a:hover.contact { background: url("/images/HO_MainNav.png") -505px -20px; }
#nav ul.contact li a.contact { background: url("/images/HO_MainNav.png") -505px -20px; }

/** content **/
#content {
	position: relative;
	width: 895px;
	margin: auto;
	padding: 0 0 0 0;
	clear: both;
}

#con-main {
    width: 650px;
    height: 329px;
    margin: 25px 0 0 122px;
    background: url(/images/HO_ContentBack.png) no-repeat;
    position: relative;
}

#home-main {
    width: 784px;
    height: 366px;
    margin: 15px 0 0 70px;
    background: url(/images/HomeBack.png) no-repeat;
    position: relative;
}

#home-main .alohatitle {
    float: left;
    margin: 35px 0 0 75px;
    text-indent: -9999px;
    height: 34px;
    width: 331px;
    background: url(/images/AlohaWelcome.png) no-repeat;
    clear: both;
}

#home-main p {
    float: left;
    margin: -10px 0 0 62px;
    height: 175px;
    width: 450px;
    line-height: 120%;
    overflow: auto;
}

#home-main #welcome_mahalo {
    float: right;
    margin: 0 250px 0 0;
}

.content-header {
    margin: 0 0 0 122px;
    position: relative;
}

.recipe-header {
    margin: 0 0 0 130px;
    position: relative;
}

.product-header {
    margin: 0 0 0 127px;
    position: relative;
}

.avail-header {
    margin: 0 0 0 138px;
    position: relative;
}

.contact-header {
    margin: 0 0 0 120px;
    position: relative;
}

.contactsubmitrecipe-header {
    margin: 0 0 0 135px;
    position: relative;
}

#conproduct {
    width: 695px;
    height: 418px;
    margin: 17px 0 0 100px;
    background: url(/images/CanProBack1.png) no-repeat;
    position: relative;
}

#conproduct .can{
    float: left;
    width: 226px;
    height: 135px;
    margin: 0 0 0 0;
}

#conproduct .content_product {
    float: left;
    margin: 10px 0 0 10px;
}

.moreleft {
    float: left;
    margin: 145px 0 0 0;
}

.moreright {
    float: right;
    margin: 145px 0 0 0;
}

#products {
    width: 672px;
    height: 375px;
    margin: 15px 0 0 122px;
    background: url(/images/IndividualProBack.png) no-repeat;
    position: relative;
}

#products .propitcher{
    float: right;
    width: 244px;
    height: 296px;
    margin: 35px 0 0 0;
}

#products .protitle{
    float: left;
    margin: 30px 0 0 27px;
    text-indent: -9999px;
}

#products .pronutr{
    float: left;
    width: 386px;
    height: 237px;
    margin: 5px 0 0 30px;
}

#products .prorecipes{
    float: left;
    margin: 5px 0 0 27px;
}

#hiscontainer {
    height: 380px;
    position: relative;
}

#conhistory {
    float: left;
    width: 407px;
    height: 303px;
    margin: 25px 0 0 125px;
    background: url(/images/HistoryBack.png) no-repeat;
    position: relative;
}

#conhistory  p {
    width: 360px;
    height: 260px;
    margin: 20px 0 0 0;
    overflow: auto;
}

#historylinks {
    float: right;
    margin: -30px 100px 0 0;
    position: relative;
}

span.drinks {
    float: left;
    padding: 0 20px 25px 0;
    width: 40%;
}

span.foods {
    float: right;
    padding: 0 20px 25px 0;
    width: 40%;
}

span.drinks h2 {
    font-size: 2.3em;
}

span.foods h2 {
    font-size: 2.3em;
}

span.drinks a {
    font-size: .85em;
}

span.foods a {
    font-size: .85em;
}

#conrecipes {
    width: 672px;
    height: 375px;
    margin: 15px 0 0 122px;
    background: url(/images/IndividualProBack.png) no-repeat;
    position: relative;
}

#reccontainer {
    float: left;
    width: 607px;
    height: 305px;
    padding: 25px 20px 25px 20px;
    margin: 10px 0 0 0;
    overflow: auto;
}

h2 {
	font-size: 1.9em;
	padding: 0 20px 20px 20px;
	line-height: 100%;
	color: #026435;
	text-shadow: #026435 0.05em 0.05em 0.1em;
}

#availdisclaimer {
    width: 652px;
    height: 109px;
    margin: 0 0 0 120px;
    background: url(/images/AvailDisclaimerBack.jpg) no-repeat;
    position: relative;
}

#availdisclaimertext {
    width: 642px;
    margin: 10px 0 0 5px;
    padding: 10px 0 0 0;
    line-height: 100%;
}

#availdisclaimertext p {
    margin: 0 0 0 0;
    height: 89px;
    overflow: auto;
}

#availability {
    width: 695px;
    height: 350px;
    margin: 0 0 0 110px;
    background: url(/images/AvailabilityBack1.png) no-repeat;
    position: relative;
}

#availability p {
    width: 225px;
    height: 225px;
    margin: 10px 0 0 5px;
    padding: 0;
    line-height: 100%;
    overflow: auto;
}

#availability a  {
    font-size: .9em;
}

#availability a:hover  {
	color: #026435;
	text-shadow: #026435 0.05em 0.05em 0.1em;
}

#availability .availmap {
    float: left;
    margin: 0 0 0 0;
}

#availability #washington, #availability #idaho, #availability #montana, #availability #texas,
#availability #utah, #availability #wyoming, #availability #colorado, #availability #newmexico,
#availability #oregon, #availability #california, #availability #nevada, #availability #arizona,
#availability #alaska,#availability #hawaii {
    display: none;
    float: right;
    margin: 45px 35px 0 0;
}

#newscontent {
    float: left;
    width: 652px;
    height: 375px;
    margin: 15px 0 0 120px;
    background: url(/images/NewsBack.png) no-repeat;
    position: relative;
}

#newscontent #newswrapper{
    width: 650px;
    height: 363px;
    margin: 5px 0 0 0;
    overflow: auto;
    position: relative;
}

#newscontent #newswrapper a {
    color: #026435;
	text-shadow: #026435 0.05em 0.05em 0.1em;
    font-size: 1.0em;
	margin: 5px 0 10px 0;
}

#newscontent #newswrapper h4.newstitle a {
    color: #fff;
    text-shadow: #026435 0.05em 0.05em 0.1em;
}

#newscontent #newswrapper h4 {
    color: #fff;
    text-shadow: #026435 0.05em 0.05em 0.1em;
    font-size: 1.4em;
    padding: 20px 20px 0 20px;
	margin: 5px 0 10px 0;
}

#newscontent hr {
    width: 90%;
    text-align: center;
    margin: auto;
    color: #fff;
    background-color: #fff;
    border: 0;
    height: 3px;
    text-shadow: #026435 0.05em 0.05em 0.1em;
}

#contactcontent {
    width: 662px;
    height: 415px;
    margin: 15px 0 0 120px;
    position: relative;
}

.label_contact {
    padding: 10px 0 0 0;
}

p.contact_subject {
    float: right;
    margin: 0 20px 0 0;

}

.inputcontact_subject {
    background: url(/images/contact/contact_subject.png) no-repeat;
    height: 23px;
    width: 150px;
    padding: 4px 0 0 10px;
    border: none;
    color: #fff;
}

p.contact_name {
    float: left;
    margin: 5px 0 0 10px;
}

label.error {
    color: #ff0000;
}

#inputcontact_name {
    background: url(/images/contact/contact_name.png) no-repeat;
    height: 23px;
    width: 547px;
    padding: 4px 0 0 10px;
    border: none;
    color: #fff;
}

p.contact_email {
    float: left;
    margin: 5px 0 0 10px;
}

#inputcontact_email {
    background: url(/images/contact/contact_email.png) no-repeat;
    height: 23px;
    width: 494px;
    padding: 4px 0 0 10px;
    border: none;
    color: #fff;
}

p.contact_address {
    float: left;
    margin: 5px 0 0 10px;
}

#inputcontact_address {
    background: url(/images/contact/contact_address.png) no-repeat;
    height: 24px;
    width: 530px;
    padding: 4px 0 0 10px;
    margin-left: 2px;
    border: none;
    color: #fff;
}

p.contact_city {
    float: left;
    margin: 5px 0 0 10px;
}

#inputcontact_city, #inputcontact_state, #inputcontact_zip {
    background: url(/images/contact/contact_city.png) no-repeat;
    height: 23px;
    width: 151px;
    padding: 4px 5px 0 10px;
    border: none;
    color: #fff;
}

p.contact_message {
    float: left;
    margin: 5px 0 0 10px;
}

#inputcontact_message {
    background: url(/images/contact/contact_comments.png) no-repeat;
    height: 174px;
    width: 388px;
    padding: 4px 3px;
    border: none;
    color: #fff;
}

#email_body {
    height: 175px;
    width: 386px;
    overflow: auto
}

p.contact_message {
    float: left;
}

p.contact_share {
    float: right;
    padding: 70px 0 50px 0;
    margin: 0 5px 0 0;
}

p.submit_share {
    float: right;
    padding: 45px 0 70px 0;
    margin: 0 5px 0 0;
}

.contactdiv {;
    margin: 0 0 0 0;
}

.contact_submit {
background: url(/images/contact/contact_city.png) no-repeat;
    height: 23px;
    width: 151px;
    padding: 1px 0 0 3px;
    border: none;
    color: #fff;
}

/** Admin **/
#admincontent {
    float: left;
    width: 652px;
    height: 375px;
    margin: 15px 0 0 120px;
    background: url(/images/NewsBack.png) no-repeat;
    position: relative;
}

#admincontent #adminwrapper .adminnav {
    float: right;
    padding: 10px 20px;
    color: #026435;
}

#admincontent #adminwrapper {
    width: 648px;
    height: 363px;
    margin: 5px 0 0 0;
    overflow: auto;
    position: relative;
}

#admincontent #adminwrapper p.userprofile {
    float: left;
    margin: 30px 0 0 150px;
}

#admincontent #adminwrapper a.postsindex {
    color: #fff;
	text-shadow: #026435 0.05em 0.05em 0.1em;
}

#admincontent #adminwrapper a {
    color: #026435;
	text-shadow: #026435 0.05em 0.05em 0.1em;
}

#admincontent #adminwrapper .new_user, .edit_user, .new_user_session {
    padding: 0 0 0 140px;
}

#admincontent #adminwrapper .user_submit {
    background: url(/images/input_short.png) no-repeat;
    width: 151px;
    font-weight: bold;
    padding: 0;
    color: #fff;
    text-shadow: #026435 0.03em 0.03em 0.05em;
}

#admincontent #adminwrapper label{
    color: #fff;
    text-shadow: #026435 0.05em 0.05em 0.1em;
}

#admincontent #adminwrapper input{
    background: url(/images/input_long.png) no-repeat;
    width: 363px;
    height: 25px;
    border: 0px;
    padding: 5px 0 0 10px;
    color: #fff;
    text-shadow: #026435 0.05em 0.05em 0.1em;
}

#admincontent #adminwrapper #user_session_remember_me{
    width: 15px;
    height: 15px;
    background: none;
}

#admincontent #adminwrapper hr {
    width: 90%;
    text-align: center;
    margin: auto;
    color: #fff;
    background-color: #fff;
    border: 0;
    height: 1px;
    text-shadow: #026435 0.05em 0.05em 0.1em;
}

/** Clear **/
div .clear {
    clear: both;
}

