body {
	color: black;
	border: 0;
	margin: 0;
	padding: 0;
	background-color: white;}

/* font-family: Verdana,Arial,Helvetica,sans-serif;font-size: 100%; affected sizes in toptitle */

/* need highest z-index to keep menus in front if spill below (no luck with overflow: visible; OR clip: auto; in LIs etc) Also need to keep pictures behind the grey items at the end, eg want RHS pictures in front of text that may stray across them */

/* thisdiv.all { position: absolute; top: 0; left: 0; width:644px; color: black; background: white; border-width: 0; border-style:solid;border-color:#eeeeee;padding: 0; border-spacing: 0; } this sets the page width absolutely to 644px, otherwise it can stretch */

/* ____________________________________________top-title items */

/*div#iframetop { position: absolute; top: 0; left: 1%; right: 1%;width: 100%; height: 160px; border: 0; margin: 0; padding: 0;color: black; background-color: transparent; background-repeat: repeat-x; background-position: left top; } this let me use an iframe but menu only changes what is inside the iframe*/

div#toptitle {
	position: absolute;
	top: 0;
	left: 1%;
	width: 100%;
	height: 160px;
	border: 0;
	margin: 0;
	padding: 0;
	color: black;
	background-color: transparent;
	background-repeat: repeat-x;
	background-position: left top;
	z-index: 400;
	font: italic small-caps bold 100% Verdana, "Lucida Grande", Lucida, sans-serif;}

/* main title of page along the top - only use here if all pages have same top picture, otherwise put it into the html file */

img.headerpix {
	width: 90%;
	height: 160px;
	left: 1px;
	right: 80px;
	margin-left: 168px;}

/* image behind title and menus */

div.marquee {
	position: absolute;
	top: 0;
	left: 28%;
	right: 28%;
	width: 75%;
	z-index: 300;
	height: 18px;
	font-variant: normal;
	color: yellow;}

/* for marquee, was font-size: 100%; as well as 16px ! MAKE COLOR TRANSPARENT OVER THE SUMMER */

.marquee, .font1 {
	border: 0;
	padding: 0;
	margin: 0;
	background: transparent;
	font: 14px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: yellow;
	text-align: center;}

/* for marquee, modifies the box height, but seems to be over-ruled on font by the div font type, size and colour MAKE COLOR TRANSPARENT & NON-OPAQUE (opacity: 0.0; filter:alpha(opacity=0); -moz-opacity: 0;) OVER THE SUMMER, YELLOW IN WINTER */

.hidden {
	display: none;
	position: relative;
	left; left: 1%;
	width: 98%;
	font: 11px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: black;
	margin-left: 0;
	background: white;
	overflow: scroll;}

/* message for those without stylesheets on */

h1 {
	position: absolute;
	top: 0;
	width: 80%;
	color: yellow;
	background: transparent;
	text-align: center;
	z-index: 450;
	text-decoration: none;
	font: italic bold 270% "Times New Roman",Times,Garamond,serif;
	white-space: normal;
	bottom: 97px;
	margin: 0 0 0 200px;
	right: 0;
	left: 0;}

/* for main header in front of top pictures */

h1.behind {
	position: absolute;
	width: 80%;
	color: black;
	background: transparent;
	text-align: center;
	z-index: 445;
	text-decoration: none;
	font: italic bold 270% "Times New Roman",Times,Garamond,serif;
	white-space: normal;
	left: 3px;
	bottom: 93px;
	top: 0;
	right: 0;
	margin: 0 0 0 200px;}

/* makes a drop shadow to header to help visibility in front of pictures */

div.menu {
	position: absolute;
	top: 70px;
	left: 1%;
	text-align: center;
	z-index: 600;
	width: 80%;
	border: 0;
	padding: 0;
	background-color: transparent;
	opacity: 0.8;
	filter: alpha(opacity=80);
	-moz-opacity: 0.6;
	right: 180px;
	margin-left: 160px;
	margin-right: 0;
	visibility: visible;
	overflow: visible;
	font: bold 13px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	color: black;}

/* for the menu was top: 80px; alpha set to 80% for IE6 - hover won't change it*/

div.menu:hover {
	position: absolute;
	top: 70px;
	left: 1%;
	text-align: center;
	z-index: 600;
	width: 80%;
	border: 0;
	padding: 0;
	background-color: transparent;
	opacity: 0.98;
	filter: alpha(opacity=98);
	-moz-opacity: 0.98;
	margin-right: 0;
	margin-left: 160px;
	right: 180px;}

/* alpha set to 98% for IE6 but hover won't set it - overidden by Javascript? */

.menu dl {
	display: list-item;
	float: left;
	width: 19%;
	padding: 0;
	list-style-type: none;
	border: 1px solid black;
	margin: 1px;
	background-color: transparent;}

/* fits 5 items OK for Mac and for IE6.0 in W98 */

.menu dt {
	display: list-item;
	margin: 0;
	padding: 0;
	list-style-type: none;
	cursor: pointer;
	color: black;
	font: bold 13px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	border: 0 solid black;
	background-color: white;}

/* the top headings, had border: 0px solid gray; */

.menu dd {
	display: none;
	border: 0;
	margin: 0;
	padding: 0;
	list-style-type: none;
	visibility: visible;
	overflow: visible;
	z-index: 600;
	font-size: 13px;
	color: black;}

/* contains each list of drop down cells */

.menu li {
	margin: 0;
	padding: 0;
	border-left: 0;
	border-right: 0;
	border-top: 0;
	border-bottom: 1px solid silver;
	list-style-type: none;
	text-align: center;
	background: white;
	z-index: 600;}

/* for each link cell */

.menu ul {
	border: 0;
	margin: 0;
	padding: 0;
	list-style-type: none;
	text-align: center;
	background: white;
	z-index: 600;}

.menu li a, .menu dt a {
	border: 0;
	margin: 0;
	padding: 0;
	list-style-type: none;
	text-decoration: none;
	display: block;
	height: 100%;
	font: 13px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	color: #0000FF;
	z-index: 600;}

/* unvisited, uncovered menu links are blue on white font: 13px*/

.menu li a:visited, .menu dt a:visited {
	border: 0;
	margin: 0;
	padding: 0;
	list-style-type: none;
	background: white;
	color: #CC0000;}

/* visited menu links are red on white */

.menu li a:hover, .menu dt a:hover {
	border: 0;
	margin: 0;
	padding: 0;
	list-style-type: none;
	background: #eeeeee;}

/* hovering menu links are red on gray */

a.thispage {
	border: 0;
	margin: 0;
	padding: 0;
	list-style-type: none;
	display: block;
	background: white ! important;
	color: #666666 ! important;}

/* grey letters on white for menu item of this page. Needs ! important to work in IE6 in W98 */

/* ______________________________________________ */

/*contentmain items */

div.contentmain {
	position: absolute;
	top: 170px;
	left: 1%;
	right: 1%;
	width: 98%;
	color: black;
	background: white;
	border-width: 0;
	padding: 0;
	border-spacing: 0;}

/* the main div for content, below the title -- removed vertical-align: top; */

div.line {
	border-style: solid;
	border-color: #FFFFFE;
	border-width: 0;
	width: 100%;
	height: 1px;
	background: white;
	padding: 0;
	font: 2px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: white;
	text-align: center;}

/* a whitish line to separate items on a coloured background */

img.pix100 {
	width: auto;
	max-width: 100%;
	height: auto;
	float: none;
	display: inline;}

/* Added Sep 2018*/

img.pix20 {
	width: auto;
	max-width: 20%;
	height: auto;
	display: inline;
	float: none;}

/* Added Sep 2018*/

contentmain p:first-letter {
	font-size: 115%;
	font-weight: bold;
	color: olive;}

/* */

p {
	position: relative;
	left: 1%;
	width: 98%;
	font: 13px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: black;
	margin-left: 0;
	background: white;}

p.bigger {
	position: relative;
	left: 1%;
	width: 98%;
	font: 15px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: black;
	margin-left: 0;
	background: white;}

/* bigger main text */

.font2 {
	font: 13px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: black;
	background: #FFFF00;}

/* only in the enquiry form in Contacts 
<br />
&amp; links.html */

div.flashinsert {
	position: absolute;
	top: 0;
	border-style: solid;
	border-color: #000000;
	border-width: 0;
	width: 98%;
	background: #000000;
	padding: 0px;}

/* black box on gallery pages for iframe insert of flash page */

div.box2 {
	position: absolute;
	border-style: solid;
	border-color: #FFFFFF;
	border-width: 0;
	width: 98%;
	background: #FFFF00;
	padding: 4px;
	font: 9px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: #000000;
	text-align: left;
	clear: both;
	z-index: 4;
	top: -500px;}

/* yellow box of text, on index page and others */

.font3 {
	font: 13px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: #000000;
	background: transparent;}

/* black text for light green box */

h2 {
	font-family: Garamond,Times,"Times New Roman",serif;
	color: black;
	font-weight: bold;
	font-size: 150%;
	line-height: 100%;
	text-align: center;
	margin-top: 0.3em;
	background: white;}

h3 {
	font-family: Garamond,Times,"Times New Roman",serif;
	font-size: 120%;
	font-weight: bold;
	color: #336633;
	background: white;
	position: relative;
	left: 1%;
	width: 98%;}

h4 {
	font-family: Garamond,Times,"Times New Roman",serif;
	font-size: 100%;
	font-weight: bold;
	color: #336633;
	background: white;
	position: relative;
	left: 1%;
	width: 98%;
	padding-top: 5px;
	border-top: 5px;
	border-bottom: 0;
	border-left: 0;
	border-right: 0;
	border-color: #eeeeee;
	border-style: solid;
	z-index: 110;}

a:link {
	background: white;
	font: normal 13px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: #0000FF;
	text-decoration: none;}

/* blue unvisited links */

a:visited {
	background: white;
	font: normal 13px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: #CC0000;
	text-decoration: none;}

/* red visited links */

a:hover {
	text-decoration: none;
	background: #dddddd;
	font: normal 13px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: #0000FF;}

/* hovering over links, light blue (was grey) background */

a:active {
	text-decoration: underline;
	background: #eeeeee;
	font: normal 13px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: #CC0000;}

/* active links */

a.bigger:link {
	background: white;
	font: normal 15px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: #0000FF;
	text-decoration: none;}

/* blue unvisited links */

a.bigger:visited {
	background: white;
	font: normal 15px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: #CC0000;
	text-decoration: none;}

/* red visited links */

a.bigger:hover {
	background: #dddddd;
	font: normal 15px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: #0000ff;
	text-decoration: none;}

/* red visited links */

a.dontprint:link {
	background: white;
	font: normal 13px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: #0000FF;
	text-decoration: none;}

/* in maccsprint this is made white so that printing css makes this "go to top" link blank, blue for normal link */

form.joinform {
	font-size: 13px;
	background-color: #eeeeee;}

select, textarea, submit {
	position: relative;
	margin: 0;
	width: 85%;
	font: 12px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: black;
	background: #FFFFcc;}

/* for the Google search */

input {
	margin: 0;
	font: 12px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: black;
	background: #FFFFcc;}

/* for the form input fields (and button holes) */

input.radiobutton {
	margin: 0;
	font: 12px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: black;
	background: transparent;}

/* for the form radiobuttons to keep background coloured*/

input.searchbutton {
	margin: 0;
	width: 16%;
	font: bold 13px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: black;
	background: #CCFFCC;
	padding: 0;}

/* for the Google search field */

input.printer {
	margin: 0;
	width: 60%;
	font: bold 13px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: black;
	background: #CCFFCC;
	padding: 0;}

/* for the print button */

ul {
	padding-left: 3em;
	padding-bottom: 0.1em;
	font: 13px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: black;
	background: white;
	list-style-type: disc;}

ol {
	padding-left: 2.5em;
	padding-bottom: 0.1em;
	font: 13px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: black;
	background: white;
	list-style-type: decimal;}

ol.lroman {
	padding-left: 4em;
	padding-bottom: 0.0em;
	font: 13px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: black;
	background: white;
	list-style-type: lower-roman;}

ol.lalpha {
	padding-left: 5em;
	padding-bottom: 0.1em;
	; color: black;
	background: white;
	list-style-type: lower-alpha;
	font: 11px Verdana, "Lucida Grande", Lucida, sans-serif;}

li {
	margin: 0;
	padding-bottom: 0.8em;
	color: black;
	background: white;
	line-height: 120%;}

/* black type in lists */

dl {
	margin: 0;
	padding-left: 5em;
	padding-right: 18em;
	padding-bottom: 0.8em;
	font-style: italic;
	color: black;
	background: white;
	line-height: 120%;}

/* black type in lists */

img.acrobat {
	width: 88px;
	margin: 0;
	padding: 0;
	border: 0;
	color: #000000;
	background: transparent;}

/* acrobat gif - acrobat reader button */

/* ______________________________________________ */

/*left and right boxes under heading in contentmain */

div.leftright {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	padding: 0;
	border-width: 0;
	background: transparent;
	margin-left: 0;
	z-index: 40;
	clear: right;
	border-style: hidden;
	right: 0;
	bottom: 0;}

/* box for lefttext on LHS and rightpicture on RHS */

div.lefttext {
	position: relative;
	top: 0;
	left: 0;
	width: 60%;
	padding: 0;
	background: transparent;
	margin-left: 0;
	clear: right;
	z-index: 50;
	border: 0 none black;}

/* box for text on LHS of a picture in content area */

div.righttext {
	position: absolute;
	top: 0;
	width: 33%;
	padding: 0;
	background: transparent;
	margin-left: 0;
	clear: none;
	z-index: 60;
	border: 0 none black;
	left: 67%;}

/* box for text on RHS of a picture in content area */

div.rightpicture {
	position: absolute;
	top: 0;
	width: 100%;
	padding: 0;
	background: transparent;
	margin-left: 0;
	clear: none;
	z-index: 60;
	border: 0;
	left: 0%;}

/* box for pictures on RHS of some text in content area */

div.rightmap {
	position: absolute;
	top: 0;
	width: 33%;
	padding: 0;
	background: transparent;
	margin-left: 0;
	clear: none;
	z-index: 60;
	border: 0;
	left: 67%;}

/* box for map picture on RHS of some text in content area */

div.righttextbox {
	width: 250px;
	margin: 0px;
	padding: 1px;
	border-width: 5px;
	border-style: solid;
	border-color: #eeeeee;
	background: transparent;
	z-index: 120;
	float: right;}

/* box for small text inserts on RHS of some text in content area - NOT USED because float not OK in IE*/

.fontbox {
	font: normal 13px Verdana,Arial,Helvetica,sans-serif;
	color: #BBBBBB;
	text-align: center;
	padding: 0;
	margin: 0;
	width: 90%;
	background: white;
	z-index: 130;
	border: 1px solid #eeeeee;}

/* for text in box floating right of main text, but float: right; not OK in IE */

/* ______________________________________________ */

/*boxes at the bottom of the page */

div.box {
	position: relative;
	left: 0;
	right: 0;
	top: 0;
	width: 100%;
	height: 260px;
	background: #dedede;
	border: 0;
	padding: 0;
	margin: 0;
	color: gray;}

/* includes end boxes, at bottom of pages - removed border-spacing: 0; border-width: 0; border-color: white; border-style: solid;*/

div.boxesatend {
	position: absolute;
	top: 20;
	width: 32%;
	margin: 0;
	padding: 0;
	border-left: 0;
	border-right: 1px;
	border-top: 0;
	border-bottom: 0;
	border-style: solid;
	border-color: white;
	background: #dedede;
	font: 10px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: black;
	text-align: center;
	z-index: 300;}

/* general properties of end boxes */

#boxleft {
	position: absolute;
	left: 0;
	padding-right: 0;
	top: 105px;
	overflow: visible;
	visibility: visible;}

/* left hand 1/3 box of text */

#boxmiddle {
	left: 33.5%;
	padding-right: 0;
	top: 105px;
	overflow: visible;
	z-index: 7;}

/* middle 1/3 box of text */

#boxright {
	right: 0;
	margin: 0;
	padding: 0;
	border: 0;
	top: 105px;}

/* RH 1/3 box of text */

p.c1 {
	position: relative;
	bottom: 0;
	font: 10px Verdana, "Lucida Grande", Lucida, sans-serif;
	text-align: center;
	border: 0;
	left: 0;
	width: 100%;
	color: black;
	background: #dedede;
	z-index: 350;}

/* for fine print box, full width */

p.c3 {
	font: normal 10px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: black;
	background: #dedede;}

p.c3print {
	font: normal 10px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: black;
	background: #dedede;}

/* used in maccsprint for the fine print items not to be printed */

.fontc1b {
	font: bold 14px Verdana, "Lucida Grande", Lucida, sans-serif;
	text-align: center;
	border-width: 0;
	left: 0;
	width: 100%;
	color: black;
	background: #dedede;
	z-index: 100;}

/* for fine print box biggest text */

a.greyback:link {
	background: #eeeeee;
	font: normal 10px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: #0000ff;
	background: #dedede;
	text-decoration: none;}

/* blue unvisited links, grey background */

a.greyback:hover {
	text-decoration: underline;
	background: white;
	font: normal 10px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: #0000ff;
	background: #dedede;}

/* hovering over links, underlined, changes to white background */

a.greyback:visited {
	background: #dedede;
	font: normal 10px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: #CC0000;
	text-decoration: none;}

/* red visited links */

img.valider {
	width: 88px;
	height: 31px;
	margin: 0;
	padding: 0;
	border: 0;
	color: #dedede;
	background: #eeeeee;}

/* W3C/CSS validation buttons */

a.plainlink {
	background: #eeeeee;
	font: normal 11px Verdana, "Lucida Grande", Lucida, sans-serif;
	color: #000000;
	text-decoration: none;}

/* plain link */

tr {
	font: 13px Verdana, "Lucida Grande", Lucida, sans-serif;
	text-align: left;
	border: 0;
	left: 0;
	width: 100%;
	color: black;
	background: #eeeeee;
	visibility: visible;
	overflow: scroll;
	border-right: 3px solid gray;
	border-top: 3px solid gray;}

td.blank {
	background-color: transparent;
	visibility: visible;
	border-bottom: 3px solid silver;
	border-right: 3px none silver;
	border-left: 3px solid silver;
	border-top: 3px solid silver;
	opacity: 0;
	filter: alpha(opacity=0);
	-moz-opacity: 0;}

tr.centred {
	font: 13px sans-serif, "Lucida Grande", Lucida, Verdana;
	text-align: center;
	border: 0;
	left: 0;
	width: 100%;
	color: black;
	background: #eeeeee;
	visibility: visible;
	overflow: scroll;
	border-left: 5px none gray;
	border-bottom: 3px none silver;}

td.centredpicture {
	font: 13px Verdana, "Lucida Grande", Lucida, sans-serif;
	text-align: center;
	left: 0;
	width: 33%;
	color: black;
	background: #eeeeee;
	visibility: visible;
	border-bottom: 3px solid silver;
	border-right: 3px none silver;
	border-left: 3px solid silver;
	border-top: 3px solid silver;
	opacity: 1;}

td.centredtext {
	font: 13px Verdana, "Lucida Grande", Lucida, sans-serif;
	text-align: left;
	width: 10%;
	color: black;
	background: #eeeeee;
	visibility: visible;
	border-bottom: 3px solid silver;
	border-right: 3px solid silver;
	border-top: 3px solid silver;
	padding-right: 1px;}

/* ______________________________________________ */

hr {
	color: #dedede;
	height: 5px;
	background-color: gray;
	border-bottom-style: solid;
	width: 100%;}

/* macc.css last modified 4-2-07 by Dutyhog. This site looks best with recent browsers. It is OK with Netscape 6 and 7, Explorer 5, Opera 8 (but not resizing), Safari 3 and Firefox 2 for Mac OSX, and with Explorer 6.0 in Windows 98. IE 5.01 on Windows NT 5.06.0 had a problem. It may be poor with other browsers, especially earlier ones, including IE5 for Windows. Used with XHTML1.0 transitional. Last validated 8-1-05 */

/* link rel="stylesheet" href="macc.css" */

/* grey color is #eeeeee */

/* blue color:rgb(80,80,80) is #0000FF */

/* yellow background-color:##FFFF00 */

table {
	empty-cells: hide;}