/*The following declarations set the colors, text-alignment, and borders for various elements. 
The width, height, padding, etc. follows in separate declarations.  Most likey you will only want
to change things in this first section and leave the second section alone . */

BODY { 
	background: url(images/VerticalLine.gif) repeat-y 160px top #FFF;
}

HR {
	color: #C00;
	background: #C00;
	height: 6px;
	border: 1px solid #000;
}

A:link, A:visited, A:active { 
	color: #C00; 
	text-decoration: none;
	font-weight: bold;
}

A:hover { text-decoration: underline; }

LABEL, .label, #infoleft, #newestmember { color: #333;}

#banner { }
#middleindex { }
#footer {  }

.tblborder { border: 1px solid #000;}
.tblborder TH { background: #C00; color: #FFF; }

#menu, #menu2, #menu3 {
	border: 2px solid #000;
	border-left: none;
}

#menu2 { background: url(images/BrowseBy.gif) no-repeat top right #C00; }

#menu { background: url(images/MainMenu.gif) no-repeat top right #C00; }

#menu3 { background: url(images/Help.gif) no-repeat top right #C00; }

#tabs {  }
#menu A, #menu2 A, #menu3 A { border-right: 3px solid #000; color: #FFF; }
#menu A:hover, #menu2 A:hover, #menu3 A:hover { 
	border-right: 3px solid #FFF; 
	background: url(images/MenuPointer.gif) no-repeat center right #FFF; 
	color: #C00; 
}
#menu #current { 
	background: url(images/MenuPointer5.gif) no-repeat center right;
	color: #FFF; 
}
#menu #current:hover, #menu2 #current :hover, #menu3 #current :hover { 
	border-right: 3px solid #FFF; 
	background: url(images/MenuPointer.gif) no-repeat center right #FFF; 
	color: #C00; 
}
#pagelinks a, #alphabet a, #next a, #prev a { 
	background: #c00; 
	border: 1px solid #000; 
	color: #FFF;
}
#pagelinks a:hover, #alphabet a:hover, #next a:hover, #prev a:hover{ 
	background: #000;
	color: #FFF;
}
#pagelinks #currentpage, #alphabet #currentletter { 
	background: #FFF;
	color: #C00;
	border-color: #FFF;
}
#pagelinks #currentpage:hover, #alphabet #currentletter:hover { 
	background: #000;
	color: #FFF;
	border-color: #000;
}

.block { 
	background: url(images/VerticalLine.gif) repeat-y 5px 5px #FFF;
}
.block .title {
	font-size: 16pt;
	line-height: 10pt;
	text-align: right;
	background: #FFF;
	margin: 0;
	padding: 0;
}

.block .content {
	padding: 7px;
	padding-left: 10px;
	border: 2px solid #000;
	border-left: none;
	margin-left: 11px;
}


.listbox .band {
	font-size: 11px;
}

#titleblock {
	background: url(images/HorizontalLine.gif) bottom left repeat-x;
	margin: 1em 15%;
	padding-bottom: 1em;
}
#viewstory .listbox .content {
	border: 0;
}

#recenttitle {
	font-size: 16pt;
	text-align: left;
	color: #C00;
	background: url(images/HorizontalLine.gif) bottom left repeat-x;
	padding: 20px 10px;
}

#newstitle {
	font-size: 16pt;
	text-align: left;
	color: #C00;
	background: url(images/HorizontalLine.gif) bottom left repeat-x;
	padding-bottom: 20px;
}


.new { color: #C00; }


#pagetitle { 
	font-size: 16pt;
	background: url(images/HorizontalLine.gif) repeat-x bottom left;
	width: 70%;
	padding-bottom: 15px;
	margin: 0 15%;
	text-align: center;
}

/* The "Stories" and "Series" labels used in listings */
.sectionheader { text-align: center; font-size: 14pt; color: #C00; margin: 1ex 20%;}


/* Stuff for the index page only */

#welcome { color: #C00; font-size: 14pt; }

#tabs {
	border: 2px solid #000;
	background: url(images/ProfileInfo.gif) no-repeat top left #000;
	margin: 1em;
	margin-right: 0;
	border-right: none;
	padding-left: 30px;
}

#tabs A {
	padding-left: 10px;
	border-left: 2px solid #FFF;
	color: #FFF;
	background: url(images/MenuPointer3.gif) no-repeat -8px center #C00;
}

#tabs A:hover, #tabs #active A:hover {
	border-left: 2px solid #C00;
	background: url(images/MenuPointer4.gif) no-repeat -8px center #FFF;
	color: #C00;
	padding-left: 10px;
}

#tabs #active A {
	border-left: 2px solid #000;
	background: url(images/MenuPointer2.gif) no-repeat -8px center #C00;
	color: #000;
	padding-left: 10px;
}
/* The following declarations set all elements BUT color.  You're strongly encouraged not to edit anything below this point. */

BODY { margin: 0; padding: 0; }

/* Make labels in forms stand out. */
LABEL, .label { font-weight: bold; }

/* Make the text in select boxes smaller. */
SELECT { font-size: 10px; }

HR { 
	width: 70%; 
	margin: 1ex auto;
}

#banner { height: 150px;  text-align: right; }
#sitename { font-size: 50px; padding: 20px 1em 0;}
#slogan { font-size: 24px; text-align: right; }
#welcome { margin: 1em 10%; }

#container1 { float: left; width: 100%;}
#container2 { width: 100%; }


/* The columns */
#leftindex { width: 200px; float: left; padding: 0; }
#middleindex { margin: 0 0 0 207px; height: 450px; padding-bottom: 1em; width: auto;}
html>body #middleindex { height: auto; min-height: 450px; margin: 0 0 0 210px;}

/* The inner 2 columns on the index page */
#innerleftindex { 
	width: 300px;
	float: left;
	padding: 0px;
}

#innerrightindex {
	margin: 0;
	margin-left: 300px;
	padding: 0;
	padding-top: 1ex;
}

/* Bottom navigation */
#bottom-nav { width: 200px; float: left; padding; 0; }

#footer { margin: 1em; margin-left: 200px; padding: 5px 1em;}


.tblborder { border-collapse: collapse; padding: 5px;}


/* Center the skinchange and rss in the left hand column.  Also give the skin a 1ex top and bottom margin */
#skin { margin: 1ex auto; text-align: center; }
#rss { text-align: center; margin: 1ex 0;}


#menu, #menu2 { margin: 30px 0 1em 0; }

#menu3 { margin: 0 0 1em 0; }
#menu A, #menu2 A, #menu3 A { display: block; padding: 0 4px; margin-right: 30px;}
#menu A:visited, #menu2 A:visited, #menu3 A { display: block; }
#menu A:active, #menu2 A:active, #menu3 A:active { display: block; }
#tabs { 
	float: right; 
	width: 250px; 
}
#tabs A { display: block;}

/* The login block form has an ID of loginblock so you can style it as you wish. */
#loginblock { padding: 5px; margin: 5px 1em;}
#loginblock LABEL { font-weight: bold; font-size: 14px; display: block;}
#loginblock .button, #loginblock .textbox { font-size: 10px; }
#loginblock #rememberme { display: block; }

.block { 
	margin: 1em 2em;
}

#viewstory .listbox .band { display: none; }

.listbox .band .adminoptions, .listbox .band .respond { 
	display: inline;
}

.listbox .content {
	padding: 7px; 
}


.listbox {
	margin: 1em 0;

}
.listbox .contenteven, .listbox .contentodd { padding: 7px; }

#viewstory .listbox .adminoptions {
	display: block;
	margin: 0 7px 7px; 
}
#info_left, #newestmember { font-weight: bold; }
#info_right { text-align: right !important; }
#newestmember BR { display: none; }

#recenttitle, #newstitle {
	margin-bottom: 1em;
}
#recentcontainer {
	margin: 0 1em;
}

.newstitle {
	font-size: 14pt;
}
.newstitle A, .newsdate {
	font-size: 10pt;
}
.newstory {
	margin: 1ex 2em;
}
.newssig {
	text-align: right;
	margin: 0 4em;
	
}
.newscomments {
	text-align: right;
	margin: 1ex 4em;
}

/* On the news page we want the news comments and the HR to disappear */
#news .newscomments,#news HR {
	display: none;
}

#newsarchive { 
	text-align: center;
	margin: 1em;
}

.commentodd, .commenteven {
	margin: 1em;
}

.commentodd .adminoptions, .commenteven .adminoptions {
	text-align: right;
}
.commentsig {
	margin-left: 4em;
}
/* Used in a couple places to clear floated elements */
.cleaner { 
	clear: both;
	height: 1px; 
	font-size: 1px;
	border: medium none; 
	margin: 0; 
	padding: 0; 
	background: transparent;
}

#pagelinks, #alphabet { 
	text-align: center; 
	margin: 1em 0; 
	line-height: 25px; /* Keeps the links separate if they need to scroll to more than one line */
}
#pagelinks a, #alphabet a { 
	padding: 2px 6px; 
	margin: 0; 
	margin-left: -1ex; 
	text-decoration: none; 
}


/* The profile portion of the viewuser page */
#profile { padding: 10px; }

/* tabs control the 3 links for stories, favorite stories/series, and favorite authors.  Generally, they're below the user profile.  In 1.1 you had no options in this.
With 2.0, you can put those links whereever you want. */

/* Some things on viewstory */
.jumpmenu { text-align: right; margin: 1ex;}
.jumpmenu2 { text-align: center; }
#viewstory .respond { text-align: center; margin: 1em; }

#story, #output { margin: 0 1em 0 0; }

#next { float: right; margin: 1ex 2em;}
#prev { float: left; margin: 1ex 2em;}
#next A, #prev A { padding: 3px; }

#vusort { 
	margin: 0 1em;
	text-align: right;
}

#profile .adminoptions { display: inline; }
.new {
	font-style: italic; 
	font-weight: bold;
}

.infolinks {
	display: block;
}

.poll { border: 1px solid #000; }

.ellipses { padding-right: 1ex; }

.featured, .retired { float: left; }

#reviewform, .jumpmenu2 { margin: 1em; }