/*
CSS for St Helen Witton - flexible scheme

Author:	Kevin Johnson
Date:	24th March 2008

			IIS does not support full SSI commands (e.g. #set)
			consequently this solution only works on full Appache
			servers, with .css being set to be SSI parsed.
			
			With SSI parsing, the colour coding file "witton-css.inc"
			will be processed when this .css file is requested,
			there by inserting the selected colour codes into this
			style sheet.  Without SSI parsing, this style sheet 
			delivers the standard (blue) scheme colour set.

CSS For St Helen Witton - variable colour scheme selector

Author:	Kevin Johnson
Date:	24th March 2008




Current configuration:

Selected Theme - blue


Blue scheme being configured...
<!-- BLUE Scheme -->















Solid33 - #111133 /*
Solid55 - #111155 /*
Solid77 - #111177 /*
Solid99 - #111199 /*
SolidBB - #1111BB /*
SolidDD - #1111DD /*
SolidFF - #1111FF /*
Pastle33 - #3333ff /*
Pastle55 - #5555ff /*
Pastle77 - #7777ff /*
Pastle99 - #9999ff /*
PastleBB - #BBBBff /*
PastleDD - #DDDDff /*


			
*/

body
  {
  margin : 0% ;
  font-family : Arial, Helvetica narrow ;
  font-size : 11pt ;
  font-style : normal ;
  color : #111155 ;
/* */
  color : #111155 /* */;
  background : #ddddff ;
/* */
  background : #DDDDff /* */;
  padding-bottom : 5px ;
  height : 99% ;
  }
.Error
	{
	BACKGROUND : GOLD ;
	COLOR : BLUE ;
}
/*
	Table text a little smaller than body text
	Table cell content aligned to the top of the cell
*/
table
  {
  font-family : arial ;
  font-size : 10pt ;
  }
td
  {
  vertical-align : top
  }
table .general
  {
	border : 1px solid ;
	margin : 0px ;
	padding : 5px ;
	}
.lettergrid
  {
  background : #bbbbff ;
/* */
  background : #BBBBff /* */;
	}
.lettergrid td
  {
  border-top : 1px solid ;
  border-top : #ddddff ;
/* */
  border-top : #DDDDff /* */;
  border-left : 1px solid ;
  border-left : #ddddff ;
/* */
  border-left : #DDDDff /* */;
	}
.first-row td
  {
  border-top : none ;
	}
.lettergrid .first-col 
  {
  border-left : none ;
	}
.lettergrid td
  {
	padding : 5px 10px 5px 10px ;
	}
/*
headings:
  h1, h2	colour - hlp codes (high-light-prime)
  h3			colour - hls codes (high-light-secondary) 
  h4			colour - hlt codes (high-light-terciary) 
*/	
h1, h2, h3, h4
  {
  font-family : Lucida Calligraphy, Arial, Helvetica narrow ;
  }
h1, h2, h6
  {
  color : #1111dd ;
/* */
  color : #1111DD /* */;
  background : transparent ;
  }
h1
  {
  font-size : 140% ;
  margin : 0px ;
  padding : 0px ;
  border : 0px ;
  }
h1 span
  {
  font-weight : normal ;
  font-size : 70% ;
  display: block ;
  left : 0px ;
  margin : 0px ;
  overflow : hidden ;
  }
h2
  {
  font-size : 120% ;
  font-weight : bold ;
  margin : 0px ;
  margin-bottom: 5px ;
  }
h3
  {
  clear : both ;
  font-size : 110% ;
  font-weight : Bold ;
  color : #ddddff ;
/* */
  color : #DDDDff /* */;
  background : #7777ff ;
/* */
  background : #7777ff /* */;
  padding : 5px ;
  margin-top : 3px ;
  margin-bottom : 3px ;
  }
h4				{
  font-size : 100% ;
  color : #1111ff ;
/* */
  color : #1111FF /* */;
  background : #bbbbff ;
/* */
  background : #BBBBff /* */;
  margin-top : 2px ;
  margin-bottom : 2px ;
  padding : 1px 5px ;
  clear : both ;
  }
h4 select
  {
  font-size : 90%;
  z-index : 500 ;
  }
h5
  {
  margin-left : 5px ;
  margin-top : 2px ;
  margin-bottom : 2px ;
  padding : 2px ;
  font-weight : normal ;
  color : #1111ff ;
/* */
  color : #1111FF /* */;
  background : #bbbbff ;
/* */
  background : #BBBBff /* */;
  }
h6
  {
  margin-left : 5px ;
  margin-top : 2px ;
  margin-bottom : 2px ;
  padding : 2px ;
  font-weight : normal ;
  font-size : 105% ;
  }
hr
  {
  clear : both ;
  color : #1111ff ;
/* */
  color : #1111FF /* */;
  height : 1px ;
  }
.dt
  {
  font-weight : bold ;
  }
.dd
  {
  display : block ;
  margin-left : 2em ;
  }
.dd ol
  {
  margin-left : 0px ;
  }
.alphlist
  {
  list-style: lower-alpha 
  }
.wrap
  {
  clear : none ;
  }
.qotd
  {
  z-index : -800 ;
  }
p
  {
  margin-top : 0px ;
  padding-left : 5px ;
  padding-right : 5px ;
  }
p .call
  {
  margin-top : 10px ;
  }
form p
  {
  font-size : 90% ;
  padding : 5px ;
  }
legend
  {
  font-size : 80% ;
  color : #1111ff ;
/* */
  color : #1111FF /* */;
  }
label
  {
  width : 10em ;
  text-align : top ;
  }
.google
  {
/*  position : absolute ;
  margin-left : 495px ; */
  float : right ;
  margin-top : 1px ;
  font-size : 9pt ;
  padding : 0px ;
  text-align : right ;
  }
.google input
  {
  font-size : 9pt ;
  padding : 0px ;
  }
.google .submit
  {
	height : 19px ;
	margin : 0px ;
  }
.google form
  {
  margin : 0 ;
  }
.googleresults
  {
  padding-left : 7px ;
  font-size : 80% ;
  }
a
  {
  font-weight : bold;
  text-decoration : none;
  padding : 2px ;
  }
a img
  {
  border : none ;
  }
.NavBar a
  {
  display: block ;
  padding : 2px 5px ;
  border-width : 0px ;
  margin : 0px;
  }
.NavBar a:link
  {
  color : #ddddff ;
/* */
  color : #DDDDff /* */;
  }
.NavBar a:visited
  {
  color : #111155 ;
/* */
  color : #111155 /* */;
  }
.NavBar a:hover
  {
  color : #1111ff	;
/* */
  color : #1111FF /* */;
  background : #ddddff ;
/* */
  background : #DDDDff /* */;
  }
a:link
  {
  color : #1111ff ;
/* */
  color : #1111FF /* */;
  }
a:active
  {
  color : #dddd77	;
/* */
  color : #DDDDff /* */;
  }
a:visited
  {
  color : #7777ff ;
/* */
  color : #7777ff /* */;
  }
a:hover
  {
  color : #1111bb	;
/* */
  color : #1111BB /* */;
  background : #bbbbff ;
/* */
  background : #BBBBff /* */;
  }
.linkspage a:hover
  {
  background : transparent ;
  }
A .MailLink
  {
  color : #1111ff	;
/* */
  color : #1111FF /* */;
  }
#NavBar
  {
  font-size : 90%;
  background : #7777ff ;
/* */
  background : #7777ff /* */;
  display : block ;
  padding-top : 10px ;
  position : absolute ;
  width : 140px ;
  height : 100% ;
  left : 0px ;
  top : 0px ;
  margin-bottom : 0px ;
  }
body > #NavBar
  {
  position : fixed ;
  }
.NavBarActive
  {
  display: block ;
  padding : 2px 5px ;
  color : #ddddff ;
/* */
  color : #DDDDff /* */;
  background : #3333ff ;
/* */
  background : #3333ff /* */;
  }
.NavBar a span
  {
  font-weight : normal ;
  font-size : 90% ;
  color : #ddddff ;
/* */
  color : #DDDDff /* */;
  display: block ;
  position : absolute ;
  visibility : hidden ;
  top : 286px ;
  left : 0px ;
  height : 80px ;
  padding : 3px 5px ;
  margin : 0px ;
  width : 100% ;
  overflow : hidden ;
  }
.NavBar a:hover span
  {
  visibility : visible ;
  overflow : hidden ;
  }
.NavBar .NavLab
  {
  color : #ddddff ;
/* */
  color : #DDDDff /* */;
  display: block ;
  padding : 5px 5px 2px ;
  border-top : 1px inset #ddddff ;
/* */
  border-top : 1px inset #DDDDff /* */;
  }
.NavLab
  {
  font-size : 85% ;
  line-height : 85% ;
  }
.sitemap a
{
font-size : 80% ;
margin-left : 10px ;
width : 350px ;
}
.sitemap a span
{
display : block ;
font-weight : normal ;
text-decoration : underline ;
margin-left : 150px ;
margin-bottom : 10px ;
margin-top : -16px ;
}
.sitemap .NavLab, .sitemap .NavBarActive
{
display : none ;
visibility : hidden ;
}
/*
People gallery;
*/
.album
  {
  margin-left : 0px ;
  border 0px ;
  }
.album td
  {
  text-align : center ;
  }
.photo, a.photo
  {
  width : 240px ;
  display : block ;
  padding : 2px ;
  font-size : 10pt ;
  }
.il .photo 
  {
  margin-right : 20px ;
  }
.ir .photo 
  {
  margin-left : 20px ;
  }
a.face2name .photo
  {
  visibility : hidden ;
  position : absolute ;
  overflow : hidden ;
  }
a:hover.face2name .photo
  {
  visibility : visible ;
  position : relative ;
  top : 0px ;
  left : 0px ;
  overflow : hidden ;
  float : right ;
  border : #111155 double 3px ;
  margin : 5px ;
  }
.face2name-tag
  {
	font-size : 14pt ;
  font-style : italic ;
  font-weight : lighter ;
  font-family : Times New Roman ;
  font-strech : ultra-condensed ;
  border-bottom : dashed 1px #7777ff ;
  }
.albumIndex
  {
  display : block ;
  font-weight : bold ;
  font-size : 100% ;
  text-align : center ;
  margin-top : 2px ;
  }
.albumDesc
  {
  display : block ;
  font-weight : normal ;
  font-style : italic ;
  text-align : center ;
  }
a:link.profile-tag, a:active.profile-tag, a:visited.profile-tag, a:hover.profile-tag
  {
  color : #1111dd ;
/* */
  color : #1111DD /* */;
  }
a:link.face2name, a:active.face2name, a:visited.face2name, a:hover.face2name
  {
  color : inherit ;
  font-weight : inherit ;
  color : #111155 ;
/* */
  color : #111155 /* */;
  }

.cent
  {
  text-align : center ;
  }
.eLink
  {
  font-weight : normal ;
  text-align : center ;
  }
/*img
  {
  hspace : 0px ;
  margin : 2px ;
  }*/
marquee
  {
  color : #1111bb ;
/* */
  color : #1111BB /* */;
  font-weight : bold ;
  background : transparent ;
  }
q
  {
  font-Family : Lucida Calligraphy, Tahoma, Arial ;
  font-Style : italic ;
  color : #1111ff ;
/* */
  color : #1111FF /* */;
	padding-right : 0.5em ;
	quotes : none ;
  }
.b
  {
  background : #000000 ;
  color : #ddddff ;
/* */
  color : #DDDDff /* */;
  }
.ir
  {
  margin-left : 20px ;
  margin-top : 5px ;
  margin-bottom : 5px ;
  float : right ;
  }
.il
  {
  margin-right : 20px ;
  margin-top : 5px ;
  margin-bottom : 5px ;
  float : left ;
  }
.ist
  {
  margin-top : 20px ;
  }
.ar
  {
  margin-left : 20px ;
  text-align : right ;
  }
.al
  {
  margin-right : 20px ;
  text-align : left ;
  }
.hidden
  {
  visibility : hidden ;
  line-height : 0px ;
  font-size : 0pt ;
  margin : 0px ;
  }
.shown
  {
  visibility : visible ;
  line-height : nomal ;
  }
.call
  {
  clear : both ;
  }
.splash
  {
  font-size : 130% ;
  }
.content, .contentMobile
  {
  position : static ;
  margin-top : 100px ;
  margin-left : 140px ;
  padding-left : 5px ;
  padding-right : 5px ;
  z-index : -100 ;
  }
.contentMobile
  {
  margin-top : 5px ;
  margin-left : 5px ;
  }
.box
  {
  font-family : verdana, Comic Sans MS ;
  font-style : italic ;
  font-weight : normal ;
  font-size : 110% ;
  font-stretch : ultra-expanded ;
  text-align : center ;
  color : #1111ff ;
/* */
  color : #1111FF /* */;
  background : #9999ff ;
/* */
  background : #9999ff /* */;
  padding : 20px ;
  width : 500px ;
  margin : 1em ;
  }
.kids
  {
  font-family : Lucida Handwriting, Comic Sans MS ;
  font-style : italic ;
  font-weight : light ;
  font-size : 140% ;
  font-stretch : ultra-expanded ;
  color : #ddddff ;
/* */
  color : #DDDDff /* */;
  background : #111177 ;
/* */
  background : #111177 /* */;
  padding : 20px ;
  margin-left : 20px ;
  margin-right : 20px ;
  }
.inaction
  {
  font-family : verdana ;
  font-style : normal ;
  font-weight : normal ;
  font-size : 110% ;
  font-stretch : ultra-expanded ;
  color : #111177 ;
/* */
  color : #111177 /* */;
  background : #bbbbff ;
/* */
  color : #BBBBff /* */;
  padding : 15px ;
  margin-left : 20px ;
  margin-right : 20px ;
  }
.tinytext
  {
  font-size : 55% ;
  }
.tight
  {
  padding : 0px ;
  margin : 0px ;
  }
.events
  {
  width : 98% ;
  }
.date, .time
  {
  width :10ex ;
  padding-right : 5px ;
  text-align : right ;
  }
.activity
  {
  padding-left : 5px ;
  border-left : 1px solid #9999ff ;
/* */
  border-left : #9999ff /* */;
  }
.bookverse
  {
  width :24ex ;
  }
.biblelink
  {
  width :4ex ;
  }
.bibleref
  {
  font-family : Helvetica narrow ;
  font-size : 75% ;
  }
.prayers ul
  {
  margin-left : 1.5em ;
  margin-top : 0px ;
  margin-bottom : 0px ;
  }
.prayers
  {
	padding-left : 4px ;
  border : 1px solid #9999ff ;
/* */
  border : #9999ff /* */;
  }
.sunday
  {
  background : #bbbbff ;
/* */
  background : #BBBBff /* */;
  }
.sunday .activity
  {
  background : #bbbbff ;
/* */
  background : #BBBBff /* */;
  }
.newday td
  {
  border-top : 1px solid #9999ff ;
/* */
  border-top : #9999ff /* */;
  }
.faint
  {
  color : #3333ff ;
/* */
  color : #3333ff /* */;
  }
.flash
  {
  position : relative ;
  float : left ;
  left : -85px ;
  top : -25px ;
  }
.credit
  {
  font-family : Tahoma, Arial ;
  font-size : 90% ;
  font-weight : bolder ;
  font-style : italic ;
  color : #1111ff ;
  /* */
  color : #1111FF /* */;
  }
.webcrawl
  {
  font-size : 70% ;
  text-align : center ;
  }
.webcrawl a
  {
  font-weight : light ;
  }
.newsletter fieldset
  {
  padding-left : 10px ;
  }
.newsletter	label
  {
  display : block ;
  font-weight : bold ;
  }
.newsletter input, textarea, select
  {
  font-size : 90% ;
  background : #bbbbff ;
/* */
  background : #BBBBff /* */;
  }
.newsletter #submit
  {
  float : right ;
  margin : 10px ;
  }
.nlbannerbox
  {
  text-align : center ;
  margin : 0px ;
  padding : 0px ;
  }
.nlbanner
  {
  width : 100% ;
  }
.listalphasq li
  { 
  list-style : lower-alpha ;
/*
  display : marker ;
  content : "[" counter(counter, lower-alpha) "]" ;
  counter-increment : counter ;
*/
  }
.name
  {
  empty-cells : show ;
  border-collapse : collapse ;
  border : 1px dotted #9999ff ;
  }
.name tr
  {
  margin : 0px ;
  border : #9999ff 1px dotted ;
  }
.name td
  {
  border : #9999ff 1px dotted ;
  border-left : none ;
  border-right : #9999ff 1px dotted ;
  margin : 0px ;
  padding : 5px ;
  }
map
  {
	outline : red thin dotted ;
	}
#Diagnostic
  {
  font-size : 90%;
  color : #ddddff ;
/* */
  color : #DDDDff /* */;
  background : #111155 ;
/* */
  background : #111155 /* */;
  padding : 10px ;
  margin-bottom : 0px ;
  position : absolute ;
  left : 25px ;
  top : 25px ;
  width : 700px ;
  z-index : 100 ;
  visibility : hidden ;
  }
.diagnostics td, .diagnostics th
  {
  width : 65px ;
  border : 1px solid silver ;
  }
.HeadBar
  {
  background : #7777ff ;
/* */
  background : #7777ff /* */;
  display : block ;
  padding : 10px ;
  padding-bottom : 5px ;
  top : 0px ;
  }
#HeadBar
  {
  position : absolute ;
  background : #7777ff ;
/* */
  background : #7777ff /* */;
  display : block ;
  padding-top : 10px ;
  padding-left : 10px ;
  padding-right : 10px ;
  width : 99% ;
  top : 0px ;
  left : 140px ;
  z-index : 5 ;
  }
body > #HeadBar
  {
  position : fixed ;
  }
#HeadBar hr
  {
  color : #ddddff ;
  /* */
  color : #DDDDff /* */;
  }
#NavGap
  {
  font-size : 0pt ;
  height : 2px ;
  margin : 0px ;
  padding : 0px ;
  }
#NavSpacer
  {
  margin : 0px ;
  }
#NavFoot
  {
  font-size : 75%;
  line-height : 75% ;
  text-align : center ;
  margin : 0px ;
  color : #ddddff ;
/* */
  color : #DDDDff /* */;
  }
#NavFoot form
  {
  text-align : left ;
  padding : 2px ;
  margin : 0px ;
  margin-bottom : 3px ;
  }
#NavFoot fieldset p
  {
  margin : 0px ;
  padding : 0px ;
  padding-top : 5px ;
  padding-left : 4px ;
  color : #ddddff ;
/* */
  color : #DDDDff /* */;
  }
#NavFoot legend
  {
  font-size : 95% ;
  color : #ddddff ;
/* */
  color : #DDDDff /* */;
  }
#NavFoot input
  {
  font-size : 8pt ;
  font-family : arial ;
  color : #1111ff ;
/* */
  color : #1111FF /* */;
  margin : 2px ;
  margin-top : 4px;
  margin-bottom : 0px ;
  width : 10ex ;
  }
#NavFoot a
  {
  font-weight : normal ;
  }
.Mobile
  {
  font-size : 60% ;
  font-style : italic ;
  text-indent : 0px ;
  color : #dddddd ;
  background : #666666;
  display: block ;
  position : absolute ;
  top : 0px ;
  padding : 0px 10px ;
  cursor : nw-resize ;
  }
body > .Mobile
  {
  position : fixed ;
  }
#sacredspace
  {
  font-size : 90%;
  background : #9999ff ;
/* */
  background : #9999ff /* */;
  padding : 10px ;
  margin-bottom : 0px ;
  position : absolute ;
  left : 10px ;
  top : 95px ;
  width : 755px ;
  height :385px ;
  z-index : 100 ;
  visibility : hidden ;
  overflow : auto ;
  }
#ssdpwin
  {
  width : 750px ;
  height : 365px ;
  margin : 2px ;
  }
.closetext
  {
  cursor : hand ;
  font-size : 80% ;
  }
.pledge
  {
	margin : 1.5% ;
	border : 6px solid double ;
	padding : 1% ;
	}
.pledge .spacer
	{
	width : 65px ;
	}
.pledge .sigbox
  {
	margin : 0px ;
	height : 40px ;
	border : 2px inset ;
	}
.pledge fieldset div
  {
	padding : 5px ;
	}
.printinstructions
  {
	margin : 2.5% ;
	border : 1px outset ;
	padding : 2.5% ;
  background : #7777ff ;
/* */
  background : #7777ff /* */;
  display : block ;
	}
/* Widget content container */
#goog-wm
		{
		padding : 0px ;
		margin : 0px ;
	  }

    /* Heading for "Closest match" */
#goog-wm div
		{
		padding : 0px ;
		margin : 0px ;
		}

#goog-wm h3 .closest-match
		{
		}

    /* "Closest match" link
   #goog-wm h3.closest-match a { }

    /* Heading for "Other things" */
   #goog-wm h3.other-things { }

    /* "Other things" list item */
   #goog-wm ul li { }

    /* Site search box */
   #goog-wm li.search-goog { display: block; }
/*
Diagnostic background colours
*/
/*
.NavBar			{
background : teal ;
}
.NavBar a span	{
background : green ;
}
#HeadBar		{
background : green ;
}
#NavGap			{
background : yellow ;
}
#NavSpacer		{
background : pink ;
}
#NavFoot		{
background : silver ;
}
*/
@media handheld {
#NavBar
{
visibility : hidden ;
}
#HeadBar
{
position : fixed ;
width : 90% ;
}
.content
{
margin-top : 5px ;
margin-left : 5px ;
}
}
@media print {
#NavBar, .Mobile
{
visibility : hidden ;
}
.content, #HeadBar {
  margin-left : 0px ;
  left : 1px ;
}
#HeadBar {
  visibility : hidden ;
  height : 0px ;
  }
.printinstructions
  {
	visibility : hidden ;
	}
.postTo
  {
	visibility : visible ;
	}
}