ol, ul {
    margin: 0;
    padding: 0;
}

body.gallery{
    background-color: #303030;
}

.table-striped-dark tbody>tr:nth-child(odd)>td,.table-striped-dark tbody>tr:nth-child(odd)>th{background-color:#696969;}
.table-striped-dark {color:#CCCCCC;}

.navbar-inverse .nav .active .active-selected> a {
    color : #5bf75b;
}
.navbar-inverse .nav .selected> a {
    color : #5bc75b;
}
.navbar-inverse .nav .active .active-rejected> a {
    color : #f75b5b;
}
.navbar-inverse .nav .rejected> a {
    color : #c75b5b;
}

#regionnav>li.region-nomination>a {
    font-style: italic;
}

#regionnav>li.region-separator>span {
    border: none;
    background: none;
}

#regionnav>li>a {
    padding-top: 4px;
    padding-right: 8px;
    padding-bottom: 4px;
    padding-left: 8px;
}

#pagenav>li>a, #pagenav>li>span {
    padding-top: 4px;
    padding-right: 8px;
    padding-bottom: 4px;
    padding-left: 8px;
}


ul.gallery {
    margin: 2px;
    padding: 2px;
    display: block;
}

ul.gallery, li.gallerybox {
    zoom: 1;
}

li.gallerybox {
    vertical-align: top;
    display: -moz-inline-box;
    display: inline-block;
}

li.gallerybox div.thumb {
    text-align: center;
    margin: 5px;
    width: 305px;
    height: 205px;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
}

li.gallerybox div.thumb_small {
      text-align: center;
      margin: 5px;
      width: 160px;
      height: 120px;
      position: relative;
      margin-left: auto;
      margin-right: auto;
      overflow: hidden;
  }

.current {
     background-color: #111
 }

/*.selected {*/
    /*border-style:solid;*/
    /*border-color:#5bc75b;*/
    /*border-width:5px;*/
/*}*/

div.img-container {
    width: 390px;
    height: 211px;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
}
img.cropped {
    position: absolute;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}


body {
    font-family: helvetica;
    color: #333;
    background: #CCC;
}

.msg {
    padding: 10px;
    width: 100%;
    background: #AAA;
}

.others {
    background: #EEE;
}

.juliet {
    background: #FF69B4;
}

#textField {
    width: 800px;
    position: relative;
    top: 4px;
}

.imageComment {
    width: 800px;
    position: relative;
    background-color: #DDD;
    top: 4px;
}

.imageComment:focus{
    border-color: rgba(239, 239, 239, 0.8);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 6px rgba(239, 239, 239, 0.6);
    outline: 0 none;
}

#userField {
    width: 210px;
    position: relative;
    top: 1px;
}

#header {
    color: #EEE;
    width: 500px;
    height: 40px;
    font-weight: bold;
    padding: 10px;
    background: #303030;
}

.comment-header {
    width: 80px;
    padding: 3px 7px;
    font-size: 12px;
    font-weight: bold;
    background-color: #AAA;
    border: 1px solid #AAA;
    -webkit-border-radius: 4px 0 4px 0;
    -moz-border-radius: 4px 0 4px 0;
    border-radius: 4px 4px 0 0;}

#footer {
    color: #EEE;
    width: 500px;
    height: 60px;
    font-weight: bold;
    padding: 10px;
    background: #303030;
}

#roomSelect {

}

.undo {
    padding: 20px 0;
}

.bs-callout {
    padding: 20px;
    margin: 20px 0;
    border: 1px solid #eee;
    border-left-width: 5px;
    border-radius: 3px;
}
.bs-callout h4 {
    margin-top: 0;
    margin-bottom: 5px;
}
.bs-callout p:last-child {
    margin-bottom: 0;
}
.bs-callout code {
    border-radius: 3px;
}
.bs-callout+.bs-callout {
    margin-top: -5px;
}
.bs-callout-default {
    border-left-color: #777;
}
.bs-callout-default h4 {
    color: #777;
}
.bs-callout-primary {
    border-left-color: #428bca;
}
.bs-callout-primary h4 {
    color: #428bca;
}
.bs-callout-success {
    border-left-color: #5cb85c;
}
.bs-callout-success h4 {
    color: #5cb85c;
}
.bs-callout-danger {
    border-left-color: #d9534f;
}
.bs-callout-danger h4 {
    color: #d9534f;
}
.bs-callout-warning {
    border-left-color: #f0ad4e;
}
.bs-callout-warning h4 {
    color: #f0ad4e;
}
.bs-callout-info {
    border-left-color: #5bc0de;
}
.bs-callout-info h4 {
    color: #5bc0de;
}

/* A gallery tile whose thumbnail failed to load (a file deleted or renamed on Commons):
   unitegallery.js marks it, sized from the image's data-width/height. A plain grey tile
   instead of the browser's broken-image icon; hovering still shows the file's title. */
.ug-thumb-wrapper.wlx-thumb-failed {
    background-color: #e0e0e0;
}
.ug-thumb-wrapper.wlx-thumb-failed img.ug-thumb-image {
    visibility: hidden;
}
/* The large view's image that failed to load from Wikimedia and from this server (a file
   deleted on Commons): large.scala.html marks its link. The same grey box. */
a.wlx-large-failed {
    display: inline-block;
    position: relative;
    width: 640px;
    max-width: 100%;
    height: 480px;
    background-color: #e0e0e0;
}
a.wlx-large-failed img {
    display: none;
}
/* The contest files page (contestFiles.scala.html), on the galleries' dark background: its
   heading, tabs and notes. */
.contest-files-head {
    color: #ddd;
}
.contest-files-head h4 {
    color: #eee;
}
.contest-files-head a {
    color: #9cc9ff;
}
.contest-files-head a.btn-default {
    color: #333;
}
.contest-files-head .text-muted {
    color: #aaa;
}
.contest-files-head .nav-tabs {
    border-bottom-color: #555;
    margin-bottom: 10px;
}
.contest-files-head .nav-tabs > li > a {
    color: #ccc;
}
.contest-files-head .nav-tabs > li > a:hover, .contest-files-head .nav-tabs > li > a:focus {
    color: #fff;
    background-color: #444;
    border-color: #555 #555 #555;
}
.contest-files-head .nav-tabs > li.active > a, .contest-files-head .nav-tabs > li.active > a:hover,
.contest-files-head .nav-tabs > li.active > a:focus {
    color: #fff;
    background-color: #303030;
    border-color: #555 #555 transparent;
}
/* A file deleted on Commons, in the contest files' gallery (unitegallery.js marks its tile,
   data-deleted) and in its large view's thumbnails: a red frame. The tile's mark links the
   file's page on Commons, above the tile, which opens the large view. */
.ug-thumb-wrapper.ug-tile.wlx-deleted::before, div.thumb_small.wlx-deleted::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border: 3px solid #d9534f;
    z-index: 4;
    pointer-events: none;
}
.ug-thumb-wrapper.ug-tile a.wlx-deleted-label {
    position: absolute;
    left: 6px;
    bottom: 6px;
    z-index: 7;
    max-width: calc(100% - 12px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
}
/* The read-only large view's thumbnails (large/contestFile.scala.html): the link fills the
   box, so a thumbnail that failed to load, hidden, still opens its file; that one is the
   same grey box. */
div.thumb_small a.wlx-box-link {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
div.thumb_small.wlx-thumb-failed {
    background-color: #e0e0e0;
}
div.thumb_small.wlx-thumb-failed img {
    visibility: hidden;
}
.ug-thumb-wrapper.wlx-thumb-failed::after, a.wlx-large-failed::after, div.thumb_small.wlx-thumb-failed::after {
    content: "\2298";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 48px;
    color: #9e9e9e;
    pointer-events: none;
}

/* A POST form in a dropdown menu (sign out, switch contest), its button looking like the
   menu's links (Bootstrap 3's .dropdown-menu > li > a). */
.dropdown-menu .navbar-menu-form {
    margin: 0;
}
.dropdown-menu .navbar-menu-form .btn-link {
    display: block;
    width: 100%;
    padding: 3px 20px;
    border: 0;
    border-radius: 0;
    clear: both;
    font-weight: normal;
    line-height: 1.42857143;
    color: #333;
    text-align: left;
    white-space: nowrap;
    text-decoration: none;
}
.dropdown-menu .navbar-menu-form .btn-link:hover,
.dropdown-menu .navbar-menu-form .btn-link:focus {
    color: #262626;
    background-color: #f5f5f5;
}
.dropdown-menu > .active .navbar-menu-form .btn-link {
    color: #fff;
    background-color: #337ab7;
}

/* A gallery's region or country menu in the navbar (regionMenu.scala.html): a long list scrolls */
.region-menu .region-menu-list { min-width: 240px; max-height: 70vh; overflow-y: auto; }
.region-menu-status { padding: 3px 20px; color: #777; white-space: normal; }
.region-menu-status:empty { display: none; }

/* The pager's page box (pageLinks.scala.html), in a dropdown of the items shown */
/* floated as Bootstrap floats the pager's links, so it stays between them; the box opens under
   it from its left edge, as wide as its contents (pager-jump.js opens it leftwards only if it
   would leave the window) */
.pagination > .pager-jump-menu { position: relative; float: left; }
.dropdown-menu.pager-jump-box { padding: 8px 12px; min-width: 0; }
.pager-jump { white-space: nowrap; }
.pager-jump label { font-weight: normal; margin: 0 6px 0 0; }
/* the number, as wide as its page's digits (pageLinks.scala.html), without the browser's up and
   down arrows: Bootstrap stretches them past the box, which cut off the up one at some zooms;
   the Up and Down keys still step it, and the pager's links step a page */
.pager-jump input[type=number] { display: inline-block; height: 30px; padding: 2px 6px; margin: 0 4px;
    -moz-appearance: textfield; appearance: textfield; }
.pager-jump input[type=number]::-webkit-inner-spin-button,
.pager-jump input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }

/* A pager link with no page to go to: greyed out, not a link that only forbids the cursor
   (li.disabled: above Bootstrap's .disabled, which loads after this file) */
.pagination > li.disabled > span,
.pagination > li.disabled > span:hover,
.pagination > li.disabled > span:focus { color: #c8c8c8; background-color: #f7f7f7; cursor: default; }