/*
 * Style sheet for RolePlay OnLine -- http://rpol.net
 *
 * CSS validated at "http://jigsaw.w3.org/css-validator/" - W3C's online validation service
 */

/* Basic body colours */
body {
	background: #fafafa;
}


/* Colouring of text around the site */
body, th, td, .normal_text, textarea, select, option, button, legend, .form, #form-menu a, #form-menu a:visited {
	color: #000000;
	}


/* Messages, ie the stuff in threads */
td.message, td.message_alt, #form-menu a {
	border-color: #cccccc;
	}

td.message, #form-menu a:hover {
	background: #eeeeee;
	}

td.message_alt, optgroup {
	background: #e8e8e8;
	}

.messsage_information {
	border-color: #cccccc;
	color: #3a76d6;
	}

.hide, span.hide, .hide * {
	color: #eeeeee !important;		/* Colour of hidden text (ie same as the backgound) in a normal message (td.message) */
	background-color: #eeeeee !important;
	border-color: #eeeeee !important;
	}

.message_alt .hide, .message_alt span.hide, .message_alt .hide * {
	color: #e8e8e8 !important;		/* Colour of hidden text (ie same as the background) in td.message_alt */
	background-color: #e8e8e8 !important;
	border-color: #e8e8e8 !important;
	}

td.message .links {
	color: #cccccc;		/* Sets the font colour, mainly for the pipes between links */
	}

td.message_alt .links {
	color: #bbbbbb;		/* Sets the font colour, mainly for the pipes between links */
	}

.message_table th {
	background: #dddddd;		/* Background shading of table headers */
	border-color: #cccccc;
	border-bottom-color: #bbbbbb;	/* If desired, I wouldn't make it too different */
	}

.message_table td {
	background: #eeeeee;		/* Shading of normal table cells */
	border-color: #cccccc;
	}

.message_alt td.quote, .message td.quote .quote {	/* We could go nuts here ... */
	background-color: #eeeeee;	/* Generally the same as td.message */
	border: 1px solid #bbbbbb;
	}

.message td.quote, .message_alt td.quote .quote {
	background-color: #e8e8e8;	/* Generally the same as td.message_alt */
	border: 1px solid #bbbbbb;
	}

.page_links td, .page_links th {
	border-color: #cccccc;
	}


/* Sticky List (Game List) */
#stickylist {
	background-color: #dddddd;
	color: #000000;
	}

div.stickyblock {
	background-color: #eeeeee;
	border: 1px #cccccc dashed;
	}


/* Header and Footer colouring */
#header {
	background: #eeeeee;	/* The background colour of the header */
	border-bottom: 4px solid #cccccc;
	}

#contents {
	}

#footer {
	background: #dddddd;	/* The background colour of the footer */
	border-color: #bbbbbb;
	}

.header td {
	color: #cccccc;		/* Sets the font colour, mainly for the pipes between links */
	}

.footer td {
	color: #bbbbbb;		/* Sets the font colour, mainly for the pipes between links */
	}

#quick_login {
	background: #eeeeee;	/* The background colour of the quick login bar next to the header */
	border-color: #cccccc;
	}


/* Form colouring */
.form input, .input, .password, textarea, select, option, button, .submit, .submit-hover, #form-menu a, #form-menu a:visited {
	background: #f5f5f5;
	border-color: #cccccc;
	}

.submit {
	background: #eeeeee;
	color: #3a76d6 !important;
	border-color: #cccccc;
	
	filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr='#ffffffff',EndColorStr='#ffdddddd');
	background: -moz-linear-gradient(top, #ffffff 0%, #dddddd 66%, #ffffff 100%);
	background: -webkit-linear-gradient(top, #ffffff 0%, #dddddd 66%, #ffffff 100%);
	background: linear-gradient(top, #ffffff 0%, #dddddd 66%, #ffffff 100%);
	}

.submit-hover, .submit:hover, .submit:active {
	background: #e5e5ea;
	color: #cc0000 !important;
	border-color: #cccccc;
	
	filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr='#ffffffff',EndColorStr='#ffc5c5ca');
	background: -moz-linear-gradient(top, #ffffff 0%, #c5c5ca 66%, #ffffff 100%);
	background: -webkit-linear-gradient(top, #ffffff 0%, #c5c5ca 66%, #ffffff 100%);
	background: linear-gradient(top, #ffffff 0%, #c5c5ca 66%, #ffffff 100%);
	}

/* Repeats of above, but keeping the child selectors separate as it breaks (older) IE processing */
input[type='submit'], input[type='button'] {
	background: #eeeeee;
	color: #3a76d6 !important;
	border-color: #cccccc;
	
	filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr='#ffffffff',EndColorStr='#ffdddddd');
	background: -moz-linear-gradient(top, #ffffff 0%, #dddddd 66%, #ffffff 100%);
	background: -webkit-linear-gradient(top, #ffffff 0%, #dddddd 66%, #ffffff 100%);
	background: linear-gradient(top, #ffffff 0%, #dddddd 66%, #ffffff 100%);
	}
  
input[type='submit']:hover, input[type='button']:hover {
	background: #e5e5ea;
	color: #cc0000 !important;
	border-color: #cccccc;
	
	filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr='#ffffffff',EndColorStr='#ffc5c5ca');
	background: -moz-linear-gradient(top, #ffffff 0%, #c5c5ca 66%, #ffffff 100%);
	background: -webkit-linear-gradient(top, #ffffff 0%, #c5c5ca 66%, #ffffff 100%);
	background: linear-gradient(top, #ffffff 0%, #c5c5ca 66%, #ffffff 100%);
	}


/* Colouring of hyperlinks, everwhere */
/* Now done after forms to ensure hover works for visited links */
a, a:link, a:visited, .link-colour, li.more:after {
	color: #3a76d6;
	}

a:hover, a:active, .alink-colour, a.button_on, li.more:hover:after, #form-menu a:hover {
	color: #cc0000;
	}

#header a {
	border-color: #000000;
	}

#header a:hover, #header a:active, a.button_on {
	background-color: #dddddd;
	border-color: #aaaaaa;
	}

#footer a {
	border-color: #000000;
	}

#footer a:hover, #footer a:active {
	background-color: #cccccc;
	border-color: #999999;
	}


/* Tables, borders, box areas etc (not those used for users in messages) */
.border {
	border-color: #cccccc;
	}

.info_table {		/* Things like character list, message boxes */
	border: 1px solid #cccccc;
	}

.info_table th {
	background: #dddddd;
	color: #000000;
	border-bottom: 1px solid #cccccc;
	}

.info_table td {
	background: #eeeeee;
	color: #000000;
	}

.info_box {
	background: #eeeeee;
	border: 1px solid #cccccc;
	border-bottom-color: #bbbbbb;
	border-right-color: #bbbbbb;
	}

.info_box td, .info_box th {
	}

.selection_table th, div.side-tab {
	background: #dddddd;
	color: #000000;
	}

.selection_table td, .highlight tr.clr:hover td, div.niftybox {
	background: #eeeeee;
	color: #000000;
	}

.highlight tr:hover td {
	background-color: #e8e8e8;
}

hr {
	color: #aaaaaa;
	background-color: #aaaaaa;
}
