/* - - - - - - - - - - - - - - - - - - - - - - - -

Title		: Wolverhampton Grammar Junior School
Author		: Michael Baker
URL 		: www.m3communications.com

Created 	: July 12, 2010
Modified	: n/a

- - - - - - - - - - - - - - - - - - - - - - - - */

/* !--- GLOBAL --- */

* {	margin:0px; padding:0px; }

html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote, pre, form, fieldset, table, th, td { margin: 0; padding: 0; }

body {
	font-family: Garamond, Georgia, serif;
	font-size: 62.5%;
}

:focus, :active { outline: 0; }

.clear { clear:both; }

a img { border:0px; }

.fixed:after {
	clear:both;
	content:"."; 
	display:block; 
	height:0; 
	visibility:hidden;
}

.fixed { display:block; }

/*  \*/
.fixed { min-height:1%; }

* html .fixed {	height:1%; }

/*--- Font Size (em) Bug Fixing for IE ---*/

H1 {font-size:2em}  /* displayed at 24px */
H2 {font-size:1.5em}  /* displayed at 18px */
H3 {font-size:1.25em}  /* displayed at 15px */
H4 {font-size:1em}  /* displayed at 12px */
INPUT, TEXTAREA, SELECT, TH, TD {font-size:1em}
LI LI, LI P, TD P, BLOCKQUOTE P {font-size:1em}

/* !--- WRAPPER --- */

#wrapper {
	border-bottom: 14px solid #887a67;
	border-top: 60px solid #887a67;
	margin: 0px auto;
	width: 960px;
}

/* !--- HEADER --- */

#header {	
	padding: 22px 0px 18px 35px;
}

	#header h1 a {
		background: url(../images/wgjs.gif) no-repeat;
		display: block;
		float: left;
		height: 40px;
		overflow: hidden;
		text-indent: -9999px;
		width: 240px;
	}
	
	#header ul {
		float: right;
		list-style: none;
		margin-top: 18px;
	}
	
		#header ul li {
			border-right: 1px solid #ed1d24;
			float: left;
			font-family: "Gill Sans", Tahoma, sans-serif;
			font-size: 1.3em;
			padding: 1px 14px;
			position: relative;	
		}
		
			#header ul li.contact { border-right: none; padding: 1px 0px 1px 14px; }
		
			#header ul li a {
				color: #333;
				text-decoration: none;
			}
			
			#header ul li a:hover { color: #ed1d24; }
			
#home #header li.home a, #philosophy #header li.philosophy a, #gallery #header li.gallery a, #school #header li.school a, #faq #header li.faq a, #reg #header li.reg a { color: #ed1d24; }

#header ul li ul {
	background-color: #fff;	
	display:none;
	height: auto;
	float: none;
	list-style: none;
	margin: 0px;
	opacity:0;
	padding: 0px;
	position:absolute;	
	top: 16px;
	width:135px; 
}

#header ul li ul.left { left: 0; }
#header ul li ul.right { right: 0; }

	#header ul li ul li {
		background:none;
		border-bottom: 1px solid #ccc;
		border-right: none;
		float:none;		
		font-size: 1em;
		margin:0;
		padding: 0px;
		position:relative;
	}
	
		#header ul li ul li a {
			display: block;
			padding: 5px 6px;
		}
		
		#header ul li ul li a:hover { color: #ed1d24 !important; }
	
#home #header li.home ul li a, #philosophy #header li.philosophy ul li a, #school #header li.school ul li a, #faq #header li.faq ul li a,
#contact #header li.contact ul li a, #reg #header li.reg ul li a { 
	color: #333;
}
		
/* !--- CONTENT --- */

#container { border-bottom: 2px solid #fff; }	

#content p a {
	color: #ed1d24;
	text-decoration: none;
}

	#content p a:hover { text-decoration: underline; }
	
/* !--- CONTENT - HOME --- */

#home #container { background: url(../images/bg_home.gif) repeat-y; }

#home #content_left {
	float: left;
	margin-right: 2px;
	width: 700px;
}

	#home #content_left .main_img { display: block; }

#home #content {
	background-color: #d1d8ab;
	border-top: 2px solid #fff;	
	padding: 20px 32px;	
}

	#home #content h2 {
		color: #C41230;
		font-family: "Gill Sans", Tahoma, sans-serif;
		font-size: 2.4em;
		font-weight: normal;
		margin-bottom: 0.5em;
	}

	#home #content p {
		color: #8A7967;
		font-size: 1.4em;
		line-height:1.5;
		margin-bottom: 1.5em;
	}			

#home #news {
	background-color: #d1d8ab;
	float: left;
	padding: 8px 14px;
	width: 230px;	/* 258px */
}

	#home #news h2 {
		color: #C41230;
		font-family: "Gill Sans", Tahoma, sans-serif;
		font-size: 2em;
		font-weight: normal;
		margin-bottom: 0.8em;
	}
	
	#home #news img {
		float: right;
		margin: 0px 0px 6px 8px;
	}
	
	#home #news p {
		border-bottom: 1px dashed #887a67;
		color: #8A7967;
		font-size: 1.4em;
		line-height:1.3;
		margin-bottom: 1.2em;
		padding-bottom: 1.2em;
	}
	
		#home #news p a {
			color: #C41230;
			display: block;
			font-weight: bold;
		}
		
		#home #news p a:hover { color: #333; }
		
/* !--- CONTENT - PHILOSOPHY --- */

#philosophy #content_left {
	float: left;
	margin-right: 2px;
	width: 458px;
}

	#philosophy #content_left .img_large 	{ display: block; margin-bottom: 2px; }
	#philosophy #content_left .img_left 	{ display: block; float: left; margin-right: 2px; }
	#philosophy #content_left .img_right 	{ display: block; float: left; }

#philosophy #content {
	background-color: #d1d8ab;
	float: left;
	height: 362px;	/* 402px */
	overflow: auto;
	padding: 20px;
	width: 460px;	/* 500px */
}

	#philosophy #content h2 {
		color: #887a67;
		font-family: "Gill Sans", Tahoma, sans-serif;
		font-size: 2.4em;
		font-weight: normal;
		margin-bottom: 0.8em;
	}

	#philosophy #content p {
		color: #8A7967;
		font-size: 1.4em;
		line-height:1.5;
		margin-bottom: 1.5em;
	}

/* !--- CONTENT - GALLERY --- */

#gallery #content {
	background-color: #B5D2E2;
	float: left;
	height: 362px;	/* 402px */
	overflow: auto;
	padding: 20px;
	width: 460px;	/* 500px */
}

	#gallery #content h2 {
		color: #887a67;
		font-family: "Gill Sans", Tahoma, sans-serif;
		font-size: 2.4em;
		font-weight: normal;
		margin-bottom: 0.8em;
	}

	#gallery #content p {
		color: #8A7967;
		font-size: 1.4em;
		line-height:1.5;
		margin-bottom: 1.5em;
	}
	
	#gallery #content #gallery_overview { list-style: none; }

	#gallery #content #gallery_overview li {
		float: left;
		margin: 0px 3px 10px;
		text-align: center;
	}
	
		#gallery #content #gallery_overview li a {
			color: #8A7967;
			font-size: 1.4em;
			text-decoration: none;
		}
		
		#gallery #content #gallery_overview li a:hover { color: #ed1d24;	}
		
			#gallery #content #gallery_overview li a img { border: 2px solid #fff; }
			
			#gallery #content #gallery_overview li a:hover img { border-color: #ed1d24;	}
	
#gallery #content_right {
	float: left;
	margin-left: 2px;
	width: 458px;
}

	#gallery #content_right .img_large 	{ display: block; margin-bottom: 2px; }
	#gallery #content_right .img_left 	{ display: block; float: left; margin-right: 2px; }
	#gallery #content_right .img_right 	{ display: block; float: left; }
	
/* !--- CONTENT - THE SCHOOL --- */

#school #content {
	background-color: #B5D2E2;
	float: left;
	height: 362px;	/* 402px */
	overflow: auto;
	padding: 20px;
	width: 460px;	/* 500px */
}

	#school #content h2 {
		color: #887a67;
		font-family: "Gill Sans", Tahoma, sans-serif;
		font-size: 2.4em;
		font-weight: normal;
		margin-bottom: 0.8em;
	}

	#school #content p {
		color: #8A7967;
		font-size: 1.4em;
		line-height:1.5;
		margin-bottom: 1.5em;
	}
	
#school #content_right {
	float: left;
	margin-left: 2px;
	width: 458px;
}

	#school #content_right .img_large 	{ display: block; margin-bottom: 2px; }
	#school #content_right .img_left 	{ display: block; float: left; margin-right: 2px; }
	#school #content_right .img_right 	{ display: block; float: left; }
		
/* !--- CONTENT - FAQ --- */

#faq #content_left {
	float: left;
	margin-right: 2px;
	width: 258px;
}

#faq #content {
	background-color: #B5D2E2;
	float: left;
	height: 500px;	/* 540px */
	overflow: auto;
	padding: 20px;
	width: 660px;	/* 700px */
}

	#faq #content h2 {
		color: #887a67;
		font-family: "Gill Sans", Tahoma, sans-serif;
		font-size: 2.4em;
		font-weight: normal;
		margin-bottom: 0.8em;
	}

	#faq #content p {
		color: #8A7967;
		font-size: 1.4em;
		line-height:1.5;
		margin-bottom: 1.5em;
	}
	
/* !--- CONTENT - REGISTRATION --- */

#reg #content {
	background-color: #d1d8ab;
	float: left;
	height: 500px;	/* 540px */
	overflow: auto;
	padding: 20px;
	width: 660px;	/* 700px */
}

	#reg #content h2 {
		color: #887a67;
		font-family: "Gill Sans", Tahoma, sans-serif;
		font-size: 2.4em;
		font-weight: normal;
		margin-bottom: 0.8em;
	}

	#reg #content p {
		color: #8A7967;
		font-size: 1.4em;
		line-height:1.5;
		margin-bottom: 1.5em;
	}
	
	#reg #content #frm_registration { font-size: 1.4em;	}
	
		#reg #content #frm_registration label {
			color: #8A7967;
			display: block;	
			float: left;
			margin: 4px 0px 10px;
			padding-right:10px;
			text-align:right;
			width: 140px;
		}
		
		#reg #content #frm_registration input[type="hidden"] { display:none; }
		
		#reg #content #frm_registration input.text {
			border:1px solid;
			border-color:#7c7c7c #c3c3c3 #dddddd;
			display: block;	
			float: left;
			margin: 0px 0px 10px;
			padding: 4px;
			width: 200px;	
		}
		
			#reg #content #frm_registration input.text:focus { border-color: #887a67; }
			
		#reg #content #frm_registration textarea {
			border:1px solid;
			border-color:#7c7c7c #c3c3c3 #dddddd;
			display: block;
			float: left;
			margin: 0px 0px 10px;
			padding: 4px;
		}
		
			#reg #content #frm_registration textarea:focus { border-color: #887a67; }
		
		#reg #content #frm_registration br { clear: left; }
	
#reg #content_right {
	float: left;
	margin-left: 2px;
	width: 258px;
}

/* !--- CONTENT - FOOTER --- */

#footer {
	margin: 10px auto;
	width: 960px;
}

	#footer p {
		color: #999;
		font-size: 1.1em;
		text-align: center
	}
	
		#footer p a { color: #8A7967; }