/* ~-~-~~-~-~ CSS Document -~-~-~-~-~ *\
|                                      |
|             Created for:             |
|              DrPepi.com              |
|           by Ashton Sanders          |
|         WebsitesinaFlash.com         |
|                                      |
\* ~-~-~~-~-~-~-~-~-~-~-~-~-~-~-~-~-~ */

/* ~-~-~-~-~- LAYOUT ~-~-~-~-~- */

html {
	margin:0;
	min-width:975px;
}

body { 
	font-family: Arial, Helvetica, sans-serif;
	background-color: #FFFFFF;
	text-align:center;
	margin:0;
}

div, h1, h2, h3, h4 { margin:0}

div#container {
	width: 975px;	
	margin: 0 auto;
}


#leftnav a:hover{color:#000000;}

/* ~-~-~-~-~- HEADER ~-~-~-~-~- */

#header {
	height: 82px;
	background: url('../images/pepiheader.gif') top left no-repeat;
}

#header h1 {
	margin: 0;
	padding-top:23px;
	font-size: 190%;
	font-weight:100;
}

#header h1 span {
	display:none;
	color: #89B0B0;
	background-color: #FFFFFF;
	font-family: "Courier New", Courier, Arial, Helvetica, sans-serif;
}

/* ~-~-~-~-~- Anchors ~-~-~-~-~- */

#mainbody a { color: #48979D; text-decoration:none}

#mainbody a:hover { color: #2D5B60; }

/* ~-~-~-~-~- Main Content ~-~-~-~-~- */

#content {
	border: 1px solid #4E4E50;
	text-align:left;
	margin-top: 15px;
	background: url('../images/leftnav-bg2.gif') repeat-y ;
}

h3#maintitle {
	font-style:normal !important;
	border: solid #4E4E50;
	border-width: 0 0 1px 1px;
	margin-left: 136px;
	padding: 1px 16px;
	color: #4E4E50;
	background-color: #AAD5D8; /*  #9CCED2  #8BC6CA; /*A7CACA;*/
	font-size: 12px;
	font-family: "Arial Black", Gadget, Arial, Helvetica, sans-serif;
	text-transform:uppercase;
	letter-spacing:2px;
	font-weight:100;
}

#mainbody {
	border: solid #4E4E50;
	border-width: 0 1px 0 1px;
	margin: 0 185px 0 136px;
	padding: 0 17px 15px 16px;
	text-align:left;
	background: #FFFFFF;
	min-height: 1050px;
}

.height {float:left; width:1px; font-size:1px;}
.htip { height: 1100px;}
.nine { height: 900px;}
.ten {height: 1050px;} /* 0-4 side bar items */
.ten2 {height: 1200px;} /* 6 side bar items */
.ten3 {height: 1300px;} /* 6 side bar items */
.ten5 {height: 1500px;} 
.ten6 {height: 1600px;} 
.ten7 {height: 1700px;} /* 7 side bar items */
.ten9 {height: 1900px;} /* 8 side bar items */
.twenty {height: 2300px;}  /* 8 side bar items */
.twenty5 {height: 2600px;}  /* 8 side bar items */
.twenty8 {height: 3500px;}  /* Successes */
.mains {height: 3000px;} /* success storeis in the side bar */

#mainbody h1 {
	color: #AEBB51;
	margin:  0;
	line-height: 38px;
	font-size: 32pt;
	font-weight:100;
	font-family: "Courier New", Courier, Arial, Helvetica, sans-serif;
	margin-bottom: 5px;
}

#mainbody h2, #mainbody h3 {
	color: #7B8E66;
	font-family: "Arial Black", Arial, Helvetica, sans-serif;
	font-weight:100;
}

#mainbody h2 {
	font-size:18px;
	line-height:20px;
}

#mainbody h3 {
	font-size:17px;
}

#mainbody strong {
	color: #7B8E66;
	font-family: "Arial Black", Arial, Helvetica, sans-serif;
	font-weight:100;
}
/*
#mainbody h3 {
	padding-top:3px;
	margin-bottom:-5px;
	color: #428385;
	font-size: 170%;
	font-weight:100;
	letter-spacing:2px;
	font-family: "Courier New", Courier, Arial, Helvetica, sans-serif;
}

#mainbody #topsec {
	position:relative;
	height:210px;
}

#topsec .limg {
	padding: 10px 15px 0 0;
	float:left;
}

#topsec #topbottom {
	position:absolute;
	bottom:0;
	left:170px;
}

.sig {
	font-weight:100;
	color: #4E4E50;
	font-size: 60%;
	line-height: 10px;
	letter-spacing:1px;
	font-family: Arial Black, Arial, Helvetica, sans-serif;
}
*/
#mainbody .list3 {
	width: 32%;
	margin:6px 8px 6px -4px;
}

.left {
	float:left
}

.right {
	float:right;
}

#mainbody .list4 {
	width: 24%;
	float:left;
	margin:12px 8px 6px -4px;
}

#mainbody .list3 a, #mainbody .list3 p,  #mainbody .list4 a {
	text-decoration:none;
	color: #3F3F42;
	font-size: 15px;
	display:block;
	margin-bottom: 5px;
	padding-left: 5px;
	background: url('../images/bullet.gif') 0 6px no-repeat;
}

#mainbody.homepage .list3 a, #mainbody.successpage .list4 a {
	background: url('../images/bullet-purple.gif') 0 6px no-repeat;
}

#mainbody .list3 a:hover, #mainbody .list4 a:hover{
	color: #000000;
}

#mainbody p.esig {
	margin-top:-10px;
	font-weight:100;
	color: #899C73;
	font-size: 85%;
	line-height: 30px;
	letter-spacing:0px;
	text-align:right;
	font-family: "Arial Black", Gadget, Arial, Helvetica, sans-serif;
}

#mainbody p, #popup, #mainbody ol,  #mainbody ul {
	margin-top:5px;
	margin-bottom:13px;
	font-size:95%;
	line-height: 130%;
	color: #3F3F42;
}

#mainbody p {
	text-indent: 34px ;
}

#mainbody img {
	margin-left: 1px;
}

#mainbody .leadin {
	margin-top: 15px;
}

#mainbody p.signout {
	padding-top: 11px;
	margin-bottom: 29px !important;
}

#mainbody p.signoutdate {
	margin-top:-9px !important;

}

img.ht-sig {
	margin-left:-7px !important;
}

.printtip  {
	margin-top: 8px;

}

/*
#mainbody p.leadin2 {
	font-size: 17px;
	line-height: 140%;
	font-weight: 100;
	color: #3F3F42;
	margin-top:5px; 20px
} 
*/
/*
.leadinletter {
	color: #BD835E;
	padding: 15px 0 0 0;
	width: 80px;
	font-size: 350%;
	font-weight: 100;
	height: 30px;
	float:left;
	text-align:right;
	font-family:Courier, Arial, Helvetica, sans-serif;
}*/

/* ~-~-~-~-~- LEFT NAVIGATION ~-~-~-~-~- */

#leftnav {
	font-family: "Arial Black", Gadget, Arial, Helvetica, sans-serif;
	position:absolute;
	top:93px;
	width: 120px;
	color:#009900;
	padding: 30px 10px 10px;
	line-height: 15px;
}

#leftnav a, #leftnavbtm a{
	font-family: "Arial Black", Gadget, Arial, Helvetica, sans-serif;
	text-decoration:none;
	font-weight:100;
	color: #4E4E50;
	font-size: 80%;
	display:block;
	margin: 15px 0;
	padding-left: 8px;
	background: url('../images/bullet.gif') 3px 6px no-repeat;
}

#leftnav a:hover{
	color:#000000;
}

#leftnav img{
	padding:0;
}

#leftnav p {
	padding: 33px 0 0 10px;
	margin:0;
	font-size: 80%;
	font-weight:900;
	color:#809469;
	line-height: 15px;
	font-family: "Courier New", Courier, Arial, Helvetica, sans-serif;
}

#leftnavbtm {
	position:absolute;
	margin-top:-150px;
	width: 120px;
	padding: 10px;
}

#rightnav {
	float:right;
	position:absolute;
	top:118px;
	right: 50%;
	margin-right: -486px;
	width: 165px;
	color:#809469;
	padding: 0 10px 10px 10px;
	text-align:center;
	font-family: "Courier New", Courier, Arial, Helvetica, sans-serif;
}

#rightnav img {
	margin: 5px auto;
	border:0;
}

#rightnav img.square {	margin: 0 auto;}

#rightnav h3{
	font-size:80%;
	color:#899C73;
	text-transform:uppercase;
	font-weight:100;
	font-family: Arial Black, Arial, Helvetica, sans-serif;
}


#rightnav table#htsubscribe {
	color:#4E4E50;
	text-align:left;
	font-size:11px;
	font-family:  Arial, Helvetica, sans-serif;
}
#rightnav table#htsubscribe input {
	width: 130px;
}


ul.successes, ul.successes li { list-style:none; margin:0; padding:0;}

ul.successes li {border: 1px solid #FFFFFF; margin: 6px 0;padding-left: 8px;
	background: url('../images/bullet.gif') 3px 6px no-repeat;}
.successes a {
	display:block;
	color: #89b0b0; /*75BABF;*/
	font-size:14px;
	font-weight:100;
	text-align:left;
	text-decoration:none;
	font-family: "Arial Black", Arial, Helvetica, sans-serif;
	line-height: 15px;
}

.successesb a {
	display:block;
	color: #75BABF;
	font-size:14px;
	font-weight:100;
	text-align:left;
	text-decoration:none;
	margin: 8px 0;
	padding-left: 8px;
	background: url('../images/bullet.gif') 0 6px no-repeat;
	font-family:  Arial, Helvetica, sans-serif;
	line-height: 15px;
}

.successesb a:hover, #rightnav .successes a:hover {
	color: #458D94;
}

div.ds ul.successesb li {
	margin: 10px 0;
	line-height: 14px;
}
div.ds ul.successesb, div.ds ul.successesb li a {
	margin: 0;
	line-height: 14px;
}

.arial {
	font-family:  Arial, Helvetica, sans-serif !important;
}
/*
#rightnav a {
	color: #3F3F42;
	font-size: 70%;
	text-decoration:none;
	font-weight:900;
	line-height: 22px;
}

#rightnav a:hover {
	color:#000;
}
*/




/* ~-~-~-~-~- FOOTER ~-~-~-~-~- */

#footer {
	color: #66615B;
	font-size: 70%;
	clear:both;
	text-align:center;
	padding:20px;
	background: #FFFFFF;
}

/* ~-~-~-~-~- IMAGES ~-~-~-~-~- */


.rimg {
	padding-left: 15px;
}

.staff { 
	height:175px;
	margin:20px;
}

.hline {
	display:block;
	height: 8px;
	background: url('../images/bullet-line.gif') center left repeat-x;
	margin:5px 0;
	font-size: 10px;
}

.vline {
	display:block;
	width: 8px;
	background: url('../images/bullet-line.gif') center top repeat-y;
	margin:0 5px;
	margin-top:-20px;
	font-size: 10px;
	float:left
}

#rightnav .hline {
	margin: 0 0;
}

#mainbody .hline {
	margin: 10px 0;
}

#leftnav .hline {
	background-position: 0 6px;
	padding: 1px 0 !important;
	margin:0 !important;
}

/* ~-~-~-~-~- Lists ~-~-~-~-~- */


#mainbody ol {
	margin: 0 0 13px 0;
	padding:0 0 0 40px;
}

#mainbody ol li{
	list-style:decimal; 
	text-transform:none;
	padding:0; 
	margin:0 0 0px 15px;
	marker-offset: 20px ;
}

#mainbody ul.bullet ,#mainbody ul.bullet2,#mainbody ul.bullet3  {
	margin:0;
	padding:0;
}

#mainbody ul.bullet li { /* Indented Text with Orange Bullet */
	text-indent: 33px;
	text-decoration:none;
	font-weight:100;
	color: #3F3F42;
	line-height: 150%;
	margin: 10px 0 13px;
	padding: 0;
	background: url('../images/bullet.gif') 26px 10px no-repeat;
	font-family: Arial, Helvetica, sans-serif;
	list-style: none;
}

#mainbody ul.bullet2 li { /* Colored Text with Orange Bullet */
	text-decoration:none;
	font-weight:100;
	color: #7B8E66;
	line-height: 130%;
	margin: 0 0 8px 0;
	padding-left: 8px;
	background: url('../images/bullet.gif') 0 10px no-repeat;
	font-family: Arial, Helvetica, sans-serif;
	list-style: none;
}

#mainbody ul.bullet3 li { /* NOT Indented Text with Orange Bullet */
	text-decoration:none;
	font-weight:100;
	color: #3F3F42;
	line-height: 150%;
	margin: 8px 0;
	padding:0 0 0 33px;
	background: url('../images/bullet.gif') 26px 10px no-repeat;
	font-family: Arial, Helvetica, sans-serif;
	list-style: none;
}

ul.bluelist {
	
}

ul.bluelist li {
	list-style:none;
	color: #75BABF;
	font-size:15px;
	font-weight:800;
	margin: 10px 0;
	padding: 0 8px;
	background: url('../images/bullet.gif') 0 8px no-repeat;
	font-family:  Arial, Helvetica, sans-serif;
}

ul.treatment b {
	font-family: "Arial Black", Arial, Helvetica, sans-serif;
	font-weight:100;
	color:#7B8E66;
}

ul strong {
	font-size: 14px;
}

hr {
	width:0;
}



#rightsubmit {
	background: url('../images/right/submit-button.jpg') no-repeat; 
	border: 0px;
	width: 132px; 
	height:22px;
	cursor:pointer;
	margin:10px;
} 

.ppcimage2 { 
float:right;
padding: 10px 0px 0 10px
}


.ppcimage3 { 
float:right;
padding: 10px 0px 0 10px
}



.ppcimage4 { 
float:right;
padding: 10px 0px 0 10px
}

.ppcimage5 { 
float:right;
padding: 10px 0px 0 10px
}

.ppcimage6 { 
float:right;
padding: 10px 0px 0 10px
}

.ppcimage7 { 
float:right;
padding: 10px 0px 0 10px
}

.ppcimage8 { 
float:right;
padding: 10px 0px 0 10px
}

.ppcimage9 { 
float:right;
padding: 10px 0px 0 10px
}

.ppcimage10 { 
float:right;
padding: 10px 0px 0 10px
}

.ppcimage11 { 
float:right;
padding: 10px 0px 0 10px
}

.hquote { margin:7px 0 20px; }
.trquote { float:right; padding: 20px 0px 0 10px }
.rimg { float:right; padding: 10px 0px 0 10px }
.limg { float:left; padding: 12px 15px 0 0 }


/* ~-~-~-~-~-~-~-~-~-~- SECTIONS ~-~-~-~-~-~-~-~-~-~- */


/* ~-~-~-~-~- HEALTH TIPS ~-~-~-~-~- */
#health-tips h3#maintitle {background-color:#D1C3DA;}
#health-tips #content  {background-image:url(../images/leftnav-bg-ht.gif);}
#health-tips #header {background-image:url(../images/pepiheader-ht.gif);}

/* ~-~-~-~-~- RECIPES ~-~-~-~-~- */
#recipes h3#maintitle {background-color:#DBADB8;} 
#recipes #content  {background-image:url(../images/leftnav-bg-ht-r.gif);}
#recipes #header {background-image:url(../images/pepiheader-ht-r.gif);} 

/* ~-~-~-~-~- NUTRITION ~-~-~-~-~- */
#nutrition h3#maintitle {background-color:#F1DA8B;}
#nutrition #content  {background-image:url(../images/leftnav-bg-ht-n.gif);}
#nutrition #header {background-image:url(../images/pepiheader-ht-n.gif);}

/* ~-~-~-~-~- SUCCESSES ~-~-~-~-~- */
#successes h3#maintitle {background-color:#E3B9A9;}
#successes #content  {background-image:url(../images/leftnav-bg-success.gif);}
#successes #header {background-image:url(../images/pepiheader-success.gif);}

/* ~-~-~-~-~- HOSPITALS ~-~-~-~-~- */
#hospitals h3#maintitle {background-color:#DFBDA6;}
#hospitals #content  {background-image:url(../images/leftnav-bg-ht-h.gif);}
#hospitals #header {background-image:url(../images/pepiheader-ht-h.gif);}

/* ~-~-~-~-~- QUIZ ~-~-~-~-~- */
#quiz h3#maintitle {background-color:#a9c7e8;}
#quiz #content  {background-image:url(../images/leftnav-bg-quiz.gif);}
#quiz #header {background-image:url(../images/pepiheader-quiz.gif);}
#quiz #mainbody p { text-indent:0; margin-left:34px;}

/* ~-~-~-~-~- VIDEOS ~-~-~-~-~- */
#videos h3#maintitle {background-color:#BABFE8;}
#videos #content  {background-image:url(../images/leftnav-bg-videos.gif);}
#videos #header {background-image:url(../images/pepiheader-videos.gif);}

/* ~-~-~-~-~- VACCINES ~-~-~-~-~- */
#vaccines h3#maintitle {background-color:#D8B8DC;}
#vaccines #content  {background-image:url(../images/leftnav-bg-vaccines.gif);}
#vaccines #header {background-image:url(../images/pepiheader-vaccines.gif);}

/* ~-~-~-~-~- BEDROOM ~-~-~-~-~- */
#bedroom h3#maintitle {background-color:#B5D8E7;}
#bedroom #content  {background-image:url(../images/leftnav-bg-bedroom.gif);}
#bedroom #header {background-image:url(../images/pepiheader-bedroom.gif);}

/* ~-~-~-~-~- PERSONAL CARE ~-~-~-~-~- */
#personal_care h3#maintitle {background-color:#D1CCFF;}
#personal_care #content  {background-image:url(../images/leftnav-bg-personal-care.gif);}
#personal_care #header {background-image:url(../images/pepiheader-personal-care.gif);}







/*  Here is the Green that Anita Likes: #E9ECC9 */


/* ~-~-~-~-~-~-~-~-~-~- SURVEY BOXES ~-~-~-~-~-~-~-~-~-~- 479px*/

.pepisurvey {
	border:17px solid #F2E78C; 
	width:457px;
	padding:35px 8px 5px; 
	font-size:14px; 
	margin-top:17px;
	background-repeat:no-repeat;
	height:114px;
	color: #3f3f42;
}

.pepisurvey .surveysubmit {
	float:right; background: none;   margin-bottom:3px;
}



.pepisurvey textarea{
	width:450px; height:40px; margin-bottom:5px;
}

.peachform { background-image:url('../images/survey-peach.jpg'); background-color: #F5E1E3 }
.lavenderform { background-image:url('../images/survey-lavender.jpg'); background-color: #E5E2F7 }
.mintform { background-image:url('../images/survey-mint.jpg'); background-color: #EAF6DE }


.pepisurvey .surveysubmit { color: #708742; font-weight:900; letter-spacing:2px; text-transform:uppercase; border:3px solid #999}

.peachform .surveysubmit { background: #E7D1D4; color:#72618E}
.lavenderform .surveysubmit { background: #D6D1E8}
.mintform .surveysubmit { background: #DAEAD0}


/* ---------- Search Box ------------*/

#searchap .input {
	position:absolute;
	top: 99px;
	right: 50%;
	margin-right:-434px;
	
	width: 130px;
	border:1px solid #425458;
	height: 15px;
	vertical-align:top;
	padding:0;
	font-size: 12px;
}
#searchap .submit {
	position:absolute;
	top: 98px;
	right: 50%;
	margin-right:-486px;
	width: 51px;
	height: 19px;
	vertical-align:top;
	font-size: 11px;
	line-height:9px;
	padding: 0 4px;
}

.right.print { text-align:center;}
.right.print img {margin:0 auto}
#addthis {margin-top:10px;}


#container #content .color1 { color:#698B8A;}
#container #content .color2 { color:#8C8C05;}
#container #content .color3 { color:#B4652A;}
#container #content .color4 { color:#637F43;}
#container #content .color5 { color:#755C9E;}

.success_section p { font-style:italic;}
#successes .color1 * { color:#B4652A; font-style:italic }
#successes .color2 * { color:#637F43; font-style:italic }
#successes .color3 * { color:#755C9E; font-style:italic }
#successes .color4 * { color:#698B8A; font-style:italic }
#successes .color5 * { color:#8C8C05; font-style:italic }

.purple-lines .hline, #mainbody.mainsuccess .hline {background-image: url('../images/bullet-line-purple.gif')}


/*  Articles on Supplements  */
.vdotline { 
	background: url('../images/content/vids/orange-dot.jpg') top left repeat-y;
	width:5px;
}