/*PALETA DE CORES VERDES:
   VERDE CLARO: #27FD65; 
   VERDE ESCURO: #214A2E
   VERDE MEIO TERMO: #25C256*/


body {
  /* background-color: #000000e8; */
  /* font-family: "Libre Franklin", Sans-serif; */
  color: white;
  /* text-align: justify; */
}

.raleway-500 {
  font-family: "Raleway", serif;
  /* font-family: "Libre Franklin", serif; */
  font-optical-sizing: auto;
  /* font-weight: 500; */
  font-style: normal;
}

.text-green-1 {
  color: #27FD65;
}

.text-green-2 {
  color: #25C256;
}

.text-green-3 {
  color: #214A2E;
}

.text-purple-1 {
  color: #BC7EFF
}

.text-purple-2 {
  color: #5F467B;
}

.text-yellow{
  color: #f1f148;
}
.text-border-black {
  text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black
}

.text-border-white {
  text-shadow: -1px 0 white, 0 1px white, 1px 0 white, 0 -1px white;
}

#imagem-inicial {
  width: -webkit-fill-available;
  /* width: 100%;
  height: max-content; */
  /* height: 500px; */
  background-image: url('../img/fundoBranco.png');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  display: flex;
  flex-direction: row;
  padding-top: 100px; /* 200px */
  padding-bottom: 100px;
}
#divImagemPc{
 /*  margin-top: 212px; */
}
#imagemPc{
  width: 100%; /*100vh 600px 100% */
}
#imagemNote{
  width: 800px; /*120vh 600px 100% */
}
#imagemForm{
  width: 500px; /*54vh 87vh 600px 100% */
}

.imagem-nosso-proposito {
  width: 100%;
  height: 660px;
  background-image: url('../img/formaturaKerigmaFlip.JPG');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* Media Query para telas pequenas */
@media (max-width: 768px) {
  #divImagemPc{
    display: flex;
    flex-direction: row;
    justify-content: center;
  }
  #imagemPc, #imagemNote, #imagemForm{
    width: 25vh; /*600px 100% */
  }

  .imagem-nosso-proposito {
    height: 400px;
    /* Ajusta a altura para telas menores */
  }
}

/* Media Query para telas muito pequenas */
@media (max-width: 480px) {
  #imagemPc, #imagemNote, #imagemForm {
    width: 10vh;
    /* Ajusta ainda mais a altura em dispositivos móveis */
  }

  .imagem-nosso-proposito {
    height: 300px;
    /* Ajusta ainda mais a altura em dispositivos móveis */
  }
}

#container-imagem-inicial {
  margin-left: 3%;
}
#texto-menor-imagem-inicial{
  color: #2D2D2D;
  font-size: 25px;
}

#container-imagem-inicial h1 span, #container-imagem-inicial p span, #sobreCursosTexto p span, #sobreCursosTexto h1 span, .columnUniMissao p span, #formularioParecidoJesusTexto h1 span, #formularioParecidoJesusTexto p span{
  display: block;
}

#texto-imagem-inicial {
  /* font-size: 3.4rem; */
  font-size: 53px;
  text-align: left;
  font-weight: bolder;
  width: 100%; /* 65% */ /* 35% */
  color: black;
  /* text-shadow: 3px 3px 3px rgba(0, 0, 0, 1); */
  /* font-weight: 600; */
  padding-top: 2%;
}

#container-botoes-inscricao{
  /* display: flex;
  gap: 25px; */
  margin-left: 200px;
}

.destaque-laranja{
  color: #5582c2; /* #FF6623 */
}

.buttonLaranja{
  background-color: #5582c2; /* #FF6623 */
  color: white;
  border: #5582c2; /* #FF6623 */
  border-radius: 15px;
  padding: 5px;
  padding-left: 20px;
  padding-right: 20px;
  font-size: 22px;
  width: max-content;
}

.buttonCinza{
  background-color: #A5A4A4;
  color: white;
  border: #A5A4A4;
  border-radius: 15px;
  padding: 5px;
  padding-left: 20px;
  padding-right: 20px;
  font-size: 22px;
  width: max-content;
}

#inscrevase{
  /* margin-top: 50px; */
  border-radius: 50px;
  background: #282828;
  padding-top: 10rem;
  box-shadow: 0px -5px 60px rgba(0, 0, 0, 1);
  position: relative;
}

#sobreCursos{
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  padding-bottom: 25px;
  gap: 2vh;
}
#sobreCursosTexto{
  /* width: 310px; */
}

#sobreCursosTexto h1{
  font-size: 48px;
}

#sobreCursosTexto p{
  font-size: 20px;
}

#cliqueNoCurso{
  display: flex;
  justify-content: center;
}

#nossosProfessores {
  /* width: 100%; */
  height: max-content;
  background-image: url('../img/fundoBranco.png');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  display: flex;
  flex-direction: column;
  padding-top: 50px;
  justify-content: center;
  align-items: center;
}

#nossosProfessores h1{
  font-size: 54px;
}

.professores {
  display: flex; /* Exibe as imagens lado a lado */
  justify-content: space-between; /* Espaço entre as imagens */
  gap: 20px; /* Espaçamento entre as imagens */
  padding-top: 20px;
}

.professorBox img {
  width: 170px;
    height: 350px; /*300px 100% */
    object-fit: cover;
    border-radius: 20px;
}

.professorBox {
  cursor: pointer;
  text-align: center; /* Centraliza o título abaixo da imagem */
}

.professorBox figcaption {
  /* margin-top: 10px;  *//* Espaço entre a imagem e o título */
  font-weight: bold; /* Deixa o título em negrito */
  color: #333; /* Cor do título */
  background-color: white;
  border-radius: 5px;
  /* width: 130px; */
  margin-left: 15px;
  margin-right: 15px;
  font-style: italic;
  font-size: 14px;
  position: relative; /* O título vai ficar posicionado em relação ao .imagem-container */
  bottom: 30px;
  
}

#uniMissao {
  background-color: #5582c2; /* #FF6623 */ /* Cor de fundo laranja */
  display: grid; /* Usando grid para as colunas */
  grid-template-columns: repeat(4, 0.1fr); /* repeat(4, 1fr) */ /* 4 colunas de igual largura */
  gap: 5%; /*75px 20px */ /* Espaçamento entre as colunas */
  /* padding: 20px; */ /* Padding para dar espaçamento interno */
  padding-top: 35px;
  /* padding-right: 30px;
  padding-left: 130px; */
  padding-bottom: 20px;
  color: white; /* Cor do texto geral é branca */
  justify-items: center;
  justify-content: center;
}

.columnUniMissao {
  display: flex;
  flex-direction: column; /* Alinha o texto verticalmente */
  justify-content: flex-start; /* Alinha o conteúdo no topo da coluna */
  text-align: left; /* Alinha o texto à esquerda */
  word-wrap: break-word; /* Quebra de texto quando necessário */
}

div.columnUniMissao:first-of-type{
  width: 300px;
}


.columnUniMissao :not(:first-child) {
  font-size: 20px;
}
.highlightBlack {
  color: black; /* Aplica a cor preta aos textos destacados */
  display: inline !important;
}
.highlightBolder {
   font-weight: bolder;
   font-size: 24px;
}

#formularioParecidoJesus{
  background-color: #F2F2F2;
  color: #181818;
  padding-top: 120px;
  padding-bottom: 100px;
}

#formularioParecidoJesus h1{
  font-size: 38px;
}

#formularioParecidoJesus h1:not(:first-child) {
  font-size: 30px;
}

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

.input-container {
  margin-top: 20px;
  padding-left: 10px;
  width: 350px;
  /* margin: 20px; */
  /* padding: 10px; */
  border-radius: 10px; 
  background-color: #B6B6B6; /* Cor de fundo */
  /* border: 1px solid #999; */
}

.input-field {
  
  width: 100%; /* Largura do campo */
  /* padding: 10px; */ /* Espaçamento interno */
  padding-left: 10px;
  padding-bottom: 10px;
  background-color: #B6B6B6; /* Cor de fundo */
  border: none;
  border-radius: 20px;
  font-size: 16px; /* Tamanho da fonte */
  color: #333; /* Cor do texto */
}

.input-field::placeholder {
  color: #666; /* Cor do texto do placeholder */
  font-style: italic; /* Estilo do texto do placeholder */
}

.input-field:focus {
  border: none;
  outline: none;
}

label {
  font-size: 14px;
  color: black;
  font-weight: bolder;
  margin-bottom: 5px;
  margin-left: 10px;
  padding-top: 10px;
  /* padding-left: 10px; */
  display: block; /* Faz o texto "Nome" ficar em linha própria */
}

#formularioParecidoJesusTexto .buttonLaranja{
  font-weight: bolder;
}

.container-nossa-equipe {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

#container-imagem-nosso-proposito {
  margin-left: 3.2%;
}

#texto-imagem-nosso-proposito-1 {
  font-size: 3.4rem;
  text-align: left;
  width: 33%;
  padding-top: 2%;
  font-weight: 600;
  text-shadow: 3px 3px 3px rgba(0, 0, 0, 1);
}

#texto-imagem-nosso-proposito-2 {
  text-align: left;
  width: 33%;
  padding-top: 25%;
  font-weight: 600;
  text-shadow: 3px 3px 3px rgba(0, 0, 0, 1);
}

/* Estilo da linha 1: imagem à esquerda, texto à direita */
.linha-1,
.linha-2 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}

.imagem,
.imagem-direita {
  flex: 1;
  min-width: 200px;
  height: auto;
  border-radius: 20px;
}

.texto {
  flex: 2;
  min-width: 250px;
  padding: 10px;
}

.texto h2 {
  color: #f1f148;
}

.texto p {
  font-size: 20px;
}

/* Responsividade: Alinhar imagem e texto em telas menores */
@media (max-width: 768px) {
  .linha-1,
  .linha-2 {
    flex-direction: column;
    align-items: flex-start;
  }

  .imagem,
  .imagem-direita {
    width: 100%;
    /* A imagem vai ocupar toda a largura disponível */
  }

  .texto {
    width: 100%;
    /* O texto ocupa toda a largura disponível */
  }

  #container-imagem-inicial p span, #sobreCursosTexto p span{
    display: contents;
  }
  #container-botoes-inscricao{
    /* display: flex;
    gap: 25px; */
    margin-left: 0%;
  }
}

footer {
  background-color: #282828;
  display: flex;
  flex-direction: row;
  justify-content: space-around; /* space-evenly */
}
footer .divRedesSociais{
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  margin-top: 70px; /* 150px */
}
footer .logosFooter{
  display: flex;
  flex-direction: column;
}

footer #copyright{
  display: flex;
  justify-content: center;
  padding-top: 55px;
}

footer #autores{
  font-size: 9px !important;
  display: flex;
  justify-content: flex-end;
  padding-top: 20px;
}
footer img.logoBranco{
  width: 50px;
  zoom: 8;
}

footer .redesSociais {
  padding: 10px;
  border-radius: 40px; 
  background-color: white;
  cursor: pointer;
  zoom: 0.7;
}

footer img{
  width: 30px;
  object-fit: cover;
  /* zoom: 0.5; */
}

footer .dadosFooter{
  display: flex;
  flex-direction: column;
  margin-top: 50px;
  margin-bottom: 50px;
  /* color: #BDBDBD; */
  font-size: 22px;
}

footer .dadosFooter a{
  color: #BDBDBD;
  text-decoration: none;
}

footer .dadosFooter a:hover{
  color: #BDBDBD;
  text-decoration: underline;
}


footer .dadosFooter h5{
  color: #5582c2; /* #FF6623 */
  font-size: 32px;
  font-weight: 800;
  padding-bottom: 22px;
}
footer .buttonLaranja, .modal-footer .buttonLaranja{
  padding-left: 15px;
  padding-right: 15px;
  border-radius: 10px;
  font-weight: bolder;
}
.container-card-curso{
  display: grid;
  grid-template-columns: 1fr 1fr; /* Duas colunas com tamanho igual */
  gap: 20px; /* Espaço entre as colunas */
}

.div-imagem-curso img {
  width: 100%; /* A imagem ocupa toda a largura da coluna */
  height: auto; /* Mantém a proporção da imagem */
}

.modal-title{
  text-transform: uppercase;
  font-weight: bolder;
}

.modal-content{
  width: 85%;
  background-color: #F2F2F2;
  color: black;
}

.btn:hover{
  background-color: #5582c2; /* #FF6623 */
}

/* Media Query para telas pequenas */
/* @media (min-width: 1025px) {
  #imagemPc, #imagemNote{
    width: 100vh;
  }
  #imagemForm{
    width: 500px;
  }
} */
@media (max-width: 1024px) {
  #imagem-inicial{
    display: flex;
    flex-direction: column;
    padding-top: 20px;
  }
  #divImagemPc{
    display: flex;
    flex-direction: row;
    justify-content: center;
  }
  #imagemPc, #imagemNote, #imagemForm{
    width: 100%;
  }
  /* #texto-imagem-inicial,
  #texto-imagem-nosso-proposito-1,
  #texto-imagem-nosso-proposito-2 {
    font-size: 2.5rem !important;
  }

  #texto-imagem-nosso-proposito-2 {
    width: 50% !important;
  } */
}

@media (max-width: 768px) {
  h1, h2{
    text-align: center;
  }
  #container-imagem-inicial{
    margin-left: 0%;
  }
  #imagem-inicial{
    display: flex;
    flex-direction: column;
    padding-top: 20px;
  }
  #sobreCursosTexto{
    margin: 20px;
  }
  .professores{
    display: grid;
  }
  #uniMissao{
    grid-template-columns: repeat(4, 1fr);
    gap: 0px;
    padding: 20px;
    align-items: center;
  }
  div.columnUniMissao:first-of-type{
    width: fit-content;
  }
  #sobreCursos{
    flex-direction: column;
    align-items: center;
  }
  .input-container{
    width: 100%;
  }
  footer{
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  footer .divRedesSociais{
    margin-top: 0px;
  }

  #formularioParecidoJesusTexto{
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 20px;
  }

  h1,h2,
  #texto-imagem-nosso-proposito-1,
  #texto-imagem-nosso-proposito-2 {
    font-size: 2rem !important;
    /* Reduz o tamanho da fonte em telas menores */
  }
  p{
    font-size: 1rem !important;
  }

  #texto-imagem-nosso-proposito-2 {
    width: 80% !important;
  }
}

/* Media Query para telas ainda menores, como celulares */
@media (max-width: 480px) {

  #uniMissao{
    /* grid-template-columns: repeat(4, 1fr);
    gap: 0px; */
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  #texto-imagem-inicial,
  #texto-imagem-nosso-proposito-1,
  #texto-imagem-nosso-proposito-2 {
    font-size: 1.5rem !important;
    /* Fonte ainda menor em telas muito pequenas */
  }

  #texto-imagem-nosso-proposito-2 {
    width: 80% !important;
  }
}