/* Import der Google-Font Roboto */
@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');

/* mit Universal-Selektor "*" alle Elemente der Seite auswählen, Regel wird somit auf jedes Elemnt angewandt */
* {
    box-sizing: border-box; /* Gesamtbreite eines Elements = angegebene Breite EINSCHLIESSLICH Border und Padding */
    margin:0; /* Standard-Margins (Aussenabstände) entfernen */
    padding:0;
    font-family: 'Roboto', sans-serif;
}
body{
    background-color:#f9e406; 
    color:#000;
}
#wrapper {
    background-color: black;
    width: 80%;
    padding: 0 3em 3em 3em;
    margin: auto;
    margin-top: 0;
    color: #f9e406;
    height: 100vh; 
}

/* -------------------- 
   Navigation  */

   nav{
    margin:0;
    padding:0;
}

nav li{
    display: inline-block;
    width: 8em;
    height: 2em;
    margin: 2em 0 2em 0;
    color:#f9e406;
    font-size: 2em;
}

a{
    color:#f9e406;
    text-decoration: none;
    font-weight: bold;
}

/* Import der Google-Font Roboto */
@import url("https://fonts.googleapis.com/css2?family=Roboto&display=swap");

/* mit Universal-Selektor "*" alle Elemente der Seite auswählen, Regel wird somit auf jedes Elemnt angewandt */
* {
  box-sizing: border-box; /* Gesamtbreite eines Elements = angegebene Breite EINSCHLIESSLICH Border und Padding */
  margin: 0; /* Standard-Margins (Aussenabstände) entfernen */
  padding: 0;
  font-family: "Roboto", sans-serif;
}

body {
  /*Hintergrundfarbe*/
  background-color: #f9e406;
  /*Textfarbe*/
  color: #000;
}

#wrapper {
  background-color: black;
  width: 80%;
  padding: 0 3em 3em 3em; /* em --> relative Einheit RD, 1em = Schriftgrösse des Elements */
  margin: auto; /* horizontal zentrieren */
  color: #f9e406; /* Schriftfarbe */
  height: 150vh; /* vh = Viewport Height, hier 100% */
}

/* -------------------- Navigation  */

nav {
  margin: 0;
  padding: 0;
}

nav li {
  display: inline-block; /* Listenelemente horizontal nebeneinander (flow innerhalb Container) */
  width: 8em;
  height: 2em;
  margin: 2em 1em 2em 1em; /* top, right, bottom, left Margins*/
  color: #f9e406;
  font-size: 2em;
}

a {
  color: #f9e406;
  text-decoration: none;
  font-weight: bold;
}

/* ------------------- Headings und Aufzählungszeichen Liste  */

h1 {
  padding-top: 0.1em;
  font-size: 5em;
}

h2 {
  margin-top: 2em;
  margin-bottom: 1em;
}

/* Listelements der Über mich Seite */
li {
  list-style: disc;
  list-style-position: inside;
}

/* -------------------- Footer  */

footer {
  margin: 3em 0 0 0;
  background-color: #000;
}

/* -------------------- Tabelle  */
table {
  border-collapse: collapse;
  margin-top: 1em;
}

thead {
  background-color: #f9e406;
  color: black;
  font-weight: bold;
  border: 1px solid #f9e406;
}

td,
th {
  text-align: left;
  padding: 0.5em 0.5em;
  border: 1px solid #f9e406;
}


tr:first-child {
    background-color: yellow; /* Hier wird die Farbe der ersten Zeile festgelegt */
    color: Black; /* Textfarbe in der ersten Zeile */
}