html {
	scroll-behavior: smooth;
}

body {
    font-family: 'system-ui', sans-serif;
}

header {
    overflow: hidden;
}

p {
    font-size: 1.2em;
}

#top-but {
    width: fit-content;
    padding: 5px;
    text-decoration: none;
}

td > span {
    visibility: hidden;
    width: fit-content;
    max-width: 500px;
    background-color: black;
    color: #fff;
    border-radius: 6px;
    padding: 10px;

    /* Position the tooltip */
    position: absolute;
    z-index: 2;
}  

td:hover span {
    visibility: visible;
}

td {
    text-decoration: underline;
} 

@media(hover: none) {
    td {
        text-decoration: none;
    }

    td > span {
        position: relative;
        visibility: visible;
        background-color: initial;
    }
}

img {
    display: block;
    margin-left: auto;
    margin-right: auto;
}