body { background-color:#FBE6CA;}

#HomeButton1{
margin-top:40px;
margin-left:35px;  
width:120px;
height:50px;
background:grey;
border-radius:10px;
box-shadow: 0px 5px 20px 5px rgba(0,0,0, .4);
}

#HomeButton2{
margin-top:-70px;
margin-left:30px;   
width:120px;
height:50px;
background:brown;
border-radius:10px;
}

#HomeButton2 h1{
text-align:center;
padding-top:12px;
font-size:18px;
color:white;
}

a:link { color: green; text-decoration:none }
a:visited {color:green; }  
a:hover { color: red; -ms-transition: color 1s; }

h1{color: brown;text-align:center;}
h2{color: brown;text-align:center;}

.a{color:red;}
.b{color:blue;}
.bg{background-color:white;}

.a1{font-size: 25px; color: brown;}
.a2 {font-size: 23px; color:blue;}
.tn{font-size: 20px; color: brown;}
.a4 {font-size: 20px; color:blue;}

.gt{font-family:arial;font-size: 21px;color: red;}
.bh{font-family:arial;font-size: 17px;color: blue;}


                                           /*  css für Tabellen  */

  .rahmen1 {
    border-width: 12px;
    border-color: #FC0;
    border-style: ridge;
    padding: 5px;
    margin: 0 auto;            /* Tabelle wird zentriert */
    box-shadow: 20px 20px 50px grey;

    width: auto;              /* Tabelle passt sich dem Inhalt an */
    border-collapse: collapse; /* schöner, kompakter Rahmen */
    
}

                              /* css für tonleiterprogramm  */

.container {
    margin-top: 50px;
    margin-left: 250px;
    width: 600px;
    padding: 20px;
}



input, select {
    margin: 4px;
}

.richtig {
    background-color: lightgreen;
}

.falsch {
    background-color: lightcoral;
}

#meldung {
    color: green;
}