@import url('https://fonts.googleapis.com/css2?family=Montserrat&display=swap');

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

.bgimg {
  background: linear-gradient(to right, rgba(50, 70, 80, 0.7), rgba(20, 150, 58, 0.7)), url('/background.jpg');
  height: 60%;
  background-position: center;
  background-size: cover;
  position: relative;
  color: white;
  font-family: "Montserrat";
  font-size: 25px;
  font-weight: 300;
}

h1{
  font-weight: 800;
  letter-spacing: 2px;
}

.topleft {
  position: absolute;
  top: 16px;
  left: 16px;
}
.topleft .logo{
  width:150px;
}

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

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

.publicity{
  display: flex;
  justify-content: center;
}
.publicity .container{
    display: flex;
    flex-direction: row;
}
.publicita-img{
  max-width: 50%;
}

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

@media screen and (max-width: 600px) {
  .bgimg {
    height: 90%;
  }
  .middle {
    left: 30%;
    font-size: 18px;
    transform: translate(-20%, -65%);
  }
  .bottomleft{
    font-size: 18px;
  }
  .publicity .container{
    display: flex;
    flex-direction: column-reverse;
}
.publicita-img{
  max-width: 100%;
}
}