@import url('https://fonts.googleapis.com/css?family=Ubuntu+Mono&display=swap');

h2 {
    font-size: 24px;
}

code, pre {
    color: #4B4E4D;
    font-family: 'Ubuntu Mono', monospace;
    padding-bottom: 2px;
    background-color: #F1F0EF;
    border-style: solid;
    border-color: #DCD9D5;
    border-radius: 5px;
}

pre {
    margin-left: 20px;
    margin-right: 20px;
    padding-left: 10px;
    padding-right: 10px;
    line-height: 1
}

hr {
    border: 2px solid #DCD9D5;
    border-radius: 5px;
}

blockquote {
    padding-left: 30px;
    font-style: italic;
}

blockquote p::before {
    content: "> ";
    font-style: normal;
}

a[name] {
    position: absolute;
    transform: translateY(-25vh);
}

:target {
    # border-style: solid;
    border-radius: 10px;
    padding: 10px;
    animation: hl 3s ease-in-out forwards;
}

ul:target {
    padding: 0px;
}
.topic-header{
    background-repeat: no-repeat;
    background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAANCAYAAACQN/8FAAAABGdBTUEAALGPC/xhBQAAAJpJREFUKBVjaGho0Jo5cyYrAwHA9OfPn7BHjx6dqq2t1cenlgkk+f//f4O/f/+erqqqqsdlOlgh1CSQ9Q24TEdWCFaPy3QMhbhMx6UQbvq/f/+OgUIGr0JGRsaLQKdYAxVeY4FahU79ZmJiapOVlW1NT0//DZLEUAg1JaGlpeUCsm5khRimYCjEZQqKQhYWllWSkpJwtyBLIrMBoGtVegcgpZwAAAAASUVORK5CYII=') ;
    background-position: left center;
    padding: .7em 35px;
}

.collapsible-open {
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAJCAYAAAAGuM1UAAAABGdBTUEAALGPC/xhBQAAAH5JREFUGBljrK6uXvX///9QBiIAIyPjaiZubu5soNrXRKh/DVLLVFVV9RqoE6QJLwCpAallBqk6fPjwNTs7O20gE4QxAMgpra2tjSAJJpgsHqeBnQJTB9eAy2kwp8A0gJ0E46A7DdkpMDVwG2ACSE5DcQpMHisNjJtQEMYmCQCVaCt5NnGYUgAAAABJRU5ErkJggg==');
}

input, button{
    padding: 10px;
    font-size: 16px;
}

.hidden{
    display: none;
}

@keyframes hl {
    from {
        background-color: #fff700;
    }
    50% {
        background-color: initial;
    }
    to {
        background-color: #fffca1;
    }
}

#attachments-input {
    resize: none;
    margin-bottom: 10px;
 }

 .wiki-input{
    margin-left: 5px;
    margin-right: 5px;
 }

 #content-title{
    float: left;
 }

 #limit-title{
    background-color: yellow;
    float: right;
 }

 pre code {
    background-color: #eee;
    border: 1px solid #999;
    display: block;
    padding: 20px;
  }

code {
    display: block;
    overflow-wrap: break-word;
  }

#discord-wrapper{
    margin-left: 5px;
    margin-right: 5px;
}
#title-input{
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
    width:100%;
}

.spoiler-hidden, .spoiler-revealed {
    border-radius: 5px;
    padding: 2.6px;
}

.spoiler-hidden {
    color: rgba(0, 0, 0, 0);
    background-color: rgba(161, 161, 161);
}

.spoiler-hidden::selection {
    color: none;
    background: none;
}
.spoiler-hidden::-moz-selection { /* For Mozilla Firefox */
    color: none;
    background: none;
}

.spoiler-revealed {
    background-color: rgba(161, 161, 161, 0.25);
    -webkit-transition: color 0.5s ease-out 0s, background-color 0.25s ease-out 0s;
    -moz-transition:    color 0.5s ease-out 0s, background-color 0.25s ease-out 0s;
    -o-transition:      color 0.5s ease-out 0s, background-color 0.25s ease-out 0s;
    transition:         color 0.5s ease-out 0s, background-color 0.25s ease-out 0s;
}

#edit-button{
    z-index: 100;
    position: relative;
    cursor: pointer; 
    color:#00B9FE;
    float: right;
  }

  ul li {
    color: #00B9FE; 
    /* set color of list item text */
    list-style: none; 
    margin: 0 0 16px 1.1225em;
    /* Give the bullet room on the left hand side */
    padding: 0;
    position: relative;
  }
  
   ul li::before {
    color: #00B9FE;  
    /* color of bullet or square */
    content: "\2022"; 
    /* Unicode of character to precede the list item */
    display: inline-block;
    font-size: 1em; 
    /* use em or % */ 
    left: -1.1225em; 
    /* use em, line up bullet flush with left hand side */
    position: absolute;
    /* Set the bullet positioned absolutely top left */
    top: 0em; 
    /* use em or % */
  } 

  .nav{
    list-style:none;
    margin:0;
    padding:0;
    text-align:center;
}
.nav-divider{
    color: #bbbbbb;  
}
.nav li{
    display:inline;
    margin:5px;
}
.nav li::before{
    content: none;
}
.nav a{
    display:inline-block;
    padding:0px;
}