body		{ background: url('../images/bgnd.jpg') repeat-y; }
body,
input	{
	font-family: Verdana, Arial, Tahoma, Helv, Helvetica, Sans-Serif;
	font-size: 10pt;
	border-width: 1px;
	}
body.print	{ width: 197mm;
			  margin: auto;
			  position: relative; top: -3mm;
			  background: white	}
	
input[type=text], input[type=password] {
	padding: 2px;
	}
input[disabled] {
	border: 0;
	color: black;
	}
select					{ border: 1px solid #808080	}
a:focus, input:focus[type=text], input:focus[type=password], abbr:focus, select:focus	 		{ background: yellow	}
select:focus option,
select:focus optgroup	{ background: white	}
select:hover, input:hover[type=button]	{ cursor: pointer	}
              
h1          {	font-size: 180%; 
			 	font-weight: bold;
			 	padding: 10px 0 5px; }
h2          {	font-size: 133%; font-weight: bold }
h3          { 	font-size: 100%; 
				font-weight: bold;
				margin:	5px 0;}
h4			{ 	font-size: 100%; 
				font-weight: bold;
				font-style: italic;
				color: red;
				text-align: center;
				margin:	5px;}				
h5			{ font-size: 133%; 
			  font-weight: bold;
			  background-color: green;
			  color: white;
			  text-align: left;
			  padding: 5px;
			  margin: 10px 0}
h5.archive  { text-align: center;
			  padding: 5px 0;
			  margin: 5px 0}			 
h6 { 
	width: 250px;
	margin: 10px auto;
	padding: 5px;
	font-weight: normal;
	font-size: 8pt;
	font-style: oblique; 
	background-color: green;
	color: white;
	text-align: center;
	overflow: auto;
	}			  
p			{ font-size: 10pt; 
			  margin-top: 5px;
			  margin-bottom: 5px }
tt			{ font-family: Verdana, Arial, Tahoma, Helv, Helvetica, Sans-Serif; 
			  position: relative;
			  top: -0.5em;
			  font-size: 0.75em;
			  margin-left: 0.1em	}
em			{ font-weight: bold;
			  font-style: normal;
			  color: red	}
mark		{ background-color: #FF80FF	}
			  
ol          { 
	font-size: 10pt;
	overflow: auto;
}

ul				{	margin-top: 0;
					margin-bottom: 0;	}
ul li  		    { 	list-style-image: url('../images/hoop.gif');
			  		line-height: 16px;
				  	padding: 5px 0 3px 25px;	
					margin-top: 2px;		}
ul ul li		{	list-style-image: url("../images/redball.gif");
					background: none;
			  		padding: 0;
			  		left: 0}			  

ul ul ul li		{	list-style-image: url("../images/yellowball.gif"); }
ul ul ul ul	li	{	list-style-image: url("../images/blueball.gif"); }
address		{	text-align: right	}

.left		{	text-align: left	}				/*	replaces align='left'	*/
.center		{	text-align: center	}				/*	replaces align='center'	*/
.right		{	text-align: right	}				/*	replaces align='right'	*/
.top		{	vertical-align: top	}				/*	replaces align='top'	*/
.bottom		{	vertical-align: bottom }			/*	replaces align='bottom'	*/
caption.top		{	caption-side: top	}
caption.bottom	{	caption-side: bottom	}

form option[disabled] {
	color: #CCC
	}

/*	--------- vertical menus -------- */
ul.summary 				{	margin: 0; 
							padding: 0;	}
ul.summary li			{	background: none;
							line-height: 25px;
							left: 0;
							text-indent: 0;
							padding: 0; 
							margin: 0;	}							
/*	------------ top menu ----------- */
ul.hmenu,
ul.hmenu ul		{ 	background: green;
					padding: 0;	}

ul.hmenu		{	display: inline-block;
					margin: 0;	}
ul.hmenu ul		{ 	display: none;									/* cascading submenu, default: hidden	*/
					position: absolute;	
					top: 24px; 
					left: 0;
					margin: 0;
					z-index: 2;
					text-align: left;	}
ul.hmenu img	{	position: relative;	 left: -2px;	}			/* 'cos icons have 2px of transparency	*/
ul.hmenu li		{	display: block;
					background: green;
					position: relative;
					left: 0;
					white-space: nowrap;
					margin: 0;	}
ul.hmenu>li		{	display: inline-block;
					font-weight: bold;
					padding: 0	}
ul.hmenu ul.rmenu	{	left: -70px	}

ul.hmenu a		{	display: inline-block;
					color: white;
					text-decoration: none;	}
ul.lime	a,
ul.hmenu a.nolink:focus,
ul.hmenu a.nolink:hover		{	color: lime;	}
							
ul.hmenu>li>a	{	margin: 0;
					padding: 4px 10px; }
					
ul.hmenu ul li		{	list-style-image: none;						/*	needed for older IE */
						font-weight: normal;
						padding: 2px 10px;	}
ul.hmenu ul li a	{	padding: 0;}

ul.hmenu li:hover ul	{	display: block;	}						/*  reveal cascading submenu by mouseover	*/

ul.hmenu li>a:hover,
ul.hmenu li li:hover a	{	color: yellow }							/*	show yellow text for focus/mouseover	*/
ul.hmenu a:focus,
ul.hmenu a:hover		{	background: green;
							color: yellow;
							text-decoration: underline;	}			/*	underline links only when selected	*/

ul.hmenu li.self,
ul.hmenu li.self>a,
ul.hmenu li.self>a:hover,
ul.hmenu li li.self:hover,
ul.hmenu li.self>a:focus	{	background: #00C000;	}

ul.hmenu a.nolink,
ul.hmenu a.nolink:focus,
ul.hmenu a.nolink:hover		{	text-decoration: none;
								cursor: default;		} 			/* never underline if nolink	*/

#header			{	width: auto;
					min-width: 560px;
					min-height: 100px;	}
#header>a>img	{	position: absolute;	}
#header #searchbox		{	float: right;
							padding: 0;
							margin: 1px 0 0 6px;	}
#header #searchbox	input,
#header #searchbox	button		{	float: right;	}
#header #searchbox	input		{	width: 150px;
									color: #D0D0D0	}
#header #searchbox	button		{	width: 20px;
									height: 20px;
									margin: 1px;
									background: transparent;
									border: 0;
									padding: 0	}
#header #searchbox	button:hover	{	cursor: pointer;	}
#header h1			{	text-align: center;
						margin:	3px 145px 10px; }
#header h1 i	{	
	font-size: 10pt;
	}
#header h1 br {
	display: none;
	}

header		{	overflow: auto;
				height: 120px;
				margin: 2mm;
				position: relative;	}
header img	{	position: absolute; top: 2mm }
header h1	{	margin: 30px 0 0;
				width: 100%;
				text-align: center;	}
header h1 i	{	font-size: 10pt;	}
footer		{	/*	break-after: always;	*/
				margin: 2mm;	}

#topmenu		{	background: green;
					margin: 0 0 0 80px;
					text-align: center;
					position: relative; 
					z-index: 2	}					
#archmenu,
#crumbs			{	width: auto;
					text-align: center;
					margin: 0 0 0 80px;	}
#archmenu,
#crumbs			{	background: green;
					border-top: 2px solid white;	}					

#archmenu h2	{	float: left;
					margin: 4px 10px;
					text-align: left;
					font-size: 100%;
					color: #C0C0C0 }
#archmenu h2+h2	{	float: right;	}

#crumbs			{	text-align: left;
					padding: 0;
					margin-bottom: 0;
					color: white	}
#crumbs ul		{	height: 18px;
					padding: 0 0 0 10px;	}											
#crumbs li		{	display: inline;
					float: none;
					margin: 0;
					padding: 0; }
#crumbs a		{	margin: 0;
					padding: 0 2px 2px;	}
#crumbs li,
#crumbs a.nolink	{	color: white;	
						font-weight: normal;
						cursor: default	}

/*	--------------------------------- */
img				{	border: 0; }
img.thumb		{	cursor: pointer	}
div.img_r		{	float: right;
					padding: 5px 0 10px 10px;
					text-align: center;
					font-style: italic;		}
div.img_l		{	float: left;
					padding: 5px 10px 10px 0;
					text-align: center;
					font-style: italic;		}
div.img_c		{	margin: auto;
					padding: 5px 10px 10px;
					text-align: center;
					font-style: italic;		}
					
table				{	margin: auto;
						font-size: 10pt;
						border-width: 0;
						border-spacing: 0;
						border-collapse: collapse; }
tr.season_start td,
tr.season_start th	{	border-top: 2px solid black	}
tr.season_end td,
tr.season_end th	{	border-bottom: 2px solid black	}
										 	
td.month,
td.year				{	background-color: #FFFFC0;
					   	font-weight: bold;
					   	border: 1px solid black; 
			   			text-align: left }
.ac14				{	background-color: #FFFFD0;	}					 	
.ac26				{	background-color: white;	}

table.gallery		{	margin: auto	}
table.gallery td	{	text-align: center;
						vertical-align: top;
						padding: 5px 0;	}
div.gallery			{	margin: auto;
						text-align: center	}
div.gallery td		{	text-align: center	}
div.gallery h6		{	width: 250px; 
						margin: 5px auto}
div.gallery p		{	text-align: justify;
						padding: 0 5px	}
.gallery img,
div.gallery img		{	border-width: 0; 
						margin: 5px;	}
div.gallery em		{	color: blue	}
div.gallery h3 em	{	font-weight: bold}
div.gallery p em	{	font-weight: normal;
					 	font-style: italic	}
.gallery a:focus,
div.gallery a:focus			{	background: transparent;	}
.gallery a img:hover,
div.gallery a img:hover		{	border: 2px solid blue;
								margin: 3px;
								cursor: zoom-in	}

td.competition_info	{	text-align: justify;
						padding: 10px 30px;
						margin-bottom: 5px; 	}
p.provisional		{	color: red;
						margin: 10px 0 0;
						font-style: italic;
						}											
.icon		 { 	vertical-align: text-bottom;
				width: 20px;
				height: 16px }
.archive 	 { 	border: 0;
			   	background-color: #008000;
			   	color: #FFFFFF;
			   	font-weight: bold;
			   	font-size: 133%;
			   	vertical-align: middle;
			   	text-align: center;
			   	width: 100%}
dl.info				{ 	display: inline;
						margin: 0;	}
dl.info	dt			{ 	color: blue;
						font-style: italic	}
dl.info dd			{ 	display: none;
						position: absolute;
						width: 200px;
						border: 1px solid grey;
						background-color: #FFFFD0;
						z-index: 2;
						padding: 5px	}
dl.info:hover dd	{ 	display: block	}
div.match_info	{	text-align: justify;
					padding: 10px 0;
					border-bottom: thin solid; 
					margin-bottom: 5px; 	}

#title h1				{	margin: 10px 0 10px 60px;	}

#footer	{
	clear: both;
	margin-top: 13px;
	padding-top: 2px;
	border-top: 1px solid grey;
	font-style: italic;
	}
#footer table	{	width: 100%;
					font-size: smaller; 	}
#footer	td	 	{	text-align: left;
					width: 25%;
					padding: 5px;	}
#footer table td+td 	{ text-align: center;	}
#footer table td+td+td+td 	{ text-align: right;	}

div.policy {	
	max-width: 800px;
	padding: 0;
	margin: 0 auto;
	text-align: justify;
	}
div.policy ol {
	padding: 0 0 0 18px;
	}
div.policy li {
	margin: 5px 0;
	}
div.policy h3 {
	margin-top: 15px;
	}
.GC_WHITE, .WHITE, td.WHITE	{	background-color: white;	}
.GC_YELLOW, .YELLOW			{	background-color: #FFFFC0;	}
.GC_BLUE, .BLUE				{	background-color: #C0FFFF;	}
.GC_GREEN, .GREEN			{	background-color: #D0FFD0;	}
.GC_PINK, .PINK				{	background-color: #FFD8E8;	}
.GC_ORANGE, .ORANGE			{	background-color: #FFD0A0;	}
.GC_BLACK, .BLACK			{	background-color: #E8E8E8;	}
.GC_RED, .RED				{	background-color: #FFD0D0;	}
.GREY						{	background-color: #E0E0E0;	}

.hilite				{	font-weight: bold;
						color: red;
						margin: 5px 0;	}

#course 		{	display: none;		 /* only display shortly before start of course */
					padding: 10px;	
					margin: 5px 0;
					border: 3px solid red;
					background-color: #FFFFD0;
					font-weight: bold;
					color: red;
					text-align: center	}

					
/* -------------------- calendars -------------- */
#calendar	{
	width: 900px;
	margin: auto;
	}
#calendar table	{
	width: 100%;
	max-width: 900px;
	border-collapse: collapse;
	}

#calendar #info span		{	float: right;	}
#calendar #info form		{	float: left;
								margin: 10px 50px	}
#calendar #info td div		{	margin: 15px 50px 0;
								overflow: auto;
								white-space: nowrap	}
#calendar #info td+td+td	{	text-align: right;
								padding: 0 0 10px 10px 	}
#calendar #info img+a		{	position: relative; top: -10px	}
 
#calendar #info h2			{	margin: 0;	}

#calendar #club_days {
	width: 550px;
	margin: auto;
	}
#calendar #club_days td	{	
	border: 1px solid black;
	padding: 5px;
	white-space: nowrap;
	}
#calendar #club_days td,
#calendar #club_days td+td+td	{
	text-align: left;
	}
#calendar #club_days td+td	{	
	text-align: center;
	}

#calendar>p			{	text-align: justify	}						

#calendar_tbl			{	width: 100%;
							max-width: 900px	}
#calendar_tbl caption	{	text-align: left;
							font-style: italic;
							padding: 2px	}
#calendar_tbl th 	{	border: 1px solid #808080;
						padding: 5px;
						text-align: left;
						width: 20%	} 
#calendar_tbl th+th 			{	text-align: center;
									width: 5%	}
#calendar_tbl th+th+th 			{	text-align: center;
									width: 40%	}
#calendar_tbl th span			{ 	float: left; }
#calendar_tbl th span.toggle	{ 	float: right; }
#calendar_tbl td 				{	border: 1px solid #808080;
									line-height: 18px; 
			   						padding: 3px 5px;
			   						white-space: nowrap }
calendar_tbl td:first-child i	{
	white-space: normal;
	}
#calendar_tbl td+td+td+td		{	white-space: normal	}
#calendar_tbl td img 			{ 	margin: 2px 0;	}
#calendar_tbl td.month img,
#calendar_tbl td.year img		{ 	position: relative;
									top: 2px }

#calendar_tbl table.group 		{	margin: 0;
									border: 0	}
#calendar_tbl table.group td,
#calendar_tbl table.group th	{	border: 0;
									vertical-align: top;
									text-align: left;
			   						white-space: nowrap	}
#calendar_tbl table.group td	{	padding: 0 15px 0 0	}
#calendar_tbl table.group th	{	font-weight: bold;
									width: auto;
									padding: 0 5px 0 0	}

#calendar_key			{	
	width: 650px;
	margin: 0
}
#calendar_key caption	{	
	margin: 15px 5px 0;
	text-align: left;
	font-style: italic;
	font-size: xx-small	
}
#calendar_key td	{
	border: 0;
	padding: 5px 5px 5px 0;
	white-space: nowrap;
	vertical-align: middle	
}

.print #calendar		{	width: 100%;
							max-width: 197mm;	}
.print #header			{	margin: 0 0 5px;	}
.print #header h1		{	padding-top: 30px;	}
.print #footer			{	padding: 0 5px;
							text-align: right	}
/*----------- Tour photos ------------------------------*/
#tour_photos {
	max-width: 1100px;
	margin: auto;
	}
#tour_photos>p	{
	width: 800px;
	margin: auto;
	text-align: right;
	}
#tour_photos div.gallery p	{
	text-align: center;
	margin: 10px auto;
	}
/*----------- Misc -------------------------------------*/
pre							{	color: blue;	}
pre em						{	white-space: normal	}
.print pre.debug			{	display: none	}

.error						{	font-weight: bold;
								color: red	}
#timers			{	margin: 10px 0	}
#timers th,
#timers td		{	text-align: left;
					padding: 2px 10px	}

#logo				{	margin: 5px;
						position: absolute; }
#resetflags			{	position: absolute; right: 0;	}
#resetflags input	{	padding: 3px 10px 2px;
						border: 1px solid red;	
						background-color: yellow;
						font-weight: bold;
						color: red	}

div.report					{	margin: 10px 0;	}
div.report,
div.report p				{	text-align: justify	}

form.contact					{	width: 450px;
									float: left	}
form.contact label				{	display: inline-block;
									width: 60px	}
form.contact div label			{	width: auto	}
form.contact input				{	margin: 5px	0 	}
form.contact fieldset 			{	margin-top: 15px	}
form.contact fieldset i			{	font-size: smaller;	}
form.contact textarea			{	width: 430px;
									height: 150px;
									margin: 5px auto	}
form.contact div img			{	margin: 0 5px	}
form.contact div input			{	margin: 0	}
form.contact img+input			{	position: relative; top: -4px;
									font-size: 120%;}
form.contact label+input			{	width: 22em	}
form.contact input[type=tel]		{	width: 8em	}
form.contact input[type=submit]		{	float: right;
										margin-top: 12px;
										font-size: 100%	}
#covid19,
#bookings	{	
	max-width: 820px;
	text-align: center;
	padding: 10px;
	font-weight: bold;	
}
#covid19	{
	margin: 10px auto 0;
	border: 3px solid red;
	background: #FFFFE0;
	color: red;
}
#bookings	{	margin: 0 auto;	}
#bookings i {
	font-weight: normal;
}
#bookings button.bookings	{
	padding: 3px 5px;
}

span.bookings button,
button.bookings	{
	border: 3px solid red;
	padding: 10px 15px;
	background: #FFFFD0;
	font-weight: bold;
	color: red;
	border-radius: 20px;
	overflow: hidden;
	}
span.bookings button:hover,
button.bookings:hover {
	position: relative;
	top: -1px; left: -1px;
	cursor: pointer; 
	background: #FFFFA0;
	filter:	drop-shadow(1px 2px 1px black);
	}
span.email_info {
	font-style: italic;
	font-size: smaller;
	margin-left: 15px;
	}