body {
	margin: 0px; padding: 0px;
	font-family: "Comic Sans MS", "Arial", sans-serif; 
	background-color: #000000; color: #d39c60;
}
	a:link, a:visited { text-decoration: none; }
	body, table, .normal { font-size: 8pt; }


#navigation { /* The entire navigation area. */
	position: fixed;
	top: 0px; left: 10%;
	width: 80%; height: 72px;
	margin: 0px; padding: 0px;
	background-color: #000000; color: #ffffff;
	border-bottom: 2px solid #990000;
	z-index: 1;
}
	#navigation h2 { /* The SEATTLE-LEATHER banner. */
		position: absolute;
		top: 15px; left: 0px;
		width: 268px; height: 48px;
		background: url(images/logo2.jpg) no-repeat;
		border: none;
	}
		#navigation h2 * { display: none; }

	#sections { /* The section tabs. */
		position: absolute; bottom: 0px; right: 0%;
		margin: 0px; padding: 0px;
	}
		#sections img { border: none; }
		#sections li {
			float: left; position: relative; margin: 4px 0px 0px 4px;
			border: 2px outset #990000; border-bottom: none;
			list-style-type: none; font-size: 1.1em;
		}
			#sections li.current { margin-top: 0px; }
			#sections a {
				display: block; padding: 3px 4px;
				background: #000000 url(images/gradient2.gif) repeat-x top;
				color: #ffffff; cursor: default;
			}
				#sections a:link, #sections a:visited { cursor: pointer; }
				#sections a:hover, #sections li:hover a
					{ background-image: url(images/gradient1.gif); }
				#sections li.current a
					{ padding: 5px; background: #990000 none; }
					#sections li.current a:hover, #sections li.current:hover a
						{ background: #cc0000 none; }
	
	.pages { /* A section popup. */
		visibility: hidden;
		position: absolute; top: 100%; right: -2px;
		margin: 0px 0px 0px 0px; padding: 0em; width: 20em;
		border: 2px outset #990000; background-color: #000000;
		font-weight: normal; font-size: 0.875em;
	}
		#sections .pages li {
			float: none; position: static;
			margin: 0.5em 0em; border: none;
		}
			.pages a { padding: 0em 1em!important; background: none!important; }
				.pages a:hover {
					background: url(images/gradient1.gif) repeat-x top
						!important;
				}
				.pages li.current a { background: #990000!important; }
			.pages em { color: #d39c60; }
				.pages li.current em { color: #ffffff; }

#content { /* The actual page content. */
	position: relative; top: 0px; left: 10%; width: 80%;
	margin: 74px 0em 0em 0em; padding: 26px 0em 6em 0em;
	background: url(images/gradient2.gif) repeat-x top!important;
	z-index: 0;
}
	#content img#main, #content object#main, #main { /* The main page image. */
		float: left; margin-right: 1em; border: none;
	}
	h1, .subtitle, .author { /* The page title, and any subtitle or author. */
		margin: 0px; padding: 0px; text-align: right;
		font-weight: normal; color: #ffffff;
	}
		h1 { font-size: 1.625em; }
		.subtitle, .author { clear: none; font-size: 1em; }
			.author { margin-top: 2em; }

	/* For the first item after the page title... */
	.first { /* ...on pages whose text wraps around the lead image. */
		clear: none; margin-top: 8em;
	}
	.cleared { /* ...on pages whose text clears under the lead image. */
		clear: both!important; margin-top: 0em; padding-top: 1em;
	}
	
	/* For items following the first which should not clear the lead image. */
	.second { clear: none; }
	
	#content a:link, #content a:visited { /* Standard links. */
		border-bottom: 1px dotted #6098d3;
		color: #6098d3;
	}
		#content a:link:hover, #content a:visited:hover {
			border-bottom: 1px solid #ff0000;
			color: #ff0000;
		}
		#content a.button { /* For links with button-like appearance. */
			display: inline; padding: 0.5em; color: #ffffff!important;
			border: 2px outset #990000!important;
			background: #000000 url(images/gradient2.gif) repeat-x top;
		}
			#content a.button:hover {
				background-image: url(images/gradient1.gif);
			}
			#content a.button:active { border-style: inset!important; }

	h2, h3, h4, th { /* Additional heading levels. */
		margin-top: 0em; padding-top: 1em;
		font-size: 1em; font-weight: normal; color: #ffffff;
	}
		h2 { clear: both; }
		h2.uber { font-size: 1.625em; }
		h2 span, h3 span, th span { border-bottom: 1px solid #ff0000; }
		h2, h4 { margin-bottom: 0em; }

	.hr { /* Horizontal rules should appear as <div class="hr"><hr /></div>. */
		clear: both; margin: 3em auto; text-align: center;
		width: 560px; height: 22px; border: none;
		background: transparent url(images/chain.gif) no-repeat;
	}
		.hr hr { display: none; }
		#content.watersports .hr { /* For rules on watersports pages. */
			width: 501px; height: 54px;
			background-image: url(images/stream.gif);
		}
		#content.boots .hr { /* For rules on boots pages. */
			width: 700px; height: 40px;
			background-image: url(images/boots.gif);
		}

	#content img, #content div.object { border: 1px solid #ff0000; }
		/* For images that need a border to be distinct from the background. */
			img.edgeless { border: 3px double #404040!important; }
		/* For iconic images without borders. */
			img.icon { border: none!important; }
		/* For lead-in images. */
			img.lead { float: left; }
		/* For left-side floating images and objects. */
			img.left, .object.left { float: left; margin-right: 1em; }
		/* To surround centered images and objects. */
			.center { text-align: center; }
		/* For right-side floating images and objects. */
			img.right, .object.right { float: right; margin-left: 1em; }

	p { line-height: 167%; }
		p.callout { /* For a bulleted, emphasized paragraph. */
			display: list-item; margin-left: 4em; color: #ff0000;
		}
			p.callout * { color: #d39c60; }
			p.callout .note { font-size: 1em; }
		p.caption { /* For image captions. */
			text-align: center; color: #ffffff;
		}
		p.emph { /* For emphasized paragraphs. */
			text-align: center;
			font-size: 1.25em; font-weight: normal;
		}
		p.note { font-size: 1em; }

	dl, ul, ol { margin-top: 1em; margin-bottom: 1em; line-height: 167%; }
		dt { color: #ffffff; }
		dl.note, ul.note, ol.note { font-size: 1em; }
		dd.caption { margin-left: 0em!important; padding-left: 0em; }
		dl.illustrated {} /* For descriptive lists with images. */
			dl.illustrated dt { clear: both; padding-top: 2em; }
			dl.illustrated dd { margin-left: 0em; padding-left: 0em; }
			dl.illustrated p.callout { margin-left: 8em; }
		ol ol { list-style-type: lower-alpha; }
			ol ol ol { list-style-type: lower-roman; }
		ul.extlink { list-style-type: none; } /* For lists of external links. */
			ul.extlink li { margin-top: 1em; margin-bottom: 1em; }
			ul.extlink.note { margin-left: 0em; padding-left: 0em; }
		ul.leftcol, ul.rightcol { list-style-type: none; }

	.leftcol, .rightcol { /* For two-column layouts... */
		width: 49%; margin-left: 0em; margin-right: 0em; padding: 0em;
	}
		.leftcol { float: left; } /* ...for the left column. */
		.rightcol { float: right; } /* ...for the right column. */
	
	div.gallery { margin: 2em 0em; } /* For galleries with full-size images */
		.gallery table { float: right; }
		.gallery .gallery-image { float: left; }
		.gallery.right {} /* For galleries with reverse format */
			.gallery.right table { float: left; }
			.gallery.right .gallery-image { float: right; }
		.gallery td, .thumbnails td { padding: 12px; text-align: center; }
			.gallery td img, .thumbnails td img { border: none!important; }
		.gallery a, .thumbnails a { border: none!important; }
	table.thumbnails { /* For thumbnails without full-size images */
		text-align: center; margin: 2em auto;
	}
		table.thumbnails th { text-align: left; padding-top: 2em; }
	div.slideshow { border: 1px solid #ff0000!important; }
		.slideshow img { border: none!important; }

	div.extlink { /* For external link paragraphs with images. */
		clear: both; padding-top: 3em!important;
	}
		div.extlink.first { padding-top: 1em!important; }
		div.extlink p { margin-left: 20%; } /* With most images. */
		div.extlink.narrow p { margin-left: 10%; } /* With narrower images. */
		div.extlink.wide p { margin-left: 30%; } /* With wider images. */

	.code { /* For source code blocks */
		padding: 1em;
		font-family: monospace;
		border: 1px solid #ff0000;
	}

	.emph { font-weight: bold; } /* For emphasized text. */
	.init { font-weight: bold; color: #ffffff; } /* For emphasized initials. */
	.normal { color: #d39c60!important; } /* For normal text. */
	.note { font-size: 0.875em; color: #997146!important; } /* For notes. */
	.lead { color: #ffffff; } /* For lead-in paragraph titles. */
	.warning { color: #ff0000; } /* For warnings, cautions, and dangers. */

	#content img#section-image { /* The main image for a section index. */
		position: absolute; top: 26px; left: 0px; border: none; z-index: -1;
	}
	#section-index { /* For page lists on section indices. */
		margin-left: 50%; padding: 0em; list-style-type: none;
	}
		#section-index dt { margin-top: 1em; font-size: 1.375em; }
		#section-index dd { margin: 1em 4em; }
		#section-index dd.caption { font-size: 1em!important; }
		/* For larger section index items on the home page. */
			#content.home #section-index dt { font-size: 1.625em; }
			#content.home #section-index dd { font-size: 1.25em; }
		#section-index dt a:link, #section-index dt a:visited {
			border-color: #ffffff!important; color: #ffffff!important;
		}