/* Basic settings for the page structure, centering text enables the columns to position properly, text is then left aligned within the columns themselves further down */
body {
	margin:0;
	padding:0;
	text-align:center;
	font: normal 0.6em Arial, "sans serif";
	color:#000000;
	background: #56bcc5;
	}



/* This sets the layout for the pop up testimonial windows */
#testimonialbg {
	margin:20px;
	padding:10px;
	text-align:left;
	font: normal 0.8em Arial, "sans serif";
	color:#4c4c4c;
	background: #ffffff;
}


	
a {
cursor:pointer;
}


/* These are the settings for hyperlinks within pages, the pink ones */
a:link { 
	color: #9c1c65;
	text-decoration: underline;
	background: none;
	}
a:visited { 
	color: #9c1c65;
	text-decoration: underline;
	}
a:hover { 
	color: #b5aeb2;
	text-decoration: underline;
	}
a:active { 
	color: #9c1c65;
	text-decoration: underline;
	}

	

/* Main page container */	
#one {
	margin:0 auto;
	padding: 10px 0 0 0;
	width: 760px;
	text-align: left;
	font-family: Arial, "sans serif";
	}


/* Sets the image to be used for the header, this is the wave and logo graphic */
#header-img {
	margin:0 auto;
	display: block;
	height: 117px;
	width: 760px;
	background: #ffffff url(../images/header1.gif) top no-repeat;
	}



/* This is the settings for the navigation bar for the main page links */
#nav {	
	padding-top: 5px;
	padding-bottom: 5px;
	padding-right: 10px;
	background: #80ccd4;
	width: 750px;
	text-align:right;
	font-family: Arial, "sans serif";
	font-size: 1.3em;
	color: #29383a;
	letter-spacing: 0.08em;
		}


/*This sets the colours etc for the page links so that they are differnt from the general pink coloured links */
#nav a:link {
	color: #29383a;
	text-decoration: none;
}
#nav a:visited {
	color: #29383a;
	text-decoration: none;
}
#nav a:hover {
	color: #58777b;
	text-decoration: underline;
}
#nav a:active {
	color: #29383a;
	text-decoration: none;
}
	


/* Sets the image to be used for the photostrip */
#photo-img {
	display: block;
	height: 70px;
	width: 760px;
	background: #ffffff url(../images/photos.jpg) top no-repeat;
	}


/* This is a container for the columns so that they stretch to the same length, for background colour purposes */
#wrapper {
	width: 760px;
	text-align: left;
	background: url(../images/white.gif) repeat-y;
	}




#left-column {
	float: left;
	width: 433px;
	margin: 40px 0 0 0;
	padding: 0 10px 0 38px;
	font-size: 1.38em;
	color: #4c4c4c;
	line-height:1.5em;
	} 



#right-column {
	float: right;
	width: 204px;
	margin: 40px 0 0 0;
	padding: 0 30px 0 25px;
	}



/* extra code for pages that have text going right across the page at the top */
#text_across {
	word-wrap: break-word;
	float: left;
	width: 684px;
	margin: 40px 0 0 0;
	padding: 0 38px 0 38px;
	font-size: 1.38em;
	color: #4c4c4c;
	line-height:1.5em;
		} 


/* the following is the layout for the coloured boxes */

#greybox1_top {
	width: 204px;
	height: 17px;
 	background: #ffffff url(../images/l_grey_box_top.gif) no-repeat bottom center;
	}

#greybox1_content {
	word-wrap: break-word;
	width: 184px;
	padding-left: 10px;
	padding-right: 10px;
	font-size: 1.35em;
	color: #000000;
	background: #f6f4f4;
		}


#greybox1_bottom {
	width: 204px;
	height: 17px;
 	background: #ffffff url(../images/l_grey_box_bottom.gif) no-repeat bottom center;
	margin-bottom: 30px;
}





#bluebox_top {
	width: 204px;
	height: 17px;
 	background: #ffffff url(../images/treatbox_top.gif) no-repeat bottom center;
 	}

#bluebox_content {
	word-wrap: break-word;
	width: 184px;
	padding-left: 10px;
	padding-right: 10px;
	font-size: 1.3em;
	color: #2c5b5b;
	background: #d5eef4;
	}


#bluebox_bottom {
	width: 204px;
	height: 17px;
 	background: #ffffff url(../images/treatbox_bottom.gif) no-repeat bottom center;
	margin-bottom: 30px;
	}


#bluebox_link_sp {
	line-height:1.8em;
	margin-top: 6px;
	}


/* Code to make the links in a blue box a different colour from others on the site */
#bluebox_content a:link {
	font-size: 1.15em;
	color: #29383a;
	text-decoration: none;
	}

#bluebox_content a:visited {
	font-size: 1.15em;
	color: #29383a;
	text-decoration: none;
	}

#bluebox_content a:hover {
	font-size: 1.15em;
	color: #29383a;
	text-decoration: underline;
	}

#bluebox_content a:active {
	font-size: 1.15em;
	color: #29383a;
	text-decoration: none;
	}




#greenbox_top {
	width: 204px;
	height: 17px;
 	background: #ffffff url(../images/greenbox_top.gif) no-repeat bottom center;
 	}

#greenbox_content {
	width: 184px;
	padding-left: 10px;
	padding-right: 10px;
	font-size: 1.3em;
	color: #000000;
	background: #dae3cb;
}


#greenbox_bottom {
	width: 204px;
	height: 17px;
 	background: #ffffff url(../images/greenbox_bottom.gif) no-repeat bottom center;
	margin-bottom: 30px;
}




/* fht settings are for the positioning of the federation of holistic therapy logo and text */
#fht {
	line-height:1.2em;
	}



img.fhtlogo { 
    	float: left;
	margin-right: 15px;
	}



/* postioning carol photo on home page */
img.carol1 { 
    	float: right; 
    	margin-left: 4px;
	margin-top: 15px;
	border: 0px solid #333333;
	}




/* the following form and input settings are for the layout of the newsletters subscription box area */
form {
 	margin: 0;
	padding: 0;
}



input.email {
	margin-top: 10px;
	border: 1px solid #333333;
	background-color: #ffffff;
	font-family: Arial, "sans serif";
	font-size: 12px;
}



input.send {
	margin-top: 10px;
	border: 1px solid #ffffff;
	background-color: #b12073;
	font-family: Arial, "Sans serif";
	color: #ffffff;
	font-size: 11px;
	letter-spacing: 1px;
}



/* seperator is code to end the two columns so that the bottom rounded corner graphic positions correctly */

.seperator {
	clear: both;
	height: 0;
	}

/* seperator2 ends the two columns on the workplace page so that the workplace text flows under both */
.seperator2 {
	clear: both;
	height:60px;
	}


/* this is for the bottom rounded corner graphic */
#footer {
	display: block;
	width: 760px;
	height: 17px;
	background: #56bcc5 url(../images/footer.gif) top no-repeat;
	margin-bottom: 10px;
	}





.italics {
	font-style: italic;
	font-weight: bold;
}



/* this is the layout for a  list contained in the left column such as the prices */
#left-column ul {
	margin-top: 0.8em;
	margin-bottom: -10px;
		}


#left-column li {
	list-style-type: none;
	color: #000000;
	}



/* this is the layout for a list contained in a grey box, such as on the prices page*/
#greybox1_content ul {
	margin-top: 0;
	margin-left: 0;
	padding-left: 1.5em;
	}



#greybox1_content li {
	list-style-type: square;
	line-height: 1.3em;
	font-size: 0.9em;
	font-weight: none;
	color: #444444;
}


/*code to set line brake height in a grey box, stops the list on the prices page having too big a gap */
#greybox1_content br {
	line-height: 1em;
		}



#copyright {
	text-align: right;
	margin-right: 25px;
	margin-bottom: 20px;
	font-size: 1.1em;
}




/* Treatment left and right sets the size of the columns for the treatments page */
#treatment_left {
	float: left;
	width: 310px;
	margin: 0px 0 0 0;
	padding: 40px 25px 0px 38px;
	font-size: 1.38em;
	color: #4c4c4c;
	line-height:1.5em;
	background: #ffffff;
	} 

#treatment_right {
	float: right;
	width: 310px;
	margin: 0px 0 0 0;
	padding: 40px 38px 0px 25px;
	font-size: 1.38em;
	color: #4c4c4c;
	line-height:1.5em;
	background: #ffffff;
	} 


/* img left and right sets the positioning properties for images so that they can be placed on the left or right side of a paragrph of text which then wraps around them */
img.left { 
    	float: left; 
    	margin-right: 10px;
	margin-top: 5px;
	border: 0px solid #333333;
	}


img.right { 
    	float: right; 
    	margin-left: 10px;
	margin-top: 5px;
	border: 0px solid #333333;
	}




/* positioning settings for the round logo on the prices page */
.roundlogo { 
    	float: right; 
    	margin-right: 30px;
	margin-top: -30px;
	margin-bottom: -30px;
	border: 0px solid #333333;
	}




/* horizontal lines, set up to be a dashed line instead of solid line */
hr {
	border: none 0;
	border-top: 1px dashed #cccccc;
	height: 1px;
	text-align: left;
	}




/* sets links to small caps for the links at the top of the treatments and workplace pages */
.caps {
	font-variant: small-caps;
	color: #000;
	letter-spacing: 0.03em;	}



a:link.caps { 
	color: #9c1c65;
	text-decoration: underline;
	font-variant: small-caps;
	font-size: 0.9em;
	background: none;
	}

a:visited.caps { 
	color: #9c1c65;
	text-decoration: underline;
	font-variant: small-caps;
	font-size: 0.9em;
	background: none;
	}

a:hover.caps { 
	color: #b5aeb2;
	text-decoration: underline;
	font-variant: small-caps;
	font-size: 0.9em;
	background: none;
	}

a:active.caps { 
	color: #9c1c65;
	text-decoration: underline;
	font-variant: small-caps;
	font-size: 0.9em;
	background: none;
	}




/* used to make some text a little smaller, such as the special offer text on workplace page */
.smaller {
	font-size: 90%
}




/* used to make subheading text darker */
.darker {
	color: #333333;
}



/* formats the back to top text */
.top {
	font-size: 1.1em;
}



/*formats the close window text on testimonial pop ups */
.close {
	font-size: 0.9em;
}




.times {
	font-family: "Times New Roman", serif;
	font-size: 1.2em;
		}


/* formats view of the week text */
#votw {
	text-align: center;
	padding-bottom: 5px;
	margin-top: 0px;
	font-weight: bold;
	color: #000000;
}

#votw_sm {
	text-align: center;
	margin-top: 3px;
	font-size: 0.9em;
}



/* stops images that are also hyperlinks from having a blue border */
img {
	border-style: none;
}





/* formats the text in the pop up testimonial windows */
#test_popup {
	font-family: Georgia, "Times New Roman", serif;
	font-size: 1.1em;
	line-height:1.5em;
}




/* formatting for the large quotes on teh testimonials page */
.test_quote_left {
	font-family: Georgia, "Times New Roman", serif;
	font-size: 1.3em;
	font-style: italic;
	line-height:1.4em;
	padding-right: 25px;
	padding-top:15px;
	width: 475px;
	padding-left:5px;
}


.test_quote_right {
	font-family: Georgia, "Times New Roman", serif;
	font-size: 1.3em;
	font-style: italic;
	line-height:1.4em;
	padding-right: 25px;
	padding-top:15px;
	width: 475px;
	padding-left:5px;
	float: right;
}




/* used to resize read more link text on testimonials page */
.fakelink {
	font-family: Arial, "sans serif";
	font-size: 0.7em;
	font-style: normal;
	}