/* Base CSS styles */

.clearfix:after {
     clear: both;
     content: ".";
     display: block;
     height: 0pt;
     line-height: 0;
     visibility: hidden;
}
.clearfix { display: inline-block; }
html[xmlns] .clearfix { display: block; }
* html .clearfix { height: 1%; }

.navbar-inner { background: rgb(44, 44, 44); }
.navbar .logo { float: left; display: block; width: 42px; margin-left: -1.25em; 
    margin-right: 1em; border-radius: 8px; }
.navbar-fixed-top form { margin: 0; padding: 0.5em 0 0.5em 0; display: inline }
.navbar .brand { text-shadow: none; color: #fefefe; }
.navbar .nav li a { text-shadow: none; }

img { max-width: 100%; }

/* For some reason the bootstrap navbar isn't pushing content down without this */
.navbar-fixed-top { position: static; }

.navbar .nav .claim { display: inline; }
.navbar .nav .claim .claim_code { margin: 0.5em 1em; }

.navbar a.notices { font-weight: bold; }
.navbar a.notices:before { content:"\2709\00a0"; font-size: 1.25em; font-weight: normal }

nav.pagination { clear: both; display: block; padding: 1em 0.25em; }
nav.pagination p.showing { display: inline; margin: 0pt; padding: 0pt; }
nav.pagination ul.paging { display: inline; margin: 0pt; padding: 0pt; }
nav.pagination ul.paging li { display: inline; }
nav.pagination ul.paging li.first { }
nav.pagination ul.paging li.last { }
nav.pagination ul.paging li.next { }
nav.pagination ul.paging li.prev { }

section#main { padding: 0.5em 1em; }

section.item_flow { position: relative; }

ul.badges { margin: 0pt; padding: 0pt; }

#home ul.badges { }

#home .home-intro { }
#home .home-intro h1 { margin-bottom: 0.25em; }
#home .home-intro .item { }
#home .home-intro .item .blurb { display: block; min-height: 8.5em; }
#home .home-intro .item .action { }
#home .home-intro .item .action form { display: inline; width: 100%; margin: 0; padding: 0; }
#home .home-intro .item .action .btn { display: block; width: 94% }
#home .home-intro .item .action input.btn { display: block; width: 100%; }
#home .home-intro .item .action .text-input { display: block; width: 98%;
    font-family: monospace; text-align: center; font-size: 1.5em; 
    height: 1.45em; }

ul.badges li { border-radius: 8px 8px 8px 8px; border: 1px solid #EEEEEE;
    list-style: none outside none; margin: 0pt 0.75em 0.75em 0pt; padding: 0pt; }
ul.badges li img { border-radius: 8px 8px 8px 8px; display: block; }

/* HACK: Undo what bootstrap does */
.badge, .badge:hover { padding: 0; font-size: inherit; font-weight: inherit;
    color: inherit; background-color: transparent; border-radius: inherit;
    cursor: default; white-space: inherit }

li.badge { display: block; float: left; position: relative; }
li.badge a.image { display: block; }
li.badge a.label { background: #222222; border-radius: 0pt 0pt 8px 8px; 
    bottom: 0pt; color: #FFFFFF; display: block; opacity: 0.85;
    padding: 0.25em 0pt; position: absolute; text-align: center; 
    white-space: normal;
    text-decoration: none; width: 128px; }
li.badge a.label:before { content: "✸ "; font-size: 1.5em; }
li.badge span.badge_title, li.badge span.relation, li.badge span.user {
    display: block; padding: 2px; }

ul.awards { margin: 0pt; padding: 0pt; }
ul.awards li.award {
     border-radius: 8px 8px 8px 8px;
     border: 1px solid #DDDDDD;
     float: left;
     height: 128px;
     list-style: none outside none;
     margin: 0pt 0.75em 0.75em 0pt;
     position: relative;
     width: 256px;
}
ul.awards li.award img { border-radius: 8px 8px 8px 8px; }
ul.awards li.award a.avatar_image { position: absolute; right: 0pt; }
ul.awards li.award a.award_image { position: absolute; left: 0pt; }
ul.awards li.award span.badge_title, li.award span.relation, li.award span.user {
     background: none repeat scroll 0pt 0pt #000000;
     border-radius: 8px 8px 8px 8px;
     font-size: 1em;
     color: #FFFFFF;
     display: block;
     opacity: 0.75;
     padding: 0.25em 0pt;
     position: absolute;
     text-align: center;
     text-decoration: none;
     z-index: 10;
}

ul.awards li.award span.badge_title { border-radius: 0pt 0pt 8px 8px;
    bottom: 0pt; left: 0pt; width: 128px; white-space: normal }

ul.awards li.award span.badge_title:before { content: "✸ "; font-size: 1.5em; }

ul.awards li.award span.relation {
     border-radius: 8px 8px 8px 8px;
     bottom: 40px;
     bottom: 4em;
     left: 80px;
     opacity: 0.75;
     width: 96px;
}

ul.awards li.award span.relation:after { content: " ⇨"; font-size: 1.25em; }
ul.awards li.award span.user { border-radius: 0pt 0pt 8px 8px;
     bottom: 0pt; right: 0pt; width: 128px; white-space: normal }
ul.awards li.award span.user:before { content: "☺ "; font-size: 1.25em; }
ul.awardees { margin: 0pt; padding: 0pt; }

ul.awardees li.awardee {
     float: left;
     height: 128px;
     list-style: none outside none;
     margin: 0pt 0.75em 0.75em 0pt;
     position: relative;
     width: 128px;
}

ul.awardees li.awardee .avatar_image img { border-radius: 8px 8px 8px 8px; }
ul.awardees li.awardee a.label span.user { white-space: normal; }

ul.awardees li.awardee .label {
     background: none repeat scroll 0pt 0pt #000000;
     border-radius: 0pt 0pt 8px 8px;
     bottom: 0pt;
     color: #FFFFFF;
     left: 0pt;
     opacity: 0.8;
     padding: 0.25em 0pt;
     position: absolute;
     text-align: center;
     text-decoration: none;
     width: 128px;
     z-index: 10;
}

ul.awardees li.awardee .label:before { content: "☺ "; font-size: 1.25em; }

dl.badge a.image img, dl.profile img.avatar { border-radius: 8px; }

dl.badge img.avatar, dl.award img.avatar, dl.nomination img.avatar { 
    width: 64px; height: 64px; border-radius: 4px; margin: 0.5em 0.5em 0 0;
    padding: 0; vertical-align: text-top; display: block }

dl.award dd.awarded_to a {  }
dl.award dd.awarded_to img.avatar { width: 160px; height: 160px; }

form { }
form fieldset { border: 1px solid #CCCCCC; margin: 1em 0.25em; padding: 0.5em; }
form ul { margin: 0pt; padding: 0pt; }
form ul li { list-style: none outside none; margin: 0pt; padding: 0.25em; }
form ul li label {
    background: #eee; border-radius: 8px 8px 8px 8px; float: left;
    font-weight: bold;
    margin: 0 0.5em 0 0; min-height: 1.125em;
    padding: 0.25em 0.25em 0.25em 0.25em; 
    text-align: right; width: 14ex;
}
form ul li input[type=text], form ul li textarea { width: 33%; min-width: 25em }
form ul li p.notes, form ul li p.help { margin: 0 0 0 17.5ex;
    padding: 0.125em 0.25em; color: #555; font-style: italic; font-size: 0.9em }
form ul li ul.errorlist { color: red; margin: 0pt 0pt 0pt 16ex; }
form ul li input.submit { width: inherit; min-width: inherit; margin-left: 14ex;
    margin-top: 1em; padding: 0.5em; }
form ul li div.clearablefileinput { margin: 0 0 0 16.5ex; }
form ul li div.clearablefileinput .clear label { float: inherit;
    display: inline; margin: inherit; text-align: inherit; width: auto }
form#edit_badge ul li div.clearablefileinput .clear { display: none; }

section.sample-badge { }
section.sample-badge dl.badge p { font-size: 0.95em; margin: 1.15em 0 0 0; 
    padding: 0; width: 66% }

ul.btn-list { list-style: none; margin: 0; padding: 0 }
ul.btn-list li { display: inline; }

dl { }
dl dt { background: #eee; border-radius: 8px 8px 8px 8px; float: left;
    margin: 0pt; min-height: 1.125em; padding: 0.25em 0.25em 0.25em 0pt; 
    text-align: right; width: 15ex; }
dl dd { clear: right; display: block; margin: 0pt 0pt 0pt 17ex; 
    min-height: 1.25em; padding: 0.5em 0pt; text-indent: 0pt; }
dl dd.actions { padding: 0; }
dl dd.btn-group { padding: 0 0 0.125em 0; }
dl dd.btn-group form { display: inline; padding: 0; margin: 0 }
dl dd ul.btn-list form { display: inline; padding: 0; margin: 0 }
dl dd:after { content: "\00a0"; }
dl dd ul { margin: 0pt; padding: 0pt; }
dl dd ul li { list-style: none outside none; margin: 0pt;
    padding: 0.25em 0pt; }

/* NOTIFICATION */

ul.notices { list-style: none; margin: 0; padding: 0 }
ul.notices li { }
.notice { margin: 0; padding: 5px; border-bottom: 1px solid #eee; }
.unseen_notice { margin: 0; padding: 5px; background: #DFC;
    border-bottom: 1px solid #CCC; }
h2.notice_date { font-size: 12pt; color: #666;
    border-bottom: 1px solid #999; }
span.notice_type { width: 12em; text-align: center; float: left;
    padding-right: 0.75em; margin-left: 1em; margin-right: 1em; }
span.notice_message { }
span.notice_time, a.notice_time { float: left; color: #999;
    font-size: 0.85em; margin-right: 0.25em; }

div.notice_settings { background: #DEF; padding: 8px; margin: 20px 0; }
div.notice_settings h2 { margin: 0 0 5px 0; padding: 0; }
table.notice_settings td { line-height: 90%; padding: 5px 10px; }
span.notice_type_description { color: #666; font-size: 80%;
    font-style: italic; }

ul.tags { padding: 0; margin: 0; list-style: none }
ul.tags li { padding: 0; display: inline }
a.tag { 
  padding: 1px 4px 2px;
  font-size: 10.998px;
  font-weight: bold;
  line-height: 13px;
  color: #ffffff;
  vertical-align: middle;
  white-space: nowrap;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #468847;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  font-size: 1.25em; line-height: 2em; padding: 0.25em 0.5em; 
}
a.tag:hover { background-color: #356635; text-decoration: none; }
a.tag .count:before { content: "("; }
a.tag .count { font-size: 0.75em; }
a.tag .count:after { content: ")"; }

.claim_groups form { display: inline }

#claims_list .deferred_awards { list-style: none; }
#claims_list .deferred_awards li { width: 200px; float: left; position: relative;
    border: 1px solid #ccc; border-radius: 8px; padding: 1em; margin: 1em; }
#claims_list .deferred_awards li h3 { text-align: center; }
#claims_list .deferred_awards li a.code { display: block; text-align: center;
    padding: 0.125em; }
#claims_list .deferred_awards li a.code code {font-size: 2.25em; display: block; }
#claims_list .deferred_awards li img.qrcode { display: block; margin: 0 0 0 0; }
#claims_list .deferred_awards li code.url { display: block; font-size: 0.9em;
    text-align: center; margin: 0.5em 0 0 0 }

#badge_detail textarea { height: 5.5em; }

table.keys tr.disabled td.description span { text-decoration: line-through; }

footer { padding-top: 15px; padding-bottom: 15px; border-top: 1px solid #ccc; }