/* css main sheet for healthfitnessanddiet.com */

/* basic elements */

body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	margin: 0px;
	padding: 0px;
	text-align: left;
	}

p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	margin-top: 20px;
	text-align: justify;
	}

h1 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 20px;
	font-weight: bold;
	color: #FF6600;
	}

h2 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color: #333333;
	}

h3 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color: #FF6600;
	}

h4 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color: #000;
	}

h4 a:link {
   	color:#0000FF;
	text-decoration:underline;
}

h4 a:hover {
	color:#A2A2FF;
	text-decoration:none;
}

a:link {
	font-weight: bold;
	text-decoration: none;
	color: #A2A2FF;
	}

a:visited {
	font-weight: bold;
	text-decoration: none;
	color: #A2A2FF;
	}

a:hover {
  	font-weight: bold;
  	text-decoration: underline;
  	color: #0000FF;
	}

acronym {font-style:normal; cursor:help; border-bottom:1px dashed #A2A2FF;}

/* specific divs */

#container {
	background: url(hfdlogo.gif) no-repeat left top;
	margin: 20px;
	padding: 5px 0; /* 5px 1px 20px; */
	}

#pageArticle {
	background-color: #fff;
	min-width: 320px;
	max-width: 640px;
	margin-top: 40px;
	margin-right: 28%;
	margin-bottom: 20px;
	margin-left: 23%;
	padding: 0px 5px;
	}

#topNav {
	margin: 30px 0px;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #A2A2FF;
	padding-top: 5px;
	color: #A2A2FF;
	}

#navAd {
	margin-top: 20px;
	}

#breadcrumbNav {
	font-size: 10px;
	color: #666666;
	text-align: left;
	}

#breadcrumbNav a {
	font-size: 10px;
	color: #666666;
	}

#leftPic1 {
	position: absolute;
	top: 160px;
	left: 20px;
	width: 160px;
	}

#rightNav {
	position: absolute;
	width: 200px;
	right: 20px;
	top: 135px;
	padding: 0px;
	margin: 0px;
	}

#rightNav ul {
	padding: 0px;
	margin: 0px 0px 20px 0px;
	}

#rightNav a {
	color: #A2A2FF;
	}

#rightNav a:hover {
	color: #0000FF;
	}

#rightNav li {
	list-style-type: none;
	}

#newsletter {
	background-color: #F5D6C2;
	border: 2px dashed #FF6600;
	position: relative;
	Padding: 10px;
	margin-bottom:10px;
	}

#newsletter2 {
	color: #FFF;
	width: 268px;
	height: 350px;
	background-color: #000;
	background-image: url(images/sign-up-bg.jpg);
	background-repeat: no-repeat;
	background-position: center;
	border: 3px dashed #FF6600;
	padding: 20px;
	margin-bottom: 10px;
	margin-left: 28px;
	}

#newsletter3 {
	color: #FFF;
	width: 264px;
	height: 346px;
	background-color: #FFF;
	background-image: url(images/sign-up-bg.jpg);
	background-repeat: no-repeat;
	background-position: center;
	border: 2px dashed #FF6500;
	padding: 20px;
	margin: 0 0 10px 20px; /* auto; */
	float:right;
	}

#newsletter2 p {
	text-align: left;
	}


#newsletter3 h2 {
	color: #FFF;
	}

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


#footNav {
	border-top: 1px solid #A2A2FF;
	margin-top: 40px;
	margin-right: 0px;
	margin-bottom: 20px;
	margin-left: 0px;
	color: #A2A2FF;
	padding-top: 5px;
	font-size: xsmall;
	}

#footNav a {
	color: #A2A2FF;
	font-weight:normal;
	}

#footNav a:hover {
	color: #0000FF;
	}

#footInfo {
	font-size: 10px;
	color: #666666;
	text-align: left;
	padding: 0px;
	margin-bottom: -10px;
	}

#resources {
	font-size: 10px;
	list-style-type: circle;
	padding-top: 20px;
	}

#topAd {
	margin-left: -4px;
	}

#bottomAd {
	margin-top: 20px;
	margin-bottom: 20px;
	}

#ads {
	background-color: #A2A2FF;
	height: 20px;
	width: 160px;
	background-position: center;
	margin-top: 10px;
	color: #F5D6C2;
	text-align: center;
	font-weight: bold;
	padding: 4px 0px 4px 0px;
	font-size: 12px;
	}

#leftAd {
	margin-top: 10px;
	}

#byLine {
	margin-top: 20px;
	font-size: 10px;
	background-color: #CCCCCC;
	padding: 10px;
	margin-bottom: 20px;
	}

#byLine a {
	color: #666666;
	}

#subCont {
	width:650px;
	margin:0 auto;
	text-align:left;
}

#subCont p {
	text-align:left;
}

/* Classes */

.preSubCont {
	width: 650px;
	margin: 0 auto;
}

.preSubCont p {
	margin-right:0;
	margin-left: 340px;
}

.centerText {
	text-align: center;
	font-weight: bold;
	margin-bottom: 10px;
	}


.nudgeRight {
	text-align: center;
	font-weight: bold;
	margin-bottom: 30px;
	padding-left: 36px;
	}

.bold {
	font-weight: bold;
	}

.blue {
	color: #0000FF;
	}

.blue a {
	color: #0000FF;
	text-decoration: underline;
	}

.blue a:hover {
	text-decoration: none;
	}

.youTube500 {
	margin-left: -150px;
	}

.youTube400 {
	margin-left: -40px;
	}

.resizeButton {
	height: 30px;
	font-weight: bold;

	}

.formInsideHead h2 {
	color: #FF6600;
	background-color: #FFF;
	font-size: 18px;
	text-align: center;
	padding: 2px;
	width: 264px;
	margin-top: -5px;
	}

.indxHeader {
  margin:0 auto;
  padding:0;
  width:650px;
}

.indxHeader h1 {
  margin:20px 0 0 0;
  padding:0;
}

.indxHeader h2 {
  margin:20px 0 0 0;
  padding:0;
}

.emailAssurance {
  font-size:10px;
  margin: 5px -15px 0 -15px;
}

.submit {
  width:120px;
  padding:5px;
  background:#C5FFC5;
  margin:0 auto;
}

.submit input {
  width:120px;
  margin:0;
  padding:2px;
  font-weight:bold;
}

.centerPara p {
	text-align:center;
}

.txtLeft {
	text-align: left;
}

/* hoverpage */

/* ================================================================
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/page_menu.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any
way to fit your requirements.
=================================================================== */

#hoverpage {
  width:650px; /* 560px; */
  height:280px;
  background:#FFEADE;
  position:relative;
  margin: -20px auto 0 auto;
  z-index:500;
  overflow:hidden;
}

#hoverpage table {
  border-collapse:collapse;
  margin:-1px;
}

#hoverpage ul#outer {
  background:transparent;
  padding:0;
  margin:0;
  list-style:none;
}

#hoverpage ul#outer li.page {
  display:inline;
} /* needed for IE to function correctly */

#hoverpage ul#outer li.page a.menuitem {
  text-decoration:none;
}

#hoverpage ul#outer li.page i {
  position:absolute;
  display:block;
  height:25px;
/*   right:460px; */
  background:transparent;
  cursor:default;
  z-index:100;
  text-align:right;
  text-decoration:none;
  color:#00c;
  font-style:normal;
  cursor:pointer;
}

#hoverpage ul#outer li.p1 i {
  top:30px;
  right:548px;
}

#hoverpage ul#outer li.p2 i {
  top:55px;
  right:548px;
}

#hoverpage ul#outer li.p3 i {
  top:80px;
  right:548px;
}

#hoverpage ul#outer li.p4 i {
  top:105px;
  right:533px;
}

#hoverpage ul#outer li.p5 i {
  top:130px;
  right:535px;
}

#hoverpage ul#outer li.p6 i {
  top:155px;
  right:546px;
}

#hoverpage ul#outer li div {
  display:block;
  width:600px; /* 510px; */
  height:230px;
  padding:25px;
  background:#FFEADE;
  font-weight:normal;
  color:#444;
}

#hoverpage ul#outer li div img {
  border:3px solid #fff;
  float:left;
  margin:0 10px 5px 0;
}

#hoverpage ul#outer li div img.imgAbsolute { /* arrow placement */
  position:absolute;
  right:110px;
  bottom:0;
  border-style:none;
  padding:0;
  margin:0;
}

#hoverpage ul#outer li div p.big {
  line-height:1em;
  color:#004;
  font-size:1.5em;
}

#hoverpage ul#outer li div a {
  color:#00c;
  text-decoration:underline;
}

#hoverpage ul#outer li div em {
  display:block;
  width:130px;
  height:150px;
  float:left;
  background:#eff url(images/selected.gif) no-repeat 0 0;
  margin-right:20px;
}

#hoverpage ul#outer li.p1 div em {
  background-position: 0 0;
}

#hoverpage ul#outer li.p2 div em {
  background-position: 0 25px;
}

#hoverpage ul#outer li.p3 div em {
  background-position: 0 50px;
}

#hoverpage ul#outer li.p4 div em {
  background-position: 0 75px;
}

#hoverpage ul#outer li.p5 div em {
  background-position: 0 100px;
}

#hoverpage ul#outer li.p6 div em {
  background-position: 0 125px;
}

#hoverpage ul#outer li.page div a:hover {
  text-decoration:none;
}

#hoverpage ul#outer li.page a:hover {
  white-space:normal;
}

#hoverpage ul#outer :hover div {
  position:absolute; left:0; top:0;
}

