/* CSS-Definitionsdatei, Kopfbereich sowie Fußbereich aller Seiten */
/*Navigationsleiste mit Hintergrundfarbe*/

#kopfzeile  {
            font-size: 27px;
            color: white;
            text-align: center;
            background-color: red;
            width: 94%;
            margin: auto;
            }
#kopfzeile2  {                                 /*leere Kopfzeile*/
            font-size: 25px;
            color: rgb(100 100 100);
            text-align: center;
            background-color: rgb(100 100 100);
            width: 94%;
            margin: auto;
            }
header {
        position:sticky;
        top:0;
        right:0;
        left:0;
        margin-top: 50px;
        margin-left: auto;
        margin-right: auto;
        width: 94%;
        background-color:white;
        height: 80px;
           }

.menueleiste a      {color: black;} 

.menueleiste ul      {
                    list-style-type: none;      /*keine Aufzählungspunkte*/
                    margin: 0;
                    padding: 0;
                    }


.menueleiste ul      { display:none;   }                   /*Untermenü ausblenden*/
         

.menueleiste a:hover {                                       /*Links im Hauptmenü bei Mausberührung hervorheben*/
                    background-color:rgb(100,100,100);
                    color: white;
                    padding: 11px;
                    border-radius: 7px;
                       }

.menueleiste {                                                 /*Hauptmenü*/
         display: flex;
         flex-direction: row;
         background-color: rgb(255,255,255);
         height: 110px;
         width: 100%;
         font-size: 30px;    
         text-align: center;
         line-height: 170px;  /*Abstand Schrift*/
              }

.startseite  {background-color: ; flex: 1;}  /*Flex-Etems*/
.aktuelles   {background-color: ; flex: 1;}
.uberuns     {background-color: ; flex: 1;}
.photovoltaik{background-color: ; flex: 1; width: 50px;}  /*verhindert springen der Navigatinsleiste*/
.dach        {background-color: ; flex: 0.8;}
.kontakt     {background-color: ; flex: 1;}
.impressum   {background-color: ; flex: 1;}
.logo        {background-color: ; flex: 1;}   
.dachdecker  {background-color: ; flex: 1;}
.sonne       {background-color: ;flex:0.5;}   


.dach:hover #dach {                               /*Dach-Link*/
             background-color: rgb(100,100,100); 
             border-radius: 8px;
             text-decoration: underline;
             color: white;
             border: 10px solid rgb(100,100,100);
             border-bottom: 25px solid rgb(100,100,100);
                                }
        
.dach ul:hover .liste  {                                /*Listenelemente Stylen*/
            border-radius: 15px;
            padding: 10px; 
            height: auto;
            background-color: rgb(201,201,201);
            transition: background-color 3s, height 3s;
                   }
      
.dach:hover ul   {                        /*Untermenü mit Menüleiste bei Mausberührung öffnen*/
        display: flex;
        flex-direction: column;
        position: absolute;
        top: 108px;
        left: 47%;       
        width: 300px;
        height: auto;
        padding: 25px;
        background-color: rgb(242,242,242);      
        text-align: center;
        line-height: 50px;
        border: 10px solid rgb(100,100,100);
        border-radius: 15px;
                        }

/*Positionierung der Fußleiste*/

#seite {
       position: relative;
       min-height: 100%;
       height: auto !important;
       height: 100%;
       width: 100%;
       background-color: rgb(100,100,100);
       }
#seiteninhalt {
              padding-bottom: 8em; /*Innenabstand unten Seiteninhalt*/ 
              padding-top: 1px;
              background-color: rgb(242,242,242);
              border-bottom: 140px rgb(100,100,100) solid; 
              min-height: 1000px;
              width: 94%;
              margin: auto;
              }
.footer   {
        position: absolute;
        background-color: rgb(255,255,255);
        bottom: 40px;        
        height: 130px;             /*höhe footer = Abstand Hauptseite*/
        width: 94%;
        margin-left: 3%;
        }     
#adresse {
        position: absolute;
        bottom: 10%;
        right: 60%;
        }
#buero   {
        position: absolute;
        bottom: 30px;
        right: 40%;
        }
#kontakt {
        position: absolute;
        bottom: 2%;
        right: 5%;
         }
#copyright {
          position: absolute;
          bottom: -16px;
          left: 1%;
           }