/*	undohtml.css
(CC) 2004 Tantek Celik. Some Rights Reserved.
http://creativecommons.org/licenses/by/2.0
This style sheet is licensed under a Creative Commons License.

Purpose: undo some of the default styling of common (X)HTML browsers */

/*	link underlines tend to make hypertext less readable, because underlines
obscure the shapes of the lower halves of words */

:link, :visited { text-decoration: none; }

/*	no list-markers by default, since lists are used more often for semantics */
ul, ol { list-style: none; }

/*	avoid browser default inconsistent heading font-sizes and pre/code too */
h1, h2, h3, h4, h5, h6, pre, code
{
	font-size: 1em;
	/* text-transform: lowercase; */
}

/*	remove the inconsistent (among browsers) default ul,ol padding or margin
the default spacing on headings does not match nor align with normal
interline spacing at all, so let's get rid of it. Zero out the spacing
around pre, form, body, html, p, blockquote as well form elements are oddly
inconsistent, and not quite CSS emulatable. Nonetheless strip their margin
and padding as well */

ul, li, h1, h2, h3, h4, h5, h6, pre, sup, form, body, html, p, blockquote, fieldset, input
{
	margin: 0;
	padding: 0;
}

table, tr, th, td
{
	margin: 0;
	padding: 0;
}

/*	whoever thought blue linked image borders were a good idea? */
a img, :link img, :visited img { border: none; }

/*	de-italicize address */
address { font-style: normal; }

/*	Phoenix Aikido site styles start here. First we remove some unwanted
display properties from some additional elements. */

dl dd, hr, legend, .text-only { display: none; }
fieldset { border: none; }
a>img { vertical-align: bottom; }

a:link, a:focus
{
	color: rgb(0,66,81);
	background-color: inherit;
}

a:visited
{
	color: rgb(108, 108, 108);
	background-color: inherit;
}

a:hover, a:active
{
	color: rgb(236, 28, 36);
	background-color: inherit;
}

body
{
	margin: 0;
	padding: 0 0 20px 0;
	color: black;
	background-color: white;
	font-family: Helvetica Neue, Arial, Helvetica, Verdana, Trebuchet, sans-serif;
	font-size: 10pt;
	line-height: 1.4em;
}

/*	Wrap the whole page in a container that sets the width of the content
and centre aligns it within the viewport. */

div#wrapper
{
	width: 956px;
	margin: 0 auto;
}

/*	Image that creates the rounded corners at the top of the page. */
div#top-edge
{
	margin-top: 20px;
	height: 20px;
	background-image: url(/themes/greencrystal/backgrounds/page-top-edge.png);
	background-repeat: no-repeat;
}

div#bottom-edge
{
	height: 16px;
	background-image: url(/themes/greencrystal/backgrounds/page-bottom-edge.png);
	background-repeat: no-repeat;
}

/*	Holds the background gradient for the navigation sidebar. */
div#container
{
	position: relative;
	/* Internet Explorer needs the height declaration to draw the page properly. */
	height: 100%;
	background-color: rgb(208,242,230);
	background-image: url(/themes/greencrystal/backgrounds/side-bar-background.png);
	background-repeat: repeat-y;
	background-position: left top;
}

/*	This is the main content of the page. */
div#content
{
	position: relative;
	min-height: 828px;
	height: auto;
	margin-left: 182px;
	background-image: url(/themes/greencrystal/backgrounds/content-background.png);
	background-repeat: repeat-y;
	background-position: right top;
	padding: 15px 50px 20px 50px;
}

/* for Internet Explorer */
/*\*/
* html div#content { height: 764px; }

/**/
/*	The large Phoenix logo embossed on the bottom right of the page. */
div#watermark-content
{
	position: absolute;
	right: 0;
	bottom: 0;
	width: 447px;
	height: 431px;
	background-image: url(/themes/greencrystal/backgrounds/phoenix-watermark.png);
	background-repeat: no-repeat;
	background-position: right bottom;
}

/*	The bamboo motif embossed into the navigation bar. */
div#watermark-navigation
{
	position: absolute;
	left: 0;
	bottom: 0;
	width: 156px;
	height: 367px;
	background-image: url(/themes/greencrystal/backgrounds/bamboo-motif.png);
	background-position: left bottom;
	background-repeat: no-repeat;
}

/*	The enclosing block for the navigation. */
div#navigation
{
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 157px;
	padding-left: 4px;
	color: white;
	background-color: transparent;
	font-size: 11pt;
	line-height: 1.6em;
	/*	This would be the neatest way to add the bamboo motif to the sidebar, but Internet Explorer
		refused to draw the image at the bottom of the content, so we have to do it with a less stylish hack.
	background-image: url(/themes/greencrystal/backgrounds/bamboo-motif.png);
	background-position: left bottom;
	background-repeat: no-repeat;
	*/
}

div#navigation ul
{
	/* position: relative; */
	list-style-type: none;
	/* list-style-image: url(/themes/greencrystal/backgrounds/gloss-disc.png); */
}

div#navigation ul.top-level-links
{
	margin-left: 16px;
	margin-bottom: 12px;
}

div#navigation ul li a
{
	padding-left: 16px;
	line-height: 16px;
	font-size: 14px;
	background-image: url(/themes/greencrystal/backgrounds/list-disc.gif);
	background-position: -138px 0;
	background-repeat: no-repeat;
}

div#navigation ul ul li a
{
	font-size: 12px;
	background-image: url(/themes/greencrystal/backgrounds/list-disc-small.gif);
}

div#navigation ul li a:hover, div#navigation ul li a:focus { background-position: 0 0; }
div#navigation ul ul { padding-left: 10px; }

div#navigation h3
{
	text-align: center;
	margin-bottom: 4px;
}

/*	Push the list of links down to make room for the home button. */
div#navigation ul#main-links { margin-top: 174px; }

/*	Hide the list element that contains the home page link. */
a#home-link em { display: none; }

/*	Take the home page link out of the flow of the document, and set the background image. */
a#home-link
{
	visibility: visible;
	position: absolute;
	width: 124px;
	height: 126px;
	top: 20px;
	left: 30px;
	background-image: url(/themes/greencrystal/backgrounds/home-button.png);
	background-repeat: no-repeat;
	background-position: left top;
}

a#home-link:active, a#home-link:hover { background-position: right top; }

div#navigation a:link
{
	color: white;
	background-color: inherit;
}

div#navigation a:visited
{
	color: rgb(208,242,230);
	background-color: inherit;
}

div#navigation a:active, div#navigation a:hover
{
	color: yellow;
	background-color: inherit;
}

img#phoenix-logo
{
	width: 313px;
	height: 314px;
	padding-top: 10px;
	padding-bottom: 30px;
	margin: 0 auto 15px auto;
	display: block;
}

h1#club-name
{
	font-size: 16pt;
	text-align: center;
	margin-bottom: 5px;
}

div.text-block
{
	width: 100%;
	margin-top: 15px;
	line-height: 1.4em;
	clear: both;
	margin-bottom: 1.5em;
}

div.text-block p, div.text-block ol li { margin-bottom: 18px; }
h1, h2, h3, h4, h5, h6 { font-family: Geneva, Verdana, Lucida Sans, Lucida Grande, Lucida Sans Unicode, sans-serif; }

h2
{
	font-size: 16pt;
	line-height: 28pt;
}

h3
{
	font-size: 14pt;
	line-height: 22pt;
}

h4 { font-size: 12pt; }

div.text-block ol
{
	list-style-type: decimal;
	list-style-position: outside;
	margin-right: 30px;
}

div.text-block img.flow-left
{
	display: block;
	float: left;
	margin-right: 24px;
	margin-bottom: 24px;
}

div.text-block img.flow-right
{
	display: block;
	float: right;
	margin-left: 24px;
	margin-bottom: 24px;
}

div.text-block.indented
{
	position: relative;
	width: 574px;
	padding-left: 100px;
	margin-bottom: 24px;
}

img.indented-left
{
	position: absolute;
	left: 0;
	top: 0;
}

div#footer
{
	text-align: center;
	font-size: 9pt;
	line-height: 1.2em;
	margin-bottom: 2em;
}

dl#badges dt
{
	display: inline;
	padding: 0 10px 1em 10px;
}

div#footer ul { margin-bottom: 1em; }

div#footer ul li
{
	display: inline;
	padding: 0 5px 1em 5px;
}

div#footer p { margin-bottom: 1em; }
div.image-banner { text-align: center; }
div.image-banner img { margin: 0 5px 15px 5px; }
div.image-banner h3, div.image-banner h4 { margin-bottom: 10px; }

.page-heading
{
	text-align: center;
	margin-bottom: 15px;
	font-size: 15pt;
}

/*	Styles for the WordPress news pages.*/
div#wp-wrapper { margin-right: 150px; }

div.wp-post
{
	margin-top: 2em;
	margin-bottom: 2em;
	line-height: 1.4em;
}

div.wp-post p
{
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

div.wp-post h3
{
	font-size: 14pt;
	line-height: 1.4em;
}

/*	The body text for each WordPress post on the index page. */
div.wp-entry
{
	margin-top: 1em;
	margin-bottom: 2em;
}

div.wp-entry h4 { margin-bottom: 0.5em; }

p.wp-postmetadata
{
	text-align: center;
	font-size: 9pt;
	font-family: monospace;
	padding: 6px;
	color: black;
	background-color: rgb(168, 192,183);
	border: 1px rgb(0, 66, 81) dotted;
}

/*	Take the WordPress sidebar out of the main document flow, and position it top right. */
div#wp-sidebar
{
	position: absolute;
	top: 70px;
	right: 0;
	width: 139px;
	margin-right: 10px;
	padding-left: 10px;
	border-left: 1px rgb(0, 66, 81) dotted;
}

div#wp-sidebar h2 { font-size: 11pt; }
div#wp-sidebar li, form#commentform p, div.wp-entry li { line-height: 1.4em; }

.beginners
{
	color: black;
	background-color: rgb(217, 44, 43);
}

.intermediate
{
	color: black;
	background-color: rgb(255, 255, 79);
}

.intermediate.orange
{
	color: black;
	background-color: rgb(255, 128, 45);
}

.advanced
{
	color: black;
	background-color: rgb(81, 88, 255);
}

.all-grades
{
	color: black;
	background-color: rgb(165, 217, 199);
}

#belt-colours { margin: 15px auto 20px auto; }
#belt-colours td, #belt-colours th { padding: 8px; }

/* Styles for the open day event page */
#event-openday
{
	font-size: 400%;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	text-transform: uppercase;
}

#event-date {margin-bottom: 1em; }

.notes
{
	text-align: center;
	padding-left: 2em;
	padding-right: 2em;
	font-size: 80%;
}

.openday li
{
	position: relative;
	width: 80%;
	height: 2em;
	margin-bottom: 1em;
	padding-top: 8px;
	padding-left: 16px;
	padding-bottom: 0;
	color: black;
	background-color: rgb(185, 224, 210);
	margin-right: auto;
	margin-left: auto;
	vertical-align: middle;
	font-size: 110%;
}

.session-time
{
	position: absolute;
	right: 0;
	top: 0;
	height: 2em;
	padding-top: 8px;
	padding-right: 4px;
	padding-bottom: 0;
	width: 33%;
	text-align: center;
	color: black;
	background-color: rgb(168, 192,183);
	vertical-align: middle;
	font-weight: bold;
}

/*	Style the definition list for the fitness classes. */
dl.list-with-desc { line-height: 1.4em; }

dl.list-with-desc dt
{
	font-size: 11pt;
	font-weight: bold;
	margin-bottom: 8px;
}

dl.list-with-desc dd
{
	display: block;
	margin-bottom: 15px;
	margin-left: 15px;
}

div.captioned-image
{
	width: 50%;
	float: left;
	text-align: center;
	margin-top: 10px;
	margin-left: auto;
	margin-right: auto;
}

div.captioned-image.push-right
{
	width: auto;
	padding-left: 15%;
}

div.captioned-image.push-left
{
	width: auto;
	padding-right: 15%;
}

div.captioned-image.no-float { float: none; }
div.captioned-image.smaller { width: 33%; }

div.captioned-image img
{
	margin-left: 10px;
	margin-right: 10px;
}

div.text-block h3, div.text-block h4, div.text-block h5 { margin-bottom: 8px; }
.centered { text-align: center; }

div#key-block
{
	position: relative;
	width: 667px;
	height: 143px;
	padding-top: 15px;
}

ul#yauk-key
{
	position: absolute;
	width: 230px;
	height: 133px;
}

ul#yauk-key li
{
	position: relative;
	height: 1.4em;
}

ul#yauk-key li span.align-right
{
	position: absolute;
	width: 25%;
	text-align: right;
}

ul#yauk-key li span.align-left
{
	position: absolute;
	left: 25%;
	text-align: left;
	padding-left: 0.5em;
}

div#key-block p
{
	position: absolute;
	top: 0;
	left: 230px;
	width: 437px;
	height: 133px;
}

div#key-block p img
{
	position: absolute;
	width: 202px;
	bottom: 0;
	right: 0;
}

span.link-arrow { padding-right: 2px; }
span.link-arrow-right { padding-left: 2px; }

ul.real-list, div.wp-entry ul
{
	list-style-type: square;
	list-style-position: inside;
	margin-left: 1em;
	margin-bottom: 1em;
}

/*	Add a bit of extra whitespace to the bottom of some elements. */
.whitespaced { margin-bottom: 1em; }

/*	Highlight a list item with a border and background colour. */
.attention, #calendar-options
{
	color: black;
	padding: 8px 0px 6px 8px;
	background-color: rgb(168, 192,183);
	border: 1px rgb(0, 66, 81) dotted;
}

.subdued { font-weight: normal; }

/*	Link lists at the top of the pages. */
ul.section-links
{
	text-align: center;
	margin-bottom: 1em;
}

ul.section-links li
{
	display: inline;
	padding-left: 0.5em;
	padding-right: 0.5em;
}

#belt-colours, .openday li { border: 1px rgb(0, 97, 107) solid; }

table#belt-colours th, td.rank-name
{
	color: black;
	background-color: rgb(168, 192,183);
}

td.belt-black
{
	color: white;
	background-color: black;
}

td.belt-brown
{
	color: white;
	background-color: rgb(103, 68, 32);
}

td.belt-blue
{
	color: white;
	background-color: rgb(81, 88, 255);
}

td.belt-green
{
	color: white;
	background-color: rgb(10, 142, 75);
}

td.belt-orange
{
	color: white;
	background-color: rgb(255, 147, 27);
}

td.belt-yellow
{
	color: black;
	background-color: rgb(255, 255, 79);
}

td.belt-white
{
	color: black;
	background-color: white;
}

td.belt-red
{
	color: white;
	background-color: rgb(217, 44, 43);
}

td.belt-req
{
	color: black;
	background-color: white;
}

div#toms-poem
{
	width: 289px;
	margin: 1em auto 1em auto;
}

.month h3
{
	color: black;
	padding-left: 8px;
	margin-top: 1em;
	background-color: rgb(168, 192,183);
	border: 1px rgb(0, 66, 81) dotted;
}

ul.event
{
	padding: 0.5em 0;
	color: black;
	background: white;
	padding-left: 8px;
	margin-bottom: 4px;
	border-width: 1px 1px 2px 1px;
	border-color: rgb(168, 192,183);
	border-style: solid;
}

ul.event.external
{
	color: black;
	background: rgb(176,204,194);
	border-color: rgb(95,114,108);
	border-top-width: 2px;
	border-bottom-width: 4px;
}

ul.event.highlight
{
	color: black;
	background-color: rgb(185, 224, 210);
	border-top-width: 2px;
	border-bottom-width: 4px;
}

ul.event.historical
{
	color: rgb(0, 97, 107);
	background: rgb(208,242,230);
	border: 1px rgb(176,204,194) solid;
}

ul.external li.description
{
	/* font-weight: bold; */
	font-style: italic;
}

ul.event li.gallery p
{
	margin-top: 0.3em;
	font-weight: bold;
}
ul.event li.details, ul.event li.location
{
	margin-top: 0.5em;
}

ul.event li.date { text-decoration: underline; }

ul.event li.time { margin-bottom: 0.5em; }
ul.event li p { margin-bottom: 0; }
form#calendar-options p { margin-bottom: 0.5em; }

div#timetable-heading
{
	position: relative;
	height: 32px;
	width: 674px;
	background-image: url(/themes/greencrystal/backgrounds/timetable-corners-top.png);
	background-repeat: no-repeat;
}

div#timetable-heading h3
{
	position: absolute;
	top: 10px;
	left: 0;
	width: 666px;
	height: 22px;
	padding-left: 8px;
	font-size: 11pt;
	font-weight: bold;
	color: black;
	background-color: rgb(176,204,194);
	line-height: 20px;
}

div#timetable-heading span#switch-age
{
	position: absolute;
	top: 10px;
	right: 0;
	width: auto;
	height: 22px;
	padding-right: 12px;
	text-align: right;
}

div#timetable-heading span#switch-age a { font-weight: bold; }

div#timetable-heading span#switch-age a:visited
{
	color: black;
	background-color: inherit;
}

ul#timetable-wrapper li.timetable-day-row, ul#timetable-wrapper li.timetable-class-row { position: relative; }

li.timetable-class-row
{
	width: 672px;
	height: 24px;
	border: 1px rgb(176,204,194) solid;
	border-top: none;
}

li.timetable-day-row
{
	width: 674px;
	height: 25px;
	color: white;
	background-color: rgb(59,122,131);
	border: none;
}

li.timetable-day-row h4
{
	padding-left: 8px;
	font-size: 10pt;
	line-height: 25px;
}

ul.tt-class-details,  li.timetable-class-row p
{
	position: relative;
	height: 24px;
	width: 672px;
	top: 0;
	left: 0;
	color: black;
	background-color: white;
}

li.timetable-class-row p
{
	text-align: center;
	line-height: 24px;
}

ul.tt-class-details li
{
	display: inline;
	padding-left: 8px;
	font-size: 10pt;
	line-height: 24px;
}

li.timetable-slider
{
	position: absolute;
	display: block;
	width: 256px;
	height: 24px;
	top: 0;
	right: 0;
	color: black;
	background-color: rgb(216,224,235);
}

li.timetable-slider span
{
	position: absolute;
	height: 24px;
	top: 0;
	border-right: 1px rgb(176,204,194) solid;
	border-left: 1px rgb(176,204,194) solid;
}

div.timetable-bottom
{
	position: relative;
	height: 13px;
	margin-bottom: 1em;
	background-image: url(/themes/greencrystal/backgrounds/timetable-corners-bottom.png);
	background-repeat: no-repeat;
}

ul#key-wrapper
{
	position: relative;
	width: 674px;
	height: 52px;
}

ul#key-wrapper li
{
	position: absolute;
	width: 336px;
	height: 25px;
	color: black;
	background-color: white;
	border: 1px rgb(176,204,194) solid;
	line-height: 25px;
}

ul#key-wrapper li#key-1
{
	top: 0;
	left: 0;
}

ul#key-wrapper li#key-2
{
	top: 26px;
	left: 0;
}

ul#key-wrapper li#key-3
{
	top: 0;
	left: 337px;
}

ul#key-wrapper li#key-4
{
	top: 26px;
	left: 337px;
}

span.key-details
{
	position: absolute;
	width: 304px;
	height: 25px;
	text-align: right;
}

span.key-colour
{
	position: absolute;
	width: 25px;
	height: 25px;
	right: 0;
	border-left: 1px rgb(176,204,194) solid;
}

ul#key-wrapper li span span { display: none; }

div#key-wrapper-block
{
	position: relative;
	height: 51px;
	width: 674px;
	padding-top: 12px;
	background-image: url(/themes/greencrystal/backgrounds/timetable-corners-top.png);
	background-repeat: no-repeat;
	margin-bottom: 0;
}

dl.fitness dd { border-bottom: 1px rgb(0, 66, 81) dotted; }
.sub-heading { border-bottom: 1px rgb(0, 66, 81) solid; }
ul#club-timeline li { padding-bottom: 1em; }
span.show-key { text-decoration: underline; }

div#mapcanvas
{
	position: relative;
	margin-bottom: 20px;
	color: black;
	background-color: rgb(168, 192,183);
	border: 1px rgb(0, 66, 81) solid;
	width: 672px;
	height: 476px;
}

.dummy-space { clear: both; }

div#old-link
{
	padding: 20px;
	margin-top: 10px;
}

#event-ledyard
{
	font-size: 300%;
}

#event-times
{
	position: relative;
	width: 50%;
	margin: 0 auto 2em auto;
}

#event-times li
{
	position: relative;
	height: 1.4em;
	text-align: center;
}

#event-times li span.align-right
{
	position: absolute;
	width: 50%;
	text-align: right;
}

#event-times li span.align-left
{
	position: absolute;
	left: 50%;
	text-align: left;
	padding-left: 0.5em;
}