@charset "utf-8";
/* CSS Document */

* {
	padding: 0;
	margin: 0;
}

body {
	background: #e8f1f8 url(../images/body-bg.gif) top left repeat-x;
	padding-top: 40px;
}
div.clear {
	clear: both;
}

a {
	color: #000;
}

div.three-panels img, div.three-panels div, div.hero-panel div{ 
	behavior: url(script/iepngfix.htc)
}

div.container {
	width: 955px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000;
	margin: auto;
}

	div.container-head {
		background: url(../images/container-bg-head.gif) top center no-repeat;
		width: 100%;
		min-height: 294px;
		height: 294px;
		overflow: visible;
	}
		div.head-content {
			padding: 20px;
		}
		div.head-content .logo {
			float: left;
			margin-top: 50px;
		}
			div.navigation {
				height: 27px;
				margin-top: 38px;
			}
				div.navigation ul {
					height: 27px;
				}
				div.navigation ul li {
					list-style: none;
					float: left;
				}
				div.navigation ul li a {
					height: 25px;
					float: left;
				}
				div.navigation ul li a span {
					display: none;
				}
				
				div.navigation ul li.home-btn a{
					background: url(../images/home-btn.gif) 50% 0px no-repeat;
					padding-right: 53px;
				}
				div.navigation ul li.about-btn a{
					background: url(../images/about-btn.gif) 50% 0px no-repeat;
					padding-right: 69px;
				}
				div.navigation ul li.facilities-btn a{
					background: url(../images/facilities-btn.gif) 50% 0px no-repeat;
					padding-right: 103px;
				}
				div.navigation ul li.functions-btn a{
					background: url(../images/functions-btn.gif) 50% 0px no-repeat;
					padding-right: 84px;
				}
				div.navigation ul li.conferences-btn a{
					background: url(../images/conferences-btn.gif) 50% 0px no-repeat;
					padding-right: 85px;
				}
				div.navigation ul li.gallery-btn a{
					background: url(../images/gallery-btn.gif) 50% 0px no-repeat;
					padding-right: 71px;
				}
				div.navigation ul li.contact-btn a{
					background: url(../images/contact-btn.gif) 50% 0px no-repeat;
					padding-right: 87px;
				}
				div.navigation ul li a:hover,
				div.navigation ul li a.selected{
						background-position: 50% -25px;
				}
		div.side-panel {
			background: url(../images/side-panel.gif) 0 0 no-repeat;
			width: 305px;
			height: 202px;
			position: absolute;
			right: 0;
			top: 0;
			margin-right: 594px;
			margin-top: -92px;
		}
			#index div.side-panel p, div.side-panel p {
				color: #fff;
				padding: 37px 0 0 32px;
				width: 195px;
				line-height: 19px;
			}
			div.side-panel ul {
				padding-top: 7px;
				padding-left: 0;
				width: 198px;
				margin-left: -2px;
			}
			
			div.side-panel ul li {
				list-style: square;
				color: #fff;
				font-size: 10px;
				padding-bottom: 10px;
				margin-left: 15px;
			}
			
				#gallery div.side-panel ul li {
					list-style: none;
					padding-bottom: 5px;
				}
				#gallery div.side-panel ul li a{
					color: #9bc2e2;
					text-decoration: none;
					padding-bottom: 0px;
				}		
				#gallery div.side-panel ul li a:hover,
				#gallery div.side-panel ul li a.selected{
					border-bottom: solid 2px #a4c8e4;
				}
			 
		div.side-panel h3 {
			text-transform: uppercase;
			color: #fff;
			font-size: 13px;
			padding-bottom: 5px;
		}
			div.side-panel div.text {
				padding-top: 30px;
				padding-left: 40px;
			}
			div.side-panel p {
				margin: 0;
				padding: 0;
				font-size: 11px;
				line-height: 16px;
			}
				#gallery div.side-panel p {
					font-size: 10px;
				}
			#function div.side-panel ul,
			#conference div.side-panel ul {
				padding-top: 7px;
				padding-left: 15px;
			}
			
			#function div.side-panel ul li,
			#conference div.side-panel ul li {
				list-style: none;
				color: #fff;
				font-size: 11px;
				font-style: italic;
				padding: 0;
			}
			#function div.side-panel ul li img,
			#conference div.side-panel ul li img {
				vertical-align: middle;
				padding-right: 8px;
			}
			#function div.side-panel ul li span,
			#conference div.side-panel ul li span {
				width: 60px;
				display: inline;
				float: left;
				font-style: normal;
			}
			#function div.side-panel ul li a,
			#conference div.side-panel ul li a {
				color: #fff;
				text-decoration: none;
			}
			
		#index div.hero-panel {
			background: url(../images/hero-panel.jpg) 0 0 no-repeat;
		}
			#index div.hero-panel div#slideshowcontainer{
				margin-left: 25px;
				margin-top: 23px;
			}
		div.hero-panel {
			background: none;
			width: 587px;
			height: 308px;
			padding: 0;
			position: absolute;
			right: 0;
			top: 0;
			margin-top: -209px;
			margin-right: 85px;

		}
			div.hero-panel div.content-head{
				background: url(../images/content-head-bg.png) top center no-repeat;
				width: 100%;
				height: 45px;
			}
			div.hero-panel div.content-body{
				background: url(../images/content-body-bg.png) top center repeat-y;
				width: 100%;
			}
				div.hero-panel div.content-body img {
					margin-left: 29px;
					margin-top: -12px;
					float: left;
					position: relative;
				}
				div.hero-panel div.content-body div.quote {
					font-size: 15px;
					color: #1b75bc;
					width: 150px;
					float: right;
					padding-top: 33px;
					font-style: italic;
					margin-right: 10px;
				}
				div.hero-panel div.content-body div.body-text ul {
					margin-left: 15px;
					width: 300px;
					padding: 10px 0;
				}
				div.hero-panel div.content-body div.body-text ul li {
					font-size: 11px;
					margin-left: 20px;
				}
				div.hero-panel div.content-body div.body-text {
					width: 88%;
					padding-left: 60px;
					padding-top: 20px;
					padding-bottom: 20px;
					clear: both;
				}
					#gallery div.hero-panel div.content-body div.body-text {
						padding-left: 40px;
					}
				div.hero-panel div.content-body div.body-text h2,
				div.hero-panel div.content-body div.body-text h3 {
					color: #1b75bc;
					text-transform: uppercase;
					font-weight: normal;
					font-size: 16px;
					padding-bottom: 5px;
				}
					#function div.hero-panel div.content-body div.body-text h2 {
						background: url(../images/function-heading.gif) top left no-repeat;
						text-indent: -999px;
						padding-right: 89px;
					}
					#contact div.hero-panel div.content-body div.body-text h2 {
						background: url(../images/contact-heading.gif) top left no-repeat;
						text-indent: -999px;
						padding-right: 89px;
					}
					#about div.hero-panel div.content-body div.body-text h2 {
						background: url(../images/aboutus-heading.gif) top left no-repeat;
						text-indent: -999px;
						padding-right: 89px;
					}
					#facilities div.hero-panel div.content-body div.body-text h2 {
						background: url(../images/facilities-heading.gif) top left no-repeat;
						text-indent: -999px;
						padding-right: 89px;
					}
					#conference div.hero-panel div.content-body div.body-text h2 {
						background: url(../images/conference-heading.gif) top left no-repeat;
						text-indent: -999px;
						padding-right: 89px;
					}
						#contact div.hero-panel div.content-body div.body-text h3 {
							background: url(../images/enquiry-heading.gif) top left no-repeat;
							text-indent: -999px;
							padding-right: 89px;
							margin: 20px 0 -10px 0px;
						}
					#gallery div.hero-panel div.content-body div.body-text h2 {
						float: left;
						font-size: 20px;
						margin-top: 35px;
						margin-left: 3px;
						background: url(../images/gallery-heading.gif) top left no-repeat;
						text-indent: -999px;
						width: 90px;
					}
					#gallery div.hero-panel div.content-body div.body-text div#view-gallery a span {
						display: none;
					}
					#gallery div.hero-panel div.content-body div.body-text div#view-gallery a {
						background: url(../images/viewGallery-btn.jpg) 0 0 no-repeat;
						height: 36px;
						padding-right: 89px;
						float: right;
						margin-right: 5px;
						margin-top: 45px;						
					}
					#gallery div.hero-panel div.content-body div.body-text div#view-gallery a:hover {
						background-position: 0 -37px;
					}
				div.hero-panel div.content-body div.body-text h3 {
					font-size: 12px;
					padding-top: 10px;
				}	

				div.hero-panel div.content-body div.body-text p {
					padding-top: 5px;
					padding-bottom: 5px;
					font-size: 11px;
					width: 330px;
				}
					#gallery div.hero-panel div.content-body {
						padding-bottom: 38px;
					}

					#gallery div.hero-panel div.content-body div.body-text p {
						width: 280px;
						margin-left: 133px;
						margin-top: -5px;
						line-height: 16px;	
					}
					#gallery div.hero-panel div.content-body div.body-text p.wide {
						width: 370px;
					}
					#gallery div.hero-panel div.content-body div.body-text ul {
						width: 100%;
						margin: 10px 0 20px 0;
						padding: 0;
					}
						#gallery div.hero-panel div.content-body div.body-text ul li{
							list-style: none;
							float: left;
							margin: 0;
							padding: 0;
						}
						#gallery div.hero-panel div.content-body div.body-text ul li img{ 
							margin: 4px;
							padding: 0;
						}
				div.hero-panel div.content-body div.body-text form fieldset {
					border: none;
				}
				div.hero-panel div.content-body div.body-text label {
					float: left;
					font-size: 11px;
					width: 50px;
					padding-bottom: 10px;
					padding-right: 20px;
					text-align: right;
				}
					div.hero-panel div.content-body div.body-text fieldset.multiple-column label.first,
					div.hero-panel div.content-body div.body-text fieldset.multiple-radio label.first {
						padding-right: 20px;
						padding-left: 0;
						width: 50px;
						text-align: right;
					}				
					div.hero-panel div.content-body div.body-text fieldset.multiple-column label {
						padding-right: 10px;
						width: 50px;
					}
					div.hero-panel div.content-body div.body-text fieldset.multiple-column label#lblPostcode {
						padding-left: 5px;
					}
					div.hero-panel div.content-body div.body-text fieldset.multiple-radio label#lblsport-facilities {
						width: 70px;
					}
					div.hero-panel div.content-body div.body-text fieldset.multiple-radio label {
						padding-right: 11px;
						text-align: left;
						padding-left: 2px;
					}
				div.hero-panel div.content-body div.body-text input {
					width: 260px;
					font-size: 11px;
				}
					div.hero-panel div.content-body div.body-text fieldset.multiple-column input {
						float: left;
						width: 30px;
					}
					div.hero-panel div.content-body div.body-text fieldset.multiple-radio input {
						width: 20px;
						float: left;
						border: solid 1px;
						color: #e5e6e7;
					}
					div.hero-panel div.content-body div.body-text fieldset.multiple-column input.txtWide{
						width: 80px;
						margin-right: -13px;
					}
					div.hero-panel div.content-body div.body-text input#submit {
						width: 58px;
						height: 37px;
						padding: 0;
						margin: 10px 0 -6px 285px;
					}
				div.hero-panel div.content-body div.body-text textarea {
					width: 265px;
				}					
			div.hero-panel div.content-footer{
				background: url(../images/content-footer-bg.png) top center no-repeat;
				width: 100%;
				height: 45px;
			}

	div.container-body {
		background: url(../images/container-bg-body.gif) 0 0 repeat-y;
		padding-left: 50px;
		position: relative;
		height: 500px;
	}
	#index div.container-body {
		background: url(../images/container-bg-body.gif) 0 0 repeat-y;
		padding-left: 50px;
		position: relative;
		height: 370px;
	}

	div.three-panels {
		width: 100%;
		padding-top: 400px;
		position: absolute;
		top: 40px;
		left: 0;
	}
	
	div.contact-panel, div.functions-panel, div.conferences-panel {
		width: 273px;
		float: left;
	}
		
	div.three-panels div.heading {
		background: url(../images/small-panel-head.png) top left no-repeat;
		width: 100%;
		height: 25px;
	}
		div.three-panels img{
			float: left;
			margin-left: -310px;
			margin-top: -30px;
			position: relative;
		}
		
		img#functions-panel-img, img#conferences-panel-img {
			margin-left: -100px;
		}
	
	div.three-panels div.footer {
		background: url(../images/small-panel-footer.png) bottom left no-repeat;
		width: 100%;
		height: 20px;
	}
	
	div.three-panels div.middle {
		background: url(../images/small-panel-body.png) top left repeat-y;
		width: 100%;
	}
	
	div.three-panels p {
		color: #000;
		width: 173px;
		padding: 0 0 0 30px;
		font-size: 11px;
	}
		div.three-panels p span {
			padding: 5px 0 2px 0;
			display: block;
		}
			div.three-panels p span a{
				color: #fff;
			}
		div.three-panels h3 {
			font-size: 12px;
			text-transform: uppercase;
			color: #fff;
			padding: 0 0 0 30px;
		}
		
		div.contact-panel p, div.contact-panel h3 {
			padding-left: 90px;
		}
	div.contact-wrapper {
		position: absolute;
		right: 0;
		top: 160px;
		margin-right: 485px;		
		
	}
	div.functions-wrapper {
		position: absolute;
		right: 0;
		top: 70px;
		margin-right: 280px;	
	}
	div.conferences-wrapper {
		position: absolute;
		right: 0;
		top: 170px;
		margin-right: 60px;				
	}
	div.container-footer {
		background: transparent url(../images/container-bg-footer.gif) 50% 0 no-repeat;
		min-height: 35px;
		height: 35px;
	}
	div#copyright{
		margin-top: 5px;
		text-align: center;
		color: #666666;
		width: 100%;
		position: relative;
		padding-bottom: 35px;
		font-size: 11px;
	}
		div#copyright a{
			color: #666666;
		}
		div#copyright a:hover{
			color: #999999;
		}