@import url("https://fonts.googleapis.com/css2?family=Gupter:wght@400;500;700&display=swap");
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body {
  font-family: "Gupter", serif;
  color: #8c8c8c;
  padding: 2.5%;
  background-image: url("Images/pyramidenSkizze.png");
  background-color: whitesmoke;
}

.header {
  background-image: linear-gradient(
    to right bottom,
    rgba(44, 39, 31, 0.793),
    rgba(25, 25, 24, 0.807)
  );
  background-size: cover;
  background-position: top;
  clip-path: polygon(
    10% 0%,
    90% 0%,
    100% 7%,
    100% 90%,
    100% 100%,
    0 100%,
    0% 80%,
    0 7%
  );
}
.intro {
  padding: 2%;
  color: white;
  text-align: center;
  font-size: 2rem;
}
h1 {
  color: #cfcdcd;
}
.reconstruction {
  text-decoration: none;
  color: rgb(246, 246, 219);
}
.reconstruction:hover {
  color: rgb(246, 246, 184);
}

section {
  height: 200vh;
  color: #777;
}

button {
  padding: 15px 45px;
  font-family: "Gupter", serif;
  font-size: 1.5rem;
  margin-top: 15px;
  background-color: rgb(246, 246, 219);
  border-radius: 10px;
  cursor: pointer;
}
button:hover {
  transform: translateX(5px) translateY(5px);
  color: black;
  font-weight: bold;
}