/*=====================
Sue Harris Health and Fitness
Principle css file
Last updated 29 Mar 2006
=====================*/

/*=====================
General Declarations
=====================*/

* { margin : 0; padding : 0; }

h1, h2, h3, h4, p, ul, ol, dl, address  { padding : 0.5em 20px; }

html { min-width : 760px; }

body {
	text-align : center;
	margin: 0px auto;
	font : 80%/160% Verdana, Geneva, Arial, Helvetica, sans-serif;
	color : #333; 
	background : #f8f8ff;
}

#skip {
	position : absolute;
	left : -9999px;
}

/*=====================
Link styling
=====================*/
a:link, a:visited { 
	color : #FFFF33;
	background-color: transparent;
	text-decoration : none;
	font-weight : bold;
}

a:hover {
	color : #173a8e;
	background-color: #FFCC00;
	text-decoration : none;
	font-weight : bold;
}

.pageabout {
	color : #173a8e;
	background-color: #FFCC00;
	text-decoration : none;
	font-weight : bold;
}

/*=====================
Main container
=====================*/
#container {
	width : 760px;
	margin: 10px auto;
	color : #333; 
	background-color : #fff;
	text-align : left;
	border : 3px double #173a8e;
}

/*=====================
Header Styling
=====================*/
#header {
	padding: 0;
	margin: 0;
	height: 150px;
	color : White;
	background-color : #173A8E;
}

#header h1, #header h2 {
	font-size : 1.8em;
	line-height : 0.8em;
	letter-spacing : 0.3em;
}

#header p {
	line-height : 0.5em;
}

.indx {
	background : url(../images/homeheader.jpg) no-repeat right;
}

.massage {
	background : url(../images/massagehead.jpg) no-repeat right;	
}

.training {
	background : url(../images/trainhead.jpg) no-repeat right;
}

.weight {
	background : url(../images/weighthead.jpg) no-repeat right;
}

.qualified {
	background : url(../images/qualhead.jpg) no-repeat right;
}

.contact {
	background : url(../images/contacthead.jpg) no-repeat right;
}

/*=====================
Central content
=====================*/
#panel {
	float : left;
	border-top : 3px solid #000;
	margin : 7px 0 0 0;
	width : 100%;
}

.home {
	color : #fff;
	background-color : #173a8e;
}

.mass {
	color : #fff;
	background-color : #304a9e;
}

.train {
	color : #fff;
	background-color : #485aad;	
}

.diet {
	color : #fff;
	background-color : #616abd;	
}

.about {
	color : #fff;
	background-color : #797acc;	
}

.links {
	color : #fff;
	background-color : #928adc;	
}

#decor {
	width : 195px;
	float : left;
}

#content {
	float : right;
	/*color : #fff;
	background-color : #4460b4;*/
	padding : 1em;
	width : 530px;
}

#content h2 {
	font-size : 1.6em;
}

#content h3 {
	font-size : 1.3em;
}

#content li {	
	margin : 0 0 1em 5em;
}

.rightpic {
	float : right;
	margin : 10px;
	padding : 5px;
	border : 1px solid #E8E8E8;
}

#links img {	
	margin : 0.5em 0 0 2em;
	padding : 5px;
	border : 1px solid #E8E8E8;
}

#links a:hover {
	color : #FFCC00;
	background-color: transparent;
	text-decoration : underline;
}

#links p {
	padding : 0.2em 20px 0.5em;
	margin : 0 0 0 1em;
}

/*=====================
Navigation
=====================*/
#nav {
	text-align : center;
	border-top : 3px solid Black;
	margin : -5px 0;
}

#nav ul { 
	background: White url("../images/navblock.jpg") no-repeat 0 0;
	position: relative;
	list-style-type: none;
	padding: 0;
	margin: 0;
	height: 120px;
}

#nav ul a { 
	display: block;
	width: 120px;
	height: 120px;
	position: absolute;
	text-indent: -9999px;
}

#nav li {
	width: 760px;
	display : inline;
}

#n1 a { top: 0; left: 0px; }

#n2 a { top: 0; left: 120px; }

#n3 a { top: 0; left: 240px; }

#n4 a { top: 0; left: 360px; }

#n5 a { top: 0; left: 480px; }

#n6 a { top: 0; left: 600px; }


#n1 a:hover, #n1.current a { background: transparent url("../images/navblock.jpg") no-repeat  0 -120px; }

#n2 a:hover, #n2.current a { background: transparent url("../images/navblock.jpg") no-repeat  -120px -120px; }

#n3 a:hover, #n3.current a { background: transparent url("../images/navblock.jpg") no-repeat  -240px -120px; }

#n4 a:hover, #n4.current a { background: transparent url("../images/navblock.jpg") no-repeat  -360px  -120px; }

#n5 a:hover, #n5.current a { background: transparent url("../images/navblock.jpg") no-repeat  -480px -120px; }

#n6 a:hover, #n6.current a { background: transparent url("../images/navblock.jpg") no-repeat  -600px -120px; }


/*=====================
Footer
=====================*/
#footer {
	border-top : 3px solid Black;
	clear : both;
	margin-top : 5px;
}

#footer .right {
	float : right;
}

#footer a, #footer a:visited {
	color : #173A8E;
	background : transparent;
	text-decoration : none;
	font-weight : normal;
}

#footer a:hover {
	color : #fff;
	background-color : #173A8E;
	text-decoration : none;
	font-weight : normal;
}