/*
	advanced.css - www.zen-berlin.org, May 2004

	A redefinition of the settings made in simple.css for CSS2-capable browsers.
	See there for the acknowledgments and thanks:
	There is a lot of the Box Model Hack here.
	Background colour, box margins and absolute positionings must be defined externally.
	
	21-Sep-2004 overflow: hidden is obscured to IE5Mac
*/
body {
	font: normal 76%/1.4 "Trebuchet MS", Verdana, Helvetica, sans-serif;
	color: #000;
	margin: 0; 
	padding: 0;
	}
/*
	For H1 one would like to have something like: margin: 0 0 0 0.5em; 
	Original comment by Owen Briggs of www.thenoodleincident.com:
	both set to zero and padding in header div is used instead to deal with compound IE pc problems 
	that are beyound summary in a simple comment.
*/
h1 { color: #aaa; font-size: 2.8em; font-weight: normal; margin: 0; padding: 0; }
h2 { color: #000; font-size: 2.0em; font-weight: normal; margin: 0.5em 0; padding: 0; }
h3 { color: #aaa; font-size: 1.4em; font-weight: normal; margin: 1.2em 0 0.5em 0; padding: 0; }
ul, li { font-size: 1.0em; }
ul { margin: 1.2em 0 0.5em 0; }
p { font-size: 1.0em; margin-top: 1.2em; margin-bottom: 0.5em; }
pre {
	font: 1.0em "Lucida Console", "Courier New", Courier, monospace;
	color: #aaa;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	margin-left: 1em;
	white-space: normal;
	display: block;
	}
hr { color: #aaa; height: 1px; margin-top: 1.0em; margin-bottom: 0; }
p { margin-top: 0; margin-bottom: 0.5em; }
address { font-size: 1em; font-style: normal; margin-top: 0; margin-bottom: 0.5em; padding: 0; }
dl { font-size: 1em; margin: 0 0 0.5em 0; padding: 0; }
dl dt { color: #888; font-weight: bold; margin: 0; padding: 0; border-bottom: 1px dashed #ccc; }
dl dd { margin: 0 0 1.0em 2.5em; padding: 0; }

/*
	Highlight the presence of a tooltip text in abbreviations, emphasised text etc.
	It would be nice to use:
	abbr[title], acronym[title] { border-bottom: 1px dashed #000; cursor: help; }
	but this does not work in IE. The highlighted tooltip text does work in IE for acronyms,
	but we don't want to be calling things acronyms when they are abbreviations. Where we
	have resorted to this, then the extra spell-out rule.
*/
acronym, .annotated { border-bottom: 1px dashed #000; cursor: help; }
acronym, abbr { speak: spell-out; }

/*
	Link color/decoration settings: 
	the order is important to make 'hover' and 'active' stronger than 'visited'
	Foreground (for :link, :visited) and background colour (for :hover, :active) must be defined externally.
*/
a:link, a:visited, a:hover, a:active { white-space: nowrap; font-weight: bold; font-size: 1em; text-decoration: none; }
a:link.largelink, a:visited.largelink { font-size: 2em; }

/*
	A pseudo-invisible accessibility skip link to jump straight to the content.
	We choose not to use display:none but instead a combination of foreground equal to background colour
	because some screen readers interpret display:none "correctly" and do not read the content.
	Also there is no harm in seeing the link in a display with colours turned off or in print.
	This is also the top of the screen when the "goto top" link is activated.
	Foreground and background colour must be defined externally.
*/
#skipnav { position: absolute; top: 0; left: 0; margin: 0; padding: 0; font-size: 1em; }
#skipnav a:link, #skipnav a:visited, #skipnav a:hover, #skipnav a:active { font-weight: bold; text-decoration: none; }

/*
	Absolutely positioned region to take the navigation bar.
	The navigation is realised as a set of simple links, wide enough for 12ems of text+paddings 
	and 2*0.2em borders. 
	The top link has class="home" and displays a very large logo with a small text underneath it.
	"inactive" areas are greyed out with a different background colour, displaying the current choices.
	EMphasis defines accesskey underlining.
	Thanks to Stu Nicholls of www.s7u.co.uk for this kind of navigation bar. 
	Absolute position and hover colour must be defined externally.
*/
.nav {
	position: absolute;
	margin: 0;
	padding: 0;
	width: 12.4em; /*for IE5Mac; hack to hide the following from IEMac \*/
	width: auto;  
	overflow: hidden;/*for IE5Win, IE6Win, Mozilla, Opera*/
	}
.nav a, .nav .inactive {
	font-size: 1em;
	font-weight: bold;
	text-decoration: none;
	display: block;
	line-height: 2em;/*for IE5Mac; hack to hide the following from IEMac \*/
	overflow: hidden;/*for IE5Win, IE6Win, Mozilla, Opera*/
	margin-bottom: -1px; /* prevents ugly gaps in Mozilla 1.6 */
	border-left: 0.2em solid #000;
	border-right: 0.2em solid #000;
	padding: 0 1em;
	width: 12.4em; /* ie5win Box Model Hack begins */
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 10em;
	} 
html>body .nav a, html>body .nav .inactive {
	width: 10em; /* ie5win Box Model Hack ends */
	} 
.nav a em { font-style: normal; text-decoration: underline; }
.nav .inactive {
	color: #fff;
	background-color: #deb887; /* burleywood #deb887; */
	}
.nav a:link, .nav a:visited { color: #000; background-color: #faf4e0; }
.nav a:link.home, .nav a:visited.home { color: #000; background-color: #fff; }
.nav a:hover, .nav a:active, .nav a:hover.home, .nav a:active.home { color: #fff; }
.nav a.home {
	font-weight: normal;
	background-color: #fff;
	line-height: 1.2em;
	margin-bottom: 0;
	padding-top: 1.5em;
	padding-bottom: 1.0em;
	border-top: 0.2em solid #000;
	border-bottom: 0.2em solid #000;
	}
.nav a.home .logo { display: block; font-size: 4em; }
.nav a.last { margin-bottom: 0; border-bottom: 0.2em solid #000; }
.nav span { display: none; }
.nav a.start { cursor: default; }
.nav a:link.start, .nav a:visited.start { color: #fff; }

/*
	Special settings for the Mu and Cat background pictures in error.shtml and sitemap.xhtml
*/
.nav #mu {
	background: #faf4e0 url(/images/mu.gif) no-repeat center;
	padding: 0;
	height: 196px;
	display: block;
	border-left: 0.2em solid #000;
	border-right: 0.2em solid #000;
	border-bottom: 0.2em solid #000;
	width: 12.4em; /* ie5win Box Model Hack begins */
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 12em;
	} 
html>body .nav #mu {
	width: 12em; /* ie5win Box Model Hack ends */
	} 
.nav #cat {
	background: #faf4e0 url(/images/cat.gif) no-repeat center;
	padding: 0;
	height: 196px;
	display: block;
	border-left: 0.2em solid #000;
	border-right: 0.2em solid #000;
	border-bottom: 0.2em solid #000;
	width: 12.4em; /* ie5win Box Model Hack begins */
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 12em;
	} 
html>body .nav #cat {
	width: 12em; /* ie5win Box Model Hack ends */
	} 

/*
	Main content is simply placed in document flow - margin settings ensure enough width for the nav.
	Black on white with dashed black border. A tiny header in grey is our site name.
	Margin, absolute positioning and border must be defined externally.
*/
#content { color: #000; background-color: #fff; text-align: left; padding: 2em 4em 2em 4em; border: 0.2em dashed #000; }
#content h1 {
	color: #aaa; 
	font-weight: normal;
	border-bottom: 1px dashed #ccc;
	font-size: xx-small; /* ie5win Box Model Hack begins */
	voice-family: "\"}\"";
	voice-family: inherit;
	font-size: x-small;
	} 
html>body #content h1 {
	font-size: x-small; /* ie5win Box Model Hack ends */
	} 
#content blockquote { font-size: 1em; font-style: italic; margin-left: 2.5em; }
#content #homepage-de { position: relative; background: url(/images/unsui.gif) no-repeat center; height: 631px; }
#content #homepage-de #sitemap { position: absolute; top: 550px; }
#content #homepage-en { position: relative; background: url(/images/daruma.gif) no-repeat center; height: 456px; } 
#content #homepage-en #sitemap { position: absolute; top: 386px; }
#content #homepage-de h1, #content #homepage-en h1 { color: #aaa; font-size: 2.8em; margin: 0; border: 0; }
#content #homepage-de #sitemap h2, #content #homepage-en #sitemap h2 { color: #aaa; font-size: 1.4em; font-weight: normal; margin-bottom: 0.5em; padding: 0; }

/*
	Stupid hack to prevent IE6Win float bug disappearing trick.
	A declared width is necessary to prevent IE Pekaboo float bug.
	Must be nested directly inside #content and/or #footer.
*/
.ie6hack { width: 100%; }

/*
	info: Optional info box, black on white, nestling under the navigation. 
	Starts with a H3 with reduced top margin,
	line-height reduced because of narrow width (important visual effect).
	Optionally contains a table of opening times.
	website: Optional website box, black on white, nestling under the info box on some of the Dojo pages. 
	line-height reduced because of narrow width (important visual effect).
	Absolute positions and borders must be defined externally.
*/
#info, #website {
	position: absolute;
	color: #000;
	background-color: #fff; 
	line-height: 1.2em;
	margin: 0;
	padding: 0.5em 1em 0.5em 1em;
	width: 12.4em; /* should be 12.4em, but this produces rounding errors in the smallest ie5 setting! ie5win Box Model Hack begins */
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 10em;
	} 
html>body #info, html>body #website {
	width: 10em; /* ie5win Box Model Hack ends */
	} 
#info h3, #website h3 {
	margin-top: 0.5em;
	}
#info blockquote {
	font-style: italic;
	margin: 0.5em 0.5em 0.5em 0.5em;
	}
#info table {
	width: auto;
	border-collapse: collapse;
	}
#info table tr td {
	margin: 0;
	padding: 0.3em 0.2em 0.3em 0.2em;
	text-align: left;
	vertical-align: middle;
	line-height: 1em;
	font-size: 76%; /* ie5win does not inherit TD font size: Box Model Hack begins */
	height: 2.0em;
	width: 2.8em;
	voice-family: "\"}\"";
	voice-family: inherit;
	font-size: 1em;
	height: 2.6em;
	width: 3.2em;
	} 
html>body #info table tr td {
	font-size: 1em; /* ie5win Box Model Hack ends */
	height: 2.6em;
	width: 3.2em;
	} 
#info table tr td.day, #info table tr td.am {
	border-right: 1px dotted #ccc;
	border-bottom: 1px dotted #ccc;
	}
#info table tr td.pm {
	border-bottom: 1px dotted #ccc;
	}
#info table tr#sun td {
	border-bottom: none;
	}

/*
	Footer box: sits directly under the content, black on white with coloured border.
	"to top" text is floated right to allow coexistence with the copyright paragraph.
	Border and margins must be defined externally.
*/
#footer { position: relative; color: #000; background-color: #fff; padding: 0.2em 4em 0.2em 4em; }
#footer p { text-align: left; margin: 0; padding: 0; }
#footer p#totop { float: right; width: 8em; text-align: right; }
#copy { letter-spacing: 0.05em; font-weight: bold; }

/*
	Some general purpose classes to avoid style="... in the HTML.
*/
#toc { display: none; speak: none; }
.left { float: left; margin: 0.5em 1.0em 0.5em 0; }
.right { float: right; margin: 0.5em 0 0.5em 1.0em; }
.clear { clear: both; }
.bigger { font-size: 1.2em; }
img { border: 1px solid #000; } /* images are bordered black in general */
img.centred { display: block; margin-left: auto; margin-right: auto; }

/*
	Rules for Dunstan Orchard's lovely image shadowing.
*/
#content .img-shadow-right {
	position: relative;
	background: url(/images/shadowAlpha.png) no-repeat bottom right !important;
	background: url(/images/shadow.gif) no-repeat bottom right;
	float: right;
	margin: 0.5em -6px 0.5em 1.5em !important;
	margin: 0.5em -6px 0.5em 1.5em;
	}
#content .img-shadow-left {
	position: relative;
	background: url(/images/shadowAlpha.png) no-repeat bottom right !important;
	background: url(/images/shadow.gif) no-repeat bottom right;
	float: left;
	margin: 0.5em 1.0em 0.5em 6px !important;
	margin: 0.5em 1.0em 0.5em 3px;
	}
#content .img-shadow-right img, #content .img-shadow-left img {
	display: block;
	position: relative;
	margin: -6px 6px 6px -6px;
	padding: 0;
	}

/*
	Diverse images with their dimensions.
*/
#content img#sengai-obaku { width: 157px; height: 481px; }
#content img#gendro-stairs { width: 200px; height: 266px; }
#content img#buddha { width: 100px; height: 141px; }
#content img#deshimaru-finger { width: 120px; height: 94px; }
#content img#gendro-chateau { width: 200px; height: 150px; }
#content img#deshimaru-posture { width: 120px; height: 138px; }
#content img#kyosaku { border: 0; width: 42px; height: 441px; }
#content img#kyosaku-horiz { border: 0; width: 430px; height: 30px; }
#content img#zafu { width: 149px; height: 154px; }
#content img#hitting-wood { width: 150px; height: 154px; }
#content img#monks-above { width: 205px; height: 153px; }
#content img#kesa { width: 350px; height: 230px; }
#content img#dojo-berlin { width: 233px; height: 186px; }
#content img#dojo-hamburg { width: 285px; height: 222px; }
#content img#access-hamburg { width: 350px; height: 233px; }
#content img#dojo-neu-schoenau { width: 252px; height: 104px; }
#content img#access-neu-schoenau { width: 273px; height: 220px; }
#website img#mu-i { width: 94px; height: 62px; }
#content img#dojo-bremen { width: 193px; height: 134px; }
#content img#access-bremen { width: 400px; height: 400px; }
#content img#pcoupey { width: 160px; height: 227px; }
#content img#gendro-kitchen { width: 267px; height: 200px; }
#content img#sengai-tokusan { width: 165px; height: 520px; }
#content img#hakuin-hitomaro { border: 0; width: 193px; height: 176px; }

/*
	Style for the webmail form.
*/
fieldset.hidden { display: none; }
#formfieldset {
	background-color: #fdfaf0; /* a slightly washed-out variety of the menu background #faf4e0; */
	padding: 1em 2em;
	margin: 0 0 0.5em 0;
	border: 1px dashed #deb887; /* burleywood #deb887; */
	}
p label { display: block; text-align: left; }
p input, p textarea {
	font-family: "Lucida Console", "Courier New", Courier, monospace;
	font-size: 1.0em;
	width: 100%;
	border: 1px solid #deb887; /* burleywood #deb887; */
	}
p textarea { height: 20em; }
p textarea#preview { height: 10em; border: 1px dashed #999; margin-bottom: 1em; }
#registration #topleft { float:left; width:46% }
#registration #topright { float:right; width:46% }
#registration p textarea#address { height: 6em; }
#formButtons { margin: 0; text-align: left; white-space: nowrap; }
.button {
	font-family: "Trebuchet MS", Verdana, Helvetica, sans-serif; /* must reset because input field */
	color: #fff;
	font-size: 1.0em;
	font-weight: bold;
	border: 1px outset #333;
	padding: 0;
	margin: 0 1em 0 0;
	width: 10em;
	text-align: center; 
	}
.pseudobutton {
	border: 1px outset #333;
	margin: 1em 0 0 2em;
	padding: 0;
	width: 21em;
	}
.pseudobutton a {
	display: block;
	text-decoration: none;
	font-size: 1.0em;
	text-align: center;
	line-height: 1.5em;
	padding: 0.1em 0;
	width: 21em;
	text-decoration: none;
	}
.pseudobutton a:link, .pseudobutton a:visited { color: #fff; }

/*
	Faux W3C buttons in XHTML and CSS by Marek Prokop, www.sovavsiti.cz/css
	Blocked buttons which would otherwise be under one another are floated abreast in an enclosing div.
*/
#w3cbuttonset { margin: 0.5em 0; font-size: 1.0em; font-weight: bold; }
.w3cbutton { float: left; margin-right: 1.0em; margin-bottom: 0.5em; }
.w3cbutton a {
	display: block; 
	width: 8.5em; 
	border-top: 1px solid #ccc; 
	border-bottom: 2px solid #444;
	border-left: 1px solid #ccc;
	border-right: 2px solid #444;
	}
.w3cbutton a:link, .w3cbutton a:visited { color: #222; background-color: #fc6; }
.w3cbutton span.w3c { padding: 0 0.4em; color: #0c479d; background-color: #fff; }

/*
	Paragraph definition for important notices to be positioned absolutely
	or floated as desired. Border colour must be defined externally.
*/
.notice {
	background-color: #deb887; /* burleywood #deb887; */ 
	line-height: 1.2em;
	margin: 0;
	padding: 0.5em 1em 0.5em 1em;
	} 
.notice h3 {
	margin-top: 0.5em;
	}