/* Style sheet for www.puddleglumsrest.org.uk     Updated 2 July  2008 */

/* http://www.puddleglumsrest.org.uk/pgr.css                           */
/* This document validates as CSS level 2.1                            */

/* Support for earlier browsers is no longer a real concern: the       */
/* web has moved on somewhat in the last few years. Good support for   */
/* style sheets is now common                                          */

/* I know of no CLEAN way to produce the vertical control margins      */
/* with CSS, so I still use a table to frame the pages.  If you know   */
/* one, please feel free to email me!                                  */


/* PAGE AND TEXT BLOCKS */

body,div,p    /* common features */
{
	cursor: default;
	font-family: "Lucida Grande", verdana, sans-serif;
	color: #003300; 				/* very dark green */
	background-color: #ddffdd; 		/* very light green */
}
	
body
{
	margin: 0 8px 0 8px;			/* keeps text off edgestops     */
	max-width: 52em;				/* keep length vaguely scanable */
	min-width: 35em; 				/* stops header format breaking */
		margin-left: auto;
		margin-right: auto;
	min-height: 425px;
}

div
{
	background-color: inherit; 		/* maybe... */
}

p
{
	background-color: inherit;
	text-align:justify;
}

.tal	/* text-align left */
{
	background-color: inherit;
	text-align: left;
}

.ral	/* text-align right */
{
	background-color: inherit;
	text-align: right;
}

.tac	/* text-align centre */
{
	background-color: inherit;
	text-align: center;
}


/* SPECIAL DIVISIONS */

div.topl /* for when I can get it to work nicely! */
{
    float: left;
    width: 24px;
	cursor: pointer;
	background-image: url(gotopl.png);
	background-repeat: repeat-y;
}

div.topr /* for when I can get it to work nicely! */
{
    float: right;
    width: 24px;
	cursor: pointer;
	background-image: url(gotopr.png);
	background-repeat: repeat-y;
}


div.leftnarrow
{
	float: left;
    width: 26%;
    padding-right: 4%;
}

div.rightwide
{
    float: right;
    width:66%;
    padding-left: 4%;
}


div.leftwide
{
    width: 66%;
    padding-right: 4%;
}

div.rightnarrow
{
    float: right;
    width:26%;
    padding-left: 4%;
}


div.lefthalf
{
    float: left;
    width:46%;
    padding-right: 4%;
}

div.righthalf
{
    float: right;
    width:46%;
    padding-left: 4%;
}

div.cb		/* typical use - copyright after photos */
{
	clear: both;
	font-size: x-small;
	text-align: right;
}



.picto div:hover		/* typical use - photos used as links */
{
	cursor: pointer;
	background-color: #aaffaa;
	color: #660000;              
}


.clear
{
	clear: both;
}



/* HEADERS */

h1,h2,h3,h4,h5,h6,h7    /* common features */
{
	margin-top: 0.3in;
	margin-bottom: 0.1in;
	background-color: inherit;
	color: inherit;
	font-family: "Lucida Grande", verdana, sans-serif;
}
	
h1   /* largest header is size 1 */ 
{
	font-size: X-large;
}

h2   /* header size 2 */
{
	font-size: large;
}

h3   /* header size 3 */
{
	font-size: medium;
}



/* TABLE FEATURES */

th,td,td.c,td.nav,td.dark,td.top          /* common features */
{
	font-family: "Lucida Grande", verdana, sans-serif;
	color: inherit;
	background-color: inherit;
}

th   /* normal table header - expect browser to add bold */
{
	font-size: medium;
}

td   /* normal (for here) text data cell */
{
	font-size: medium;
}

td.c   /* centred text data cell */
{
	font-size: medium;
	text-align: center;
}

td.nav   /* table cell for legible navigation */
{
	font-size: small;
	letter-spacing: 0.1em;
	padding-top: 0.3em;

}

.nav   /* newer non-table navigation */
{
	font-size: small;
	letter-spacing: 0.1em;
	padding-top: 0.3em;
	line-height:100%;
}

td.dark /* for obit. bold medium centred data cell */
{
	background-color: black;
	background-image: none;
	color: #aaaaaa;
	font-size: small;
	font-weight: 700;
	text-align: left;
}

td.top /* loads up arrows and sets ponter (cursor) to pointer in IE4+ */
{
	cursor: pointer;
/*
	background-image: url(gotop2.gif);
	background-repeat: repeat-y;
*/
}

td.topl /* loads up arrows and sets ponter (cursor) to pointer in IE4+ */
{
	cursor: pointer;
	background-image: url(gotopl.png);
	background-repeat: repeat-y;
}

td.topr /* loads up arrows and sets ponter (cursor) to pointer in IE4+ */
{
	cursor: pointer;
	background-image: url(gotopr.png);
	background-repeat: repeat-y;
}

td.topl:hover, td.topr:hover /* highlights on hover */
{
	background-color: #aaffaa;
}




/* other selectors */

.header, .footer       /* common features */
{
	color:  #003300;
    background-color:  #dfd;
	font-size: small;
	letter-spacing: 0.1em;

	border-style: solid;
    border-color:  #003300;
    border-top-width: 2px;
	border-left-width:0px;
	border-right-width:0px;
	border-bottom-width: 2px;

	padding-top:0.3em;
	padding-bottom:0.2em;
	padding-left:0.2em;
	padding-right:0.2em;
	
	clear: both;
}

.header
{
	margin-top:0;
	margin-bottom:3em;
}

.footer
{
	margin-top:3em;
	margin-bottom:0;
}

.headname
{
	font-weight:900;
}

.in   /* indent from left, hang-out on first */
{
	margin-top: 0in;
	margin-bottom: 0in;
	margin-left: 2em;
		
	font-size: medium;
	color: blue;
	line-height: 120%;
	text-indent: -1em;
}

.sub   /* indent from left */
{
	margin-top: 0.1in;
	margin-bottom: 0in;
	margin-left: 2em;
	margin-right: 3em;
	font-size: medium;
}

.dark   /* light grey text on black */
{
/*
	padding: 2em;
*/
	background-color: black;
	background-image: none;
/*
	border: 1px solid #000000;
*/
	color: #aaaaaa;
	font-size: medium;
	font-weight: 600;
}

.c    /* centre aligned text */
{
	text-align: center; 
}

.small   /* redifine - small green text */
{
	font-size: small;
	font-weight: 900;
	color: #003300;
}

/* LISTS */

ul    /* unordered list */
{
	margin-top: 0.1in;
}

li
{
	margin-bottom: 0.1in;
}

dl    /* definition list */
{
	margin-top: 0.1in;
}

dd
{
	margin-top: 0.1in;
	font-size: small;
	margin-bottom: 0.2in;
}



/* TWIDDLY BITS */


hr   /* horizontal rule */
{
	height: 2px;
	color: #003300;
	background-color: #005000;		/* _visually_ match text */
	border: 0;
}

cite   /* citation, author etc. */
{
	font-size: small;
}

.logo       /* special treatment for logos to allow class "nav" hover */
{
    background-color: inherit;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 5px;
	padding-right: 5px;
}

/* LINKS - definition sequence allows for normal priorities    */

a:link   /* unvisited - lighter */
{
	cursor: pointer;
	background-color: inherit;
	color: #009900;
	text-decoration: underline;
}

a:visited   /* visited - normal */
{
	cursor: pointer;
	background-color: inherit;
	color: #003300;
	text-decoration: underline;
}

a:hover    /* pointed at - dark red */
{
	cursor: pointer;
	background-color: inherit;
	color: #990000;
	text-decoration: underline;
}

a:active   /* loading - red */
{
	cursor: pointer;
	background-color: inherit;
	color: #ff0000;
	text-decoration: underline;
}


/* LINKS - variation for use in the navigation header and footer */

a:link.nav   /* unvisited - lighter green */
{
	cursor: pointer;
	background-color: inherit;
	color: #009900;
	text-decoration: none;
}

a:visited.nav   /* visited - normal colours */
{
	cursor: pointer;
	background-color: inherit;
	color: inherit;
	text-decoration: none;
}

a:hover.nav    /* pointed at - red */
{
	cursor: pointer;
	background-color: #aaffaa;
	color: #990000;              
	text-decoration: underline;
}

a:hover.logo    /* pointed at*/
{
	cursor: pointer;
	background-color: #aaffaa;
	color: #660000;              
	text-decoration: underline;

}



/* END OF STYLESHEET */