body {
    min-height: 100vh;
    position: absolute;
    width: 100%;
    max-width: 100vw;
    padding: 0;
    margin: 0;
}

#header {
    border-bottom: 1px solid black;
    position:absolute;
    top:0;
    left:0;
    width: 100%;
    padding: 10px 0;
    display:flex;
    flex-direction: row;
}

#logo {
    position:relative;
    left:25%;
    font-weight: bolder;
    font-size:24px;
}

#location  {
    position:relative;
    left:30%;
    font-weight: bolder;
    font-size:24px;
}

#profile{
    position:absolute;
    right:25%;
    display:flex;
    flex-direction: row;
    font-weight: bolder;
    font-size:24px;
}

#header a,
#header a:visited {
    text-decoration: none;
    color:black;
}

a#logout,
a#logout:visited {
    color:darkred;
    text-decoration:underline;
}

#profile a{
    margin-right:20px
}

#footer {
    position: absolute;
    bottom:0;
    left:0;
    width: 100%;
    border-top: 1px solid black;
    text-align: center;
    padding: 5px 0;
}

#content {
    position:relative;
    margin: 80px auto;
    width: 50%;
    text-align:center;
}

#content h1 {
    text-align: center;
}

.col {
    display:flex;
    flex-direction: column;
    align-items: center;
}

.row {
    display:flex;
    flex-direction: row;
    align-items: center;
}

label {
    margin-top:5px;
    font-size:large;
    margin-bottom:5px;
}

input {
    width:100%;
}

#title_edit {
    width:80%;
    font-size:24px;
}

input[type="submit"] {
    margin-top:30px;
    width:50%;
    font-size:large
}

.choice {
    width: 100%;
    text-align:left;

}

.choice input {
    margin-left:5px;
    width:40%;
}

.choice-grid {
    display:grid;
    row-gap: 10px;
    width:100%;
    grid-template-columns: 1fr 8fr;
    align-items: start;
}

.choice-grid input {
    margin-right:5px;
    height:30px;
}

.submission {
    display:flex;
    flex-direction: row;
    justify-content: space-around;
    width:100%;
}

.submission input {
    width:80%;
    padding: 5px;
    cursor:pointer;
}

.input-grid {
    display:grid;
    row-gap: 10px;
    grid-template-columns: 95fr 5fr;
    align-items: start;
    column-gap: 5px;
}

.hidden_preview {
    display:none;
    position:relative;
    left:0;
    width:100%;
    grid-row: 2;
}

.preview {
    height: 30px;
    width: 30px;
    cursor: pointer;
    opacity:0;
    z-index:1;
    width:100%;
    margin-left:10px;
}

.input-grid img {
    position:absolute;
    right:0;
}

.preview:checked ~ .hidden_preview {
    display:block;
}

.full-width {
    width:100%;
}

.vsep {
    width:50px;
}

.error {
    color:red;
}

.admin-banner {
    background-color: red;
    color:aliceblue;
    font-style: italic;
    padding:15px;
}

.choiceblock a,
.choiceblock a:visited,
.choiceblock a:active {
    text-decoration: none;
    color:black;
    background:lightgrey;
    padding: 15px;
    margin-bottom:25px;
    width:50%;
}

.choiceblock a:hover {
    box-shadow: inset 0px 0px 10px 0px rgba(0,0,0,0.5);
}

.choiceblock a:focus {
    box-shadow: inset 0px 0px 10px 0px rgba(0,0,0,0.5);
    outline: none;
    filter:brightness(80%);
}

.chapter-content {
    border:1px dotted black;
    padding:50px;
}

.goto {
    color:darkblue;
    text-decoration:underline;
    font-weight: bold;
}

.confirm {
    display:none;
}

.confirm input {
    width:50%;
}

.change_pass p{
    text-decoration: underline;
}

.delete p{
    color:darkred;
    text-decoration:none;
    font-weight: bold;
}

#confbox {
    opacity:0;
    position:absolute;
    left:0;
    width:100%;
    cursor: pointer;
    z-index:1;
}

#confbox:checked ~ .confirm{
    display:block;
}

.statblock {
    display:flex;
    flex-direction: row;
    justify-content: space-around;
}

.accept,
.accept:visited {
    background-color: lime;
    color:black;
    padding:5px;
    margin-right:15px;
    text-decoration: none;
}

.reject,
.reject:visited {
    background-color: red;
    color:white;
    padding:5px;
    text-decoration: none;
}

.pending_chap {
    border:1px solid black;
    padding:20px;
}

.pending_chap .desc{
    background-color:beige;
    padding:5px;
}

.banner {
    background-color: lightcoral;
    border: 1px dotted black;
    font-style: italic  ;
}

ul {
    display:flex;
    flex-direction: column;
    align-items: center;
}

ul li {
    text-align:left;
}