html { 
  box-sizing: border-box; 
} 

*, ::before, ::after { 
  box-sizing: inherit; 
}
body {
background-color: black;
}
        /* ===== ERzeugt einen 1-spaltigen Grid-Container mit der prozentualen Spaltenbreite ===== */
.container {
  display: grid;
    grid-template-columns: 100%;
  background-color: black;
    }
  .header {
  background-color: black;            
  text-align: center;
  color: #ffffff;
}
        .header > h1 {
            font-family: "engraversgothic bt",serif;
            font-size: 2.5em;
            color: #ffffff;
        }
  .main {
  background-color: black;
      font-size: 1.2em;
      color: #DAC8A6;
    font-family: arial, sans-serif;
      text-align: center;
}
.container div {
    background-color: black;
  border: 1px #DAC8A6;
    border-top-style: solid;
    border-bottom-style: solid;
  font-size: 1.0em;
  text-align: center;
    color: #DAC8A6;
    font-family: arial, sans-serif;
    padding: 10px;
    align-content: center;
}
.section {
 background-color: black;
    text-align: center;
}
a {
    color: #CDAE31;
}
a:hover {
  background-color: darkslategrey;
}
  .footer {
  background-color: black;
  color: #ffffff;
  text-align: center;
}
section h1 {
    color: #CDAE31;
    font-family: arial;
}
        h1,h2,h4 {
    color: #DAC8A6;
    font-family: arial;
}

h1,h2 {
    font-size: 1.5em;
}
h4 {
    font-size: 1.2em;
}
        img{
width: 85%;
  margin: 0.5em 0.5em 0.5em;
}
footer nav {
  -webkit-flex: 1 1 100%;	
  flex: 1 1 100%;
  }
nav, nav ul, nav li{
  margin: 0;
  padding:0;
  border:none;
}
nav ul {
  display: -webkit-flex;
  -webkit-flex-direction: row;	
  display: flex;  
  flex-direction: row;
}

nav li {
  list-style-type:none;
    -webkit-flex: 1 1 100%;
  flex: 1 1 100%;
}