/** ==========================================
    Einstieg in HTML und CSS  
    Stylesheet für die Übungswebsite 
 
    layout.css  
    wird in style.css per @import eingebunden  

    ======================================= */



/** 
  * 2. Kopfbereich (inklusive Inhalte)  
  */ 

.site-header { 
  padding: 1rem 1rem 0 1rem;
  margin-bottom: 1rem;
  margin-top: 0;
  }
.site-header h1 { margin-bottom: 0; }
.site-header h1 + p { margin-top: 0; }


.h1pheader {
      font-size: 1.2rem;
      color: #00000095;
      text-align: center;
      letter-spacing: 1.1px;
      }
 @media screen and (min-width: 900px) {
 .h1pheader {
      font-size: 1.6rem;
      color: #00000095;
      letter-spacing: 1px;
       }
  }

/**
  * 3. Inhaltsbereich (ohne Inhalte)
  */

.site-content {
  line-height: 1.5;
  padding: 0 1rem;
  margin-bottom: 2rem;
}   

/**
  * 4. Fußbereich (inklusive Inhalte)
  */ 
.site-footer {
  font-size: smaller;
  background-color: var(--grau-dunkel);
  color: var(--basisfarbe);
  padding: 0.5rem 1rem;
}

.site-footer ul {
  list-style-type: none;
  display: flex; 
  /* justify-content: flex-end; */
  gap: 1rem;
  padding: 0;
  margin: 0; 
}

.socialicons ul
 {
 position: static;
 visibility: visible;
 justify-content: ;
 flex-flow: row;
 padding: 0;
 margin-top: 0.5rem;
}

.socialicons li:last-child {
 margin-left: auto;
}

.pflichtlinks ul
 {
 position: static;
 visibility: visible;
 justify-content: flex-end;
 flex-flow: row;
 padding: 0;
 margin-bottom: 0.4rem;
}
.pflichtlinks li:first-child {
 margin-right: auto;
}

.opening ul
 {
 position: static;
 visibility: visible;
 justify-content:flex-end;
 flex-flow: row;
 padding: 0;
 margin-top: 1rem;
 margin-bottom: 1.4rem;

}

.sitelinks {
    margin-top: 1rem;
    margin-bottom: 1rem;
}


.site-footer a {
  color: var(--basisfarbe); 
  text-decoration: none; 
}


 /* Abstandshalter */
 .startseite .abstand {
     margin-bottom: 10rem;
 }




/* Ende layout.css */