/* azcoder.css */
/* colors
1365AD	6089AD	869BAD	2F5373	172939	486782	758796
 */
/* osnr.css */
html {
    height: 100%;
    padding: 0px;
    margin: 1px;
}

body {
    background-color: #222;
    margin: 1px;
    padding: 0px;
    height: 100%;
    font-family: "Arial",sans-serif;
}

a {
    text-decoration: underline;
    color: #6054B2;
}

a:hover {
    text-decoration: none;
}

p {
  line-height: 1.3em;
}

img {
    border: 0;
    vertical-align: top;
}

h1 {
	font-size: 1.6em;
}

h2 {
    font-size: 1.4em;
}

h3 {
	font-size: 1.2em;
}

h4 {
	font-size: 1em;
	background-color: #6089AD;
	color: #000;
	padding: 10px;
	margin: 0px;
	width: 100%;
	border-radius: 5px;
}

h5 {
    font-size: 0.8em;
}

h6 {
    font-size: 0.6em;
}

h1.index
{
	background-color: #6089AD;
	color: #000;
	padding: 10px;
	margin: 0px;
	width: 100%;
	border-radius: 5px;
}

form {
    margin: 20px 0px 20px 10px;
}

li a {
    text-decoration: underline;
    line-height: 1.5;
}

li a:hover {
    text-decoration: none;
    line-height: 1.5;
}

#clear {
    clear: both;
}

/* master div to center page content correctly */
div#main {
    position: relative;
    margin: 0px auto;
    width: 1024px;
    min-height: 99%;
    background-color: #EEE;
    padding: 0px 0px 10px 0px;
}

/* header logo */
div#header {
    margin: 0px;
    padding: 0px;
    background-color: #869BAD;
    text-align: left;
    width: 100%;
    height: 286px;
}

div#header h1 a {
	background-image: url("/images/azcoder_logo.jpg");
	background-repeat: no-repeat;
	background-size: 1024px 298px;
	overflow: hidden;
	outline: none;
	float: left;
	width: 1024px;
	height: 298px;
	text-decoration: none;
	margin-left: 0px;
}

div#footer {
	position: absolute;
	bottom: 5px;
	font-size: 0.7em;
	text-align: center;
	line-height: 1.3;
	padding: 10px 0px 10px 0px;
	width: 100%;
}

div#main_content /* the primary area for content */ {
	position: relative;
	float: left;
	text-align: left;
	width: 70%;
	margin: 10px 0px 0px 10px;
	padding: 0px 0px 120px 0px;
}

div#side_content {
	border: 1px solid #6089AD;
	border-radius: 10px;
	float: right;
	text-align: left;
	margin: 10px 10px 0px 10px;
	width: 230px;
	background-color: #FFF;
	padding: 5px 5px 0px 10px;
}

div#gambitWheel {
	background: url(/images/GambitRoyale/gr_background.png);
	background-repeat: no-repeat;
	overflow: scroll;
	margin: 30px 0px 30px 0px;
	padding: 0px 10px 10px 5px;
	display: hidden;
	width: 720px;
	height: 400px;
	overflow: scroll;
	border-radius: 10px;
	border: 1px solid #6089AD;
	background-color: #FFF;
}

div#darkTidesWheel
{
	background: url(/images/DarkTides/dt_background.png);
	background-repeat: no-repeat;
	overflow: scroll;
	margin: 30px 0px 30px 0px;
	padding: 0px 10px 10px 5px;
	display: hidden;
	width: 720px;
	height: 400px;
	overflow: scroll;
	border-radius: 10px;
	border: 1px solid #6089AD;
	background-color: #FFF;
}

div#darkTidesWheel,div#gambitWheel img {
	border: 1px #172939 solid;
}

p#alt-text,p#title-text {
	padding: 5px;
	font-weight: bold;
	width: 400px;
}

input#left-btn {
	position: absolute;
	top: 50px;
	left: 10px;
	width: 50px;
	border: 1px solid #758796;
	background: #6089AD;
}

input#left-btn:hover
{
	background: #1365AD;
}

input#right-btn {
	position: absolute;
	top: 50px;
	left: 80px;
	width: 50px;
	border: 1px solid #758796;
	background: #6089AD;
}

input#right-btn:hover
{
	background: #1365AD;
}

div#content p {
	padding: 4px;
}

div#content p:first-letter {
	font-size: 22px;
}

div#comm_logos {
	padding: 5px;
}

div#comm_logos h3
{
	background-color: #869BAD;
	color: #000;
	padding: 10px;
	width: 90%;
	border-radius: 5px;
}

div#comm_logos a {
	display: block;
}

div#gambitPromo {
	margin-top: 120px;
}

div#gambitImages img {
	width: 160px;
	border: 1px solid #0000FF;
	cursor: pointer;
}

div#side_content div.infoarea {
    margin-top: 20px;
    text-align: center;
}

div#side_content div.infoarea img {
    padding: 10px;
}

div#side_content ul {
    list-style: none;
    text-align: left;
    margin: 10px 0px 20px 0px;
    padding: 0px;
    float: right;
    width: 100%;
    font-size: 0.9em;
}

#total_spam {
    color: #443C7F;
    font-weight: bold;
}

#nav
{
    list-style: none;
    font-weight: bold;
    margin-bottom: 10px;
    float: left;
    width: 100%;
    position: relative;
    z-index: 5;
}

#nav li
{
    float: left;
    margin-right: 2px;
    position: relative;
    text-align: center;
    /* 1365AD	6089AD	869BAD	2F5373	172939	486782	758796 */
}

#nav a
{
    display: block;
    padding: 5px;
    color: #FFF;
    background: #1365AD;
    text-decoration: none;
    width: 100px;
}

#nav a:hover
{
    color: #000;
    background: #6089AD;
    text-decoration: none;
}

/*--- DROPDOWN ---  pulled from http://csswizardry.com/2011/02/creating-a-pure-css-dropdown-menu/ */
#nav ul{
    background:#fff; /* Adding a background makes the dropdown work properly in IE7+.*/
    background:rgba(255,255,255,0); /* Make the background fully transparent */
    list-style:none;
    position:absolute;
    left:-9999px; /* Hide off-screen when not needed (this is more accessible than display:none;) */
}
#nav ul li{
    padding-top:1px; /* Introducing a padding between the li and the a give the illusion spaced items */
    float:none;
}
#nav ul a{
    white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */
    width: 100%; /* Makes dropdown item scale correctly for variable text width */
}
#nav li:hover ul{ /* Display the dropdown on hover */
    left:0; /* Bring back on-screen when needed */
}
#nav li:hover a{ /* These create persistent hover states, meaning the top-most link stays 'hovered' even when your cursor has moved down the list. */
    background:#486782;
}
#nav li:hover ul li a:hover{ /* Here we define the most explicit hover states--what happens when you hover each individual link. */
    background:#2F5373;
}

ul.posting {
    margin: 10px 10px 10px 20px;
}

ul.posting li {
    list-style-type: circle;
    margin: 0px;
    padding: 0px;
    line-height: 1.5;
}

ul#menu {
    float: left;
    margin: 0 auto;
    padding: 0px;
    text-align: center;
    cursor: default;
}

ul#menu li {
    float: left;
    display: inline;
    list-style-type: none;
    color: #000;
    margin: 0px;
    padding: 3px 0px 3px 0px;
    width: 90px;
    border-right: 2px #2D2665 solid;
}

ul#menu li:hover {
    background-color: #1365AD;
    float: left;
    display: inline;
    list-style-type: none;
    color: #FFF;
    margin: 0px;
    padding: 3px 0px 3px 0px;
    width: 90px;
}

#searchForm {
    float: right;
    margin: 0px 5px 0px 0px;
    padding: 0px;
}

#searchForm input.searchBtn {
    border: none;
    background: none;
    margin: 0px;
}

#searchForm input.searchBtn:hover {
    color: #FFF;
    background-color: #8878FE;
}

#searchBox {
    width: 150px;
    font-size: 12px;
    margin: 0px;
    padding: 0px;
}

div.postIntro {
    margin: 5px 0px 10px 0px;
    color: #888;
    font-size: .8em;
}

ul#posting li.year {
    padding-top: 15px;
    margin: 0px;
    font-size: 1.4em;
}

ul#posting li.month /* used by month images only */ {
    padding-top: 10px;
    margin: 0px;
}

div#newsItem {
    margin-bottom: 20px;
}

div#newsItem p, ul#posting p {
    font-size: 0.9em;
    line-height: 1.5;
    margin-top: 5px;
}

div#newsItem span.first, ul#posting span.first {
    font-size: 1.8em;
    line-height: 1;
}

ul#posting .subject, div#newsItem .subject {
    color: #6054B2;
}

#registerForm, #contactForm, #loginForm, #commentForm, #resetForm {
    margin: 30px 0px 0px 0px;
}

#registerForm input, #contactForm input, #loginForm input, #commentForm input, #resetForm input {
    border: 1px solid #9F92FE;
    margin-bottom: 10px;
    width: 150px;
}

#registerForm label, #contactForm label, #loginForm label, #commentForm label, #resetForm label {
    width: 220px;
    float: left;
    text-align: right;
    font-size: 12px;
}

#commentForm span.left {
    float: left;
    text-align: right;
    width: 220px;
    margin-bottom: 10px;
    font-size: 12px;
}

#commentForm span.right {
    float: left;
    font-size: 12px;
    text-align: left;
    margin-bottom: 10px;
}

#loginForm span {
    float: right;
    font-size: 12px;
}

#registerForm label.error, #contactForm label.error, #commentForm label.error, #resetForm label.error {
    float: none;
    display: none;
    background: url('/images/error.png') no-repeat;
    padding-left: 16px;
    margin-left: .3em;
}

#registerForm label.valid, #contactForm label.valid, #commentForm label.valid, #resetForm label.valid {
    float: none;
    background: url('/images/check.png') no-repeat;
    display: none;
}

#registerForm div, #contactForm div, #loginForm div, #commentForm div, #resetForm div {
    clear: both;
}

span.error {
    color: red;
    font-size: 0.9em;
}

span.searchResult {
    font-weight: bold;
    background-color: yellow;
}

div.result a {
    text-decoration: underline;
    color: #3377DC;
}

table.displayList {
    width: 100%;
    margin-top: 10px;
}

table.displayList th {
    text-align: left;
}

table.displayList tr.odd {
    background-color: #CFDCE6;
}

table.displayList tr.even {
    background-color: #FFF;
}