.Hidden {display: none;}
.Invisible {visibility: hidden;}
.Strong {font-weight: bold;}


body {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 80%;
	padding: 0;
	margin: 0;
	background: #aaa;
	}

h1, h2, h3, h4, h5, h6 {text-decoration: none;}

h1, h2 {
	font-family: "Palatino Linotype", "Palatino", "Book Antiqua", serif;
	font-weight: normal;
	margin: 0 0 0.5em 0;
	color: #666;
	}

div {overflow: auto;}
p {margin: 0 0 1.4em 0; padding: 0;}
p.Caption {text-align: center; font-size: 85%;}
p.NotifyMessage {font-weight: bold; color: #080; background: #efe; border: 1px solid #8f8; padding: 0 0.5em;}
p.WarningMessage {font-weight: bold; color: #d00; background: #fee; border: 1px solid #f88; padding: 0 0.5em;}
span.Rating {color: #888;}
img {border: none;}
img.ColourIndicator {vertical-align: bottom;}
h1 {font-size: 180%;}
h2 {font-size: 150%;}
ol, ul {margin-top: 0.5em;}
li {margin: 0; padding: 0;}
a {color: blue;}
a.IconLink img {border: 1px solid #ccf;}
a.IconLink:Hover img {background: #eef;}


/*
###################################
# Page Components
###################################
*/

#pageContainer {
	width: 70em;
	margin: 0 auto;
	padding: 0;
	border-left: 3px solid black;
	border-right: 3px solid black;
	}

#headContainer {
	position: relative;
	height: 100px;
	background-color: #275;
	background-image: url(/images/title_bkgnd.png);
	background-position: bottom;
	}

#headContainer h1 {
	position: absolute;
	padding-top: 48px;
	z-index: 2;
	left: 0.6em;
	top: -0.8em;
	font-size: 400%;
	font-weight: normal;
	color: #fff;
	margin: 0;
	word-spacing: -0.2em;
	}

#headLeft {
	position: absolute;
	z-index: 1;
	height: 100%;
	width: 100%;
	background-image: url(/images/title_bkgnd_left.png);
	background-position: bottom left;
	background-repeat: no-repeat;
	}

#headRight {
	position: absolute;
	z-index: 1;
	height: 100%;
	width: 100%;
	background-image: url(/images/title_bkgnd_right.png);
	background-position: bottom right;
	background-repeat: no-repeat;
	}

#headContainer h1 .Minor {
	font-size: 45%;
	font-style: italic;
	position: relative;
	top: -0.4em;
	left: 0.05em;
	}


/*
###################################
# Navigation Bar
###################################
*/

#navBarContainer {
	border-top: 1px solid white;
	height: 26px;
	background-color: #ddd;
	background-image: url("/images/nav_bar_bkgnd_25px.png");
	}

#navBarContainer ul {
	font-weight: bold;
	list-style: none;
	margin: 0;
	padding: 0;
	}

#navBarContainer li {
	float: left;
	border-right: 2px groove white;
	}

#navBarContainer li a {
	display: block;
	line-height: 25px !important;
	font-size: 92%;
	color: #822;
	padding: 0 1em 0 1em;
	text-decoration: none;
	}

#navBarContainer li a:hover {
	text-decoration: underline;
	background-image: url("/images/nav_bar_bkgnd_rollon_25px.png");
	}

#loginInfo {
	position: relative;
	padding-top: 13px;
	top: -0.7em;	
	float: right;
	font-size: 85%;
	color: #444;
	}


/*
###################################
# Content
###################################
*/

#contentContainer {
	width: 100%;
	background-color: white;
	overflow: auto;
	}

#contentLeft {
	float: left;
	width: 64%;
	margin: 2% 1.5%;
	}

#contentRight {
	float: right;
	width: 29%;
	font-size: 85%;
	margin: 2% 1.5%;
	}


/*
###################################
# Footer
###################################
*/

#footContainer {
	position: relative;
	width: 100%;
	height: 75px;
	background-color: #275;
	background-image: url(/images/footer_bkgnd.png);
	border-top: 1px solid black;
	z-index: 0;
	}

#footRight {
	width: 100%;
	height: 100%;
	background-image: url(/images/footer_bkgnd_right.png);
	background-repeat: no-repeat;
	background-position: right;
	}

#footContent {
	position: absolute;
	z-index: 2;
	width: 100%;
	top: 0;
	left: 0;
	color: #ccc;
	text-align: center;
	font-size: 85%;
	padding-top: 1.5em;
	}

#footContent a {color: white;}


/*
###################################
# Right Bar
###################################
*/

div.RightBarItem {
	padding: 1em;
	border: 1px solid #c44;
	margin-bottom: 0.5em;
	}

#leaderboard {border-collapse: collapse;}
#leaderboard td.Rank {width: 2em;}

#resourceList {list-style: none; padding-left: 0; margin-left: 0;}
#resourceList li {margin-bottom: 0.4em;}


/*
###################################
# Forms
###################################
*/

form {margin: 0; padding: 0;}

.TextField, textarea {
/*
	font-family: Verdana, Geneva, sans-serif;
*/
	font-size: 100%;
	border: 1px solid gray;
	background: #efe;
	}

textarea {font-family: sans-serif;}

input.Button, a.Button {
	font-family: Verdana, Geneva, sans-serif;
	font-weight: bold;
	font-size: 85%;
	color: white !important;
	background: #228;
	border-style: solid;
	border-width: 1px;
	border-color: #ccc #000 #000 #ccc;
	padding: 0.3em 1em;
	text-decoration: none;
	}

a.Button {display: block;}
a.Button:Hover {text-decoration: underline; background: #22a;}

div.FieldSet {
	position: relative;
	border: 1px solid #ccc;
	padding: 1.2em 1.2em 0 1.2em;
	margin: 2em 0;
	overflow: visible;
	}

div.FieldSet span.Legend {
	font-weight: bold;
	position: absolute;
	top: -0.7em;
	left: 0.5em;
	background: white;
	padding: 0 0.2em;
	}

div.FieldSet div.Field {position: relative; padding-left: 30%; margin-bottom: 0.8em;}
div.FieldSet div.Field label.Left {position: absolute; left: 0; overflow: visible;}
div.FieldSet div.Field .TextField {width: 75%;}
div.FieldSet div.Field textarea {width: 73%; padding: 1%;}

div.RightBarItem div.Field {margin-top: 0.8em;}
div.RightBarItem div.Field .TextField {width: 98%;}
div.RightBarItem div.Field textarea {width: 96%; padding: 1%;}
div.RightBarItem div.Field .Button {font-size: 100%;}


/*
###################################
# Player Snippets
###################################
*/

div.PlayerSnippet {margin-bottom: 1.5em; overflow: auto;}

img.ProfilePic {
	float: left;
	width: 75px;
	height: 75px;
	border: 1px solid black;
	margin-right: 0.5em;
	}

div.PlayerSnippet span.Name {font-weight: bold; font-size: 120%;}



/*
###################################
# Opponent List
###################################
*/

p.SearchPageNav {color: #888;}


/*
###################################
# Charts
###################################
*/
#ratingChartDiv, #winLossChartDiv {font-size: 85%; margin-bottom: 1.5em; text-align: center;}
#ratingChartDiv img, #winLossChartDiv img {margin-bottom: 0.5em;}
#winLossChartDiv span.Legend img {height: 0.8em; width: 0.8em; vertical-align: middle; border: 1px solid #444;}



span.ChallengeLink  {display: block; font-size: 120%; font-weight: bold; margin-bottom: 0.2em;}
span.ChallengeLink img {vertical-align: bottom;}