/* fairtrade.css

STYLE SHEET FOR the Gillingham Fair Trade WEB SITE
Created by Teresa Goatham
www.gillinghamfairtrade.org.uk

ToC

	1. defaults
	2. structure
	3. links and navigation
	4. fonts
	5. images
	
Notes

*/

/* --------- 1. defaults  --------- */ 
body {	/* background: #6294C5 url(http://www.gillinghamanglican.org.uk/ct_in_g/images/backgrd2500.jpg) repeat-x; */
		width: 100%;
		font-style: arial,helvetica,clean,sans-serif;
		background-color: #211207; /* #41240F; */	/* also used for footer */
		color: #464646;				
		vertical-align: top;
		margin: 0px auto;
	} 
	
.setWidth	{	width: 990px;
				margin: 0px auto;
			}	
		
  
.clearboth		{	clear: both; 	}
.clearleft		{	clear: left; 	}
.clearright		{	clear: right; 	}

#header	{ background-color: #000000;
		color: #fff;
		width: 990px; 
		border: 0;
		padding: 0;
		margin: 0px auto;
		margin-bottom: 20px;
		}
.heading	{	width: 720px;
				float: left;
				background-image: url(/images/gill-fields.jpg);
				background-repeat: no-repeat;
				margin: 0px;
				padding: 0px;
			}
			
.sub-head	{	margin-top: 150px;						
			}
.sub-head h4	{	color: white; text-align: center;	}
			
.divider1, .divider2, .divider3
		 { width: 90%;			 
			margin: auto; margin-bottom: 15px; padding: 0; border: 0; 
			border-bottom: 7px double #25A2FF; /* should be #00CCFF; to be as logo but I think this is better on the website */	  /* try #1E90FF AA lge */	
		}			
.divider2 { border-bottom-color: #B3DC1F; 
		}
.divider3 { border-bottom-color: #ffcc00;
		}

.divBox1, .divBox2, .divBox3, .divBox4
			{	width: 415px;
				background-color: #fff;
				margin: 20px 0px 20px 30px;
				padding: 5px;
				border: 12px double;
				overflow: auto; 
			}
.divBox4	{	background-color: #000;
				border: 12px solid black;
			} 			
				
.mainDiv1, .mainDiv2, .mainDiv3
			{	width: 624px;
				/* height: 500px; */
				background-color: #fff;
				margin: 20px 5px 20px 7px;
				padding: 10px;
				float: left;
				border: 12px double;
			}
.mainDiv1.full-page, .mainDiv2.full-page, .mainDiv3.full-page
			{	width: 900px;
			}
				
.divBox1, .mainDiv1	{	border-color: #25A2FF; 	 /* blue */
			}
.divBox2, .mainDiv2	{	border-color: #B3DC1F;	 /* green */
			}
.divBox3, .mainDiv3	{	border-color: #ffcc00;	/* brown - was #E2004A */	  
			}

.back1	{ 	background-color: #25A2FF;	 
			color: #fff;
		}

.back2	{ 	background-color: #B3DC1F;
			color: #fff;
		}

.back3	{ 	background-color: #ffcc00;
			color: #fff;
		}															

#active a { border-left: 1px solid #fff; }
  
#page {	background-color: #000;
		width: 990px; 
		border: 0;
		border-top-width: 7px; 
		padding: 20px 0 0 0;
		margin: 0px auto;
	}

#menucontainer1, #menucontainer2, #menucontainer3
				{	background-color: #B3DC1F;
					width: 100%;
					border: 0px; padding: 0px; margin: 0px;
					z-index: 10;}
#menucontainer2	{ 	background-color: #C1EF22;	}
#menucontainer3	{ 	background-color: #CAFB24;	}				

.menucontainer1, .menucontainer2, .menucontainer3
				{	background-color: #B3DC1F;
					width: 100%;
					border: 0px; padding: 0px; margin: 0px;
					z-index: 10;}
.menucontainer2	{ 	background-color: #C1EF22;	}
.menucontainer3	{ 	background-color: #CAFB24;	}				
					 	
#menubase1, #menubase2, #menubase3
	 {	background-color: #B3DC1F;
		width: 990px;
		border: 0px;
		padding: 0px;
		margin: 0px auto;
	}	
#menubase2	{ 	background-color: #C1EF22;	}
#menubase3	{ 	background-color: #CAFB24;	}
	 
 
.content ul		{	
			margin: 0; 
			margin-left: 30px;
			padding: 0;
			border: 0;
		}

.content ul li 		{
			list-style-type: square;
			list-style-position: inside;
			padding: 0;
		}

.content ul.contact	{	color: #f00;
						font-weight: bold;
					}					  

.content li.office, .content li.church
			{	color: #4F4F4F;
			}
.content li.contactDetails
			{	color: #464646;
				font-weight: normal;
			}
.content	{	width: 696px;
				float: left;
			}

#side	{	width: 280px;
		 	float: left;
			margin-right: 10px;
			background: #22211F;
		}
#side h1	{ display: none;	}				
/* end defaults */

h1				{ 
				width: 100%;
  				background-color: #FCFCFF;
  				border: 0;
  				/* for IE */
  				filter:alpha(opacity=60);
  				/* CSS3 standard */
  				opacity:0.6;			
				color: #211207;
				font:  bold 2.1em Palatino Linotype, Monaco, Georgia, Cambria, Times New Roman, serif;
				text-align: center;	
				vertical-align: center;
				margin: 0px 0px 2px 0px;
				padding: 0px;
				text-indent: 0;
				line-height: 130%;
				word-spacing: 15px; 
				}		  
								
h2, h3	{		font:  bold 1.5em  Georgia, Cambria, Times New Roman, serif;
				text-align: left;
				margin-left: 6px; 
				margin-bottom: 5px;
				margin-top: 0px;
			}

h4	{			color: #000000;
				font:  bold 1.0em Tahoma, Verdana, arial, sans-serif;
				text-align: left;
				margin-left: 16px;
				margin-bottom: 8px;
				margin-top: 3px;
			}
								
h5	{	
				color: #000;
				font:  bold 0.9em Tahoma, Verdana, arial, sans-serif;
				text-align: left;
				margin-left: 16px;
				margin-bottom: 8px;
				margin-top: 8px; 
			}
			
p 
				{	color: #fff;
					font: normal 0.8em/1.6em verdana, arial, sans-serif; 
					text-align: left;
					text-indent: 0px;
					margin-bottom: 10px;
					margin-top: 0px;
					margin-left: 20px;
					margin-right: 8px;
					text-decoration: none; 
			}
#menubase1 p, #menubase2 p, #menubase3 p 
				{	color: #1E81CA; /* was #25A2FF; */
					margin-bottom: 0px;
					font-weight: bold; 
				}				
.mainDiv1 p, .mainDiv2 p, .mainDiv3 p, .divBox1 p, .divBox2 p, .divBox3 p
			{	color: #000
			}			
	
/* .footer p	{		color: #464646;
			} */
			
sup		{font-size: 75%;	} 

.helpBox	{  	border: 1px solid #000; border-top-width: 5px; 
				width: 250px;
				margin-right: 5px; margin-bottom: 5px;
				float: left;
			}
						 
.helpBox p, .helpBox a p {	margin: 0 3px 2px 3px;
			}
			
.centre	{ text-align: center;	}

			
#footer		{	width: 990px; 
				border: 0;
				padding: 0;
				margin: 0px auto;
				margin-top: 10px;
				background-color: #211207;
				color:	#8E8E8E;
				font-style: arial, verdana, sans-serif;
			}
			
#basemenu	{	background-color: #000;
				padding: 0; padding-top: 30px;
				z-index: 20;
			}				
							
#footer	p {	font-size: 0.7em;
			}

.writer		{	font: bold 1.2em/2em "lucida handwriting", "comic sans ms", georgia;
			}
			
.writer_role {	margin-left: 8px; font-weight: bold;	}	/* use with normal para */			
						 			 	

/*  --------- 2. structure  --------- */

div.small_tab table
			{	background-color: #fff;
				border:1px solid #000; border-top-width: 5px;
				padding: 3px;
				margin: 10px 20px 15px 40px;  
				text-align: left;
				width: 500px;
			}

div.small_tab th
			{	
				font:  normal 0.9em Tahoma, Verdana, sans-serif;
				border-bottom: 3px dotted #8E8E8E;
				line-height: 2em;
				margin-bottom: 0px;
				margin-top: 0px;
				text-align: center;
			}
		
div.small_tab td.date, div.small_tab th.date
			{	border-right: 2px dotted #E5E5E5;
				width: 200px;
			}
									
div.small_tab td.bot-border 
			{	border-bottom: 2px dotted #E5E5E5;
			}
						
/* ---------- 3. links and navigation ---------- */	
a, #footer a
	 	{	font-family: inherit; 
			font-weight: bold;
			text-decoration: none;
			color: #25A2FF;
			border-bottom: 1px solid #25A2FF;
		}
#footer a	{	padding: 6px; padding-bottom: 4px;
				margin-right: 6px;
			}		 
		
a:focus, a:hover, #footer a:focus, #footer a:hover 
		 	{	color: #fff;
				background-color: #25A2FF;
			}
			
.headLink a:focus, .headLink a:hover 
		 	{	background-color: none;
			}
			
div#navcontainer
{
border-top: solid 1px #FFFFFF;
border-bottom: solid 1px #FFFFFF;
}

div#navcontainer ul
{
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
color: white;
text-align: center;
margin: 0;
padding-bottom: 5px;
padding-top: 5px;
vertical-align: bottom; 
}

div#navcontainer ul li
{
display: inline;
margin-left: -12px; 
}
div#navcontainer ul li.first
{
margin-left: 0px; 
}
div#navcontainer li a
{
padding: 5px 10px 5px 10px;
text-decoration: none;
border: 1px solid #fff;	border-left: 0;
font-weight: bold;
}

div#navcontainer li a.first
{
border-left: 1px solid #fff;
}

.one, div#navcontainer li.one	a	{	color: #25A2FF; /* blue - black background */	/* remove once changed all to oneW or oneB */
			}	

.oneB, div#navcontainer li.one	a	{	color: #25A2FF; /* blue - black background */
			}	

.oneW, div#navcontainer li.one	a	{	color: #1E81CA; /* blue - white background */
			}
			
.twoB, div#navcontainer li.two	a	{	color: #B3DC1F;  /* green */
			}
.twoW								{	color: #97BB1B; /* #5A6E10; ok for luminosity */ 	 /* green */
			}  			

.three, div#navcontainer li.three a	{	color: #ffbb00;	 /* orange */				/* remove once changed all to oneW or oneB */
			}

.threeB, div#navcontainer li.three a	{	color: #ffbb00;	 /* orange */
			}

.threeW, div#navcontainer li.three a	{	color: #ffbb00;	 /* orange */		  /* ?? need to improve this colour */
			}
			
div#navcontainer ul li.one a:hover
{
background-color: #25A2FF;
color: #fff;
}

div#navcontainer ul li.two a:hover
{
background-color: #B3DC1F; 
color: #fff;
}

div#navcontainer ul li.three a:hover
{
background-color: #ffcc00; /* FF23FF; or #990033 */
color: #fff;
}

#pagelist
{
margin-left: 0;
padding-left: 0;
list-style: none;
}
#subpagelist
{
margin-left: 5px; margin-top: 3px;
}
#subpagelist li
{
margin-left: 5px; padding-left: 10px;
background-image: url(images/list-off.gif);
background-repeat: no-repeat;
background-position: 0 .5em;
}
#thispagecontainer a
{
border: 0;
font: normal 0.8em/1.5em arial-narrow, sans-serif; 
color: white; 
margin-left: 10px;
}
#subpagelist a
{
color: white;  
}
#pagelist ul { list-style: none; }

.top-back	{	text-align: right;
				float: right;
				width: auto;
				padding: 1px;
				margin: 0;
				font: bold 0.8em/1.5em verdana, arial, sans-serif;
				z-index: 20;
			}
.top-back a:link, .top-back a:visited, .top-back a:focus, .top-back a:hover 
			{	color: #1E81CA; /* #25A2FF; */
				background-color:#fff;
				border: 1px solid #1E81CA; /* #25A2FF; */
				text-decoration: none;
				padding: 0px 10px 7px 10px;
				margin: 0;				
			}
.top-back a:hover	{	color: #fff;
						background-color:#1E81CA; /* #25A2FF; */
						border: 1px solid #fff;
					}

.sidebox	{	margin: 10px;
				border: 1px solid;
				padding: 4px;
			}	
.sidebox h4	{	margin-left: 8px;					
			}
.sidebox p	{   margin-left: 10px;
			}			
			
/* ---------- 4. fonts ---------- */
.content li, #navcontainer li	{	font: normal 0.8em/1.5em verdana, arial, sans-serif; 
					text-align: left;
					text-indent: 0px;
					margin-bottom: 10px;
					margin-top: 0px;
					margin-left: 8px;
					margin-right: 8px; 
			}	
li ul li	{	font-size: 1em/1.8em;	}				

/* ---------- 5. images ---------- */
img	{
		border: 0; 
		margin: 5px;
		margin-top: 0px;
	}
a.imglink {	border-bottom: 0;
			background-color: inherit;
			}
.white a.imglink	{	background-color: #fff;
			}
.black a.imglink	{	background-color: #000;
			}
			 				
p.imglink	{	border-bottom: 0;	}
.helpbox p.imglink	{	border-bottom: 0;	}
a:link.imglink 	{	border-bottom: 0; background-color: inherit;	} 
a:visited.imglink {	border-bottom: 0; background-color: inherit;	}
a:focus.imglink {	border-bottom: 0;	background-color: inherit;	}
a:hover.imglink {	border-bottom: 0; background-color: inherit;	}