/* hillnvalley.css -- styles for parish magazine pages */

a { color: #900; border-bottom: dotted thin #900; text-decoration: none; }
a:hover { border-bottom: dotted thin white; background-color: #5584aa; color: white; }
#header td a, #header td a:hover { border: none; background-color: transparent;}
img { border: none; margin: 0.2em 0.5em; }
.jigsaw img { margin: 0; }
td, th { padding: 0.2em; }
.greyout {  color: #CCCCCC}
.sanserifnosize {font-family: Arial, Helvetica, sans-serif}
.sanserif {  font-family: Arial, Helvetica, sans-serif; font-size: 80%}
.sanseriflarge {  font-family: Arial, Helvetica, sans-serif; font-size: 100%}
.serif2 {  font-family: Georgia, "Times New Roman", Times, serif; font-size: 80%}
.comic {  font-family: "Comic Sans MS", Arial, Helvetica, cursive, sans-serif; font-size: 80%; }
.verycomic {  font-family: "Cataneo BT", "Comic Sans MS", Arial, Helvetica, sans-serif}
.little {  font-size: 80%}
.bitlittler {  font-size: 90%}
.large {  font-size: 120%}
.verylarge {  font-size: 130%}
.bitlarger {  font-size: 105%}
.byline {  text-align: right; margin-top: 0px; font-style: italic; }
.flushnext {  margin-bottom: 0px}
.flushprev { margin-top: 0px}
.squashed { margin-top: 0px; margin-bottom: 0px }.greyback {  background-color: #CCCCCC}
.flushboth { margin-top: 0px; margin-bottom: 0px }
.greyborder {border-style:solid; border-color:#CCCCCC; border-width:1px}
.centre {
	text-align: center;
}
blockquote {
	display: block;
	font-style: italic;
	background: #eee;
	text-align: center;
	padding: 1em 2em;
}
/*blockquote:before {
	content: open-quote;
	font-size: 200%;
}*/
.box1, .box2, .box3, .box4, .box5, .box6, .box7, .box8, .box9 {
	margin-top: 10px;
	padding: 5px;
}
.box1 { border: 3px double #990000; font-family: Arial, Helvetica, sans-serif; }
.box2 { border: 5px double #000099; }
.box3 { border: 2px solid #009900; }
.box4 { border: 2px solid #990000; }
.box5 { border: 7px double #009900; }
.box6 { border: 5px solid #006633; }
.box7 { border: 3px inset #330000; background-color: #EEE; font-family: Arial, Helvetica, sans-serif; }
.box8 { border: 3px groove #009933; background-color: #FFC; }
.box9 { border: 5px ridge #339900; }
div.playgroup
{
	border: double blue thick;
	margin: 0.3em 0.7em;
	padding: 0.3em 1em;
	font-family: "Comic Sans MS", Tahoma, Arial, Helvetica, cursive, sans-serif;
	font-size: 80%;
}
table.borders td, table.borders th {border: solid thin #999; border-collapse: collapse;}
.dashedoverline { padding-top: 0.7em; border-top: dashed silver thin; }
.solidoverline { padding-top: 0.7em; border-top: solid silver thin; }
.dottedoverline { padding-top: 0.7em; border-top: dotted silver thin; }
.code_warning { color: red; font-size: 120%; background-color: #FFD;
                font-family: "Comic Sans MS", Arial, Helvetica, sans-serif; font-weight: bold; }
.caption { font-size: 80%; font-style: italic; margin-top: 0; }

/* acrostics; see, for example HnV 2006-07
<div class="acrostic">
  <div class="verse">
    <p>Eyesore</p>
	<p>Graunch</p>
  </div>
  <div class="verse">
    <p>...</p>
  </div>
</div>
etc.
Verses have a space between but none internally */
div.acrostic div.verse { margin-top: 0.3em; }
div.acrostic div.verse p { margin: 0; }
div.acrostic div.verse p:first-letter {
	font-size: 150%;
	color: #900;
	float: left;
	clear: left;
}
/* pictures: <div class="illustration"><img src=... /><p>Caption</p></div> */
div.illustration {
	margin: 0.3em 1em;
	padding: 0.5em;
	border: 1px silver solid;
}
div.illustration img {
	border: none;
	margin: none; /* handled by enclosing div's padding */
}
div.illustration p {
	margin: 0;
	font-style: italic;
	font-size: 80%;
}
/*
** floating helpers
*/
.left { float: left; }
.right { float: right; }
.clear { clear: both; }
.clearl { clear: left; }
.clearr { clear: right; }
/*
** text helpers (bit of a mess - center should be a centred block)
*/
.center { text-align: center; }
.tleft { text-align: left; }
.tright { text-align: right; }
.tcenter { text-align: center; }

/*
** the page tabs
*/
ul#toppages li, ul#botpages li {
	display: inline;
}
ul#toppages li a, ul#toppages li span, 
ul#botpages li a, ul#botpages li span {
	border: 1px black solid;
	padding: 0.3em 0.3em 0 0.3em;
	background-color: #eee;
	color: #333;
	text-decoration: none;
}
ul#toppages li span,
ul#botpages li span {
	border-color: white;
	background-color: #fff;
	color: #ccc;
}
ul#toppages li a:hover, ul#botpages li a:hover /*,
ul#toppages li.relative a:hover, ul#botpages li.relative a:hover*/ {
	border: 1px black solid;
	background-color: #900;
	color: #ffd;
}

/* pdf link */
ul#toppages li.pdf a img,  ul#botpages li.pdf a img {
    width: 1.5em;
    height: 1.5em;
    vertical-align: middle;
    text-align: center;
}

ul#toppages li.pdf a, ul#botpages li.pdf a {
    border: none;
    padding: none;
    background-color: transparent;
}

/*
** some styles for boxes for the front page (and anywhere else, I guess)
*/
.moviola, .communityassoc, .parishcouncil, .kidzzone, .youthclub, .box1, .box2 {
	margin: 0.3em 0.8em;
	padding: 0.4em 1em;
}
.moviola {
	border: medium dashed blue;
}
.communityassoc {
	border: medium solid #d27e26;
	background-color: #ffc;
	font-family: "Comic Sans MS","comic sans",comic,cursive;
}
.parishcouncil {
	border: medium solid red;
	background-color: #ffc;
}
.kidzzone, .youthclub {
	border: thick double #ddd;
	background-color: black;
	color: #eee;
	font-weight: bold;
}
.kidzzone a, .youthclub a {
	color: #f9c;
}
.kidzzone a:hover, .youthclub a:hover {
	color: #060;
	text-decoration: none;
	background-color: #ccc;
}
.kidzzone h1, .kidzzone h2, .kidzzone h3,
.kidzzone h4, .kidzzone h5, .kidzzone h6,
.youthclub h1, .youthclub h2, .youthclub h3,
.youthclub h4, .youthclub h5, .youthclub h6 {
	color: red;
}
.kidzzonehdr { /* "replace" the text KidzZone with the logo */
	display:block;
	width: 300px; height: 110px; 
	background: url(/images/kidzone-med.png) transparent top left no-repeat;
	text-indent: -200em;
}
.pumpkincontest {
	width: 307px; height: 267px;
	background: url(../images/pumpkin.gif) top left no-repeat scroll transparent;
	border: none; margin: 0;
	padding: 6em 2em 0 2em;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 110%;
	font-weight: bold;
	text-align: center;
}
.emphasis {
	font-weight: bold;
	font-style: italic;
	color: #03c;
}
.scramblershdr {
	display: block;
	width: 152px; height: 25px; margin: 0 auto;
	background: url(/images/scramblers.gif) transparent top left no-repeat;
	text-indent: -200em;
}

/* set up the gardening club with a pair of nested divs */
.gardenclub_outer {
	background: transparent url(/hillnvalley/images/leaves.png) top left repeat;
	padding: 19px 22px;
}
.gardenclub_inner {
	background: white;
	padding: 1em 2em;
}

/******************************************************************************/

/* new stuff with php-generated pages */

#contents {
    clear: both;
}

/*
** header
*/
.navbar {
    float: right;
    text-align: right;
}
#header {
}
#header .ident {
    float: left;
    max-width: 20em;
}
#header .ident span {
    display: block;
}
#header .strap {
    float: right;
    text-align: right;
    max-width: 80%;
}
#header .banner {
    clear: both;
    background: transparent url(/hillnvalley/images/banner.gif) top left no-repeat;
    text-indent: -1000em;
    min-width: 730px;
    min-height: 34px;
}

/*
** footer
*/
#footer {
    clear: both;
}
#footer .top {
}
#footer .navbar {
}