/* CSS Document */


/* This is the background to the whole site which appears on either side of the web space */


html {
	background-color: #E0E0E0;
}

/* This * gets rid of all default padding and margins */
* {
	margin: 0px;
	padding: 0px;
}

/* This sets the width of site and centres it in the viewport. It also adds background colour and padding */
body {
	background-repeat: no-repeat;
	width: 950px;
	margin-right: auto;
	margin-left: auto;
	background-color: #FFFFFF;
	padding-right: 10px;
	padding-left: 10px;
	border: 1px solid #666666;
	}
	

/* This is the area at the top with the mcch banner accross */
#header {
	height: 172px;
	margin-bottom: 0px;
	}

#header img {
	border: 0px none;
	margin-left: 80px;
	}

#header img a:link, #header img a:visited, #header img a:hover, #header img a:visited {
	border: 0px none;
}

body,p,li,ul,blockquote,h1,h2,h3,h4,label,legend {
	font-family: Arial, Helvetica, sans-serif;

}

/* Default tag styles for site */
p, li {
	font-size: 1.25em;
	background-color: #FFFFFF;
	}
	
	
p {
	line-height: 1.5em;
	margin-bottom: 0.5em;
	}

li {
	margin-bottom: 0.3em;
	line-height: 1.5em;
	}

ul {
	margin-top: 0.3em;
	margin-bottom: 0.3em;
	margin-left: 3em;
	}

ul.no_indent {
margin-left: 0.95em;
	}

ol {
	margin-top: 0.3em;
	margin-bottom: 0.3em;
	}

ul.pdf {
	margin-left:5em;
	list-style-image: url(../images/pdf-icon.gif);
	}

ul.pdf li {
	margin-bottom: 0.45em;
	line-height: 1.5em;
	}

.rules {
	background-color: #721878;
	padding: 0.2em 0.45em 0.7em;
	border-top-width: 6px;
	border-right-width: 6px;
	border-bottom-width: 6px;
	border-left-width: 6px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #CCCCCC;
	border-right-color: #000000;
	border-bottom-color: #000000;
	border-left-color: #CCCCCC;
}

.rules h2 {
	color:#721878;
	margin-top:0.6em;
	font-size: 1.85em;
	font-weight: bold;
	background-color: #FFFFFF;
	padding: 0.25em;
	border-top: 3px solid #CCCCCC;
	border-right: 3px solid #000000;
	border-bottom: 3px solid #000000;
	border-left: 3px solid #CCCCCC;
	text-transform: uppercase;
}



.rules ul {
	list-style-image: url(../images/wrong_cross.gif);
	padding-left:0.5em;
	padding-top:0.45em;
}
.rules ul li {
	font-size: 1.6em;
	line-height: 1.8em;
	color:white;
	background-color: transparent;
	margin-left:3em;
	}
	
	li.tick {
	list-style-image: url(../images/tick.gif);	
	}



/* Default heading colours, weight and letter spacing */

h1,h2,h3,h4 {
	color:#721878;
	font-weight: bold;
	letter-spacing: -0.03em;
}

/* This sets the text of the main heading to white and the background bright blue */

h1 {
	padding-bottom: 0.5em;
	padding-top: 0.5em;
	padding-left: 0.2em;
	font-size: 2.5em;
	background-color: #0492D0;
	color: #FFFFFF;
	margin-bottom:20px;
	margin-top:4px;
	}
	
h2 {
	padding-bottom: 0.2em;
	font-size: 1.45em;
	margin-top: 1.1em;
	margin-bottom: 0.1em;
	}
	
h3 {
	padding-bottom: 0.25em;
	font-size: 1.30em;
	padding-top: 0.30em;
	margin-top: 0.5em;
	}
	
	h4 {
	padding-bottom: 0.2em;
	font-size: 1.15em;
	padding-top: 0.25em;
	margin-top: 0.4em;
	}
	
a:link, a:visited {
	color:#721878;
	text-decoration: underline;
}

a:hover, a:active {
	color:#0492D0;
	text-decoration: none;
}


/* This is only for the link list and has an image for the bullet style */

ul.linklist li{
	margin-bottom: 15px;
	padding-bottom:10px;
	list-style-image: url(../images/hand-holding-mouse.jpg);
	margin-left: 85px;
	line-height: 2.2em;
}


.linklist li a:link,.linklist li a:visited,.linklist li a:hover,.linklist li a:active
{ display: block; 
}

ul.no_bullets {
	margin-left: 0em;
	padding-left:0;
	list-style: none;
}


	
/* This changes the colour of the border on images when they are links when the mouse hovers over them */
a:hover img, a:active img {
	border: #FF0000;
}

blockquote p {
	font-size: 1.2em;
	line-height: 1.35em;
	color: #721878;;
	text-indent: -0.25em;
	margin-top: 1.5em;
	margin-bottom: 1.5em;
	margin-left: 2.5em;
	margin-right: 5em;
	font-style: italic;
	text-align: justify;
	clear: right;
}

/* Bolded colour for important words and mcch name */
.hilight {
	color: #721878;
	font-weight: bold;
}

.bold_presentational {
font-weight: bold;
}

.superscript {
	font-size: 0.6em;
	vertical-align: super;
}



/* This is the vertical navigation list */

#side_nav {
	margin-top: -1px;
	float: left;
	width: 166px;
	clear:left;
}

#side_nav ul{
	
	padding-top: 0em;
	padding-left: 0px;
	margin-left: 10px;
	}
	
	

#side_nav li{
	display: block;
	font-size: 20px;
	font-weight: bold;
	list-style-type: none;
	padding-left: 1px;
	margin-left: 0px;
	margin-bottom: 6px;
	letter-spacing: -0.05em;
	padding-right: 1px;
	padding-top: 0;
}

#side_nav li a:link, #side_nav li a:visited,#side_nav li a:hover,#side_nav li a:active {
	display: block;
	border:3px solid;
	height:40px;
	text-align: left;
	text-decoration: none;
	color: #FFFFFF;
	padding-top: 8px;
}

#side_nav li a:link, #side_nav li a:visited{
	background-color: #EC7703;
	color: #FFFFFF;
	border-top-color: #CCCCCC;
	border-right-color:#000000;
	border-bottom-color:#000000;
	border-left-color:#CCCCCC;
	}



#side_nav li a:hover {
	background-color: #88C239;
	color: #FFFFFF;
	border-top-color:#000000;
	border-right-color: #CCCCCC;
	border-bottom-color: #CCCCCC;
	border-left-color:#FFFFFF;
		}
		
		
	#side_nav li a:active {
	background-color: #0492D0;
	color: #721878;
	border-color:#721878;
	}
	
	
#side_nav ul li img {
	margin-left: 4px;
	margin-right: 5px;
	border:none;
	float: left;
}





	
	
	/* This is the  navigation list within pages - not left aligned*/

.horiz_nav {
	margin-top: 20px;
	margin-bottom: 10px;
	margin-left: 0px;
	padding-left: 0px;	
}

.horiz_nav ul{
	
	padding-top: 0em;
	padding-left: 0px;
	margin-left: 0px;
	
	}
	
	

.horiz_nav li{
	display: block;
	font-size: 20px;
	font-weight: bold;
	list-style-type: none;
	padding-left: 0px;
	margin-left: 0px;
	margin-right: 30px;
	margin-bottom: 32px;
	letter-spacing: -0.05em;
	padding-top: 0;
	float:left;
	
	
}

.horiz_nav li a:link, .horiz_nav li a:visited,.horiz_nav li a:hover,.horiz_nav li a:active {
	display: block;
	width:143px;
	border:3px solid;
	height:70px;
	text-align: center;
	text-decoration: none;
}

.horiz_nav li a:link, .horiz_nav li a:visited{
	background-color: #88C239;
	color: #FFFFFF;
	border-top-color: #CCCCCC;
	border-right-color:#000000;
	border-bottom-color:#000000;
	border-left-color:#CCCCCC;
	}



.horiz_nav li a:hover {
	background-color: #EC7703;
	color: #FFFFFF;
	border-top-color:#000000;
	border-right-color: #CCCCCC;
	border-bottom-color: #CCCCCC;
	border-left-color:#000000;
		}
		
		
.horiz_nav li a:active {
	background-color: #0492D0;
	color: #721878;
	border-color:#721878;
	}
	
	
	
	


/* These classes add a positioned, non-repeating background image to the vertical navigation */

.nav_news {
background-image: url(../images/news_trans.gif);
background-position:19px 20px;
background-repeat:no-repeat;
}


.nav_events {
background-image: url(../images/calendar.gif);
background-position:19px 21px;
background-repeat:no-repeat;
}


.nav_your_say {
background-image: url(../images/meg_nav.jpg);
background-position:-4px -1px;
background-repeat:no-repeat;

}

.nav_general {
background-image: url(../images/nav_information_sign.gif);
background-position:3px -35px;
background-repeat:no-repeat;

}


/* This is the image file which is a gradient and is positioned at the bottom of the navigation */

#left_nav_bot {
	margin-left: -4px;
	margin-top: 0px;	
}

#content {
	margin-left: 182px;
	padding-top: 0px;
	width:550px;
	margin-top:2px;
		
}


.sidebar_2 {
	margin-top:4px;
	margin-right:4px;
	margin-bottom: 15px;
	float: right;
	width: 174px;
	background-color: #88C239;
	border-top: 3px solid #999999;
	border-right: 3px solid #000000;
	border-bottom: 3px solid #000000;
	border-left: 3px solid #999999;
}




.sidebar_2 h2 {
padding-top:4px;
margin-top:4px;
padding-bottom:4px;
padding-left:4px;
margin-bottom:4px;
color:#fff;
}


.sidebar_2 h3 {
	background: #FFFFFF;
	color: #781c7d;
	margin-top: 18px;
	margin-bottom: 0px;
	margin-left:0px;
	margin-right:0;
	padding-top:2px;
	padding-bottom:2px;
	padding-left:4px;
	font-size: 1.1em;
	border-top: 1px solid #000000;
	border-bottom: 1px solid #000000;
}

.sidebar_2 ul {
	list-style-type: none;
	padding-left:0px;
	margin-left:0;
	margin-bottom:22px;
}

.sidebar_2 li {
	background-color:transparent;
	margin-bottom:2px;
	font-size: 1.1em;
	line-height: 1.35;
	display: inline;
}

.sidebar_2 li a:link, .sidebar_2 li a:visited {
	color: #fff;
	text-decoration: none;
	padding:2px 2px 2px 9px;
	display:block;
	border-bottom: 1px dotted #ddd;
}

.sidebar_2 li a:hover, .sidebar_2 li a:active {
	color: #781c7d;
	background: #fff;
}

.sidebar_2 img {
	background: #FFFFFF;
	padding:1px;
	border-top: 2px solid #999999;
	border-right: 2px solid #000000;
	border-bottom: 2px solid #000000;
	border-left: 2px solid #999999;
	margin-top:10px;
	margin-bottom:10px;
}


/* This is the footer which should clear all content */

#footer {
	clear: both;
	margin-top: 1em;
	padding-top: 0px;
	padding-bottom:3px;
	padding-right: 5px;
	margin-right: -10px;
	margin-left: -10px;
	margin-bottom:20px;
	}
	
	

#footer_banner {
	background-color: #721878;
	margin-left:-1px;
	margin-right:-5px;
	margin-top:5px;
	margin-bottom:5px;
}


#footer p{
	font-size: 0.90em;
	font-weight: normal;
	color: #000000;
	padding-left: 1em;
	padding-top: 0.25em;
	padding-right: 1em;
	background-color: transparent;
}

.logos {
	
	float: right;
	margin-top: 5px;
	margin-left: 22px;
	margin-right:18px;
}

#footer p.smaller {
color: #000000;
font-size: 0.7em;
}

#footer a:link, #footer a:visited {
	color: #000000;
}

#footer a:hover, #footer a:active {
	color: #000000;
}

.w3_icons {
	float: right;
	margin-left: 12px;
	border: 0px none;
	margin-top: -3px;
}

a:hover img.w3, a:active  img.w3 {
	border: 0px none;
}



/* This horizontal navigation is not being used at present */
#hor_nav {
	margin-top: 50px;
	margin-bottom: 0.5em;
	margin-left: 15px;	
}


#hor_nav ul{
	
}


#hor_nav li {
	display: inline;
	margin-right: 3.3em;
	margin-left: 0em;
	padding-right: 0em;
	list-style-type: none;
	font-size: 0.95em;
	font-weight: normal;
	background-color: transparent;
}


#hor_nav a:link, #hor_nav a:visited {
	text-decoration: none;
	color: #FFFFFF;	
}

#hor_nav a:hover, #hor_nav a:active {
	text-decoration: underline;
	}
	

/* This heading has padding and border to divide up items on the news page */
#news h2 {
	padding-top: 11px;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #CCCCCC;
	margin-top: 12px;
}



/* These position and add borders and margins to images */

.photo_right {
	float: right;
	margin-left: 13px;
	border: 1px solid #721878;
	margin-bottom: 10px;
}

.photo_right_no_border {
	float: right;
	margin-left: 13px;
	margin-bottom: 10px;
}

.h1_photo_right {
	clear: right;
	float: right;
	margin-left: 13px;
	margin-bottom: 10px;
	margin-right: 10px;
}



.photo_left {
	clear: left;
	float: left;
	margin-right: 13px;
	border: 1px solid #721878;
	margin-bottom: 10px;
}

.photo_none_caption {
	margin-top: 25px;
	margin-bottom: 35px;
	clear: both;
	
}

.photo_none_caption img {
	padding: 4px;
	border-top: 1px solid #CCCCCC;
	border-right: 1px solid #000000;
	border-bottom: 1px solid #000000;
	border-left: 1px solid #CCCCCC;
	background-color: #F2FFFF;
	}

.photo_none_caption p{
	font-size: 0.85em;
	font-weight: normal;
	text-align: center;
	color: #721878;
	margin-top: 0.1em;
	line-height: 1.15em;
	width:530px;
	}
	
img.contactpage {
	padding: 2px;
	border-top: 1px solid #CCCCCC;
	border-right: 1px solid #000000;
	border-bottom: 1px solid #000000;
	border-left: 1px solid #CCCCCC;
	background-color: #F2FFFF;
	display: block;
	margin-top:8px;
	margin-bottom:8px;
	}
	
.support_gallery {
	margin-top: 15px;
	margin-bottom: 15px;

}
	
.support_gallery img {
	background: #FFFFFF;
	padding: 1px;
	margin-top: 15px;
	margin-right: 13px;
	border-top: 1px solid #999999;
	border-right: 1px solid #000000;
	border-bottom: 1px solid #000000;
	border-left: 1px solid #999999;	
	}
	
	
	
.photo_right_caption {
	margin-top: 15px;
	margin-bottom: 35px;
	margin-left:15px;
	float:right;
	
}

.photo_right_caption img {
	padding: 4px;
	border-top: 1px solid #CCCCCC;
	border-right: 1px solid #000000;
	border-bottom: 1px solid #000000;
	border-left: 1px solid #CCCCCC;
	background-color: #F2FFFF;
	}

.photo_right_caption p{
	font-size: 0.85em;
	font-weight: normal;
	text-align: center;
	color: #721878;
	margin-top: 0.1em;
	line-height: 1.15em;
	width:280px;
	}
	
	
.line_photos {
	float: left;
	width: 174px;
	margin-right: 7px;	
	}
	
.line_photos img {
	padding: 3px;
	border-top: 1px solid #CCCCCC;
	border-right: 1px solid #000000;
	border-bottom: 1px solid #000000;
	border-left: 1px solid #CCCCCC;
	background-color: #F2FFFF;
	width:168px;
	height:109px;	
	}
	
.line_photos p {
	font-size: 0.85em;
	font-weight: normal;
	text-align: center;
	color: #721878;
	margin-top: 0.1em;
	line-height: 1.15em;
	}
	
	
	
	
	
	
.gallery_contain {
	margin-right: -10px;
	width: 560px;
	margin-bottom:30px;
}


	
.gallery {
	margin-top: 10px;
	margin-bottom: 15px;
	float:left;
	margin-right:31px;
	width:150px;
		}

.gallery img {
	padding: 4px;
	border-top: 1px solid #999999;
	border-right: 1px solid #000000;
	border-bottom: 1px solid #000000;
	border-left: 1px solid #999999;
	background-color: #F2FFFF;
	}


.gallery p{
	font-size: 0.9em;
	font-weight: normal;
	text-align: center;
	color: #721878;
	margin-top: -3px;
	line-height: 1.15em;
	background-color: transparent;
	}
	
	.gallery_clear_right {
	clear: right;	
	}
	
	
p.job_role {
	font-size: 0.7em;
	font-weight: bold;
	color: #000000;
	letter-spacing: -0.03em;
	margin-top: -0.25em;
	margin-bottom: 0.1em;
}


.side_box_people {
	float: left;
}

.side_box_people li {
	font-size: 1em;
}

.side_box_people h2 {
margin-top:0.2em;
}



.caption_right {
	width: 185px;
	clear: right;
	float: right;
	margin-left: 15px;
	margin-bottom: 10px;
	margin-right: 10px;
}

.caption_right img {
	padding: 4px;
	border-top: 1px solid #CCCCCC;
	border-right: 1px solid #000000;
	border-bottom: 1px solid #000000;
	border-left: 1px solid #CCCCCC;
}

.caption_right p {
	font-size: 0.85em;
	font-weight: normal;
	text-align: center;
	color:#721878;
	margin-top: 0.1em;
	line-height: 1.15em;
}

pull_box {
	background-color: #EBB7EE;
	padding: 15px;
	margin-top: 0.7em;
	margin-bottom: 1.2em;
	color: #000000;
	font-weight: bold;
	border: 1px solid #999999;
	}
	
	/* This is an additional box which tucks underneath the vertical navigation */

.left_box_under_nav {
	background-color: #EC7703;
	width: 125px;
	clear: left;
	padding: 5px;
	margin-left: 10px;
	font-weight: bold;
	margin-top: 1.5em;
	margin-bottom: 1.0em;
	border-top: 1px solid #000000;
	border-right: 1px solid #000000;
	border-bottom: 4px solid #000000;
	border-left: 1px solid #000000;
}

.left_box_under_nav p {
	font-weight: bold;
	background-color: transparent;
	color: #FFFFFF;
}

.left_box_under_nav a:link, .left_box_under_nav a:visited {
	color: #FFFFFF;
	text-decoration: underline;
}

.left_box_under_nav a:hover, .left_box_under_nav a:active {
	color: #000000;
	text-decoration: none;
}



/* This is an additional box which goes on the right of the page */

.right_box {
	background-color: #EC7703;
	float: right;
	width: 140px;
	padding: 5px;
	margin-left: 30px;
	border-top: 1px solid #000000;
	border-right: 1px solid #000000;
	border-bottom: 4px solid #000000;
	border-left: 1px solid #000000;
	margin-bottom: 10px;
	}

.right_box p {
	font-weight: bold;
	background-color: transparent;
	color: #FFFFFF;
}

.right_box a:link, .right_box a:visited {
	color: #FFFFFF;
	text-decoration: underline;
}

.right_box a:hover, .right_box a:active {
	color: #000000;
	text-decoration: none;
}

/* Feint grey text for mb, kb etc */
.data {
	color: #999999;
	font-weight: normal;
}


a.nav_how_to {
	position: relative;
	bottom: 0px;
}


/* Brings phone, faxr, computer icons closer to text - constrains width */
#constrain_contact {
	width: 455px;
}

#constrain_contact h2 {
	padding-top: 0.8em;
	padding-bottom: 0.5em;
	margin-top: 0.95em;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #721878;
	font-size: 1.3em;
	letter-spacing: -0.03em;
}



/* Adds space, border etc to maps and formats p text as captions in div */

#maps
{
	margin-top: 10px;
	margin-bottom: 10px;
}


#maps img {
	padding: 1px;
	border-top-width: 2px;
	border-right-width: 2px;
	border-bottom-width: 2px;
	border-left-width: 2px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #CCCCCC;
	border-right-color: #000000;
	border-bottom-color: #000000;
	border-left-color: #999999;
	margin-top: 17px;
}

#maps p {
	text-align: center;
	margin-top: -4px;
	font-size: 0.9em;
	color: #333333;
	font-weight: bold;
	background-color: transparent;
}



/* This styes the Google search box - of limited use at the moment */

#search
{
	float: right;
	margin-bottom:3px;
	margin-top:0px;
	clear:both;
	width:253px;
	
}

#search form {
margin-bottom:10px;

}

#search fieldset {
	border: none;
	background-color: transparent;
}

#search_results {
	width: 400px;
	background-color: transparent;
}

#white {
	background-color: #FFFFFF;
}

#search_white {
	border: none;
}


#below_search {
clear:both;
}


/* This styles the form - specifically the login form */

legend {
	
	font-size: 1.7em;
	color:#721878;
}

label
{
	
	font-weight: bold;
}


input {
	background-color: #FFFFCC;
	border: 1px solid #721878;
}


fieldset {
	border: 1px solid #721878;
	padding: 5px;
	background-color: #CCFFFF;
	
}


fieldset p{
	background-color: #CCFFFF;
	}
	
	
form
	{
	width: 480px;
	}
	
	
.float {
	margin-left: 13px;
	height:28px;
		}



#content_nav {
	
	
}

#content_nav ul{
	
	padding-top: 0em;
	padding-left: 0px;
	width:100%;
	margin-bottom:25px;
		}
	
	

#content_nav li{
	width: 143px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 20px;
	font-weight: bold;
	list-style-type: none;
	padding-left: 1px;
	margin-left: 0px;
	letter-spacing: -0.05em;
	padding-right: 1px;
	padding-top: 0;
	float: left;
	margin-right: 60px;
	clear: none;
}




#content_nav li a:link, #content_nav li a:visited{
	display: block;
	background-color: #EC7703;
	color: #FFFFFF;
	text-decoration: none;
	border-top: 3px solid #CCCCCC;
	border-right: 3px solid #000000;
	border-bottom: 4px solid #000000;
	border-left: 3px solid #CCCCCC;
	height:70px;
	text-align: center;
	}



#content_nav li a:hover {
	display: block;
	background-color: #88C239;
	color: #000000;
	text-decoration: none;
	border-top: solid #000000;
	border-right: solid #CCCCCC;
	border-bottom: solid #CCCCCC;
	border-left: solid #000000;
		}
		
		
	#content_nav li a:active {
	background-color: #0492D0;
	color: #FFFFFF;
	border: #721878;
	}
	
	
	.clear {
	clear:both;
	}
	
	
	.how_to img {
	float: right;
	margin-bottom: 10px;
	margin-left: 16px;
	border:none;
	margin-bottom:26px;	
	}
	
	.how_to li {
	clear:right;
	list-style: none;
	}
	
	
#video {
	padding:0px;
	margin-top: 15px;
	margin-bottom: 10px;
	margin-left: 0px;
}
	
