:root {
    --a-dark-grey: #343a40;
    --a-light-grey: #cfcfcf;
}

#footer {
    font-size:.9em;
    text-transform:uppercase;
    color:#999;
    text-align:center;
    border-top:1px solid #ddd;
}

h2, h3 {
    margin-top:2rem;
}

#footer a {
    color:#999;
}

#logo {
    display:block;
    margin:20px auto;
}

.custom-markdown {
    border-left:7px #ccc solid;
    padding:1em;
}

.custom-markdown h1 {
    margin-top:14px;
    font-size:1.7em;
}

.custom-markdown h2 {
    font-size:1.5em;
}

.custom-markdown h3 {
    font-size:1.3em;
    padding-left:10px;
}

.custom-markdown h4 {
    font-size:1.15em;
    padding-left:10px;
}

.custom-markdown blockquote {
    padding:10px 20px;
    display:block;
    width:80%;
    margin:10px auto;
    border:none;
    border-bottom:2px solid #000000;
    border-top:2px solid #000000;
}

.custom-markdown pre {
    display:block;
    background-color:#f5f5f5;
    padding:10px;
    border:1px solid #ccc;
    border-radius:4px;
}

.custom-markdown pre code {
    white-space: pre-wrap;
}

.partymember-select {
    width:80% !important;
}

.phb-style h1,
.phb-style h2,
.phb-style h3,
.phb-style h4,
.phb-style h5,
.phb-style h6 {
    color: #58180d;
}

.phb-style h2,
.phb-style h3 {
    border-bottom:2px solid #c9ad6a;
}

.phb-style h5 {
    font-weight:bold;
}

.phb-style {
    border-left-color:#58180d;
    background:#eee9d3;
}

.phb-style a,
.phb-style a:focus,
.phb-style a:active {
    color:#58180d;
    text-decoration:underline;
}

.phb-style blockquote {
    background:#dfe5c1;
}

.custom-markdown table {
    width:100%;
}

.custom-markdown tbody td {
    padding:3px;
}

.custom-markdown thead th {
    padding:0px 3px;
}

.custom-markdown thead tr {
    background:#ffffff;
}

.custom-markdown tbody tr:nth-of-type(2n) {
    background:#ffffff;
}

.custom-markdown tbody tr:nth-of-type(2n+1) {
    background:#f9f9f9;
}

.custom-markdown.phb-style tbody tr:nth-of-type(2n+1) {
   background: #dfe5c1;
}

.custom-markdown hr {
    height:2px;
    border-top:2px solid #f9f9f9;
}

.custom-markdown img {
    display:block;
    max-width:85%;
    margin:10px auto;
}

.custom-markdown.phb-style hr {
    border-top:2px solid #c9ad6a;
}

.editor-toolbar i.fa-red {
    color:#ab0000 !important;
}

.sidebar {
    position:fixed;
    width:250px;
    max-width:250px;
    height:100%;
    padding:70px 0px 10px 10px;
    border-right:10px solid #ccc;
    background:#fff;
    overflow-y:auto;
    display:none;
    z-index:50;
    background:#eeeeee;
    left:0;
    top:0;
}

.sidebar .itemlist {
    list-style: none;
    margin:0;
    padding:0;
}

.sidebar input[type=text] {
    display:block;
    width:90%;
    font-size:.8em;
}

.sidebar .itemlist li.category {
    font-weight:bold;
    line-height:20px;
    margin-top:10px;
    border-bottom:1px solid #ccc;
}

.sidebar .itemlist li.category img {
    max-height:20px;
    max-width:20px;
}

.sidebar .itemlist li.thing {
    padding-left:10px;
}

.sidebar .itemlist li.thing.invis {
    color:#ab5555;
    font-style:italic;
}

.sidebar .itemlist li.thing:hover {
    cursor: pointer;
    background:#ccc;
}

.sidebar .close-link-sidebar {
    color:#000;
    position:absolute;
    top:75px;
    right:5px;
}

.sidebar .close-link-sidebar:hover,
.sidebar .close-link-sidebar:focus {
    color:#ab0000;
    cursor:pointer;
}

.sidebar .file-ext {
    font-size:0.8em;
}

li.delete-li a:hover {
    background-color:#c90000 !important;
}

.picker {
    width:90%;
    margin:0 auto;
    background:var(--a-light-grey);
}

.picker tr {

}

.picker td {
    text-align:center;
    padding: 0.75rem;
}

.picker td[data-val]:hover {
    cursor:pointer;
    background:#999;
}

.picker td.picker-selected {
    background:#777;
}

tr.invisible_item,
.invisible_item {
    color:#ab0000;
    font-style:italic;
}

#preview_image {
    max-width:100%;
    padding:20px;
    display:block;
    margin:10px auto;
}

.moon {
    border-radius:50%;
    display:inline-block;
    width:100%;
    height:100%;
}

.moon-wrap {
    display:inline-block;
    border-radius:3px;
    background:#444;
    padding:2px;
}

.moon-phases {
    display:none;
}

.moon-box {
    display:inline-block;
    text-align:center;
}

.half-moon {
    border-radius:0;
    display:inline-block;
    height:100%;
}

.moon-text {
    display:block;
    text-align:center;
}

.search-filter {
    display:block;
    width:30%;
    margin:10px;
}

.delete-li {
    float:right !important;
    margin-right:10px;
}

#add-session-form {
    display:none;
    padding:20px;
    background:#fafafa;
    margin:10px;
}

.own-char {
    font-weight:bold;
}

.nav-tabs .fas {
    color:var(--a-dark-grey);
}

.fa-big {
    font-size:48px;
}

.thumbnail {
    max-width:200px;
    max-height:200px;
}

.thumbnail-small {
    max-width:125px;
    max-height:125px;
}

.media-uploader .modal-body input[type=submit] {
    display:none;
}

.single-modal-element {
    border-radius:10px;
}

.single-modal-element[data-is-visible=false] {
    background:rgba(255, 150, 150, 0.5);
}

.single-modal-element > * {
    max-width:150px;
}

.single-modal-element:hover,
.single-modal-element.active {
    background:#cce5ff;
    font-weight:bold;
    cursor:pointer;
}

.single-modal-element[data-is-visible=false]:hover,
.single-modal-element[data-is-visible=false].active {
    background: rgb(204, 229, 255);
    background: linear-gradient(180deg, rgba(204, 229, 255,1) 0%, rgba(204, 229, 255,1) 35%, rgba(255,150,150,0.5) 100%);
}

.spinner-overlay {
    position:absolute;
    top:0;
    z-index:100;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.6);
}

.infobox div {
    background: #fafafa;
}

.infobox a,
td a,
#footer a {
    text-decoration: none;
}

.infobox-img-container {
    margin-right:10px;
    flex: 0 0 48px;
    display: flex;
    flex-flow: column nowrap;
    justify-content: center;
    align-items: center;
}

.infobox-img-container img {
    max-width:48px;
    max-height:48px;
}

.table-thumbnail {
     max-height:30px;
     max-width:30px;
}

.lightbox-img:hover {
    cursor: pointer;
}

#lightbox .modal-body {
    max-height:calc(100vh - 121px);
}

#lightbox .modal-body img {
  max-height:calc(100vh - 153px);
  margin:0 auto;
  display:block;
}

.anchor {
    margin-top: -60px;
    height:60px;
    display:block;
    visibility:hidden;
}

.vertical-divider {
    height:30px;
    border-left: 1px dashed #cccccc;
    border-right: 1px dashed #cccccc;
    width:1px;
    margin:0 auto;
}

#dev-logo {
    color: #ab0000;
}