.header {
  background-color: gold;
  /* font-family: Impact; */
  font-family: "Anton", sans-serif;
  display: flex;
  gap: 20px;
  padding: 10px;
}

.header img {
  width: 100px;
}

.banner img {
  width: 100%;
}

.banner_text {
  position: absolute;
  top: 5px;
  left: 15px;
  width: 40%;
  font-size: 18px;
}

.banner {
  position: relative;
  color: white;
}

.container img {
  width: 80%;
}

.container {
  display: flex;
  flex-wrap: wrap;
}

.container div {
  width: 50%;
  text-align: center;
  font-family: impact;
}

.container a {
  color: black;
  text-decoration: none; /*remove underline*/
}

body {
  background-color: antiquewhite;
}
img {
  width: 100%;
}

.item_container {
  display: flex;
  text-align: center;
  padding: 20px;
}

.item_container img {
  width: 50%;
}

.item_container button {
  font-family: Impact;
  width: 200px;
  height: 30px;
  font-size: 18px;
  border-width: 0;
  margin: 4px;
  border-radius: 5px;
  color: white;
}
.button-container {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
}
.green_button {
  background-color: green;
}
.black_button {
  background-color: black;
}

.footer {
  background-color: gold;
  text-align: center;
  padding: 2px;
  background-color: #ffff99;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 1000 1000'%3E%3Cg fill='%23ffd573'%3E%3Cpolygon points='1000 -50 0 -50 500 450'/%3E%3Cpolygon points='550 500 1050 1000 1050 0'/%3E%3Cpolygon points='-50 0 -50 1000 450 500'/%3E%3Cpolygon points='0 1050 1000 1050 500 550'/%3E%3C/g%3E%3Cg fill='%23ffaa4d'%3E%3Cpolygon points='1000 -133.3 0 -133.3 500 366.7'/%3E%3Cpolygon points='633.3 500 1133.3 1000 1133.3 0'/%3E%3Cpolygon points='-133.3 0 -133.3 1000 366.7 500'/%3E%3Cpolygon points='0 1133.3 1000 1133.3 500 633.3'/%3E%3C/g%3E%3Cg fill='%23ff8026'%3E%3Cpolygon points='1000 -216.7 0 -216.7 500 283.3'/%3E%3Cpolygon points='716.7 500 1216.7 1000 1216.7 0'/%3E%3Cpolygon points='-216.7 0 -216.7 1000 283.3 500'/%3E%3Cpolygon points='0 1216.7 1000 1216.7 500 716.7'/%3E%3C/g%3E%3Cg fill='%23F50'%3E%3Cpolygon points='1000 -300 0 -300 500 200'/%3E%3Cpolygon points='800 500 1300 1000 1300 0'/%3E%3Cpolygon points='-300 0 -300 1000 200 500'/%3E%3Cpolygon points='0 1300 1000 1300 500 800'/%3E%3C/g%3E%3Cg fill-opacity='0.5'%3E%3Cpolygon fill='%23FE0' points='0 707.1 0 292.9 292.9 0 707.1 0 1000 292.9 1000 707.1 707.1 1000 292.9 1000'/%3E%3Cg fill='%23ffc800'%3E%3Cpolygon points='464.6 -242.5 -242.5 464.6 464.6 464.6'/%3E%3Cpolygon points='535.4 464.6 1242.5 464.6 535.4 -242.5'/%3E%3Cpolygon points='-242.5 535.4 464.6 1242.5 464.6 535.4'/%3E%3Cpolygon points='535.4 1242.5 1242.5 535.4 535.4 535.4'/%3E%3C/g%3E%3Cg fill='%23ffa200'%3E%3Cpolygon points='405.7 -301.4 -301.4 405.7 405.7 405.7'/%3E%3Cpolygon points='594.3 405.7 1301.4 405.7 594.3 -301.4'/%3E%3Cpolygon points='-301.4 594.3 405.7 1301.4 405.7 594.3'/%3E%3Cpolygon points='594.3 1301.4 1301.4 594.3 594.3 594.3'/%3E%3C/g%3E%3Cg fill='%23ff7b00'%3E%3Cpolygon points='346.8 -360.3 -360.3 346.8 346.8 346.8'/%3E%3Cpolygon points='653.2 346.8 1360.3 346.8 653.2 -360.3'/%3E%3Cpolygon points='-360.3 653.2 346.8 1360.3 346.8 653.2'/%3E%3Cpolygon points='653.2 1360.3 1360.3 653.2 653.2 653.2'/%3E%3C/g%3E%3Cg fill='%23F50'%3E%3Cpolygon points='287.9 -419.2 -419.2 287.9 287.9 287.9'/%3E%3Cpolygon points='712.1 287.9 1419.2 287.9 712.1 -419.2'/%3E%3Cpolygon points='-419.2 712.1 287.9 1419.2 287.9 712.1'/%3E%3Cpolygon points='712.1 1419.2 1419.2 712.1 712.1 712.1'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  background-attachment: fixed;
  background-size: cover;
}

.footer img {
  width: 30px;
}

.sitemap_container {
  display: grid;
  grid-template-columns: 110px 140px 130px;
  grid-template-rows: repeat(5, 50px);
}

@media screen and (max-width: 600px) {
  .header {
    gap: 10px;
    padding: 5px;
  }

  .header img {
    width: 65px;
  }

  .header h1 {
    font-size: 1.2rem;
  }

  .container div {
    width: 100%;
  }

  .container {
    flex-wrap: wrap;
  }

  .banner_text {
    top: 0;
    width: 50%;
  }
  .banner_text p {
    font-size: 10pt;
    line-height: 1.3;
    margin-top: 0%;
  }
  .banner_text h2 {
    font-size: 12pt;
    margin-bottom: 2px;
    line-height: 1;
  }

  .item_container img {
    width: 100%;
  }

  .item_container {
    /* width: 100%;
    display: flex; */
    flex-wrap: wrap;
  }
}