@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap');



* {
  margin: 0;
  padding: 0;
}

.body {
  font-family: 'inter', 'Sans-serif';
  font-size: 1rem;
}

/* Navbar */

.navbar {
  background-color: #FFF;
  padding: 2em 10vw;
}

.navbar a {
  font-size: 1vw;
  font-weight: bold;
  color: #0097B2;
  margin-right: 20px;
}

.navbar a:hover {
  color: #0097B2;
}

.btn-nav {
  background-color: #0097B2;
  color: #FFF !important;
  border-radius: 5px;
}

.navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(0, 0, 255, 1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");

}

.navbar-toggler {
  border: 1px solid rgba(0, 0, 255, 1);
}


.container-fluid img a{
  text-decoration: none;
}

.logo{
  width: 150px;
  height: 50px;
  /*flex-shrink: 0;*/
}

/* Fim Navbar */

/* Banner */
#banner {
  background-color: #F3F8FF;
  margin-top: 12vh;
}

.container-banner {
  margin: 0 10vw;

}

.text-oficial {
  color: #02033B;
  font-family: Inter;
  font-size: 2.2vw;
  font-style: normal;
  font-weight: bold;
  line-height: 2.5vw;
  letter-spacing: -1.2px;
}

.text-titulos {
  display: block;
  color: #02033B;
  font-family: Inter;
  font-size: 1.6vw;
  font-style: normal;
  font-weight: bold;
  line-height: 2vw;
  letter-spacing: -1.2px;
}

.text-salto {
  display: block;
}

.text-descrição {
  color: #02033B;
}

.content-text {
  margin: 4vh 0;
}

.text-descrição {
  margin-bottom: 2vw;
}


.btn-protocolo {
  background-color: #0097B2;
  color: #FFFFFF;
}

.btn-protocolo:hover {
  color: #FFFFFF;
}

.btn-fale-conosco,
.btn-duvidas-frequentes,
.btn-protocolo {
  font-size: 0.8vw;
  display: inline-block;
  margin-right: 1vw;
  text-decoration: none;
  border: 1px solid #0097B2;
  border-radius: 25px;
  padding: 10px 20px;
  box-sizing: border-box;

}

/* Fim Banner */


/* About */
#about {
  padding: 20vh 0;
}

.container-about {
  text-align: center;
  margin: 0 8vw;
}

.item-about {
  padding: 0 4vw;
}

.p-oficial {
  margin-top: 2vw;
  margin-bottom: 9vh;

}


.p-cnib {
  margin-top: 4vh;
}

.p-lgpd {
  margin-top: 2vw;
  margin-bottom: 4vh;
}


.btn-oficial a,
.btn-cnib a,
.btn-lgpd a {
  text-decoration: none;
  background-color: #0097B2;
  color: #FFF;
  padding: 8px 16px;
  border-radius: 5px;
}


/* Fim Abaout */


/* Accordion */

#accordion {
  background-color: #F3F8FF;
  padding: 6vh 0;
}

#accordion h1 {
  text-align: center;
  color: #02033B;
  margin-bottom: 6vh;
  padding: 0;

}

.accordion-button {
  font-size: 14px;
}

.btn-perguntas {
  background-color: #0097B2;
  color: #FFFFFF;
  text-decoration: none;
  padding: 8px 16px;
  border-radius: 5px;
}


/* Fim Accordion */

/* Digital */


#digital {
  padding: 8vh 0;
}

.btn-digital {
  background-color: #0097B2;
  color: #FFFFFF;
  text-decoration: none;
  padding: 8px 16px;
  border-radius: 5px;
}

.btn-digital:hover {
  color: #FFF;
}

.btn-perguntas:hover {
  color: #FFFFFF;
}

/* Fim Digital*/

/* Footer */

#container-footer {
  padding: 6vh 0;
  background-color: #F3F8FF;
  color: #0097B2;

}

.link-footer a {
  text-decoration: none;
}

.nav-footer li {
  list-style: none;

}

.nav-footer a {
  text-decoration: none;
  color: #0097B2;
}

/* Fim Footer */

/* Modal */


.modal-body {
  text-align: center;
  color: #666666;
}

.modal-dialog {
  max-width: 200px;
}


.modal-content {
  font-size: 16px;
}

.modal-title {
  color: #5897cb;
}

.modal-subtext {
  color: #666666;
}

.modal-dialog {
  max-width: 600px;
}



.modal-footer {
  height: 60px;
  background-color: #eff3f8;
  font-weight: bolder;

}

.modal-date {
  color: #404040;
  font-weight: 500;
  text-decoration: underline;
}

.modal-link {
  color: #404040;
  font-weight: 500;
}

.btn-fechar {
  border: none;
  background-color: #42474e;
  border-radius: 5px;
  padding: 4px 8px;
  color: #ffffff;
}

.custom-close-button {
  background: none;
  border: none;
  padding: 0;
  font-size: inherit;
  cursor: pointer;
  outline: none;
}


/* Fim Modal */

/* ----- Requerimento ----- */


#requerimentos {
  margin-top: 12vh;
  padding-top: 5vh;
  padding-bottom: 10vh;
  background-color: #eff3f8;
}

.accordion h3 {
  text-align: center;
  padding: 5vh 0;

}

.accordion-button {
  text-transform: uppercase;
  font-weight: 700;
}


/* ----- Fime Requerimento ----- */

/* ----- Dúvidas Frequentes ----- */
.duvidas-fq {
  margin-top: 12vh;
  padding-top: 20vh;
  padding-bottom: 20vh;
  background-color: #eff3f8;
}

.duvidas-fq h1 {
  padding-bottom: 5vh;
  text-align: center;
  font-size: 32px;

}

/* ----- Fim dúvidas Frequentes ----- */


/* ----- Contato ----- */

#contato {
  margin-top: 12vh;
  padding: 20vh 0;
  background-color: #eff3f8;
}



.text-contato {
  padding: 5vh 0;
}

.form-contato {
  padding: 5vh 10vh;
  background-color: #FFFFFF;
  border-radius: 10px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.btn-primary {
  background-color: #0097B2 !important;
  border: none;
}

.container h2 {
  color: #0097B2 !important;
}

.btn-contato {
  background-color: #0097B2;
  color: #FFFFFF;
  text-decoration: none;
  padding: 6px 12px;
  border-radius: 5px;
}

.btn-contato:hover {
  color: #FFFFFF;
}

/* ----- Fim contato ----- */

/* ----- Consulta Protocolo ----- */

#consulta-protocolo {
  /*margin-top: 0vh;*/
  background-color: #eff3f8;
}

.custom-container {
  padding: 20vh;
}

.custom-form {
  max-width: 500px;
  margin: 10% auto;
  /* Adjust the margin-top and margin-bottom values as needed */
  background-color: #FFFFFF;
  padding: 5%;
  border-radius: 10px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.custom-form h3 {
  color: #0097B2;
}

.btn-consulta {
  text-align: center;
  margin: 5vh 0;
}

.btn-consulta-protocolo {
  text-decoration: none;
  background-color: #0097B2;
  color: #FFFFFF;
  padding: 8px 16px;
  border-radius: 5px;
  font-weight: bold;
}

.btn-consulta-protocolo:hover {
  color: #FFFFFF;
}


@media screen and (max-width: 767px) {


  /* Navbar*/

  .navbar a {
    font-size: 4vw;

  }

  .btn-nav {
    text-align: center;
  }

  /* Fim Navbar */

  /* Banner */

  .container-banner {
    padding: 4vh 0;
  }


  .text-oficial {
    font-size: 24px;
    line-height: 25px;

  }


  .text-titulos {
    font-size: 18px;
    line-height: 20px;
  }

  .text-descrição {
    font-size: 12px;
  }

  .content-button {
    margin-top: 6vh;

  }

  .btn-fale-conosco,
  .btn-duvidas-frequentes,
  .btn-protocolo {
    display: block;
    font-size: 4vw;
    text-align: center;
    margin-bottom: 2vh;

  }

  /* Fim Banner */

  /* About */

  #about {
    text-align: center;
    padding: 10vh 0;

  }


  .item-about {
    margin-bottom: 6vh;

  }

  .p-oficial {
    margin-top: 2vw;
    margin-bottom: 2vh;

  }

  /* Fim About */

  /* Acordion */

  #accordion {
    text-align: center;

  }

  .accordion-body {
    text-align: start;
  }

  /* Fim Acordion */

  /* Digirtal */

  #digital {
    text-align: center;
  }

  .p-liink {
    text-align: start;
  }

  .img-digital {
    margin-top: 30px;
  }

  /* Fim Acordion */
  .container-formulario {
    margin-top: 1vh;
  }

  /* Contato */
  .text-contato {
    padding-left: 3vh;
  }

  /* Fim Contato */

  .custom-form {
    max-width: 500px;
    margin-top: 15px;
    /*margin: auto;*/
    background-color: #FFFFFF;
    padding: 2vh;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);

  }

  .custom-form {
    margin: 10vh 2vh;
  }

  .custom-container {
    padding: 10% 2%;
  }

  .mapa{
    width: 200px;
    height: 200px;
  }

}