body {
    font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
    line-height: 1.7;
    color: #3b3735;
}
div::-webkit-scrollbar { display: none; }
div { -ms-overflow-style: none; scrollbar-width: none; }
h1 {
    margin-top: 0px;
    padding-top: 70px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
#body-container {
    position:absolute;
    top:0px;
    bottom:0px;
    right:0px;
    width: calc(100% - min(300px, 30%));
    overflow: auto;
}
#nav-container {
    z-index: 1;
    position:absolute;
    top:0px;
    bottom:0px;
    left:0px;
    width: min(300px, 30%);
    overflow: scroll;
    line-height: min(40px, 7vh);
    background: #f4f4f4;
    text-align: center;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: space-between;
}
#nav-top-content {
    text-align: left;
}
#navigation {
    list-style-type: none;
    padding-left: 0;
    margin-block-start: min(16px, 3vh);
    margin-block-end: min(16px, 3vh);
    margin-left: auto;
    margin-right: auto;
    width: 70%;
    text-align: left;
}
#burger-container {
    width: 100%;
}
#burger {
    display: none;
    transition: transform .3s ease-in-out;
}
#logo > img {
    width: 70%;
    vertical-align: text-top;
}
@media screen and (max-width: 800px) {
    #burger-container {
        cursor: pointer;
        height: 60px;
    }
    #burger {
        display: block;
        position: absolute;
        font-size: 25px;
        padding: 13px 20px;
    }
    #logo {
        height: 100%;
    }
    #logo > img {
        height: 75%;
        width: auto;
    }
    #body-container {
        top: 60px;
        width: 100%;
    }
    #nav-container {
        height: fit-content;
        right: 0px;
        width: 100%;
    }
    #nav-top {
        display: none;
    }
    #nav-bot {
        display: none;
    }
    #nav-container.maximized {
        height: 100%;
    }
    .maximized #burger {
        transform: rotate(0.25turn);
        transform-origin: 50% 50%;
    }
    .maximized #nav-top {
        display: block;
    }
    .maximized #nav-bot {
        display: block;
    }
}
#nav-top-content > div:hover {
    text-decoration: underline;
}
.block {
    padding: 0% 7% 5% 7%;
    text-align: justify;
}
#social > a {
    padding: 0px 10px;
    font-size: 20px;
    color: inherit;
}
#social > a:hover {
    color: black;
}
.button {
    font-size: 10pt;
    color: #535353;
    background: #f9f9f9;
    padding: 4px;
    border: #535353 1px solid;
    border-radius: 2px;
}
.guide-item {
    padding:10px;
    border: 1px solid #dedede;
    margin-top: -1px;
}
.guide-title {
    font-size: 13pt;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.guide-content:not([hidden="until-found"]) {
    padding: 10px 20px 0px 20px;
}
.my-anchor {
    color: inherit;
    text-decoration: inherit;
}
a:active, a:focus {
    outline: 0;
    border: none;
    -moz-outline-style: none;
}
