* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body, html {
  height: 100%;
  display: flex;
  flex-direction: column;
  background-color: rgba(128, 128, 128, 0.282);
}

main {
  flex: 1;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

section {
  width: 350px;
  height: 500px;
  padding: 25px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

img {
  padding: 20px;
  width: 40%;
}

.laranja {
  background-color: #e38826;
  border-radius: 10px 0px 0px 10px;
}

.azul {
  background-color: #006970;
}

.verde {
  background-color: #004241;
  border-radius: 0px 10px 10px 0px;
}

.titulo {
  color: hsl(0, 0%, 95%);
  font-size: 35px;
  font-family: 'Big Shoulders Display', sans-serif;
  font-weight: 700;
  padding: 20px;
}

.txt {
  color: hsla(0, 0%, 100%, 0.75);
  font-family: 'Lexend Deca', sans-serif;
  font-weight: 400;
  padding: 20px;
}

button {
  cursor: pointer;
  width: 120px;
  margin-left: 20px;
  padding: 8px;
  border-radius: 30px;
  font-family: 'Lexend Deca', sans-serif;
  font-weight: bolder;
  border-color: transparent;
  letter-spacing: 2px;
  transition: background-color 0.8s;
}

.btn-laranja {
  color: #e38826;
}

.btn-laranja:focus {
  background-color: transparent;
  color: white;
  border-color: white;
}

.btn-azul {
  color: #006970;
}

.btn-azul:focus {
  background-color: transparent;
  color: white;
  border-color: white;
}

.btn-verde {
  color: #004241;
}

.btn-verde:focus {
  background-color: transparent;
  color: white;
  border-color: white;
}

footer {
  width: 100%;
  text-align: center;
  font-size: 14px;
  font-style: italic;
  color: rgb(43, 6, 255);
  padding: 30px;
  margin-top: auto; /* Alinha o rodapé no final da página */
}