body {
    background-color: #ffffe0;
    font-family: Arial, sans-serif;
}

a:link, a:visited {
    color: #228B22;              /* forestgreen */
    text-decoration: none;
}

a:hover, a:active {
    color: #228B22;              /* forestgreen */
    text-decoration: underline;
}

footer{
    text-align: center;
    font-size: 70%;
}

h1{
    font-size: 1.5em;
    color: #000080;       /* navyblue */
}

h2{
    font-size: 1.3em;
    color: #104e8b;       /* dodgerblue4 */
}

h3{
    font-size: 1.2em;
    color: 1874cd;       /* dodgerblue3 */
}


.frame-table,                       /* Tabelle mit Rahmen um die Tabelle und um die Tabellenzellen */
.frame-table table,
.frame-table th,
.frame-table td {
    border: 1px solid black;    /* Rahmen festlegen */
}

.frame-table th,
.frame-table td {
    padding: 10px;                   /* linksbündig und mit Innenabstand für bessere Lesbarkeit */
    text-align: left;
}

.image-button:active {                   /* verlinktes Bild: <a href="aaa.html"><img src="bbb.jpg" alt="Alt-Text" class="image-button"></a> */
    transform: scale(0.95);
    transition: transform 0.2s;
}

@media screen and (max-width: 600px) {
  
/* Tabellenstruktur auflösen */
.responsive-table,                       /* Tabelle, die auf Tablets und Handys untereinander erscheinen soll: <table  class="responsive-table"> */
.responsive-table tbody, 
.responsive-table tr, 
.responsive-table td {
    display: block;
    width: 100%;
}