h1 {text-align: center;}
    h2,h3,h4,h5 {text-align: left;}

    html,body,h1,h2,h3,h4,h5,h6 {font-family: "Roboto", sans-serif;}

    img {
        border-radius: 5%;
    }
   /* 
    a:link {
        color: blue;
        background-color: transparent;
        text-decoration: none;
    }

    a:visited {
        color: blue;
        background-color: transparent;
        text-decoration: none;
    }

    a:hover {
        color: blue;
        background-color: transparent;
        text-decoration: underline;
    }

    a:active {
        color: yellow;
        background-color: transparent;
        text-decoration: underline;
    }*/

    .w3-sidebar {
        z-index: 3;
        width: 250px;
        top: 43px;
        bottom: 0;
        height: inherit;
    }

    :root, [data-theme="light"] {
        --page-bg-color: #ffffff;
        --page-fg-color: #333333;
        --h1-fg-color: #44446a;
        --h2-fg-color: #64648a;
        --code-fg-color: #a83030;
        --code-bg-color: #d8d8d8;
    }
    [data-theme="dark"] {
        --page-bg-color: #18181a;
        --page-fg-color: #cccccc;
        --h1-fg-color: #ffffff;
        --h2-fg-color: #ffffff;
        --code-fg-color: #f86060;
        --code-bg-color: #444444;
    }
    body {
        font-family:"SF Pro Text", "SF Pro Icons", "Helvetica Neue", Helvetica, Arial, sans-serif;
        background-color: var(--page-bg-color);
        color: var(--page-fg-color);
    }
    h1 {
        color: var(--h1-fg-color);
    }
    h2 {
        color: var(--h2-fg-color);
    }
    code {
        font-size: 130%;
        color: var(--code-fg-color);
        background-color: var(--code-bg-color);
        padding: 2px;
    }