@import url('https://fonts.googeapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&family=Varela+Round&display=swap');

@keyframes aparecer{
  0%{opacity: 0%;}
  10%{opacity: 25%;}
  20%{opacity: 50%;}
  30%{opacity: 100%;}
  40%{opacity: 100%;}
}
@keyframes entrar{
  from{
    top: -30vh;
  }
  to{
    top: 5vw;
  }
}

@keyframes crecer {
  from{
    transform: scale(0.5)
  }
  to{
    transform: scale(1);
  }
  
}

@keyframes opacity{
  from{opacity: 0;}
  to{opacity: 1;}
}

@keyframes img{
  0%{ box-shadow: 0px 0px 0.5vw black; }
  25%{ box-shadow: 0px 0px 2vw; }
  50%{ left: -50vw; }
  75%{ left:5vw }
}
@keyframes meio{
  from{ transform: translatey(0px); }
  to{ color: #222525; transform: translateY(28vh); }
}
@keyframes meio_mb{
    from{ transform: translate(0px);}
    to{color: #222525; transform: translateY(56vw);}
}
@keyframes fotos{
  0%   { left: 130vw; text-shadow: 0px 0px 0vw black; }
  25%  { left: 41vw; text-shadow: 0px 0px 0.2vw black;}
  50%  { left: -30vw; text-shadow: 0px 0px 0vw black; }
  75%  { left: 41vw; text-shadow: 0px 0px 0.2vw black;}
  100% { left: 130vw; text-shadow: 0px 0px 0vw black; }
}
@keyframes fotos_mobile{
  0%   { left: 200vw; text-shadow: 0px 0px 0vw black; }
  25%  { left: 25vw; text-shadow: 0px 0px 0.2vw black;}
  50%  { left: -100vw; text-shadow: 0px 0px 0vw black; }
  75%  { left: 25vw; text-shadow: 0px 0px 0.2vw black;}
  100% { left: 200vw; text-shadow: 0px 0px 0vw black; }
}
@keyframes sombra{
  0%{box-shadow: 0px 0px 1vw black; }
  25%{box-shadow: 0px 0px 0vw black;}
  50%{box-shadow: 0px 0px 1vw black;}
  75%{box-shadow: 0px 0px 0vw black;}
  100%{box-shadow: 0px 0px 1vw black;}
}
@keyframes img_m{
  0%{ box-shadow: 0px 0px 0.5vw black; }
  25%{ box-shadow: 0px 0px 2vw; }
  50%{ left: -90vw; }
  75%{ left:10vw }
}
img{
  user-select: none;
}
html{
  scroll-behavior: smooth;
}
*{
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: bold;
  font-style: normal;
}
/* Estiliza a barra de rolagem para navegadores WebKit (Chrome, Edge e Safari) */
::-webkit-scrollbar {
  width: 0.4vw; /* Largura da barra de rolagem */
}
::-webkit-scrollbar-track {
  background: #ffffff; /* Branco */
}
::-webkit-scrollbar-thumb {
  background: #2f74de; /* Azul */
  border-radius: 1vw; /* Borda arredondada */
}
::-webkit-scrollbar-thumb:hover {
  background: #0056b3; /* Azul mais escuro */
}

/* img{
  animation: opacity 1s;
} */
h1,p,img{
  animation: crecer 1s;
}
@media(min-width:1025px){
  body{
    border: none;
    margin: 0px;
    overflow-x: hidden;
  }
  /* BARRA */
  #bt_barra{
    width: 15vw;
    height: 6vh;
    margin: auto;
    margin-right: 2vw;
    font-size: 1.2vw;
    border-radius: 1vh;
    color: white;
    line-height: 5vh;
    font-weight:800;
    text-transform: capitalize;
    text-align: center;
    background-color: #285fb3;
    cursor: pointer;
    user-select: none;
    text-decoration: none;
  }
  #bt_barra:active{
    background-color: #2e5285;
  }
  #logo{
    object-fit: cover;
    height: 9vh;
    overflow: hidden;
  }
  #barra{
    z-index: 99;
    line-height: 10vh;
    display: flex;
    flex-direction: row;
    gap: 3vw;
    font-size: 1.2vw;
    background-color: rgb(255, 255, 255);
    box-shadow: 0px 0px 0.1vw black;
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100vw;
    height: 10vh;
  }
  .icon{
    text-decoration: none;
    text-transform: capitalize;
    font-weight: 500;
    color: #222525;
  }
  .icon:hover,.icon:active{
    color: #2f74de;
  }
  /* INICIO */
  #fundo{
    user-select: none;
    width: 35vw;
    position: absolute;
    top: 10vh;
    left: 55vw;
  }
  #inicio{
    width: 100vw;
    height: 100vh;
    position: absolute;
    top: 0vh;
    left: 0vh;
  }
  #t1{
    color: #222525;
    text-align: left;
    width: 50vw;
    font-size: 4vw;
    position: absolute;
    top: 20vh;
    left: 7vw;
  }
  #t2{
    position: absolute;
    top:55vh;
    left: 7vw;
    width: 45vw;
    font-size: 1.4vw;
    color: #222525c0;
  }
  #painel_not{
    width: 30vw;
    border-radius: 1vw;
    align-items: center;
    z-index: 100;
    position: absolute;
    top: 5vw;
    left: 35vw;
    animation:  entrar 2s;
    gap: 1vh;
    justify-content: center;
    background-color: white;
    box-shadow:0px 0px 1vw #0e3c3c;
    display: flex;
    flex-direction: column;
  }
  #painel_not h1{
    font-size: 1.4vw;
    color: #222525;
    width: 95%;
  }
  #painel_not h2 ,#painel_not a{
    cursor: pointer;
    border-radius:2vw;
    border: 0.2vw solid #0056b3;
    width: 8vw;
    font-size: 1.2vw;
    height: 8vh; 
    line-height: 8vh;
    text-align: center;
    transition: background-color 0.6s;

    color: #0056b3;
    background-color: #ffffff;
  }#painel_not h2:hover{
    transition: background-color 0.6s;
    background-color: #0056b3;
    color: white;
  }
  #painel_not a{
    background-color: #0056b3;
    color: white;
    transition: box-shadow 0.3s;
    transition: transform 0.3s;
    width: 15vw;
    text-decoration: none;
    height: 8vh;
  }
  #painel_not section{
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 2vw;
  }
  #painel_not a:hover{
    transform: translateY(-4px);
    transition: box-shadow 0.3s;
    transition: transform 0.3s;
    box-shadow: 0px 0px 1vw #0056b3;
  }
  /* PROBLEMAS */
  #problemas{
    width: 100vw;
    height: 60vh;
    position: absolute;
    top: 100vh;
    left: 0vw;
    background-color: #f4f9ff;
  }
  #tp1{
    font-size: 3vw;
    width:45vw;
    position: absolute;
    top: 8vh;
    left: 5vw;
    color: #222525;
  }
  #fundo2{
    width: 30vw;
    position: absolute;
    top: 8vh;
    left: 60vw;
    user-select: none;
  }
  #dc{
    width: 5vw;
    border-radius: 1vw;
    height: 2vh;
    background-color:#08080823;
    margin: auto;
    margin-top: 0vh;
  }
  #bt_2{
    text-transform: capitalize;
    text-decoration: none;
    font-size: 1.2vw;
    color: white;
    line-height: 5vh;
    text-align: center;
    width: 15vw;
    height: 5vh;
    border-radius: 1vw;
    background-color: #285fb3;
    position: absolute;
    top:47vh;
    left: 5vw;
    cursor: pointer;
    user-select: none;
  }
  /* GALERIA */
  #galeria{
    width: 100vw;
    height: 90vh;
    position: absolute;
    top:170vh;
    left: 0px;
  }
  #tg1{
    width: 45vw;
    font-size: 4vw;
    text-align: right;
    color: #222525;
    font-weight: bold;
    text-transform: capitalize;
    position: absolute;
    top: 20vh;
    right: 5vw;
  }
  #img{
    object-fit: cover;
    box-shadow: 0px 0px 0.2vw black;
    width: 40vw;
    height: 50vh;
    border-radius: 1vw;
    position: absolute;
    background-color: #285fb3;
    top: 20vh;
    left: 5vw;
    animation: img 4s infinite;
  }
  #sub1{
    font-size: 1.4vw;
    color: #222525c0;
    width: 37vw;
    text-align: right;
    position: absolute;
    top: 45vh;
    right: 5vw;
  }
  /* QUALIDADE */
  #qualidade{
    position: absolute;
    top: 260vh;
    left: 0px;
    height: 90vh;
    width: 100vw;
    background-color: white;
  }
  table {
    position: absolute;
    top: 15vh;
    right: 2vw;
    width: 50%;
    border-collapse: collapse;
    background: transparent;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
  }
  tr{
    text-align: center;
  }
  th, td {
    text-align: center;
    padding: 12px;
    text-align: left;
    border-bottom: 1px solid #ddd;
  }
  th {
    font-size: 2vw;
    border-top-left-radius:1vw;
    border-top-right-radius:1vw;
    text-align: center;
    text-transform: capitalize;
    background-color: #007BFF;
    color: white;
  }
  tr:nth-child(even) {
    background-color: #ececec;
  }
  tr:hover {
    background-color: #519ab8ab;
  }
  .at{
    font-size: 1.5vw;
    color: #222525;
    margin: auto;
  }
  #tq1{
    width: 43vw;
    position: absolute;
    top: 25vh;
    left: 2vw;
    font-size: 3vw;
    color: #222525;
  }
  /* EQUIPES */
  #te1{
    margin: auto;
    width: 50vw;
    font-weight: bold;
    text-transform: capitalize;
    text-align: center;
    margin-top: 3vh;
    font-size: 4vw;
    color: #222525;
  }
  #painel{
    position: absolute;
    top: 30vh;
    left: 130vw;
    text-align: center;
    width: 20vw;
    height: 50vh;
    animation: fotos 12s infinite;
  }
  #equipe{
    border: none;
    margin: 0px;
    background-color: #f4f9ff;
    position: relative;
    overflow: hidden; /* Added to fix horizontal scroll on mobile */
    top: 350vh;
    left: 0px;
    width: 100vw;
    height: 80vh;
    text-align: center;
  }
  #foto{
    width: 15vw;
    height: 15vw;
    border-radius: 100%;
    background-color: #222525;
    animation: sombra 12s infinite;
  }
  #nome_te{
    margin: auto;
    font-size: 2vw;
    color: #222525;
  }
  #cargo{
    text-transform: capitalize;
    color: #222525c0;
    font-size: 1.5vw;
    margin: auto;
  }
  #dc_1{
    position: absolute;
    top: -3vh;
    border-radius: 2vw;
    left: 47.5vw;
    height: 2vh;
    width: 5vw;
    background-color:#08080823;
  }
  /* AVALIAÇÕES */
  #avalia{
    position: absolute;
    top: 430vh;
    left: 0px;
    height: 80vh;
    width: 100vw;
  }
  #tv1{
    font-size: 4vw;
    position: absolute;
    top: 10vh;
    left: 5vw;
    color: #222525;
    width: 50vw;
  }
  #sombra{
    z-index: 2;
    background-color: transparent;
    box-shadow: inset 0.5vw 0.5vw 1vw rgba(0, 0, 0, 0.425);
    width: 40vw;
    height: 65vh;
    position: absolute;
    top: 5vh;
    border-radius: 1vw;
    right: 5vw;
  }
  #bloco{
    width: 40vw;
    height: 65vh;
    text-align: center;
    position: absolute;
    background-color: #f1f1f1;
    top: 5vh;
    right: 5vw;
    border-radius: 1vw;
    overflow: hidden;
    border: none;
    margin: 0px;
  }
  .d,.a{
    color: #222525;
    border-radius: 1vh;
    box-shadow: 0px 0px 1vw rgba(0, 0, 0, 0.486);
    width: 30vw;
    height: 20vh;
    background-color: white;
  }
  .a{
    animation: meio 1s linear normal;
  }
  #caixa1{
    position: absolute;
    top: -10vh;
    left: 5vw;
  }
  #caixa2{
    position: absolute;
    top: 20vh;
    left: 5vw;
  }
  #caixa3{
    position: absolute;
    top: 50vh;
    left: 5vw;
  }
  #fantasma{
    position: absolute;
    top: -40vh;
    left: 5vw;
  }
  .nm{
    margin: auto;
    margin-top: 1vh;
    text-transform: capitalize;
    font-weight: bold;
    font-size: 2vw;
    margin-bottom: 0px;
  }
  .nt{
    font-weight: 1vw;
    color: #222525c0;
    margin: auto;
    margin-top: 0.2vh;
    text-transform: capitalize;
  }
  .sr{
    font-size: 1.5vw;
    margin: auto;
    margin-top: 1vh;
  }
  .sr::before {
    content: '“'; /* Aspas de abertura */
  }
  .sr::after {
    content: '”'; /* Aspas de fechamento */
  }
  /* FOOTER */
  footer{
    text-align: center;
    position: absolute;
    top: 510vh;
    left: 0px;
    width: 100vw;
    height: 45vh;
    background-image: linear-gradient(to right, #2f74de,#5d9dff,#81b1f9);
  }
  #logo_baixo{
    width: 12vw;
    position: absolute;
    top: 10vh;
    left: 5vw;
  }
  #insta,#whats,#email{
    margin: auto;
    width: 4vw;
    margin-top: 20vh;
    margin-left: 4vw;
  }
  #insta{
    margin-left: 0px;
  }
}
@media (max-width: 768px) {
  body {
    width: 100%;
    margin: 0px;
    border: none;
    min-height: 100vw; /* Converted from 100vh */
    position: relative;
    overflow-x:hidden ;
  }
  #bt_barra {
    display: none;
    width: 50vw;
    height: 10vw; /* Converted from 5vh */
    font-size: 4vw;
    text-align: center;
    line-height: 10vw; /* Converted from 5vh */
  }
  .icon {
    display: none;
  }
  #logo {
    width: 30vw;
    object-fit: cover;
  }
  #barra {
    position: fixed;
    top: 0px;
    left: 0px;
    width:100%;
    height: 15vw;
    box-shadow: 0px 0px 0.2vh black;
    background-color: white;
    font-size: 3.5vw;
    flex-direction: column;
    text-align: center;
    z-index: 99;
  }
  #inicio {
    position: absolute;
    top: 20vw; /* Converted from 10vh */
    left: 0pc;
    width: 100vw;
    height: 150vw;
    text-align: center;
    overflow-x: hidden;
  }
  #fundo {
    margin: auto;
    margin-right: 4vw;
    width: 80vw;
    margin-top: 8vw; /* Converted from 4vh */
  }
  #t1 {
    font-size: 7vw;
    width: 85vw;
    margin: auto;
    color: #222525;
  }
  #t2 {
    font-size: 4vw;
    width: 80vw;
    margin: auto;
    margin-top: 2vw; /* Converted from 1vh */
    color: #222525c0;
  }
  /* PROBLEMAS */
  #problemas {
    width: 100%;
    height: 120vw; /* Para navegadores antigos */
    position: absolute;
    top: 200vw;
    left: 0px;
    padding-bottom: 32vw;
    background-color: #f4f9ff;
  }
  #tp1 {
    font-size: 4.5vw;
    width: 85vw;
    margin: auto;
    margin-top: 2vw; /* Converted from 1vh */
    text-align: center;
  }
  #fundo2 {
    margin-bottom: 0px;
    width: 80vw;
    margin: auto;
    margin-top: 40vw; /* Converted from 20vh */
    margin-left: 10vw;
  }
   #painel_not{
    padding-left:2vw;
    padding-right: 2vw;
    box-sizing: border-box;
    width: 90vw;
    border-radius: 4vw;
    align-items: center;
    z-index: 100;
    position: fixed;
    top: 5vw;
    left: 5vw;
    animation:  entrar 2s;
    gap: 0vh;
    align-items: center;
    justify-content: center;
    background-color: white;
    box-shadow:0px 0px 1vw #0e3c3c;

    display: flex;
    flex-direction: column;
  }
  #painel_not h1{
    font-weight: bold;
    font-size: 4vw;
    color: #213c62;
    width: 95%;
  }
  #painel_not h2 ,#painel_not a{
    border-radius:3vw;
    border: 0.2vw solid #0056b3;
    width: 30vw;
    cursor: pointer;
    font-size: 4vw;
    height: 8vh; 
    line-height: 8vh;
    text-transform: capitalize;
    text-align: center;
    transition: background-color 0.6s;

    color: #0056b3;
    background-color: #ffffff;
  }#painel_not h2:hover{
    transition: background-color 0.6s;
    background-color: #0056b3;
    color: white;
  }
  #painel_not a:active , #painel_not h2:active{
    transition: background-color 0.6s;
    background-color: #095050;
  }
  #painel_not a{
    background-color: #0056b3;
    color: white;
    transition: box-shadow 0.3s;
    transition: transform 0.3s;
    width: 55vw;
    text-decoration: none;
    height: 8vh;
  }
  #painel_not section{
    width: 95%;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 2vw;
  }
  #painel_not a:hover{
    transform: translateY(-4px);
    transition: box-shadow 0.3s;
    transition: transform 0.3s;
    box-shadow: 0px 0px 1vw #0056b3;
  }


  /* GALERIA */
  #galeria {
    padding-bottom: 10vw; /* Converted from 5vh */
    width: 100vw;
    height: 200vw;
    position: absolute;
    top: 340vw;
    left: 0px;
    background-color: #ffffff81;
  }
  #tg1 {
    position: absolute;
    top: 20vw; /* Converted from 10vh */
    left: 5vw;
    font-size: 6vw;
    width: 90vw;
    text-align: center;
    margin: auto;
    color: #222525;
    margin-top: 20vw; /* Converted from 10vh */
  }
  #img {
    width: 80vw;
    height: 60vw;
    object-fit: cover;
    position: absolute;
    top: 90vw; /* Converted from 45vh */
    left: 10vw;
    border-radius: 1.4vw;
    animation: img_m 4s infinite;
  }
  #sub1 {
    position: absolute;
    top: 60vw; /* Converted from 30vh */
    left: 10vw;
    color: #222525;
    font-size: 4vw;
    margin: auto;
    width: 80vw;
    text-align: center;
  }
  /* QUALIDADE */
  #qualidade {
    position: absolute;
    top: 530vw;
    width: 100vw;
    height: 140vw;
    padding-bottom: 10vw; /* Converted from 5vh */
  }
  #tq1 {
    font-size: 5.3vw;
    color: #222525;
    width: 90vw;
    margin: auto;
    text-align: center;
  }
  #tabela {
    position: absolute;
    color: #222525;
    top: 24vw; /* Converted from 12vh */
    left: 5vw;
    width: 90vw;
    margin: auto;
    border-collapse: collapse;
    font-size: 4vw;
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.2);
    background-color: white;
  }
  #tabela thead th {
    background-color: #007BFF;
    color: white;
    padding: 4vw;
    text-align: center;
    font-size: 5vw;
    border-radius: 2vw 2vw 0 0;
  }
  #tabela tbody tr {
    border-bottom: 1px solid #ddd;
  }
  #tabela td {
    text-align: center;
    padding: 3vw 2vw;
    font-size: 4vw;
    color: #222525;
  }
  #tabela tr:nth-child(even) {
    background-color: #f1f1f1;
  }
  #tabela tr:hover {
    background-color: #d6eaff;
  }
  /* EQUIPE */
  #equipe {
    position: absolute;
    height: 100vw;
    width: 100%;
    top: 700vw;
    left: 0px;
    padding-bottom: 10vw; /* Converted from 5vh */
    background-color: #f4f9ff;
    overflow: hidden; /* Added to fix horizontal scroll on mobile */
  }
  #te1 {
    font-size: 6vw;
    margin-top: 2vw; /* Converted from 1vh */
    width: 90vw;
    margin: auto;
    text-align: center;
  }
  #painel {
    width: 50vw; /* Converted from 25vh */
    position: absolute;
    top: 24vw; /* Converted from 12vh */
    left: 25vw;
    text-align: center;
    height: 64vw; /* Converted from 32vh */
    animation: fotos_mobile 12s infinite;
  }
  #foto {
    width: 50vw; /* Converted from 25vh */
    height: 50vw; /* Converted from 25vh */
    border-radius: 100%;
  }
  #nome_te {
    font-size: 4vw; /* Converted from 2vh */
    margin-bottom: 0px;
    margin-top: 4vw; /* Converted from 2vh */
    color: #222525;
    text-transform: capitalize;
  }
  #cargo {
    font-size: 4vw;
    margin-top: 2vw; /* Converted from 1vh */
    color: #0056b3;
    text-transform: capitalize;
  }
  /* AVALIAÇÕES */
  #avalia {
    position: absolute;
    top: 850vw;
    width: 100vw;
    height: 130vw;
  }
  #tv1 {
    font-size: 5vw; /* Converted from 2.5vh */
    width: 85vw;
    height: 20vw; /* Converted from 10vh */
    text-align: center;
    position: absolute;
    top: 2vw; /* Converted from 1vh */
    left: 7.5vw;
  }
  #sombra {
    z-index: 2;
    background-color: transparent;
    box-shadow: inset 0.5vw 0.5vw 3vw rgba(0, 0, 0, 0.425);
    position: absolute;
    top: 30vw; /* Converted from 15vh */
    left: 5vw;
    width: 90vw;
    height: 100vw; /* Converted from 50vh */
  }
  #bloco {
    position: absolute;
    width: 90vw;
    height: 100vw; /* Converted from 50vh */
    background-color: #f1f1f1;
    border-radius: 3vw;
    overflow: hidden;
    border: none;
    margin: 0px;
    text-align: center;
    top: 30vw; /* Converted from 15vh */
    left: 5vw;
  }
  .d, .a {
    width: 80vw;
    margin: auto;
    height: 32vw; /* Converted from 16vh */
    background-color: white;
    box-shadow: 0px 0px 0.3vh black;
    font-size: 4vw;
    box-sizing: border-box;
    padding-top: 2vw; /* Converted from 1vh */
    color: #222525;
  }
  .a {
    animation: meio_mb 1s;
  }
  .nm {
    font-size: 5vw;
    margin: 0px;
  }
  .sr {
    margin: 0px;
    font-size: 3.2vw;
  }
  #caixa1 {
    position: absolute;
    top: -30vw; /* Converted from -13vh */
    left: 5vw;
  }
  #caixa2 {
    position: absolute;
    top: 26vw; /* Converted from 15vh */
    left: 5vw;
  }
  #caixa3 {
    position: absolute;
    left: 5vw;
    top: 82vw; /* Converted from 43vh */
  }
  #fantasma {
    position: absolute;
    top: -86vw; /* Converted from -41vh */
    left: 5vw;
  }
  footer {
    position: relative;
    top: 996vw;
    width: 100%;
    left: 0px;
    margin-bottom: 0px;
    background-image: linear-gradient(to right, #2f74de, #5d9dff, #81b1f9);
    height: 22vw;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
  }
  #logo_baixo {
    height: 16vw; /* Converted from 8vh */
    margin-top: 4vw; /* Converted from 2vh */
  }
  #insta, #whats, #email {
    margin-top: 8vw; /* Converted from 4vh */
    height: 8vw; /* Converted from 4vh */
    margin-left: 2vw;
  }
}
/* @media (min-width: 500px) and (max-width: 1024px) {
  body {
    gap: 70vh;
    font-size: 1.8vw;
    overflow-x: hidden;
  }
  #logo {
    width: 14vh;
  }
  #barra {
    font-size: 2.5vw;
    height: 9vh;
  }
  #t1 {
    font-size: 5vw;
  }
  #t2 {
    font-size: 3vw;
  }
  #tp1, #tg1, #te1, #tv1 {
    font-size: 4vw;
  }
  #sub1 {
    top: 32vh;
    font-size: 3vw;
  }
  #img {
    width: 70vw;
    height: 35vh;
    top: 45vh;
  }
  #tabela {
    font-size: 2.7vw;
  }
  #tabela thead th {
    font-size: 3.2vw;
    padding: 2vw;
  }
  #painel {
    width: 40vw;
    height: 35vh;
    left: 30vw;
  }
  #foto {
    width: 40vw;
    height: 40vw;
  }
  #nome_te {
    font-size: 4vw;
  }
  #cargo {
    font-size: 3vw;
  }
  .d, .a {
    font-size: 3vw;
    height: 15vh;
  }
  .nm {
    font-size: 4vw;
  }
  .sr {
    font-size: 3vw;
  }
  footer {
    height: 12vh;
  }
  #logo_baixo {
    height: 7vh;
  }
  #insta, #whats, #email {
    height: 3.5vh;
    margin-left: 1.5vw;
  }
} */