/* stylesheet version 4 for THE OUSE WASHES website */

/* reset browser styles */
html, body, h1, h2, h3, h4, h5, h6, p, ol, ul, li, blockquote
					{ padding: 0; margin: 0; font-size: 100%; font-weight: normal;}
ol 					{ margin-left: 0;   list-style: decimal; }
ul 					{ margin-left: 0;   list-style:	square; }
img				{ border:0;}
/* end reset browser styles */

body		{		background: white url('images/misc/.jpg'); 
					/*xmas 2012 was  ThreeDShadow url('images/misc/christmas-background-tiles155-150x150.jpg')  */
	
}

.page,
.header		{ 	/* this styles header (banner) table and main table of page; font-family & colour should be inherited unless stated below.,*/
					width: 960px; 
					margin-left : auto; 		/* margins left & right set to auto centers page in browser window */
					margin-right: auto;  	/* margins left & right set to auto centers page in browser window */
					font-family: Ebrima, Verdana;  
					color : maroon; 
					border-spacing:0; /* this is CSS equivalent to HTML cell-spacing */
}
.page,
.titlecell,
.narrative,
.slideshow	{ 	/* previously included header */
					border: 1px green solid; 
					border-collapse: collapse;
}

 
.header		{ 	margin-top: 15px; /* gives a space above page */
					margin-bottom: 0px;		/* gives a space below page */	
					border-bottom :0px green solid; 	/* prevents double-width border effect with main page table */
					border-collapse:collapse;
					
} 
.titlecell		{ 
					width: 100%; 
					height: 171px; 
					background-image: url('images/misc/headers/flooded-delph-ragged-edge-titled-960.jpg' ); /* summer: cattle-wet-frame-white.jpg; winter: flooded-delph-ragged-edge.jpg */ 
					background-repeat: no-repeat;
					background-position: center; 
					vertical-align: middle;
					border:none;
} 
.daterow	{ 
					width: 100%; 
					height : 20px; 
					background-color: white;/* was #fffdda */
					text-align: center; 
					font-size: 10pt; 
					color:green; 
					font-weight: bold; 
					border: 0px 2px 0px 2px green solid;
					border-bottom: 0 px green solid; 
					border-collapse :collapse;
}
.page		{	margin-top:5px;
					margin-bottom: 15px;		/* gives a space below page */	
					table-layout: fixed; 
					padding-top: 0px; 
					/* trial background was 
					background-image: url(maps/washes-lrg-washed-out.jpg); 
					background-repeat: repeat; 
					background-attachment: fixed; 
					background-position:center; */
}
.sidecol		{ 
					width: 212px; 
					margin-left : auto; 		/* margins left & right set to auto centers data in column */
					margin-right: auto;  	/* margins left & right set to auto centers data in column*/
					background-color:#fffdda; /* was #fffdda */
					font-family: Arial, Helvetica, sans-serif; 
					font-size: 10pt; 
					border-bottom: 0px; 
					border-top: 0px; 
}
.narrative	{  	/* use for centre column */
					background-color:#ccff99; /*was #ccff99 */
					font-size: 11pt;
					border-bottom: 0px; 
					border-top: 0px; 
					vertical-align:top; 
					text-align:left; 
					line-height: 166%; 
					margin:10px; 
					padding-left:18px; 
					padding-right:18px;
} 					
.slideshow	{  /* use on stand-alone slideshoes in middle column instead of narrative. not for use within otherpages */
					background-color:#ccff99;  
					vertical-align:top; 
					padding-top:8px; 
					border-bottom:0;
} 
.comment	{ 	/*text boxes used in side columns to indicate points to note. */
					border: 1px green solid; 
					background-color: #FFFFCC; /* yellow-ish */
					padding: 2px; 
					width: 190px; 
					text-align: center;
					margin-left:auto; /* left & right at auto centers in column */
					margin-right:auto;
}
blockquote	{ 
					margin-top: 1em; 
					margin-right: 1em; 
					margin-bottom: 1em; 
					margin-left: 1em; 
					text-align: justify; 
					font-size:11pt; 
					font-family:Arial;
					line-height: 135%;
}

h1			{ 		 /* for page title*/
					font-size: 18pt;	
					font-weight: bold; 
					color:white; /* winter: black */
					text-align : center; 
}
h2			{ 		/* for website title */
					font-size: 22pt; 
					font-weight: bold; 
					color:green; 
					text-align: center; 
					font-family: Georgia, "Times New Roman", Times, serif;  
					font-style: 
} 
h3			{ 		/* for section headings */
					font-size: 13pt; 
					font-weight: bold; 
					color: green; 
					text-align: center
} 
h4			{ 		 /* for section sub-headings */
					font-size: 12pt; 
					font-weight: bold; 
					color: green; 
					text-align: left
}
h5			{ 		 /* for section sub-sub-headings */
					font-size: 11pt; 
					font-weight: bold; 
					color: green; 
					text-align: left; 
					text-indent:20px
}
h6			{ 		/* for project statement in head below site title*/
					font-size: 12pt;	
					font-weight: bold; 
					color: white; 
					text-align : center;
} 
.calligraphy  	{ /*  for Adventurers/BLC page title */
					font-family:"Lucida Calligraphy", "Apple Chancery", Verdana; 
					font-size:18pt;
}
a:link		{ 		/* do not amalgamate link/visted/hover - doesn't work */
					color: blue; 
					font-weight: normal; 
					font-style:normal; 
					text-decoration:none;
}
a:visited	{ 
					color: blue; 
					font-weight: normal; 
					font-style:normal; 
					text-decoration:none;
}
a:hover	{ 
					color: blue; 
					font-weight: normal; 
					font-style:normal; 
					text-decoration:underline;
}

ul.norm li	{		list-style:disc;   /* this and codes below sets ul values back to default, having been lost on move from welney.css to welney-new css */
					margin-left:40px;
}
ul.norm li li {		list-style:circle;
					margin-left:40px;
}

ul.nav,
ul.nav2,
.listhead,
ul.heading,								/* styles a ul header as a title for nav bars */
ul.nav li:hover ul,		 			/* displays 2nd level when 1st hovered over. */
ul.nav ul.nav li:hover ul,			/* displays 3rd level when 2nd hovered over. */  
ul.nav ul.nav ul.nav li:hover ul	/* displays 4th level when 3rd hovered over. */  
	{
 					display: block;
 					list-style: none;
 					width: 200px;
 					height: auto;
}
ul.nav		{ 
					border: 1px green solid;  /* border is only on outer box */
					border-collapse: collapse; 
}
ul.heading, 
.listhead	{
					text-align:  center; 
					background-color:#ccff99; /* light green of site centre column */
					border: 1px green solid; 
					border-bottom: none;
}
ul.nav li		{
					display: block; 
					background: #ccffcc  ;  /* top level of index - ccffcc, fff99d, eaf3da, e0edc5 is pale soft greygreen*/
					text-align: left; 
					text-indent: 4px; 
					width: auto; 
					height: 20px; /* do not set to auto, display is awful & jumpy */
}
.level-1	{		
					border-top:0px green dotted ;/* 1px effectively boxes each line of top-level nav index; set to 0px to unbox*/
}
ul.nav a:link { 
					display: block;
} 
ul.nav a:hover	{ 
					display: block;  /* display:block in li & hover makes link & background colour spread fully across cell rather than just the text; */
					background:#ccffcc url(images/misc/hover.gif) repeat-x;	/*aed673;  c7e19e*/

}
ul.nav a:hover	{ 
					text-decoration:none; 
}
ul.nav ul.nav li,	
ul.nav ul.nav li ul,		
ul.nav ul.nav ul.nav li ul
		{
					background-color:#ccffcc;/* 2nd, 3rd & 4th levels;  same as ul.nav li:hover above */
} 

ul.nav li ul,		 				/* 2nd level */
ul.nav ul.nav li ul	,			/* 3rd level*/
ul.nav ul.nav ul.nav li ul	/* 4th level */
		{ 
					display: none; /* hides (until hovered over as below) */
} 
ul.nav li:hover ul,		 			/* displays 2nd level when 1st hovered over. */
ul.nav ul.nav li:hover ul,			/* displays 3rd level when 2nd hovered over. */
ul.nav ul.nav ul.nav li:hover ul	 /* 4th level */
		{ 
					overflow:visible; 
					position: relative; 
					left: 190px; 
					top: -16px;
					border: 1px green solid;	 /*  puts border around outer box, but not lines; seems to be inherited from ul.nav for 2nd level, but not the 3rd */
}

.smltxt      		{ font-size: 10pt }
.center     		{ text-align: center;}
.left				{ text-align: left }	 
.right          	{ text-align: right}
.bold				{ font-weight: bold }
.whitebkg      	{ background-color: white }
.white			{ color: white }
.black			{ color: black }
.red            	{ color: red }
.green         	{ color: green }
.yellow        	{ color: yellow }


.visitorcounter{
					 background: #FFFF99; 
					 height: 22px; 
					 border: 1px blue solid; 
					 border-collapse: collapse; 
					 text-align: center; 
					 vertical-align: top;
}

/* SIDE TABLES (st)   h is a heading, c  is a cell, co an open webpage, hx and cx are for external sites. 
Position, width and colour are incorporated. */
.st,				/* Side Table */
.st-c,				/* Side Table Cell */
.st-h,				/* Side Table Heading */
.st-hx,			/* Side Table Heading for eXternal Links */
.st-cx,			/* Side Table Cell for eXternal links */
.st-co	{		/*  ? */
					background:#f5f8ec; 
					border: 1px green solid; 
					border-collapse:collapse; 
					color:maroon; 
					height:20px; 
					width:200px;
}
.st			{
					height:auto;
}
.st-h		{
					background: #ccff99; 
					text-align:center
}
.st-c,
.st-cx,
.st-co	{
					text-align:left; 
					padding: 0 4px 0 4px
}
.st-hx		{		background:#fbe2b8; 
					text-align: center;
}
.st-cx		{		background:#fdebcf;
}
.st-co	{		background:#fef76e;
}
.st-c20	{		text-align:left; 
					text-indent: 5px
}

/* DATA TABLES (dt). are for data tables (dt) and data cells (dc) within tables.  Position, width and background colour are set separately */
.dt			{		width:100%; 
					background-color:white; 
					font-size:10pt; 
					text-align:left; 
					table-layout:fixed;
					border: 1px green solid
}
.dc,
.dc-h		{		border: 1px green dotted
}
.dc-h		{		background: #fbe2b8;
					
}
.dt,
.dc		{		border-collapse: collapse; 
					height:20px; vertical-align:top 
}
.dc,
.dc-h		{		padding: 2px 4px 2px 4px; /* top, right, bottom, left */
}
.dt,
.st,
.notes	{		table-layout: fixed /* instructs browsers to make all columns same width as first row */
}
.dc,
.notes			{ line-height: 140% }
.notes         	{ vertical-align:top; font-size: 10pt }	

.opacity50		{	opacity:0.50; /* firefox, opera, safari, chrome */
								-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=50)"; /* IE 8 */
								filter:alpha(opacity=50); /* IE 4, 5, 6 and 7 */
								zoom:1 /* so the element "hasLayout"  or, to trigger "hasLayout" set a width or height */
							 }
							 
.