/*SEÇÃO DE TEXTOS E IMAGENS DO HEADER*/
.grupo-img {
  display: flex;
  flex-flow: row wrap;
  width: 106%;
  position: relative;
  right: 3%;
}

.imagens {
  flex: 25%;
  width: 100%;
  margin: 0px;
}

.imagens img {
  width: 100%;
  height: 300px;
}

.imagens h2,
.imagens a {
  display: inline-block;
  color: #005a67;
  text-align: left;
  width: 80%;
  margin-right: 10%;
}

.imagens h2 {
  font-size: 25px;
}

.imagens a {
  font-size: 20px;
  text-decoration: none;
}

.imagens a:hover {
  color: #facc04;
}

/*SEÇÃO DOS CARDS*/
.cards {
  display: flex;
  flex-flow: row wrap;
  background-color: #005a67;
  width: 106%;
  position: relative;
  right: 3%;
  padding-bottom: 50px;
}

#hotel {
  flex: 100%;
  font-size: 60px;
}

.coluna {
  flex: 27%;
  background-color: white;
  margin: 0% 2% 2% 2%;
  padding: 20px;
}

.coluna h3 {
  font-size: 22px;
}

.coluna p {
  margin: 0px;
}

.coluna a {
  text-decoration: none;
  color: #005a67;
}

.coluna img {
  width: 100%;
  height: 300px;
}

.coluna a:hover {
  color: #facc04;
}

.reserva {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-items: center;
  background-color: #facc04;
  margin: 4% 2% 0 2%;
  height: 200px;
}

.reserva img {
  width: 60px;
  position: relative;
  top: 10%;
  right: 11%;
}

.reserva h2 {
  font-size: 40px;
  margin-left: 3%;
  position: relative;
  top: 10%;
  right: 11%;
  color: black;
}

.reserva h3 {
  font-size: 20px;
  width: 70%;
  position: relative;
  bottom: 15%;
  right: 5%;
  color: black;
}

.reserva:hover {
  opacity: 0.5;
  cursor: pointer;
}
