body, html {
  height: 100%;
  margin: 0;
}

.bg {
  /* The image used */
  background-image: url("teaser.png");

  /* Full height */
  height: 105%;

  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}


@media (max-width: 979px) {
   .bg {
  background-image: url("encontro.png");
    }
}

@media (max-width: 767px) {
  .bg {
  background-image: url("encontro.png");
    }
}

@media (max-width: 480px) {
   .bg {
  background-image: url("mobile.png");
    }
}