/*Inicio da versão para celular*/

@media (max-width: 700px) {
  .card {
    float: left;
    padding: 0 1.7rem;
    width: 80vw;
    margin: 10px;
  }


  .card .wrapper {
    top: 10%;
    background-color: #fff;
    min-height: 50vh;
    width: 80vw;
    position: relative;
    overflow: hidden;
    box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.2);
  }

  .linhaCard {
    flex-direction: column;
  }

  nav {
    display: none;
    z-index: 900;
    flex-direction: column;
    position: fixed;
    padding: 5px;
    width: 250px;
    height: 100%;
    background-color: #8d281d;
    box-shadow: -5px 0px 60px black;
    transition: ease-in-out 0.2s;
    text-transform: uppercase;
    background-size: 250%;
    background-position: -10px 100px;
    background-repeat: no-repeat;
    background-blend-mode: color-burn;
    animation-name: transicao-suave;
    animation-timing-function: ease-in-out;
    animation-duration: 0.3s;
  }

  nav div {
    display: flex;
  }

  nav #divNavLinks {
    flex-direction: column;

    margin-top: 30px;
  }

  #divBtnVoltarHome {
    display: none;
  }

  nav #divNavLinks a,
  nav div a {
    flex-direction: column;

    padding-left: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-top: 4px;
    margin-bottom: 4px;
    cursor: pointer;
    color: white;

    font-size: 20px;
    text-decoration: none;
    font-weight: 900;

    transition: 0.2s;
  }

  #divLinksDireita {
    display: flex;
    flex-direction: row;
  }

  .lang {
    display: none;
  }

  .langCel {
    width: 65px;
    height: 65px;
  }

  #languages {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
  }

  nav #imgLogoNav {
    -webkit-user-drag: none;
    -webkit-user-select: none;
    user-select: none;
    height: 91px;
    width: 100px;
  }

  nav #btnFecharMenu {
    -webkit-user-drag: none;
    -webkit-user-select: none;
    user-select: none;

    cursor: pointer;

    position: relative;
    left: 60px;
    margin-top: 10px;
    padding: 8px 14px 6px 14px;

    color: white;
    border: 1.5px solid white;
    border-radius: 6px;

    font-weight: 900;
    font-size: 25px;

    transition: 0.2s;
  }

  nav #btnFecharMenu:hover {
    background-color: #8d281d;
    color: #424242;
  }

  /**/

  header {
    position: unset;
    top: 0px;

    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;

    font-family: Poppins;
    text-transform: uppercase;
    font-weight: 900;

    transition: 0.5s ease-in-out;
  }

  header .link-header {
    display: none;
  }

  header #linkLogin,
  #linkCadastro {
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
    padding-right: 15px;

    color: black;
    text-decoration: none;
    font-size: 15px;

    transition: 0.2s;
  }

  header #imgLogoNav {
    display: none;
  }

  header #imgLogoNav-mq {
    display: block;

    width: 35px;
    height: 35px;
    margin-left: 16px;
  }

  nav #divNavlinks {
    display: flex;
    flex-direction: column;
  }

  header #btnMenuHamburguer {
    -webkit-user-select: none;
    -webkit-user-drag: none;
    user-select: none;
    cursor: pointer;
    display: block;

    width: 35px;
    height: 35px;
    margin-left: 10px;
    margin-right: 6px;

    transition: ease-in-out 0.9s;
  }

  body {
    background-color: rgb(255, 255, 255);
    height: 100%;
    display: block;
    margin: 0;
    font-family: Gotham;
  }

  /*Links do header*/

  a {
    text-decoration: none;
  }

  /*Espaço do header*/
  header {
    z-index: 700;
    top: 0px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    background-color: #8d281d;
    text-transform: lowercase;
    font-weight: 900;
  }

  .active {
    z-index: 700;
    display: flex;
    flex-direction: row;
    width: 100%;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    background-color: #8d281d;
    text-transform: lowercase;
    font-weight: 900;
    position: -webkit-sticky;
    position: fixed;
    top: 0;
  }

  /*3 partes do header centralizadas e em linhas*/
  header #divLinksHeader,
  #divLinkDireita,
  #divLogoEMenu {
    padding: 0;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
  }

  /*Logo da pagina na esquerda*/
  header #logoBHUB {
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    -webkit-user-drag: none;
    width: 80px;
    margin-left: 40px;
    margin-top: 8px;
    margin-bottom: 8px;
  }

  /*Partes do meio do header*/
  header .link-header {
    padding-top: 16px;
    padding-bottom: 16px;
    padding-left: 25px;
    padding-right: 25px;
    color: rgb(255, 255, 255);
    text-decoration: none;
    font-size: 20px;
    transition: 0.2s;
  }

  /*Imagens da parte direita do header*/
  header #divLinksDireita img {
    height: 50px;
    margin-right: 40px;
  }

  /*Header acaba aqui*/

  /*Começa o body do site*/
  .Letreiro {
    background-color: #8d281d;
    padding-top: 10px;
    height: 800px;
    width: 100%;
  }

  span:before {
    content: "hub";
    color: white;
    animation: BHUB 10s infinite backwards;
  }

  .Letreiro h1 {
    color: white;
    margin-top: -500px;
    margin-left: 5%;
    font-size: 4.1rem;
    font-family: alongsans;
  }

  .solucoes {
    height: 450px;
  }

  .solucoes h3 {
    font-size: 2rem;
    color: rgb(0, 0, 0);
  }

  .linha1 {
    display: flex;
    background-color: #f9bc14;
    height: 775px;
    margin-top: -2px;
    text-align: center;
  }

  .linha2 {
    display: flex;
    background-color: #f9bc14;
    height: 1000px;
    text-align: center;
  }

  .tituloValues {
    font-size: 3.5rem;
    margin-left: 65px;
  }

  #ourValues h2 {
    font-size: 1.3rem;
    padding-left: 0%;
    padding-right: 0%;
    width: 95%;
    margin-left: 10px;
  }

  .imgValues {
    display: none;
  }

  .titulo {
    font-size: 3.5rem;
    margin-left: 20px;
  }

  .subtitulo {
    font-size: 3rem;
    position: absolute;
    margin-top: 600px;
    margin-left: 70px;
    font-family: AlongsansG;
  }

  .texto1 {
    display: flex;
    width: 95%;
    margin-left: 10px;
    margin-top: 650px;
    position: absolute;
  }

  .texto1 h3 {
    font-size: 1.3rem;
    font-weight: bolder;
    color: #201b39;
  }

  .bhub {
    display: flex;
  }

  .VIDBHUB {
    display: block;
    height: 350px;
    width: 350px;
    margin-top: 175px;
    margin-left: 30px;
  }

  .IMGBHUB {
    display: block;
    height: 350px;
    width: 350px;
    margin-top: 175px;
    margin-left: 30px;
  }

  /* Começo contato*/

  .contato {
    height: auto;
    width: auto;
  }

  .titulo4 {
    color: black;
    font-size: 3.5rem;
    position: absolute;
    margin-left: 100px;
    margin-top: 18px;
  }

  .linha_contato {
    display: flex;
    flex-direction: column;
  }

  .endereco {
    position: absolute;
    color: #fef0cd;
    margin-top: 110px;
    margin-left: 80px;
    font-size: 1.1rem;
  }

  .fone {
    color: black;
  }

  .cidade {
    position: absolute;
    margin-top: 140px;
    margin-left: 140px;
    font-size: 1.1rem;
  }

  #mapa {
    display: none;
  }

  .linha_contato h2 {
    font-size: 1rem;
  }

  .inputs {
    display: flex;
    flex-direction: column;
    margin-top: 0px;
    margin-left: 15px;
  }

  .contato input,
  .contato textarea {
    width: 90vw;
    height: 50px;
    margin-left: 0px;
    font-size: 1.2rem;
  }

  .inputs h2 {
    margin-left: 0px;
    font-size: 20px;
  }

  #mensagem {
    height: 250px;
  }

  .inputs button {
    width: 150px;
    margin-left: 20px;
    background-color: #8d281d;
    border-color: rgba(0, 0, 0, 0.534);
    border-radius: 10px;
    margin-top: 30px;
    color: rgb(255, 255, 255);
    font-size: 35px;
    cursor: pointer;
  }

  .inputs button p {
    margin-top: 0px;
    font-family: AlongsansG;
  }

  #response {
    color: rgb(0, 0, 0);
    font-size: 25px;
    height: 100px;
    margin-left: 50px;
    margin-top: 25px;
  }

  #local {
    margin-top: 20%;
  }

  #envio {
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    justify-content: center;
    align-items: center;
    margin-left: 0px;
  }

  /* Footer */

  #footer {
    background-color: #8d281d;
    height: 200px;
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  #footer img {
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    -webkit-user-drag: none;
    margin-top: 15px;
  }

  #footer #termos {
    margin-top: 30px;
    text-align: center;
    color: white;
    font-size: 0.9rem;
  }

  #footer #politica {
    position: absolute;
    margin-top: 70px;
    color: white;
    font-size: 0.9rem;
  }

  #footer #footerLogos {
    display: none;
  }

  @keyframes transicao-suave {
    0% {
      opacity: -100%;
    }

    20% {
      opacity: -80%;
    }

    30% {
      opacity: -60%;
    }

    40% {
      opacity: -40%;
    }

    20% {
      opacity: -20%;
    }

    0% {
      opacity: 0%;
    }
  }
}

@media (min-width: 1601px) {
  #vid1 video {
    width: 550px;
  }

  #vid video {
    width: 550px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1550px) {
  nav {
    display: block;
    z-index: 900;
    flex-direction: column;
    position: fixed;
    padding: 5px;
    width: 370px;
    height: 100%;
    background-color: #424242;
    box-shadow: -5px 0px 60px black;
    transition: ease-in-out 0.2s;
    text-transform: uppercase;
    background-size: 250%;
    background-position: -10px 100px;
    background-repeat: no-repeat;
    background-blend-mode: color-burn;
    animation-name: transicao-suave;
    animation-timing-function: ease-in-out;
    animation-duration: 0.3s;
  }

  #btnMenuHamburguer {
    display: none;
  }

  .Letreiro h1 {
    font-size: 4.1rem;
    font-family: alongsans;
    color: white;
    margin-top: -500px;
    margin-left: 35%;
  }

  .solucoes h3 {
    font-size: 20px;
    color: rgb(0, 0, 0);
  }

  .imgValues {
    display: none;
  }

  .tituloValues {
    font-size: 5rem;
    margin-left: 475px;
  }

  .titulo4 {
    color: black;
    font-size: 5rem;
    position: absolute;
    margin-left: 600px;
    margin-block-end: 53.6px;
    margin-block-start: 26.6px;
  }

  .subtitulo {
    font-size: 3.5rem;
    position: absolute;
    margin-top: 210px;
    margin-left: 550px;
    font-family: AlongsansG;
  }

  .texto1 {
    display: flex;
    width: 800px;
    margin-left: 450px;
    margin-top: 250px;
    position: absolute;
  }

  .texto1 h3 {
    font-size: 1.7rem;
    font-weight: bolder;
    color: #201b39;
  }

  .IMGBHUB {
    display: block;
    height: 400px;
    width: 400px;
    margin-top: 215px;
    margin-left: 25px;
  }

  .VIDBHUB {
    display: block;
    height: 400px;
    width: 400px;
    margin-top: 215px;
    margin-left: 25px;
  }

  header #divLinksDireita img {
    height: 40px;
    margin-right: 40px;
    margin-top: 10px;
  }

  /*Videos*/

  .linha_Clientes {
    display: flex;
    flex-direction: row;
    position: absolute;
    margin-top: 200px;
    justify-content: space-between;
    align-items: center;
    margin-left: 130px;
  }

  .linha_Clientes img {
    height: 100.5px;
    width: 178.8225px;
  }

  .linha_Clientes2 {
    display: flex;
    flex-direction: row;
    position: absolute;
    margin-top: 330px;
    justify-content: space-between;
    align-items: center;
    margin-left: 130px;
  }

  .linha_Clientes2 img {
    height: 100.5px;
    width: 178.8225px;
  }

  .linha_Clientes3 {
    display: flex;
    flex-direction: row;
    position: absolute;
    margin-top: 460px;
    justify-content: space-between;
    align-items: center;
    margin-left: 130px;
  }

  .linha_Clientes3 img {
    height: 100.5px;
    width: 178.8225px;
  }

  .linha_Clientes4 {
    display: flex;
    flex-direction: row;
    position: absolute;
    margin-top: 590px;
    justify-content: space-between;
    align-items: center;
    margin-left: 220px;
  }

  .linha_Clientes4 img {
    height: 100.5px;
    width: 178.8225px;
  }

  .linha_contato {
    display: flex;
    flex-direction: row;
  }

  .endereco {
    position: absolute;
    color: #fef0cd;
    margin-top: 185px;
    margin-left: 120px;
    font-size: 1.5rem;
  }

  .cidade {
    position: absolute;
    color: #fef0cd;
    margin-top: 225px;
    margin-left: 225px;
    font-size: 1.6rem;
  }

  .fone {
    color: black;
  }

  .linha_contato h2 {
    color: black;
  }

  .inputs {
    display: flex;
    flex-direction: column;
    margin-top: 150px;
  }

  .inputs h2 {
    margin-left: 50px;
  }

  .contato input,
  .contato textarea {
    width: 400px;
    height: 50px;
    margin-left: 50px;
  }

  .contato input {
    width: 400px;
    height: 50px;
    margin-left: 50px;
  }

  #envio {
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    margin-top: 20px;
    justify-content: center;
    align-items: center;
  }

  #footer {
    background-color: #8d281d;
    height: 100px;
    justify-content: space-around;
    display: flex;
    flex-direction: row;
    align-items: center;
  }

  .integrantes img {
    width: 265px;
    height: 265px;
  }

  .info {
    position: relative;
    z-index: 5;
    display: flex;
    flex-direction: column;
    margin-top: -345px;
    margin-left: 10px;
    height: 40px;
    width: 40px;
  }

  .info img {
    height: 40px;
    width: 40px;
  }

  .info2 {
    position: relative;
    z-index: 5;
    display: flex;
    flex-direction: column;
    margin-top: -375px;
    margin-left: 10px;
    width: 40px;
  }

  .info2 img {
    height: 40px;
    width: 40px;
  }

  .overlay {
    margin-top: -269px;
    width: 265px;
    height: 265px;
    z-index: -1; /* começa com a overlay 0 para que a imagem de fundo seja visível */
    position: absolute;
  }

  .overlay img {
    width: 100%;
  }
}

/* Tablet */

@media only screen and (min-width: 601px) and (max-width: 1259px) {
  #Paises {
    display: block;
  }

  .lang {
    display: none;
  }

  nav {
    display: none;
    z-index: 900;
    flex-direction: column;
    position: fixed;
    padding: 5px;
    width: 370px;
    height: 100%;
    background-color: #8d281d;
    box-shadow: -5px 0px 60px black;
    transition: ease-in-out 0.2s;
    text-transform: uppercase;
    background-size: 250%;
    background-position: -10px 100px;
    background-repeat: no-repeat;
    background-blend-mode: color-burn;
    animation-name: transicao-suave;
    animation-timing-function: ease-in-out;
    animation-duration: 0.3s;
  }

  nav #btnFecharMenu {
    -webkit-user-drag: none;
    -webkit-user-select: none;
    user-select: none;
    cursor: pointer;
    position: relative;
    left: 170px;
    margin-top: 10px;
    padding: 8px 14px 6px 14px;
    color: white;
    border: 1.5px solid white;
    border-radius: 6px;
    font-weight: 900;
    font-size: 25px;
    transition: 0.2s;
  }

  #imgLogoNav {
    -webkit-user-drag: none;
    -webkit-user-select: none;
    user-select: none;
    height: 80px;
    width: 80px;
  }

  nav #divNavLinks {
    flex-direction: column;
    margin-top: 30px;
  }

  nav div a {
    flex-direction: column;

    padding-left: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-top: 4px;
    margin-bottom: 4px;

    color: white;
    cursor: pointer;
    font-size: 25px;
    text-decoration: none;
    font-weight: 900;

    transition: 0.2s;
  }

  nav div {
    display: flex;
  }

  nav h3 {
    color: white;
  }

  #btnMenuHamburguer {
    display: block;
  }

  .Letreiro h1 {
    font-size: 4.1rem;
    color: white;
    margin-top: -500px;
    margin-left: 15%;
  }

  .solucoes h3 {
    font-size: 20px;
    color: rgb(0, 0, 0);
  }

  .imgValues {
    display: none;
  }

  .tituloValues {
    font-size: 5rem;
    margin-left: 275px;
  }

  .titulo2 {
    font-size: 4.2rem;
    position: absolute;
    margin-left: 250px;
    color: #fef0cd;
  }

  .titulo3 {
    font-size: 5rem;
    position: absolute;
    margin-left: 300px;
    color: #6c6c6c;
  }

  .titulo4 {
    color: black;
    font-size: 5rem;
    position: absolute;
    margin-left: 300px;
    margin-block-end: 53.6px;
    margin-block-start: 53.6px;
  }

  #local {
    margin-top: 20%;
  }

  .subtitulo {
    font-size: 3.5rem;
    position: absolute;
    margin-left: 33.3%;
    margin-top: 600px;
    font-family: AlongsansG;
  }

  .texto1 {
    left: 0;
    width: 95%;
    margin-left: 10px;
    margin-top: 650px;
    position: absolute;
  }

  .texto1 h3 {
    font-size: 1.7rem;
    font-weight: bolder;
    color: #201b39;
  }

  .bhub {
    display: grid;
  }

  .linha1 {
    display: grid;
    background-color: #f9bc14;
    height: 800px;
    margin-top: -2px;
    text-align: center;
    justify-content: center;
  }

  .linha2 {
    display: grid;
    background-color: #f9bc14;
    height: 1000px;
    text-align: center;
    justify-content: center;
  }

  .VIDBHUB {
    display: block;
    height: 350px;
    width: 350px;
    margin-top: 175px;
    margin-left: 30px;
  }

  .IMGBHUB {
    display: block;
    height: 350px;
    width: 350px;
    margin-top: 175px;
    justify-self: center;
  }

  header #logoBHUB {
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    -webkit-user-drag: none;
    margin-left: 40px;
    margin-top: 15px;
    margin-bottom: 8px;
  }

  header #divLinksDireita img {
    height: 40px;
    margin-right: 40px;
    margin-top: 10px;
  }

  header .link-header {
    display: none;
  }

  header #imgLogoNav {
    display: none;
  }

  /*Videos*/

  .case {
    padding-left: 0px;
  }

  .casesR {
    background-color: #59b069;
    color: #fef0cd;
    display: inline-block;
    width: 100%;
  }

  .cases {
    display: none;
  }

  /*Primeiro video*/
  #vid1 {
    display: flex;
    flex-direction: row;
    padding-bottom: 0px;
    padding-top: 200px;
    justify-content: space-evenly;
  }

  #vid1 video {
    width: 350px;
  }

  #vid1 h1 {
    font-size: 1.7rem;
  }
  /*Fim primeiro video*/

  #vid {
    display: flex;
    flex-direction: row;
    padding-bottom: 50px;
    padding-top: 50px;
    justify-content: space-evenly;
  }

  #vid video {
    width: 350px;
  }

  #vid h1 {
    font-size: 1.4em;
  }

  /*Fim videos*/

  /*Integrantes*/

  .quemsomos {
    display: none;
  }

  .quemsomosR {
    background-color: #e53d3d;
    width: 100%;
    margin-top: -22px;
    display: block;
    padding-bottom: 150px;
  }

  .integrantes img {
    width: 300px;
    height: 300px;
  }

  .overlay {
    margin-top: -269px;
    width: 300px;
    height: 300px;
    z-index: -1; /* começa com a overlay 0 para que a imagem de fundo seja visível */
    position: absolute;
  }

  .overlay img {
    width: 100%;
  }

  .info {
    position: relative;
    z-index: 5;
    display: flex;
    flex-direction: column;
    margin-top: -345px;
    margin-left: 10px;
    height: 40px;
    width: 40px;
  }

  .info img {
    height: 40px;
    width: 40px;
  }

  .info2 {
    position: relative;
    z-index: 5;
    display: flex;
    flex-direction: column;
    margin-top: -375px;
    margin-left: 10px;
    width: 40px;
  }

  .info2 img {
    height: 40px;
    width: 40px;
  }

  /*Fim integrantes*/

  /*Clientes*/
  .Clientes {
    background-color: white;
    height: 950px;
    display: block;
  }

  .respons {
    display: none;
  }

  .linha_Clientes img,
  .linha_Clientes2 img,
  .linha_Clientes3 img,
  .linha_Clientes4 img,
  .linha_tablet img,
  .linha_tablet2 img {
    height: 100.5px;
    width: 178.8225px;
  }

  .linha_Clientes,
  .linha_Clientes2,
  .linha_Clientes3,
  .linha_Clientes4,
  .linha_tablet img {
    margin-left: 20px;
  }

  .linha_tablet {
    display: flex;
    flex-direction: row;
    position: absolute;
    margin-top: 700px;
    justify-content: space-between;
    align-items: center;
    margin-left: 0px;
  }

  .linha_tablet2 {
    display: flex;
    flex-direction: row;
    position: absolute;
    margin-top: 820px;
    justify-content: space-between;
    align-items: center;
    margin-left: 160px;
  }

  /*Fim clientes*/

  .linha_contato {
    display: flex;
    flex-direction: column;
  }

  .endereco {
    position: absolute;
    color: #fef0cd;
    margin-top: 185px;
    margin-left: 50px;
    font-size: 1.5rem;
  }

  .cidade {
    position: absolute;
    color: #fef0cd;
    margin-top: 225px;
    margin-left: 150px;
    font-size: 1.6rem;
  }

  .fone {
    color: black;
  }

  #mapa {
    justify-self: left;
    margin-left: 20px;
  }

  .inputs {
    display: flex;
    flex-direction: column;
    margin-top: 150px;
    margin-left: -20px;
  }

  .inputs h2 {
    margin-left: 50px;
  }

  .contato input {
    width: 100%;
    height: 50px;
    margin-left: 50px;
  }

  .contato textarea {
    width: 550px;
    margin-left: 50px;
  }

  .contato input {
    width: 500px;
    height: 50px;
    margin-left: 50px;
  }

  #envio {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-left: -400px;
  }

  #response {
    margin-left: 0;
  }

  #footer {
    background-color: #8d281d;
    height: 100px;
    justify-content: space-around;
    display: flex;
    flex-direction: row;
    align-items: center;
  }

  #footer #footerLogos #footer_logo {
    margin-left: 0px;
  }

  #footer #footerLogos img {
    margin-left: 0px;
  }
}


/*Responsividade para telas deitadas*/

@media only screen and (max-height: 600px) and (orientation: landscape) {
  /* Ajusta a largura dos cards e seus wrappers */
  .card {
    width: 90vw;
    margin: 5px auto;
  }
  
  .card .wrapper {
    width: 90vh;
    min-height: 40vw;
  }
  
  /* Altera o layout da linha dos cards para linha (ao invés de coluna) */
  .linhaCard {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
  }
  
  /* Ajusta o header para melhor acomodar os elementos em landscape */
  header {
    padding: 5px;
  }
  
  header .link-header {
    font-size: 16px;
    padding: 10px;
  }
  
  header #imgLogoNav-mq {
    width: 30px;
    height: 30px;
    margin-left: 5px;
  }
  
  /* Ajustes para a área de contato */
  .contato input,
  .contato textarea {
    width: 95vw;
    margin: 0 auto;
    font-size: 1rem;
  }
  
  .inputs button {
    width: 90vw;
    margin: 10px auto;
    font-size: 30px;
  }
  
  /* Ajusta a seção de envio, centralizando os elementos */
  #envio {
    margin-left: 0;
    justify-content: center;
    align-items: center;
  }
  
  /* Footer ajustado para acomodar os elementos em uma coluna */
  #footer {
    flex-direction: column;
    height: auto;
    padding: 10px;
  }

  nav #divNavLinks {
    flex-direction: row;
    margin-top: 30px;
  }
  nav {
    width: 100%;
    height: 370px;
  }
}