/******************************************************/
/*                                                    */
/* stylesheet for Harrow & Hillingdon Circuit website */
/* created January 2013 by P Walsh                    */
/*                                                    */
/******************************************************/

body {	
	background-color:white;
	font-family:"verdana";
	color:black;
	}

/*------------------------------------------------------*/
/* changes the text colour and background around a link */
/* to dark and light blue respectively when the link    */
/* has focus - highlights where the user has tabbed to  */
/*------------------------------------------------------*/

a:active, 
a:focus{
	background-color:#99CCFF ;
	color:#333333 ;
	}

/*****************************************************/
/*                                                   */
/* wrapper defines the size of the whole page        */
/*                                                   */
/*****************************************************/

#wrapper { width:95%; align:center;	}

/*****************************************************/
/*                                                   */
/* header area contains accessibility links for page */
/*                                                   */
/*****************************************************/

#access {}

#access ul { list-style-type: none;}

/*----------------------------------------------------------------------*/
/* floating the list items left ensures list is in same order as in html */
/*----------------------------------------------------------------------*/
#access li { float: left; margin-right:10;}

#access a {	display: block;	color: #B41E28;}

#access a:hover {color: black; 	}
	
#access a.focus {font-weight: bold; }

/*****************************************************/
/*                                                   */
/* banner area contains banner pic and text          */		
/*                                                   */
/*****************************************************/

#banner {
	text-align:center;
	padding-right:25%;
	padding-top:2px;
	padding-bottom:5px;
 	background-color:#B41E28;
	}

#banner h1 { 
/*	color:#B41E28; */
	color:#FFFFCC;
	font-family:"arial"; 
	margin:0;
	}
	
#banner img {
	margin:10px;
	border-color:#B41E28;
	border-style:solid;
	border-width:2;
	}

/*****************************************************/
/*                                                   */
/* navigation area contains menu items               */
/*                                                   */
/*****************************************************/

#navigation {
	padding:5px 10px;
	margin-bottom:30px;
	}

#navigation ul {margin-left:15%; list-style-type: none;}

#navigation.sub	ul {margin-left:40%; list-style-type: none;}

#navigation li {
		float: left;
		margin-right:1;
		font-weight:bold;
	}
#navigation a { 
	text-decoration:none;
	display:block; 
	background-color:#B41E28; 
	color:#FFFFCC; 
	padding:5;
	}

#navigation a:hover{ display:block; background-color:#FFFFCC; color:#B41E28;	font-weight: bold;}
#navigation a:active, 
#navigation a:focus{
	background-color:#99CCFF ;
	color:#333333 ;
	}


#content {
	float:left;
	width:50%;
	margin-left:5%;
	padding:10px;
	background:#FFFFCC;
	border-style:double;
	border-color:#B41E28;
	border-width:4px;
	}

#content.sub {
	float:center;
	width:50%;
	margin-left:25%;
	padding:10px;
	background:#FFFFFF;
	border-style:double;
	border-color:#B41E28;
	border-width:4px;
	}

#content h2 {color:#B41E28;}
/*--------------------------------------------------*/
/* this is used on the churches page to lay out the */
/* list of churches                                 */
/*--------------------------------------------------*/
#content li { list-style:none; }

#content tr { text-align:center; }

/*---------------------------------------------------*/
/* this is used on the churches page to add a border */
/* around each image and spce before the text link   */
/*---------------------------------------------------*/
#content img { 
	margin-right:10px; 
	border-style:solid;
	border-color:#B41E28;
	border-width:2px;
	width:80px; height:80px;
}

/*---------------------------------------------------*/
/* this is used for lower level pages on the site */
/*---------------------------------------------------*/
#content2 {
	float:left;
	width:60%;
	margin-left:5%;
	padding:10px;
	background:#FFFFCC;
	border-style:double;
	border-color:#B41E28;
	border-width:4px;
	}

#content2 h2 {color:#B41E28;}


#content2 tr { text-align:center; }

#sidebar2 {
	float:left;
	width:20%;
	margin-left:5%;
	padding:10px;
	background:#FFFFCC;
	border-style:double;
	border-color:#B41E28;
	border-width:4px;
	}

/*---------------------------------------------------*/
/* this is used on the home page to add a cross as   */
/* the bullet for the list within the content div    */
/*---------------------------------------------------*/

#aims li { list-style-image:url(images/cross.png); }

/*---------------------------------------------------*/
/* this is used on the news page to add a star as    */
/* the bullet for the list within the content div    */
/*---------------------------------------------------*/

#news li { list-style-image:url(images/star.png); }
#news h4 { color:#1F497D; }

h2 { margin:0 0 1em;}

#sidebar {
	float:left;
	width:30%;
	margin-left:5%;
	padding:10px;
	background:#FFFFCC;
	border-style:double;
	border-color:#B41E28;
	border-width:4px;
	}

#sidebar li { list-style:none; }

#footer {
	text-align:center;
	clear:both;
	color:#FFFFCC;
	padding:5px 10px;
	background:#B41E28;
	}