*{
    font-family: 'Calibri','Segoe UI','Arial';
    background-color: white;
}

#Logo{
    float: left;
    margin: 10px;
    margin-left: 5px;
    margin-top: 0;
}

.link{
    text-decoration: none;
} /*Damit zwischen den Bildern (mit links dahinter) keine Stücke des Links zu sehen sind*/

body{
    margin: 0;
    padding: 0;
    border: 0;
} /* Damit kein schlitz über dem header entseht in dem die bilder beim scrollen zu sehen sind*/


/*alle überschriften formatiert*/
h1{
    color: black;
    font-size: 15px;
    margin: 0;
    margin-top: 0;
}

h2{
    color: black;
    font-size:31px;
    margin: 0;
    margin-top: -5;
    margin-bottom: 12px;
}

h3{
    font-size: 17px;
    font-weight: 600;
    color: black;
    margin-left: 20px;
    margin-bottom: 0;
    background-color: transparent;
        
}

h4{
    color: black;
    font-size: 17px;
    margin: 0;
    margin-top: 20px;
    margin-bottom: 5px;
}

h5{
    color: black;
    font-size: 20px;
    margin: 0;
    
}

header{
    z-index: 4;
    position: fixed;
    width: 100%;
    padding-top: 20px;
    padding-left: 20px;
} /*Positio des headders (Logo, die Texte daneben & die Trennlinie)*/

.Links{
    padding-left: 5px;
    position: fixed;
    top: 130px;
    height: 100%;
} /*Position der gesamten linken Seite */


/*alle Texte, Links und die Logos auf der Linken Seite werden hier Formatiert*/
.name{
    color: black;
    font-size: 17px;
    margin: 0;
    margin-left: 20px;
}

.tel{
    font-size: 17px;
    color: black;
    margin: 0;
    margin-left: 20px;
}

.email{
    font-size: 17px;
    margin: 0;
    margin-left: 20px;
}   /*Formatierung des Textes*/
.email a:Link{
    color: black;
    background-color: transparent;
    text-decoration: underline;
} /*Formatierung des Links im Normalzustand*/
.email a:visited {
    color: black;
    background-color: transparent;
    text-decoration: underline;
}   /*Formatierung des Links wenn er besucht wurde*/
.email a:hover {
    color: red;
    background-color: transparent;
    text-decoration: underline;
}   /*Formatierung des Links wenn der Mauszeiger darüber ist*/
.eamil a:active {
    color: red;
    background-color: transparent;
    text-decoration: underline;
}   /*Formatierung des Links während er geöffnet ist*/

.text{
    font-size: 15px;
    color: black;
    list-style-type: square;
    margin-top: 10px;
    margin-bottom: 0;
    margin-left: 0;
    padding: 0;
    padding-left: 20;
    background-color: transparent;
}
.text a:Link{
    color: black;
    background-color: transparent;
    text-decoration: none;
}
.text a:visited {
    color: black;
    background-color: transparent;
    text-decoration: underline;
}
.text a:hover {
    color: red;
    background-color: transparent;
    text-decoration: underline;
}
.text a:active {
    color: red;
    background-color: transparent;
    text-decoration: underline;
}

.ausserdem{
    font-size: 15px;
    color: black;
    list-style-type: square;
    margin: 20px;
    margin-left: 0;
    margin-top: 5;
    padding: 0;
    padding-left: 20px;
}
.ausserdem a:Link{
    color: black;
    background-color: transparent;
    text-decoration: underline;
}
.ausserdem a:visited {
    color: black;
    background-color: transparent;
    text-decoration: underline;
}
.ausserdem a:hover {
    color: red;
    background-color: transparent;
    text-decoration: underline;
}
.ausserdem a:active {
    color: red;
    background-color: transparent;
    text-decoration: underline;
}

.Filme{
    color: black;
    font-size: 15px;
    margin: 0;
    margin-left: 20px;
    background-color: transparent;
}
.Filme a:Link{
    color: black;
    background-color: transparent;
    text-decoration: none;
}
.Filme a:visited {
    color: black;
    background-color: transparent;
    text-decoration: underline;
}
.Filme a:hover {
    color: red;
    background-color: transparent;
    text-decoration: underline;
}
.Filme a:active {
    color: red;
    background-color: transparent;
    text-decoration: underline;
}

.insta{
    margin: 0;
    margin-left: 10px;
    margin-top: 10px;
}
.facebook{
    
    margin: 1px;
    margin-left: 10px;
}
.YT{
    margin-left: 20px;
    background-color: transparent;
}

.Impressum{
    font-size: 13px;
    margin: 0; 
    margin-left: 20px;
    color: black;
    position: fixed;
    bottom: 5px;
}
.Impressum a:Link{
    color: black;
    background-color: transparent;
    text-decoration: underline;
}
.Impressum a:visited {
    color: black;
    background-color: transparent;
    text-decoration: underline;
}
.Impressum a:hover {
    color: red;
    background-color: transparent;
    text-decoration: underline;
}
.Impressum a:active {
    color: red;
    background-color: transparent;
    text-decoration: underline;
}


/*Alles was mit dem "Menü" zu tun hat*/

summary::-webkit-details-marker{display: none} /* Entfernt den default Pfeil vor den summary Punkten*/

summary#projektesummary{
    z-index: 5;
    padding: 2px;
    outline: none;
    list-style: none;
    position: fixed;
    top: 52px;
    left: 21em;
    color: black;
    cursor: pointer;
    background-color: transparent;
}   /* Der Summary Punkt in der Navigationsleiste im normalen zustand*/
details[open] summary#projektesummary{
    background-color: transparent;
    color: red;
    font-weight:bold;
} /* und im geöffneten Zustand*/

summary#wettbewerbesummary{
    z-index: 5;
    padding: 2px;
    outline: none;
    list-style: none;
    position: fixed;
    top: 52px;
    left: 31em;
    color: black;
    cursor: pointer;
    background-color: transparent;
}
details[open] summary#wettbewerbesummary{
    background-color: transparent;
    color: red;
    font-weight: bold;
}

summary#auszeichnungensummary{
    z-index: 5;
    padding: 2px;
    outline: none;
    list-style: none;
    position: fixed;
    top: 52px;
    left: 43em;
    color: black;
    cursor: pointer;
    background-color: transparent;
}
details[open] summary#auszeichnungensummary{
    background-color: transparent;
    color: red; 
    font-weight: bold;
}

summary#buerosummary{
    z-index: 5;
    padding: 2px;
    outline: none;
    list-style: none;
    position: fixed;
    top: 52px;
    left: 56em; 
    color: black;
    cursor: pointer;
    background-color: transparent;
}
details[open] summary#buerosummary{
    background-color: transparent;
    color: red; 
    font-weight: bold;
}

summary#Refsummary{
    z-index: 5;
    padding: 2px;
    outline: none;
    list-style: none;
    position: fixed;
    top: 52px;
    left: 64em;
    color: black;
    cursor: pointer;
    background-color: transparent;
}
details[open] summary#Refsummary{
    background-color: transparent;
    color: red;
    font-weight: bold;
}

summary#Sonstigessummary{
    z-index: 5;
    padding: 2px;
    outline: none;
    list-style: none;
    position:fixed;
    top: 52px;
    left: 75em;
    color: black;
    cursor: pointer;
    background-color: transparent;
}
details[open] summary#Sonstigessummary{
    background-color: transparent;
    color: red;
    font-weight: bold;
}

.menue{
    padding-left: 340px;
    padding-top: 110px; 
  
}/* Positio der Inhalte ("Details") der Menüpunkte*/

/*Links und Texte unter "Sonstiges" werden Formatiert*/
.Sonstiges{
    color: black;
    margin: 0;
}

.Sonstiges a:Link{
    color: black;
    background-color: transparent;
    text-decoration: underline;
}
.Sonstiges a:visited {
    color: black;
    background-color: transparent;
    text-decoration: underline;
}
.Sonstiges a:hover {
    color: red;
    background-color: transparent;
    text-decoration: underline;
}
.Sonstiges a:active {
    color: red;
    background-color: transparent;
    text-decoration: underline;
}

/*Links und Texte unter "Referenzen" werden Formatiert*/
.referenzliste {
    color: black;
    margin: 0;
    font-size: 15px;
}

.referenzliste a:Link{
    color: black;
    background-color: transparent;
    text-decoration: underline;
}
.referenzliste a:visited {
    color: black;
    background-color: transparent;
    text-decoration: underline;
}
.referenzliste a:hover {
    color: red;
    background-color: transparent;
    text-decoration: underline;
}
.referenzliste a:active {
    color: red;
    background-color: transparent;
    text-decoration: underline;
}


/*Links, Bilder, Texte und die Tabelle unter "Büro" werden Formatiert*/
.BueroBild{
    display: block;
    height: 200px;
    width: 200px;
    object-fit: cover;
    object-position: center; 
}

.BueroSanwald{
    color: black;
    font-size: 15px;
}

.BueroTabelle{
    font-size: 15px;
    margin-top: 10;
    color: black;
    width: 600;
    height: 300px;
    text-align: left;
}

th,td{
    padding: 10px;
    padding-left: 0;
    vertical-align: top;
}


/*Überall wo oben Bilder sind und drunter Text wird der Text extra Formatiert*/
.SonstigesText{
    float: left;
    width: 100%;
    font-size: 15px;
}

.AuszText{
    float: left;
    width: 100%;
    font-size: 15px;
}

.BueroText{
    font-size: 15px;
    float: left;
    width: 100%;
}

.WettText{
    float: left;
    width: 100%;
}

/*Alle was mit der Vergrößerung und dem eiblenden des Textes bei den Teaerbilden zu tun hat*/

.Bild_Text{
    filter: grayscale(100%);
    margin-right: 25px;
    margin-bottom: 10px;
    float: left;
    color: transparent;
    background-color: transparent;
    transition: all 0.2s;
    text-align: center;
    text-decoration: none;
    font-size: 12;
} /* gesamter div mit Bild un Text*/

.Bild_Text:hover{
    transition: all 0.35s;
    transform: scale(1.07,1.07);
    filter: grayscale(0);
    color: black;
    background-color: white;
} /* triggert die vergrößerung des Textes und Bildes & ändert die schriftfarbe und hintergrund farbe*/

.Bild{
    display: block;
    height: 266px;
    width: 400px;
    object-fit: cover;
    object-position: center;  
} /* Formatierung aller anzeigebilder*/

.Plakette{
    display: block;
    height: 200px;
    width: 200px;
    object-fit: cover;
    object-position: center;
} /*Formatierung der Plakette unter "Auszeichnungne"*/


@media (pointer: coarse) and (hover:none) {
    
   
    
    .menue{
        position: absolute;
        padding-left: 340px;
        padding-top: 110px;
        width: 1000px;
        -webkit-text-size-adjust: none;
    }

    .Links{
        padding-left: 5px;
        position: absolute;
        top: 110px;
        z-index: 3;
        -webkit-text-size-adjust: none;
    }
    
    header{
        z-index: 4;
        position: fixed;
        width: 1500px;
        padding-top: 20px;
        padding-left: 20px;
        -webkit-text-size-adjust: none;
    }
   
     
    
}
/*Damit auf mobil Geräten alle Menüpunkte sichtbar sind */