
body {
    background-color: #ffffff; 
    color:#000000; 
    font-family: 'fonts/DMSans-Regular.ttf', sans-serif;
    }
    .sicon {
        height: 0.9em;
        width: 0.9em;
        margin: 0.1em;
        display: inline-block;
    }
    .logo {
    font-family: monospace;
    font-size: 2.4em;
    font-weight: bolder;
    text-shadow: none;
    background: rgb(255,255,255);
    background: linear-gradient(145deg, #5596ff, #136bf8, #0a3c8e);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; 
    position: absolute;
    left: 1em; right: 0;
    }
    .container {
    display: grid;
    }
    .blet, .menuitem {
    font-size: 0.9em;
    text-decoration: none;
    color:#000000;
    background-color: #ffffff60;
    border: 1px solid #e3f0f475;
    backdrop-filter: blur(5px);
    border-radius: 0.2em;
    padding: 0.8em;
    margin: 0.5em;
    display: inline-block;
    }
    .menuitem {
    width: 32ch;
    }
    .menuitem:hover {
    border: 1px solid #91def642;
    background-color: #f5fcff71;
    backdrop-filter: blur(3px);
    }
    
    .contentbg, .content {
    grid-area: 1 / 1;
    }
    .content {
    text-shadow: 0.1em 0.1em 0.2em #ffffff;
    position:relative;
    text-align: center;
    }
    .listing {
    text-align: center;
    vertical-align: text-top;
    max-width: 40ch;
    display:inline-block;
    padding: 2em;
    }
    .footer {
    font-size: 0.8em;
    color: #3e4446;
    padding: 1em;
    text-align: center;
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    }
    
    .tooltiptext {
    background-color: #fffffff0;
    color: #313637;
    padding: 0.5em;
    border-radius: 0.2em;
    visibility: hidden;
    width: 20ch;
    margin-left: 14ch;
    position:absolute;
    }
    .menuitem:hover .tooltiptext {
    visibility: visible;
    }
    .minim {
    font-size: 0.5em;
    }
    
    @media (prefers-color-scheme: dark) {
    body {
    background-color: #000000; 
    color:#ffffff; 
    }
    .blet, .menuitem {
    color:#ffffff;
    background-color: #00000049;
    border: 1px solid #0a3d8e50;
    }
    .menuitem:hover {
    border: 1px solid #0a3d8e97;
    background-color: #0000007d;
    }
    .content {
    text-shadow: 0.1em 0.1em 0.2em #000000;
    position:relative;
    }
    .footer {
    color: #3e4446;
    }
    .tooltiptext {
    background-color: #000000f0;
    color: #98a1a4;
    }
    }