body {
    font-size: large ;
}

#navigation {
    height: 100px;
    width: 50%;
    background-color:  #FFFF00;
}

     /*  div ist ein Tag <div>  ...  </div>  */
     /*  div werden mit id bezeichnet  */
     
#navigation2 {
    height: 100px;
    width: 80%;
    background-color:  #FFAAD4;
}     
     
#logo {
    height: 60px;
    width: 60px;
    background-color:  #D5D5D5;
}

#navigation3 {
    height: 100px;
    width: 80%;
    background-color:  #FFAAD4;
}

#logo3 {
    margin: 20px;
    height: 60px;
    width: 60px;
    background-color:  #D5D5D5;
}

    /*  margin wirkt sich aber auch auf navigation3 aus deshalb kommt jetzt navigation4 */
    /*  Lösung 1 über navigation4 */
    /*  Lösung 2 über navigation5 */
 
#navigation4 {
    height: 100px;
    width: 80%;
    
    background-color:  #FFAAD4;
    border: solid black 5px;
}

#logo4 {
    margin: 20px;
    
    height: 60px;
    width: 60px;
    
    background-color:  #D5D5D5;
}

#navigation5 {
    height: 100px;
    width: 80%;
    
    background-color:  #FFAAD4;
}

#logo5 {
    margin: 20px;
    float:  left;
    
    height: 60px;
    width: 60px;
    
    background-color:  #D5D5D5;
}

#navigation6 {
    height: 100px;
    width: 80%;

    background-color:  #FFAAD4;
}

#logo6 {
    margin: 20px;
    float:  left;

    height: 60px;
    width: 60px;

    background-color:  grey;
    background: url(picture/favicon.jpg);
    background-size: cover;
    /* cover, passt unter Beibehaltung des Seitenverhältnisses 
     * die kleinere Seite der Grafik in den Anzeigebereich ein, 
     * ergibt eine vollständige Füllung des Anzeigebereiches */
}

#navigation7 {
    height: 200px;
    width: 60%;

    background-color:  #FFAAD4;
}

#logo7 {
    margin: 40px;
    float:  left;

    height: 120px;
    width: 120px;
    
    background-color:  grey;
    background: url(picture/favicon.jpg);
    background-size: cover;
}

#navigation8 {
    height: 200px;
    width: 60%;

    background-color:  #FFE6C3;
}

#logo8 {
    margin: 40px;
    float:  left;

    height: 120px;
    width: 120px;

    background-color:  grey;
    background: url(picture/favicon.jpg);
    background-size: cover;
}

.markierung1 {
    color: green;
    font-weight:  bold;
}

.markierung2 {
    color: red;
    font-weight:  bold;
    font-style:  italic;
}

