/* Gerais */
  body {
    font-family: 'Roboto', sans-serif;
    background-color: #FF9A02;
    padding-top: 0;
    margin: 0;
  }

  .pages {
    background-color: rgba(255, 196, 0, 0.849);
  }

  a {
    outline: none;
  }

  #sectioncardmobile, #section12c, .sejatekscell,#secsob1c, #secsob2c, #secsob3c, #secformc, #seclin1c{
    display: none;
  }

  /*
  main {
    margin-top: 60px;
  }*/

  .row {
    margin: 0;
  }

  .container {
    padding: 70px 0;
  }

  p, li {
    color: #444;
    font-size: 14px;
  }

  /* paginas por fora - Contato */

  #secform {
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: space-between;
    text-align: start;
    background-size: cover; /* Cobre toda a área, sem distorcer */
    background-position: center;
    background-repeat: no-repeat;
    color: white;
  }

  .logocon {
    height: 200px;
    margin-left: 60px;
  }

  .form {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    background-color: #FFF;
    border-radius: 10px;
    height: 500px;
    width: 680px;
    color: #FF9A02;
    font-family: 'Roboto', sans-serif;
    margin-right: 120px;
    margin-top: 50px;
  }

  #name {
    width: 500px;
    height: 30px;
    border-radius: 10px;
    border: 1px solid #FF9A02;
    padding-left: 10px;
  }

  #email {
    width: 500px;
    height: 30px;
    border-radius: 10px;
    border: 1px solid #FF9A02;
    padding-left: 10px;
  }

  #mensagem {
    width: 500px;
    height: 100px;
    border-radius: 10px;
    border: 1px solid #FF9A02;
    padding-left: 10px;
  }

  .enviar {
    align-items: center; /* Alinha a imagem verticalmente no centro do botão */
    justify-content: center; /* Alinha a imagem horizontalmente no centro do botão */
    width: 110px; /* Ajuste o tamanho do botão */
    height: 40px; /* Ajuste o tamanho do botão */
    padding: 0; /* Remove o padding padrão do botão */
    color: #FF9A02;
    margin-top: 10px;
    border-radius: 20px;
    border: 1px solid #FF9A02;
    background-color: transparent;
  }

  .enviar:hover {
    background-color: #FF9A02;
    color: #FFF;
  }

  .enviar:focus {
    outline: none; /* Remove o contorno */
  }

  label {
    font-size: 24px;
    display: flex;
    align-items: center;
  }

  form, input, textarea, button {
    font-family: 'Roboto', sans-serif;
  }

  .feedback-message {
    padding: 10px;
    border-radius: 10px;
    margin-top: 10px;
    font-weight: bold;
    display: flex;
    align-items: center;
}

  .feedback-success {
      background-color: #d4edda;
      color: #155724;
      border: 1px solid #c3e6cb;
  }

  .feedback-error {
      background-color: #f8d7da;
      color: #721c24;
      border: 1px solid #f5c6cb;
  }

  /* paginas por fora - API */

  #secapi1 {
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background-size: cover; /* Cobre toda a área, sem distorcer */
    background-position: center;
    background-repeat: no-repeat;
    color: white;
  }

  .containerapi {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* Divide em 3 colunas iguais */
    gap: 20px; /* Espaço entre as colunas */
    margin-left: 180px;
  }

  .boxxa {
    text-align: center;
    padding: 20px;
    border-radius: 8px;
    width: 250px;
    height: 240px;
    color: #FF9A02;
  }

  .boxxa h2 {
    margin-top: 20px;
  }

  .boxxa p {
    color: #FF9A02;
  }

  .boxp1 {
    background-color: #fff;
  }

  .boxp2 {
    background-color: #fff;
  }

  .boxp3 {
    background-color: #fff;
  }

  .boxp4 {
    background-color: #fff;
  }

  /* paginas por fora - Boletos */

  #secbol1 {
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background-size: cover; /* Cobre toda a área, sem distorcer */
    background-position: center;
    background-repeat: no-repeat;
    color: white;
  }

  /* paginas por fora - Links de pagamento */

  .fundo2{
    background-image: url('/img/fundo2.png');
    background-size: cover; /* Cobre toda a área, sem distorcer */
    background-position: center;
    background-repeat: no-repeat;
  }

  #seclin1 {
    display: flex;
    height: 100vh;
    align-items: center;
    justify-content: center;
    background-size: cover; /* Cobre toda a área, sem distorcer */
    background-position: center;
    background-repeat: no-repeat;
    color: white;
  }

  .linkpay1 {
    margin-top: 60px;
    margin-left: 60px;
  }

  #seclin2 {
    display: flex;
    height: 100vh;
    align-items: center;
    justify-content: center;
    background-size: cover; /* Cobre toda a área, sem distorcer */
    background-position: center;
    background-repeat: no-repeat;
    color: white;
  }

  .listalin {
    list-style-type: decimal; /* Estilo dos marcadores (disc, circle, square ou none) */
    padding-left: 20px; /* Espaçamento do lado esquerdo */
    font-size: 16px; /* Tamanho do texto */

  }

  .listali {
    margin-bottom: 10px; /* Espaçamento entre os itens */
    color: #fff;
    font-size: 16px;
  }

  .linkpay2 {
    margin-top: 60px;
    margin-right: 60px;
  }

  #seclin3 {
    display: flex;
    height: 100vh;
    align-items: center;
    justify-content: center;
    background-size: cover; /* Cobre toda a área, sem distorcer */
    background-position: center;
    background-repeat: no-repeat;
    color: white;
  }

  .containerlin {
    display: grid;
    grid-template-columns: repeat(4, 1fr); /* Divide em 4 colunas iguais */
    gap: 20px; /* Espaço entre as colunas */
    margin-left: 140px;
  }

  .text3 {
    width: 55%; /* Define a largura */
    text-align: center;
  }
  
  .text3 h2 {
    color: #fff; /* Exemplo de cor do título */

  }

  .text3 p {
    line-height: 1.6; /* Melhor leitura */
    font-size: 16px;
    color: #fff;
  }

  .link3 {
    margin-top: 60px;
    margin-left: 60px;
    margin-left: 300px;
  }

  .boxx {
    text-align: center;
    padding: 20px;
    border-radius: 8px;
    width: 240px;
    height: 240px;
    color: #FF9A02;
  }

  .boxx h2 {
    margin-top: 30px;
  }

  .boxx p {
    color: #FF9A02;
  }

  .boxlin1 {
    background-color: #fff;
  }

  .boxlin2 {
    background-color: #fff;
  }

  .boxlin3 {
    background-color: #fff;
  }

  .boxlin4 {
    background-color: #fff;
  }




  /* paginas por fora - Maquininhas */

  #secmaq1 {
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background-size: cover; /* Cobre toda a área, sem distorcer */
    background-position: center;
    background-repeat: no-repeat;
    color: white;
  }

  .containermaq {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* Divide em 3 colunas iguais */
    gap: 20px; /* Espaço entre as colunas */
    margin-left: 140px;
  }

  .boxxaa {
    text-align: center;
    padding: 20px;
    border-radius: 8px;
    width: 290px;
    height: 240px;
    color: #FF9A02;
  }

  .boxxaa h2 {
    margin-top: 20px;
  }

  .boxxaa p {
    color: #FF9A02;
  }

  /* paginas por fora - Pix */

  #secpix1 {
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background-size: cover; /* Cobre toda a área, sem distorcer */
    background-position: center;
    background-repeat: no-repeat;
    color: white;
  }

  /* paginas por fora - Split de pagamento */

  #secspli1 {
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background-size: cover; /* Cobre toda a área, sem distorcer */
    background-position: center;
    background-repeat: no-repeat;
    color: white;
  }

  /* paginas por fora - Sobre nós */

  #fundo1{
    background-image: url('/img/fundo2.png');
    background-size: cover; /* Cobre toda a área, sem distorcer */
    background-position: center;
    background-repeat: no-repeat;
  }

  #secsob1 {
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background-size: cover; /* Cobre toda a área, sem distorcer */
    background-position: center;
    background-repeat: no-repeat;
    color: #fff;
  }

  .introsob {
    color: #FFF;
    display: flex;
    margin-top: 30px;
  }

  .textsobi{
    margin-top: 80px;
  }

  .format {
    margin-right: 220px;
    color: #fff;
    font-size: 17px;
  }

  .hformat {
    margin-top: -180px;
  }

  #imagemsobi {
    height: 500px;
  }

  .containersob2 {
    display: flex;
    align-items: flex-start; /* Alinha os elementos no topo */
    margin-left: 80px;
  }
  
  .images {
    display: flex;
    flex-direction: column;
    flex: 1; /* Ocupa o espaço restante */
  }

  .quadrosob1{
    height: 480px;
  }
  
  .text {
    width: 40%; /* Define a largura */
  }
  
  .text h2 {
    color: #fff; /* Exemplo de cor do título */
  }
  
  .text p {
    line-height: 1.6; /* Melhor leitura */
    font-size: 16px;
    color: #fff;
    text-align: justify;
  }

  #secsob3 {
    height: 100vh;
    background-size: cover; /* Cobre toda a área, sem distorcer */
    background-position: center;
    background-repeat: no-repeat;
    color: #fff;
  }
  
  .secsob3info{
    margin-top: 30px;
    text-align: center;
  }

  .secsob3info p{
    color: #fff;
  }

  .containersob3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* Divide em 3 colunas iguais */
    gap: 20px; /* Espaço entre as colunas */
    margin-left: 180px;
  }
  
  .box {
    text-align: center;
    padding: 20px;
    border-radius: 8px;
    color: #fff;
    width: 220px;
    height: 320px;
    margin-top: -40px;
  }

  .box1 {
    background-image: url('/img/missão.png');
    background-size: cover; /* Cobre toda a área, sem distorcer */
    background-position: center;
    background-repeat: no-repeat;
  }

  .box2 {
    background-image: url('/img/visão.png');
    background-size: cover; /* Cobre toda a área, sem distorcer */
    background-position: center;
    background-repeat: no-repeat;
  }

  .box3 {
    background-image: url('/img/valores.png');
    background-size: cover; /* Cobre toda a área, sem distorcer */
    background-position: center;
    background-repeat: no-repeat;
  }

  .titcom {
    margin-top: 80px;
  }

  .box p {
    color: #fff;

  }

  .pformat {
    font-size: 16px;
  }

  .pformate {
    font-size: 15px;
  }








  /* Estilos dos links do menu*/
  .nav-item {
    color: white; /* Cor dos links, altere conforme necessário */
  }
  .nav-item:hover {
    color: #ffa500; /* Cor do texto do link ao passar o mouse, altere conforme necessário */
  }
  .nav-item:focus {
    color: #ffa500; /* Cor do texto do link quando está em foco, altere conforme necessário */
  }
  .dropdown-toggle {
    color: white; /* Cor dos links, altere conforme necessário */
  }
  .dropdown-toggle:hover {
    color: #ffa500; /* Cor do texto do link ao passar o mouse, altere conforme necessário */
  }
  .dropdown-toggle:focus {
    color: #ffa500; /* Cor do texto do link quando está em foco, altere conforme necessário */
  }
  .dropdown-item {
    color: white; /* Cor dos links, altere conforme necessário */
  }
  .dropdown-item:hover {
    color: #ffa500; /* Cor do texto do link ao passar o mouse, altere conforme necessário */
  }
  .dropdown-menu {
    background-color: rgba(0, 0, 0, 0.5); /* Cor de fundo preta com 50% de opacidade */
    border: none; /* Remove a borda padrão, opcional */
  }
  .dropdown-item {
    background-color: transparent; /* Remove o fundo azul */
  }
  .dropdown-item:focus {
    color: #ffa500;
  }
  .dropdown-item:hover,
  .dropdown-item:focus {
    background-color: rgba(0, 0, 0, 0.1); /* Adiciona um fundo sutil ao passar o mouse, opcional */
  }
  .dropdown-menu {
    display: none; /* Inicialmente escondido */
  }
  .dropdown:hover .dropdown-menu {
    display: block; /* Mostra ao passar o mouse */
  }
  /* Remove o fundo azul e o contorno quando o link do dropdown está ativo ou em foco */
  .nav-link.dropdown-toggle:focus,
  .nav-link.dropdown-toggle:active {
    background-color: transparent !important; /* Torna o fundo transparente */
    outline: none; /* Remove o contorno */
  }





  /* Estilos dos links do corpo*/
  .solinks {
    color: #ffa500;
  }
  .solinks:hover {
    color:#ffa500;
  }
  .teamlinks {
    color: #ffa500;
  }
  .teamlinks:hover {
    color: #ffa500;
  }


  /* Barra de navegação */
  #nav-container {
    padding: 0; /* Remove o padding do container */
    padding-top: 0;
    padding-bottom: 0;
    transition: top 0.3s; /* Adiciona uma transição suave para o movimento do cabeçalho, ver depois */
  }
  .navbar {
    padding: 0; /* Remove o padding da navbar */
    font-size: 14px; /* Reduz o tamanho da fonte */
    height: 60px; /* Define a altura da navbar */
    background-color: rgba(0, 0, 0, 0);
    transition: background-color 0.3s; /* Suaviza a transição */
    transition: top 0.3s;
    z-index: 1000;
  }

  .hidden {
    top: -100px; /* Ajuste conforme necessário */
  }

  .navbar.scrolled {
    background-color: rgba(0, 0, 0, 0.8); /* Cor de fundo ao rolar */
  }

  #nav-container {
    position: fixed; /* Certifique-se de que o nav-container é fixo */
    top: 0;
    width: 100%;
    transition: top 0.3s; /* Transição suave */
    z-index: 999; /* Certifique-se de que está acima de outros elementos */
  }

  .navbar-nav .nav-item {
    margin-left: 10px; /* Espaço entre os itens da navbar */
    margin-right: 10px;
  }
  .navbar-nav .nav-link {
    padding: 0 10px; /* Ajusta o padding dos links */
    display: flex; /* Alinha o texto e a imagem verticalmente */
    align-items: center;
  }
  .logo {
    height: 60px; /* Ajusta a altura do logo */
    width: auto; /* Mantém a proporção do logo */
  }
  #logon, #user {
    padding: 5px 10px; /* Ajusta o padding dos botões */
  }
  .navbar-toggler {
    border: none; /* Remove a borda do botão do menu */
  }

  header {
    background-color: rgba(255, 255, 255, 0);
  }

  .navbar-brand {
    padding: 0;
    color: #FFF;
  }

  .navbar-brand:hover {
    color: #FFF;
  }

  #navbar-links a {
    color: #FFF;
  }

  .navbar-expand-lg {
    padding: 1rem .8rem;
  }

  .navbar-nav {
    display: flex;
    align-items: center; /* Alinha os botões verticalmente */
  }

  .navbar-nav a {
    margin-right: 10px; /* Espaço entre os botões */
    margin-left: 10px; /* Espaço entre os itens da navbar */
  }

  #user {
    align-items: center; /* Alinha a imagem verticalmente no centro do botão */
    justify-content: center; /* Alinha a imagem horizontalmente no centro do botão */
    width: 110px; /* Ajuste o tamanho do botão */
    height: 40px; /* Ajuste o tamanho do botão */
    padding: 0; /* Remove o padding padrão do botão */
    color: white;
    border: 1px solid #FFF;
    border-radius: 7px;
  }

  #user:hover{
    background-color: white;
    color: #ffa500;
  }

  .white-section .navbar,
  .white-section .nav-item,
  .white-section .nav-link,
  .white-section #user {
    color:#ffa500;
  }

  .white-section #user {
    border: 1px solid #ffa500;
  }

  .white-section #user:hover {
    background-color: #ffa500;
    color: #FFF;
  }



  .navbar-nav a:last-child {
    margin-right: 0; /* Remove o espaço do último botão, se necessário */
  }

  .nav-item.active {
    border-bottom: 3px solid #FFF;
  }

  #logon {
    width: 110px;
    height: 40px;
    font-size: 100%;
  }



/*teste fixed-top*/

.titleapi {
    margin-top: 55px;
    margin-left: 20px;
    margin-bottom: 20%;
  }

/* 1° pagina principal */

#section1 {
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: url('/img/mainpag.png');
  background-size: cover; /* Cobre toda a área, sem distorcer */
  background-position: center;
  background-repeat: no-repeat;
  color: white;
}

.slogan {
    color: #FFF;
    font-size: 70px;
    /* margin-top: 140px;
    margin-left: 120px;
    margin-bottom: -165px; */
    font-weight: bold;
}

/* .mainimg {
    display: flex;
    justify-content: end;
    margin-right: 60px;
    margin-top: -581px;
}

#mainwoman {
    height: 585px;
    width: auto;
    margin-right: 50px;
}

.mainretangulo {
    display: flex;
    justify-content: end;
}

#retangulo1 {
    height: 400px;
    width: auto;
    margin-top: -109px;
    margin-right: 263px;
}

#retangulo2 {
    height: 290px;
    width: auto;
    margin-top: -230px;
    margin-right: 100px;
} */

#opencont {
  height: 50px;
  width: 180px;
  background-color: #FF9A02;
  color: #fff;
  font-weight: bold;
  border-radius: 20px;
}

#opencont:hover {
  background-color: #fff;
  color: #FF9A02;
}

.slogancell {
  display: none;
}
.pcell {
  display: none;
}
.slides1 {
  display: none;
}
#maquininhacell {
  display: none;
}


/* 2° pagina */



#about-area {
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: url('/img/slide2of\ \(2\).png');
  background-size: cover; /* Cobre toda a área, sem distorcer */
  background-position: center;
  background-repeat: no-repeat;
  color: white;
}

.slogan2 {
  color: #FFF;
  font-size: 70px;


}

.infmore {
  align-items: center; /* Alinha a imagem verticalmente no centro do botão */
  justify-content: center; /* Alinha a imagem horizontalmente no centro do botão */
  width: 110px; /* Ajuste o tamanho do botão */
  height: 40px; /* Ajuste o tamanho do botão */
  padding: 0; /* Remove o padding padrão do botão */
  color: white;
  margin-top: 10px;
  border-radius: 20px;
  border: 1px solid #FFF;
}

.infmore:hover {
    background-color: white;
    color: #FF9A02;
}


/* 3° pagina */

#lpay-area {
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: url('/img/womantwo.png');
  background-size: cover; /* Cobre toda a área, sem distorcer */
  background-position: center;
  background-repeat: no-repeat;
  color: white;
}

.slogan3 {
  color: #FFF;
  font-size: 73px;
}

.infolpay {
  display: flex;
  justify-content: end;
  text-align: end;
  align-items: center;
}

/* .imgwoman {
  display: flex;
  justify-content: start;
  margin-top: -534px;
  margin-left: -30px;
}

#womanimg {
  height: 580px;
  width: auto;
}

.mainretan {
  display: flex;
  justify-content: start;
}

#retan2 {
  height: 290px;
  width: auto;
  margin-top: 270px;
  margin-left: -70px;

} */

/* 4° pagina */

#boletos-area {
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: url('/img/slide4.png');
  background-size: cover; /* Cobre toda a área, sem distorcer */
  background-position: center;
  background-repeat: no-repeat;
  color: white;
}

.slogan4 {
  color: #FFF;
  font-size: 73px;
}

/* 5° pagina */

#split-area {
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: url('/img/split.png');
  background-size: cover; /* Cobre toda a área, sem distorcer */
  background-position: center;
  background-repeat: no-repeat;
  color: #FFF;
}

.slogan5 {
  color: #FFF;
  font-size: 70px;
}

.slide5 {
  display: flex;
  justify-content: end;
  text-align: end;
}

#split-buttom {
  align-items: center; /* Alinha a imagem verticalmente no centro do botão */
  justify-content: center; /* Alinha a imagem horizontalmente no centro do botão */
  width: 110px; /* Ajuste o tamanho do botão */
  height: 40px; /* Ajuste o tamanho do botão */
  padding: 0; /* Remove o padding padrão do botão */
  color: white;
  margin-top: 10px;
  border-radius: 20px;
  border: 1px solid #FFF;
}

#split-buttom:hover {
  background-color: white;
  color: #FF9A02;
}

/* 6° pagina */

#pix-area {
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: url('/img/slide6.png');
  background-size: cover; /* Cobre toda a área, sem distorcer */
  background-position: center;
  background-repeat: no-repeat;
  color: white;
}

.slogan6 {
  color: #FFF;
  font-size: 73px;
}

/* 7° pagina */

#maquin-area {
  height: 100vh;
  display: flex;
  align-items: center;
  background-image: url('/img/FOTO.DA.DIREITA.COM.FORMA.BRANCA.VERSAO.2.\(1\).png');
  background-size: cover; /* Cobre toda a área, sem distorcer */
  background-position: center;
  background-repeat: no-repeat;
  color: white;

}


.slogan7 {
  color: #FFF;
  font-size: 73px;
}

.slide7 {
  display: flex;
  justify-content: end;
  text-align: end;
}

#maq {
  display: flex;
  justify-content: start;
  height: 500px;
  width: auto;
  margin-right: 150px;
  margin-left: -500px;

}



/* 8° pagina */

#API-area {
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: url('/img/slide8.png');
  background-size: cover; /* Cobre toda a área, sem distorcer */
  background-position: center;
  background-repeat: no-repeat;
  color: white;
}

.slogan8 {
  color: #FFF;
  font-size: 73px;
}

/* 9° pagina */

#Sup-area {
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: url('/img/Design\ sem\ nome\ \(14\)\ \(1\).png');
  background-size: cover; /* Cobre toda a área, sem distorcer */
  background-position: center;
  background-repeat: no-repeat;
  color: #FFF;
}

.slogan9 {
  color: #FFF;
  font-size: 73px;
  /* margin-top: 130px;*/
}

#Sup-buttom {
  align-items: center; /* Alinha a imagem verticalmente no centro do botão */
  justify-content: center; /* Alinha a imagem horizontalmente no centro do botão */
  width: 110px; /* Ajuste o tamanho do botão */
  height: 40px; /* Ajuste o tamanho do botão */
  padding: 0; /* Remove o padding padrão do botão */
  color: white;
  margin-top: 10px;
  border-radius: 20px;
  border: 1px solid #FFF;
}

#Sup-buttom:hover {
  color: #FF9A02;
  background-color: #FFF;
}

.supwoman {
  display: flex;
  justify-content: end;
  margin-top: -400px;
  margin-right: -70px;
}

#womansup {
  height: 490px;
  width: auto;
}

/* 10° pagina */

#team-area {
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: url('/img/slide10.png');
  background-size: cover; /* Cobre toda a área, sem distorcer */
  background-position: center;
  background-repeat: no-repeat;
  color: white;
}

.teamlinks {
  color: #ffa500;
}
.teamlinks:hover {
  color: #ffa500;
}

.slogan10 {
  text-align: center;
  margin-bottom: 30px;
  font-size: 70px;
  color: #FF9A02;
}

.card-body {
  text-align: center;
  padding: 20px; /* Ajusta o padding interno do card-body */
}

.card {
  border-radius: 10px; /* Bordas arredondadas */
  overflow: hidden; /* Garante que a borda arredondada não seja quebrada pelo conteúdo */
  transition: transform 0.3s ease, box-shadow 0.3s ease; /* Adiciona uma transição suave para efeitos de hover */
}
.card img {
  border-bottom: 1px solid #ddd; /* Adiciona uma borda fina abaixo da imagem */
}

.card-title {
  font-size: 1.25rem; /* Ajusta o tamanho do título */
  font-weight: bold; /* Define o peso da fonte como negrito */
}
.card-text {
  color: #ffa500; /* Cor do texto do card */
}
.card:hover {
  transform: translateY(-5px); /* Leve elevação no hover */
  box-shadow: 0 4px 8px rgba(0,0,0,0.2); /* Adiciona uma sombra sutil ao card no hover */
}
.row {
  display: flex;
  justify-content: center; /* Centraliza os cartões horizontalmente */
  flex-wrap: wrap; /* Permite que os cartões se movam para a linha seguinte, se necessário */
}
.col-md-3 {
  margin-bottom: -10px; /* Espaço entre os cartões na linha */
}
#autotekslogo {
  height: 222px;
}

/* 11° pagina */

#section11 {
  background-color: black;
  height: 60vh; /* Mantém a altura da seção */
  display: flex;
  flex-direction: column; /* Alinha itens em coluna */
  padding-top: 0;
  margin-top: 0;
  justify-content: flex-start; /* Alinha o conteúdo no topo */
}

#logo {
  height: 80px; /* Ajusta a altura do logo */
  width: auto; /* Mantém a proporção do logo */
}

#sloganf {
  color: #ddd;
}

.iconsteks {
  height: 40px; /* Ajusta a altura do ícone */
  width: auto; /* Mantém a proporção do ícone */
  margin-top: 22px;
  margin-right: 10px;
}

#ttx {
  border: solid 1px #ddd;
  border-radius: 35px;
}

.foot1 {
  margin-top: 0; /* Removido para evitar sobreposição */
  margin-top: 30px;
}

#icons {
  margin-top: 0; /* Removido para evitar sobreposição */
  margin-top: 30px;
}

.linksf {
  color: #ddd;
}

.linksf:hover {
  color: #ffa500;
  text-decoration: none; /* Mantém o sublinhado removido */
}

.titlef {
  color: #ddd;
  font-size: 17px;
  font-weight: bold;
}

.columf {
  margin-bottom: 20px; /* Aumenta o espaçamento entre as colunas */
  margin-right: 270px; /* Ajusta o espaçamento lateral */
  margin-top: -10px;
}

#thrcolum {
  margin-right: -22px;
  display: flex;
  align-items: end;
  text-align: end;
}


.paraf {
  color: #ddd;
}

/* Estilização das colunas */
.row > .col-md-4 {
  width: 100vh;

}

/* Responsividade geral */
@media (max-width: 1200px) {
  .slogan {
    font-size: 60px; /* Ajusta o tamanho da fonte em telas menores */
    margin-top: 100px;
    margin-left: 60px;
  }
  #mainwoman {
    height: 500px;
    margin-right: 30px;
  }
  #retangulo1, #retangulo2 {
    height: 300px;
    margin-right: 150px;
  }
  #opencont {
    margin-top: 80px;
    margin-left: -230px;
    height: 45px;
    width: 150px;
  }
}

@media (max-width: 768px) {
  #section1 {
    background-color: #FF9A02;
    background-image: none;
  }
  
  .slogan, .slogan2, .slogan4, .slogan6, .slogan8, .slogan9 {
    font-size: 100x; /* Reduz ainda mais o tamanho */
    margin-left: 30px;
  }
  h5 {
    margin-left: 30px;
  }
  .infmore {
    margin-left: 30px;
  }
  #mainwoman {
    display: none;
    height: 400px;
    margin-right: 15px;
    margin-bottom: 100px;
  }
  .mainslogan {
    display: flex;
    flex-direction: column;
    align-items: start;
    margin: 0;
    margin-bottom: 400px;
  }
  .mainimg {
    flex-direction: column;
    align-items: end;
    margin: 0;
  }
  .mainretangulo {
    flex-direction: column;
    align-items: end;
    margin: 0;
  }

  #retangulo1, #retangulo2 {
    display: none;
    height: 200px;
    margin-right: 0;
    margin-bottom: -300px;
  }
  #opencont {
    margin-top: -350px;
    margin-left: 30px;
    width: 170px;
    height: 50px;
    font-size: 17px;
    font-weight: bold;
  }
}

@media (max-width: 576px) {
  body {
    background-image: url('/img/fundocell.png');
    background-repeat: repeat;
    background-size: auto;
  }
  .card-container {
    max-width: 18rem;
    margin: 20px;
  }
  .sejatekscell {
    display: block;
  }
  .cardbody {
    height: 180px;
  }
  .carousel-controls {
    display: flex;
    justify-content: center;
    gap: 10px;
  
  }
  .carousel-controls button {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #FFF;
    cursor: pointer;
  }
  .carousel-controls button:hover {
    color: #ddd;
  }
  #section1 {
    height: 100vh;
    display: flex;
    align-items: start;
  }
  .slogan {
    display: none;
  }
  .slogancell {
    display: block;
    font-size: 30px;
    margin-bottom: 10px;
    margin-left: 35px;
    margin-top: 40px;
  }
  .pcell {
    display: block;
    color: #fff;
    margin-bottom: 35px;
    margin-left: 35px;
    font-size: 15px;
  }
  .iconscell{
    height: 30px;
    margin-left: 20px;
    margin-top: 20px;
  }
  .card-title, .card-text{
    color: black;
    text-align: start;
  }
  .card-title {
    margin-left: 0;
  }
  #opencont {
    background-color: #fff;
    color: #FF9A02;
    height: 35px;
    width: 140px;
    font-size: 14px;
    border-radius: 10px;
    margin-left: 35px;
    margin-top: -20px;
  }
  .slides1{
    display: block;
    margin-top: 60px;
  }
  .slider{
    background-color: transparent;
    border: transparent;
  }
  #sectioncardmobile {
    display: block;
  }
  #maquininhacell {
    display: block;
    height: 400px;
    margin-top: -40px;
  }
  .slogancell2{
    display: block;
    color: #fff;
    font-size: 30px;
    margin-bottom: 10px;
    margin-left: 25px;
    margin-top: 100px;
  }
  .pcell2 {
    display: block;
    color: #fff;
    margin-left: 25px;
    font-size: 15px;
  }
  #about-area, #lpay-area, #boletos-area, #maquin-area, #pix-area, #split-area, #Sup-area, #API-area, #section11, #secsob1, #secsob2, .text, #secsob3, #secform{
    display: none;
  }
  #team-area {
    background-image: none;
    height: 230vh;
  }
  .slogan10 {
    font-size: 30px;
    color: #fff;
   
  }
  .card-team {
    height: 30px;
    margin-bottom: 400px;
  }
  .card-img-top {
    height: 300px;
  }
  #section11 {
    height: 300vh;
  }
  #autotekslogo {
    height: 300px;
  }
  #section12c {
    display: flex;
    background-color: black;
    color: #fff;
    text-align: left;
  }
  .titlefcell {
    margin-left: 0;
    font-size: 16px;
  }
  .parafcell {
    color: #fff;
    font-size: 14px;
    font-weight: lighter;
  }
  .iconsteksc {
    height: 25px; /* Ajusta a altura do ícone */
    width: auto; /* Mantém a proporção do ícone */
    margin-top: -60px;
    margin-right: 7px;
  }
  #fircolumcell{
    margin-bottom: 0;
    margin-top: 40px;
  }
  .linksfcell {
    color: #fff;
    font-size: 14px;
    font-weight: lighter;
  }
  .linksfcell:hover {
    color: #ffa500;
    text-decoration: none; /* Mantém o sublinhado removido */
  }
  .columfcell {
    margin-bottom: 0;
  }
  #seccolumc{
    margin-top: -38px;
  }
  #thrcolumc {
    margin-top: -20px;
  }
  #logoc {
    height: 50px;
    margin-left: -20px;
    margin-top: -10px;
  }
  .parafcells {
    margin-top: 10px;
    color: #fff;
    font-size: 15px;
    font-weight: lighter;
  }
  .autocell {
    margin-bottom: 0px;
    font-size: 14px;
  }
  #secsob1c {
    display: block;
  }
  #imagemsobic {
    height: 300px;
    margin-top: 80px;
  }
  .tittlec {
    color: #fff;
    margin-left: 15px;
  }
  .formatc {
    color: #fff;
    font-size: 14px;
    text-align: justify;
    margin: 15px;
  }
  .quadrosob1c {
    height: 300px;
  }
  .tittlec2 {
    color: #fff;
    margin-left: 15px;
    margin-bottom: 40px;
    margin-top: -180px;
  }
  #secsob2c {
    display: block;
  }
  #secsob3c {
    display: block;
  }
  .pformatc {
    color: #fff;
    font-size: 14px;
    text-align: justify;
    margin: 15px;
  }
  .hformatc {
    color: #fff;
    margin-left: 15px;
    margin-bottom: 30px;
    margin-top: -20px;
  }
  .box {
    text-align: center;
    color: #fff;
    width: 220px;
    height: 320px;
    margin-top: 30px;
    margin-left: -140px;
  }
  .box1{
    margin-top: -30px;
  }
  .titcomc {
    margin-top: 90px;
  }
  #secformc {
    display: block;
  }
  .form {
    height: 500px;
    width: 280px;
    margin-left: 30px;
    margin-top: 100px;
    margin-bottom: 40px;
    background-color: transparent;
    border: 2px solid #fff;
    color: #fff;
  }
  #name {
    width: 200px;
    background-color: transparent;
    border: 1px solid #fff;
  }
  #email {
    width: 200px;
    background-color: transparent;
    border: 1px solid #fff;
  }

  #mensagem {
    width: 200px;
    background-color: transparent;
    border: 1px solid #fff;
  }
  .enviar {
    color: #fff;
    border: 1px solid #fff;
    margin-top: 20px;
  }
  #feedb {
    margin-top: 15px;
  }


}


/* Responsividade para a navbar */
@media (max-width: 992px) {
  .navbar {
    padding: 0.5rem; /* Reduz o padding para telas menores */
  }
  .navbar-nav .nav-item {
    margin-left: 5px; /* Diminui o espaço entre os itens */
    margin-right: 5px;
  }
  .navbar-nav .nav-link {
    padding: 0 5px; /* Ajusta o padding dos links */
  }
  .logo {
    height: 50px; /* Reduz a altura do logo */
  }
  #user {
    width: 90px; /* Ajusta o tamanho do botão */
    height: 35px;
    font-size: 12px; /* Ajusta o tamanho da fonte */
  }
}

/* Ajustes para a responsividade */
.navbar-toggler {
  display: none; /* Inicialmente oculto */
  border: none;
  background-color: transparent;
}

.navbar-toggler-icon {
  background-image: url('/img/menu-de-hamburguer.png');
  display: flex;
  width: 40px;
  height: 40px;
  margin: 5px 0;
  transition: all 0.3s;
  border-radius: 10px;
}

.navbar-toggler:focus {
  outline: none; /* Remove o contorno */
  border-radius: 20px;
}

@media (max-width: 768px) {
  .logo {
    height: 70px;
  }
  .navbar-toggler {
    display: block; /* Exibe o botão hambúrguer em telas menores */
  }

  .navbar-collapse {
    display: none; /* Oculta os itens da navbar por padrão */
  }

  .navbar-collapse.show {
    display: block; /* Exibe os itens da navbar quando o menu é expandido */
    background-color: rgba(0, 0, 0, 0.8); /* Fundo da navbar no menu expandido */
    padding: 10px;
  }

  .navbar-nav {
    flex-direction: column; /* Alinha os links em coluna */
    width: 100%;
  }

  .navbar-nav .nav-item {
    margin: 10px 0; /* Espaço entre os itens */
  }
}

@media (max-width: 576px) {
  .navbar {
    font-size: 12px; /* Reduz ainda mais o tamanho da fonte */
  }
  
  .logo {
    height: 60px; /* Diminui a altura do logo */
  }
  #user {
    width: 80px;
    height: 30px;
    font-size: 10px;
  }
  
}

.navbar-toggler {
  border: none; /* Remove a borda padrão do botão */

}

.navbar-toggler-icon {
  background-color: #fff; /* Cor branca para o ícone */

}

@media (max-width: 992px) {
  .navbar-collapse {
    background-color: rgba(0, 0, 0, 0.5); /* Cor de fundo para o menu colapsado */
  }
}


