:root {
    --bg: #111122;
    --accent: #d0c010;
    --accent-2: #667d00;
    --accent-2-dark: #485900;
    --accent-3: #5856b3;
}
header {
    margin-top: 3em;
}
main {
    margin-bottom: 3em;
}
footer ul
{
    margin-top: 0;
    padding-left:0;
}
footer ul li
{
    padding-bottom:1em;
    list-style-type: none;
}
footer ul li a {
    color:var(--text);
    text-decoration: none;
}
footer  ul li a:hover {
    color:var(--accent);
}
footer ul li a::after
{
    content:"";
    position:relative;
    width:5%;
    display:block;
    transition: width 0.5s, border-color 0.5s, transform 0.5s;
    border-bottom:2px solid var(--text);
}
footer ul li a:hover::after
{
    width:10%;
    border-bottom:2px solid var(--accent);
    transform: rotate(-5deg) scale(120%);
}
footer ul li:nth-child(odd) a:hover::after {
    transform: rotate(5deg) scale(120%);

}
hr {
    border: 0;
    border-radius:15%;
    border: 1px dotted var(--text);
}

blockquote pre {
    padding: 1em;
}
.website-img {
    max-width:200px;
}