beginworld-css

:root {
    --main-bg-color: #2e3440;
    --main-fg-color: #d8dee9;

    --color-black: #3b4252;
    --color-red: #bf616a;
    --color-green: #a3be8c;
    --color-yellow: #ebcb8b;
    --color-blue: #81a1c1;
    --color-purple: #b48ead;
    --color-cyan: #88c0d0;
    --color-gray: #e5e9f0;
    --color-black-light: #4c566a;
}

body {
    color: var(--main-fg-color);
    background-color: var(--main-bg-color);

}

a {
    color: inherit;
    text-decoration: none;
}

h1 {
    text-align: center;
    color: var(--color-red);

}


.flex-right {
    padding: 10pt;
    padding-bottom: 0pt;
    background-color: var(--color-blue);
    border-style: dashed;
    border-width: 2pt;
    border-radius: 10pt;
    border-color: var(--main-fg-color);
    color: var(--color-black-light);
    font-weight: bold;
}

.flex-right code{
    background-color: var(--color-black-light);
    color: var(--main-fg-color);
    padding: 4pt;
    border-radius: 5pt;

}

.flex-container {
    align-items: flex-start;
    justify-content: space-between;
}

.flex-left nav {
    line-height: 25pt;
}

.flex-left nav a{
    padding-top: 6pt;
    padding-bottom: 5pt;
    padding-left: 5pt;
    padding-right: 5pt;
}
.flex-left nav a:hover {
    background-color: var(--color-green);
    color: var(--color-black);

}