/* Define o tamanho da fonte raiz para o elemento */ html main { font-size: 16px; /* Defina o tamanho da fonte raiz para 1rem */ } /* Estilos para títulos h1 a h6 */ main h1, main h2, main h3, main h4, main h5, main h6 { font-weight: bold; line-height: 1; position: relative; } main h1 { font-size: 3.5rem; } main h2 { font-size: 4rem; } main h1 span, main h2 span { display: block; font-size: 1.2rem; } main h3 { font-size: 3rem; } main h3 span { display: block; font-size: 1rem; } main p { font-size: 1.2rem; } main a { font-size: 1rem; } /* Styles css personalizados a partir daqui */ .height-100 { height: 100%; } .btn-ver-mais-informacao { height: 50px; width: 50px; background: white; position: absolute; bottom: 20px; right: 20px; border-radius: 50%; display: flex; align-items: center; z-index: 5; transition: 0.5s; } .btn-ver-mais-informacao.dark { background: #3B3756; } .btn-ver-mais-informacao.active { transform: rotate(45deg); transition: 0.5s; } .btn-ver-mais-informacao img, .btn-ver-mais-informacao svg { height: 40px; display: flex; margin: 0 auto; width: 40px; } .box-ver-mais-informacao { position: absolute; top: 10%; left: 5%; padding: 40px; background: white; height: 100%; opacity: 0; transition: 0.5s; z-index: -1; } .btn-ver-mais-informacao:active+.box-ver-mais-informacao { opacity: 1; } .btn-ver-mais-informacao.active+.box-ver-mais-informacao { top: 0; left: 0; overflow: auto; z-index: 4; } .carrousel-conteudo-redes-sociais { background: #C7A2DD; padding: 20px; display: flex; flex-direction: column; gap: 10px; min-height: 360px; justify-content: space-between; } .carrousel-conteudo-redes-sociais img { margin: 0 auto; max-height: 150px; } .post-images img { transform: unset !important; opacity: unset !important; } .carrousel-conteudo-redes-sociais p { font-size: 15px; color: var(--dpurple); text-align: center; } .carrousel-conteudo-redes-sociais h4, .carrousel-conteudo-redes-sociais p { margin-bottom: 0; } .carrousel-swiper-post { width: 400px; height: 450px; background: #ffffff; border-radius: 20px; margin: 0 auto; padding: 5px 20px; display: flex; flex-direction: column; justify-content: flex-start; } .head-post { width: 100%; height: 50px; overflow: hidden; display: flex; align-items: center; justify-content: flex-start; } .head-post img { height: 40px; width: auto; max-width: 100%; } .content-post { height: 360px; background: #f5f5f5; border-radius: 20px; } .footer-post { height: 1px; border-radius: 20px; width: 100%; position: absolute; bottom: 20px; } .footer-post .like-icon { height: 40px; } .footer-post .rodapepost { display: flex; justify-content: space-between; font-size: 14px; } .footer-post .rodapepost span { font-weight: normal; font-family: 'Tomorrow', sans-serif; } .footer-post ul.comment-share-meta { margin: 0; padding: 0; display: flex; gap: 10px; } .footer-post .racting { display: flex; justify-content: space-between; } .footer-post ul.comment-share-meta button { padding: 0; margin: 0; height: 35px; width: 35px; border: none; background: unset; } .footer-post .tooltip { display: none; } .footer-post .post-meta { display: flex; flex-direction: column; justify-content: space-between; height: 100%; } .footer-post .emojireact { letter-spacing: -8px; margin-right: 10px; } .img-ampulheta-da-cupcode { height: 400px; margin: 0 auto; display: flex; } .img-experiencia-imersiva { max-width: 450px; margin: 0 auto; display: flex; } .head-box-ver-mais, .box-com-img-left { display: flex; gap: 10px; align-items: center; } .head-box-ver-mais img, .box-com-img-left img, .box-com-img-top img, .box-com-img-right img { width: 80px; height: auto; } .box-com-img-left p, .box-com-img-top p, .box-com-img-right p { font-size: 15px; margin: 0; } .box-com-img-top { text-align: center; gap: 10px; display: flex; flex-direction: column; align-items: center; } .box-com-img-right { display: flex; flex-direction: row-reverse; gap: 10px; align-items: center; text-align: end; } .carrousel-post-sociais .slider__item { margin-right: 0; } .modal-universal .modal-dialog { max-width: 80%; margin: 0 auto; margin-top: 50px; } .carrousel-post-sociais .swiper-pagination { position: relative; top: 2px !important; } .dp-lg-none { display: none; } .swiper-pagination-post { margin: 0 auto; text-align: center; background: white; } .fabrica-de-ideias h3 { font-size: 2.5rem; } .bg-forefround-abs { left: 0; } .gap-40 { gap: 40px; } .modal-keynote-criativos .modal-dialog { max-width: 65%; } .modal-universal .modal-dialog { max-width: 600px; } .ver-o-Keynote{ position: absolute; z-index: 2; background: var(--dpurple); width: 100%; color: white; text-align: center; bottom: -27px; } div#modalKeynoteCriativos .modal-footer { padding-top: 35px; } img.quadro-rosa-3d, img.ancora-inpulsione, img.mapa-do-conteudo, img.engajamento-duradouro { max-height: 250px; } /* Adicionando um efeito de brilho neon ao título */ .neon-title { color: #D48FFD; position: relative; } .neon-title::before { content: "Tráfego Pago"; position: absolute; color: #fff; animation: neon 1.5s linear infinite alternate-reverse; } .neon-title-light::before { content: "Tráfego Light" !important; } .neon-title-pro::before { content: "Tráfego PRO" !important; } .neon-title-ultra::before { content: "Tráfego ULTRA" !important; } @keyframes neon { 0% { text-shadow: 0 0 10px #24FF00, 0 0 20px #24FF00, 0 0 30px #24FF00, 0 0 40px #24FF00, 0 0 50px #24FF00; } 100% { text-shadow: 0 0 5px #24FF00, 0 0 10px #24FF00, 0 0 15px #24FF00, 0 0 20px #24FF00, 0 0 25px #24FF00; } } .tp-img-redes-sociais-pacotes { max-width: 100% !important; bottom: 20px; } img.tp-img-redes-sociais-pacotes-mini { width: 150px; } .plano-head { width: 100%; scale: 1.03; display: flex; align-items: center; justify-content: flex-start; flex-direction: column; height: inherit; } .box-planos-redes-sociais { background: #330344; height: 750px; border-radius: 20px; display: flex; flex-direction: column; justify-content: space-between; margin: 15px; } .lista-de-planos { display: flex; margin-top: 30px; flex-wrap: wrap; justify-content: space-around; } .plano-head-titulo { text-align: right; top: 50%; transform: translate(0, -60%); position: absolute; } .plano-head-titulo h3 { font-size: 3rem; } .plano-head-titulo p { font-size: 20px } .planos-footer { padding: 15px; text-align: center; display: flex; flex-direction: column; gap: 15px; margin-bottom: 10px; } .planos-body ul li { color: white; display: flex; align-items: center; gap: 5px; margin-bottom: 5px; } .planos-body img { width: 25px; } .planos-body { position: relative; top: 15px; } img.rd-requisito-basico { max-width: 200px !important; } @media (max-width: 1250.85px) { .fabrica-de-ideias h3 { font-size: 2.2rem; } main h2 { font-size: 3rem; } main h3 { font-size: 2.8rem; } } @media (max-width: 992.85px) { .img-ampulheta-da-cupcode { height: 250px; } img.bolha-case-de-sucesso { opacity: 0.6; } .cases-de-sucesso .slick-list { margin-right: 0; } img.img-social-redes-sociais { width: 100%; max-width: 400px; } .dp-lg-none { display: block; } .dp-md-none { display: none; } .carrousel-swiper-post { margin: initial; margin-bottom: 15px; margin-top: 10px; } .fabrica-de-ideias h3 { font-size: 1.9rem; } main a { font-size: 0.8rem; } main h3 { font-size: 2.2rem; } .modal-keynote-criativos .modal-dialog { max-width: 95%; } section#redes-sociais p { font-size: 15px; } h2#modalKeynoteCriativosLabel { font-size: 1.2rem !important; } } @media (max-width:768.85px) { main h1, main h2, main h3 { font-size: 2.5rem; } } @media (max-width: 570.85px) { .content-post { height: fit-content; } .carrousel-swiper-post { width: 100%; height: auto; } .footer-post { display: none; } main h1 span, main h2 span { display: block; font-size: 1rem; } main h1, main h2, main h3 { font-size: 2rem; } .img-experiencia-imersiva { max-width: 100%; } } @media (max-width: 420px) { main h1, main h2, main h3 { font-size: 1.8rem; } }