/* mobile.css */

body {
    xxborder: 10px solid red !important;
}

#container {
    display: block !important;  /* Schaltet Flexbox (nebeneinander) aus */
    width: 100% !important;
}

#navigation {
    display: block !important;
    width: 90% !important;    /* Überschreibt die 150px */
    min-width: 80% !important;
    min-height: auto !important; /* Entfernt die 800px Höhe */
    float: none !important;
    position: static !important; /* Falls es auf fixed oder absolute steht */
    padding: 10px !important;
    background: #f0f0f0 !important;
}

#content {
    display: block !important;
    width: 100% !important;
    margin-left: 0 !important; /* Ganz wichtig, falls die Nav Platz reserviert hat */
    padding: 15px !important;
    box-sizing: border-box !important;
}

#header {
    width: 100% !important;
    padding-left: 0 !important;
    display: block !important;
    text-align: center;
}

/* Verhindert, dass Bilder oder Tabellen die Seite nach rechts aufblähen */
img, table {
    max-width: 100% !important;
    height: auto !important;
}
#content {
    overflow-x: hidden; /* Verhindert, dass die ganze Seite wackelt */
}

table {
    display: block !important;
    width: 100% !important;
    overflow-x: auto !important; /* Macht nur die Tabelle seitlich scrollbar */
    -webkit-overflow-scrolling: touch;
}