/*
Theme Name: Visibility Driving Tuition
Theme URI: http://www.visibilitydrivingtuition.co.uk
Description: Custom web design for Visibility Driving Tuition
Version: 1.0
Author: Chris Spooner
Author URI: http://www.spoongraphics.co.uk

*/

body, div, h1, h2, h3, h4, p, ul, ol, li, dl, dt, dd, img, form, fieldset, blockquote {
	margin: 0; padding: 0;
}

body {
	font: 13px Arial, Helvetica, sans-serif; color: #474747;
	background: #951c50 url(images/body-bg.png) repeat-x; 
	margin: 0 0 40px 0;
}

#container {
	width: 960px; margin: 0 auto;
	background: #b4638a;
}

#header {
	height: 142px; background: url(images/header.png); position: relative; z-index: 10;
}
	#header h1 a {
		display: block; width: 319px; height: 121px; float: left;
		background: url(images/visibility-logo.png) 10px 12px no-repeat; text-indent: -9999px;
	}
	
	#header p { display: none; }
	
	#header ul#nav {
		float: right; list-style: none; margin: 58px 0 0 0;
	}
		#header ul#nav li {
			float: left; margin: 0 27px 0 0; padding: 0 0 0 32px;
			background: url(images/nav-separator.png) left no-repeat;
		}
			#header ul#nav li:first-child { background: none; }
			#header ul#nav li:last-child { margin: 0 10px 0 0; }
			
			#header ul#nav li a {
				font-size: 18px; color: #58585a; text-decoration: none; text-transform: lowercase; padding: 0 0 3px 0;
			}
			#header ul#nav li a:hover {
				color: #951c50; border-bottom: 2px solid #ddd;
			}

#content {
	width: 940px; margin: -22px auto 5px auto; background: #fff url(images/content-curve.png) bottom no-repeat; 
}

#content a.button {
	display: block; height: 29px; width: 130px; padding: 2px 0 0 0; background: url(images/button-bg.png) repeat-x;
	text-decoration: none; color: #fff; text-align: center;
	float: right;
}
	#content a.button:hover { color: #f9edf2; }


#slider {
  width: 940px;
  position: relative;
}
	.feature-area {
	  height: 280px;
	  width: 940px;
	  overflow-y: auto;
	  overflow-x: hidden;
	  position: relative; /* fix for IE to respect overflow */
	  clear: left;
	}
		.feature {
			height: 280px;
			width: 940px;
		}
		
		#driving-tuition { background: #640331 url(images/fiesta-closeup.jpg); }
		#intensive-courses { background: #640331 url(images/country-road.jpg); }
		#further-courses { background: #640331 url(images/road-night.jpg); }
		#driver-improvement { background: #640331 url(images/wet-window.jpg); }
		
		
			.feature .feature-content {
				width: 398px; height: 248px; background: url(images/black-overlay.png); padding: 32px 32px 0 40px;
			}
				.feature .feature-content h2 {
					font-size: 30px; font-weight: normal; letter-spacing: -1px; color: #f9edf2; margin: 0 0 12px;
				}
				.feature .feature-content p {
					font-size: 17px; color: #fff; line-height: 27px;
				}

.feature-tabs dl dt {
	float: left; border-top: 2px solid #b4638a;
}

.feature-tabs dl dt a {
	display: block; width: 210px; height: 63px; padding: 15px 0 0 25px;
	font-size: 18px; color: #fff; text-decoration: none;
	background: #951c50 url(images/tab.png) top;
}
	.feature-tabs dl dt a:hover { color: #e8c1d4; }
	.feature-tabs dl dt a.selected {
		color: #e8c1d4; background: #640331 url(images/tab.png) bottom;
	}
		

.feature-tabs dl dd a {
	margin: 42px 0 0 -210px ; float: left;
	font-size: 14px; color: #b4638a; text-decoration: none;
}


#pagetitle {
	height: 171px;
}
	#pagetitle.about { background: url(images/road-bend-header.jpg); }
	#pagetitle.courses { background: url(images/country-road.jpg); }
	#pagetitle.prices { background: url(images/motorway-header.jpg); }
	#pagetitle.contact { background: url(images/road-texture-header.jpg); }

	#pagetitle h2 {
		width: 900px; height: 59px; background: url(images/black-overlay.png);
		float: left; margin: 91px 0 0 0; padding: 20px 0 0 40px;
		font-size: 27px; font-weight: normal; letter-spacing: -1px; color: #f9edf2; 
	}

#content .main {
	width: 500px; float: left; padding: 30px 40px 40px 40px; border-top: 3px solid #ddd;
}

	#content .main h2, #content .side h3 {
		font-size: 20px; color: #626264; margin: 0 0 10px 0;
	}
	#content .main h3 {
		font-size: 18px; color: #626264; margin: 0 0 10px 0;
	}
	#content .main h4 {
		font-size: 16px; color: #626264; margin: 0 0 10px 0;
	}
	
	#content .main p, #content .side p {
		margin: 0 0 15px 0; line-height: 17px;
	}
	
		#content .main p a:link, #content .main p a:visited { color: #b4638a; text-decoration: none; font-weight: bold; }
		#content .main p a:hover, #content .main p a:active { color: #951c50; text-decoration: underline; }

	#content .main ul, #content .main ol {
		margin: 0 0 15px 40px;
	}
		#content .main ul li, #content .main ol li {
			margin: 0 0 5px 0;
		}
		
		#content .main ul li a:link, #content .main ul li a:visited { color: #b4638a; text-decoration: none; font-weight: bold; }
		#content .main ul li a:hover, #content .main ul li a:active { color: #951c50; text-decoration: underline; }
		#content .main ol li a:link, #content .main ol li a:visited { color: #b4638a; text-decoration: none; font-weight: bold; }
		#content .main ol li a:hover, #content .main ol li a:active { color: #951c50; text-decoration: underline; }

	#content .main blockquote, #content .side blockquote {
		background: #fdebf4; padding: 20px; margin: 0 0 15px 0;
	}
		#content .main blockquote p, #content .side blockquote p {
			font-size: 20px; color: #951c50; margin: 0; line-height: 23px;
		}
		
	#content .main img, #content .side img {
		border: 5px solid #fdebf4;
	}

#content .side {
	width: 320px; float: left; padding: 30px 40px 40px 0; border-top: 3px solid #ddd;
}

	#content p strong.highlight {
		color: #951c50; text-transform: uppercase;
	}
	
	
	#content table { width: 100%; font-size: 15px; color: #626264; }
	#content table tr td { padding: 10px; }
	#content table thead tr { font-weight: bold; }
	#content table tr.alt { background: #fdebf4; }
	#content table tr td strong { font-weight: normal; color: #951c50; }
	#content table tr td a { float: right; color: #951c50; text-decoration: none; }
		#content .side table tr td a:hover { color: #740e3a; text-decoration: underline; }

#content .side form input {
	width: 310px; height: 16px; padding: 5px; margin: 5px 0 0 0;
	background: #fef6fa; border: 1px solid #e3b6cb;
	font: 13px Arial, Helvetica, sans-serif; color: #474747;
}
#content .side form textarea {
	width: 310px; height: 200px; padding: 5px; margin: 5px 0 0 0;
	background: #fef6fa; border: 1px solid #e3b6cb;
	font: 13px Arial, Helvetica, sans-serif; color: #474747;
}
	#content .side form input:focus, #content .side form textarea:focus  {
		border: 1px solid #B4638A;
	}
#content .side form input.submit {
	width: 150px; height: 30px; cursor:pointer;
}


#footer {
	clear: both; padding: 0 8px 8px 8px;
}

#footer ul { list-style: none; padding: 0 0 20px 0; }
#footer ul li.credit {
	float: left;
}
	#footer ul li.credit a {
		display: block; width: 35px; height: 20px; 
		background: url(images/spoongraphics-logo.png); text-indent: -9999px;
	}

#footer ul li.legal {
	float: right; color: #964167; margin: 3px 0 0 0;
	font-size: 11px;
}


.clear:after {
	content: "";
	clear: both; display: block;
}

img.centered {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

img.alignright {
	padding: 4px;
	margin: 0 0 2px 7px;
	display: inline;
}

img.alignleft {
	padding: 4px;
	margin: 0 7px 2px 0;
	display: inline;
}

.alignright {
	float: right; margin: 0 0 10px 10px;
}

.alignleft {
	float: left; margin: 0 10px 10px 0;
}