body { background-color: #111; font: 0.8125em Helvetica, sans-serif; line-height: 1; color: #111; padding: 4px; }

#container { width: 100%; }

a { color: blue; text-decoration: none; }
a:hover { text-decoration: underline; }

a img { border: none; }

#header h1 { font-size: 4em; margin: 0; padding: 0; color: #000; float: left; }
#header h1 a { color: #222; border: none; }
#header, #footer { background-color: #fff; margin: 0 auto 30px auto; width: 600px; padding: 1.5em; -moz-border-radius: 8px; -webkit-border-radius: 8px; }
#header p { margin: 0; padding: 0; }
#header .details { float: right; margin-top: 0.5em; text-align: right; line-height: 1.5em;}

.fight { background-color: #fff; margin: 0 auto 30px auto; width: 600px; padding: 1.5em 1.5em 0.5em 1.5em; -moz-border-radius: 8px; -webkit-border-radius: 8px; }
.fight h2 { padding: 0; margin: 0 0 20px 0; text-align: left; font-size: 1em; border-bottom: 1px solid #999; color: #333; }
.fight h2.title { color: #000; font-size: 2em; }
.fight h3 { padding: 0; margin: 10px 0; text-align: left; font-size: 5em; text-align: center }
.fight h3.winner { font-size: 6em; color: #009900; }
.fight .details { text-align: center; }
.fight .permalink { float: right; background-color: #fff; border: 1px solid #999; padding: 4px; position: relative; top: -9px; font-size: 2em; }
.references { border-top: 1px solid #999; padding-top: 10px; margin-top: 10px; }

.graph { height: 250px; left: 0; margin: 0 0 0 -30px; }

.page { margin: 0 auto 30px auto; width: 600px; padding: 1.5em; background-color: #fff; -moz-border-radius: 8px; -webkit-border-radius: 8px; }
.page h2 { padding: 0; margin: 0; }

/* Tweets */
.tweets h3 { margin-top: 0; padding-top: 0; }
.tweet { border-top: 1px dashed #D2DADA; margin: 0.5em 0 0 0; padding: 0.5em 0 0 0; font-size: 1.25em }
.tweet .date, .tweet .date a { color: #999;}
.tweet .date a:hover { color: blue; }
.tweet .badge { width: 48px; height: 48px; float: left; margin-right: 0.5em; clear: left; }
.tweet .badge img { width: 48px; height: 48px; }
.tweet .body { float: left; clear: right; width: 520px; }
.tweet .highlight { color: red; }

/* Forms */
form.standard { margin: 0; padding: 0; }
label { font-weight: 900; }

/* Errors */
.fieldWithErrors { clear: none; display: inline; }
div .fieldWithErrors input, form input.fieldWithErrors, div .fieldWithErrors textarea, form textarea.fieldWithErrors, div .fieldWithErrors select, form select.fieldWithErrors { border: 2px solid #ff5555 !important; }
.error, #Error { padding: 4px 2px; margin: 0; margin-top: 10px; margin-bottom: 10px; font-weight: bold; color: red; background-color: #FFDBDB; border-top: 1px solid red; border-bottom: 1px solid red; width: 100%; }
.errorExplanation { padding: 0 0 1px 0; margin: 0 0 10px 0; border: none !important; }
.errorExplanation { background: #f9f9f9 !important; }
.errorExplanation ul { padding: 0; margin: 10px 10px 10px 30px;}
.errorExplanation ul li { font-weight: bold; color: red; }
.errorExplanation h2 { background-position: 4px center; background-repeat: no-repeat; background-image: url('/images/azuki/error.gif'); margin: 0; padding: 3px 0 3px 26px; font-size: 1em; border: none; background-color: #FFDBDB; color: red !important;}
.errorExplanation p { margin: 10px; color: #000; }

.long_message { padding: 0 0 1px 0; margin: 0 0 10px 0; border: none !important; width: 100%;}
.long_message { background: #f9f9f9 !important; }
.long_message ul { padding: 0; margin: 10px 10px 10px 30px;}
.long_message h2 { background-position: 4px center; background-repeat: no-repeat; margin: 0; padding: 3px 0 3px 26px; font-size: 1em; border: none; }
.long_message p { margin: 10px;}

.long_message h2 { background-color: #DBFFDB; color: green; }
.long_info_message h2 { background-color: #DBDBFF; color: #2222AA; }

#helpExplanation { padding: 0 0 1px 0; margin: 0 0 10px 0; border: none !important; width: 95%;}
#helpExplanation { background: #f9f9f9 !important; }
#helpExplanation ul { padding: 0; margin: 10px 10px 10px 30px;}
#helpExplanation h2 { background-position: 4px center; background-repeat: no-repeat; background-image: url('/images/azuki/ok.gif'); margin: 0; padding: 3px 0 3px 26px; font-size: 1em; border: none; background-color: #DBFFDB; color: green;}
#helpExplanation.info { color: #000; font-weight: normal; }
#helpExplanation.info h2 { background-image: url('/images/azuki/info.gif'); color: #222299; background-color: rgb(240, 240, 255);}
#helpExplanation p { margin: 10px;}

.notice, #Notice,
.error, #Error,
.info, #Info { margin: 0 0 10px 0; padding: 4px 0; font-weight: bold; }

.notice, #Notice { color: green; background-color: #DBFFDB; border-top: 1px solid green; border-bottom: 1px solid green; width: 100%; }
.error, #Error { color: red; background-color: #FFDBDB; border-top: 1px solid red; border-bottom: 1px solid red; width: 100%; }
.info, #Info { color: green; background-color: #DBFFDB; border-top: 1px solid green; border-bottom: 1px solid green; width: 100%; }

#Notice .body, #Error .body, #Info .body { margin-left: 24px; }

#Notice, #Error { cursor: pointer; background-position: 4px center; background-repeat: no-repeat }
#Notice { background-image: url('/images/azuki/ok.gif'); }
#Error { background-image: url('/images/azuki/error.gif'); }
#Error span.message_space, #Notice span.message_space { padding: 0; margin: 0; }
.Message { margin: 0; padding: 0; border: 2px solid #ccc; background-color: #f0f0f0; clear: both; width: 40em; }
.Message p { padding-left: 8px;}
.Message .links { padding: 2px 2px 2px 8px; font-weight: bold; }
#Message { position: absolute; z-index: 1010; }