/* tank.css */
   body {
        position: relative;
        height: 100vh;
        margin: 0;
    }

    .tank-container {
        position: absolute; /* für freie Positionierung */
        display: flex;
        flex-direction: column; /* Text unter dem Tank */
        align-items: center;
        z-index: 10;        /* Tanks immer im Vordergrund */
    }

    .tank {
        position: relative;
        background-color: lightgray;
        border: 2px solid #000;
        border-radius: 5px;
        overflow: hidden;
        display: flex;
        justify-content: center; /* Text horizontal zentrieren */
        align-items: center;     /* Text vertikal zentrieren */
        font-weight: bold;
        color: white;
        font-size: 1rem;
    }

    .tank-fill {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        background-color: lightblue;
        background: linear-gradient(#00bcd4, #00796b);
        z-index: 0;
        transition: height 0.5s ease;
    }

    .tank-text {
        position: relative;
        z-index: 1; /* damit Text über Füllstand liegt */
    }

    .tank-label {
        margin-top: 5px;
        font-weight: bold;
        text-align: center;
    }
   .tank-zis {
        position: relative;
        background-color: lightgray;
        border-left: 12px solid brown;
        border-right: 12px solid brown;
        border-bottom: 12px solid brown;
        border-top: 1px solid black;

        justify-content: center; /* Text horizontal zentrieren */
        align-items: center;     /* Text vertikal zentrieren */
        font-weight: bold;
        color: white;
        font-size: 1rem;
        overflow: hidden;
        border-radius: 5px;
        display: flex;
    }