@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap");
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Nunito Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&display=swap');

:root{

  /* Sombras */
  --sombras: 2px 4px 20px 0px rgb(0 0 0 / 51%);

  /* Botão Hover */
  --botão-hover: #ff3e19;
  
  /* Fonte dos links */
  --links-font: normal 500 1.1rem 'Montserrat';
  
  /* Cor dos links */
  --links-font-color: #000;

  /* Cor do cabeçalho */
  --header-color: #22222200;

  /* Cor do hover nos itens do menu */

  /* Cor do rodapé  */
  --footer-color: #111111;

  /* Cor das fontes do rodapé */
  --footer-font-color: #FAF5F5;

  /* Cor da seção copyright */
  --copyright-color: #111111;

  /* Cor do fundo menu mobile */
  --menuMobile-color: #696969;
}

* { margin: 0; padding: 0; box-sizing: border-box; list-style: none; text-decoration: none;}
main { padding: 0 15px; max-width: 1300px; margin: auto; height: 100vh; display: flex; flex-direction: column; justify-content: center; position: relative;}
main .center { display: flex; background-color: rebeccapurple;}
main .container { max-width: 1355px; margin: 0; position: relative;}
body { background-color: #fff; margin: 0; height: 100vh; width: 100%;}

img { max-width: 100%; object-fit: scale-down; margin: -20px auto;}
canvas { position: absolute;}
section .container-main { text-align: center; display: flex; align-items: center; justify-content: center;}
section .container-main .box { max-width: fit-content; border-radius: 15px; background: #fefefe; box-shadow: 0 1px 2px rgba(0,0,0,0.07), 0 2px 4px rgba(0,0,0,0.07), 0 4px 8px rgba(0,0,0,0.07), 0 8px 16px rgba(0,0,0,0.07), 0 16px 32px rgba(0,0,0,0.07), 0 32px 64px rgba(0,0,0,0.07); padding: 20px; min-height:570px; display: flex; flex-direction: column; justify-content: space-around; text-align: center;}
section .container-main #obrigado { max-width: fit-content; border-radius: 15px; background: #fefefe; box-shadow: 0 1px 2px rgba(0,0,0,0.07), 0 2px 4px rgba(0,0,0,0.07), 0 4px 8px rgba(0,0,0,0.07), 0 8px 16px rgba(0,0,0,0.07), 0 16px 32px rgba(0,0,0,0.07), 0 32px 64px rgba(0,0,0,0.07); margin: 50px auto; padding: 15px 20px 40px 20px;}

strong { color: #ff3e19;}
.font1 { color: #1f1c1c; text-align: center; font-family: 'Nunito Sans'; font-size: 2.5rem; font-style: normal; font-weight: 600; line-height: normal;}
.font2 { color: #111; font-family: 'Nunito Sans'; font-size: 1rem; font-style: normal; font-weight: 300; line-height: 1.5rem; margin: 25px 40px 25px 40px;}
.font3 { letter-spacing: 0.0999rem; color: #615b5b; text-align: center; font-family: Inter; font-size: 0.8rem; font-style: normal; font-weight: 600; line-height: normal; margin: -20px 0 -40px 0;}
.font4 { color: #1f1c1c; text-align: center; font-family: Inter; font-size: 1.7rem; font-style: normal; font-weight: 600; line-height: 2.1rem; margin: -30px 30px 20px 30px;}
.font5 { color: #ff3e19; text-align: center; font-family: 'Nunito Sans'; font-size: 1.5rem; font-style: normal; font-weight: 700; line-height: 1.5rem; letter-spacing: 0.095rem; max-width: 510px; margin: 0 auto 10px auto;}
.font6 { color: #746e6e; text-align: center; font-family: 'Nunito Sans'; font-size: 0.7rem; font-style: normal; font-weight: 500; line-height: 0.8rem; letter-spacing: 0.095rem; max-width: 510px; margin: 0 auto 0 auto; display: block;}
.font7 { color: #322f2f; text-align: center; font-family: Inter; font-size: 0.985rem; font-style: normal; font-weight: 500; line-height: 1.5rem; letter-spacing: 0.095rem; max-width: 510px; display: inline-block; margin: 0px auto 20px auto;}
.font19{font-family: 'Nunito Sans';font-style: normal;font-weight: 600;font-size: 30px;line-height: 2rem;color: #111;}

/* logo */

.retangulo{background-color: #fff0; padding: 50px 20px 5px 50px; position: absolute; top: 20px; left: 20px; display: flex; align-items: center; gap: 10px;}
.gft{font-family: Nunito Sans; font-weight: 700; color: white; font-size: 2rem;}
.quadrado{background-color: white; width: 24px; height: 24px; display: flex;}



#obrigado .font19{font-family: 'Nunito Sans';font-style: normal;font-weight: 600;font-size: 30px;line-height: 2.5rem;color: #111;}
#obrigado .font1 { color: #1f1c1c; text-align: center; font-family: Inter; font-size: 2rem; font-style: normal; font-weight: 600; line-height: 3rem;}
#obrigado .font2 { color: #111; font-family: 'Nunito Sans'; font-size: 1rem; font-style: normal; font-weight: 300; line-height: 1.5rem; margin: 25px 40px 25px 40px;}
#obrigado .font3 { letter-spacing: 0.0999rem; color: #615b5b; text-align: center; font-family: Inter; font-size: 0.8rem; font-style: normal; font-weight: 600; line-height: normal; margin: -20px 0 10px 0;}
#obrigado .font4 { color: #1f1c1c; text-align: center; font-family: Inter; font-size: 1.7rem; font-style: normal; font-weight: 600; line-height: 2.1rem; margin: 0 auto 0 auto;}
#obrigado .font5 { color: #323030; text-align: center; font-family: Inter; font-size: 1rem; font-style: normal; font-weight: 500; line-height: 1.5rem; letter-spacing: 0.095rem; max-width: 510px; margin: 0;}
#obrigado .font6 { color: #746e6e; text-align: center; font-family: Inter; font-size: 0.6rem; font-style: normal; font-weight: 500; line-height: 0.8rem; letter-spacing: 0.095rem; max-width: 510px; margin: 15px auto -50px auto; display: inline-block;}
#obrigado-container img { margin: -40px auto -30px auto;}

form {display: flex; flex-direction: column; gap: 20px; max-width: 100%; margin: auto 10px;}
.input {max-width: 100%; padding: 10px; border-radius: 7px; border: 1px solid #E6E6E6; font-family: 'Nunito Sans'; font-style: normal; font-weight: 400; font-size: 15px; line-height: 22px; letter-spacing: 0.05em; color: #ADADAD;}
.input:focus{border: 1px solid #ff3e19; outline: none;}
.button {border: none; border-radius: 10px; background: #ff3e19; color: #ffff; text-align: center; font-family: Inter; font-size: .9rem; font-style: normal; font-weight: 600; line-height: normal; padding: 10px 20px; cursor: pointer; transition: background .5s, color .5s, border .5s; border: 1px solid #ff3e19; outline: none; width: max-content; margin: 10px auto 0px;}
.button:hover {background-color: transparent;color: #ff3e19;border: 1px solid #ff3e19;outline: none;}
.button:hover .fa-regular, .button:hover .fa-house{color: #ff3e19 !important;}
.button:hover .fa-solid{color: #ff3e19 !important; transform: translateX(5px);}
.fa-regular, .fa-house , .fa-solid{transition: .5s;}
a.button { display: block; margin: 40px 40px -20px 40px;}
#obrigado a.button { display: block; margin: 0px auto 0px;}
iframe { border-radius: 15px; margin: 25px auto 15px auto; max-width: 100%; max-height: 100%;}
#img-gabi { background-color: rgb(75, 75, 75); width: 390px; display: block; height: 560px; max-width: 600px; border-radius: 15px; background: url(../img/palestrante-grabi-fundadora-dehumanos.webp); background-repeat: no-repeat; background-position: center;}

.disabled{background: #3c3c3c;border: 1px solid #3c3c3c;}
.disabled:hover{background-color: transparent;color: #3c3c3c;border: 1px solid #3c3c3c;outline: none;}
.disabled:hover .fa-solid{color: #3c3c3c !important;}


.negrito1 { color: #ff3e19;}
.negrito2 { color: #095d2d;}

.socialFooter a{text-align: center;line-height: 33px;height: 35px;width: 35px;margin: 0 4px;font-size: 14px;color: #FFF;border-radius: 50%;border: 2px solid transparent;background: #f55a2a;transition: all 0.3s ease;}
.socialFooter{margin-top: 10px;display: flex;}
.socialFooter a:hover{color: #f55a2a;background-color: #fff;border-color: #f55a2a;}
.socialFooter{display: flex;margin: 0;justify-content: center;gap: 32px;align-items: center;}

.socialFooter .font19-1{ margin-top: 20px;}

@media (max-width: 1270px) { 
  main .container { padding: 15px 0;} 
  section .container-main .box { margin: 0;}
}

@media (max-width: 900px) { 
  section .container-main .box { margin: 0 auto;} 
  main .container { padding: 25px 0;} 
  #img-gabi { display: none;}
}

@media (max-width: 700px) { 
  .box { padding: 20px 10px;} 
  .font1 { font-size: 2rem;} 
  .font2 { font-size: .9rem; max-width: 600px;  margin: 20px auto} 
  .apagar-responsiv { display: none;} 
  .font19{font-size: 1.5rem;margin: 25px 0 0 0;}  
  section .container-main .box { padding: 5px;}
}

@media (max-width: 400px) { 
  main { top: inherit; justify-content: flex-start;} 
  #obrigado a.button {margin: 25px auto 0;} 
  section .container-main #obrigado { margin: 0 auto;} 
  #obrigado .font1 { font-size: 1.3rem;}
  .font19{ font-size: 1.7rem; line-height: 2rem;}
  .font1 { font-size: 1.9rem; } 
  .font2 { font-size: 0.8rem; max-width: 300px; line-height: 1.2rem; margin: 0 auto;} 
  .font3 { font-size: 0.7rem; letter-spacing: unset; line-height: 1.1rem;} 
  .font5 { font-size: .8rem; margin: -15px 0 -23px 0;}
  .font6 { margin: 15px 0 5px}
  .input { margin: 5px 0 -15px 0; font-size: 1rem; scale: .9;} 
  .button { margin: 0 auto 0; font-size: 1rem;}
  form { margin: 10px 10px 10px;}

  .box{transform: translateY(100px);}
}
