/* Universal declarations on varoius pages throughout the site*/
BODY { 
	background: #A5A; 
	margin: 0;
}

/* site links */
A:link { 
	font-weight: bold; 
	color: #A5A; 
	text-decoration: none;
}
A:visited { 
	font-weight: bold; 
	color: #884589; 
	text-decoration: none;
}
A:hover { 
	text-decoration: underline; 
}
A:active { 
	text-decoration: underline; 
}
/* end site links */

/* Make labels in forms stand out. */
LABEL { 
	font-weight: bold; 
	color: #884589;
}

/* Labels for text around the site. */
.label { font-weight: bold;  }

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

.tblborder { 
	border: 1px solid #884589; 
	border-collapse: collapse; 
}
.tblborder TH { 
	background: #884589;
	color: #E8D1E9; 
}

TH, TD { 
	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;}

/* The menu in the left hand column.  Unlike the rest of the blocks, I didn't put this one inside a div labeled 
block because it's going to have a different appearance than the others.
It's set to output the links as just links instead of an unordered list (see the variables.php)
These declrations override the univeral declarations above.
This lets us set the display of the links as block which gives them all the same width and lets us do 
some neat things with backgrounds and such.
*/
#menu, #menu2 { 
	margin: 0 auto 1ex; 
	border: 1px solid #E8D1E9;
}
#menu A, #menu2 A { 
	display: block; 
	color: #E8D1E9;
	border: 1px solid #E8D1E9;
	background: #884589; 
	padding: 0 4px;
}
#menu A:hover, #menu2 A:hover { 
	display: block; 
	background: #E8D1E9; 
	color: #884589; 
	text-decoration: none; 
	border: 1px solid #884589;
}
#menu A:active, #menu2 A:active { 
	display: block; 
	background: white; 
	color: #884589; 
	border: 1px dashed #884589;
}

/* Because I didn't put the menu block inside a div with the class block I need to style the menu title separately.  
I put the menu title inside it's own div with the id menu_title to do this.*/
#menu_title { 
	font-size: 20px; 
	padding: 0;
	margin: 0;
	line-height: 70%;
	padding-top: 3px;
	font-family: Arial;
	text-align: center; 
	color: #E8D1E9;
}
/* end menu declarations */

/* The login block form has an ID of loginblock so you can style it as you wish. */
#loginblock {
	text-align: left; 
	padding: 5px; 
	width: 130px; 
	margin: 5px 0;
}
#loginblock LABEL { 
	color: white; 
	font-weight: bold; 
	font-size: 14px;
}
#loginblock .button, #loginblock .textbox { font-size: 10px; }

/* All of the blocks except the menu are wrapped in a div with a class of block.  This makes it 
easier to style them the same. This declaration takes care of the blocks in the left column.  
Later in the sheet the blocks on the index page have a separate declaration.
*/

#footer { margin: 1em; color: white; padding-top: 1em;}

#footer A { color: #E8D1E9; }

/* 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;
}

#banner { text-align: center; }

#sitename { font-size: 80px; padding: 25px 1em; color: #E8D1E9;}


/* The following define the 2 column layout */

/* The outer containers.  Use container1 for the left column background and container2 for the right column background.
The background color of the middle column is also controlled by container1. 
*/
#container1, #innercontainer1 { float: left; width: 100%;}
#container2, #innercontainer2 { width: 100%; }

/* Bottom navigation */
#bottom-nav { text-align: center; color: #FFFFFF; padding: 1ex;}
#bottom-nav A:link, #bottom-nav A:visited { color: #E8D1E9; }

/* The left column.  */
#leftcolumn { width: 145px; float: left; padding: 15px 0 0 15px; }

/* The middle column. */
#maincontent { 
	margin: 0 30px 0 185px;
	padding: 5px 1em;
	height: 450px;
	border: 2px solid #884589;
	background: #E8D1E9;
}
html>body #maincontent { height: auto; min-height: 450px; margin: 0 30px 0 175px;}

/* Index left column */
#innerleft { width: 40%; float: left; padding-right: 1em; }
#innerright { margin-left: 40%; }

/* page and alphabet links on various pages */
#pagelinks, #alphabet { 
	text-align: center; 
	font-size: 13px; 
	margin: 1em 0; 
	line-height: 25px;
}
#pagelinks a, #alphabet a { 
	background: #C9C;
	border: 1px solid #A5A;
	padding: 2px 4px;
	margin: 0;
	text-decoration: none;
	color: #884589;
}
#pagelinks a:hover, #alphabet a:hover { 
	border: 1px solid #884589; 
	padding: 2px 4px; 
	margin: 0; 
	text-decoration: none; 
	background: #A5A;
	color: #E8D1E9;
}
#pagelinks #currentpage, #alphabet #currentletter {  
	color: #A5A; 
	padding: 2px 4px; 
	margin: 0; 
	border: 0;
	background: #E8D1E9;
}
#pagelinks #currentpage:hover, #alphabet #currentletter:hover { text-decoration: none; }
 
/* end page and alphabet links */

/* The next and prev links in the viewstory page */
#next, #prev {
	margin: 1em 0;
}
#next A, #prev A {
	padding: 2px 4px; 
	margin: 0; 
	background: #C9C;
	border: 1px solid #A5A;
}
#next A:visited, #prev A:visited { 
	padding: 2px 4px; 
	margin: 0; 
}
#next A:hover, #prev A:hover {  
	border: 1px solid #884589; 
	color: #E8D1E9;  
	padding: 2px 4px; 
	margin: 0;
	background: #A5A;
}
#next A:active, #prev A:active{ 
	border: 1px solid #884589; 
	color: #E8D1E9;  
	padding: 2px 4px; 
	margin: 0;
	background: #A5A;
}
#next { float: right; }
#prev { float: left; }

/* End universal declarations */


/* The blocks in the center  on the index page. */

#maincontent .block { 
	border: 1px solid #000; 
	margin: 1em 1ex; 
	background: #884589;
	padding: 0 25px;
}
#maincontent .block .title { 
	color: #FFF; 
	text-align: right; 
	font-weight: bold; 
	padding: 3px 10px; 
	border: 1px solid #000; 
	border-top: 0;
	background: #A5A;
}

#maincontent .block .content .title { 
	color: #000000; 
	background: #FFF;
	border: 0;
	border-bottom: 1px solid #000;
}

#maincontent .block .content { 
	padding: 5px; 
	background: white;
	border-right: 1px solid #000;
	border-left: 1px solid #000;
}
#maincontent .block .content .content { 
	border: 0;
}

#newscontainer { 
	background: white;
	padding-bottom: 1ex;
	border-left: 1px solid #000;
	border-right: 1px solid #000;
}
.newsodd, .newseven { 
	border-bottom: 1px solid #000; 
	padding: 5px;
	margin: 0 20px 1em;
}
.newstitle { 
	font-weight: bold; 
	font-size: 115%; 
	color: #666666;
}
.newssig { text-align: right; }

.commentodd, .commenteven {
	padding: 7px;
	border: 1px solid #000;
	border-left: 10px solid #A5A;
	border-right: 10px solid #A5A;
	margin: 1em 10%;
	background: #FFF;
}

.commentsig { 
	font-style: italic;
	text-align: right;
	padding-right: 80px;
}

#info_left, #newestmember { font-weight: bold; }
#info_right { text-align: right !important; }
#newestmember BR { display: none; }

#welcome { 
	font-size: 20px;
	margin: 1em 10%;
	text-align: left;
	color: #884589;
}
/* Index page ends here */

/* The "Stories" and "Series" labels used in listings */
.sectionheader { 
	text-align: left;
	font-size: 16pt; 
	margin: 1ex 40% 1ex 0;
	border-bottom: 3px solid #884589;
	color: #884589;
}

/* The page title */
#pagetitle {  
	color: #884589;
	font-size: 18pt; 
	text-align: center; 
	margin: 1ex;
}
#pagetitle:first-letter, html>body #pagetitle A:first-letter {  font-size: 25px; padding: 2px 0px; font-weight: bold;}
/* The sort form on the browse pages */
#sortform { text-align: center; }

/* The boxes for story and series information used around the site.  We're just styling the one's in default_tpl. */
.listboxodd{ 
	margin: 1em 30px;
	border: 1px solid #000;
	background: #884589;
	padding-left: 25px;
}
.listboxeven{ 
	margin: 1em 30px;
	border: 1px solid #000;
	background: #884589;
	padding-right: 25px;
}

.listboxodd .title, .listboxeven .title {
	font-size: 14pt;
}
.dateinfo {
	font-size: 10pt;
	font-weight: normal !important;
	margin-bottom: 1ex;
}
.listboxodd .content, .listboxeven .content {
	background: #FFF;
	padding: 7px;
}

.listboxodd .adminoptions, .listboxeven .adminoptions { display: inline; }

.listbox HR {
	width: 70%;
	height: 1px;
	background: #000;
	color: #000;
	border: 0;
	margin-top: 1em;
}
.infolinks {
	display: block;
	margin-left: 20px;
	margin-top: 1ex;
	font-size: 80%;
}

.listboxodd .tail, .listboxeven .tail {
	font-size: 10pt;
	text-align: right;
}

/* The profile portion of the viewuser page */
#profile { padding: 10px; }
#profile #sort { margin: 1em;}
/* tabs control the tabs below the user's bio information for stories, favorite stories/series, and favorite authors. */
#tabs { 
  padding: 0;
  margin: 0;
  text-align: right;
  min-height: 40px;
}

#tabs SPAN{ 
  padding: 0;
  display: block;
  float: left;
  margin: 0;
  text-align: left;
  color: #E8D1E9;
  font-weight: bold;
  height: 40px;
}

#tabs SPAN A {
  display: block;
  padding: 0 5px;
  background: #C9C;
  border: 1px solid #884589;
  height: 40px;
}
/* The look of links within the tabs.  Generally they're going to have to be different from the regular page links.  
I haven't bothered with the visited or active states. */
#tabs a { 
  color: #E8D1E9; 
}
#tabs a:hover { 
 text-decoration: none;
 color: #FFF;
}

#tabs #active a { 
  text-decoration: none; 
  background: #884589;
}

.new {
	font-size: 12pt;
	font-weight: bold;
	font-style: italic;
	color: #CC0000;
	padding: 0 10px;
}


/* Notes on the viewstory page. */

.notes {
	background: #FFF;
	border: 1px solid #000;
	margin: 1em 10%;
}
.notes .title {
	background: #E8D1E9;
	padding: 5px;
	border-bottom: 1px solid #000;
}
.notes .noteinfo {
	padding: 5px;
}

#rememberme {
	white-space: nowrap;
}

.recentbox { 
	border-left: 1px solid #000; 
	border-right: 1px solid #000; 
	background: #FFF;
	border-bottom: 1px solid #000;
}
#maincontent .block .recentbox DIV {
	padding: 3px 7px;
	border: 0;
	background: #FFF;
	
}

#viewstory .jumpmenu2 { text-align: center; margin: 1em;}