* {
  box-sizing: border-box;
}

html, body {
  margin: 0;
  padding: 0;
  background-color: #0f3d2e;
}

.hero {
  position: relative;
  width: 100%;
}

.hero-img {
  width: 100%;
  height: auto;
  display: block;
}

/* Invisible clickable Instagram area */
.ig-link {
  position: absolute;
  background: transparent;
  color: transparent;
  text-decoration: none;
  cursor: pointer;
  text-indent: -9999px;
}

/* Desktop hotspot positioning */
@media (min-width: 769px) {
  .ig-link {
    left: 9.5%;
    top: 93.5%;
    width: 8.2%;
    height: 5%;
  }
}

/* Mobile hotspot positioning */
@media (max-width: 768px) {
  .ig-link {
    left: 27%;
    top: 44.5%;
    width: 22%;
    height: 5.2%;
  }
}