@charset "UTF-8";

* {
    text-decoration: none;
}

html {
    background-color: rgb(147, 167, 189);
    background-image: url(assets/background.gif);
    background-position: center;
    width: 100%;
    height: 100%;
    /* display: flex;
    align-items: center;
    align-content: center; */
}

.workinprogress::after{
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    border-bottom: 75px solid transparent;
    border-right: 75px solid transparent;
    border-left: 75px solid transparent;
    border-image: url(assets/wipBorder.png) 75 round;
    box-sizing: border-box;
}

nav{
    background-color: rgb(172, 172, 172);
    display: grid;
    grid-template-columns: repeat(3,1fr);
    grid-template-rows: auto;
    place-items: center;
    border-bottom: 2px solid black;
}

body {
    margin-left: auto;
    margin-right: auto;
    padding: 4px;
    width: 80%;
    height: 98%;
    box-sizing: border-box;
    z-index: 0;
    background-image: linear-gradient(blanchedalmond,black);
    border-radius: 12px;
}

main {
    display: grid;
    grid-template-columns: 1fr 4fr;
    grid-template-rows: auto;
}

ol, ul {
    padding-left: 20px;
    margin-top: 8px;
}

h1,h2,h3,h4,h5,h6 {
    margin-top: 5px;
    margin-bottom: 8px;
}

.todolist {
    background-image: url(/assets/paper.png);
    background-size: 50%;
    image-rendering: pixelated;
    /* border-radius: 8px; */
    margin: 4px;
    padding: 3px;
    box-shadow: 0 0 5px rgb(0, 0, 0);
}

.sunken {
    padding: 4px;
    box-shadow: 0 0 5px black inset;
    background-color: rgba(27, 0, 102, 0.12);
    border-radius: 8px;
}

footer {
    background-color: rgb(207, 235, 235);
    color: rgb(31, 42, 70);
    margin: 2px;
    padding: 2px;
    border-radius: 6px;
}
footer ul {

}
footer ul li {
    list-style: none;
}