/*
COLOR PALETTE

#FFF5EE - Seashell
#FF8C00 - Dark Orange
#8A360F - Burnt Sienna

#C6E2FF - Sky Blue
#1C86EE - Bright Blue
#0000CD - Royal Blue
*/

html, body {
  margin: 0px;
  padding: 0px; 
  }

body {	
	font: 0.7em/1.25 verdana, arial, helvetica, sans-serif;
	color: #333;
	background:url(images/headerbg.jpg) 0 0 repeat-x #ccc;
	} 

#wrapper {
	padding: 0px; 
	margin: 0px auto; 
	width: 750px; 
	background-color: #eeeeff; 	
	}

#container {
	padding: 0px; 
	margin: auto; 
	width:750px;
	text-align: center;	
	border-right: 1px solid #eee;
	border-left: 1px solid #eee;
	}
	
#content {
	padding: 0px;
	margin: 50px 5px 0px 0px;
	float: right;
	width: 551px;
	height: auto;
	background-color: #fff; 
	border: 1px #ccccff solid;
	text-align: left;
	}

#sidebar {
	margin: 50px 0px 0px 5px;
	padding: 0px 0px 5px 0px;
	width: 170px;  
	float: left; 
	height: auto;
	background: #fff url('images/side-bg.') repeat-y left top;
	text-align: left;
	border: 1px #339966 solid;
	}
	
#signup-box {
padding: 2px 10px;
margin: 10px 10px 10px 10px;
background: #fff url('images/side-bg.') repeat-y left top;
border: 1px solid #eee;
text-align: center;
color: #333;
clear: both;
}

#signup-box a {
color: #99CC99;
font-size: 90%;
font-weight: normal;
text-decoration: none;
padding: 0px;
display: block;
margin: 0px;
width: auto;
text-align: left;
}

#signup-box a:hover {
color: #ccc;
text-decoration: underline;
width: auto;
}
	
#header-container {
	float: left;
	margin: 0px;
	padding: 0px;
	}
	
#header-image {
	background-color: #fff;
	background-image: url('images/header.jpg');
	background-repeat: no-repeat;
	height: 116px;
	width: 750px;
	padding: 0px;
	margin: 0px 0px 0px 0px;
	}
	
img {
  border: none;
  }

blockquote {
  margin: 0;
  padding: 1.5em
  }
	
h1 {
margin-left: 0;
margin-right: 0;
padding: 5px;
font-size: 110%;
color: #333;
border-bottom: 1px #000 solid;
border-top: 0px #000 solid;
background-color: #fff;
letter-spacing: 2px;
font-weight: bold;
text-align: center;
}

h2 {
margin: 10px 0px 10px 0px;
padding: 0px;
color: #333;
font-size: 110%;
font-weight: bold;
text-align: center;
}

h3 {
margin: 0px;
padding: 0px;
line-height: 30px;
font-size: 110%;
color: #FFF;
letter-spacing: 3px;
font-weight: bold;
text-align: center;
height: 30px;
background: #A0825A url('images/box-hd.jpg');
border-bottom: 1px groove;
}

h1.content {
height: 48px;
width: 551px;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
line-height: 35px;
color: #fff;
font-size: 105%;
letter-spacing: 2px;
font-weight: bold;
text-align: center;
border: 0;
background: #ccccff url(images/contenth1-bg.jpg) no-repeat;
clear: both;
}

h2.content {
margin: 20px 0px 20px 0px;
padding: 0px;
color: #336699;
font-size: 110%;
letter-spacing: 1px;
font-weight: bold;
text-align: center;
line-height: 35px;
border-top: 1px dashed #336699;
border-bottom: 1px dashed #336699;
background: #fff url(images/contenth2-bg.) no-repeat;
clear: both;
}

h1.sidebar {
height: 48px;
width: 170px;
margin: 0px 0px 0px 0px ;
padding: 0px ;
line-height: 35px;
color: #fff;
font-size: 105%;
letter-spacing: 2px;
font-weight: bold;
text-align: center;
border: 0;
background: #fff url(images/sideh1-bg.jpg) repeat-x;
clear: both;
}

h2.sidebar {
height: 27px;
width: 170px;
margin: 10px 0px 10px 0px ;
padding: 0px ;
line-height: 20px;
color: #666;
font-size: 90%;
letter-spacing: 0px;
font-weight: bold;
text-align: center;
background: #fff url(images/sideh2-bg.gif) repeat-x;
border: none;
clear: both;
}

	
/* CSS for forms*/

.cssform p{
width: 300px;
clear: left;
margin: 0;
padding: 5px 0 8px 0;
padding-left: 105px; /*width of left column containing the label elements*/
border-top: 1px dotted gray;
height: 1%;
}

.cssform label{
font-weight: bold;
float: left;
margin-left: -105px; /*width of left column*/
width: 150px; /*width of labels. Should be smaller than left column (155px) to create some right margin*/
}

.cssform input[type="text"]{ /*width of text boxes. IE6 does not understand this attribute*/
width: 180px;
}

.cssform textarea{
width: 250px;
height: 150px;
}

/*.threepxfix class below:
Targets IE6- ONLY. Adds 3 pixel indent for multi-line form contents.
to account for 3 pixel bug: http://www.positioniseverything.net/explorer/threepxtest.html
*/

* html .threepxfix{
margin-left: 3px;
}

.cssform input{
font-size: 90%;
margin-left: 160px;
}

.c-box {
width:auto;
height: auto;
background-color: #fff;
padding:10px;
border:1px dashed #666;
margin: 10px;
}

.box-norm {
width: auto;
height: auto;
background-color: #fff;
padding:5px 5px 5px 5px;
border:1px dashed #666;
margin-top: 15px;
margin-bottom: 15px;
clear: both;
}

.box {
width: auto;
height: auto;
background-position: 15px 15px;
background-repeat: no-repeat;
background-color: #fff;
padding:5px 5px 15px 160px;
border:1px dashed #999;
margin-bottom: 15px;
clear: both;
}

#im1{ background-image:url(images/sports-drink.jpg) }
#im2{ background-image:url(images/crunch.jpg) }
#im3{ background-image:url(images/cat-stretch.jpg) }
#im4{ background-image:url(images/diet.jpg) }
#im5{ background-image:url(images/abs1-woman.jpg) }
#im6{ background-image:url(images/veg100.jpg) }
#im7{ background-image:url(images/sinus100.jpg) }
#im8{ background-image:url(images/stomach100.jpg) }
#im9{ background-image:url(images/stressed100.jpg) }
#im10{ background-image:url(images/fat-burners100.jpg) }
#im11{ background-image:url(images/dandruff100.jpg) }
#im12{ background-image:url(images/acne100.jpg) }