@media (min-width:769px) {
  .container {
    grid-template-columns: 6.6vw auto auto auto auto auto auto auto auto auto auto 6.6vw;
    grid-template-rows: auto auto auto auto;
  }

  .hero {
    grid-column-start: 2;
    grid-column-end: 12;
    vertical-align: middle;
    margin: 0 auto;
  }

  .hero p {
    padding-top: 2em;
    margin: 0;
    text-align: center;
  }

  #block1 p {
    margin-bottom: 90px;
  }

  .hero img {
    max-height: 80vh;
    max-width: 100%;
    height: auto;
    width: auto;
    vertical-align: middle;
    margin: 0 auto;
  }

  #block2 {
    grid-column-start: 2;
    grid-column-end: 12;
    grid-template-columns: 1fr 1fr;
    display: grid;
    margin-bottom: 90px;
    text-align: left;
  }

  #block2 a {
    grid-column-start: 2;
  }

  #block2 p {
    margin: 0em 2em;
  }

  #block2 .image {
    grid-column-start: 1;
  }

  .announcement {
    display: grid;
    grid-column-start: 2;
    grid-column-end: 12;
    grid-template-columns: 2fr 2fr;
  }

  .announcement p {
    margin: 0em 2em 0em 2em;
    grid-column-start: 2;
  }

  .announcement img {
    float: right;
    max-height: 50vh;
  }

}

@media only screen and (max-width:768px) {
  .container {
    grid-template-columns: 20px 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 20px;
    grid-row-gap: 2em;
    margin-bottom: 0;
    grid-column-gap: 0;
  }

  .hero {
    grid-column-start: 2;
    grid-column-end: 12;
  }

  .announcement {
    width: 100%;
    grid-column-start: 2;
    grid-column-end: 12;
    grid-template-columns: 1fr 1fr;
  }

  .announcement a {
    width: 100%;
    grid-column-start: 1;
    grid-column-end: 2;
  }

  .announcement p {
    grid-column-start: 2;
    grid-column-end: 3;
    margin: 0em 1em;
  }

  .announcement img {
    width: 100%;
  }


  .hero img {
    width: 100%;
  }

  #block2 {
    grid-column-start: 2;
    grid-column-end: 10;
    text-align: left;
  }

}

.block {
  text-align: center;
}

.block p {
  margin-top: 0;
}

.announcement {
  display: grid;
  text-align: left;
}

.hero a {
  text-align: center;
  margin: 0 auto;
  width: 100%
}

#block2 img {
  width: 100%;

}

#block2 p {
  grid-area: txt2;
}