html,
 body {
   height: 100%;
 }

 body {
   font-family: 'Roboto', sans-serif;
 }

 .card-purple {
   border-color: #6f42c1;
 }

 .bg-gradient-purple {
   background: linear-gradient(45deg, #6f42c1, #8e44ad);
 }

 .text-purple {
   color: #6f42c1;
 }

 .nav-pills>li>a {
   border-radius: 0;
   border-top: 3px solid transparent;
   color: #444;
   padding: 15px 15px;
 }

 .nav-pills .nav-link.active,
 .nav-pills .show>.nav-link {
   color: #fff;
   background-color: #007bff;
 }

 .botoes {
   margin: 40px 0px 40px 0px;
 }

 .topo {
   background: url('../img/art-psei.png');
   width: 100%;
   height: 260px;
   background-size: cover;

 }

 .list-group>.active>a {
   color: #f4f4f4 !important;
 }

 .list-group>.list-group-item>a {
   display: block;
 }

 /* .form-control {

    border-radius: .50rem;
}

.custom-select {
    border-radius: .50rem;
} */

 .card img {
   margin: auto;
   display: block;

 }

 .bg-cinza {
   background-color: #cfcfcf !important;
 }

 .box-custom {
   border: 1px solid #007bff;
   border-top: none;
 }

 .box-psei {
   color: #fff;
   background: #007bff;
   font-weight: 600;
   display: block;

   position: relative;
 }

 .alerta {
   background-color: #FFFFE0;
   font-weight: 400 !important;
 }

 .alerta2 {
   background-color: #f0f7fd;
   font-weight: 400 !important;
 }

 .active-menu {
   background-color: #007bff;
   color: white !important;
 }

 @media screen and (max-width: 767px) {
   .topo {
     height: 92px;
   }

   .box-psei h1 {
     font-size: 1rem;
   }


 }

 /* Adicione este código ao final do seu custom.css */

 /* Garante que o body e o html ocupem 100% da altura da tela */
 html,
 body {
   height: 100%;
   margin: 0;
 }

 /* Transforma o body em um container flex que organiza os filhos em coluna */
 body {
   display: flex;
   flex-direction: column;
 }

 /* Esta é a regra principal:
  1. O container vai crescer para ocupar o espaço vertical disponível (flex: 1).
  2. Ele também se torna um container flex para poder centralizar seu conteúdo.
*/
 .container {
   flex: 1 0 auto;
   /* Faz o container crescer e encolher conforme necessário */
   display: flex;
   flex-direction: column;
   /* Organiza os filhos (.row) em coluna */
   justify-content: center;
   /* CENTRALIZA VERTICALMENTE o conteúdo (.row) */
 }