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

html {
  scroll-behavior: smooth;
}

body {
  font-family: "Helvetica Neue", "Roboto",-apple-system,"Segoe UI",sans-serif;
}


:root {
  --background-contato-height: 170px;
  --email-text-size: .8rem;
  --fs-1-15-responsive: .95rem;
  --fs-1-27-resonsive: 1.045rem;
  --fs-3-resonsive-size: 2.3rem;
  --h1-responsive-size: 1.9rem;
  --h2-responsive-size: 1.75rem;
  --h3-responsive-size: 1.6rem;
  --h5-responsive-size: .9rem;
  --h6-responsive-size: .8rem;
}

.landing, .landing2 {
  height: auto;
}

.btn-participe-de-um-curso {
  padding: 13px 36px;
}

.navbar-dark {
  background-color: #28282d;
  color: white;
}

.navbar-dark a {
  color: white;
}

.btn-funny {
  border-color: #a2a2a2 !important;
  border-radius: 15px 3px 3px 3px;
  border-width: 1.5px;
  border-style: solid;
  padding: 2px 20px 2px 48px;
}

.btn-funny:focus {
  border-color: #7e7e7e !important;
}

.top-nav {
  border-bottom: 1.5px solid #656565!important;
}

.top-nav a {
  display: inline-flex;
  height: 28px;
  width: 28px;
}

.top-nav a:hover {
  text-decoration: none;
}

.top-nav a i {
  color: #3f3f3f;
}

.btn-funny a {
  color: #d1d1d1;
}

@media (min-width: 1200px) {
  .header-navbar .container, .header-navbar .container-lg, .header-navbar .container-md, .header-navbar .container-sm, .header-navbar .container-xl {
    max-width: 1007px;
  }
}

.landing, .landing2 {
  background-size: cover;
  background-repeat: no-repeat;
}

.letter-spacing--1 {
  letter-spacing: -1px;
}

.letter-spacing--06 {
  letter-spacing: -.6px;
}

.letter-spacing--05 {
  letter-spacing: -.5px;
}

.text-gradient-orange {
  background: -webkit-linear-gradient(0deg, #e4327a, #f6814b, #f47856, #feab40, #f2745b);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.text-gradient-blue {
  background: -webkit-linear-gradient(0deg, #3fc0b7, #01aed6, #1bb285);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.text-special {
  font-family: 'Montserrat', sans-serif;
}

.text-dark-gray {
  color: #484848;
}

.cubo img {
  padding: 0;
  margin: 0;
}

.cubo {
  background-color: #fff;
  border-radius: 50%;
  width: 90px;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 90px;
  padding: 0;
}

.cubo img {
  height: 72px;
  margin-top: 5px;
}

.fw-500 {
  font-weight: 500;
}

.fw-400 {
  font-weight: 500;
}

.fw-900 {
  font-weight: 900;
}

.call-to-action .btn {
  color: #fff;
  font-weight: 600;
  padding: 10px 17px 10px 40px;
  transition: border-radius .2s ease, filter .5s ease;
}

.call-to-action .btn:hover {
  filter: brightness(.9);
  border-radius: 20px 20px 20px 20px;
}

.btn-aprenda-agora {
  background-image: -webkit-linear-gradient(0deg, #e42771, #f2745b);
  border-radius: 20px 5px 5px 5px;
}

.btn-explore-a-hub {
  background-image: -webkit-linear-gradient(0deg, #3fc0b7, #01aed6, #1bb285);
  border-radius: 5px 20px 5px 5px;
}

.btn-descubra-o-curso {
  background-image: -webkit-linear-gradient(0deg, #3fc0b7, #01aed6, #1bb285);
  border-radius: 20px 5px 5px 5px;
}

.btn-fale-conosco {
  background-color: #fff;
  color: #000 !important;
  box-shadow: 0 2px 10px rgb(0 0 0 / 32%);
  border-radius: 5px 20px 5px 5px;
}

.items-bar .selected p {
  background: -webkit-linear-gradient(0deg, #e4327a, #f7623d, #f86e48, #fe4050, #f25b68);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.items-bar .circle {
  width: 100%;
  position: relative;
}

.items-bar .circle::before{
  content: '';
  width: 30px;
  height: 30px;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  background-color: #a7a9a9;
  border-color: #e4e4e4;
  border-width: 5px;
  border-style: solid;
  transition: background ease .2s;
}

.items-bar .selected .circle::after {
  content: '';
  width: 20px;
  height: 20px;
  margin-top: 5px;
  margin-left: -25px;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  background-color: #fff;
  border-style: none;
}

.items-bar .selected .circle::before{
  content: '';
  width: 30px;
  height: 30px;
  border-style: none;
  background: -webkit-linear-gradient(0deg, #e4327a, #f7623d, #f86e48, #fe4050, #f25b68);
}

.items-bar .feature-item p {
  transition: color ease .2s;
}

.items-bar .feature-item:not(.selected) p {
  color: #a7a9a9;
}

.items-bar .feature-item:hover p {
  color: #6e6e6e;
}

.items-bar .feature-item:hover .circle::before {
  background-color: #8b8b8b;
}

.items-bar .bar {
  border-top: solid 3px #a7a9a9;
  height: 1px;
  width: 45%;
  margin-top: -28px;
}

.mini-line-gradient-orange {
  height: 3px;
  width: 110px;
  margin-bottom: 27px;
  background: -webkit-linear-gradient(0deg, #e4327a, #f7623d, #f86e48, #fe4050, #f25b68);
}

.mini-line-green {
  height: 3px;
  width: 110px;
  margin-bottom: 27px;
  background-color: #26e9a6;
}

.detalhe-sobre h3 {
  font-size: var(--h3-responsive-size);
}

.detalhe-sobre .banner {
  width: 48%;
}

.detalhe-sobre .banner img {
  border-radius: 15px !important;
  transition: transform ease .2s;
}

.detalhe-sobre .banner img:hover {
  transform: scale(1.01);
}

.detalhe-sobre .ideia-icon {
  width: 28px;
  height: auto;
}

.btn-black-rounded-left {
  background: #29292b;
  border: none;
  padding: 13px 18px 7px 28px;
  border-radius: 18px 6px 6px 6px;
  color: #fff;
  font-weight: bold;
  transition: border-radius .2s ease, filter .5s ease;
}

.btn-black-rounded-left:hover {
  color: #fff;
  filter: opacity(.90);
}

.btn-black-rounded-left.selected {
  background: -webkit-linear-gradient(0deg, #1bb285, #01aed5, #1bb285);
}

.btn-gradient-blue-rounded-left {
  background: -webkit-linear-gradient(0deg, #1bb285, #01aed5, #1bb285);
  border: none;
  padding: 9px 18px 7px 28px;
  border-radius: 18px 6px 6px 6px;
  color: #fff;
  font-weight: bold;
  transition: border-radius .2s ease, filter .5s ease;
}

.btn-gradient-blue-rounded-left:hover {
  filter: brightness(.8);
  color: #fff;
  text-decoration: none;
}

.lista-de-cursos .background-top {
  position: absolute;
  z-index: -1;
  background-image: url('images/background-lista-cursos.jpg');
  background-size: cover;
  background-position: bottom;
  height: 350px;
  width: 100%;
}

.lista-de-cursos .background-bottom {
  position: absolute;
  margin-top: 400px;
  z-index: -1;
  background-size: cover;
  height: 80%;
  width: 100%;
}

.nice-box-shadow {
  box-shadow: 0px 5px 10px rgb(0 0 0 / 22%);
}

.lista-de-cursos .card {
  border-radius: 10px 10px 0px 0px;
  transition: all ease .3s;
  box-shadow: 0px 5px 10px rgb(0 0 0 / 22%);
}

.lista-de-cursos .card:hover {
  transform: scale(1.01);
  box-shadow: 0px 5px 10px rgb(0 0 0 / 16%);
}

.lista-de-cursos .card-img-top {
  border-radius: 0px !important;
  margin-top: -1px;
}

.teacher-icon {
  width: 100px;
  border-radius: 50%;
}

.lista-de-cursos .card-body {
  padding: 18px;
}

.lista-de-cursos .card-text {
  font-size: .9rem;
}

.teacher-description {
  font-size: .8rem;
  color: #666666;
}

.btn-gradient-blue-rounded {
  background: -webkit-linear-gradient(0deg, #1bb285, #01aed5, #1bb285);
  border: none;
  padding: 7px 40px 7px 18px;
  border-radius: 16px;
  color: #fff;
  font-weight: 500;
  font-size: 0.8rem;
  transition: border-radius .2s ease, filter .4s ease;
}


.btn-gradient-blue-rounded:hover {
  filter: brightness(.8);
  color: #fff;
  text-decoration: none;
}

.text-underline {
  text-decoration: underline;
}

@media (min-width: 992px) {
  .faq {
    background-image: url('images/banner-faq-hub-de-conhecimento.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
  }
}


.faq .btn-gradient-blue-rounded-left:hover {
  filter: brightness(.9);
  border-radius: 16px 4px 4px 4px;
  color: #fff;
}

.faq .questions p {
  font-size: .9rem;
}

.fs-08 {
  font-size: .8rem;
}

.fs-09 {
  font-size: .9rem;
}

.fs-1-27 {
  font-size: 1.27rem;
}

.fs-1-15 {
  font-size: 1.15rem;
}

.fs-1-25 {
  font-size: 1.25rem;
}

.fs-1-15-responsive {
  font-size: 1.15rem;
  font-size: var(--fs-1-15-responsive);
}

.text-almost-black {
  color: #4c4c4c;
}

.perfil-professores::before {
  content: "Ver perfil";
  color: #fff;
  text-align: center;
  font-size: 0.8rem;
  padding-top: calc(51px - 0.7rem);
  background-image: url(images/icone-perfil.png);
  top: 0px;
  height: 101px;
  width: 140px;
  position: absolute;
  background-repeat: no-repeat;
  background-size: contain;
  opacity: 0;
  transition: opacity .5s ease;
}

.perfil-professores:hover::before {
  opacity: 1;
}

.perfil-professores:hover {
  cursor: pointer;
}

.img-perfil-professores {
  width: 100px;
  height: 100px;
  background-size: cover;
}

.img-perfil-professores img {
  display: none;
}

.btn-participe-de-um-curso {
  background: -webkit-linear-gradient(0deg, #22C68E, #3E9AAB, #6A82EC);
  border: none;
  border-radius: 5px;
  color: #fff;
  font-weight: 500;
  letter-spacing: 0.1px;
  font-size: 0.9rem;
  transition: border-radius .2s ease, filter .4s ease;
}

.btn-participe-de-um-curso:hover {
  filter: brightness(.8);
  color: #fff;
  text-decoration: none;
}

.redes-sociais {
  background-color: #27ECA6;
}

.icone-rede-social-dark {
  width: 40px;
}

.icone-rede-social:hover {
  opacity: 0.7;
}

.footer {
  border-top: solid 1px #ccc;
}

.burocracia a {
  border-right: solid 2px #6d6d6d;
}

.burocracia a:last-child {
  border-right: none;
}

.background-contato {
  background-image: url('images/banner-home-hub-de-conhecimento-contato.jpg');
  background-size: cover;
  background-position: center;
  height: var(--background-contato-height);
  width: 100%;
}

.fs-3 {
  font-size: 3rem;
}

.fs-3-responsive {
  font-size: var(--fs-3-resonsive-size);
}

.icones-contato img {
  width: 35px;
}

.bg-almost-white {
  background-color: #F5F5F5;
}

.inputs-contato input, .inputs-contato textarea {
  border: solid 2px #b9b9b9;
  border-radius: 32px 10px 10px 10px;
  padding: 10px 20px;
}

.inputs-contato input:focus, .inputs-contato textarea:focus  {
  border: solid 2px #505050;
  border-radius: 32px 10px 10px 10px;
  outline: none;
}

.btn-enviar-mensagem {
  background: -webkit-linear-gradient(0deg, #1bb285, #01aed5, #1bb285);
  border: none;
  padding: 11px 68px 11px 60px;
  color: #fff;
  font-weight: bold;
  font-size: .9rem;
  transition: border-radius .2s ease, filter .4s ease;
  border-radius: 20px 6px 6px 6px;
}

.btn-enviar-mensagem:hover {
  filter: brightness(.8);
  color: #fff;
  text-decoration: none;
}

.btn-enviar-mensagem:focus {
  box-shadow: inset 0 0 0 2px #5f5f5f;
  outline: none;
}

.break-all {
  word-break: break-all;
}

.email-text {
  font-size: var(--email-text-size);
}

.h1-responsive {
  font-size: var(--h1-responsive-size);
}

.h2-responsive {
  font-size: var(--h2-responsive-size);
}

.h3-responsive {
  font-size: var(--h3-responsive-size);
}

.h5-responsive {
  font-size: var(--h5-responsive-size);
}

.fs-1-27-resonsive {
  font-size: var(--fs-1-27-resonsive);
}

.h6-responsive {
  font-size: var(--h6-responsive-size);
}

.principais-recursos-curso {
  display: flex;
}

.principais-recursos-curso img {
  width: 33px;
}

.card-body .sub {
  color: #a7a7a7;
}

.btn-compre {
  background: -webkit-linear-gradient(0deg, #1bb285, #01aed5, #1bb285);
  border: none;
  padding: 19px;
  border-radius: 6px;
  color: #fff;
  font-weight: bold;
  transition: border-radius .2s ease, filter .5s ease;
}

.btn-compre:hover {
  filter: brightness(.9);
  border-radius: 20px 20px 20px 20px;
  color: #fff;
}

i.icone-before, i.icone-after {
  position: relative;
}

i.icone-before::before, i.icone-after::before {
  content: "";
  position: absolute;
  height: 30px;
  width: 30px;
  background-size: cover;
  top: -4px;
}

i.icone-before::before {
  left: -30px;
}

.top-nav i.icone-after::before {
  top: -1px;
  left: -1px;
  height: 34px;
  width: 34px;
}

.btn-gradient-blue-rounded i.icone-after::before {
  top: -7px;
}

i.icone-compre::before {
  background-image: url('images/icone-compras-hub-de-conhecimento.png');
}

i.icone-editar::before {
  background-image: url('images/icone-lapis-hub-de-conhecimento.png');
}

i.icone-alvo::before {
  background-image: url('images/icone-circulo-hub-de-conhecimento.png');
}

i.icone-enviar::before {
  background-image: url('images/icone-aviao-hub-de-conhecimento.png');
}

i.icone-instagram::before {
  background-image: url('images/icone-instagram-hub-de-conhecimento.png');
}

i.icone-facebook::before {
  background-image: url('images/icone-facebook-hub-de-conhecimento.png');
}

i.icone-whatsapp::before {
  background-image: url('images/icone-whatsapp-hub-de-conhecimento.png');
}

i.icone-lupa::before {
  background-image: url('images/icone-lupa-hub-de-conhecimento.png');
}

i.icone-chat-dark::before {
  background-image: url('images/icone-chat-dark-hub-de-conhecimento.png');
}

.pointer {
  cursor: pointer;
}

.sobre-nos {
  background-repeat: no-repeat;
  background-image: none;
  background-size: contain;
  background-position-y: 141px;
}

.comece-uma-jornada {
  background-repeat: no-repeat;
  background-image: none;
  background-size: contain;
}

.modal-cursos .modal-content {
  box-shadow: 0px 4px 10px 1px rgb(0 0 0 / 0.5);
  border-radius: 0.9rem;
  padding: 15px 25px;
  text-align: center;
  background-image: url('images/fundo01.jpg');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

.modal-cursos-header {
  display: flex;
  justify-content: flex-end;
}

.modal-cursos .close {
  font-size: 0.9rem;
  text-decoration: underline;
  color: #b9322c;
}

.modal-cursos .modal-body {
  background-color: rgba(255, 255, 255, 0.3);
  box-shadow: 0 0 13px 9px rgba(255, 255, 255, 0.3);
}

.landing, .landing2 {
  padding-bottom: 80px !important;
}

.modal-professores .img-perfil-professor {
  max-height: 165px;
  max-width: 165px;
  object-fit: cover;
}

.logo-menu {
  max-width: 88px;
}

.logo-modal {
  max-width: 100px;;
}

.jkbsh {
  visibility: hidden;
  display: none;
  opacity: 0;
}

#msgContato {
  overflow-wrap: anywhere;
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
  :root {
    --background-contato-height: 350px;
    --email-text-size: inherit;
    --fs-1-15-responsive: 1.15rem;
    --fs-1-27-resonsive: 1.27rem;
    --fs-3-resonsive-size: 3rem;
    --h1-responsive-size: 2.5rem;
    --h2-responsive-size: 2rem;
    --h3-responsive-size: 1.9rem;
    --h5-responsive-size: 1.25rem;
    --h6-responsive-size: 1rem;
  }

  .landing, .landing2 {
    max-height: 566px;
    min-height: 345px;
    height: calc(100vh - 192px);
  }

  .landing {
    background-image: url(./images/banner-landing-hub-de-conhecimento.jpg);
    background-position: bottom;
  }

  .landing2 {
    background-image: url(./images/banner-home-hub-de-conhecimento.jpg);
    background-position: top;
  }

  .btn-participe-de-um-curso {
    padding: 13px 56px;
  }

  .sobre-nos {
    background-image: url('images/fundo01.jpg');
  }

  .lista-de-cursos .background-bottom {
    background-image: url('images/fundo02.png');
  }

  .logo-menu {
    max-width: 150px;
  }

  .logo-modal {
    max-width: 210px;;
  }

}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
  .sobre-nos {
    background-position-y: 150px;
  }
  .bg-md-transparent {
    background-color: transparent;
  }
  .w-md-auto {
    width: auto !important;
  }
  .items-bar .bar {
    width: 40%;
  }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
  .sobre-nos {
    background-position-y: 100px;
  }
  
  .comece-uma-jornada {
    background-image: url('images/fundo03.png');
  }
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
  .landing {
    background-position: center;
  }
  .landing::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.37);
    z-index: -1;
  }
}