html, body {
  margin: 0;
  font-family: apercu;
}

.jumbotron {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
  padding: 4rem;
  box-sizing: border-box;
}

.jumbotron__logo {
  width: 10rem;
  height: 10rem;
  margin: 0rem;
}

.jumbotron__heading {
  font-size: 3rem;
  margin: 1rem;
}

.jumbotron__paragraph {
  font-size: 2rem;
  margin: 1rem;
}

.hexagon {
  position: relative;
  width: 300px; 
  height: 173.21px;
  background-color: transparent;
  margin: 86.60px 0;
  border-left: solid 32px rgba(0, 0, 0, 0.8);
  border-right: solid 32px rgba(0, 0, 0, 0.8);
}

.hexagon:before,
.hexagon:after {
  content: "";
  position: absolute;
  z-index: 1;
  width: 212.13px;
  height: 212.13px;
  -webkit-transform: scaleY(0.5774) rotate(-45deg);
  -ms-transform: scaleY(0.5774) rotate(-45deg);
  transform: scaleY(0.5774) rotate(-45deg);
  background-color: inherit;
  left: 11.9340px;
}

.hexagon:before {
  top: -106.0660px;
  border-top: solid 45.2548px rgba(0, 0, 0, 0.8);
  border-right: solid 45.2548px rgba(0, 0, 0, 0.8);
}

.hexagon:after {
  bottom: -106.0660px;
  border-bottom: solid 45.2548px rgba(0, 0, 0, 0.8);
  border-left: solid 45.2548px rgba(0, 0, 0, 0.8);
}