/* LilyMei.org CSS Document */

/* Undo browser-defined styles
======================================================================*/
button, code, h1, h2, h3, h4, h5, h6,
input, pre, select, table, td, textarea, th
{ font-size: 1em; }

blockquote, body, br, button, dd, fieldset, form, h1, h2, h3, h4, h5, h6,
html, label, legend, li, pre, table, td, th, { margin: 0; padding: 0; }

/* Basics
======================================================================*/
body { background-color: #3060BF;
background-image:url(images/backgroundpattern.png); }
a { color: #0000AA; }

/* Fonts
======================================================================*/
body, input, select, textarea, h1, h2, h3 { font-family: Georgia, "Times New Roman", Times, serif; }


/* Core layout
======================================================================*/
.column {
	float: left;
	display: inline;
}
.clear { clear: both; }
.calloutright {
	float: right;
	margin-left: 10px;
}

.calloutright p, .calloutleft p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-style: italic;
	font-size: 0.8em;
	color: #888888;
	text-align: center;
	margin-bottom: 1em;
}

.calloutleft {
	float: left;
	margin-right: 10px;
}

.calloutcenter {
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

.calloutcenter p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
}

.quickbutton {
	text-align: center;
	background-color: #888;
	margin-top: 5px;
	margin-bottom: 5px;
}

.quickbutton a {
	position: relative;  /* relative to <li> container */
	display: block;
	padding: 5px;
	color: #FFFFFF;
	background-repeat: repeat-x;
	text-decoration: none;
	top: -2px;           /* move up from container */
	left: -2px;          /* move left from container */
}

.quickbutton a:hover {
	background-image: url(images/quickjumpgradient.png);
	top: 0;           /* move up from container */
	left: 0;          /* move left from container */
}

.quickbutton a:link {
	background-image: url(images/quickjumpgradient.png);
}

.quickbutton a:visited {
	background-image: url(images/quickjumpgradient.png);
}

/*--- Document area; white part of window ---*/
#documentarea {
	background-color: #f2efe6;
	margin: 16px auto 16px auto;
	width: 738px;
	padding: 16px;
   position:relative;
   z-index:2;
}

#headerarea {
}

#menuarea {
	margin-bottom: 20px;
	border-bottom: 3px double #CCCCCC;
}

#menuarea table {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}

#menuarea td {
	text-align: center;
	font-size: 0.8em;
	font-weight: bold;
	color: #AAAAAA;
	padding: 5px;
	border-left: 1px solid #CCCCCC;
}
#IEroot #menuarea td {
	font-size: 0.7em;
}

#menuarea td.firstmenu {
	border-left: none;
}

#menuarea a {
	text-decoration: none;
}

#menuarea a:link {
	color: #444400;
}

#menuarea a:visited {
	color: #444400;
}

#menuarea a:hover {
	color: #777700;
}

#columnsarea {
	width: 738px;
}

#quickjumparea {
	font-family: Georgia, "Times New Roman", Times, serif;
}

#quickjumparea ul {
	list-style-type: none;
	padding-left: 0;
	margin: 0 16px 0 0;
}

#quickjumparea ul li {
	margin-bottom: 4px;
	background-color: #888;
}
#IEroot #quickjumparea ul li {
	height: 1%;
}

#quickjumparea ul li p {
	padding: 5px;
	margin: 0;
	color: #FFFFFF;
	background-color: #CCCCCC;
}

#quickjumparea ul li a {
	position: relative;  /* relative to <li> container */
	display: block;
	padding: 5px;
	color: #FFFFFF;
	background-repeat: repeat-x;
	text-decoration: none;
	top: -2px;           /* move up from container */
	left: -2px;          /* move left from container */
}
#IEroot #quickjumparea ul li a {
	width: 159px;
}

#quickjumparea a:hover {
	background-image: url(images/quickjumpgradient.png);
	top: 0;           /* move up from container */
	left: 0;          /* move left from container */
}

#quickjumparea a:link {
	background-image: url(images/quickjumpgradient.png);
}

#quickjumparea a:visited {
	background-image: url(images/quickjumpgradient.png);
}

.quickjumpbold {
	font-size: 2em;
}

#votenoticearea {
	text-align: center;
	font-size: 1.2em;
	color: #444444;
	margin: 0 16px 0 0;
}

#footerarea {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	text-align: center;
	color: #FFFFFF;
	width: 100%;
}

#footerarea p {
	margin: 0;
}

#footerarea a {
	color: #FFFFFF;
}

#emailarea {
	margin: 0 16px 0 0;
	text-align: center;
}

#emailarea h1 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight: normal;
	margin-bottom: 0;
}

#emailarea p {
	margin-top: 0;
	font-size: 0.9em;
}


/* Rounded Corners
======================================================================*/
.mod {
   position:relative;
   z-index:0;
}
/* x1 = top and left edges; 
   x1a = top right corner; 
   x2 = right and bottom edges; 
   x2a = bottom left corner */
.mod .x1,
.mod .x1a,
.mod .x2,
.mod .x2a {
   display:block;
   background:url(images/glow.png) no-repeat;
   /* turn off for IE6 or use a GIF */
   _background:transparent; 
   width:100%;
   height:100%;
   position:absolute;
}
.mod .x1{
   background-position:0 0;
   z-index:-2;
   top:-12px; /* set to the size of the glow */
   left:-12px;
   bottom:0;
   /* set glow to the edges of 'mod' */
   padding:0 12px 12px 0; 
}
.mod .x1 .x1a {
   height:12px;
   width:12px;
   background-position:100% 0;
   right:-12px;
   top:0;
}
.mod .x2 {
   background-position:100% 100%;
   z-index:-1;
   bottom:-12px;
   right:-12px;
   padding:12px 0 0 12px;
}
.mod .x2 .x2a {
   height:12px;
   width:12px;
   background-position:0 100%;
   left:-12px;
   bottom:0;
}


/* Content
======================================================================*/
#contentarea {
	margin-left: 25%;
	width: 75%;
}

#contentarea h1 {
	margin-top: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.7em;
	font-weight: bold;
	color: #666666;
}

#contentarea h2 {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	margin-bottom: 0;
}

#contentarea p {
	margin-top: 0;
}

#controlarea {
	margin-left: -100%;
	width: 25%;
}