/*
** General
*/
body,h1,h2,h3,h4,h5,h6,p,form,fieldset,img,div,span {
    margin: 0px;
    padding: 0px;
}

html {
    overflow-y: scroll;
    text-size-adjust: 100%;
}

body {
    font-family: Verdana, Geneva, Arial, sans-serif;
    font-size: 8pt;
    background-color: black;
    color: #00cc00;
}

table {
    border-collapse: collapse;
    text-align: center;
    margin: 10px auto;
    font-size: 8pt;
}

th {
    background: #202020 url(/images/th-background.png) top left repeat-x;
    border: 1px solid #808080;
    padding: 5px 10px;
    color: #dddddd;
    font-weight: normal;
    width: auto;
}

td {
    padding: 5px;
    border: 1px solid #808080;
}

.tight td {
    padding: 1px 3px;
}

img {
    border: 0px;
}

a:link,a:visited,.bots4-link {
    color: #ccffcc;
}

.bots4-link {
    cursor: pointer;
    text-decoration: underline;
}

th a:link,th a:visited {
    color: #dddddd;
}

a:hover,a:focus,.bots4-link:hover {
    text-decoration: none;
}

h1 {
    font-size: 3.5em;
    color: #ccff66;
    font-weight: normal;
}

h2 {
    font-size: 2em;
    padding-bottom: 3px;
    margin: 20px 0px 5px 0px;
    color: #88ff66;
    font-weight: normal;
}

h3 {
    font-size: 1.5em;
    color: #44ff66;
    font-weight: normal;
    margin: 10px 0px 5px 0px;
}

p {
    margin: 10px 0px;
}

/*
** Forms
*/
input.text {
    background-color: #99ff99;
    border: 1px solid #808080;
    padding: 4px 2px;
    font-family: Verdana, Geneva, Arial, sans-serif;
}

input[type="file"] {
    background-color: inherit;
}

textarea,
input,
input::file-selector-button,
select,
option {
    background-color: #ccffcc;
    font-family: Verdana, Geneva, Arial, sans-serif;
}

/*
** Some general-use classes
*/
.align-center {
    margin-left: auto;
    margin-right: auto;
}

.align-left {
    float: left;
}

.align-right {
    float: right;
}

.text-align-center {
    text-align: center;
}

.stand-out {
    background-color: #181818;
    border: 1px solid #808080;
}

/*
** Block-list and associated components
*/
table.block-list {
    margin: 0px 20px 0px 20px;
    font-size: 8pt;
}

.block-list td {
    padding-left: 15px;
    border: 0px;
    text-align: left;
}

.block-list th {
    width: 120px;
    background: none;
    background-color: transparent;
    border: 0px;
    padding: 0px;
    vertical-align: top;
}

.block-list th div {
    background: #202020 url(/images/th-background.png) top left repeat-x;
    border: 1px solid #808080;
    text-align: right;
    font-weight: bold;
    font-weight: normal;
    padding: 2px 5px;
    margin: 5px 0px;
    white-space: nowrap;
}

.hidden-table {
    width: 100%;
    margin: 0px;
    padding: 0px;
}

.hidden-table td {
    vertical-align: top;
    margin: 0px;
    padding: 0px;
    border: 0px;
}

.hidden-table .block-list td {
    vertical-align: middle;
    padding-left: 15px;
}

.block-list-simple td {
    border: 0px;
    padding: 2px;
    text-align: left;
}

.block-list-simple th {
    background-color: transparent;
    border: 0px;
    padding: 2px;
    text-align: right;
}

/*
** Miscellaneous
*/
#container {
    margin: 0px auto;
    width: 1000px;
}

#content {
    float: right;
    width: 849px;
    padding: 0px 10px 50px 0px;
    font-size: 9pt;
}

#content p, #content ul, #content ol, #content pre {
    margin-left: 20px;
}

#content ul.sub-list {
    list-style-type: square;
    padding-left: 0px;
}

#left-nav {
    border-right: 1px solid #808080;
    overflow: hidden;
    float: left;
    width: 130px;
    padding: 10px 0px 0px 0px;
}

#left-nav ul {
    list-style: none;
    margin: 5px 10px 20px 5px;
    padding: 0px;
}

#left-nav li {
    line-height: 20px;
    text-align: right;
    margin-bottom: 5px;
    border: 1px solid black;
}

#left-nav a {
    display: block;
    font-weight: normal;
    color: #dddddd;
    text-decoration: none;
    padding: 2px 3px;
    border: 1px solid #808080;
    background: black url(/images/sidebar-background.png) top left no-repeat;
}

#left-nav a:hover,#left-nav a:active,#left-nav a:focus {
    background-color: #303030;
    color: #00cc00;
    border-color: #00cc00;
}

#left-nav .fade {
    margin: 21px 10px 20px 5px;
}

#left-nav .fade li {
    border: 1px solid #1a1a1a;
    background-color: #060606;
    color: #1a1a1a;
    padding: 2px 3px;
    width: 105px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 7px;
    cursor: default;
}

#header {
    text-align: center;
}

#logo {
    margin-top: 40px;
    margin-bottom: 27px;
}

#top-bar {
    border-top: 0px;
    width: 988px;
    height: 25px;
    padding: 0px 5px;
    line-height: 25px;
    background: #202020 url(/images/th-background.png) top left repeat-x;
}

#footer {
    clear: both;
    height: 100px;
    text-align: center;
    margin: 20px 0px 50px 0px;
}

.subtext {
    color: #6e636d;
}

.subsubtext {
    color: #a8b6a7;
}

.noborder,.noborder th,.noborder td {
    border: 0px;
    padding: 0px 3px;
}

.nopadding,.nopadding th,.nopadding td {
    padding: 0px;
}

.tarnished {
    background-color: #300;
    color: red;
    outline: thin solid;
}

.tarnished-text {
    color: red;
    font-weight: bold;
}

/*
** Ratios
*/
.ratio_1 {
    color: #f01f00;
}

.ratio_2 {
    color: #e02f00;
}

.ratio_3 {
    color: #d03f00;
}

.ratio_4 {
    color: #c04f00;
}

.ratio_5 {
    color: #b05f00;
}

.ratio_6 {
    color: #a06f00;
}

.ratio_7 {
    color: #907f00;
}

.ratio_8 {
    color: #808f00;
}

.ratio_9 {
    color: #709f00;
}

.ratio_10 {
    color: #60af00;
}

.ratio_11 {
    color: #50bf00;
}

.ratio_12 {
    color: #40cf00;
}

.ratio_13 {
    color: #30df00;
}

.ratio_14 {
    color: #20ef00;
}

.ratio_15 {
    color: #10ff00;
}

/*
** Dialog boxes
*/
.box {
    color: #dddddd;
    background-color: #202020;
    border: 1px solid #808080;
}

.error,.warning,.info {
    color: #dddddd;
    background-color: #202020;
    padding: 20px;
    width: 500px;
    margin: 20px auto;
    text-align: center;
}

.error {
    border: 1px solid red;
}

.warning {
    border: 1px solid yellow;
}

.info {
    border: 1px solid #00cc00;
}

/*
** exp bar in header
*/
#experience-bar-wrap-header {
    position: relative;
    clear: both;
    margin: 0 auto;
}

#experience-bar-wrap-header, #experience-bar-value-header, #experience-bar-text-header {
    width: 300px;
    height: 16px;
}

#experience-bar-wrap-header, #experience-bar-value-header {
    background: black url(/images/experience-bar-header.png) top left no-repeat;
}

#experience-bar-text-header {
    position: absolute;
    top: 0px;
    left: 0px;
    padding-top: 1px;
    color: #ffffff;
    text-align: center;
    width: 100%;
}

#experience-bar-value-header {
    background-color: #006600;
}

/*
** kudos bar in header
*/
#kudos-bar-wrap-header {
    background-color: #222;
    border: 1px solid #808080;
    border-top: 0;
    clear: both;
    margin: 0 auto;
}

#kudos-bar-wrap-header, #kudos-bar-value-header, #kudos-bar-text-header {
    width: 300px;
    height: 5px;
}

#kudos-bar-value-header {
    background-color: #990;
}

#experience-bar-value-header {
    background-color: #006600;
}

.trophy {
    position: relative;
    display: block;
    text-decoration: none;
    color: #dddddd;
    border: 1px solid #808080;
    width: 250px;
    margin: 5px;
    padding: 5px;
    text-align: left;
    font-size: 8pt;
    height: 55px;
}

.trophy-details {
    position: absolute;
    width: 250px;
    left: -1px;
    top: 66px;
    border: 1px solid #a0a0a0;
    border-top: none;
    background-color: #202020;
    padding: 5px;
    text-align: right;
    font-size: 0.9em;
    color: #999;
    z-index: 100;
}

.trophy-has {
    background: black url(/images/trophies/has.png) top left repeat-x;
}

.trophy-hasnot {
    background: black url(/images/trophies/hasnot.png) top left repeat-x;
}

.trophy-has:hover,.trophy-has:focus {
    background-image: url(/images/trophies/has-hover.png);
    border-color: #a0a0a0;
}

.trophy-hasnot:hover,.trophy-hasnot:focus {
    background-image: url(/images/trophies/hasnot-hover.png);
    border-color: #a0a0a0;
}

#notifications {
    position: fixed;
    width: 100%;
    z-index: 100;
}

#notifications a {
    color: black;
}

.notification {
    text-align: center;
    padding: 3px;
    font-size: 1.2em;
    border-bottom: 1px solid #808080;
    cursor: pointer;
}

.notification-bronze {
    background-color: #cd7f32;
    color: black;
}

.notification-silver {
    background-color: #c0c0c0;
    color: black;
}

.notification-gold {
    background-color: #ffd700;
    color: black;
}

.notification-platinum {
    background-color: #e5e4e2;
    color: black;
}

.trophies-card {
    display: inline-block;
    padding: 1px 2px;
    text-decoration: none;
    border: 1px solid #808080;
    background-color: #222;
    white-space: nowrap;
}

.trophies-card,.trophies-card:link,.trophies-card:visited {
    color: #aaa;
}

#buffs {
    margin: 10px -10px -10px -10px;
    height: 20px;
    border-top: 1px solid #808080;
    background-color: black;
    text-align: left;
}

.buff {
    cursor: pointer;
    position: relative;
    height: 20px;
    text-align: left;
}

#buffs table {
    position: relative;
    left: -1px;
    top: -1px;
    border: 1px solid #808080;
    z-index: 90;
}

#buffs td {
    border-top: 1px solid #808080;
    border-left: 1px solid #808080;
}

.buff-details {
    cursor: auto;
    position: absolute;
    width: 300px;
    top: 20px;
    left: -1px;
    border: 1px solid #808080;
    background-color: #202020;
    padding: 5px;
    color: #ddd;
    z-index: 80;
}

.buff-details img {
    border: 1px solid #808080;
}

.buff-details ul {
    padding-left: 20px;
    color: #999;
}

.buff-details input {
    font-size: 1.0em;
    background-color: #404040;
    color: white;
}

.buff-inactive img {
    opacity: 0.2;
}

.role {
    color: white;
    font-size: 0.8em;
}

#page-title {
    visibility: hidden;
    position: relative;
    display: inline;
}

/*
** Bot rows in tables.
*/

.botrow {
    height: 29px;
}

.botrow-me,
.clanrow-attacker .heist-attacker,
.clanrow-defender .heist-defender {
    background-color: #060;
}

.botrow-clanmate {
    background-color: #002800;
}

.botrow-attacklimit {
    background-color: #500000;
}

.botrow .botrow-logo {
    background-color: black;
    padding: 1px 0 0 0;
}

.botrow .botrow-rank-left {
    border-right: 0;
    color: #a8b6a7;
    text-align: right;
}

.botrow .botrow-rank-right {
    border-left: 0;
    text-align: left;
}

.botrow .botrow-username-left {
    border-right: 0px;
}

.botrow .botrow-username-right {
    border-left: 0px;
}

.botrow .botrow-wins,
.botrow .botrow-losses,
.botrow .botrow-ratio,
.botrow .botrow-eph,
.botrow .botrow-energy {
    text-align: right;
}

.botrow .botrow-energymonth-left {
    border-right: 0;
    padding-right: 0;
    text-align: right;
}

.botrow .botrow-energymonth-right {
    border-left: 0;
    text-align: left;
}

.spacer-column {
    background: none;
    border-bottom: none;
    border-top: none;
    width: 10px;
}

a.clan {
  color: #9e0;
}

/**
 * Table sorting
 */

.TABLESORTER_SORTABLE {
  cursor: pointer;
}

.TABLESORTER_SORTABLE > .TABLESORTER_LABEL {
  text-decoration: underline;
}

.TABLESORTER_SORTABLE_HOVER > .TABLESORTER_LABEL {
  text-decoration: none;
}

.TABLESORTER_ARROW {
  bottom: 1px;
  margin-left: 5px;
  position: relative;
}

/**
 * Ajax
 */

.bots4-ajaxLoading {
  background-color: yellow;
  border-radius: 3px;
  border: 1px solid #808080;
  color: black;
  left: 50%;
  padding: 5px 10px;
  position: fixed;
  top: 10px;
}

/**
 * Clans
 */

.bots4-clan:link,
.bots4-clan:visited {
  color: #9e0;
}

.bots4-clan-deleted:link,
.bots4-clan-deleted:visited {
  background-color: #444;
  color: #888;
  text-decoration: line-through;
}

.bots4-clan-deleted:hover {
  background-color: #333;
}

/**
 * Random crap.
 */

.gray {
  color: gray;
}

.gender-male {
  color: #09a;
}

.gender-female {
  color: #e27;
}

.gender-nonbinary {
  color: #888;
}

/**
 * Stars
 */

.star-risk-high {
  color: red;
}

.star-risk-medium {
  color: yellow;
}

.star-risk-low {
  color: green;
}

/**
 * Quality
 */

.quality-uncommon {
  color: #1eff00;
}

.quality-rare {
  color: #0070dd;
}

.quality-epic {
  color: #a335ee;
}

.quality-legendary {
  color: #ff8000;
}
