html {
    scroll-behavior: smooth;
}

:target:before {
    content: "";
    display: block;
    height: 100px;
    margin: -100px 0 0;
}

#hideable-container {
    /* Prevent the elements from being selectable/highlightable */
    user-select: none;
}

#hideable-container a:not(:hover) {
    /* Mute the colors a bit */
    opacity: 0.25;
}

div.shortcut {
    width: 150px;
}

div.shortcut>img {
    width: 120px;
}

/* Make the top menu scrollable, if it overflows
 * The 150px accounts for the height of the menu and add some gap to the bottom. */
.dropdown-menu {
    overflow: hidden;
    overflow-y: auto;
    max-height: calc(100vh - 50px);
}

/* Make the sidebar Content on the topics page fit underneath the sticky navbar */
#topic-toc {
    top: 60px;
    max-height: calc(100svh - 60px);
    overflow: hidden;
    overflow-y: scroll;
    z-index: 0;
}