body {
            font-family: Helvetica, Arial, sans-serif;
            margin: 0;
            padding: 0;
            background-color: black;
            overflow-x: hidden;
        }
        img {
            margin: 0;
            padding: 0;
        }
        .menu {
            width: 100%;
            display: flex;
            padding: 1% 0 0 0;
            margin: 0;
            justify-content: center;
            background-color: black;
            flex-wrap: wrap;
            z-index: 2;
        }
        .menu button {
            width: 10vw;
            height: 3vmin;
            background-color: #0a5380;
            color: white;
            border: none;
            padding: 0.77% 1vmin;
            margin: 0;
            cursor: pointer;
            font-size: 0.9vmin;
            text-align: center;
        }
        .menu button.active {
            background-color: #1084cb;
        }
        .menu button:hover {
            background-color: #2ec7ef;
        }
        .menu-image {
            height: 3vmin;
            width: 10vw;
            position: fixed;
            top: 0;
            left: 0;
            padding: 1% 0 0 1%;
            z-index: 1;
        }

        hr {
            border: none;
            border-top: 1px solid #aaa;
            margin-bottom: 5vmin;
            width: 100%; 
        }
        .logo {
            text-align: center;
            position: relative;
            display: inline-block;
        }
        .logo img {
            max-width: 100%;
            height: auto;
            display: block;
        }
        a { 
            color: white;
            text-decoration: none;
            font-size: 1.0vmin;
            margin: 0 0.05%;
        }
        .info {
            float: left;
            text-align: left;
            padding-right: 3%;
        }
        .screen {
            margin: 0 0 0 0.2vmin;
            height: 25vmin;
        }
        .footer {
            text-align: center;
            padding: 0.5vmin;
            color: #5593ba;
            font-size: 0.8vmin;
            width: 100%;
        }

        #linesCanvas {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            pointer-events: none;
        }


@media (max-width: 768px) {
    .menu {
        width: 100%;
        display: flex;
        padding: 2% 0 0 0;
        justify-content: center;
        background-color: black;
        flex-wrap: wrap;
        z-index: 2;
        }
        
    .menu button {
        width: 12vw;
        height: 4.5vmin;
        background-color: #0a5380;
        color: white;
        border: none;
        padding: 1.27% 0;
        margin: 0;
        cursor: pointer;
        font-size: 1.6vw;
        text-align: center;
    }
    .menu-image {
        position: fixed;
        top: 0;
        left: 0;
        height: 4.5vmin;
        width: auto;
        padding: 2% 0 0 0;
        z-index: 1;
    }
    .logo img {
        max-width: 250%;
        height: auto;
        display: block;
    }
    a { 
        color: white;
        text-decoration: none;
        font-size: 1.2vmin;
        margin: 0 0.05%;
    }
    .footer {
        text-align: center;
        padding: 1.5vmin 0;
        margin-top: 0;
        color: #5593ba;
        font-size: 1.4vmin;
        width: 100%;
    }
    .screen {
        margin: 0 0 0 0.2vmin;
        height: 55vmin;
    }
}