/* 
Project: Rehability Website
Author: Rade New Media
Date: 11 August, 2009
*/

body {
	background: #fff url('images/bg.jpg') top repeat-x;
	font: 12px Arial, Helvetica, sans-serif;
	color: #555555;
	padding: 0;
	margin: 0;
}	

div#container {
	width: 955px;
	margin: 0 auto;
}

input {
	color: #555555;
	border: #fff 1px solid; 
	padding: 1px; 
}		

p {
	margin: 5px 0; 
}

form {
	margin: 0;
	padding: 0;
}

.interiorRight hr {
	background: #FF66FE;
	border: 0;
	height: 1px;
}

a { color: #dc38d7; text-decoration: underline; } 
	a:hover { text-decoration: none; } 

/* Header and Navigation styles */
div#header {
	height: 122px;
	margin: 0 0 10px 0;
}		h1 { 
			background: url('images/logo.jpg') no-repeat; 
			width: 500px; 
			height: 65px; 
			float: left; 
			margin: 20px 0 0 0; 
		}		h1 span { display: none; }
				h1 a { display: block; height: 55px; }
		div#phone {
			background: url('images/phone.jpg') no-repeat;
			width: 170px;
			height: 30px;
			float: right;
			margin: 35px 15px 0 0;
		}		#phone span { display: none; }
				#phone a { display: block; height: 30px; }
		div#navigation {
			background: url('images/nav-bg.jpg') repeat-x;
			width: 942px;
			height: 38px;
			clear: both;
			position: relative;
		}		#navigationLeft { background: url('images/nav-left.jpg') no-repeat; position: absolute; top: 0; left: 0; width: 5px; height: 38px; }
				#navigationRight { background: url('images/nav-right.jpg') no-repeat; position: absolute; top: 0; right: 0; width: 5px; height: 38px; }
				#navigation ul { margin: 0; padding: 0; list-style: none; }
					#navigation ul li { float: left; }
						#navigation ul li a { background: url('images/li.jpg') top right no-repeat; color: #fff; font-weight: bold; text-decoration: none; display: block; padding: 8px 20px 9px 20px; margin: 3px 0 0 0; }
						#navigation ul li a.active { background: #cc31cb; }
						#navigation ul li a:hover { background: #cc31cb; }
		div#search {
			float: right; 
			margin: 8px 8px 0 0;
			width: 190px;
		}		.go { background: url('images/button-bg.jpg') repeat-x; color: #fff; padding: 2px 2px 0 2px; border: 0; font-weight: bold; }
				#search p { margin: 0; padding: 0; }
					* html div#search { margin: 5px; }
					* html .go { margin: 2px 0 0 0; }
					* html .search { margin: 0 0 2px 0; }
				
/* Middle Area */
div#middle {
	height: 320px;
	margin: 0 0 15px 0;
	width: 950px;
}		div#openingTimes {
			background: #f2f2f2;
			border: #ececec 1px solid;
			padding: 9px 6px;
			width: 285px;
			float: left;
			display: inline;
			margin-bottom: 20px;
		}		
		div#subNav {
			float: left; 
			margin: 0 0 0 10px;
			width: 635px;
			display: inline;
		}		.square {
					width: 195px;
					height: 145px;
					border: #e5e5e5 1px solid;
					padding: 5px;
					float: left;
					margin: 2px 2px;
					position: relative;
				}		.titleBar { 
							background: #660064; 
							width: 185px;
							height: 20px;
							padding: 5px;
							position: absolute; 
							bottom: 5px;
							left: 5px;
							z-index: 1;
						}		.titleBar2 a { 
									font-weight: bold;
									font-size: 13px;
									text-decoration: none;
									color: #fff;
									position: absolute; 
									bottom: 13px;
									z-index: 2;
									display: block;
									height: 15px;
									width: 190px;
									padding: 120px 0 0 5px;
								}		.titleBar2 a:hover { text-decoration: underline; }
										.titleBar2 img { float: right; border: 0; margin: 0 5px 0 0; }
											* html .titleBar2 a { bottom: 11px; }
											* html .square { margin: 0 4px 4px 0; }

/* Content Area */
div#content { 
	background: #fff url('images/content-bg.jpg') repeat-x;
	padding: 0 15px;
	margin: 0 5px 0 0;
	overflow: hidden; 
	display: inline-block;
	position: relative;
}		#content { display: block; }
		#contentLeft { float: left; width: 280px; border-right: #ddd 1px solid; margin: 15px 0 0 0; }
			#contentLeft p { margin: 15px 5px; }
			#contentLeft a { color: #555; text-decoration: none; }
				#contentLeft a:hover { text-decoration: underline; }
			h2 { background: url('images/latest-news.jpg') no-repeat; width: 125px; height: 23px; margin: 0; }
				h2 span { display: none; }
			span.headline { color: #dc38d7; font-weight: bold; } 
			.hr { border-bottom: #555 1px dotted; display: block; height: 5px; margin: 0 20px 0 5px; }
			h3 { background: url('images/testimonial.jpg') no-repeat; width: 116px; height: 24px; margin: 10px 0; }
				h3 span { display: none; }
			h6 {margin-bottom:5px;font-size :1.6em; color :#61016c;}
}
			.testimonial { margin: 0 20px 15px 5px; position: relative; }
				.testimonial p { padding: 5px 10px 0 25px; }
				.quote1 { background: url('images/quote1.jpg') no-repeat; position: absolute; top: 0; left: 0; width: 22px; height: 18px; }
				.quote2 { background: url('images/quote2.jpg') no-repeat; position: absolute; bottom: 20px; right: 20px; width: 22px; height: 18px; }
				span.name { color: #dc38d7; font-weight: normal; } 
		#contentRight { float: left; width: 615px; margin: 10px 0 0 10px; } 
			#contentRight p { margin: 5px 0 15px 0; } 
			h4 { margin: 0 0 10px 0; font-size: 18px; font-weight: lighter; }
			.associated { margin: 20px 0 0 0; }
		* html #content { background: #fff url('images/content-bg.jpg') top left repeat-x; }

			
/* Footer */
div#footer {
	border-top: #dc38d7 1px solid; 
	padding: 10px 0 10px 20px;
	margin: 20px 0 0 0;	
	clear: both;
}

/* Contact Page */
div#contactForm {
	float: left; 
	margin: 0 0 20px 10px;
	width: 615px;
	padding: 0 10px 10px 0;
}		.formWrap { clear: both; padding: 5px 0 0 0; }
		.label { width: 90px; float: left; }
		.input { width: 420px; float: left; }
			.seperator { border-bottom: #555 1px dotted; display: block; height: 10px; margin: 0 20px 5px 0; clear: both; }
			.contactInput { border: #888 1px solid; padding: 2px; }
			.buttonHolder { float: right; clear: both; margin: 20px 95px 0 0; display: inline; } 
				.generalInput { width: 190px; font: 12px Arial, Helvetica, sans-serif; }
					.generalInput:focus { border: #ff66fe 1px solid; background: #fff url('images/input-bg.jpg') top left repeat-x; }
				.address { width: 250px; font: 12px Arial, Helvetica, sans-serif; }
					.address:focus { border: #ff66fe 1px solid; background: #fff url('images/input-bg.jpg') top left repeat-x; }
				.postcode { width: 110px; font: 12px Arial, Helvetica, sans-serif; }
					.postcode:focus { border: #ff66fe 1px solid; background: #fff url('images/input-bg.jpg') top left repeat-x; }
				.message { width: 420px; height: 155px; overflow: hidden; font: 12px Arial, Helvetica, sans-serif; }
					.message:focus { border: #ff66fe 1px solid; background: #fff url('images/input-bg.jpg') top left repeat-x; }
				.submit { background: url('images/button.jpg') no-repeat; display: block; width: 85px; height: 40px; font-weight: bold; color: #fff; }
					.submit:hover { background: url('images/button-hover.jpg') no-repeat; text-decoration: underline; padding: 1px 0 0 0; }
		div#footNote { clear: both; float: left; margin: 0 0 0 95px; }
		.requiredField { color: #FF00FF; }
					
/* Interior Pages */
.fullLeft {
	width: 300px;
	float: left;
	margin-bottom: 0px;
}		.fullLeft h1 { float: none; }
		#navLeft { margin: 0 0 15px 0; border-bottom: #ff66fe 1px solid !important; }
			.firstNav { border-top: #ff66fe 1px solid !important; margin-top: 0 !important; }
		.interiorLeft { 
			background: #fff url('images/content-bg.jpg') top repeat-x;
			padding: 10px;
			margin: 15px 5px 0 0;
			overflow: hidden; 
			float: left;
			width: 279px;
		}		.interiorLeft a { color: #555; text-decoration: none; }
				.interiorLeft a:hover { text-decoration: underline; }
				.interiorLeft p { margin: 15px 5px; }
				* html .fullLeft { width: 290px; }
		* html .interiorLeft { display: inline; }
		.leftImage { background: #f2f2f2; padding: 8px; margin-bottom: 10px; }
			.leftImage img { border: #b5b5b5 1px solid; }

.interiorRight {
	float: left; 
	margin: 0 0 0px 10px;
	width: 615px;
}		div#interiorSubNav {
			float: left; 
			margin: 10px 0;
			width: 635px;
		}
		.interiorRight p { margin: 10px 0; }
		h5 { font-size: 12px; font-weight: bold; margin: 0; }
		
div#interiorMiddle {
	margin: 0 0 15px 0;
}		

#navLeft {
	list-style: none;
	margin: 0 0 20px 0;
	padding: 0;
}		#navLeft ul { 
			list-style: none; 
			margin: 0;
			padding: 0;
		}		#navLeft ul li {   }
					#navLeft ul li a {
						background: url('images/accordion_toggle.jpg') no-repeat top right;
						height: 33px;
						width: 279px;
						padding: 0 10px 0 10px;
						color: #D937D8;
						font-weight: bold;
						text-decoration: none;
						display: block; 
						border-top: #333 1px dotted;
						line-height: 30px;
					}		#navLeft ul li.active {
								background: url('images/accordion_toggle_active.jpg') no-repeat top right;
								color: #660066;
								border-bottom: 0;
							} 		#navLeft ul li ul { margin: 0 0 0 30px; }
									#navLeft ul li li a { background: none; border-top: 0; padding: 0; color: #333; font-weight: normal; line-height: 10px; height: 20px; width: 249px; }
										#navLeft ul li li a:hover { text-decoration: underline; }
									#navLeft ul li li a.viewing { font-weight: bold; }

/*************************************************************/
.productImages {
	padding: 5px 0;
	margin: 0 0 5px 0;
	border-bottom: #ffd6ff 1px solid;
	overflow: hidden; 
	/*float:left;*/
}		.productImages img { border: #ffd6ff 2px solid; float: left; margin: 0 10px 10px 0; }
			.productImages img:hover { border: #ff66fe 2px solid; }
		.productImages p { margin: 0 0 10px 0; }

#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }

.bigpinkbox{background-color:#dc38d7;color:#FFF;;font-weight:bold;padding:10px;}