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

.bgimg {
  background: #000000 url('background_image.jpg');
  height: 100%;
  /*background-position: center;*/
  background-position: 48.5% 0%;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  color: #000000;
  font-family: "helvetica", Arial, monospace;
  font-size: 18px;
}

p {margin:0;}

.topleft {
  /*position: absolute;
  top: 20px;
  left: 40.5%;*/
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
  text-align: center;
  padding-top: 80px;
}
.topleft img {
  width: 40%;
}

/*.center-image {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
}*/

.bottomleft {
  position: absolute;
  bottom: 0;
  left: 16px;
}

.middle {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  width: 100%;
}

hr {
  margin: auto;
  width: 40%;
}

.enlace {
  text-decoration: none;
}

/* Small Devices, Tablets */
@media only screen and (max-width : 1024px) {
  .topleft img {
    width: 60%;
  }
  .topleft {
    left: 25%;
  }
}
/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {
  .topleft img {
    width: 80%;
  }
  .topleft {
    left: 20%;
  }
}
/* Small Devices, Tablets */
@media only screen and (max-width : 736px) {
  .topleft img {
    width: 80%;
  }
  .topleft {
    left: 32%;
  }
}
/* Extra Small Devices, Phones */ 
@media only screen and (max-width : 480px) {
  .topleft img {
    width: 100%;
  }
  .topleft {
    width: 70%;
  }
}