body, html {
  height: 100%;
}

.bg { 
  /* The image used */
  background-image: url("../img/bg2.jpg");

  /* Full height */
  height: 100%; 

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

header.masthead {
  padding-top: calc(3rem + 72px);
  padding-bottom: 3rem;
}


@media (min-width: 768px) {
.bg { 
  /* The image used */
  background-image: url("../img/bg1.jpg");

  /* Full height */
  height: 100%; 

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