html, body {
    overscroll-behavior: none;
    overflow: hidden;
    height: 100dvh;
}

header {
    height: 4rem;
}

main {
    max-height: calc(100dvh - 4rem);
}

a {
    text-decoration: none !important;
    color: black;
}

    a:link {
        color: black;
    }

    a:visited {
        color: black;
    }


#menu {
    background: white;
    width: 100%;
    display: none;
    cursor: pointer;
    position: fixed;
    overflow: auto;
    z-index: 1000;
    top: 4rem;
    left: 0;
    max-height: calc(100dvh - 4rem);
}

#menu-label::before {
    content: "☰";
}

#menu-toggle {
    display: none;
}

#menu-toggle:checked ~ #menu {
    display: block;
}

#menu-toggle:checked ~ #menu-label::before {
    content: "✕";
}

.chart {
    width: 20rem;
    max-width: 100%;
}

.gauge {
    width: 20rem;
    max-width: 100%;
}

.fit-content {
    width: fit-content;
}

.h-stretch {
    height: stretch;
}

.pulse-animation{
    animation: pulse alternate infinite 0.5s ease-in-out;
}

@keyframes pulse{

    0% {
        opacity: 1;
    }

    100% {
        opacity: 0.5;
    }
}