body
{
	margin: 0px;
	text-align: center;
	background-color: #404040;
	font-family: Arial, Sans-Serif;
}

body.white
{
	background-color: #ffffff;
	text-align: left;
}

a
{
	text-decoration: none;
	color: #4f81bd;
}

a:hover
{
	text-decoration: underline;
}

img
{
	border: 0px;
}

h1
{
	font: bold 24pt Arial, Sans-Serif;
	color: #606060;
}

h2
{
	font: bold 10pt Arial, Sans-Serif;
	color: #000060;
}

h3
{
	margin: 0px;
	font: bold 12pt Arial, Sans-Serif;
	color: #606060;
}

h4
{
	font: bold 10pt Arial, Sans-Serif;
	color: #606060;
	margin-bottom: 5px;
}

.subheading
{
	color: #606060;
	font: bold 10pt Arial, Sans-Serif;
}

.small
{
	font-size: 10pt;
}

div.main
{
	text-align: left;
	margin: 0px auto;
	padding: 10px;
	width: 1000px;
	background-color: #ffffff;
	border-bottom: solid 3px #202020;
	border-right: solid 3px #202020;
}

div.searchPanel
{
	width: 100%;
	text-align: center;
	padding-top: 10px;
	font: 10pt Arial, Sans-Serif;
}

div.searchPanel h3
{
	font: bold 10pt Arial, Sans-Serif;
}

div.searchPanel #searchBox
{
	width: 250px;
}

div.sidebar
{
	text-align: left;
	float: left;
}

div.sidebar a
{
	color: #000090;
	font-size: 90%;
}

div.sidebar a:hover
{
	color: #0000ff;
}

div.mainPanel
{
	width: 100%;
	float: left;
}

div.footer
{
	text-align: center;
	color: #a0a0a0;
	font-family: Arial, Sans-Serif;
	font-size: 12pt;
	padding: 0px 10px 10px 10px;
}

div.footer a
{
	color: #a0a0a0;
	text-decoration: none;
	margin-left: 10px;
	font: bold 12pt Arial;
}

div.footer a:hover
{
	color: #6060ff;
	text-decoration: underline;
}

div.footer .copy, div.footer .copy a
{
	margin: 10px 0px 10px 0px;
	font: 8pt Arial, Sans Serif;
}

div.footer .copy a
{
	text-decoration: underline;
}

.serif
{
	font-family: Times New Roman;
}

/* --- Info panel -------------------------------------------------- */

div.info
{
	background: #ffffcc;
	width: auto;
	padding: 10px 30px;
	font: 10pt Verdata, Arial, Sans-Serif;
}

div.info h1
{
	color: #000000;
	font: 16pt "Arial Rounded MT Bold", Arial, Sans-Serif;
	margin: 0px 0px 10px 0px;
}

div.info a
{
	font-weight: bold;
}

div.signupInfo
{
	background: #ffffcc;
	width: auto;
	padding: 20px 30px;
	margin: 0px 50px;
	font: 16pt "Arial Rounded MT Bold", Arial, Sans-Serif;
	text-align: center;
}

div.signupInfo a
{
	text-decoration: underline;
}

div.signupInfo a:hover
{
	color: #ff0000;
}

/* --- Stacked Table --- */

table.stackedTable
{
	margin-left: 30px;
}

table.stackedTable tr th
{
	text-align: left;
	font-weight: bold;
}

table.stackedTable tr td
{
	text-align: left;
}

/* --- Freeze panel --- */

.freezePaneOff
{
	visibility: hidden;
	display: none;
	position: absolute;
	top: -100px;
	left: -100px;
	text-align: center;
}

.freezePaneOn
{
	position: absolute;
	top: 0px;
	left: 0px;
	visibility: visible;
	display: block;
	width: 100%;
	height: 100%;
	background-color: #666;
	z-index: 999;
	filter:alpha(opacity=85);
	-moz-opacity:0.85;
	padding-top: 20%;
}

.innerFreezePane
{
	text-align: center;
	width: 66%;
	background-color: #171;
	color: White;
	font-size: large;
	border: dashed 2px #111;
	padding: 9px;
	margin: 0 auto;
}

.innerFreezePane a
{
	color: #6060ff;
	text-decoration: underline;
}

.smallGrey
{
	color: #606060;
	font: 10pt Arial, Sans-Serif;
}

/* ============================================================================================================== */

div.header
{
	text-align: left;
	font-family: Tahoma, Arial, Sans-Serif;
	font-size: 16pt;
	color: #404060;
	background-color: #336699;
/*
	background-color: #b5cb63;	
	color: #7e8e3d;
*/
	padding: 0px 20px 0px 20px;
	border-bottom: solid 3px #404040;

	background-image: url(img/grad_h.png);
	background-repeat: repeat-x;
	height: 65px;
}

div.header a#logo
{
	float: left;
	text-decoration: none;
/*	color: #7e8e3d;	*/
	color: #f0e000;
}

div.header a
{
	color: #cccc66;
}

div.status
{
	display: inline;
	float: right;
	font: 10pt Arial, Sans-Serif;
	color: #e0e0e0;
	padding: 5px;
}

div.centering
{
	text-align: center;
	width: 100%;
}

div.centering table
{
	margin: 0 auto;
}

span.tip
{
	color: #606060;
}	

/* ============================================================================================================== */

div.titleBar
{
	padding: 5px 10px 5px 10px;
	border: solid 2px #4f81bd;
	background-color: #ffffdd;
	font: 10pt Arial, sans-serif;
}

div.titleBar img
{
	float:left;
	margin-right: 15px;
	max-width: 100px;
	max-height: 100px;
	min-width: 50px;
	min-height: 60px;
}

div.titleBar .title
{
	float: left;
	width: 590px;
}

div.titleBar .title h1
{
	font: 14pt Arial, sans-serif;
	margin: 0px;
}

div.mainContainer
{
	width: 740px;
}

div.topButtonBar
{
	width: 740px;
	height: 28px;
}

div.topButtonBar a
{
	float: right;
	height: 20px;
	padding: 4px 10px 2px 10px;
	font: 10pt Arial, Sans-Serif;
}

div.topButtonBar a.button,
div.topButtonBar a.firstButton,
div.topButtonBar a.selectedButton
{
	border-left: solid 2px #4f81bd;
	border-top: solid 2px #4f81bd;
	border-right: solid 2px #4f81bd;
	background-color: #eeeeee;
	cursor: pointer;
	color: #000;
}

div.topButtonBar a.firstButton
{
}

div.topButtonBar a.button
{
	border-left: none;
}

div.topButtonBar a img
{
	vertical-align: middle;
	margin-right: 2px;
}

div.topButtonBar a.selectedButton
{
	background-color: #ffffdd;
	border-bottom: solid 2px #ffffdd;
	position: relative;
	margin-bottom: -2px;
}

div.topButtonBar a:hover
{
	background-color: #ffffdd;
	text-decoration: none;
}

div.topButtonBar a.plain:hover
{
	background-color: inherit;
	text-decoration: underline;
}

div.topButtonBar div.buttonSpacer
{
	width: 40px;
	background-color: #ffffff;
	border: none;
	cursor: default;
	float: right;
	border: solid 1px #fff;		/* Needed by a bug in FF, otherwise takes no witdth with anchors */
}

div#chapterList
{
	float: left;
	font: 9pt Arial, Sans-Serif;
	width: 110px;
}

div#chapterList a
{
	float: right;
	width: 70px;
	height: 20px;
	background-color: #eeeeee;
	border-top: solid 2px #4f81bd;
	border-left: solid 2px #4f81bd;
	padding: 4px 10px 2px 10px;
	cursor: pointer;
	color: #000;
}

div#chapterList a.selectedChapter
{
	width: 85px;
	height: 20px;
	border-bottom: solid 2px #4f81bd;
	background-color: #ffffdd;
}

div#chapterList a.lastChapter
{
	border-bottom: solid 2px #4f81bd;
}

div#chapterList a.nextChapter
{
	border-top: none;
}

div#chapterList a.all
{
	font-weight: bold;
}

div#chapterList a.addChapter
{
	background-color: #fbfbfb;
	color: #606060;
	border-left: solid 2px #6fa1dd;
	border-bottom: solid 2px #6fa1dd;
}

div#chapterList a:hover
{
	background-color: #ffffdd;
	text-decoration: none;
}

div#chapterList div.chapterSpacer
{
	border: none;
	background-color: #ffffff;
	height: 15px;
	cursor: default;
}

div.notesPanel
{
	float: left;
	width: 600px;
	border: solid 2px #4f81bd;
	background-color: #ffffdd;
	padding: 10px;
	font: 10pt Arial, Sans-Serif;
	min-height: 1500px;
	height: auto !important;
	height: 1500px;
}

div.notesPanel hr
{
	height: 1px;
	border: none;
	border-bottom: solid 1px #c0c0c0;
}

img.nt
{
	float: left;
	width: 25px;
}

div.notesPanel .heading
{
	float: left;
	text-align: left;
	font: bold 12pt Arial, sans-serif;
}

.noteRow
{
}

.noteItem
{
	float: left;
	width: 570px;
}

div.notesPanel .contents
{
	cursor: pointer;
	padding: 5px 0px 2px 0px;
	overflow: hidden;
	word-wrap: break-word;		/* for IE 6 */
}

div.notesPanel div.contents:hover
{
	background-color: #fffffd;
}


div.notesPanel .vcontents
{
	padding: 5px 0px 2px 0px;
	overflow: hidden;
	word-wrap: break-word;		/* for IE 6 */
}

.editPanel
{
	width: 100%;
	text-align: right;
}

.editCtls
{
	padding-left: 10px;
	padding-right: 10px;
	font: 10pt Arial, Sans-Serif;
}

.ctl .pg
{
	color: #606060;
	margin-right: 5px;
}

div.notesPanel .ctl
{
	width: 100%;
	text-align: right;
	font: 9pt Arial, sans-serif;
	color: #909090;
}

div.notesPanel .ctl a
{
	text-decoration: underline;
	color: #4f81bd;
}

div.notesPanel .ctl a:hover
{
	color: #ff6060;
}

div.notesPanel .ctl a.author
{
	color: #a0a0a0;
	text-decoration: none;
	font: 8pt Arial, Sans-Serif;
}

div.notesPanel .ctl a.author:hover
{
	color: #4f81bd;
	text-decoration: underline;
}

div.notesPanel .ctl a.author img
{
	margin-left: 5px;
}

div.notesPanel .notePanelInfo
{
	padding: 20px;
}

.left
{
	float: left;
}

.right
{
	float: right;
}

#editNotePanel
{
	padding: 5px 5px 0px 2px;
}

.fillTextBox
{
	width: 98%;
	font: 10pt Arial, Sans-Serif;
}

div.notesPanel h4
{
	color: #606060;
	font: bold 10pt Arial, Sans-Serif;
	border: none;
	margin-top: 2px;
	margin-bottom: 2px;
}

div.notesPanel .hctl
{
	margin-bottom: 10px;
}

.notesFooter
{
	margin: 10px 150px 0px 150px;
	font: 10pt Arial, Sans-Serif;
}

.notesFooter a
{
	margin-right: 20px;
}

.clear
{
	clear: both;
	height: 1px;
	overflow: hidden;
}

.editHeading
{
	text-align: left;
	padding-left: 5px;
	font: bold 10pt Arial, Sans-Serif;
	color: #606060;
}

.commentPanel
{
	padding: 5px 10px 5px 10px;
	background-color: #f0f0f0;
}

#addCommentContainer
{
	background-color: #f0f0f0;
}

#addCommentPanel
{
	padding-top: 5px;
}

.searchResults
{
	margin: 0 auto;
}

.userItem
{
	float: left;
	padding-top: 10px;
	width: 110px;
	text-align: center;
	font: 10pt Arial, Sans-Serif;
}

.userItem img
{
	height: 80px;
	width: 80px;
}

.bookItem
{
	float: left;
	padding: 10px;
	width: 120px;
	text-align: center;
}

.bookItem img
{
	max-width: 120px;
	max-height: 120px;
	height: expression(this.height > 120 ? 120: true);	/* For IE */
	width: expression(this.height < this.width && this.width > 120 ? 120: true);	/* For IE */
	margin: 0 auto;
	padding: 4px;
}

.bookItem a:hover img
{
	border: solid 2px #ccccff;
	padding: 2px;
}

.bookItem .bookTitle
{
	font: 8pt Arial, Sans-Serif;
}

.bookItem .bookAuthor
{
	font: 8pt Arial, Sans-Serif;
	color: #606060;
}

.bookItem .bookInfo
{
	font: 8pt Arial, Sans-Serif;
	color: #606060;
}

/* --- Form Table --- */

table.formTable
{
	margin-left: 30px;
}

table.formTable tr th
{
	text-align: right;
	font-weight: bold;
	vertical-align: top;
}

table.formTable tr th.above
{
	text-align: left;
}

table.formTable tr td
{
	text-align: left;
}

table.formTable tr td.buttons
{
	text-align: right;
}

h3.userTitle img
{
	margin-right: 10px;
}

div.histPanel
{
	padding: 10px;
}

div.histItem
{
	width: 95%;
	background-color: #ffffdd;
	padding: 10px;
}

div.histItem .contents
{
	font: 11pt Arial, Sans-Serif;
	overflow: hidden;
}

div.histItem .byLine
{
	text-align: right;
	color: #909090;
	font: 10pt Arial, Sans-Serif;
}

.tab
{
	padding-right: 25px;
	display: inline-block;
}

.tip
{
	width: 75%;
	margin: 0 auto;
	text-align: center;
	font: italic 10pt Arial, Sans-Serif;
	padding: 2px 10px 2px 10px;
	color: #606060;
	background-color: #fff0c0;
}

.inTip
{
	text-align: center;
	font: italic 10pt Arial, Sans-Serif;
	padding: 2px 10px 2px 10px;
	color: #606060;
}

/* ----- */

.recentItems
{
	padding-left: 40px;
}

.recentItem
{
	font: 10pt Arial, Sans-Serif;
}

.recentItem a
{
	color: #000000;
	text-decoration: none;
}

.recentItem a:hover
{
	color: #4f81bd;
	text-decoration: underline;
}

.recentItem img
{
	margin-right: 2px;
}

.recentItem .smallCover
{
	max-width: 20px;
	max-height: 20px;
	height: expression(this.height > 20 ? 20: true);	/* For IE */
	margin: 0px;
}

.recentItem .recentContents
{
	display: inline;
}

.littleItems .recentItem img
{
	max-width: 20px;
	max-height: 20px;
	height: expression(this.height > 20 ? 20: true);	/* For IE */
	margin: 0px;
}

/* ----- */

.pager
{
	font: bold 8pt Arial, Sans-Serif;
}

.pager a
{
	font: 8pt Arial, Sans-Serif;
	border: solid 1px #aaaaff;
	background-color: #eeeeee;
	color: #606060;
	margin: 0px 2px 0px 2px;
	padding: 1px 6px 1px 6px;
}

.pager a.sel
{
	font-weight: bold;
	background-color: #ffffcc;
	border: solid 1px #6060c0;
}

div #beta
{
	color: #404060;
	font: 14pt Tahoma, Arial, sans-serif;
}

/* --- Hilight Levels -------------------------------------------------- */

b.hl1
{
	color: #000000;
}

b.hl2
{
	color: #606060;
}

b.hl3
{
	color: #909090;
}

/* --- Tour -------------------------------------------------- */
.tourPage
{
	font: 10pt Verdana, Arial, Sans-Serif;
}

.tourPage h1
{
	margin-bottom: 5px;
}

.tourPage p
{
	margin-left: 100px;
	margin-right: 100px;
}

.tourPage ul
{
	margin-left: 120px;
}

.tourPage p img
{
	margin-left: 170px;
}

.tourPage p.topHeading
{
	font: 18pt Arial, Sans-Serif;
	color: #606060;
	margin-top: 0px;
	font-weight: bold;
}

.tourPage p.tourHeading
{
	font: 18pt Arial, Sans-Serif;
	color: #606060;
	margin-top: 60px;
	font-weight: bold;
}

.framed img
{
	padding: 4px;
	border: solid 1px #606060;
}

/* --- Print Panel --- */


div.printPanel .contents
{
	cursor: pointer;
	padding: 5px 0px 2px 0px;
	overflow: hidden;
	word-wrap: break-word;		/* for IE 6 */
}

div.printPanel div.contents:hover
{
	background-color: #fffffd;
}


div.printPanel .vcontents
{
	padding: 5px 0px 2px 0px;
	overflow: hidden;
	word-wrap: break-word;		/* for IE 6 */
}

@media screen and (max-device-width: 480px)
{
	body, div.main
	{
		width: 1000px;
	}
}