/* Generic stylesheet by Brian Leach. Adapt for individual sites. */
/* body background give a colour for the border area. Light is F7F7F7, darker use eeeeee. */
/* font colors: black or 666 for that nice designer grey */
/* Font selection should cover most of the bases..  */
/* Lucida Grande for the Macs, Tahoma for the PCs */

   body {
      background-color: #F7F7F7;
	  font-family: Lucida Grande, Tahoma, Arial, Helvetica, Geneva, sans-serif; 
	  font-size: 12px;
	  line-height: 1.6em;
	  color: #666;
   }
   td {
/*	border: 1px #C0C0C0 solid; */
	font-family: Lucida Grande, Tahoma, Arial, Helvetica, Geneva, sans-serif;
	font-size: 12px;
	line-height: 1.6em;
	color: #666;
}

/* -------------------------------    CONTAINER SECTION -----------------------------*/	
/* container - main centred area. Select fixed width or percentage and a full frame (manhatten) or left and right borders (oswd) */

		#container {
  		    border: 1px solid silver; 
			width: 750px;
			margin-right: auto;
			margin-left: auto;
			background: white;
			padding-top: 10px;
			padding-right: 10px;
			padding-left: 10px;			
		}

/* -------------------------------    GENERAL SECTION -----------------------------*/			
/* General settings. These will be overridden for specific sections below.. */
/* light brown titles are #CC6633                                           */
		
		h1 {
	  		font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	  		font-weight: normal;
	  		font-size: 24px;
	  		color: #6DA6E2;
	  		margin-bottom:30px;
	  		background-color: #FFFFFF;
	  }		
		h2 {
			color: #666666;
			font-size: 16px;
			font-family: Arial, Helvetica, sans-serif;
			background-color: #FFF;
		}
		
		h3 {
			color: #6DA6E2;
			font-size: 14px;
			font-family: Arial, Helvetica, sans-serif;
			background-color: #FFF;
		}

		
		a {
			color:#6DA6E2;
			text-decoration: none;
		}

		a:hover {
			color:#6DA6E2;
			background-color: #F5F5F5;
		}
		
		input {
			background-color: #FFF;
			color: #999999;
			border: 1px solid #CCC;
			font-size: 11px;
			padding: 3px;
		}
		
		.button {
			padding: 2px;
		}
		
/* -------------------------------    TITLE SECTION -----------------------------*/		

		#banner {
			
			padding-top: 0px;
			padding-bottom:0px;
			clear: both;
			width: 750px;
			background-image:url("bfl_banner.jpg");
			background-repeat:no-repeat;
			background-position: left top;
			height: 75px
		}
		#banner h1 {
			padding-top: 40px;
			margin-bottom:0px;
			padding-left:5px;
			padding-right:5px;
			color: white;
			float:right;
			line-height:normal;
			background-color: #F5e37a; 
			background-style:transparent;
			font-size:32px;
		}

/* yes, this used to be an H1 until Firefox screwed it up.. */
		#banner_h1 {
		    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
			height:75px;
			text-align:right;
			margin-bottom:0px;
			padding-left:5px;
			padding-right:5px;
			padding-bottom:0px;
			padding-top:0px;
			color: white;
			float:right;
			line-height:normal;
			background-color: #F5e37a; 
			background-style:transparent;
			font-size:32px;
		}
/* Title Container. */

		#title_container {
			
			padding-top: 10px;
			clear: both;
			margin-bottom: 5px;
			border-bottom: 1px solid #6DA6E2;
		}
		
	    /* main title - remember this inherits from the H1 above..*/	
	    #title_container h1 {
	       margin-top: 10px;
	       font-size: 32px;
	       text-align:right;
	    }

		/* the slogan - this may be inset by margin-left. The margin-top pushes it up under the main header. */
		#title_container p { 
			margin-top: -20px;
			margin-left: 30px;
			color: #999999;
			text-align:right;
		}
		
		/* form in the header ... e.g. for searching */
		#title_container form {
			float:right;
			margin-top: -45px;
			font-size: 9px;
		}

/* -------------------------------    LEFT SIDEBAR SECTION -----------------------------*/
#tabs10 {
      float:left;
      width:750px;
      font-size:93%;
	  padding-bottom: 1px;
/*	  border-bottom:4px solid #2763A5; */
      line-height:normal;
      background-image:url("summerStripe.gif");
	  background-repeat:repeat-x;
	  background-position:bottom left;
      
      }
    #tabs10 ul {
	  margin:0;
	  padding:5px 0px 0 50px;
	  list-style:none;
      }
    #tabs10 li {
      display:inline;
      margin:0;
      padding:0;
      }
    #tabs10 a {
      float:left;
      background:url("tableft10.gif") no-repeat left top;
      margin:0;
      padding:0 0 0 4px;
      text-decoration:none;
      }
    #tabs10 a span {
      float:left;
      display:block;
      background:url("tabright10.gif") no-repeat right top;
      padding:5px 15px 4px 6px;
      color:#FFF;
      }
    #tabs10 a span {
	  float:none;
	  }
    #tabs10 a:hover {
      background-position:0% -42px;
      }
    #tabs10 a:hover span {
      background-position:100% -42px;
      }
/* -------------------------------    LEFT SIDEBAR SECTION -----------------------------*/	

/* Navigation area. Set the width in here */
      #navigation {
      	float: left;
		width: 140px;
		border-right: 1px solid #6DA6E2;      
      }
      
/* Navigation headers */
      #navigation h1 {
        font-size:18px;
        color: gray;
        border-bottom: 1px solid #CCC;
      }    
      
      #navigation h2 {
        font-size:14px;
        color: gray;
        border-bottom: 1px solid #CCC;
      }    
      
/* Navigation list elements. I could set the border on the ul element, but this defers it to the anchor.. */
/* the result is an in-set and the ability to set the background hover colour #CC6714 */
/* Set the color in the a:link section and the hover colour in the a:hover            */
/* NOTE that the arrow is set using the URL(arrow.gif) below. If not present, this wipes the navigation */
	  
      #navigation ul {
			margin-left: 0;
			padding-left: 0;
			list-style-type: none;						
	  }

	  #navigation a {
			display: block;
			
			width: 140px;
			border-bottom: 1px solid #CCC;
		}

		#navigation a:link, #navlist a:visited {
			color:#6DA6E2;
			text-decoration: none;
		}
		
		#navigation a:hover {
			background: #000000 url(arrow2.jpg) 96% 50% no-repeat;
			color:#CC6714;
			background-color: #F5F5F5;
			color:gray;
		}
		
/* blockquote used to highlight a useful section in the navigation  */

        #navigation blockquote {		
			margin-top: 5px;
			margin-left: 0;
			margin-right: 0;
			padding: 0;
			border-bottom: 1px dotted #CCC;
		}

/* Paragraph text in navigation with solid borders. The large margin-top gives an area for the top bar. */

		#navigation p {
			margin-top: 40px;
			padding: 1px;
			border-bottom: 1px solid #CCC;
			border-top: 1px solid #CCC;
		}

/* Navigation area for for e.g. login boxes    */		
		#navigation form {
			margin-top: 40px;
			padding: 5px;
			border-bottom: 1px dotted #CCC;
			border-top: 1px dotted #CCC;
			float:none;
			font-size:11px;
		}

/* -------------------------------    CONTENT AREA  -----------------------------*/
/* This can be adapted to a two or three column layout.                          */
/* For a three column layout use sidebar and content (sidebar must appear first).*/
/* For a two column layout use Main                                              */
/* Due to an IE bug, set the main margin-left to the width of the left sidebar   */
/* Finally use large for a single area                                           */
		
/* Content and side bar for a three column layout */

		#content {
			width: 362px;
			margin-left: 180px;
			margin-right: 200px;
		}
		
		#content p {
			padding-bottom: 10px;
			border-bottom: 1px solid #DDDDDD; /* A faint grey line below the text */
		}

		#sidebar {
			float: right;
			width: 175px;
			border-left: 1px solid gray;
			padding: 5px;
		}
		
		#sidebar p {
			padding-bottom: 10px;
			border-bottom: 1px solid #DDDDDD;
		}

/* Main for a two column layout */

		#main {
	
	width: 550px;
	margin-left: 180px;
}
		
		#main p {
			padding-bottom: 10px;
			border-bottom: 1px solid #DDDDDD; /* A faint grey line below the text */
		}
	
/* Large for a single column layout */

		#large {
			width: 730px;					
		}
		
		#large p {
			padding-bottom: 10px;
			border-bottom: 1px solid #DDDDDD; /* A faint grey line below the text */
		}

/* Plain for a layout with no underlining*/

		#plain {
			width: 730px;					
		}
		
		#plain p {
			padding-bottom: 10px;
		}
	

/* This for a cleaner right and centre  */
        #right_container {
        	width: 175px;
        	float:right;
        	border-left: 1px solid gray;
        	padding: 5px;        
        }

		#centre_container {
			padding: 5px;
			border-left: 1px solid gray;
			margin-left:150px;
		}      
/* FOOTER ELEMENTS */

		#footer {
			border-top: 1px solid #6Da6e2;
			margin-top: 5px;
			clear: both;
			padding: 0px 5px 0px 5px;
			text-align: right;
		}
				
		#footer a {
			color: #89817f;
			border-bottom: 1px dotted #89817f;
		}
		
		#footer a:hover {
			color: #FFFFFF;
			background-color:#575352;
		}
		
		/* That's all folks */