@charset "utf-8";
/* CSS Document for Natural Health & Fitness Shop*/

/* Author Antony de Navarro - the Mighty Ant -webdesigner@london.com */

/* CSS RESET*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {outline: 0;}
body {	line-height: 1; /*	color: black; background: white;  */
}
ol, ul {list-style: none;}

/* tables still need 'cellspacing="0"' in the markup 
table {	border-collapse: separate; border-spacing: 0;}

caption, th, td {text-align: left; font-weight: normal;}*/

blockquote:before, blockquote:after, q:before, q:after {content: "";}
blockquote, q {	quotes: "" "";}

/* END of Reset */ 
* {outline:0; outline: none; border:0px solid;}
/************************************ LAYOUT *****************************************/

body { background-color:#fff;}

#container{ margin:0; padding:0; width:100%; position:relative;}

#header{ margin:0; padding:0; position:fixed; top:0px; left:0px; background:url(../images/layout/header_bg122.png) repeat-x; z-index:100; height:122px; width:100%; }
#logo { margin:0; padding:0; margin-left: auto; margin-right:auto; width:860px; height:83px; margin-top:5px; }

#primary-nav-container { margin:0; padding:0; margin-top:115px; position:fixed; z-index:40; width:100%;}
#primary-nav { margin:0 ;padding:0; width:870px; height:60px; margin-left:auto; margin-right:auto; }

#whiteBG {position:fixed; margin-top:120px; height:50px; width:100%; z-index:29; background:#fff;}
#whiteBG2 {position:fixed; bottom:50px; right:0px; height:50px; width:100%; z-index:28; background:#fff;}

#content{ margin:0; padding:0; width:870px; margin-left: auto; margin-right:auto; padding:160px 0px 150px 0px; position:static;}

#horizontal-nav{ margin:0; padding:0; margin: 8px 5px 0 254px; z-index:30; position:fixed;  display:inline;}
#vertical-nav{ margin:0; padding:0; margin-top:48px; margin-bottom:100px; z-index:40; position:fixed; /*display:inline;*/}

#page-container { margin:0; padding:0; float:right; width:565px; padding:75px 9px 100px 15px;}
#page{ position: relative; width:565px; height:300px; z-index:10;}
#one-page { margin:0; padding:0; float:right; width:565px; padding:18px 9px 100px 15px;}

#footer{ margin:0; padding:0; position:fixed; bottom:0px; left:0px; background:url(../images/layout/footer_bg78.png) repeat-x; z-index:90; height:78px; width:100%; }
#footer-text{ margin:0;padding:0; margin-left: auto; margin-right: auto; margin-top:30px; width:860px }



/************************************  ID's ******************************************/

#logo {background:url(../images/layout/nhf_logo.png) no-repeat 0 0; text-indent:-9999px;}
#footer p{color:#fff; font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif; font-size:13px; text-align:center; }


/************************************  TYPOGRAPHY ******************************************/

h1 {color:#fff; margin:10px auto;}
h2 {margin-bottom:15px;  font-family:Verdana, Arial, Helvetica, sans-serif; font-size:15px; color:#484E94; font-weight:bold; }
h3 {  font-family:Verdana, Arial, Helvetica, sans-serif; font-size:15px; color:#484E94; font-weight:bold;  line-height:1.5em;padding-bottom:10px;}
hr {margin:0; padding:0; border:0; border-bottom:dotted 1px #ccc; color:#ccc; height:1px; margin-top:10px;margin-bottom:18px;}
p { font-family:Verdana, Arial, Helvetica, sans-serif; font-size:13px; color:#004F00; line-height:1.5em; padding-bottom:14px; text-align:left;}
ul { font-family:Verdana, Arial, Helvetica, sans-serif; font-size:13px; color:#004F00; line-height:1.5em; margin:0 0 0 25px; padding-bottom:14px; text-align:left; }
td {font-family:Verdana, Arial, Helvetica, sans-serif; font-size:13px; color:#004F00; line-height:1.5em;text-align:left; vertical-align:top;}

#page li, #one-page li {list-style:circle;}

strong {font-weight:bold; color:#484E94;}
em {font-style:italic;}
blockquote {background: #FFF0E6; padding:6px 10px 0px 10px; margin-bottom:14px;}
#wholesale-forms textarea, #wholesale-forms input {border:1px solid #BBB; width:240px; padding:3px;}
#wholesale-forms #submit, #wholesale-forms #submit-login {background-color:#abc936; color:#FFFFFF; width:248px; padding:3px;}
#wholesale-forms #submit:hover, #wholesale-forms #submit:active, 
#wholesale-forms #submit-login:hover, #wholesale-forms #submit-login:active { color:#fff; background-color:#8cb111;}
/*********************************** CLASSES  ****************************************/

.clearit {clear:both;}
.highlight {color:#990000;}
.floatR {float:right;}
.floatL {float:left;}
.bottomP{margin-bottom:60px;}
.evenP{ margin:0; padding:0; margin-bottom: 90px; margin-top:80px; width: 550px; height:3px; /*background:url(../images/sprites/nhf_titles_sprites.png) no-repeat -39px -30px;*/}
.picBorderR {padding:5px; background:#eaeaea; margin:0 0 5px 5px;}
.picBorderL {padding:5px; background:#eaeaea; margin:0 5px 5px 0;}


/*********************************** PRIMARY NAV  ****************************************/

#nav1 { background:url(../images/sprites/nhf_nav_sprites.png) no-repeat; width:870px; height:60px; margin:0; padding:0; line-height:0px;}
#nav1 li, #nav1 a { margin:0; padding:0; height:60px; display:block; line-height:0px;}
#nav1 li { margin:0; padding:0; float:left; list-style:none; display:inline; text-indent:-9999px; line-height:0px}

#home {width:110px;}
#about {width:100px; line-height:0px;}
#products {width:135px;}
#offers {width:95px;}
#wholesalers {width:160px;}
#contact {width:125px;}
#checkout {width:145px}

#home a.selected, #home a:hover {background:url(../images/sprites/nhf_nav_sprites.png) no-repeat 0 -60px}
#about a:hover, #about a.selected {background:url(../images/sprites/nhf_nav_sprites.png) no-repeat -110px -60px}
#products a:hover, #products a.selected {background:url(../images/sprites/nhf_nav_sprites.png) no-repeat -210px -60px}
#offers a:hover, #offers a.selected {background:url(../images/sprites/nhf_nav_sprites.png) no-repeat -345px -60px }
#wholesalers a:hover, #wholesalers a.selected {background:url(../images/sprites/nhf_nav_sprites.png) no-repeat -440px -60px}
#contact a:hover, #contact a.selected {background:url(../images/sprites/nhf_nav_sprites.png) no-repeat -600px -60px}
#checkout a:hover, #checkout a.selected {background:url(../images/sprites/nhf_nav_sprites.png) no-repeat -725px -60px}

/*********************************** SECONDARY NAV  ****************************************/

#nav2 { background:url(../images/sprites/nhf_product_sprites.png) no-repeat; width:610px; height:55px; margin:0; padding:0;}
#nav2 li, #nav2 a {height:55px; display:block;}
#nav2 li {float:left; list-style:none; display:inline; text-indent:-9999px}

#how-it-works {width:124px;}
#how-to-use {width:109px;}
#faq {width:54px;}
#testimonials {width:119px;}
#cost-of-using {width:129px;}
#order {width:75px;}


#how-it-works a:hover, #how-it-works a.selected {background:url(../images/sprites/nhf_product_sprites.png) no-repeat 0 -55px}
#how-to-use a:hover, #how-to-use a.selected {background:url(../images/sprites/nhf_product_sprites.png) no-repeat -124px -55px}
#faq a:hover, #faq a.selected {background:url(../images/sprites/nhf_product_sprites.png) no-repeat -233px -55px}
#testimonials a:hover, #testimonials a.selected {background:url(../images/sprites/nhf_product_sprites.png) no-repeat -287px -55px }
#cost-of-using a:hover, #cost-of-using a.selected {background:url(../images/sprites/nhf_product_sprites.png) no-repeat -406px -55px}
#order a:hover, #order a.selected {background:url(../images/sprites/nhf_product_sprites.png) no-repeat -535px -55px}

#how-it-works a.noPage {background:url(../images/sprites/nhf_product_sprites.png) no-repeat 0 -500px}
#how-to-use a.noPage {background:url(../images/sprites/nhf_product_sprites.png) no-repeat -124px -500px}
#faq a.noPage {background:url(../images/sprites/nhf_product_sprites.png) no-repeat -233px -500px}
#testimonials a.noPage {background:url(../images/sprites/nhf_product_sprites.png) no-repeat -287px -500px }
#cost-of-using a.noPage {background:url(../images/sprites/nhf_product_sprites.png) no-repeat -406px -500px}
#order a.noPage {background:url(../images/sprites/nhf_product_sprites.png) no-repeat -535px -500px}




/*********************************** TERTIARY NAV  ****************************************/


#nav3 { background:url(../images/sprites/nhf_product_sprites.png) no-repeat 0 -120px; width:267px; height:337px; margin:0; padding:0;}
#nav3 li, #nav3 a {height:41px; display:block;}
#nav3 li {/*float:left; */list-style:none; /*display:inline;*/ text-indent:-9999px}

#sports {height:41px;}
#pain {height:41px;}
#foot {height:41px;}
#headache {height:40px;}
#massage {height:41px;}
#green-magic {height:41px;}
#collagen {height:42px;}
#green-tea {height:50px;}


#sports a:hover, #sports a.selected {background:url(../images/sprites/nhf_product_sprites.png) no-repeat -300px -120px; height:41px;}
#pain a:hover, #pain a.selected {background:url(../images/sprites/nhf_product_sprites.png) no-repeat -300px -161px; height:41px;}
#foot a:hover, #foot a.selected {background:url(../images/sprites/nhf_product_sprites.png) no-repeat -300px -202px; height:41px;}
#headache a:hover, #headache a.selected {background:url(../images/sprites/nhf_product_sprites.png) no-repeat -300px -243px; height:40px; }
#massage a:hover, #massage a.selected {background:url(../images/sprites/nhf_product_sprites.png) no-repeat -300px -284px; height:41px;}
#green-magic a:hover, #green-magic a.selected {background:url(../images/sprites/nhf_product_sprites.png) no-repeat -300px -325px; height:41px;}
#collagen a:hover, #collagen a.selected {background:url(../images/sprites/nhf_product_sprites.png) no-repeat -300px -366px; height:42px;}
#green-tea a:hover, #green-tea a.selected {background:url(../images/sprites/nhf_product_sprites.png) no-repeat -300px -407px; height:50px;}


/************************************ TITLES  *****************************************/

#buyNow {background:url(../images/sprites/nhf_product_sprites.png) no-repeat -0px -460px; height:36px; width:120px; text-indent:-9999px;}
#buyNow:hover{background:url(../images/sprites/nhf_product_sprites.png) no-repeat -300px -460px; height:36px; width:120px; text-indent:-9999px; cursor: pointer;}

/*Page Titles */
.privacyTitle {width: 350px; height:35px; background:url(../images/sprites/nhf_titles_sprites.png) no-repeat 0px -350px; text-indent:-9999px;}
.termsTitle {width: 350px; height:35px; background:url(../images/sprites/nhf_titles_sprites.png) no-repeat -400px -350px; text-indent:-9999px;}
.welcomeTitle {width: 350px; height:35px; background:url(../images/sprites/nhf_titles_sprites.png) no-repeat 0px -400px; text-indent:-9999px;}
.aboutTitle {width: 350px; height:35px; background:url(../images/sprites/nhf_titles_sprites.png) no-repeat -400px -400px; text-indent:-9999px;}
.offersTitle {width: 350px; height:35px; background:url(../images/sprites/nhf_titles_sprites.png) no-repeat 0px -450px; text-indent:-9999px;}
.wholesalersTitle {width: 350px; height:35px; background:url(../images/sprites/nhf_titles_sprites.png) no-repeat -400px -450px; text-indent:-9999px;}
.contactTitle {width: 350px; height:35px; background:url(../images/sprites/nhf_titles_sprites.png) no-repeat 0px -500px; text-indent:-9999px;}
.checkoutTitle {width: 350px; height:35px; background:url(../images/sprites/nhf_titles_sprites.png) no-repeat -400px -500px; text-indent:-9999px;}

/*Product Titles */
.painTitle {width: 350px; height:35px; background:url(../images/sprites/nhf_titles_sprites.png) no-repeat 0px 0px; text-indent:-9999px;}
.sportsTitle {width: 350px; height:35px; background:url(../images/sprites/nhf_titles_sprites.png) no-repeat 0px -50px; text-indent:-9999px;}
.footTitle {width: 350px; height:35px; background:url(../images/sprites/nhf_titles_sprites.png) no-repeat 0px -100px; text-indent:-9999px;}
.headacheTitle {width: 350px; height:35px; background:url(../images/sprites/nhf_titles_sprites.png) no-repeat 0px -150px; text-indent:-9999px;}
.massageTitle {width: 350px; height:35px; background:url(../images/sprites/nhf_titles_sprites.png) no-repeat -400px -0px; text-indent:-9999px;}
.green-magicTitle {width: 350px; height:35px; background:url(../images/sprites/nhf_titles_sprites.png) no-repeat -400px -50px; text-indent:-9999px;}
.collagenTitle {width: 350px; height:35px; background:url(../images/sprites/nhf_titles_sprites.png) no-repeat -400px -100px; text-indent:-9999px;}
.green-teaTitle {width: 350px; height:35px; background:url(../images/sprites/nhf_titles_sprites.png) no-repeat -400px -150px; text-indent:-9999px;}

/*Product Section Titles */
.how-it-worksTitle {width: 350px; height:35px; background:url(../images/sprites/nhf_titles_sprites.png) no-repeat 0px -200px; text-indent:-9999px;}
.how-to-useTitle {width: 350px; height:35px; background:url(../images/sprites/nhf_titles_sprites.png) no-repeat -400px -200px; text-indent:-9999px;}
.faqTitle {width: 350px; height:35px; background:url(../images/sprites/nhf_titles_sprites.png) no-repeat 0px -250px; text-indent:-9999px;}
.testimonialsTitle {width: 350px; height:35px; background:url(../images/sprites/nhf_titles_sprites.png) no-repeat -400px -250px; text-indent:-9999px;}
.cost-of-usingTitle {width: 350px; height:35px; background:url(../images/sprites/nhf_titles_sprites.png) no-repeat 0px -300px; text-indent:-9999px;}
.orderTitle {width: 350px; height:35px; background:url(../images/sprites/nhf_titles_sprites.png) no-repeat -400px -300px; text-indent:-9999px;}
.mediaTitle {width: 350px; height:35px; background:url(../images/sprites/nhf_titles_sprites.png) no-repeat 0px -550px; text-indent:-9999px;}
.productsTitle {width: 350px; height:35px; background:url(../images/sprites/nhf_titles_sprites.png) no-repeat -400px -550px; text-indent:-9999px;}
/************************************* LINKS  *****************************************/

#page a:link, #page a:visited, #one-page a:link, #one-page a:visited {color:#484E94; text-decoration:underline;border:1px #fff solid; padding:2px;}

#page a:hover, #page a:active, #page a:focus, #one-page a:hover, #one-page a:active, #one-page a:focus
 { background:#484E94; border:1px #484E94 solid; padding:2px; color:#fff; text-decoration:none;}



#footer-text a { color:#fff; text-decoration:none; }
#footer-text a:visited { color:#fff; text-decoration:none; }
#footer-text a:hover { color:#fff; text-decoration:underline;}
#footer-text a:active{ color:#fff; text-decoration:underline;}




/************************************* FORMS  ******************************************/


