/*! HTML5 Boilerplate v8.0.0 | MIT License | https://html5boilerplate.com/ */
/* main.css 3.0.0 | MIT License | https://github.com/h5bp/main.css#readme */
/*
* What follows is the result of much research on cross-browser styling.
* Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
* Kroc Camen, and the H5BP dev community and team.
*/
/* ==========================================================================
Base styles: opinionated defaults
========================================================================== */
/* =========================
FIX: Instagram In-App WebView
========================= */
.bebas-neue-regular { font-family: "Bebas Neue", sans-serif; font-weight: 400; font-style: normal; }
.inter- { font-family: "Inter", sans-serif; font-optical-sizing: auto; font-weight: ; font-style: normal; }
.hide { display: none; }
.hide-desktop{display: none;}
* { box-sizing: border-box; }
/* se você tiver seções que usam 100vh, aplique a classe .vh-100-fix nelas */
/* 2) Safe areas (notch) */:root { --safe-top: env(safe-area-inset-top, 0px); --safe-right: env(safe-area-inset-right, 0px); --safe-bottom: env(safe-area-inset-bottom, 0px); --safe-left: env(safe-area-inset-left, 0px); }
/* exemplo: padding seguro no topo/baixo quando tiver header fixo */
.safe-padding { padding-top: var(--safe-top); padding-bottom: var(--safe-bottom); padding-left: var(--safe-left); padding-right: var(--safe-right); }
/* 3) Evita “zoom/resize” estranho em inputs no iOS/Instagram */
input, select, textarea { font-size: 16px; /* iOS evita zoom ao focar */ }
/* 4) Scroll mais estável no iOS */
html, body { font-family: "Inter", sans-serif; -webkit-text-size-adjust: 100%; -webkit-overflow-scrolling: touch; }
/* 5) Evita esticar imagens/vídeos em alguns webviews */
img, video { max-width: 100%; height: auto; }
video { object-fit: cover; }
html, body { height: 100%; }
/* 6) Melhor toque (sem travar scroll vertical) */
.touch-pan-y { touch-action: pan-y; }
/* campo fechado */
/* itens do dropdown */
.dropdown-content li > span { font-size: 17px !important; padding: 12px 16px !important; }
/*
* Remove text-shadow in selection highlight:
* https://twitter.com/miketaylr/status/12228805301
*
* Customize the background color to match your design.
*/
::-moz-selection { background: #b3d4fc; text-shadow: none; }
::selection { background: #b3d4fc; text-shadow: none; }
/*
* A better looking default horizontal rule
*/
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
/*
* Remove the gap between audio, canvas, iframes,
* images, videos and the bottom of their containers:
* https://github.com/h5bp/html5-boilerplate/issues/440
*/
audio, canvas, iframe, img, svg, video { vertical-align: middle; }
/*
* Remove default fieldset styles.
*/
fieldset { border: 0; margin: 0; padding: 0; }
/*
* Allow only vertical resizing of textareas.
*/
textarea { resize: vertical; }
a { color: #0E293D; }
*, *::before, *::after { box-sizing: border-box; }
/* GLOBAL: aplica em inputs, textareas e qualquer elemento com placeholder */
::-webkit-input-placeholder { color: #000; opacity: 1; }
:-moz-placeholder { color: #000; opacity: 1; }
/* Firefox 4-18 */
::-moz-placeholder { color: #000; opacity: 1; }
/* Firefox 19+ */
:-ms-input-placeholder { color: #000; }
/* IE 10-11 */
::-ms-input-placeholder { color: #000; }
/* Edge Legacy */
::placeholder { color: #000; opacity: 1; }
.mobile { display: none; }
.desktop { display: block; }
.ancora { width: 1px; height: 1px; position: absolute; left: 0px; opacity: 0; }
#ancora-simular-projeto { top: -100px; }
#ancora-clientes { top: 250px; }
#ancora-avaliacoes { top: -200px; }
#ancora-diferenciais { top: -160px; }
#ancora-quem-somos { top: -80px; }
.rotate-relogio { -webkit-animation: girarHorario 12s linear infinite; -moz-animation: girarHorario 12s linear infinite; -o-animation: girarHorario 12s linear infinite; animation: girarHorario 12s linear infinite; -webkit-transform-origin: center center; -moz-transform-origin: center center; -o-transform-origin: center center; transform-origin: center center; }
@-webkit-keyframes girarHorario {
from { -webkit-transform: rotate(0deg); }
to { -webkit-transform: rotate(360deg); }
}
@-moz-keyframes girarHorario {
from { -moz-transform: rotate(0deg); }
to { -moz-transform: rotate(360deg); }
}
@-o-keyframes girarHorario {
from { -o-transform: rotate(0deg); }
to { -o-transform: rotate(360deg); }
}
@keyframes girarHorario {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}
/*inicio contato enviado*/
#bg-video-contato-enviado { position: fixed; inset: 0; width: 100%; height: 100vh; overflow: hidden; z-index: -1; }
#bg-video-contato-enviado video { width: 100%; height: 100%; object-fit: cover; }
#mascara-banner{width: 100%; height: 100%; position: fixed; top: 0px; left: 0px; z-index: 90; background-color: #000; opacity: 0.3;}
#conteudo-contato-enviado{width: 100%; height: 100%; position: fixed; z-index: 100; }
#janela-contato-enviado { width: 1000px; height: 600px; position: fixed; top: 50%; left: 50%; margin-left: -500px; margin-top: -300px; background-color: #fff; border-radius: 30px; z-index: 1999; overflow: hidden;}
/*Whatsapp flutuante*/
#cta-wpp-topo { width: auto; height: auto; position: fixed; right: 100px; bottom: 50px; padding: 15px 30px 15px 60px; border-radius: 150px; border: 0.3px solid #64E877; color: #fff; font-size: 20px; z-index: 9999; background-color: #2BD33A; cursor: pointer; }
#icn-wpp-topo { width: 34px; height: 34px; position: absolute; left: 16px; top: 11px; background: url('../img/phone-wpp.png'); background-size: 34px; }
/*Inicio menu topo*/
#container-menu-topo { width: 100%; height: auto; position: fixed; top: 25px; z-index: 1000; }
#menu-fixo { width: 90%; height: 80px; position: relative; margin: auto; background-color: rgba(255, 255, 255, 0); border-radius: 60px; border: 1px solid rgba(238, 238, 238, 0); -webkit-transition: background-color 0.15s linear, border-color 0.15s linear; -moz-transition: background-color 0.15s linear, border-color 0.15s linear; -o-transition: background-color 0.15s linear, border-color 0.15s linear; transition: background-color 0.15s linear, border-color 0.15s linear; }
#logo-menu-topo { width: 156px; height: 70px; position: relative; float: left; margin-left: 28px; margin-top: 5px; background: url('../img/atrek-negativa.png'); background-size: 156px; }
#lista-itens-menu-fixo { width: 60%; height: auto; position: relative; float: left; margin-left: 30px; margin-top: 9px; }
#lista-itens-menu-fixo ul li { width: auto; height: auto; position: relative; float: left; font-size: 22px; color: #fff; margin-right: 37px; }
.link-menu { color: #fff; text-decoration: none; -webkit-transition: color 200ms ease; -moz-transition: color 200ms ease; -o-transition: color 200ms ease; transition: color 200ms ease; }
#menu-fixo.menu-scroll-ativo .link-menu { color: #000 !important; }
.link-menu.ativo { color: #2BD33A !important; }
#menu-fixo.menu-scroll-ativo .link-menu.ativo { color: #2BD33A !important; }
#inicio-comparacao-mobile { display: none; }
/*cta simular projeto*/
#cta-simular-projeto-m { width: auto; height: auto; position: relative; float: right; margin-top: 15px; margin-right: 26px; background-color: #2BD33A; color: #fff; font-size: 20px; border-radius: 50px; padding: 10px 60px 10px 20px; cursor: pointer; }
#icn-cta { width: 35px; height: 35px; position: absolute; right: 10px; top: 7px; background-color: #fff; border: 50%; border-radius: 50%; }
#raio-cta-menu-f { width: 30px; height: 30px; position: absolute; left: 50%; top: 50%; margin-left: -15px; margin-top: -15px; background: url('../img/raios.png'); background-size: 30px; }
/*Inicio banner topo*/
#banner-topo { width: 100%; height: 1300px; position: relative; float: left; overflow: hidden; }
#banner-topo .bg-video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; /* faz virar "background" */ z-index: 0; }
/* conteúdo acima do vídeo */
#banner-topo > *:not(.bg-video) { position: relative; z-index: 1; }
#mascara-banner-topo { width: 100%; height: 100%; position: absolute !important; top: 0px !important; z-index: 9 !important; background-color: #000; opacity: 0.6; }
#conteudo-banner-topo { width: 100%; height: 100%; position: absolute; z-index: 100 !important; top: 0px; }
#view-banner-topo { width: 85%; height: auto; position: relative; margin: auto; }
#conteudo-banner-topo { width: 100%; height: auto; position: absolute; top: 50%; margin-top: -230px; }
#conteudo-banner-topo h1 { width: 100%; height: auto; position: relative; float: left; font-size: 58px; color: #fff; font-weight: 700; }
#conteudo-banner-topo h1 span { color: #2BD33A; }
#conteudo-banner-topo p { width: 520px; height: auto; position: relative; float: left; margin-top: -15px; font-size: 30px; color: #fff; font-weight: 300; line-height: 35px; }
/*faixa cta banner topo*/
#faixa-cta-banner-topo { width: 100%; height: auto; position: relative; float: left; margin-top: 10px; }
#cta-banner-topo { width: auto; height: auto; position: relative; float: left; background-color: #2BD33A; color: #fff; font-size: 20px; border: 1px solid #45b84f; padding: 15px 68px 15px 25px; border-radius: 90px; cursor: pointer; }
#icn-cta-banner { width: 40px; height: 40px; position: absolute; top: 10px; right: 10px; background-color: #fff; border-radius: 50%; }
#raio-cta-banner { width: 35px; height: 35px; position: absolute; left: 50%; top: 50%; margin-left: -17.5px; margin-top: -17.5px; background: url('../img/raios.png'); background-size: 35px; }
/*Inicio calculadora economia*/
#div-calculadora-economia { width: 100%; height: 950px; position: relative; float: left; z-index: 600; margin-top: 100px; }
#view-faixa-calculadora-economia { width: 1400px; height: auto; position: relative; margin: auto; }
.div-conteudo-s2-divisoria { width: 50%; height: auto; position: relative; float: left; }
.div-conteudo-s2-divisoria h2 { width: 700px; height: auto; position: relative; float: left; margin-top: 60px; color: #07646F; font-size: 54px; font-weight: 700; line-height: 55px; }
.div-conteudo-s2-divisoria h2 span { color: #2BD33A; }
#tag-tempo-simulacao { width: 600px; height: auto; position: relative; float: right; margin-top: 85px; background-color: #0A505A; border-radius: 30px; overflow: hidden; }
#icn-tag-simulacao { width: 20%; height: 100%; position: relative; float: left; background-color: #2BD33A; padding: 25px; }
#tag-tempo-simulacao-txt { width: 80%; height: auto; position: relative; float: left; padding: 25px 20px; color: #fff; font-weight: 300; font-size: 22px; }
/*Inicio faixa calculadora de economia*/
#faixa-calculadora-economia-topo { width: 100%; height: auto; position: relative; float: left; padding-top: 20px; }
#calculadora-de-economia { width: 1400px; height: 610px; position: relative; margin: auto; background-color: #fff; border-radius: 30px; -webkit-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); -moz-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); -o-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); -ms-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); padding: 0px 40px; }
#faixa-topo-calculadora { width: 100%; height: auto; position: relative; float: left; margin-top: 40px; padding: 25px 35px; margin-bottom: -50px; }
#raio-topo-calculdora { width: 55px; height: 55px; position: relative; float: right; background: url('../img/raios.png'); background-size: 55px; }
#cta-usar-localizacao { width: auto; height: auto; position: relative; float: right; padding: 10px 20px 10px 55px; font-size: 18px; color: #fff; background-color: #2BD33A; border-radius: 15px; }
#icn-usar-loc { width: 30px; height: 30px; position: absolute; left: 15px; top: 7px; background: url('../img/usar-loc-icn.png'); background-size: 30px; }
/*Faixa itens*/
.faixa-itens-formulario-calculadora { width: 100%; height: auto; position: relative; float: left; margin-bottom: 10px; }
.coluna-formulario-calculadora-a { width: 28%; height: auto; position: relative; float: left; padding: 0px 40px; }
.coluna-formulario-calculadora { width: 36%; height: auto; position: relative; float: left; padding: 0px 40px; }
.chamada-p-calculadora { width: 100%; height: auto; position: relative; float: left; line-height: 40px; font-size: 34px; color: #358289; font-weight: 600; }
.faixa-int-b-formulario { width: 100%; height: auto; position: relative; float: left; padding-top: 25px; }
.prefixo-valor-calculadora { width: auto; height: 100%; position: relative; float: left; margin-top: 10px; font-size: 26px; color: #08646E; font-weight: 400; }
.campo-valor-conta-calc { width: 75%; height: 40px; position: relative; float: left; margin-left: 20px; }
.campo-valor-conta-calc input { width: 100%; height: auto; position: relative; float: left; background-color: #F3F3F3 !important; border-radius: 10px !important; border: 0px solid #000 !important; color: #07646E; font-size: 22px !important; padding: 8px 20px !important; }
/*tipo de ligação*/
.chamada-campo-tipo-b { width: 100%; height: auto; position: relative; float: left; margin-top: 38px; font-size: 22px; color: #07646E; padding: 10px 0px; }
.box-seletores-form { width: 100%; height: auto; position: relative; float: left; margin-top: 0px; }
/*Item box seletor*/
.item-box-seletor { width: 30%; height: 90px; position: relative; float: left; margin-left: 1.5%; margin-right: 1.5%; background-color: #F2F4F2; border-radius: 15px; cursor: pointer; transition: background-color 0.25s ease; }
.item-box-seletor:hover { background-color: #DDE1E0; }
.box-icn-seletor-form { width: 100%; height: 100%; position: relative; float: left; overflow: hidden !important; }
.faixa-icn-raio { width: 100%; height: auto; position: relative; float: left; margin-top: 40px; }
.icn-raio-a { width: 60px; height: 60px; position: absolute; left: 50%; top: 50%; margin-left: -30px; margin-top: -28px; background: url(../img/icn-raio.gif); background-size: 60px; }
.icn-raio-b { width: 60px; height: 60px; position: absolute; left: 50%; top: 50%; margin-left: -37px; margin-top: -28px; background: url(../img/icn-raio.gif); background-size: 60px; }
.icn-raio-b-2 { width: 60px; height: 60px; position: absolute; top: 1px; right: -23px; background: url(../img/icn-raio.gif); background-size: 60px; }
.icn-raio-b-3 { width: 60px; height: 60px; position: absolute; top: 1px; left: -23px; background: url(../img/icn-raio.gif); background-size: 60px; }
.icn-raio-d { width: 60px; height: 60px; position: absolute; left: 50%; top: 50%; margin-left: -30px; margin-top: -28px; background: url(../img/icn-raio.gif); background-size: 60px; }
.item-box-seletor:hover .icn-raio-a, .item-box-seletor:hover .icn-raio-b, .item-box-seletor:hover .icn-raio-d { animation: icone-seletor-sai-volta 0.75s cubic-bezier(0.45, 0, 0.25, 1) forwards; }
@keyframes icone-seletor-sai-volta {
0% { transform: translateX(0); opacity: 1; }
45% { transform: translateX(150%); opacity: 0; }
46% { transform: translateX(-150%); opacity: 0; }
100% { transform: translateX(0); opacity: 1; }
}
.item-icn-int { width: 100%; height: 100%; position: relative; float: left; margin-top: 0px; overflow: hidden; }
/*inicio seletor de região*/
.item-seletor-regiao { width: 120px; height: 90px; position: relative; float: left; margin-left: 1%; margin-right: 4%; background-color: #F2F4F2; border-radius: 15px; cursor: pointer; }
.txt-seletor-regiao { width: 100%; height: auto; position: relative; float: left; margin-top: 19px; font-size: 34px; color: #08646E; text-align: center; font-weight: 700; }
.icn-segmento-calc { width: 40px; height: 40px; position: absolute; left: 50%; top: 50%; margin-left: -20px; margin-top: -20px; }
.icn-segmento-residencia { background: url('../img/residencia.png'); background-size: 40px; }
.icn-segmento-empresas { background: url('../img/empresas.png'); background-size: 40px; }
.icn-segmento-rural { background: url('../img/rural.png'); background-size: 40px; }
/* Hover no item pai */
.item-box-seletor:hover .icn-segmento-calc { animation: icone-segmento-sai-volta 0.75s cubic-bezier(0.45, 0, 0.25, 1) forwards; }
@keyframes icone-segmento-sai-volta {
0% { transform: translateX(0); opacity: 1; }
45% { transform: translateX(150%); opacity: 0; }
46% { transform: translateX(-150%); opacity: 0; }
100% { transform: translateX(0); opacity: 1; }
}
.legenda-box-seletor { width: 120%; height: auto; position: absolute; left: -10%; bottom: -34px; color: #08646E; font-size: 17px; text-align: center; }
/*select dropdown*/
.select-campo-drop-down { width: 100%; height: auto; position: relative; float: left; }
.select-wrapper { background: #F3F3F3; border-radius: 12px; padding: 0 16px; height: 70px; display: flex; align-items: center; }
.select-wrapper input.select-dropdown { border: none !important; height: 56px; line-height: normal; font-size: 20px; display: flex; padding-top: 20px; padding-left: 5px; align-items: center; color: #08646E; }
.dropdown-content li > span { font-size: 20px; padding: 14px 16px; color: #08646E; }
.select-wrapper { position: relative; }
.select-wrapper::after { content: ""; position: absolute; right: 16px; top: 50%; transform: translateY(-50%); width: 30px; height: 30px; background: url("../img/seta-select.png") no-repeat center; background-size: contain; pointer-events: none; display: none; }
.select-wrapper .caret { display: none; }
/* item normal */
.dropdown-content li > span { font-size: 20px; color: #08646E; }
/* item ao passar o mouse */
.dropdown-content li:hover { background: #32CD32 !important; }
/* texto do item no hover */
.dropdown-content li:hover > span { color: #fff !important; }
/* item selecionado */
.dropdown-content li.selected { background: #32CD32 !important; }
/* texto do item selecionado */
.dropdown-content li.selected > span { color: #fff !important; }
/*cta calcular conta*/
#cta-calcular-conta { width: 100%; height: auto; position: relative; float: left; margin-top: 90px; padding: 18px 90px 18px 30px; font-size: 20px; color: #fff; text-align: center; background-color: #2BD33A; border-radius: 50px; cursor: pointer; }
#icn-cta-calculadora { width: 45px; height: 45px; position: absolute; right: 17px; top: 10px; background-color: #fff; border-radius: 50%; }
#raio-cta-menu-calc { width: 40px; height: 40px; position: absolute; left: 50%; top: 50%; margin-left: -20px; margin-top: -20px; background: url('../img/raios.png'); background-size: 40px; }
#cta-calcular-conta:hover { background-color: #25B632; }
#cta-calcular-conta-b { width: 100%; height: auto; position: relative; float: left; margin-top: 90px; padding: 18px 30px 18px 30px; font-size: 20px; color: #fff; text-align: center; background-color: #2BD33A; border-radius: 50px; cursor: pointer; }
#icn-cta-calculadora-b { width: 45px; height: 45px; position: absolute; right: 17px; top: 10px; background-color: #fff; border-radius: 50%; }
#raio-cta-menu-calc-b { width: 40px; height: 40px; position: absolute; left: 50%; top: 50%; margin-left: -20px; margin-top: -20px; background: url('../img/raios.png'); background-size: 40px; }
#cta-calcular-conta-b:hover { background-color: #25B632; }
.fix-coluna-calculadora { width: 28%; }
#cta-calcular-conta-c { width: 100%; height: auto; position: relative; float: left; margin-top: 90px; padding: 18px 20px 18px 20px; font-size: 18px; color: #fff; text-align: center; background-color: #2BD33A; border-radius: 50px; cursor: pointer; }
#cta-calcular-conta-c:hover { width: 100%; height: auto; position: relative; float: left; margin-top: 90px; padding: 18px 20px 18px 20px; font-size: 18px; color: #fff; text-align: center; background-color: #27BE34; border-radius: 50px; cursor: pointer; }
/*Inicio s3 LP*/
#terceira-sessao-lp { width: 100%; height: 950px; position: relative; float: left; margin-top: -270px; background-color: #125267 !important; z-index: 90; }
#view-terceira-sessao-lp { width: 1400px; height: auto; position: relative; margin: auto; padding-top: 310px; }
#div-s3-a { width: 40%; height: auto; position: relative; float: left; }
#div-s3-a h4 { width: 100%; height: auto; position: relative; float: left; margin-top: 140px; font-size: 90px; color: #fff; font-family: "Bebas Neue", sans-serif; font-weight: 500; line-height: 80px; }
#div-s3-a span { color: #2BD33A; }
#div-s3-b { width: 60%; height: auto; position: relative; float: left; }
#foto-div-s3 { width: 100%; height: 700px; position: relative; float: left; background-color: #dadada; margin-top: 20px; border-radius: 50px; overflow: hidden; }
#foto-int-s3 { width: 910px; height: 800px; position: absolute; left: 50%; top: 50%; margin-left: -450px; margin-top: -360px; }
#faixa-emojis { width: 100%; height: auto; position: relative; float: left; }
#chamada-emojis { width: 100%; height: auto; position: relative; float: left; color: #fff; font-size: 42px; text-align: left; padding-right: 120px; line-height: 38px; font-weight: 700; }
#chamada-emojis span { color: #2BD33A; }
#faixa-blocos-emojis { width: 100%; height: auto; position: relative; float: left; margin-top: -50px; margin-left: -45px; }
.bloco-item-emoji { width: 33%; height: 300px; position: relative; float: left; padding: 20px; }
.legenda-box-emoji { width: 200px; height: auto; position: absolute; left: 50%; margin-left: -100px; bottom: -40px; font-size: 18px; color: #fff; text-align: center; }
.bloco-item-emoji-int { width: 180px; height: 180px; position: absolute; left: 50%; top: 50%; margin-left: -90px; margin-top: -90px; }
.fix-legenda-emojis { margin-bottom: -13px; padding: 0px 20px; }
/*Inicio sessão de UGCs*/
#faixa-sessao-ugc { width: 100%; height: auto; position: relative; float: left; background-color: #fff; display: none;}
#view-faixa-de-ugcs { width: 1200px; height: auto; position: relative; margin: auto; }
#view-faixa-de-ugcs h5 { width: 100%; height: auto; position: relative; float: left; margin-top: 150px; text-align: center; color: #08646E; font-size: 55px; font-weight: 600; padding: 0px 200px; }
/*inicio faixa cards UGCs int*/
#faixa-cards-ugcs-int { width: 100%; height: 580px; position: relative; float: left; margin-top: 40px; }
/*Inicio card UGC*/
.item-card-ugc { width: 30%; height: 600px; position: relative; float: left; background-color: #dadada; border-radius: 40px; overflow: hidden; }
.foto-int-card-ugc { position: relative; overflow: hidden; }
.foto-int-card-ugc video { width: 100%; height: 100%; object-fit: cover; display: block; }
.mascara-conteudo-ugc { width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; z-index: 90; cursor: pointer; }
.box-estrelas-ugc { width: 200px; height: auto; position: absolute; left: 30px; top: 30px; }
.item-estrela-ugc { width: 25px; height: 25px; position: relative; float: left; margin-top: 10px; margin-right: 10px; background: url('../img/estrela.png'); background-size: 25px; -webkit-background-size: 25px; -moz-background-size: 25px; -o-background-size: 25px; transform-origin: center; -webkit-transform-origin: center; -moz-transform-origin: center; -ms-transform-origin: center; -o-transform-origin: center; animation: estrela-ugc-balanco 3.5s cubic-bezier(0.45, 0, 0.55, 1) infinite alternate; -webkit-animation: estrela-ugc-balanco 3.5s cubic-bezier(0.45, 0, 0.55, 1) infinite alternate; -moz-animation: estrela-ugc-balanco 3.5s cubic-bezier(0.45, 0, 0.55, 1) infinite alternate; -o-animation: estrela-ugc-balanco 3.5s cubic-bezier(0.45, 0, 0.55, 1) infinite alternate; will-change: transform; }
@keyframes estrela-ugc-balanco {
from { transform: rotate(-40deg); }
to { transform: rotate(40deg); }
}
@-webkit-keyframes estrela-ugc-balanco {
from { -webkit-transform: rotate(-40deg); transform: rotate(-40deg); }
to { -webkit-transform: rotate(40deg); transform: rotate(40deg); }
}
@-moz-keyframes estrela-ugc-balanco {
from { -moz-transform: rotate(-40deg); transform: rotate(-40deg); }
to { -moz-transform: rotate(40deg); transform: rotate(40deg); }
}
@-o-keyframes estrela-ugc-balanco {
from { -o-transform: rotate(-40deg); transform: rotate(-40deg); }
to { -o-transform: rotate(40deg); transform: rotate(40deg); }
}
.icn-segmento { width: 50px; height: 50px; position: absolute; right: 25px; top: 30px; background-color: #08646E; border-radius: 50%; }
.icn-int { width: 24px; height: 24px; position: absolute; left: 50%; top: 50%; margin-left: -12px; margin-top: -12px; }
.tag-nome-ugc { width: auto; height: auto; position: absolute; left: 20px; bottom: 30px; background-color: #fff; padding: 10px 25px; color: #000; font-size: 22px; border-radius: 60px; }
.tag-play { width: 55px; height: 55px; position: absolute; right: 20px; bottom: 30px; background-color: #2BD33A; border-radius: 50%; }
.icn-tag-play { width: 45px; height: 45px; position: absolute; left: 50%; top: 50%; margin-left: -22.5px; margin-top: -22.5px; background: url('../img/play-ugc.png'); background-size: 45px; }
/*controles ugc*/
.item-controle-ugc { width: 100px; height: 100px; position: absolute; left: -170px; top: 50%; margin-top: 545px; background-color: #2bd33a; border-radius: 50%; cursor: pointer; }
.item-controle-ugc-b { width: 100px; height: 100px; position: absolute; right: -170px; top: 50%; margin-top: 545px; background-color: #2bd33a; border-radius: 50%; cursor: pointer; }
.seta-int-controle-ugc { width: 70px; height: 70px; position: absolute; left: 50%; top: 50%; margin-left: -35px; margin-top: -35px; }
.item-controle-ugc:hover { background-color: #26B933; }
.item-controle-ugc-b:hover { background-color: #26B933; }
#faixa-infos-carrossel-ugc { width: 100%; height: auto; position: relative; float: left; font-size: 30px; color: #08646E; text-align: center; margin-top: 100px; padding: 0px 260px; }
#div-s4 {
width: 100%;
height: 1130px;
position: relative;
float: left;
margin-top: 0px;
padding-top: 70px;
padding-bottom: 70px;
background-color: #3CD272;
}
#div-s4-bg { width: 100%; height: 470px; position: absolute; top: 50%; margin-top: -240px; background-color: #3cd272; }
#view-div-s4 { width: 1400px; height: 1000px; position: relative; margin: auto; }
/*Inicio calculadora tempo real*/
#box-calculadora-tempo-real { width: 500px; height: 700px; position: relative; float: left; margin-top: 120px; background-color: #FFF; border-radius: 40px; -webkit-box-shadow: 0px 0px 84px 0px rgba(0, 0, 0, 0.15); -moz-box-shadow: 0px 0px 84px 0px rgba(0, 0, 0, 0.15); -ms-box-shadow: 0px 0px 84px 0px rgba(0, 0, 0, 0.15); -o-box-shadow: 0px 0px 84px 0px rgba(0, 0, 0, 0.15); box-shadow: 0px 0px 84px 0px rgba(0, 0, 0, 0.15); }
#div-titulo-calculadora-tempo-real { width: 100%; height: 50px; position: relative; float: left; margin-top: 70px; font-size: 44px; color: #08646E; text-align: center; font-weight: 600; }
#div-valor-final-calculadora-tempo { width: 100%; height: auto; position: relative; float: left; margin-top: 30px; }
#div-resultado-calculadora-interno { width: 80%; height: auto; position: relative; margin: auto; background-color: #41C771; padding: 30px 20px; color: #fff; text-align: left; font-size: 14px; border-radius: 16px; }
#div-resultado-final-txt { width: 100%; height: auto; position: relative; float: left; color: #fff; text-align: left; font-size: 24px; margin-top: -18px; font-weight: 600; }
#legenda-tempo-resultado-tempo-real { width: auto; height: auto; position: absolute; right: 20px; top: 17px; font-size: 18px; color: #fff; }
.faixa-item-slider-r-tr { width: 100%; height: auto; position: relative; float: left; margin-top: 10px; }
.caixa-externa-componente-slider { width: 80%; height: 150px; position: relative; margin: auto; background-color: #F3F3F3; border-radius: 20px; }
.bloqueio-componente-slider { width: 100%; height: 100%; position: absolute; top: 0px; z-index: 90; }
/*Inicio componente de slider*/
.componente-slider { background: #f3f3f3; border-radius: 18px; padding: 24px 18px; }
.componente-slider { background: #f3f3f3; border-radius: 18px; padding: 24px 18px; }
.input-slider input[type=range] { -webkit-appearance: none; appearance: none; width: 100%; height: 20px; /* trilha maior */ border: 0 !important; border-radius: 999px; outline: none; background: linear-gradient(to right, #43d167 0%, #43d167 50%, #dcdcdc 50%, #dcdcdc 100%); }
/* esconde balão materialize */
input[type=range] + .thumb { display: none !important; }
/* trilha */
.input-slider input[type=range]::-webkit-slider-runnable-track { height: 20px; background: transparent; border-radius: 999px; }
/* bolinha maior */
.input-slider input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 36px; height: 36px; border-radius: 50%; background: #43d167; border: none; margin-top: -8px; /* centraliza */ box-shadow: 0 6px 16px rgba(67, 209, 103, 0.35); cursor: pointer; }
/* Firefox */
.input-slider input[type=range]::-moz-range-track { height: 20px; background: #dcdcdc; border-radius: 999px; }
.input-slider input[type=range]::-moz-range-progress { height: 20px; background: #43d167; border-radius: 999px; }
.input-slider input[type=range]::-moz-range-thumb { width: 36px; height: 36px; border-radius: 50%; background: #43d167; border: none; box-shadow: 0 6px 16px rgba(67, 209, 103, 0.35); }
.faixa-info-slider { width: 100%; height: auto; position: relative; float: left; margin-top: -38px; }
.faixa-info-slider p { width: 50%; height: auto; position: relative; float: left; font-size: 19px; color: #07646E; padding: 0px 20px; margin-top: 28px; }
.box-info-resultado-slider { width: auto; height: auto; position: relative; float: right; margin-right: 20px; margin-top: 20px; padding: 10px 20px; font-size: 18px; color: #fff; background-color: #41C771; border-radius: 12px; }
/*Inicio cta calculadora tempo real*/
#faixa-calculadora-tempo-real { width: 100%; height: auto; position: relative; float: left; margin-top: 24px; }
#cta-simular-projeto-calc-tr { width: 320px; height: auto; position: relative; margin: auto; background-color: #2BD33A; padding: 15px 30px 15px 32px; color: #fff; font-size: 22px; border-radius: 100px; cursor: pointer; }
#cta-simular-projeto-calc-tr:hover { background-color: #27BE34; }
#circulo-ornamento-cta-cal-tr { width: 44px; height: 44px; position: absolute; right: 10px; top: 10px; background-color: #fff; border-radius: 50%; }
#ornamento-c-cta-tr { width: 40px; height: 40px; position: absolute; left: 50%; top: 50%; margin-left: -20px; margin-top: -20px; background: url('../img/raios.png'); background-size: 40px; }
#carta-verde { width: 590px; height: 619px; position: absolute; right: 0px; top: 160px; background: url('../img/conta-verde.png'); background-size: 581px; z-index: 90; }
#carta-vermelha { width: 550px; height: 619px; position: absolute; right: 290px; top: 150px; background: url('../img/conta-vermelha.png'); background-size: 550px; }
#numeros-conta-verde { width: 100%; height: auto; position: relative; float: left; margin-top: 249px; font-size: 34px; transform: rotate(10deg); rotate: 60.8; color: #2BD33A; font-weight: 600; text-align: center; font-weight: 800; }
#numeros-conta-vermelha { width: 100%; height: auto; position: relative; float: left; margin-top: 249px; font-size: 34px; transform: rotate(-13deg); rotate: 60.8; color: #E51311; font-weight: 600; text-align: center; font-weight: 800; }
/*Inicio avaliações do google*/
#div-avaliacoes-google { width: 100%; height: auto; position: relative; float: left; margin-top: 70px; }
#chamada-avaliacoes-google { width: 100%; height: auto; position: relative; float: left; }
#view-chamada-avaliacoes-google { width: 1200px; height: auto; position: relative; margin: auto; }
#view-chamada-avaliacoes-google h4 { width: 100%; height: auto; position: relative; float: left; font-size: 60px; color: #06646E; font-weight: 700; text-align: center; }
#view-chamada-avaliacoes-google p { width: 100%; height: auto; position: relative; float: left; margin-top: -5px; line-height: 45px; font-size: 35px; color: #06646E; font-weight: 300; text-align: center; padding: 0px 280px; }
#faixa-cards-slide-google { width: 100%; height: auto; position: relative; float: left; margin-top: 40px; }
.item-card-dep-google { width: auto; height: 330px !important; position: relative; float: left; background-color: #F3F3F3; border-radius: 30px; }
.titulo-card-google { width: 100%; height: auto; position: relative; float: left; margin-top: 50px; padding: 0px 40px; font-size: 26px; color: #08646E; font-weight: 600; }
.logo-google { width: 60px; height: 60px; position: absolute; right: 40px; top: 35px; background: url('../img/g-logo.png'); background-size: 60px; }
.dep-txt { width: 100%; height: auto; position: relative; float: left; margin-top: 30px; padding: 0px 40px; font-size: 20px; color: #06646E; }
.faixa-card-google-estrelas { width: 100%; height: auto; position: absolute; bottom: 30px; padding: 0px 40px; }
.item-estrela-card-google { width: 25px; height: 25px; position: relative; float: left; margin-right: 10px; background: url('../img/estrela-depoimento.png'); background-size: 25px; }
.item-estrela-card-google { animation: balanco-suave 4s cubic-bezier(0.45, 0, 0.55, 1) infinite alternate; transform-origin: center; will-change: transform; }
@keyframes balanco-suave {
from { transform: rotate(-40deg); }
to { transform: rotate(40deg); }
}
#faixa-navegacao-slider { width: 100%; height: auto; position: relative; float: left; margin-top: 60px; }
#view-navegacao { width: 500px; height: auto; position: relative; margin: auto; }
#item-nav-dp-e { width: 70px; height: 70px; position: relative; float: left; background-color: #08646E; border-radius: 50%; cursor: pointer; }
#item-nav-dp-d { width: 70px; height: 70px; position: relative; float: right; background-color: #08646E; border-radius: 50%; cursor: pointer; }
#item-nav-dp-e:hover { background-color: #2BD33A; }
#item-nav-dp-d:hover { background-color: #2BD33A; }
#seta-e-int-dep { width: 40px; height: 40px; position: absolute; left: 50%; top: 50%; margin-top: -20px; margin-left: -20px; background: url('../img/seta-e-dep.png'); background-size: 40px; }
#seta-d-int-dep { width: 40px; height: 40px; position: absolute; left: 50%; top: 50%; margin-top: -20px; margin-left: -20px; background: url('../img/seta-d-dep.png'); background-size: 40px; }
#paginacao-dep-dots { width: 300px; height: auto; position: relative; margin: auto; }
#paginacao-dep-dots { width: 300px; max-width: 100%; height: auto; position: relative; margin: 0 auto; display: flex; justify-content: center; align-items: center; gap: 10px; padding-top: 30px; }
/* faz o swiper parar de usar posicionamento absoluto na paginação */
#paginacao-dep-dots.swiper-pagination { position: relative !important; inset: auto !important; left: auto !important; bottom: auto !important; top: auto !important; transform: none !important; width: 300px !important; display: flex; justify-content: center; align-items: center; gap: 10px; }
/* bolinhas */
#paginacao-dep-dots .swiper-pagination-bullet { width: 20px; height: 20px; margin: 0 !important; border-radius: 50%; opacity: 1; background: #b8e48d; flex: 0 0 auto; transition: 0.25s ease; }
/* bolinha ativa */
#paginacao-dep-dots .swiper-pagination-bullet-active { background: #38c96b; }
/*Inicio continue pelo seu perfil*/
#div-c-perfil { width: 100%; height: auto; position: relative; float: left; padding-top: 50px; }
#div-c-perfil-view { width: 1500px; height: auto; position: relative; margin: auto; }
.div-c-perfil-view-a { width: 60%; height: 500px; position: relative; float: left; }
#foto-selecao-perfil { width: 100%; height: 600px; position: relative; float: left; margin-top: 120px; border-radius: 60px; overflow: hidden; }
#foto-int-selecao-perfil { width: 900px; height: 604px; position: absolute; left: 50%; top: 50%; margin-left: -450px; margin-top: -302px; background: url('../img/foto-selecao-perfil.jpg'); background-size: 900px; }
#foto-int-selecao-perfil video { width: 100%; height: 100%; object-fit: cover; display: block; }
#conteudo-div-foto-perfil { width: 100%; height: auto; position: relative; float: left; top: 50%; left: -70px; margin-top: -35px; font-size: 45px; text-align: center; color: #fff; z-index: 90; }
#raio-txt { width: 50px; height: 50px; position: absolute; right: 150px; top: 10px; background: url('../img/ornamento-logo.png'); background-size: 50px; }
.div-c-perfil-view-b { width: 40%; height: atuo; position: relative; float: left; margin-top: 230px; padding: 0px 60px; }
.item-link-perfil { width: 100%; height: auto; position: relative; float: left; padding: 0px 0px; padding-bottom: 20px; border-bottom: 1px solid #06646E; margin-bottom: 50px; cursor: pointer; }
.icn-link-perfil { width: 70px; height: 70px; position: relative; float: left; background-color: #08646E; border-radius: 20px; overflow: hidden; transition: background-color 0.25s ease; }
.icn-int-link-perfil { width: 30px; height: 30px; position: absolute; left: 50%; top: 50%; margin-left: -15px; margin-top: -15px; }
.txt-link-perfil { width: auto; height: auto; position: relative; float: left; margin-left: 20px; margin-top: 22px; font-size: 20px; color: #07646E; transition: color 0.25s ease; }
.seta-link-menu { width: 45px; height: 45px; position: absolute; right: 0px; top: 14px; background: url('../img/arrow-menu-link.png'); background-size: 45px; }
.item-link-perfil:hover { border-bottom: 1px solid #37C96B; }
.item-link-perfil:hover .icn-link-perfil { background-color: #37C96B; }
.item-link-perfil:hover .icn-int-link-perfil { animation: icone-link-sai-volta 0.75s cubic-bezier(0.45, 0, 0.25, 1) forwards; }
.item-link-perfil:hover .seta-link-menu { background: url('../img/arrow-menu-link-hover.png'); background-size: 45px; }
.item-link-perfil:hover .txt-link-perfil { color: #37C96B; }
@keyframes icone-link-sai-volta {
0% { transform: translateX(0); opacity: 1; }
45% { transform: translateX(150%); opacity: 0; }
46% { transform: translateX(-150%); opacity: 0; }
100% { transform: translateX(0); opacity: 1; }
}
/*Inicio lista de comparação*/
#div-comparacao-concorrente { width: 100%; height: auto; position: relative; float: left; margin-top: 300px; }
#view-div-comparacao-concorrente { width: 1200px; height: auto; position: relative; margin: auto; }
#view-div-comparacao-concorrente h5 { width: 100%; height: auto; position: relative; float: left; font-size: 50px; color: #08646E; line-height: 64px; text-align: center; }
#view-div-comparacao-concorrente span { font-weight: 700; }
#view-listas-int { width: 100%; height: auto; position: relative; float: left; margin-top: 50px; }
.div-listas-comparacao { width: 50%; height: auto; position: relative; float: left; }
.lista-comp-d { padding-left: 140px; }
#topo-lista-atrek { width: 100%; height: auto; position: relative; float: left; }
#logo-lista-atrek { width: 50%; height: auto; position: relative; float: left; padding: 0px 40px; }
#logo-parceiro-intelbras { width: 40%; height: auto; position: relative; float: left; margin-left: 10%; padding: 0px 40px; }
#topo-lista-concorrente { width: 100%; height: auto; position: relative; float: left; font-size: 46px; margin-top: 29px; color: #07646E; font-weight: 700; }
.bloco-itens-lista-comparacao { width: 100%; height: auto; position: relative; float: left; }
.item-lista-comparacao { width: 100%; height: auto; position: relative; float: left; margin-top: 35px; }
.icn-item-lista-comparacao { width: 30px; height: 30px; position: relative; float: left; }
.txt-lista-comparacao { width: 75%; height: auto; position: relative; float: left; margin-left: 15px; font-size: 19px; margin-top: 2px; color: #07646F; }
.box-comparacao-lista-desaque { width: 100%; height: auto; position: relative; float: left; margin-top: 55px; margin-bottom: 30px; }
.box-int-destaque-lista { width: 70%; height: 500px; position: relative; float: left; margin-left: 40px; background-color: #1CC636; border-radius: 20px; overflow: hidden; padding: 0px 30px; }
.box-int-destaque-lista h3 { width: 100%; height: auto; position: relative; float: left; margin-top: 50px; font-size: 32px; color: #fff; font-weight: 600; }
.item-lista-destaque { width: 100%; height: auto; position: relative; float: left; padding: 0px 0px; margin-top: 20px; margin-bottom: 15px; }
.icn-lista-comparacao { width: 40px; height: 40px; position: relative; float: left; }
.txt-lista-destaque { width: 70%; height: auto; position: relative; float: left; margin-top: 0px; margin-left: 14px; font-size: 18px; color: #fff; font-weight: 300; }
.fix-l-1 { margin-top: 10px; }
.fix-l-2 { margin-top: -6px; }
.fix-l-3 { margin-top: -5px; }
#faixa-lista-b-comp { width: 100%; height: auto; position: relative; float: left; margin-top: 30px; }
.sessao-lista-b-comp { width: 20%; height: auto; position: relative; float: left; margin-top: 0px; }
.sessao-lista-b-comp-2 { width: 60%; height: auto; position: relative; float: left; padding-left: 140px; margin-top: 0px; }
.logo-atrek-lista-b { width: 100%; height: auto; position: relative; float: left; margin-top: 7px; padding: 20px 60px 20px 20px; }
.logo-intelbras-lista-b { width: 100%; height: auto; position: relative; float: right; margin-top: 7px; padding: 20px 20px 20px 90px; }
.itemlista-b-comp { width: 100%; height: auto; position: relative; float: left; margin-bottom: 15px; }
.icn-lista-b-comp { width: 31px; height: 31px; position: relative; float: left; margin-right: 15px; }
.txt-lista-b-comp { width: 90%; height: auto; position: relative; float: left; font-size: 22px; color: #000; }
/*chamada economia*/
#faixa-economia { width: 100%; height: auto; position: relative; float: left; margin-top: 100px; line-height: 40px; }
#view-faixa-economia { width: 90%; height: auto; position: relative; margin: auto; max-width: 1700px; }
#view-faixa-economia h6 { width: 30%; height: auto; position: relative; float: left; font-size: 69px; font-family: "Bebas Neue", sans-serif; text-transform: uppercase; color: #0A5059; line-height: 59px; margin-top: 65px; }
#view-faixa-economia span { color: #2BD33A; }
.item-bloco-economia { width: 33%; height: 250px; position: relative; float: left; margin-left: 2%; background-color: #0A5059; border-radius: 20px; overflow: hidden; }
.logo-ornamento-g-economia { width: 30%; height: 100%; position: relative; float: left; }
.logo-ornamento-int-g { width: 80px; height: 80px; position: absolute; left: 50%; top: 50%; margin-left: -40px; margin-top: -50px; }
.txt-bloco-economia { width: 70%; height: auto; position: relative; float: left; margin-top: 72px; font-size: 35px; color: #fff; }
.txt-valor-bloco-economia { width: 70%; height: auto; position: relative; float: left; margin-top: 5px; color: #2BD33A; font-size: 48px; }
.f-v-1 { font-size: 27px; }
.f-v-2 { font-size: 27px; color: #fff !important; }
.ft-int-bloco-economia { width: 580px; height: 300px; position: absolute; left: 50%; top: 50%; margin-left: -295px; margin-top: -170px; background: url('../img/casa-economia.png'); background-size: 580px; }
/*Inicio bloco video rodape*/
#inicio-bloco-video-rodape { width: 100%; height: auto; position: relative; float: left; margin-top: 40px; }
#view-bloco-video-rodape { width: 1200px; height: auto; position: relative; margin: auto; }
#view-bloco-video-rodape h6 { width: 100%; height: auto; position: relative; float: left; margin-top: 95px; font-size: 45px; color: #0A5059; text-align: center; }
.span-titulo { font-weight: 700; }
#faixa-player-video-rodape { width: 100%; height: auto; position: relative; float: left; margin-top: 30px; }
#player-yt-rodape { width: 1200px; height: 675px; position: relative; margin: auto; border-radius: 30px; overflow: hidden; }
/*inicio rodape*/
#div-rodape { width: 100%; height: auto; position: relative; float: left; margin-top: 120px; padding-bottom: 150px; }
#view-div-rodape { width: 1400px; height: auto; position: relative; margin: auto; }
#faixa-logo-rodape { width: 100%; height: auto; position: relative; float: left; }
#logo-rodape { width: 300px; height: auto; position: relative; margin: auto; }
#faixa-sessao-rodape { width: 100%; height: auto; position: relative; float: left; }
.sessa-a-rodape { width: 36.5% !important; }
.sessao-rodape { width: 25%; height: auto; position: relative; float: left; }
.chamada-rodape { width: 100%; height: auto; position: relative; float: left; margin-top: 15px; margin-bottom: 15px; font-size: 34px; color: #06646E; font-weight: 600; }
.sessao-rodape ul li { width: 100%; height: auto; position: relative; float: left; font-size: 20px; color: #06646E; margin-bottom: 10px; cursor: pointer; }
.sessao-rodape ul li:hover { color: #11AF4A; }
.faixa-ctas-rodape { width: 100%; height: auto; position: relative; float: left; margin-bottom: 5px; padding-top: 80px; }
.cta-rodape { width: 320px; height: auto; position: relative; margin: auto; padding: 17px 60px 17px 30px; background-color: #2BD33A; border-radius: 50px; color: #fff; font-size: 19px; cursor: pointer; }
.cta-rodape:hover { background-color: #37C96B; }
#icn-wpp-rodape { width: 40px; height: 40px; position: absolute; right: 12px; background: url('../img/wpp.png'); background-size: 40px; top: 11px; }
/*inicio cta privacidade*/
#cta-politica-privacidade { width: 320px; height: auto; position: relative; margin: auto; margin-top: 20px; text-align: center; padding: 17px 30px 17px 30px; border-radius: 50px; color: #0A5059; border: 1px solid #0A5059; font-size: 19px; cursor: pointer; }
#cta-politica-privacidade:hover { background-color: #26BF22; color: #fff; border: 1px solid #26BF22; }
#faixa-parceiros-rodape { width: 38.5%; height: auto; position: relative; float: left; padding-left: 40px; }
.item-rodape-parceiro { width: 50%; height: auto; position: relative; float: left; padding-top: 120px; }
.legenda-parceiro-rodape { width: 100%; height: auto; position: relative; float: left; font-size: 17px; color: #28666E; text-align: center; }
.logo-parceiro-rodape { width: 100%; height: auto; position: relative; float: left; margin-top: 10px; padding: 0px 40px; }
.toast { top: 35px; width: auto; margin-top: 10px; max-width: 100%; height: auto; min-height: 48px; line-height: 1.5em; word-break: break-all; background-color: #2BD33A; padding: 10px 25px; font-size: 1.1rem; font-weight: 700; color: #0A5059; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; cursor: default; }
/*Inicio resultado calculo*/
#mascara-formulario { width: 100%; height: 0%; position: fixed; top: 0px; background-color: #10162e; opacity: 0; z-index: 1998; }
#janela-resultado-economia { width: 1000px; height: 600px; position: fixed; top: -250%; left: 50%; margin-left: -500px; margin-top: -300px; background-color: #fff; border-radius: 30px; z-index: 9999 !important; overflow: hidden; opacity: 0; display: none; }
#toolbar-janela-economia { width: 100%; height: 100px; position: absolute; top: 20px; z-index: 90; padding: 0px 40px; }
#logo-janela-atrek-cal-economia { width: 170px; height: auto; position: relative; float: left; margin-top: 25px; }
#fechar-janela-resultado-economia { width: 50px; height: 50px; position: relative; float: right; margin-top: 35px; background: url('../img/icn-x.png'); background-size: 50px; background-repeat: no-repeat; cursor: pointer; }
#voltar-janela-resultado-economia { width: 50px; height: 50px; position: relative; float: right; margin-top: 35px; margin-right: 10px; background: url('../img/back.png'); background-size: 50px; background-repeat: no-repeat; cursor: pointer; opacity: 0; }
#janela-etapas-resultado-economia { width: 3000px; height: 100%; margin-left: 0px; position: relative; float: left; top: 0px; overflow: hidden; }
#etapa-1-calc-economia { width: 100%; height: 100%; position: relative; float: left; }
#faixa-box-resultados-janela { width: 1000px; height: 100%; left: 0px; position: relative; float: left; margin-top: 155px; padding-left: 46px; }
#box-resultado-porcentagem { width: 48%; height: 260px; position: relative; float: left; background-color: #0A5059; border-radius: 20px; }
#box-resultado-calculo-final { width: 45%; height: 260px; position: relative; float: left; margin-left: 2%; background-color: #0A5059; border-radius: 20px; }
/*Box resultado porcentagem*/
#ornamento-logo-atrek-resultado { width: 50px; height: 57px; position: absolute; right: 40px; top: 45px; background: url('../img/ornamento-logo-g.png'); background-size: 50px; }
#chamada-resultado-porecentagem { width: 100%; height: auto; position: relative; float: left; margin-top: 30px; padding: 10px 200px 0px 30px; font-size: 24px; line-height: 30px; color: #fff; font-weight: 300; }
#linha-resultado-porcentagem { width: 100%; height: auto; position: relative; float: left; margin-top: 5px; padding: 0px 40px; }
#box-resultado-porcentagem-int { width: 100px; height: 100%; position: relative; float: left; margin-top: 12px; font-size: 68px; color: #2BD33A; font-weight: 400; font-family: "Bebas Neue", sans-serif; }
#legenda-resultado-porcentagem { width: auto; height: auto; position: relative; float: right; margin-top: 37px; line-height: 25px; font-size: 20px; color: #2BD33A; margin-right: 5px; }
/*esteira etapas calculadora*/
#esteira-etapas-calculadora { width: 300%; height: auto; position: absolute; }
/*total de economia*/
#faixa-resultado-total-economia { width: 100%; height: 200px; position: relative; float: left; margin-top: 50px; }
#legenda-total-economia { width: 100px; height: auto; position: relative; float: left; margin-left: 30px; margin-top: 45px; line-height: 30px; font-size: 26px; color: #2BD33A; }
#valor-final-economia-janela { width: 200px; height: auto; position: relative; float: right; margin-right: 30px; margin-top: 45px; text-align: right; font-size: 50px; font-weight: 400; color: #2BD33A; font-family: "Bebas Neue", sans-serif; }
#faixa-cta-janela-resultado { width: 100%; height: auto; position: relative; float: left; margin-top: 10px; padding: 0px 0px; }
#chamada-cta-janela-resultado { width: 55%; height: auto; position: relative; float: left; margin-top: 30px; padding: 0px 10px; font-size: 20px; color: #0A5059; }
#box-cta-janela-resultado { width: 40%; height: auto; position: relative; float: left; margin-top: 30px; }
#cta-s-completa-a { width: auto; height: auto; position: relative; float: right; padding: 16px 40px; background-color: #2BD33A; font-size: 18px; color: #fff; border-radius: 90px; cursor: pointer; }
#cta-s-completa-a:hover { background-color: #23AD30; }
#faixa-box-dados-janela { width: 1000px; height: 100%; position: relative; float: left; padding: 0px 22px; margin-top: 145px; /* margin-left: 46px; */ }
.linha-janela-campos { width: 100%; height: auto; position: relative; float: left; }
.item-campo-formulario-janela { width: 27%; height: auto; position: relative; float: left; padding: 0px 0px; margin-left: 1.5%; margin-right: 4.5%; }
.item-campo-formulario-janela input { width: 100%; height: auto; position: relative; float: left; font-size: 18px !important; background-color: #F3F3F3 !important; border-radius: 20px !important; padding: 10px 20px !important; border: 0px solid #fff !important; color: #07646E; }
.item-campo-formulario-janela-2x { width: 63%; height: auto; position: relative; float: left; padding: 0px 20px; margin-left: 1.5%; margin-right: 1.5%; }
.item-campo-formulario-janela-2x input { width: 100%; height: auto; position: relative; float: left; font-size: 18px !important; background-color: #F3F3F3 !important; border-radius: 20px !important; padding: 10px 20px !important; border: 0px solid #fff !important; color: #07646E; }
.item-campo-formulario-janela-2x { width: 65%; height: auto; position: relative; float: left; padding: 2px 0px; margin-left: 1%; margin-right: 0px; }
.item-campo-formulario-janela-2x .select-wrapper { background: unset; border-radius: 12px; padding: 0 7px; height: 70px; margin-top: 5px; display: flex; align-items: center; }
.item-campo-formulario-janela-2x .select-wrapper input.select-dropdown { border: none !important; height: 46px; line-height: normal; font-size: 20px; display: flex; padding-top: 20px; padding-left: 20px; align-items: center; color: #08646E; }
.item-campo-formulario-janela-2x .select-wrapper::after { content: ""; position: absolute; right: 26px; top: 27px; transform: translateY(-50%); width: 30px; height: 30px; background: url("../img/seta-select.png") no-repeat center; background-size: contain; pointer-events: none; }
.select-wrapper { background: #F3F3F3; border-radius: 12px; padding: 0 16px; height: 57px; display: flex; align-items: center; }
.select-wrapper::after { content: ""; position: absolute; right: 26px; top: 35px; transform: translateY(-50%); width: 30px; height: 30px; background: url("../img/seta-select.png") no-repeat center; background-size: contain; pointer-events: none; }
#faixa-envio-foto-cta { width: 100%; height: auto; position: relative; float: left; margin-top: 10px; padding: 0px 0px; }
#campo-envio-foto { width: 48%; height: auto; position: relative; float: left; margin-left: 2%; padding: 30px 30px; background-color: #F3F3F3; font-size: 20px; color: #0A5059; border-radius: 15px; cursor: pointer; }
#gif-upload-foto { width: 100px; height: 100px; position: absolute; right: 20px; top: 50%; margin-top: -50px; background: url('../img/gif-upload-foto.gif'); background-size: 100px; }
#faixa-cta-ultima-etapa-calc { width: 50%; height: auto; position: relative; float: left; }
#cta-s-completa-b { width: auto; height: auto; position: relative; float: right; margin-top: 35px; padding: 16px 40px; margin-right: 12px; background-color: #2BD33A; font-size: 18px; color: #fff; border-radius: 90px; cursor: pointer; }
#cta-s-completa-b:hover { background-color: #23AD30; }
#alerta-coleta-dados { width: 98%; height: auto; position: relative; float: left; padding: 18px 20px; background-color: #f8fff2; border-radius: 20px; font-size: 18px; margin-left: 18px; margin-top: 21px; color: #2f8e38; border: 1px solid #d0fbd0; }
#janela-envio-calculo { width: 1000px; height: 100%; position: relative; float: left; padding: 0px 22px; margin-top: 160px; display: block; }
#nome-usuario-calculo { width: 100%; height: auto; position: relative; float: left; margin-top: 170px; color: #2BD33A; font-size: 50px; text-align: center; font-weight: 600; }
#info-envio-dados { width: 100%; height: auto; position: relative; float: left; font-size: 22px; color: #0A5059; text-align: center; padding: 0px 180px; }
#barra-de-progresso { width: 100%; height: auto; position: relative; float: left; margin-top: 20px; }
#barra-progresso-int { width: 80%; height: 30px; position: relative; margin: auto; background-color: #F3F3F3; overflow: hidden; border-radius: 30px; }
#barra-int-progresso { width: 100%; height: 100%; position: absolute; left: -100%; background-color: #2BD33A; }
#logo-a-trek-contato-enviado { width: 100%; height: 50px; position: absolute; bottom: 70px; }
#logo-atrek-contato-enviado { width: 170px; height: auto; position: relative; margin: auto; }
/*janela menu seleção perfil desktop*/
#janela-menu-selecao-desktop {
width: 810px;
height: 480px;
position: fixed;
left: 50%;
top: 0;
margin-left: -550px;
margin-top: 140px;
background-color: #fff;
border-radius: 50px;
z-index: 2999;
opacity: 0;
visibility: hidden;
pointer-events: none;
transition: opacity 200ms ease, visibility 0s linear 200ms;
will-change: opacity;
}
#janela-menu-selecao-desktop.ativo { opacity: 1; visibility: visible; pointer-events: auto; transition: opacity 200ms ease, visibility 0s linear 0s; }
#marcador-menu-fixo { width: 40px; height: 40px; position: absolute; left: 69px; top: -16px; border-radius: 6px; transform: rotate(45deg); background-color: #fff; }
.div-menu-select-perfil-fixo { width: 60%; height: auto; position: relative; float: left; padding: 0px 40px; }
#div-ilustra-select-perfil-fixo { width: 40%; height: 100%; position: relative; float: left; }
#foto-perfil-m-fixo { width: 260px; height: 360px; position: absolute; left: 50%; top: 50%; margin-left: -145px; margin-top: -180px; background-color: #dadada; border-radius: 30px; overflow: hidden; }
#video-perfil-m-fixo { width: 100%; height: 100%; object-fit: cover; display: block; }
.div-menu-select-perfil-fixo h4 { width: 100%; height: auto; position: relative; float: left; font-size: 30px; font-weight: 600; margin-top: 60px; margin-bottom: 36px; color: #08646e; }
.item-link-perfil-b { width: 100%; height: auto; position: relative; float: left; padding: 0px 0px; padding-bottom: 20px; border-bottom: 1px solid #06646E; margin-bottom: 21px; cursor: pointer; }
.icn-link-perfil-b { width: 60px; height: 60px; position: relative; float: left; background-color: #08646E; border-radius: 20px; overflow: hidden; transition: background-color 0.25s ease; }
.icn-int-link-perfil-b { width: 24px; height: 24px; position: absolute; left: 50%; top: 50%; margin-left: -12px; margin-top: -12px; }
.txt-link-perfil-b { width: auto; height: auto; position: relative; float: left; margin-left: 20px; margin-top: 22px; font-size: 20px; color: #07646E; transition: color 0.25s ease; }
.seta-link-menu-b { width: 45px; height: 45px; position: absolute; right: 0px; top: 14px; background: url('../img/arrow-menu-link.png'); background-size: 45px; }
.item-link-perfil-b:hover { border-bottom: 1px solid #37C96B; }
.item-link-perfil-b:hover .icn-link-perfil-b { background-color: #37C96B; }
.item-link-perfil-b:hover .icn-int-link-perfil-b { animation: icone-link-sai-volta-b 0.75s cubic-bezier(0.45, 0, 0.25, 1) forwards; }
.item-link-perfil-b:hover .seta-link-menu-b { background: url('../img/arrow-menu-link-hover.png'); background-size: 45px; }
.item-link-perfil-b:hover .txt-link-perfil-b { color: #37C96B; }
@keyframes icone-link-sai-volta-b {
0% { transform: translateX(0); opacity: 1; }
45% { transform: translateX(150%); opacity: 0; }
46% { transform: translateX(-150%); opacity: 0; }
100% { transform: translateX(0); opacity: 1; }
}
/*Janela player UGC*/
#janela-player-ugc { width: 394px; height: 700px; position: fixed; left: 50%; top: 50%; margin-left: -197px; margin-top: -350px; background-color: #fff; overflow: hidden; border-radius: 30px; z-index: 1999; display: none; opacity: 0; }
#fechar-player-ugc { width: 70px; height: 70px; position: absolute; right: 30px; top: 30px; background-color: #fff; border-radius: 50%; cursor: pointer; z-index: 99; }
#fechar-icn-ugc { width: 60px; height: 60px; position: absolute; left: 50%; top: 50%; margin-left: -30px; margin-top: -30px; background: url('../img/icn-x.png'); background-size: 60px; }
/*Inicio media queries*/
@media only screen
and (min-width:1200px) and (max-width:1500px) {
#menu-fixo { width: 1100px; height: 80px; position: relative; margin: auto; background-color: #fff; border-radius: 60px; border: 1px solid #eeeeee; }
#lista-itens-menu-fixo { width: 53%; height: auto; position: relative; float: left; margin-left: 20px; margin-top: 9px; }
#lista-itens-menu-fixo ul li { width: auto; height: auto; position: relative; float: left; font-size: 20px; color: #fff; margin-right: 17px; }
/*Inicio banner topo*/
#banner-topo { width: 100%; height: 940px; position: relative; float: left; overflow: hidden; }
#view-banner-topo { width: 1050px; height: auto; position: relative; margin: auto; }
#conteudo-banner-topo { width: 100%; height: auto; position: absolute; top: 50%; margin-top: -160px; }
#conteudo-banner-topo h1 { width: 100%; height: auto; position: relative; float: left; font-size: 50px; color: #fff; font-weight: 700; }
#view-faixa-calculadora-economia { width: 1150px; height: auto; position: relative; margin: auto; }
.div-conteudo-s2-divisoria h2 { width: 700px; height: auto; position: relative; float: left; margin-top: 60px; color: #07646F; font-size: 42px; font-weight: 700; line-height: 39px; }
#tag-tempo-simulacao { width: 600px; height: auto; position: relative; float: right; margin-top: 65px; background-color: #0A505A; border-radius: 30px; overflow: hidden; }
#tag-tempo-simulacao-txt { width: 80%; height: auto; position: relative; float: left; padding: 27px 20px; color: #fff; font-weight: 300; font-size: 22px; }
#faixa-topo-calculadora { width: 100%; height: auto; position: relative; float: left; margin-top: 20px; padding: 25px 35px; margin-bottom: -50px; }
.coluna-formulario-calculadora-a { width: 28%; height: auto; position: relative; float: left; padding: 0px 20px; }
.coluna-formulario-calculadora { width: 36%; height: auto; position: relative; float: left; padding: 0px 40px; }
.chamada-p-calculadora { width: 100%; height: auto; position: relative; float: left; line-height: 35px; font-size: 30px; color: #358289; font-weight: 600; }
.fix-coluna-calculadora { width: 28%; }
#faixa-calculadora-economia-topo { width: 100%; height: auto; position: relative; float: left; padding-top: 35px; }
#faixa-topo-calculadora { width: 100%; height: auto; position: relative; float: left; margin-top: 21px; padding: 25px 35px; margin-bottom: -50px; }
#raio-topo-calculdora { width: 55px; height: 55px; position: relative; float: right; background: url('../img/raios.png'); background-size: 55px; margin-top: auto; }
#cta-calcular-conta-c { width: 100%; height: auto; position: relative; float: left; margin-top: 90px; padding: 18px 20px 18px 20px; font-size: 17px; color: #fff; text-align: center; background-color: #2BD33A; border-radius: 50px; cursor: pointer; }
/*inicio seletor de região*/
.item-seletor-regiao { width: 110px; height: 90px; position: relative; float: left; margin-left: -2%; margin-right: 11%; background-color: #F2F4F2; border-radius: 15px; cursor: pointer; }
/*cta calcular conta*/
#cta-calcular-conta { width: 100%; height: auto; position: relative; float: left; margin-top: 98px; padding: 18px 90px 18px 30px; font-size: 16px; color: #fff; text-align: center; background-color: #2BD33A; border-radius: 50px; cursor: pointer; }
#icn-cta-calculadora { width: 40px; height: 40px; position: absolute; right: 17px; top: 10px; background-color: #fff; border-radius: 50%; }
/*Inicio s3 LP*/
#terceira-sessao-lp { width: 100%; height: 1100px; position: relative; float: left; margin-top: -460px; background-color: #07505A; z-index: 90; }
#view-terceira-sessao-lp { width: 1150px; height: auto; position: relative; margin: auto; padding-top: 500px; }
#div-s3-a h4 { width: 100%; position: relative; float: left; margin-top: 140px; font-size: 77px; color: #fff; font-family: "Bebas Neue", sans-serif; font-weight: 500; line-height: 69px; }
#view-faixa-de-ugcs { width: 1150px; height: auto; position: relative; margin: auto; }
#view-faixa-de-ugcs h5 { width: 100%; height: auto; position: relative; float: left; margin-top: 240px; text-align: center; color: #08646E; font-size: 46px; font-weight: 600; padding: 0px 200px; }
#faixa-cards-ugcs-int { width: 100%; height: 560px; position: relative; float: left; margin-top: 40px; }
/*controles ugc*/
.item-controle-ugc { width: 80px; height: 80px; position: absolute; left: 160px; top: 50%; margin-top: 1045px; background-color: #2bd33a; border-radius: 50%; cursor: pointer; z-index: 90; }
.item-controle-ugc-b { width: 80px; height: 80px; position: absolute; right: 160px; top: 50%; margin-top: 1048px; background-color: #2bd33a; border-radius: 50%; cursor: pointer; z-index: 90; }
.seta-int-controle-ugc { width: 50px; height: 50px; position: absolute; left: 50%; top: 50%; margin-left: -25px; margin-top: -25px; }
#faixa-infos-carrossel-ugc { width: 100%; height: auto; position: relative; float: left; font-size: 27px; color: #08646E; text-align: center; margin-top: 90px; padding: 0px 260px; }
#view-div-s4 { width: 1150px; height: 1000px; position: relative; margin: auto; overflow: hidden; }
#carta-verde { width: 590px; height: 619px; position: absolute; right: -80px; top: 160px; background: url('../img/conta-verde.png'); background-size: 581px; z-index: 90; }
#carta-vermelha { width: 550px; height: 619px; position: absolute; right: 200px; top: 150px; background: url('../img/conta-vermelha.png'); background-size: 550px; }
#div-avaliacoes-google {
width: 100%;
height: auto;
position: relative;
float: left;
margin-top: 90px;
}
#view-chamada-avaliacoes-google h4 { width: 100%; height: auto; position: relative; float: left; font-size: 52px; color: #06646E; font-weight: 700; text-align: center; }
#view-chamada-avaliacoes-google p { width: 100%; height: auto; position: relative; float: left; margin-top: -5px; line-height: 43px; font-size: 30px; color: #06646E; font-weight: 300; text-align: center; padding: 0px 300px; }
#div-c-perfil-view { width: 1150px; height: auto; position: relative; margin: auto; }
.div-c-perfil-view-a { width: 60%; height: 500px; position: relative; float: left; }
#conteudo-div-foto-perfil { width: 100%; height: auto; position: relative; float: left; top: 50%; left: -32px; margin-top: -35px; font-size: 45px; text-align: center; color: #fff; z-index: 90; }
#raio-txt { width: 50px; height: 50px; position: absolute; right: 50px; top: 10px; background: url('../img/ornamento-logo.png'); background-size: 50px; }
.div-c-perfil-view-b { width: 40%; height: atuo; position: relative; float: left; margin-top: 230px; padding: 0px 30px; }
.seta-link-menu { width: 45px; height: 45px; position: absolute; right: -18px; top: 14px; background: url('../img/arrow-menu-link.png'); background-size: 45px; }
/*Inicio lista de comparação*/
#div-comparacao-concorrente { width: 100%; height: auto; position: relative; float: left; margin-top: 160px; }
#view-div-comparacao-concorrente { width: 1150px; height: auto; position: relative; margin: auto; }
#view-div-comparacao-concorrente h5 { width: 100%; height: auto; position: relative; float: left; font-size: 50px; color: #08646E; line-height: 62px; text-align: center; }
#view-faixa-economia h6 { width: 22%; height: auto; position: relative; float: left; font-size: 48px; font-family: "Bebas Neue", sans-serif; text-transform: uppercase; color: #0A5059; line-height: 43px; margin-top: 55px; }
.item-bloco-economia { width: 37%; height: 250px; position: relative; float: left; margin-left: 2%; background-color: #0A5059; border-radius: 20px; overflow: hidden; }
.txt-bloco-economia { width: 70%; height: auto; position: relative; float: left; margin-top: 82px; font-size: 29px; color: #fff; }
.txt-valor-bloco-economia { width: 70%; height: auto; position: relative; float: left; margin-top: -5px; color: #2BD33A; font-size: 34px; }
.f-v-1 { font-size: 15px; }
#view-bloco-video-rodape { width: 1150px; height: auto; position: relative; margin: auto; }
#player-yt-rodape { width: 1000px; height: 562px; position: relative; margin: auto; border-radius: 30px; overflow: hidden; }
#view-div-rodape { width: 1150px; height: auto; position: relative; margin: auto; }
.sessa-a-rodape { width: 31.5% !important; }
.sessao-rodape { width: 29%; height: auto; position: relative; float: left; }
.legenda-parceiro-rodape { width: 100%; height: auto; position: relative; float: left; font-size: 15px; color: #28666E; text-align: center; }
#calculadora-de-economia { width: 1150px; height: 540px; position: relative; margin: auto; background-color: #fff; border-radius: 30px; -webkit-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); -moz-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); -o-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); -ms-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); padding: 0px 4px 0px 20px; }
}
/*Inicio media queries*/
@media only screen
and (min-width:1000px) and (max-width:1200px) {
.telas-menores { display: none; }
#view-banner-topo { width: 90%; height: auto; position: relative; margin: auto; }
#menu-fixo { width: 950px; height: 80px; position: relative; margin: auto; background-color: #fff; border-radius: 60px; border: 1px solid #eeeeee; }
#lista-itens-menu-fixo { width: 60%; height: auto; position: relative; float: left; margin-left: 30px; margin-top: 9px; display: none; }
/*Inicio banner topo*/
#banner-topo { width: 100%; height: 1220px; position: relative; float: left; overflow: hidden; }
#view-banner-topo { width: 90%; height: auto; position: relative; margin: auto; }
#conteudo-banner-topo h1 { width: 100%; height: auto; position: relative; float: left; font-size: 58px; color: #fff; font-weight: 700; text-align: center; }
#conteudo-banner-topo p { width: 100%; height: auto; position: relative; float: left; margin-top: -15px; font-size: 30px; color: #fff; font-weight: 300; line-height: 35px; padding: 0px 160px; text-align: center; }
#cta-banner-topo { width: 390px; height: auto; left: 50%; position: relative; float: left; margin-left: -195px; background-color: #2BD33A; color: #fff; font-size: 20px; border: 1px solid #45b84f; padding: 15px 68px 15px 25px; border-radius: 90px; cursor: pointer; }
/*Inicio calculadora economia*/
#div-calculadora-economia { width: 100%; height: 980px; position: relative; float: left; z-index: 600; margin-top: 100px; }
#view-faixa-calculadora-economia { width: 900px; height: auto; position: relative; margin: auto; }
.div-conteudo-s2-divisoria { width: 100%; height: auto; position: relative; float: left; }
.div-conteudo-s2-divisoria h2 { width: 100%; height: auto; position: relative; float: left; margin-top: 40px; color: #07646F; font-size: 54px; font-weight: 700; line-height: 55px; text-align: center; }
#tag-tempo-simulacao { width: 600px; height: auto; right: 50%; position: relative; float: right; margin-right: -300px; margin-top: 15px; background-color: #0A505A; border-radius: 30px; overflow: hidden; }
#faixa-calculadora-economia-topo { width: 100%; height: auto; position: relative; float: left; padding-top: 120px; }
#calculadora-de-economia { width: 1150px; height: 540px; position: relative; margin: auto; background-color: #fff; border-radius: 30px; -webkit-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); -moz-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); -o-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); -ms-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); padding: 0px 4px 0px 20px; }
#calculadora-de-economia { width: 100%; height: 460px; position: relative; margin: auto; background-color: #fff; border-radius: 30px; -webkit-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); -moz-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); -o-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); -ms-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); padding: 0px 20px; }
#faixa-topo-calculadora { width: 100%; height: auto; position: relative; float: left; margin-top: 21px; padding: 25px 35px; margin-bottom: -50px; }
/*Faixa itens*/
.faixa-itens-formulario-calculadora { width: 100%; height: auto; position: relative; float: left; margin-bottom: 30px; }
.coluna-formulario-calculadora-a { width: 28%; height: auto; position: relative; float: left; padding: 0px 20px; }
.coluna-formulario-calculadora { width: 36%; height: auto; position: relative; float: left; padding: 0px 10px; }
.chamada-p-calculadora { width: 100%; height: auto; position: relative; float: left; line-height: 26px; font-size: 20px; color: #358289; font-weight: 600; }
.prefixo-valor-calculadora { width: auto; height: 100%; position: relative; float: left; margin-top: 16px; font-size: 20px; color: #08646E; font-weight: 400; }
.campo-valor-conta-calc { width: 54%; height: 40px; position: relative; float: left; margin-left: 9px; }
/*tipo de ligação*/
.chamada-campo-tipo-b { width: 100%; height: auto; position: relative; float: left; margin-top: 17px; font-size: 19px; color: #07646E; padding: 10px 0px; }
/*Item box seletor*/
.item-box-seletor { width: 28%; height: 66px; position: relative; float: left; margin-left: 2.5%; margin-right: 2.5%; background-color: #F2F4F2; border-radius: 15px; cursor: pointer; }
.icn-raio-a { width: 40px; height: 40px; position: absolute; left: 50%; top: 50%; margin-left: -20px; margin-top: -20px; background: url(../img/icn-raio.gif); background-size: 40px; }
.icn-raio-b { width: 40px; height: 40px; position: absolute; left: 50%; top: 50%; margin-left: -26px; margin-top: -20px; background: url(../img/icn-raio.gif); background-size: 40px; }
.icn-raio-b-2 { width: 40px; height: 40px; position: absolute; top: 1px; right: -17px; background: url(../img/icn-raio.gif); background-size: 40px; }
.icn-raio-b-3 { width: 40px; height: 40px; position: absolute; top: 1px; left: -15px; background: url(../img/icn-raio.gif); background-size: 40px; }
.icn-raio-d { width: 40px; height: 40px; position: absolute; left: 50%; top: 50%; margin-left: -20px; margin-top: -20px; background: url(../img/icn-raio.gif); background-size: 40px; }
/*inicio seletor de região*/
.item-seletor-regiao { width: 90px; height: 70px; position: relative; float: left; margin-left: 1%; margin-right: 4%; background-color: #F2F4F2; border-radius: 15px; cursor: pointer; }
.txt-seletor-regiao { width: 100%; height: auto; position: relative; float: left; margin-top: 17px; font-size: 24px; color: #08646E; text-align: center; font-weight: 700; }
.icn-segmento-calc { width: 30px; height: 30px; position: absolute; left: 50%; top: 50%; margin-left: -15px; margin-top: -15px; }
.icn-segmento-residencia { background: url('../img/residencia.png'); background-size: 30px; }
.icn-segmento-empresas { background: url('../img/empresas.png'); background-size: 30px; }
.icn-segmento-rural { background: url('../img/rural.png'); background-size: 30px; }
.legenda-box-seletor { width: 140%; height: auto; position: absolute; left: -21%; bottom: -34px; color: #08646E; font-size: 16px; text-align: center; }
.select-wrapper input.select-dropdown { border: none !important; height: 56px; line-height: normal; font-size: 19px; display: flex; padding-top: 18px; padding-left: 5px; align-items: center; color: #08646E; }
/*cta calcular conta*/
#cta-calcular-conta { width: 100%; height: auto; position: relative; float: left; margin-top: 69px; padding: 18px 20px 18px 20px; font-size: 18px; color: #fff; text-align: center; background-color: #2BD33A; border-radius: 50px; cursor: pointer; }
#icn-cta-calculadora { width: 45px; height: 45px; position: absolute; right: 17px; top: 10px; background-color: #fff; border-radius: 50%; display: none; }
/*Inicio s3 LP*/
#terceira-sessao-lp { width: 100%; height: 880px; position: relative; float: left; margin-top: -270px; background-color: #07505A; z-index: 90; }
#view-terceira-sessao-lp { width: 900px; height: auto; position: relative; margin: auto; padding-top: 360px; }
#div-s3-a h4 { width: 100%; position: relative; float: left; margin-top: 160px; font-size: 66px; color: #fff; font-family: "Bebas Neue", sans-serif; font-weight: 460; line-height: 61px; }
#div-s3-b { width: 55%; height: auto; position: relative; float: left; margin-left: 5%; }
#view-faixa-de-ugcs { width: 950px; height: auto; position: relative; margin: auto; }
#view-faixa-de-ugcs h5 { width: 100%; height: auto; position: relative; float: left; margin-top: 300px; text-align: center; color: #08646E; font-size: 42px; font-weight: 600; padding: 0px 150px; }
/*inicio faixa cards UGCs int*/
#div-s4 {
width: 100%;
height: 1170px;
position: relative;
float: left;
margin-top: 0px;
padding-top: 220px;
overflow: hidden;
}
#faixa-cards-ugcs-int { width: 100%; height: 500px; position: relative; float: left; margin-top: 40px; }
/*controles ugc*/
.item-controle-ugc { width: 70px; height: 70px; position: absolute; left: 58px; top: 50%; margin-top: 1085px; background-color: #2bd33a; border-radius: 50%; cursor: pointer; z-index: 90; }
.item-controle-ugc-b { width: 70px; height: 70px; position: absolute; right: 60px; top: 50%; margin-top: 1089px; background-color: #2bd33a; border-radius: 50%; cursor: pointer; z-index: 90; }
.seta-int-controle-ugc { width: 50px; height: 50px; position: absolute; left: 50%; top: 50%; margin-left: -25px; margin-top: -25px; }
#faixa-infos-carrossel-ugc { width: 100%; height: auto; position: relative; float: left; font-size: 27px; color: #08646E; text-align: center; margin-top: 110px; padding: 0px 160px; }
#view-div-s4 { width: 900px; height: 1000px; position: relative; margin: auto; }
#carta-verde { width: 500px; height: 519px; position: absolute; right: -80px; top: 350px; background: url('../img/conta-verde.png'); background-size: 500px; z-index: 90; }
#carta-vermelha { width: 450px; height: 509px; position: absolute; right: 10px; top: 120px; background: url('../img/conta-vermelha.png'); background-size: 450px; }
#numeros-conta-verde { width: 100%; height: auto; position: relative; float: left; margin-top: 214px; font-size: 31px; transform: rotate(10deg); rotate: 60.8; color: #2BD33A; font-weight: 600; text-align: center; font-weight: 800; }
#numeros-conta-vermelha { width: 95%; height: auto; position: relative; float: left; margin-top: 207px; font-size: 26px; transform: rotate(-12deg); rotate: 60.8; color: #E51311; font-weight: 600; text-align: center; font-weight: 800; }
/*Inicio avaliações do google*/
#div-avaliacoes-google {
width: 100%;
height: auto;
position: relative;
float: left;
margin-top: 80px;
}
#view-chamada-avaliacoes-google { width: 950px; height: auto; position: relative; margin: auto; }
#view-chamada-avaliacoes-google h4 { width: 100%; height: auto; position: relative; float: left; font-size: 50px; color: #06646E; font-weight: 700; text-align: center; }
#view-chamada-avaliacoes-google p { width: 100%; height: auto; position: relative; float: left; margin-top: -5px; line-height: 38px; font-size: 26px; color: #06646E; font-weight: 300; text-align: center; padding: 0px 220px; }
#div-c-perfil-view { width: 900px; height: auto; position: relative; margin: auto; }
.div-c-perfil-view-a { width: 100%; height: 500px; position: relative; float: left; }
#foto-selecao-perfil { width: 100%; height: 600px; position: relative; float: left; margin-top: 90px; border-radius: 60px; overflow: hidden; }
.div-c-perfil-view-b { width: 100%; height: atuo; position: relative; float: left; margin-top: 260px; padding: 0px 60px; }
#div-comparacao-concorrente { width: 100%; height: auto; position: relative; float: left; margin-top: 40px; }
#view-div-comparacao-concorrente { width: 900px; height: auto; position: relative; margin: auto; }
#view-div-comparacao-concorrente h5 { width: 100%; height: auto; position: relative; float: left; font-size: 47px; color: #08646E; line-height: 55px; text-align: center; }
#view-listas-int { width: 100%; height: auto; position: relative; float: left; margin-top: 70px; }
.lista-comp-d { padding-left: 50px; }
.txt-lista-comparacao { width: 75%; height: auto; position: relative; float: left; margin-left: 15px; font-size: 19px; margin-top: -4px; color: #07646F; }
/*chamada economia*/
#faixa-economia { width: 100%; height: auto; position: relative; float: left; margin-top: 40px; line-height: 40px; }
#view-faixa-economia h6 { width: 290px; height: auto; position: relative; float: left; font-size: 69px; font-family: "Bebas Neue", sans-serif; text-transform: uppercase; color: #0A5059; line-height: 59px; margin-top: 65px; margin-right: 460px; margin-bottom: 30px; }
.item-bloco-economia { width: 48%; height: 250px; position: relative; float: left; margin-left: 0%; margin-right: 2%; background-color: #0A5059; border-radius: 20px; overflow: hidden; }
/*Inicio bloco video rodape*/
#inicio-bloco-video-rodape { width: 100%; height: auto; position: relative; float: left; margin-top: 0px; }
#view-bloco-video-rodape { width: 900px; height: auto; position: relative; margin: auto; }
#view-bloco-video-rodape h6 { width: 100%; height: auto; position: relative; float: left; margin-top: 135px; font-size: 38px; color: #0A5059; text-align: center; }
#player-yt-rodape { width: 900px; height: 506px; position: relative; margin: auto; border-radius: 30px; overflow: hidden; }
#view-div-rodape { width: 900px; height: auto; position: relative; margin: auto; }
.sessa-a-rodape { width: 45% !important; }
.sessao-rodape { width: 25%; height: auto; position: relative; float: left; margin-left: 6.5%; }
#faixa-parceiros-rodape { width: 100%; height: auto; position: relative; float: left; padding-left: 0px; }
.item-rodape-parceiro { width: 50%; height: auto; position: relative; float: left; padding-top: 120px; padding-right: 150px; }
.select-wrapper { background: #F3F3F3; border-radius: 12px; padding: 0 20px; /* font-size: 12px; */ height: 70px; display: flex; align-items: center; }
}
/*Inicio media queries*/
@media only screen
and (min-width:750px) and (max-width:1000px) {
#menu-fixo { width: 90%; height: 80px; position: relative; margin: auto; background-color: #fff; border-radius: 60px; border: 1px solid #eeeeee; }
#lista-itens-menu-fixo { width: 60%; height: auto; position: relative; float: left; margin-left: 30px; display: none; margin-top: 9px; }
#cta-banner-topo { width: 390px; height: auto; position: relative; float: unset; margin: auto; background-color: #2BD33A; color: #fff; font-size: 20px; border: 1px solid #45b84f; padding: 15px 68px 15px 25px; border-radius: 90px; cursor: pointer; }
#faixa-sessao-ugc { width: 100%; height: auto; position: relative; float: left; background-color: #fff; overflow: hidden; }
/*Inicio banner topo*/
#banner-topo { width: 100%; height: 1230px; position: relative; float: left; overflow: hidden; }
#view-banner-topo { width: 90%; height: auto; position: relative; margin: auto; }
#conteudo-banner-topo h1 { width: 100%; height: auto; position: relative; float: left; font-size: 47px; color: #fff; font-weight: 700; text-align: center; }
#conteudo-banner-topo p { width: 100%; height: auto; position: relative; float: left; margin-top: -15px; font-size: 29px; color: #fff; font-weight: 300; line-height: 35px; padding: 0px 68px; text-align: center; }
#view-faixa-calculadora-economia { width: 720px; height: auto; position: relative; margin: auto; }
.div-conteudo-s2-divisoria h2 { width: 100%; height: auto; position: relative; float: left; margin-top: 18px; color: #07646F; font-size: 42px; font-weight: 700; line-height: 43px; text-align: center; }
#tag-tempo-simulacao { width: 550px; height: auto; right: 54%; position: relative; float: right; margin-right: -301px; margin-top: 17px; background-color: #0A505A; border-radius: 30px; overflow: hidden; }
#calculadora-de-economia { width: 97%; height: 1130px; position: relative; margin: auto; background-color: #fff; border-radius: 30px; -webkit-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); -moz-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); -o-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); -ms-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); padding: 0px 20px; }
#faixa-topo-calculadora { width: 100%; height: auto; position: relative; float: left; margin-top: 26px; padding: 25px 10px; margin-bottom: -50px; }
.coluna-formulario-calculadora-a { width: 100%; height: auto; position: relative; float: left; padding: 0px 20px; }
.coluna-formulario-calculadora { width: 102%; height: auto; position: relative; float: left; padding: 0px 10px; }
.chamada-p-calculadora { width: 100%; height: auto; position: relative; float: left; line-height: 38px; font-size: 35px; color: #358289; font-weight: 600; margin-top: -30px; }
.campo-valor-conta-calc { width: 89%; height: 40px; position: relative; float: left; margin-left: 9px; }
#banner-topo .bg-video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
/*tipo de ligação*/
.chamada-campo-tipo-b { width: 100%; height: auto; position: relative; float: left; margin-top: 35px; font-size: 21px; color: #07646E; padding: 10px 0px; }
/*Item box seletor*/
.item-box-seletor { width: 28%; height: 106px; position: relative; float: left; margin-left: 2.5%; margin-right: 2.5%; background-color: #F2F4F2; border-radius: 15px; cursor: pointer; }
#conteudo-banner-topo { width: 100%; height: auto; position: absolute; top: 50%; margin-top: -160px; }
/*faixa cta banner topo*/
#faixa-cta-banner-topo { width: 100%; height: auto; position: relative; float: left; margin-top: 0px; }
#icn-tag-simulacao { width: 20%; height: 117px; position: relative; float: left; background-color: #2BD33A; padding: 26px; }
#tag-tempo-simulacao-txt { width: 80%; height: auto; position: relative; float: left; padding: 26px 20px; color: #fff; font-weight: 300; font-size: 22px; }
#div-calculadora-economia { width: 100%; height: 1140px; position: relative; float: left; z-index: 600; margin-top: 90px; }
.div-conteudo-s2-divisoria { width: 100%; height: auto; position: relative; float: left; }
/*Inicio faixa calculadora de economia*/
#faixa-calculadora-economia-topo { width: 100%; height: auto; position: relative; float: left; padding-top: 110px; }
/*cta calcular conta*/
#cta-calcular-conta { width: 54%; height: auto; margin-left: 23%; position: relative; float: left; margin-top: 70px; padding: 18px 90px 18px 30px; font-size: 20px; color: #fff; text-align: center; background-color: #2BD33A; border-radius: 50px; cursor: pointer; }
/*Inicio s3 LP*/
#terceira-sessao-lp { width: 100%; height: 1280px; position: relative; float: left; margin-top: -270px; background-color: #07505A; z-index: 90; }
#view-terceira-sessao-lp { width: 720px; height: auto; position: relative; margin: auto; padding-top: 890px; }
#div-s3-a h4 { width: 100%; position: relative; float: left; margin-top: 40px; font-size: 50px; color: #fff; font-family: "Bebas Neue", sans-serif; font-weight: 500; line-height: 48px; }
#foto-div-s3 { width: 100%; height: 700px; position: relative; float: left; background-color: #dadada; margin-top: -100px; border-radius: 50px; overflow: hidden; }
#view-faixa-de-ugcs { width: 100%; height: auto; position: relative; margin: auto; }
#view-faixa-de-ugcs h5 { width: 650px; height: auto; left: 50%; position: relative; float: left; margin-left: -350px; margin-top: 300px; text-align: center; color: #08646E; font-size: 45px; font-weight: 600; padding: 0px 40px; }
/*inicio faixa cards UGCs int*/
#faixa-cards-ugcs-int { width: 100%; height: 530px; position: relative; float: left; margin-top: 40px; }
/*controles ugc*/
.item-controle-ugc { width: 100px; height: 100px; position: absolute; left: -170px; top: 50%; margin-top: 715px; background-color: #2bd33a; border-radius: 50%; cursor: pointer; display: none; }
.item-controle-ugc-b { width: 100px; height: 100px; position: absolute; right: -170px; top: 50%; margin-top: 715px; background-color: #2bd33a; border-radius: 50%; cursor: pointer; }
#faixa-infos-carrossel-ugc { width: 100%; height: auto; position: relative; float: left; font-size: 24px; color: #08646E; text-align: center; margin-top: 70px; padding: 0px 80px; }
#div-s4 {
width: 100%;
height: 960px;
position: relative;
float: left;
margin-top: 0px;
padding-top: 300px;
margin-bottom: 270px;
}
#div-s4-bg { width: 100%; height: 470px; position: absolute; top: 50%; margin-top: -330px; background-color: #3cd272; }
#view-div-s4 { width: 740px; height: 1000px; position: relative; margin: auto; }
/*Inicio calculadora tempo real*/
#box-calculadora-tempo-real { width: 500px; height: 700px; position: relative; float: unset; margin-top: unset; margin: auto; background-color: #FFF; border-radius: 40px; -webkit-box-shadow: 0px 0px 84px 0px rgba(0, 0, 0, 0.15); -moz-box-shadow: 0px 0px 84px 0px rgba(0, 0, 0, 0.15); -ms-box-shadow: 0px 0px 84px 0px rgba(0, 0, 0, 0.15); -o-box-shadow: 0px 0px 84px 0px rgba(0, 0, 0, 0.15); box-shadow: 0px 0px 84px 0px rgba(0, 0, 0, 0.15); }
#carta-verde { width: 590px; height: 619px; position: absolute; right: 0px; top: 160px; background: url('../img/conta-verde.png'); background-size: 581px; z-index: 90; display: none; }
#carta-vermelha { width: 550px; height: 619px; position: absolute; right: 290px; top: 150px; background: url('../img/conta-vermelha.png'); background-size: 550px; display: none; }
/*Inicio avaliações do google*/
#div-avaliacoes-google { width: 100%; height: auto; position: relative; float: left; margin-top: -160px; }
#view-chamada-avaliacoes-google { width: 730px; height: auto; position: relative; margin: auto; }
#view-chamada-avaliacoes-google h4 { width: 100%; height: auto; position: relative; float: left; font-size: 50px; color: #06646E; font-weight: 700; text-align: center; }
#view-chamada-avaliacoes-google p { width: 100%; height: auto; position: relative; float: left; margin-top: -5px; line-height: 45px; font-size: 30px; color: #06646E; font-weight: 300; text-align: center; padding: 0px 80px; }
#div-c-perfil-view { width: 730px; height: auto; position: relative; margin: auto; }
.div-c-perfil-view-a { width: 100%; height: 500px; position: relative; float: left; }
#foto-selecao-perfil { width: 100%; height: 440px; position: relative; float: left; margin-top: 120px; border-radius: 40px; overflow: hidden; }
#conteudo-div-foto-perfil { width: 100%; height: auto; position: relative; float: left; top: 50%; left: -28px; margin-top: -35px; font-size: 45px; text-align: center; color: #fff; z-index: 90; }
#raio-txt { width: 50px; height: 50px; position: absolute; right: 70px; top: 10px; background: url('../img/ornamento-logo.png'); background-size: 50px; }
.div-c-perfil-view-b { width: 100%; height: atuo; position: relative; float: left; margin-top: 120px; padding: 0px 20px; }
/*Inicio lista de comparação*/
#div-comparacao-concorrente { width: 100%; height: auto; position: relative; float: left; margin-top: 40px; }
#view-div-comparacao-concorrente { width: 740px; height: auto; position: relative; margin: auto; }
#view-div-comparacao-concorrente h5 { width: 100%; height: auto; position: relative; float: left; font-size: 45px; color: #08646E; line-height: 53px; text-align: center; }
.lista-comp-d { padding-left: 40px; }
#logo-lista-atrek { width: 50%; height: auto; position: relative; float: left; padding: 0px 20px; }
#logo-parceiro-intelbras { width: 40%; height: auto; position: relative; float: left; margin-left: 10%; padding: 0px 20px; }
.txt-lista-comparacao { width: 75%; height: auto; position: relative; float: left; margin-left: 15px; font-size: 18px; margin-top: -4px; color: #07646F; }
.box-int-destaque-lista { width: 95%; height: 500px; position: relative; float: left; margin-left: 0px; background-color: #1CC636; border-radius: 20px; overflow: hidden; padding: 0px 30px; }
.box-int-destaque-lista h3 { width: 100%; height: auto; position: relative; float: left; margin-top: 37px; font-size: 32px; color: #fff; font-weight: 600; }
.item-lista-destaque { width: 100%; height: auto; position: relative; float: left; padding: 0px 0px; margin-top: 20px; margin-bottom: 15px; }
.fix-l-1 { margin-top: 6px; }
.fix-l-2 { margin-top: -4px; }
.fix-l-3 { margin-top: -5px; }
#view-faixa-economia h6 { width: 50%; height: auto; position: relative; float: left; font-size: 69px; font-family: "Bebas Neue", sans-serif; text-transform: uppercase; color: #0A5059; line-height: 59px; margin-top: 65px; margin-bottom: 40px; }
.item-bloco-economia { width: 100%; height: 300px; position: relative; margin-bottom: 40px; float: left; margin-left: 0%; background-color: #0A5059; border-radius: 20px; overflow: hidden; }
.txt-bloco-economia { width: 70%; height: auto; position: relative; float: left; margin-top: 96px; font-size: 46px; color: #fff; }
.txt-valor-bloco-economia { width: 70%; height: auto; position: relative; float: left; margin-top: 7px; color: #2BD33A; font-size: 59px; }
.ft-int-bloco-economia { width: 800px; height: 470px; position: absolute; left: 50%; top: 50%; margin-left: -400px; margin-top: -270px; background: url('../img/casa-economia.png'); background-size: 800px; }
#view-bloco-video-rodape { width: 740px; height: auto; position: relative; margin: auto; }
#view-bloco-video-rodape h6 { width: 100%; height: auto; position: relative; float: left; margin-top: 45px; font-size: 39px; color: #0A5059; text-align: center; }
#player-yt-rodape { width: 720px; height: 405px; position: relative; margin: auto; border-radius: 30px; overflow: hidden; }
#view-div-rodape { width: 90%; height: auto; position: relative; margin: auto; }
#logo-rodape { width: 220px; height: auto; position: relative; margin: auto; }
.sessa-a-rodape { width: 50% !important; }
.sessao-rodape { width: 25%; height: auto; position: relative; float: left; }
#faixa-parceiros-rodape { width: 100%; height: auto; position: relative; float: left; padding-left: 0px; }
.item-rodape-parceiro { width: 50%; height: auto; position: relative; float: left; padding-top: 69px; }
.legenda-parceiro-rodape { width: 100%; height: auto; position: relative; float: left; font-size: 17px; text-align: left; color: #28666E; text-align: left; }
.logo-parceiro-rodape { width: 100%; height: auto; position: relative; float: left; margin-top: 10px; padding: 0px 180px 0px 0px; }
#view-faixa-calculadora-economia { width: 730px; height: auto; position: relative; margin: auto; }
/*Inicio resultado calculo*/
#janela-resultado-economia { width: 740px; height: 550px; position: fixed; top: -250%; left: 50%; margin-left: -370px; margin-top: -370px; background-color: #fff; border-radius: 30px; z-index: 1999; overflow: hidden; opacity: 0; display: none; }
#toolbar-janela-economia { width: 100%; height: 50px; position: absolute; top: 45px; z-index: 90; padding: 0px 30px; }
#logo-janela-atrek-cal-economia { width: 170px; height: auto; position: relative; float: left; margin-top: -10px; }
#fechar-janela-resultado-economia { width: 35px; height: 35px; position: relative; float: right; margin-top: 4px; background: url('../img/icn-x.png'); background-size: 35px; background-repeat: no-repeat; cursor: pointer; }
#janela-etapas-resultado-economia { width: 2220px; height: 100%; margin-left: 0px; position: relative; float: left; top: 0px; overflow: hidden; }
#faixa-box-resultados-janela { width: 740px; height: 100%; left: 0px; position: relative; float: left; margin-top: 125px; padding-left: 46px; }
/*Box resultado porcentagem*/
#ornamento-logo-atrek-resultado { width: 40px; height: 46px; position: absolute; right: 24px; top: 31px; background: url('../img/ornamento-logo-g.png'); background-size: 40px; }
#chamada-resultado-porecentagem { width: 100%; height: auto; position: relative; float: left; margin-top: 18px; padding: 10px 100px 0px 30px; font-size: 19px; line-height: 30px; color: #fff; font-weight: 300; }
#linha-resultado-porcentagem { width: 100%; height: auto; position: relative; float: left; margin-top: 25px; padding: 0px 30px; }
#legenda-total-economia { width: 100px; height: auto; position: relative; float: left; margin-left: 30px; margin-top: -24px; line-height: 30px; font-size: 26px; color: #2BD33A; }
#valor-final-economia-janela { width: 100%; height: auto; position: relative; float: left; margin-right: 0px; margin-top: 95px; text-align: left; font-size: 50px; font-weight: 400; padding-left: 32px; color: #2BD33A; font-family: "Bebas Neue", sans-serif; }
#chamada-cta-janela-resultado { width: 48%; height: auto; position: relative; float: left; margin-top: 30px; padding: 0px 0px; font-size: 18px; color: #0A5059; }
#box-cta-janela-resultado { width: 50%; height: auto; position: relative; float: left; margin-top: 30px; margin-left: -15px; }
#faixa-box-dados-janela { width: 740px; height: 100%; position: relative; float: left; padding: 0px 22px; margin-top: 145px; /* margin-left: 46px; */ }
#voltar-janela-resultado-economia { width: 50px; height: 50px; position: relative; float: right; margin-top: -3px; margin-right: 10px; background: url('../img/back.png'); background-size: 50px; background-repeat: no-repeat; cursor: pointer; opacity: 0; }
.item-campo-formulario-janela { width: 25%; height: auto; position: relative; float: left; padding: 0px 0px; margin-left: 3.1%; margin-right: 4.5%; }
.item-campo-formulario-janela input { width: 100%; height: auto; position: relative; float: left; font-size: 18px !important; background-color: #F3F3F3 !important; border-radius: 15px !important; padding: 10px 20px !important; border: 0px solid #fff !important; color: #07646E; }
.item-campo-formulario-janela-2x { width: 65%; height: auto; position: relative; float: left; padding: 0px 0px; margin-left: 2%; margin-right: 0px; }
.item-campo-formulario-janela-2x .select-wrapper { background: unset; border-radius: 12px; padding: 0 7px; height: 46px; margin-top: 18px; display: flex; align-items: center; }
#campo-envio-foto { width: 48%; height: auto; position: relative; float: left; margin-left: 3%; padding: 15px 15px; background-color: #F3F3F3; font-size: 15px; color: #0A5059; border-radius: 20px; cursor: pointer; }
#faixa-cta-ultima-etapa-calc { width: 49%; height: auto; position: relative; float: left; }
#cta-s-completa-b { width: auto; height: auto; position: relative; float: right; margin-top: 8px; padding: 16px 40px; margin-right: 12px; background-color: #2BD33A; font-size: 17px; color: #fff; border-radius: 90px; cursor: pointer; }
#alerta-coleta-dados { width: 95%; height: auto; position: relative; float: left; padding: 18px 20px; background-color: #f8fff2; border-radius: 20px; font-size: 15px; margin-left: 18px; margin-top: 21px; color: #2f8e38; border: 1px solid #d0fbd0; }
#janela-envio-calculo { width: 740px; height: 100%; position: relative; float: left; padding: 0px 22px; margin-top: 160px; display: block; }
#nome-usuario-calculo { width: 100%; height: auto; position: relative; float: left; margin-top: 140px; color: #2BD33A; font-size: 45px; text-align: center; font-weight: 600; }
#info-envio-dados { width: 100%; height: auto; position: relative; float: left; font-size: 20px; color: #0A5059; text-align: center; padding: 0px 91px; }
#janela-contato-enviado { width: 600px; height: 600px; position: fixed; top: 50%; left: 50%; margin-left: -300px; margin-top: -300px; background-color: #fff; border-radius: 30px; z-index: 1999; overflow: hidden; }
#faixa-topo-calculadora { width: 100%; height: auto; position: relative; float: left; margin-top: 29px; padding: 25px 10px; margin-bottom: -50px; }
.chamada-p-calculadora { width: 100%; height: auto; position: relative; float: left; line-height: 36px; font-size: 32px; color: #358289; font-weight: 600; margin-top: -41px; }
/*tipo de ligação*/
.chamada-campo-tipo-b { width: 100%; height: auto; position: relative; float: left; margin-top: 48px; font-size: 21px; color: #07646E; padding: 10px 0px; }
/*cta calcular conta*/
#cta-calcular-conta { width: 54%; height: auto; margin-left: 23%; position: relative; float: left; margin-top: 50px; padding: 18px 90px 18px 30px; font-size: 20px; color: #fff; text-align: center; background-color: #2BD33A; border-radius: 50px; cursor: pointer; }
}
/*Inicio media queries*/
@media only screen
and (min-width:440px) and (max-width:750px) {
.mobile { display: block; }
.hide-mobile { display: none; }
.desktop { display: none; }
#mascara-banner-topo { width: 100%; height: 100%; position: absolute !important; top: 0px !important; z-index: 9 !important; background-color: #000; opacity: 0; }
/*Whatsapp flutuante*/
#cta-wpp-topo { width: 180px; height: auto; position: fixed; right: 50%; margin-right: -90px; bottom: -350px; padding: 15px 30px 15px 60px; border-radius: 150px; border: 0.3px solid #64E877; color: #fff; font-size: 20px; z-index: 9999; background-color: #2BD33A; cursor: pointer; -webkit-transition: bottom 1s ease; -moz-transition: bottom 1s ease; -o-transition: bottom 1s ease; transition: bottom 1s ease; }
#cta-wpp-topo.ativo { bottom: 50px; }
#menu-fixo { width: 90%; height: 80px; position: relative; margin: auto; background-color: rgba(255, 255, 255, 0); border-radius: 60px; border: 1px solid rgba(238, 238, 238, 0); }
#lista-itens-menu-fixo { width: 60%; height: auto; position: relative; float: left; margin-left: 30px; margin-top: 9px; display: none; }
#cta-menu-mobile { width: 60px; height: 60px; position: relative; float: right; margin-right: 20px; margin-top: 10px; background: url('../img/cta-menu-mobile.png'); background-size: 60px; cursor: pointer; }
/*cta simular projeto*/
#cta-simular-projeto-m { width: auto; height: auto; position: relative; float: right; margin-top: 15px; margin-right: 26px; background-color: #2BD33A; color: #fff; font-size: 20px; border-radius: 50px; padding: 10px 60px 10px 20px; cursor: pointer; display: none; }
/*Inicio banner topo*/
#banner-topo { width: 100%; height: 110%; position: relative; float: left; overflow: hidden; }
#conteudo-banner-topo { width: 100%; height: auto; top: unset; margin-top: unset; bottom: 159px; position: absolute !important; }
#cta-banner-topo { width: 360px; height: auto; left: 50%; position: relative; float: left; background-color: #2BD33A; color: #fff; font-size: 18px; margin-left: -180px; border: 1px solid #45b84f; padding: 15px 68px 15px 25px; border-radius: 90px; cursor: pointer; }
#view-banner-topo { width: 100%; height: auto; position: relative; margin: auto; padding: 0px 40px; }
#conteudo-banner-topo h1 { width: 100%; height: auto; position: relative; float: left; font-size: 33px; color: #fff; font-weight: 700; text-align: center; }
#conteudo-banner-topo p { width: 100%; height: auto; position: relative; float: left; margin-top: -15px; font-size: 18px; color: #fff; font-weight: 300; line-height: 25px; padding: 0px 20px; text-align: center; }
#view-faixa-calculadora-economia { width: 370px; height: auto; position: relative; margin: auto; }
.div-conteudo-s2-divisoria { width: 100%; height: auto; position: relative; float: left; }
.div-conteudo-s2-divisoria h2 { width: 100%; height: auto; position: relative; float: left; margin-top: 60px; color: #07646F; font-size: 33px; font-weight: 700; text-align: center; line-height: 35px; }
#view-faixa-calculadora-economia { width: 90%; height: auto; position: relative; margin: auto; }
.div-conteudo-s2-divisoria { width: 100%; height: auto; position: relative; float: left; }
.div-conteudo-s2-divisoria h2 { width: 100%; height: auto; position: relative; float: left; margin-top: 60px; color: #07646F; font-size: 33px; font-weight: 700; text-align: center; line-height: 35px; }
.div-conteudo-s2-divisoria h2 span { color: #2BD33A; }
#sombra-banner-topo { width: 200%; height: 700px; position: absolute !important; left: -50%; bottom: 0; z-index: 90; background: #000; background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%); background: -moz-linear-gradient(bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%); background: -o-linear-gradient(bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%); background: linear-gradient(to top, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%); }
#tag-tempo-simulacao { width: 340px; height: auto; right: 50%; position: relative; float: right; margin-top: 5px; margin-right: -170px; background-color: #0A505A; border-radius: 20px; overflow: hidden; }
#icn-tag-simulacao { width: 20%; height: 70px; position: relative; float: left; background-color: #2BD33A; padding: 15px; margin-top: 0px; }
#tag-tempo-simulacao-txt { width: 80%; height: auto; position: relative; float: left; padding: 16px 20px; color: #fff; font-weight: 300; font-size: 13px; }
/*Inicio faixa calculadora de economia*/
#faixa-calculadora-economia-topo { width: 100%; height: auto; position: relative; float: left; padding-top: 30px; }
#calculadora-de-economia { width: 100%; height: 1124px; position: relative; margin: auto; background-color: #fff; border-radius: 30px; -webkit-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); -moz-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); -o-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); -ms-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); padding: 13px 20px 0px 30px; }
#faixa-topo-calculadora { width: 100%; height: auto; position: relative; float: left; margin-top: 23px; padding: 25px 5px; margin-bottom: -50px; }
#raio-topo-calculdora { width: 45px; height: 45px; position: relative; float: right; margin-right: 20px; background: url('../img/raios.png'); background-size: 45px; }
/*Inicio calculadora economia*/
#div-calculadora-economia { width: 100%; height: auto; position: relative; float: left; z-index: 600; margin-top: -90px; background-color: #fff; border-radius: 50px 50px 0px 0px; }
.coluna-formulario-calculadora-a { width: 100%; height: auto; position: relative; float: left; padding: 0px 15px; }
.coluna-formulario-calculadora { width: 100%; height: auto; position: relative; float: left; padding: 0px 10px; margin-bottom: 28px; }
.chamada-p-calculadora { width: 100%; height: auto; position: relative; float: left; line-height: 29px; font-size: 24px; color: #358289; font-weight: 600; margin-top: -29px; }
.campo-valor-conta-calc { width: 71%; height: 40px; position: relative; float: left; margin-left: 20px; }
/*tipo de ligação*/
.chamada-campo-tipo-b { width: 100%; height: auto; position: relative; float: left; margin-top: 35px; font-size: 18px; color: #07646E; padding: 10px 0px; }
/*Item box seletor*/
.item-box-seletor { width: 30%; height: 90px; position: relative; float: left; margin-left: 0%; margin-right: 2.5%; background-color: #F2F4F2; border-radius: 15px; cursor: pointer; }
.legenda-box-seletor { width: 120%; height: auto; position: absolute; left: -10%; bottom: -29px; color: #08646E; font-size: 15px; text-align: center; }
/*cta calcular conta*/
#cta-calcular-conta { width: 100%; height: auto; position: relative; float: left; margin-top: 0px; padding: 15px 20px 15px 20px; font-size: 20px; color: #fff; text-align: center; background-color: #2BD33A; border-radius: 50px; cursor: pointer; }
#icn-cta-calculadora { width: 45px; height: 45px; position: absolute; right: 17px; top: 10px; background-color: #fff; border-radius: 50%; display: none; }
.select-calc-mobile { margin-top: 5px; }
#foto-div-s3 { width: 100%; height: 36…
0px; position: relative; float: left; background-color: #dadada; margin-top: 20px; border-radius: 20px; overflow: hidden; }
#foto-int-s3 { width: 460px; height: 800px; position: absolute; left: 50%; top: 50%; margin-left: -224px; margin-top: -182px; }
#view-faixa-de-ugcs { width: 100%; height: auto; position: relative; margin: auto; }
#view-faixa-de-ugcs h5 { width: 100%; height: auto; position: relative; float: left; margin-top: 70px; text-align: center; color: #08646E; font-size: 31px; font-weight: 600; padding: 0px 20px; }
#faixa-infos-carrossel-ugc { width: 100%; height: auto; position: relative; float: left; font-size: 16px; color: #08646E; text-align: center; margin-top: 60px; margin-bottom: 20px; padding: 0px 120px; }
/*inicio faixa cards UGCs int*/
#faixa-cards-ugcs-int { width: 100%; height: 520px; position: relative; float: left; margin-top: 40px; }
/*controles ugc*/
.item-controle-ugc { width: 60px; height: 60px; position: absolute; left: 20px; top: 50%; margin-top: 775px; background-color: #2bd33a; border-radius: 50%; cursor: pointer; z-index: 90; }
.item-controle-ugc-b { width: 60px; height: 60px; position: absolute; right: 20px; top: 50%; margin-top: 775px; background-color: #2bd33a; border-radius: 50%; cursor: pointer; z-index: 90; }
.seta-int-controle-ugc { width: 40px; height: 40px; position: absolute; left: 50%; top: 50%; margin-left: -20px; margin-top: -20px; }
#div-s4 { width: 100%; height: auto; position: relative; float: left; margin-top: 0px; }
#div-s4-bg { width: 100%; height: 470px; position: absolute; top: 50%; margin-top: -240px; background-color: #3cd272; display: none; }
#view-div-s4 { width: 90%; height: auto; position: relative; margin: auto; }
/*Inicio calculadora tempo real*/
#box-calculadora-tempo-real { width: 100%; height: 600px; left: 0%; position: relative; float: left; margin-top: 0px; margin-left: 0px; background-color: #FFF; border-radius: 9; -webkit-box-shadow: 0px 0px 84px 0px rgba(0, 0, 0, 0.15); -moz-box-shadow: 0px 0px 84px 0px rgba(0, 0, 0, 0.15); -ms-box-shadow: 0px 0px 84px 0px rgba(0, 0, 0, 0.15); -o-box-shadow: 0px 0px 84px 0px rgba(0, 0, 0, 0.15); box-shadow: 0px 0px 84px 0px rgba(0, 0, 0, 0); border-radius: 30px; }
#div-titulo-calculadora-tempo-real { width: 100%; height: 50px; position: relative; float: left; margin-top: 48px; margin-bottom: -10px; font-size: 34px; color: #08646E; text-align: center; font-weight: 600; }
#div-resultado-final-txt { width: 100%; height: auto; position: relative; float: left; color: #fff; text-align: left; font-size: 17px; margin-top: -13px; font-weight: 600; }
#legenda-tempo-resultado-tempo-real { width: auto; height: auto; position: absolute; right: 20px; top: 17px; font-size: 18px; color: #fff; }
.faixa-info-slider p { width: 50%; height: auto; position: relative; float: left; font-size: 15px; color: #07646E; padding: 0px 20px; margin-top: 26px; }
.box-info-resultado-slider { width: auto; height: auto; position: relative; float: right; margin-right: 20px; margin-top: 20px; padding: 10px 13px; font-size: 14px; color: #fff; background-color: #41C771; border-radius: 12px; }
#carta-verde { width: 590px; height: 619px; position: absolute; right: 0px; top: 160px; background: url('../img/conta-verde.png'); background-size: 581px; z-index: 90; display: none; }
#carta-vermelha { width: 550px; height: 619px; position: absolute; right: 290px; top: 150px; background: url('../img/conta-vermelha.png'); background-size: 550px; display: none; }
/*Inicio avaliações do google*/
#div-avaliacoes-google { width: 100%; height: auto; position: relative; float: left; margin-top: 50px; }
#view-chamada-avaliacoes-google { width: 90%; height: auto; position: relative; margin: auto; }
#view-chamada-avaliacoes-google h4 { width: 100%; height: auto; position: relative; float: left; font-size: 32px; color: #06646E; font-weight: 700; text-align: center; }
#view-chamada-avaliacoes-google p { width: 100%; height: auto; position: relative; float: left; margin-top: -5px; line-height: 26px; font-size: 20px; color: #06646E; font-weight: 300; text-align: center; padding: 0px 20px; }
#view-navegacao { width: 90%; height: auto; position: relative; margin: auto; }
#item-nav-dp-e { width: 50px; height: 50px; position: relative; float: left; background-color: #08646E; border-radius: 50%; cursor: pointer; }
#item-nav-dp-d { width: 50px; height: 50px; position: relative; float: right; background-color: #08646E; border-radius: 50%; cursor: pointer; }
#seta-e-int-dep { width: 30px; height: 30px; position: absolute; left: 50%; top: 50%; margin-top: -15px; margin-left: -15px; background: url('../img/seta-e-dep.png'); background-size: 30px; }
#seta-d-int-dep { width: 30px; height: 30px; position: absolute; left: 50%; top: 50%; margin-top: -15px; margin-left: -15px; background: url('../img/seta-d-dep.png'); background-size: 30px; }
.logo-google { width: 40px; height: 40px; position: absolute; right: 40px; top: 48px; background: url('../img/g-logo.png'); background-size: 40px; }
.dep-txt { width: 100%; height: auto; position: relative; float: left; margin-top: 20px; padding: 0px 40px; font-size: 18px; color: #06646E; }
/* bolinhas */
#paginacao-dep-dots .swiper-pagination-bullet { width: 15px; height: 15px; margin: 0 !important; border-radius: 50%; opacity: 1; background: #b8e48d; flex: 0 0 auto; transition: 0.25s ease; }
#div-c-perfil-view { width: 90%; height: auto; position: relative; margin: auto; }
.div-c-perfil-view-a { width: 100%; height: auto; position: relative; float: left; }
#foto-selecao-perfil { width: 100%; height: 300px; position: relative; float: left; margin-top: 10px; border-radius: 30px; overflow: hidden; }
#conteudo-div-foto-perfil { width: 100%; height: auto; position: relative; float: left; top: 50%; left: -29px; margin-top: -17px; font-size: 22px; text-align: center; color: #fff; z-index: 90; }
#raio-txt { width: 40px; height: 40px; position: absolute; right: 50px; top: -3px; background: url('../img/ornamento-logo.png'); background-size: 40px; }
.div-c-perfil-view-b { width: 100%; height: auto; position: relative; float: left; margin-top: 61px; padding: 0px 20px; }
/*Inicio lista de comparação*/
#div-comparacao-concorrente { width: 100%; height: auto; position: relative; float: left; margin-top: 0px; }
#view-div-comparacao-concorrente { width: 90%; height: auto; position: relative; margin: auto; display: none; }
#inicio-comparacao-mobile { width: 100%; height: auto; position: relative; float: left; margin-top: 20px; margin-bottom: 40px; }
#chamada-comparacao-mobile { width: 100%; height: auto; position: relative; float: left; }
#chamada-comparacao-mobile-int { width: 350px; height: auto; position: relative; margin: auto; font-size: 28px; line-height: 32px; margin-bottom: 20px; color: #08646E; text-align: center; }
#faixa-marcador-lista-mobile { width: 100%; height: auto; position: relative; float: left; }
#pilula-marcador-lista-mobile { width: 360px; height: 80px; position: relative; margin: auto; background-color: #06646E; border-radius: 60px; }
.item-lista-marcador-txt { width: 50%; height: auto; position: relative; float: left; padding: 10px 10px; color: #fff; font-size: 24px; padding-top: 22px; text-align: center; z-index: 10; cursor: pointer; }
.marcador-lista-bg { width: 140px; height: 56px; position: absolute; left: 20px; top: 12px; background-color: #fff; border-radius: 90px; z-index: 1; }
.atv-menu-lista-comp { color: #37C96B; font-weight: 600; }
.box-lista-com-mobile { width: 100%; height: auto; position: relative; float: left; overflow: hidden; margin-top: 10px; padding-bottom: 60px; }
#esteira-lista-comp-mobile { width: 200%; height: auto; position: relative; float: left; }
.item-lista-comp-mobile-int { width: 50%; height: auto; position: relative; float: left; padding: 0px 40px; }
.txt-lista-comparacao { width: 75%; height: auto; position: relative; float: left; margin-left: 15px; font-size: 19px; margin-top: 0px; color: #07646F; }
.box-int-destaque-lista { width: 100%; height: 500px; position: relative; float: left; margin-left: 0px; background-color: #1CC636; border-radius: 20px; overflow: hidden; padding: 0px 30px; }
.fix-l-1 { margin-top: 4px; }
#esteira-lista-comp-mobile { margin-left: 0%; -webkit-transition: margin-left 0.45s ease; -moz-transition: margin-left 0.45s ease; -o-transition: margin-left 0.45s ease; transition: margin-left 0.45s ease; }
.marcador-lista-bg { width: 140px; left: 20px; -webkit-transition: left 0.45s ease, width 0.45s ease; -moz-transition: left 0.45s ease, width 0.45s ease; -o-transition: left 0.45s ease, width 0.45s ease; transition: left 0.45s ease, width 0.45s ease; }
/*Selecao perfil*/
#foto-int-selecao-perfil { width: 600px; height: 454px; position: absolute; left: 50%; top: 50%; margin-left: -360px; margin-top: -212px; background: url('../img/foto-selecao-perfil.jpg'); background-size: 600px; }
/*chamada economia*/
#faixa-economia { width: 100%; height: auto; position: relative; float: left; margin-top: 30px; line-height: 40px; }
#view-faixa-economia { width: 85%; height: auto; position: relative; margin: auto; max-width: 1700px; }
#view-faixa-economia h6 { width: 30%; height: auto; position: relative; float: left; font-size: 33px; font-family: "Bebas Neue", sans-serif; text-transform: uppercase; color: #0A5059; line-height: 33px; margin-top: 65px; }
.item-bloco-economia { width: 68%; height: 250px; position: relative; float: left; margin-left: 2%; background-color: #0A5059; border-radius: 20px; overflow: hidden; }
.logo-ornamento-int-g { width: 40px; height: 40px; position: absolute; left: 50%; top: 50%; margin-left: -20px; margin-top: -74px; }
.txt-bloco-economia { width: 70%; height: auto; position: relative; float: left; margin-top: 102px; font-size: 27px; margin-left: -60px; color: #fff; }
.txt-valor-bloco-economia { width: 90%; height: auto; position: relative; float: left; margin-top: -1px; margin-left: -60px; color: #2BD33A; font-weight: 700; line-height: 32px; font-size: 27px; }
.f-v-1 { font-size: 19px; }
.f-v-2 { font-size: 24px; color: #fff !important; margin-top: -10px; /* line-height: 10px; */ /* margin-top: 0px; */ }
#view-bloco-video-rodape { width: 400px; height: auto; position: relative; margin: auto; }
#view-bloco-video-rodape h6 { width: 100%; height: auto; position: relative; float: left; margin-top: 39px; font-size: 27px; color: #0A5059; text-align: center; }
#player-yt-rodape { width: 400px; height: 226px; position: relative; margin: auto; border-radius: 20px; overflow: hidden; }
/*inicio rodape*/
#div-rodape { width: 100%; height: auto; position: relative; float: left; margin-top: 70px; padding-bottom: 130px; }
#view-div-rodape { width: 400px; height: auto; position: relative; margin: auto; }
#logo-rodape { width: 210px; height: auto; position: relative; margin: auto; }
.sessa-a-rodape { width: 100% !important; }
.sessao-rodape { width: 100%; height: auto; position: relative; float: left; }
.chamada-rodape { width: 100%; height: auto; position: relative; float: left; margin-top: 15px; margin-bottom: 5px; font-size: 28px; color: #06646E; font-weight: 600; }
.sessao-rodape ul li { width: 100%; height: auto; position: relative; float: left; font-size: 20px; color: #06646E; margin-bottom: 10px; cursor: pointer; border-bottom: 0.5px solid #000000; padding-bottom: 20px; padding-top: 34px; }
.faixa-ctas-rodape { width: 100%; height: auto; position: relative; float: left; margin-bottom: 5px; padding-top: 40px; }
#faixa-parceiros-rodape { width: 100%; height: auto; position: relative; float: left; padding-left: 0px; }
.item-rodape-parceiro { width: 100%; height: auto; position: relative; float: left; padding-top: 40px; margin-bottom: 0px; }
.logo-parceiro-rodape { width: 100%; height: auto; position: relative; float: left; margin-top: 10px; padding: 0px 110px; }
#div-s3-b { width: 100%; height: auto; position: relative; float: left; }
#foto-div-s3 { width: 360px; height: 270px; left: 50%; position: relative; float: left; margin-left: -180px; background-color: #dadada; margin-top: 20px; margin-bottom: -20px; border-radius: 20px; overflow: hidden; }
#foto-int-s3 { width: 150%; height: 800px; position: absolute; left: 50%; top: 50%; margin-left: -254px; margin-top: -201px; }
#terceira-sessao-lp { width: 100%; height: auto; position: relative; float: left; margin-top: -20px; background-color: #ffffff; z-index: 90; }
#div-s3-a { width: 100%; height: auto; position: relative; float: left; }
#div-s3-a h4 { width: 100%; position: relative; float: left; margin-top: 81px; font-size: 48px; color: #08646e; font-family: "Bebas Neue", sans-serif; font-weight: 500; line-height: 45px; text-align: center; }
.txt-valor-bloco-economia { width: 85%; height: auto; position: relative; float: left; margin-top: -1px; margin-left: -60px; color: #2BD33A; font-weight: 700; line-height: 32px; font-size: 27px; }
#janela-resultado-economia { width: 360px; height: 700px; position: fixed; top: -250%; left: 50%; margin-left: -180px; margin-top: -350px; background-color: #fff; border-radius: 20px; z-index: 1999; overflow: hidden; opacity: 0; display: none; }
#toolbar-janela-economia { width: 100%; height: 100px; position: absolute; top: 2px; z-index: 90; padding: 0px 20px; }
#logo-janela-atrek-cal-economia { width: 150px; height: auto; position: relative; float: left; margin-top: 25px; }
#fechar-janela-resultado-economia { width: 40px; height: 40px; position: relative; float: right; margin-top: 35px; background: url('../img/icn-x.png'); background-size: 40px; background-repeat: no-repeat; cursor: pointer; }
#janela-etapas-resultado-economia { width: 1080px; height: 100%; margin-left: 0px; position: relative; float: left; top: 0px; overflow: hidden; }
#faixa-box-resultados-janela { width: 360px; height: 100%; left: 0px; position: relative; float: left; margin-top: 109px; padding-left: 22px; }
#box-resultado-porcentagem { width: 94%; height: 200px; position: relative; float: left; background-color: #0A5059; border-radius: 20px; }
#box-resultado-calculo-final { width: 94%; height: 120px; position: relative; float: left; margin-left: 0%; margin-top: 10px; background-color: #0A5059; border-radius: 20px; }
/*Box resultado porcentagem*/
#ornamento-logo-atrek-resultado { width: 40px; height: 46px; position: absolute; right: 19px; top: 30px; background: url('../img/ornamento-logo-g.png'); background-size: 40px; }
#chamada-resultado-porecentagem { width: 100%; height: auto; position: relative; float: left; margin-top: 18px; padding: 10px 120px 0px 20px; font-size: 19px; line-height: 22px; color: #fff; font-weight: 300; }
#linha-resultado-porcentagem { width: 100%; height: auto; position: relative; float: left; margin-top: -15px; padding: 0px 20px; }
#box-resultado-porcentagem-int { width: 100px; height: 100%; position: relative; float: left; margin-top: 29px; font-size: 44px; color: #2BD33A; font-weight: 400; font-family: "Bebas Neue", sans-serif; }
#legenda-resultado-porcentagem { width: auto; height: auto; position: relative; float: right; margin-top: 39px; line-height: 22px; font-size: 18px; color: #2BD33A; margin-right: 5px; }
/*total de economia*/
#faixa-resultado-total-economia { width: 100%; height: 140px; position: relative; float: left; margin-top: -19px; }
#legenda-total-economia { width: 100px; height: auto; position: relative; float: left; margin-left: 22px; margin-top: 53px; line-height: 23px; font-size: 19px; color: #2BD33A; }
#valor-final-economia-janela { width: 200px; height: auto; position: relative; float: right; margin-right: 20px; margin-top: -34px; text-align: right; font-size: 30px; font-weight: 400; color: #2BD33A; font-family: "Bebas Neue", sans-serif; }
#chamada-cta-janela-resultado { width: 100%; height: auto; position: relative; float: left; margin-top: 10px; padding: 0px 10px; font-size: 17px; line-height: 23px; color: #0A5059; }
#box-cta-janela-resultado { width: 94%; height: auto; position: relative; float: left; margin-left: -6px; margin-top: 30px; }
#cta-s-completa-a { width: auto; height: auto; position: relative; float: right; padding: 16px 40px; background-color: #2BD33A; font-size: 17px; color: #fff; border-radius: 90px; cursor: pointer; }
#janela-resultado-economia { width: 360px; height: 700px; position: fixed; top: -250%; left: 50%; margin-left: -180px; margin-top: -350px; background-color: #fff; border-radius: 20px; z-index: 1999; overflow: hidden; opacity: 0; display: none; }
#toolbar-janela-economia { width: 100%; height: 100px; position: absolute; top: 2px; z-index: 90; padding: 0px 20px; }
#logo-janela-atrek-cal-economia { width: 150px; height: auto; position: relative; float: left; margin-top: 25px; }
#fechar-janela-resultado-economia { width: 40px; height: 40px; position: relative; float: right; margin-top: 35px; background: url('../img/icn-x.png'); background-size: 40px; background-repeat: no-repeat; cursor: pointer; }
#janela-etapas-resultado-economia { width: 1080px; height: 100%; margin-left: 0px; position: relative; float: left; top: 0px; overflow: hidden; }
#faixa-box-resultados-janela { width: 360px; height: 100%; left: 0px; position: relative; float: left; margin-top: 109px; padding-left: 22px; }
#box-resultado-porcentagem { width: 94%; height: 200px; position: relative; float: left; background-color: #0A5059; border-radius: 20px; }
#box-resultado-calculo-final { width: 94%; height: 120px; position: relative; float: left; margin-left: 0%; margin-top: 10px; background-color: #0A5059; border-radius: 20px; }
/*Box resultado porcentagem*/
#ornamento-logo-atrek-resultado { width: 40px; height: 46px; position: absolute; right: 19px; top: 30px; background: url('../img/ornamento-logo-g.png'); background-size: 40px; }
#chamada-resultado-porecentagem { width: 100%; height: auto; position: relative; float: left; margin-top: 18px; padding: 10px 120px 0px 20px; font-size: 19px; line-height: 22px; color: #fff; font-weight: 300; }
#linha-resultado-porcentagem { width: 100%; height: auto; position: relative; float: left; margin-top: -15px; padding: 0px 20px; }
#box-resultado-porcentagem-int { width: 100px; height: 100%; position: relative; float: left; margin-top: 29px; font-size: 44px; color: #2BD33A; font-weight: 400; font-family: "Bebas Neue", sans-serif; }
#legenda-resultado-porcentagem { width: auto; height: auto; position: relative; float: right; margin-top: 39px; line-height: 22px; font-size: 18px; color: #2BD33A; margin-right: 5px; }
/*total de economia*/
#faixa-resultado-total-economia { width: 100%; height: 140px; position: relative; float: left; margin-top: -19px; }
#legenda-total-economia { width: 100px; height: auto; position: relative; float: left; margin-left: 22px; margin-top: 53px; line-height: 23px; font-size: 19px; color: #2BD33A; }
#valor-final-economia-janela { width: 200px; height: auto; position: relative; float: right; margin-right: 20px; margin-top: -34px; text-align: right; font-size: 30px; font-weight: 400; color: #2BD33A; font-family: "Bebas Neue", sans-serif; }
#chamada-cta-janela-resultado { width: 100%; height: auto; position: relative; float: left; margin-top: 10px; padding: 0px 10px; font-size: 17px; line-height: 23px; color: #0A5059; }
#box-cta-janela-resultado { width: 94%; height: auto; position: relative; float: left; margin-left: -6px; margin-top: 30px; }
#cta-s-completa-a { width: auto; height: auto; position: relative; float: right; padding: 16px 40px; background-color: #2BD33A; font-size: 17px; color: #fff; border-radius: 90px; cursor: pointer; }
#faixa-topo-calculadora { width: 100%; height: auto; position: relative; float: left; margin-top: 29px; padding: 25px 10px; margin-bottom: -50px; }
.chamada-p-calculadora { width: 100%; height: auto; position: relative; float: left; line-height: 36px; font-size: 32px; color: #358289; font-weight: 600; margin-top: -41px; }
/*tipo de ligação*/
.chamada-campo-tipo-b { width: 100%; height: auto; position: relative; float: left; margin-top: 48px; font-size: 21px; color: #07646E; padding: 10px 0px; }
#voltar-janela-resultado-economia { width: 40px; height: 40px; position: relative; float: right; margin-top: 25px; margin-right: 10px; background: url('../img/back.png'); background-size: 40px; background-repeat: no-repeat; cursor: pointer; opacity: 0; }
#faixa-box-dados-janela { width: 360px; height: 100%; position: relative; float: left; padding: 0px 22px; margin-top: 109px; /* margin-left: 46px; */ }
.item-campo-formulario-janela { width: 87%; height: auto; position: relative; float: left; padding: 0px 0px; margin-left: 0%; margin-right: 0%; margin-bottom: -5px; }
.item-campo-formulario-janela input { width: 100%; height: auto; position: relative; float: left; font-size: 18px !important; background-color: #F3F3F3 !important; border-radius: 10px !important; padding: 10px 20px !important; border: 0px solid #fff !important; color: #07646E; }
.item-campo-formulario-janela-2x { width: 106%; height: auto; position: relative; float: left; margin-left: -10px; padding: 0px 0px; margin-left: -10px; margin-right: 0px; }
.item-campo-formulario-janela-2x .select-wrapper { background: unset; border-radius: 14px; padding: 0 7px; height: 70px; margin-top: 5px; display: flex; align-items: center; }
#campo-envio-foto { width: 100%; height: auto; position: relative; float: left; margin-left: 0%; padding: 15px 17px; background-color: #F3F3F3; font-size: 16px; color: #0A5059; border-radius: 15px; cursor: pointer; }
#faixa-cta-ultima-etapa-calc { width: 100%; height: auto; position: relative; float: left; }
#cta-s-completa-b { width: 100%; height: auto; position: relative; float: right; margin-top: 19px; padding: 16px 40px; margin-right: 3px; background-color: #2BD33A; font-size: 17px; color: #fff; border-radius: 90px; cursor: pointer; text-aling: center; }
#alerta-coleta-dados { width: 98%; height: auto; position: relative; float: left; padding: 18px 20px; background-color: #f8fff2; border-radius: 20px; font-size: 18px; margin-left: 18px; margin-top: 21px; color: #2f8e38; border: 1px solid #d0fbd0; display: none; }
#janela-envio-calculo { width: 360px; height: 100%; position: relative; float: left; padding: 0px 20px; margin-top: 160px; display: block; }
#nome-usuario-calculo { width: 100%; height: auto; position: relative; float: left; margin-top: 96px; color: #2BD33A; font-size: 42px; text-align: center; font-weight: 600; }
#info-envio-dados { width: 100%; height: auto; position: relative; float: left; font-size: 15px; color: #0A5059; text-align: center; padding: 0px 40px; }
#barra-de-progresso { width: 100%; height: auto; position: relative; float: left; margin-top: 20px; }
#barra-progresso-int { width: 80%; height: 18px; position: relative; margin: auto; background-color: #F3F3F3; overflow: hidden; border-radius: 30px; }
#toolbar-janela-economia { width: 100%; height: 100px; position: absolute; top: 14px; z-index: 90; padding: 0px 20px; }
#logo-janela-atrek-cal-economia { width: 150px; height: auto; position: relative; float: left; margin-top: 17px; }
#fechar-janela-resultado-economia { width: 40px; height: 40px; position: relative; float: right; margin-top: 25px; background: url('../img/icn-x.png'); background-size: 40px; background-repeat: no-repeat; cursor: pointer; }
#toolbar-janela-economia { width: 100%; height: 100px; position: absolute; top: 14px; z-index: 90; padding: 0px 20px; }
#logo-janela-atrek-cal-economia { width: 150px; height: auto; position: relative; float: left; margin-top: 17px; }
#fechar-janela-resultado-economia { width: 40px; height: 40px; position: relative; float: right; margin-top: 25px; background: url('../img/icn-x.png'); background-size: 40px; background-repeat: no-repeat; cursor: pointer; }
#foto-int-s3 { width: 360px; height: 100%; position: absolute; left: 50%; top: 50%; margin-left: -180px; margin-top: -146px; }
/*janela menu seleção perfil desktop*/
#janela-menu-selecao-desktop { width: 90%; height: 430px; position: fixed; left: 5%; top: 0; margin-left: 0px; margin-top: 140px; background-color: #fff; border-radius: 25px; z-index: 2999; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 200ms ease, visibility 0s linear 200ms; will-change: opacity; }
#marcador-menu-fixo { width: 60px; height: 60px; position: absolute; left: 304px; top: -14px; border-radius: 12px; transform: rotate(45deg); background-color: #fff; }
.div-menu-select-perfil-fixo { width: 100%; height: auto; position: relative; float: left; padding: 0px 20px; }
#div-ilustra-select-perfil-fixo { width: 40%; height: 100%; position: relative; float: left; display: none; }
.div-menu-select-perfil-fixo h4 { width: 100%; height: auto; position: relative; float: left; font-size: 25px; font-weight: 600; margin-top: 40px; margin-bottom: 46px; color: #08646e; }
.item-link-perfil-b { width: 100%; height: auto; position: relative; float: left; padding: 0px 0px; padding-bottom: 23px; border-bottom: 1px solid #06646E; margin-bottom: 21px; cursor: pointer; }
.icn-link-perfil-b { width: 50px; height: 50px; position: relative; float: left; background-color: #08646E; border-radius: 10px; }
.txt-link-perfil-b { width: auto; height: auto; position: relative; float: left; margin-left: 15px; margin-top: 14px; font-size: 18px; color: #07646E; }
.seta-link-menu-b { width: 38px; height: 38px; position: absolute; right: -7px; top: 8px; background: url('../img/arrow-menu-link.png'); background-size: 38px; }
#gif-upload-foto { width: 70px; height: 70px; position: absolute; right: 0px; top: 50%; margin-top: -34px; background: url('../img/gif-upload-foto.gif'); background-size: 70px; }
.hide-desktop{display: block;}
.legenda-box-emoji { width: 150px; height: auto; position: absolute; left: 50%; margin-left: -75px; bottom: 43px; font-size: 17px; color: #fff; text-align: center; }
/*Inicio s3 LP*/
#terceira-sessao-lp {
width: 100%;
height: auto;
position: relative;
float: left;
margin-top: 70px;
background-color: #ffffff;
z-index: 120;
border-radius: 50px 50px 0px 0px;
padding-bottom: 92px;
}
#view-terceira-sessao-lp { width: 100%; height: auto; position: relative; margin: auto; padding-top: 500px; padding: 0px 40px; }
#div-s3-a h4 { width: 100%; position: relative; float: left; margin-top: 81px; font-size: 48px; color: #ffffff; font-family: "Bebas Neue", sans-serif; font-weight: 500; line-height: 45px; text-align: center; }
#faixa-sessao-ugc { width: 100%; height: auto; position: relative; float: left; background-color: #fff; border-radius: 50px 50px 0px 0px; z-index: 420; margin-top: -50px; }
#inicio-comparacao-mobile { display: block; }
.txt-link-perfil { width: auto; height: auto; position: relative; float: left; margin-left: 20px; margin-top: 23px; font-size: 17px; color: #07646E; transition: color 0.25s ease; }
#janela-contato-enviado { width: 350px; height: 450px; position: fixed; top: 50%; left: 50%; margin-left: -175px; margin-top: -225px; background-color: #fff; border-radius: 30px; z-index: 1999; overflow: hidden; }
#nome-usuario-calculo { width: 100%; height: auto; position: relative; float: left; margin-top: 96px; color: #2BD33A; font-size: 39px; text-align: center; font-weight: 600; }
#logo-a-trek-contato-enviado { width: 100%; height: 59px; position: absolute; bottom: 48px; }
}
/*Inicio media queries*/
@media only screen
and (min-width:220px) and (max-width:440px) {
#janela-player-ugc { width: 315px; height: 560px; position: fixed; left: 50%; top: 50%; margin-left: -157px; margin-top: -300px; background-color: unset; overflow: hidden; border-radius: 30px; z-index: 1999; display: none; opacity: 0; }
.mobile { display: block; }
.hide-mobile { display: none; }
.desktop { display: none; }
.hide-desktop{display: block;}
#faixa-navegacao-slider { display: none; }
.icn-link-perfil { width: 60px; height: 60px; position: relative; float: left; background-color: #08646E; border-radius: 20px; }
.icn-int-link-perfil { width: 25px; height: 25px; position: absolute; left: 50%; top: 50%; margin-left: -12.5px; margin-top: -12.5px; }
.txt-link-perfil { width: auto; height: auto; position: relative; float: left; margin-left: 15px; margin-top: 17px; font-size: 18px; color: #07646E; }
.seta-link-menu { width: 45px; height: 45px; position: absolute; right: -9px; top: 6px; background: url('../img/arrow-menu-link.png'); background-size: 45px; }
#div-s3-a { width: 100%; height: auto; position: relative; float: left; }
#div-s3-b { width: 100%; height: auto; position: relative; float: left; }
#faixa-navegacao-slider { width: 100%; height: auto; position: relative; float: left; margin-top: 30px; }
#mascara-banner-topo { width: 100%; height: 100%; position: absolute !important; top: 0px !important; z-index: 9 !important; background-color: #000; opacity: 0; }
/*Whatsapp flutuante*/
#cta-wpp-topo { width: 180px; height: auto; position: fixed; right: 50%; margin-right: -90px; bottom: -350px; padding: 15px 30px 15px 60px; border-radius: 150px; border: 0.3px solid #64E877; color: #fff; font-size: 20px; z-index: 9999; background-color: #2BD33A; cursor: pointer; -webkit-transition: bottom 1s ease; -moz-transition: bottom 1s ease; -o-transition: bottom 1s ease; transition: bottom 1s ease; }
#cta-wpp-topo.ativo { bottom: 20px; }
#menu-fixo {
width: 90%;
height: 75px;
position: relative;
margin: auto;
background-color: rgba(255, 255, 255, 0);
border-radius: 220px;
border: 1px solid rgba(238, 238, 238, 0);
-webkit-transition: width 0.3s ease;
-moz-transition: width 0.3s ease;
-o-transition: width 0.3s ease;
transition: width 0.3s ease;
}
#logo-menu-topo { width: 134px; height: 70px; position: relative; float: left; margin-left: 15px; margin-top: 8px; background: url('../img/atrek-negativa.png'); background-size: 134px; }
.item-estrela-ugc { width: 18px; height: 18px; position: relative; float: left; margin-top: 10px; margin-right: 5px; background: url('../img/estrela.png'); background-size: 18px; }
.icn-segmento { width: 40px; height: 40px; position: absolute; right: 25px; top: 30px; background-color: #08646E; border-radius: 50%; }
.icn-int { width: 20px; height: 20px; position: absolute; left: 50%; top: 50%; margin-left: -10px; margin-top: -10px; }
.tag-nome-ugc { width: auto; height: auto; position: absolute; left: 20px; bottom: 25px; background-color: #fff; padding: 10px 25px; color: #000; font-size: 16px; border-radius: 60px; }
.tag-play { width: 50px; height: 50px; position: absolute; right: 20px; bottom: 22px; background-color: #2BD33A; border-radius: 50%; }
.icn-tag-play { width: 40px; height: 40px; position: absolute; left: 50%; top: 50%; margin-left: -20px; margin-top: -20px; background: url('../img/play-ugc.png'); background-size: 40px; }
#div-resultado-calculadora-interno { width: 90%; height: auto; position: relative; margin: auto; background-color: #41C771; padding: 30px 20px; color: #fff; text-align: left; font-size: 14px; border-radius: 16px; }
.caixa-externa-componente-slider { width: 90%; height: 150px; position: relative; margin: auto; background-color: #f3f3f3; border-radius: 20px; }
#faixa-cards-slide-google { width: 100%; height: auto; position: relative; float: left; margin-top: 10px; }
.item-card-dep-google { width: auto; height: 290px !important; position: relative; float: left; background-color: #F3F3F3; border-radius: 24px; }
.titulo-card-google { width: 100%; height: auto; position: relative; float: left; margin-top: 30px; padding: 0px 30px; font-size: 18px; color: #08646E; font-weight: 600; }
.faixa-card-google-estrelas { width: 100%; height: auto; position: absolute; bottom: 30px; padding: 0px 30px; }
.item-estrela-card-google { width: 20px; height: 20px; position: relative; float: left; margin-right: 7px; background: url('../img/estrela-depoimento.png'); background-size: 20px; }
.item-link-perfil { width: 100%; height: auto; position: relative; float: left; padding: 0px 0px; padding-bottom: 25px; border-bottom: 1px solid #06646E; margin-bottom: 36px; cursor: pointer; margin-top: -10px; }
#lista-itens-menu-fixo { width: 60%; height: auto; position: relative; float: left; margin-left: 30px; margin-top: 9px; display: none; }
#cta-menu-mobile { width: 50px; height: 50px; position: relative; float: right; margin-right: 14px; margin-top: 11px; background: url('../img/cta-menu-mobile.png'); background-size: 50px; cursor: pointer; }
#menu-fixo.ativo { width: 90%; }
/*cta simular projeto*/
#cta-simular-projeto-m { width: auto; height: auto; position: relative; float: right; margin-top: 15px; margin-right: 26px; background-color: #2BD33A; color: #fff; font-size: 20px; border-radius: 50px; padding: 10px 60px 10px 20px; cursor: pointer; display: none; }
/*Inicio banner topo*/
#banner-topo { width: 100%; height: 112%; position: relative; float: left; overflow: hidden; }
#conteudo-banner-topo { width: 100%; height: auto; top: unset; margin-top: unset; bottom: 159px; position: absolute !important; }
#cta-banner-topo { width: 303px; height: auto; left: 50%; position: relative; float: left; background-color: #2BD33A; color: #fff; font-size: 19px; margin-left: -151.5px; border: 1px solid #45b84f; padding: 15px 40px 17px 22px; border-radius: 90px; cursor: pointer; font-weight: 600; }
#view-banner-topo { width: 100%; height: auto; position: relative; margin: auto; padding: 0px 40px; }
#conteudo-banner-topo h1 { width: 100%; height: auto; position: relative; float: left; font-size: 22px; color: #fff; font-weight: 700; text-align: center; }
#conteudo-banner-topo p { width: 100%; height: auto; position: relative; float: left; margin-top: -15px; font-size: 16px; color: #fff; font-weight: 300; line-height: 24px; padding: 0px 20px; text-align: center; }
#view-faixa-calculadora-economia { width: 370px; height: auto; position: relative; margin: auto; }
.div-conteudo-s2-divisoria { width: 100%; height: auto; position: relative; float: left; }
#view-faixa-calculadora-economia { width: 92%; height: auto; position: relative; margin: auto; }
.div-conteudo-s2-divisoria { width: 100%; height: auto; position: relative; float: left; }
.div-conteudo-s2-divisoria h2 { width: 100%; height: auto; position: relative; float: left; margin-top: 75px; color: #07646F; font-size: 26px; font-weight: 700; text-align: center; line-height: 25px; }
.div-conteudo-s2-divisoria h2 span { color: #2BD33A; }
#sombra-banner-topo { width: 200%; height: 700px; position: absolute !important; left: -50%; bottom: 0; z-index: 90; background: #000; background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%); background: -moz-linear-gradient(bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%); background: -o-linear-gradient(bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%); background: linear-gradient(to top, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%); }
#tag-tempo-simulacao { width: 340px; height: auto; right: 50%; position: relative; float: right; margin-top: 5px; margin-right: -170px; background-color: #0A505A; border-radius: 20px; overflow: hidden; }
#icn-tag-simulacao { width: 20%; height: 73px; position: relative; float: left; background-color: #2BD33A; padding: 18px 15px 15px 15px; margin-top: 0px; }
#tag-tempo-simulacao-txt { width: 80%; height: auto; position: relative; float: left; padding: 16px 20px; color: #fff; font-weight: 300; font-size: 13px; }
/*Inicio faixa calculadora de economia*/
#faixa-calculadora-economia-topo { width: 100%; height: auto; position: relative; float: left; padding-top: 70px; }
#calculadora-de-economia { width: 100%; height: 995px; position: relative; margin: auto; background-color: #fff; border-radius: 40px; -webkit-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); -moz-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); -o-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); -ms-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); padding: 13px 20px 0px 20px; }
#faixa-topo-calculadora { width: 100%; height: auto; position: relative; float: left; margin-top: 13px; padding: 25px 5px; margin-bottom: -50px; }
#raio-topo-calculdora { width: 35px; height: 35px; position: relative; float: right; margin-top: 10px; margin-right: 0px; background: url('../img/raios.png'); background-size: 35px; }
/*Inicio calculadora economia*/
#div-calculadora-economia { width: 100%; height: auto; position: relative; float: left; z-index: 600; margin-top: -90px; background-color: #fff; border-radius: 50px 50px 0px 0px; }
.coluna-formulario-calculadora-a { width: 100%; height: auto; position: relative; float: left; padding: 0px 10px; margin-bottom: 13px; }
.coluna-formulario-calculadora { width: 100%; height: auto; position: relative; float: left; padding: 0px 0px; margin-bottom: 28px; }
.chamada-p-calculadora { width: 100%; height: auto; position: relative; float: left; line-height: 26px; font-size: 22px; color: #358289; font-weight: 600; margin-top: -27px; }
.campo-valor-conta-calc { width: 75%; height: 30px; position: relative; float: left; margin-left: 10px; }
.select-wrapper input.select-dropdown { border: none !important; height: 56px; line-height: normal; font-size: 15px; display: flex; padding-top: 20px; padding-left: 5px; align-items: center; color: #08646E; }
/*tipo de ligação*/
.chamada-campo-tipo-b { width: 100%; height: auto; position: relative; float: left; margin-top: 29px; font-size: 18px; color: #07646E; padding: 10px 0px; }
/*Item box seletor*/
.item-box-seletor { width: 28%; height: 75px; position: relative; float: left; margin-left: 0%; margin-right: 7.5%; background-color: #F2F4F2; border-radius: 15px; cursor: pointer; }
.item-box-seletor:last-child { margin-right: 0%; }
.legenda-box-seletor { width: 120%; height: auto; position: absolute; left: -10%; bottom: -27px; color: #08646E; font-size: 14px; text-align: center; opacity: 0.9; }
/*cta calcular conta*/
#cta-calcular-conta { width: 100%; height: auto; position: relative; float: left; margin-top: 0px; padding: 15px 20px 15px 20px; font-size: 20px; color: #fff; text-align: center; background-color: #2BD33A; border-radius: 50px; cursor: pointer; }
#icn-cta-calculadora { width: 45px; height: 45px; position: absolute; right: 17px; top: 10px; background-color: #fff; border-radius: 50%; display: none; }
.select-calc-mobile { margin-top: 20px; padding: 0px 14px; }
#foto-div-s3 { width: 100%; height: 360px; position: relative; float: left; background-color: #dadada; margin-top: 20px; border-radius: 20px; overflow: hidden; }
#foto-int-s3 { width: 500px; height: 800px; position: absolute; left: 50%; top: 50%; margin-left: -250px; margin-top: -181px; }
#view-faixa-de-ugcs { width: 100%; height: auto; position: relative; margin: auto; }
#view-faixa-de-ugcs h5 { width: 100%; height: auto; position: relative; float: left; margin-top: 60px; text-align: center; color: #08646E; font-size: 25px; font-weight: 600; padding: 0px 20px; }
#faixa-infos-carrossel-ugc { width: 100%; height: auto; position: relative; float: left; font-size: 16px; color: #08646E; text-align: center; margin-top: 60px; margin-bottom: 20px; padding: 0px 80px; }
/*inicio faixa cards UGCs int*/
#faixa-cards-ugcs-int { width: 100%; height: 441px; position: relative; float: left; margin-top: 40px; }
/*controles ugc*/
.item-controle-ugc { width: 60px; height: 60px; position: absolute; left: 20px; top: 50%; margin-top: 688px; background-color: #2bd33a; border-radius: 50%; cursor: pointer; z-index: 90; }
.item-controle-ugc-b { width: 60px; height: 60px; position: absolute; right: 20px; top: 50%; margin-top: 688px; background-color: #2bd33a; border-radius: 50%; cursor: pointer; z-index: 90; }
.seta-int-controle-ugc { width: 30px; height: 30px; position: absolute; left: 50%; top: 50%; margin-left: -15px; margin-top: -15px; }
#div-s4 {
width: 100%;
height: auto;
position: relative;
float: left;
margin-top: 0px;
margin-bottom: 40px;
}
#div-s4-bg { width: 100%; height: 470px; position: absolute; top: 50%; margin-top: -240px; background-color: #3cd272; display: none; }
#view-div-s4 { width: 95%; height: auto; position: relative; margin: auto; }
/*Inicio calculadora tempo real*/
#box-calculadora-tempo-real { width: 100%; height: 600px; left: 0%; position: relative; float: left; margin-top: 0px; margin-left: 0px; background-color: #FFF; border-radius: 9; -webkit-box-shadow: 0px 0px 84px 0px rgba(0, 0, 0, 0.15); -moz-box-shadow: 0px 0px 84px 0px rgba(0, 0, 0, 0.15); -ms-box-shadow: 0px 0px 84px 0px rgba(0, 0, 0, 0.15); -o-box-shadow: 0px 0px 84px 0px rgba(0, 0, 0, 0.15); box-shadow: 0px 0px 84px 0px rgba(0, 0, 0, 0); border-radius: 30px; }
#div-titulo-calculadora-tempo-real { width: 100%; height: 50px; position: relative; float: left; margin-top: 26px; margin-bottom: -27px; font-size: 28px; color: #08646E; text-align: center; font-weight: 800; }
#div-resultado-final-txt { width: 100%; height: auto; position: relative; float: left; color: #fff; text-align: left; font-size: 17px; margin-top: -13px; font-weight: 600; }
#legenda-tempo-resultado-tempo-real { width: auto; height: auto; position: absolute; right: 20px; top: 17px; font-size: 16px; color: #fff; }
.faixa-info-slider p { width: 50%; height: auto; position: relative; float: left; font-size: 15px; color: #07646E; padding: 0px 20px; line-height: 16px; margin-top: 22px; }
.box-info-resultado-slider { width: auto; height: auto; position: relative; float: right; margin-right: 20px; margin-top: 20px; padding: 10px 13px; font-size: 14px; color: #fff; background-color: #41C771; border-radius: 12px; }
#carta-verde { width: 590px; height: 619px; position: absolute; right: 0px; top: 160px; background: url('../img/conta-verde.png'); background-size: 581px; z-index: 90; display: none; }
#carta-vermelha { width: 550px; height: 619px; position: absolute; right: 290px; top: 150px; background: url('../img/conta-vermelha.png'); background-size: 550px; display: none; }
/*Inicio avaliações do google*/
#div-avaliacoes-google { width: 100%; height: auto; position: relative; float: left; margin-top: -10px; }
#view-chamada-avaliacoes-google { width: 90%; height: auto; position: relative; margin: auto; }
#view-chamada-avaliacoes-google h4 { width: 100%; height: auto; position: relative; float: left; font-size: 29px; color: #06646E; font-weight: 700; text-align: center; }
#view-chamada-avaliacoes-google p { width: 100%; height: auto; position: relative; float: left; margin-top: -7px; line-height: 26px; font-size: 18px; color: #06646E; font-weight: 300; text-align: center; padding: 0px 20px; }
#view-navegacao { width: 90%; height: auto; position: relative; margin: auto; }
#item-nav-dp-e { width: 45px; height: 45px; position: relative; float: left; background-color: #08646E; border-radius: 50%; cursor: pointer; }
#item-nav-dp-d { width: 45px; height: 45px; position: relative; float: right; background-color: #08646E; border-radius: 50%; cursor: pointer; }
#seta-e-int-dep { width: 24px; height: 24px; position: absolute; left: 50%; top: 50%; margin-top: -12px; margin-left: -12px; background: url('../img/seta-e-dep.png'); background-size: 24px; }
#seta-d-int-dep { width: 24px; height: 24px; position: absolute; left: 50%; top: 50%; margin-top: -12px; margin-left: -12px; background: url('../img/seta-d-dep.png'); background-size: 24px; }
.logo-google { width: 30px; height: 30px; position: absolute; right: 30px; top: 28px; background: url('../img/g-logo.png'); background-size: 30px; }
.dep-txt { width: 100%; height: auto; position: relative; float: left; margin-top: 12px; padding: 0px 30px; font-size: 16px; color: #06646E; }
/* bolinhas */
#paginacao-dep-dots .swiper-pagination-bullet { width: 15px; height: 15px; margin: 0 !important; border-radius: 50%; opacity: 1; background: #b8e48d; flex: 0 0 auto; transition: 0.25s ease; }
#div-c-perfil-view { width: 90%; height: auto; position: relative; margin: auto; }
.div-c-perfil-view-a { width: 100%; height: auto; position: relative; float: left; }
#foto-selecao-perfil { width: 100%; height: 230px; position: relative; float: left; margin-top: 10px; border-radius: 30px; overflow: hidden; }
#conteudo-div-foto-perfil { width: 100%; height: auto; position: relative; float: left; top: 50%; left: -26px; margin-top: -17px; font-size: 22px; text-align: center; color: #fff; z-index: 90; }
#raio-txt { width: 40px; height: 40px; position: absolute; right: 5px; top: -3px; background: url('../img/ornamento-logo.png'); background-size: 40px; }
.div-c-perfil-view-b { width: 100%; height: auto; position: relative; float: left; margin-top: 61px; padding: 0px 10px; }
/*Inicio lista de comparação*/
#div-comparacao-concorrente { width: 100%; height: auto; position: relative; float: left; margin-top: 0px; }
#view-div-comparacao-concorrente { width: 90%; height: auto; position: relative; margin: auto; display: none; }
#inicio-comparacao-mobile { width: 100%; height: auto; position: relative; float: left; margin-top: 20px; margin-bottom: -30px; display: block; }
#chamada-comparacao-mobile { width: 100%; height: auto; position: relative; float: left; }
#chamada-comparacao-mobile-int { width: 350px; height: auto; position: relative; margin: auto; font-size: 28px; line-height: 32px; margin-bottom: 20px; color: #08646E; text-align: center; }
#faixa-marcador-lista-mobile { width: 100%; height: auto; position: relative; float: left; }
#pilula-marcador-lista-mobile { width: 360px; height: 80px; position: relative; margin: auto; background-color: #06646E; border-radius: 60px; }
.item-lista-marcador-txt { width: 50%; height: auto; position: relative; float: left; padding: 10px 10px; color: #fff; font-size: 24px; padding-top: 22px; text-align: center; z-index: 10; cursor: pointer; }
.marcador-lista-bg { width: 140px; height: 56px; position: absolute; left: 20px; top: 12px; background-color: #fff; border-radius: 90px; z-index: 1; }
.atv-menu-lista-comp { color: #37C96B; font-weight: 600; }
.box-lista-com-mobile { width: 100%; height: auto; position: relative; float: left; overflow: hidden; margin-top: 10px; padding-bottom: 60px; }
#esteira-lista-comp-mobile { width: 200%; height: auto; position: relative; float: left; }
.item-lista-comp-mobile-int { width: 50%; height: auto; position: relative; float: left; padding: 0px 40px; }
.txt-lista-comparacao { width: 75%; height: auto; position: relative; float: left; margin-left: 15px; font-size: 19px; margin-top: 0px; color: #07646F; }
.box-int-destaque-lista { width: 100%; height: 450px; position: relative; float: left; margin-left: 0px; background-color: #1CC636; border-radius: 20px; overflow: hidden; padding: 0px 30px 0px 30px; }
.fix-l-1 { margin-top: 4px; }
#esteira-lista-comp-mobile { margin-left: 0%; -webkit-transition: margin-left 0.45s ease; -moz-transition: margin-left 0.45s ease; -o-transition: margin-left 0.45s ease; transition: margin-left 0.45s ease; }
.marcador-lista-bg { width: 140px; left: 20px; -webkit-transition: left 0.45s ease, width 0.45s ease; -moz-transition: left 0.45s ease, width 0.45s ease; -o-transition: left 0.45s ease, width 0.45s ease; transition: left 0.45s ease, width 0.45s ease; }
/*Selecao perfil*/
#foto-int-selecao-perfil { width: 400px; height: 454px; position: absolute; left: 50%; top: 50%; margin-left: -200px; margin-top: -162px; background: url('../img/foto-selecao-perfil.jpg'); background-size: 400px; }
/*chamada economia*/
#faixa-economia { width: 100%; height: auto; position: relative; float: left; margin-top: 60px; line-height: 40px; }
#view-faixa-economia { width: 95%; height: auto; position: relative; margin: auto; max-width: 1700px; padding: 0px 20px; }
#view-faixa-economia h6 { width: 100%; height: auto; position: relative; float: left; font-size: 50px; font-family: "Bebas Neue", sans-serif; text-transform: uppercase; color: #0A5059; line-height: 48px; margin-top: -19px; margin-bottom: 22px; }
.item-bloco-economia { width: 100%; height: 250px; position: relative; float: left; margin-left: 0%; background-color: #0A5059; border-radius: 20px; overflow: hidden; }
.logo-ornamento-int-g { width: 40px; height: 40px; position: absolute; left: 50%; top: 50%; margin-left: -27px; margin-top: -4px; }
.txt-bloco-economia { width: 70%; height: auto; position: relative; float: left; margin-top: 104px; font-size: 27px; margin-left: -80px; color: #fff; }
.txt-valor-bloco-economia { width: 90%; height: auto; position: relative; float: left; margin-top: -104px; margin-left: 33px; color: #2BD33A; font-weight: 700; line-height: 32px; font-size: 42px; }
.f-v-1 { font-size: 19px; }
.f-v-2 { font-size: 24px; color: #fff !important; margin-top: -10px; /* line-height: 10px; */ /* margin-top: 0px; */ }
#view-bloco-video-rodape { width: 90%; height: auto; position: relative; margin: auto; }
#view-bloco-video-rodape h6 { width: 100%; height: auto; position: relative; float: left; margin-top: 39px; font-size: 24px; color: #0A5059; padding: 0px 20px; text-align: center; }
#player-yt-rodape { width: 340px; height: 203px; position: relative; margin: auto; border-radius: 20px; overflow: hidden; }
/*inicio rodape*/
#div-rodape { width: 100%; height: auto; position: relative; float: left; margin-top: 50px; padding-bottom: 130px; }
#view-div-rodape { width: 100%; height: auto; position: relative; margin: auto; padding: 0px 20px; }
#logo-rodape { width: 210px; height: auto; position: relative; margin: auto; }
.sessa-a-rodape { width: 100% !important; }
.sessao-rodape { width: 100%; height: auto; position: relative; float: left; }
.chamada-rodape { width: 100%; height: auto; position: relative; float: left; margin-top: 15px; margin-bottom: 5px; font-size: 24px; color: #06646E; font-weight: 600; }
.sessao-rodape ul li { width: 100%; height: auto; position: relative; float: left; font-size: 18px; color: #06646E; margin-bottom: 5px; cursor: pointer; border-bottom: 0.5px solid #b3bcbd; padding-bottom: 20px; padding-top: 22px; }
.faixa-ctas-rodape { width: 100%; height: auto; position: relative; float: left; margin-bottom: 5px; padding-top: 40px; }
#faixa-parceiros-rodape { width: 100%; height: auto; position: relative; float: left; padding-left: 0px; }
.item-rodape-parceiro { width: 100%; height: auto; position: relative; float: left; padding-top: 40px; margin-bottom: 0px; }
.logo-parceiro-rodape { width: 100%; height: auto; position: relative; float: left; margin-top: 10px; padding: 0px 110px; }
#div-s3-a { width: 100%; height: auto; position: relative; float: left; }
#div-s3-b { width: 100%; height: auto; position: relative; float: left; }
.icn-link-perfil { width: 55px; height: 55px; position: relative; float: left; background-color: #08646E; border-radius: 15px; }
.icn-int-link-perfil { width: 25px; height: 25px; position: absolute; left: 50%; top: 50%; margin-left: -12.5px; margin-top: -12.5px; }
.txt-link-perfil { width: auto; height: auto; position: relative; float: left; margin-left: 9px; margin-top: 18px; font-size: 16px; color: #07646E; }
.seta-link-menu { width: 35px; height: 35px; position: absolute; right: 0px; top: 10px; background: url('../img/arrow-menu-link.png'); background-size: 35px; }
#view-banner-topo { width: 100%; height: auto; position: relative; margin: auto; padding: 0px 20px; }
#conteudo-banner-topo h1 { width: 100%; height: auto; position: relative; float: left; font-size: 22px; color: #fff; font-weight: 700; text-align: center; }
#conteudo-banner-topo p { width: 100%; height: auto; position: relative; float: left; margin-top: -15px; font-size: 16px; color: #fff; font-weight: 300; line-height: 21px; padding: 0px 20px; text-align: center; }
/*Inicio s3 LP*/
#terceira-sessao-lp { width: 100%; height: auto; position: relative; float: left; margin-top: 0px; background-color: #ffffff; z-index: 90; }
#view-terceira-sessao-lp { width: 100%; height: auto; position: relative; margin: auto; padding-top: 500px; padding: 0px 25px; }
#div-s3-a h4 { width: 89%; position: relative; float: left; margin-top: 50px; font-size: 42px; color: #09646e; font-family: "Bebas Neue", sans-serif; font-weight: 500; line-height: 41px; }
#faixa-infos-carrossel-ugc { width: 100%; height: auto; position: relative; float: left; font-size: 14px; color: #08646E; text-align: center; margin-top: 8px; margin-bottom: 20px; padding: 0px 20px; }
/*inicio faixa cards UGCs int*/
#faixa-cards-ugcs-int { width: 100%; height: 450px; position: relative; float: left; margin-top: 20px; margin-bottom: 10px; }
/*controles ugc*/
.item-controle-ugc { width: 50px; height: 50px; position: absolute; left: 20px; top: 50%; margin-top: 685px; background-color: #2bd33a; border-radius: 50%; cursor: pointer; z-index: 90; display: none; }
.item-controle-ugc-b { width: 50px; height: 50px; position: absolute; right: 20px; top: 50%; margin-top: 685px; background-color: #2bd33a; border-radius: 50%; cursor: pointer; z-index: 90; display: none; }
#view-chamada-avaliacoes-google h4 { width: 100%; height: auto; position: relative; float: left; font-size: 26px; color: #06646E; font-weight: 700; text-align: center; }
.txt-lista-comparacao { width: 75%; height: auto; position: relative; float: left; margin-left: 15px; font-size: 18px; margin-top: -4px; color: #07646F; }
#view-faixa-economia h6 { width: 80%; height: auto; position: relative; float: left; font-size: 49px; font-family: "Bebas Neue", sans-serif; text-transform: uppercase; color: #0A5059; line-height: 41px; margin-top: -20px; margin-bottom: 19px; }
.item-bloco-economia { width: 100%; height: 210px; position: relative; float: left; margin-left: 2%; background-color: #0A5059; border-radius: 20px; overflow: hidden; }
.txt-bloco-economia { width: 100%; height: auto; position: relative; float: left; margin-top: 35px; font-size: 27px; margin-left: 26px; color: #fff; }
.txt-valor-bloco-economia { width: 90%; height: auto; position: relative; float: left; margin-top: 0px; margin-left: 26px; color: #2BD33A; font-weight: 700; line-height: 32px; font-size: 27px; }
.icn-raio-a { width: 45px; height: 45px; position: absolute; left: 50%; top: 50%; margin-left: -22.5px; margin-top: -22.5px; background: url(../img/icn-raio.gif); background-size: 45px; }
.icn-raio-b { width: 45px; height: 45px; position: absolute; left: 50%; top: 50%; margin-left: -27.5px; margin-top: -22.5px; background: url(../img/icn-raio.gif); background-size: 45px; }
.icn-raio-b-2 { width: 45px; height: 45px; position: absolute; top: 1px; right: -16px; background: url(../img/icn-raio.gif); background-size: 45px; }
.icn-raio-b-3 { width: 45px; height: 45px; position: absolute; top: 1px; left: -15px; background: url(../img/icn-raio.gif); background-size: 45px; }
.icn-raio-d { width: 45px; height: 45px; position: absolute; left: 50%; top: 50%; margin-left: -20.5px; margin-top: -22.5px; background: url(../img/icn-raio.gif); background-size: 45px; }
/*inicio seletor de região*/
.item-seletor-regiao { width: 48%; height: 83px; position: relative; float: left; margin-left: 0%; margin-right: 4%; background-color: #F2F4F2; border-radius: 15px; cursor: pointer; }
.item-seletor-regiao:last-child { margin-left: 0%; margin-right: 0%; }
.txt-seletor-regiao { width: 100%; height: auto; position: relative; float: left; margin-top: 29px; font-size: 20px; color: #08646E; text-align: center; font-weight: 700; }
.icn-segmento-calc { width: 30px; height: 30px; position: absolute; left: 50%; top: 50%; margin-left: -15px; margin-top: -15px; }
.icn-segmento-residencia { background: url('../img/residencia.png'); background-size: 30px; }
.icn-segmento-empresas { background: url('../img/empresas.png'); background-size: 30px; }
.icn-segmento-rural { background: url('../img/rural.png'); background-size: 30px; }
.prefixo-valor-calculadora { width: auto; height: 100%; position: relative; float: left; margin-top: 14px; font-size: 21px; color: #08646E; font-weight: 400; }
.campo-valor-conta-calc input { width: 100%; height: auto; position: relative; float: left; background-color: #F3F3F3 !important; border-radius: 10px !important; border: 0px solid #000 !important; color: #07646E; font-size: 17px !important; padding: 5px 20px !important; }
.prefixo-valor-calculadora { width: auto; height: 100%; position: relative; float: left; margin-top: 12px; font-size: 19px; color: #08646E; font-weight: 400; }
/*cta calcular conta*/
#cta-calcular-conta { width: 100%; height: auto; position: relative; float: left; margin-top: 10px; padding: 15px 20px 15px 20px; font-size: 20px; color: #fff; text-align: center; background-color: #2BD33A; border-radius: 50px; cursor: pointer; font-weight: 500; }
.campo-valor-conta-calc { width: 75%; height: 30px; position: relative; float: left; margin-left: 10px; }
/*tipo de ligação*/
.chamada-campo-tipo-b { width: 100%; height: auto; position: relative; float: left; margin-top: 27px; margin-bottom: 0px; font-size: 16px; color: #07646E; padding: 10px 0px; font-weight: 600; }
.coluna-formulario-calculadora { width: 100%; height: auto; position: relative; float: left; padding: 0px 10px; margin-bottom: 27px; }
#calculadora-de-economia { width: 100%; height: 934px; position: relative; margin: auto; background-color: #fff; border-radius: 40px; -webkit-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); -moz-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); -o-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); -ms-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0); padding: 13px 0px 0px 0px; border: 0.4px solid #dadada; padding: 15px 20px 0px 23px; }
.icn-lista-comparacao { width: 30px; height: 30px; position: relative; float: left; }
.txt-lista-destaque { width: 80%; height: auto; position: relative; float: left; margin-top: 0px; margin-left: 14px; font-size: 16px; color: #fff; font-weight: 300; }
.box-int-destaque-lista h3 { width: 100%; height: auto; position: relative; float: left; margin-top: 56px; margin-bottom: -2px; font-size: 26px; color: #fff; font-weight: 600; }
#janela-resultado-economia { width: 360px; height: 700px; position: fixed; top: -250%; left: 50%; margin-left: -180px; margin-top: -350px; background-color: #fff; border-radius: 20px; z-index: 1999; overflow: hidden; opacity: 0; display: none; }
#toolbar-janela-economia { width: 100%; height: 100px; position: absolute; top: 2px; z-index: 90; padding: 0px 20px; }
#logo-janela-atrek-cal-economia { width: 150px; height: auto; position: relative; float: left; margin-top: 25px; }
#fechar-janela-resultado-economia { width: 40px; height: 40px; position: relative; float: right; margin-top: 35px; background: url('../img/icn-x.png'); background-size: 40px; background-repeat: no-repeat; cursor: pointer; }
#janela-etapas-resultado-economia { width: 1080px; height: 100%; margin-left: 0px; position: relative; float: left; top: 0px; overflow: hidden; }
#faixa-box-resultados-janela { width: 360px; height: 100%; left: 0px; position: relative; float: left; margin-top: 109px; padding-left: 22px; }
#box-resultado-porcentagem { width: 94%; height: 200px; position: relative; float: left; background-color: #0A5059; border-radius: 20px; }
#box-resultado-calculo-final { width: 94%; height: 120px; position: relative; float: left; margin-left: 0%; margin-top: 10px; background-color: #0A5059; border-radius: 20px; }
/*Box resultado porcentagem*/
#ornamento-logo-atrek-resultado { width: 40px; height: 46px; position: absolute; right: 19px; top: 30px; background: url('../img/ornamento-logo-g.png'); background-size: 40px; }
#chamada-resultado-porecentagem { width: 100%; height: auto; position: relative; float: left; margin-top: 18px; padding: 10px 120px 0px 20px; font-size: 19px; line-height: 22px; color: #fff; font-weight: 300; }
#linha-resultado-porcentagem { width: 100%; height: auto; position: relative; float: left; margin-top: -15px; padding: 0px 20px; }
#box-resultado-porcentagem-int { width: 100px; height: 100%; position: relative; float: left; margin-top: 29px; font-size: 44px; color: #2BD33A; font-weight: 400; font-family: "Bebas Neue", sans-serif; }
#legenda-resultado-porcentagem { width: auto; height: auto; position: relative; float: right; margin-top: 39px; line-height: 22px; font-size: 18px; color: #2BD33A; margin-right: 5px; }
/*total de economia*/
#faixa-resultado-total-economia { width: 100%; height: 140px; position: relative; float: left; margin-top: -19px; }
#legenda-total-economia { width: 100px; height: auto; position: relative; float: left; margin-left: 22px; margin-top: 53px; line-height: 23px; font-size: 19px; color: #2BD33A; }
#valor-final-economia-janela { width: 200px; height: auto; position: relative; float: right; margin-right: 20px; margin-top: -34px; text-align: right; font-size: 30px; font-weight: 400; color: #2BD33A; font-family: "Bebas Neue", sans-serif; }
#chamada-cta-janela-resultado { width: 100%; height: auto; position: relative; float: left; margin-top: 10px; padding: 0px 10px; font-size: 17px; line-height: 23px; color: #0A5059; }
#box-cta-janela-resultado { width: 94%; height: auto; position: relative; float: left; margin-left: -6px; margin-top: 30px; }
#cta-s-completa-a { width: auto; height: auto; position: relative; float: right; padding: 16px 40px; background-color: #2BD33A; font-size: 17px; color: #fff; border-radius: 90px; cursor: pointer; }
#faixa-topo-calculadora { width: 100%; height: auto; position: relative; float: left; margin-top: 1px; padding: 25px 10px; margin-bottom: -50px; }
.chamada-p-calculadora { width: 100%; height: auto; position: relative; float: left; line-height: 26px; font-size: 20px; color: #358289; font-weight: 600; margin-top: -24px; }
/*tipo de ligação*/
.chamada-campo-tipo-b { width: 100%; height: auto; position: relative; float: left; margin-top: 15px; font-size: 16px; color: #07646E; padding: 10px 0px; }
#calculadora-de-economia { width: 100%; height: 918px; position: relative; margin: auto; background-color: #fff; border-radius: 29px; -webkit-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); -moz-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); -o-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); -ms-box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0.23); box-shadow: 0px 0px 72px -11px rgba(0, 0, 0, 0); padding: 13px 0px 0px 0px; border: 0.4px solid #dadada; padding: 15px 15px 0px 15px; }
#voltar-janela-resultado-economia { width: 40px; height: 40px; position: relative; float: right; margin-top: 25px; margin-right: 10px; background: url('../img/back.png'); background-size: 40px; background-repeat: no-repeat; cursor: pointer; opacity: 0; }
#faixa-box-dados-janela { width: 360px; height: 100%; position: relative; float: left; padding: 0px 22px; margin-top: 109px; /* margin-left: 46px; */ }
.item-campo-formulario-janela { width: 87%; height: auto; position: relative; float: left; padding: 0px 0px; margin-left: 0%; margin-right: 0%; margin-bottom: -5px; }
.item-campo-formulario-janela input { width: 100%; height: auto; position: relative; float: left; font-size: 18px !important; background-color: #F3F3F3 !important; border-radius: 10px !important; padding: 10px 20px !important; border: 0px solid #fff !important; color: #07646E; }
.item-campo-formulario-janela-2x { width: 106%; height: auto; position: relative; float: left; margin-left: -10px; padding: 0px 0px; margin-left: -10px; margin-right: 0px; }
.item-campo-formulario-janela-2x .select-wrapper { background: unset; border-radius: 14px; padding: 0 7px; height: 70px; margin-top: 5px; display: flex; align-items: center; }
#campo-envio-foto { width: 100%; height: auto; position: relative; float: left; margin-left: 0%; padding: 15px 17px; background-color: #F3F3F3; font-size: 16px; color: #0A5059; border-radius: 15px; cursor: pointer; }
#faixa-cta-ultima-etapa-calc { width: 100%; height: auto; position: relative; float: left; }
#cta-s-completa-b { width: 100%; height: auto; position: relative; float: right; margin-top: 19px; padding: 16px 40px; margin-right: 3px; background-color: #2BD33A; font-size: 17px; color: #fff; border-radius: 90px; cursor: pointer; text-aling: center; }
#alerta-coleta-dados { width: 98%; height: auto; position: relative; float: left; padding: 18px 20px; background-color: #f8fff2; border-radius: 20px; font-size: 18px; margin-left: 18px; margin-top: 21px; color: #2f8e38; border: 1px solid #d0fbd0; display: none; }
#janela-envio-calculo { width: 360px; height: 100%; position: relative; float: left; padding: 0px 20px; margin-top: 160px; display: block; }
#nome-usuario-calculo { width: 100%; height: auto; position: relative; float: left; margin-top: 96px; color: #2BD33A; font-size: 42px; text-align: center; font-weight: 600; }
#info-envio-dados { width: 100%; height: auto; position: relative; float: left; font-size: 15px; color: #0A5059; text-align: center; padding: 0px 40px; }
#barra-de-progresso { width: 100%; height: auto; position: relative; float: left; margin-top: 20px; }
#barra-progresso-int { width: 80%; height: 18px; position: relative; margin: auto; background-color: #F3F3F3; overflow: hidden; border-radius: 30px; }
#toolbar-janela-economia { width: 100%; height: 100px; position: absolute; top: 14px; z-index: 90; padding: 0px 20px; }
#logo-janela-atrek-cal-economia { width: 150px; height: auto; position: relative; float: left; margin-top: 17px; }
#fechar-janela-resultado-economia { width: 40px; height: 40px; position: relative; float: right; margin-top: 25px; background: url('../img/icn-x.png'); background-size: 40px; background-repeat: no-repeat; cursor: pointer; }
#toolbar-janela-economia { width: 100%; height: 100px; position: absolute; top: 14px; z-index: 90; padding: 0px 20px; }
#logo-janela-atrek-cal-economia { width: 150px; height: auto; position: relative; float: left; margin-top: 17px; }
#fechar-janela-resultado-economia { width: 40px; height: 40px; position: relative; float: right; margin-top: 25px; background: url('../img/icn-x.png'); background-size: 40px; background-repeat: no-repeat; cursor: pointer; }
/*janela menu seleção perfil desktop*/
#janela-menu-selecao-desktop { width: 90%; height: 370px; position: fixed; left: 5%; top: 0; margin-left: 0px; margin-top: 140px; background-color: #fff; border-radius: 25px; z-index: 2999; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 200ms ease, visibility 0s linear 200ms; will-change: opacity; }
#marcador-menu-fixo { width: 60px; height: 60px; position: absolute; left: 236px; top: -14px; border-radius: 12px; transform: rotate(45deg); background-color: #fff; }
.div-menu-select-perfil-fixo { width: 100%; height: auto; position: relative; float: left; padding: 0px 20px; }
#div-ilustra-select-perfil-fixo { width: 40%; height: 100%; position: relative; float: left; display: none; }
.div-menu-select-perfil-fixo h4 { width: 100%; height: auto; position: relative; float: left; font-size: 22px; font-weight: 600; margin-top: 30px; margin-bottom: 31px; color: #08646e; }
.item-link-perfil-b { width: 100%; height: auto; position: relative; float: left; padding: 0px 0px; padding-bottom: 15px; border-bottom: 1px solid #06646E; margin-bottom: 21px; cursor: pointer; }
.icn-link-perfil-b { width: 50px; height: 50px; position: relative; float: left; background-color: #08646E; border-radius: 10px; }
.txt-link-perfil-b { width: auto; height: auto; position: relative; float: left; margin-left: 9px; margin-top: 12px; font-size: 14px; color: #07646E; }
.seta-link-menu-b { width: 30px; height: 30px; position: absolute; right: -7px; top: 9px; background: url('../img/arrow-menu-link.png'); background-size: 30px; }
.seta-link-menu-b:hover { width: 30px; height: 30px; position: absolute; right: -7px; top: 9px; background: url('../img/arrow-menu-link.png'); background-size: 30px; }
.logo-ornamento-g-economia { width: 30%; height: 56px; position: relative; float: left; }
.item-link-perfil-b:hover .seta-link-menu-b { background: url('../img/arrow-menu-link-hover.png'); background-size: 30px; }
#gif-upload-foto { width: 70px; height: 70px; position: absolute; right: 0px; top: 50%; margin-top: -34px; background: url('../img/gif-upload-foto.gif'); background-size: 70px; }
/*Inicio bloco video rodape*/
#inicio-bloco-video-rodape { width: 100%; height: auto; position: relative; float: left; margin-top: 6px; }
/*Inicio s3 LP*/
#terceira-sessao-lp {
width: 100%;
height: auto;
position: relative;
float: left;
margin-top: 50px;
background-color: #ffffff;
z-index: 90;
border-radius: 50px 50px 0px 0px;
padding-bottom: 70px;
}
#view-terceira-sessao-lp { width: 100%; height: auto; position: relative; margin: auto; padding-top: 500px; padding: 0px 40px; }
#div-s3-a h4 { width: 89%; position: relative; float: left; margin-top: 90px; font-size: 42px; color: #ffffff; font-family: "Bebas Neue", sans-serif; font-weight: 500; line-height: 41px; }
#faixa-sessao-ugc { width: 100%; height: auto; position: relative; float: left; background-color: #fff; border-radius: 50px 50px 0px 0px; margin-top: -50px; z-index: 300; }
#janela-contato-enviado { width: 350px; height: 450px; position: fixed; top: 50%; left: 50%; margin-left: -175px; margin-top: -225px; background-color: #fff; border-radius: 30px; z-index: 1999; overflow: hidden; }
#nome-usuario-calculo { width: 100%; height: auto; position: relative; float: left; margin-top: 96px; color: #2BD33A; font-size: 39px; text-align: center; font-weight: 600; }
#logo-a-trek-contato-enviado { width: 100%; height: 59px; position: absolute; bottom: 48px; }
}
@media only screen and (max-width:600px) {
#toast-container { top: auto !important; bottom: 0 !important; left: 0 !important; right: 0 !important; min-width: 100% !important; }
#toast-container .toast { border-radius: 0 !important; box-shadow: none !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; }
}
/*
/*
==========================================================================
Helper classes
========================================================================== */
/*
* Hide visually and from screen readers
*/
.hidden, [hidden] { display: none !important; }
.img-ratio { width: 100% !important; height: auto !important; }
/*
* Hide only visually, but have it available for screen readers:
* https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
*
* 1. For long content, line feeds are not interpreted as spaces and small width
* causes content to wrap 1 word per line:
* https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
*/
.visually-hidden { border: 0; clip: rect(0, 0, 0, 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; white-space: nowrap; width: 1px; /* 1 */ }
/*
* Extends the .visually-hidden class to allow the element
* to be focusable when navigated to via the keyboard:
* https://www.drupal.org/node/897638
*/
.visually-hidden.focusable:active, .visually-hidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; white-space: inherit; width: auto; }
/*
* Hide visually and from screen readers, but maintain layout
*/
.invisible { visibility: hidden; }
/*
* Clearfix: contain floats
*
* The use of `table` rather than `block` is only necessary if using
* `::before` to contain the top-margins of child elements.
*/
.clearfix::before, .clearfix::after { content: ""; display: table; }
.clearfix::after { clear: both; }
#menu-fixo .link-menu {
color: #fff;
}
#menu-fixo.menu-scroll-ativo .link-menu {
color: #000 !important;
}
#menu-fixo.menu-scroll-ativo .link-menu.ativo {
color: #2BD33A !important;
}
#menu-fixo.menu-scroll-ativo #lista-itens-menu-fixo ul li,
#menu-fixo.menu-scroll-ativo #lista-itens-menu-fixo ul li.link-menu,
#menu-fixo.menu-scroll-ativo #lista-itens-menu-fixo ul li a.link-menu {
color: #000 !important;
}
#menu-fixo.menu-scroll-ativo #lista-itens-menu-fixo ul li.link-menu.ativo,
#menu-fixo.menu-scroll-ativo #lista-itens-menu-fixo ul li a.link-menu.ativo {
color: #2BD33A !important;
}
/* ==========================================================================
EXAMPLE Media Queries for Responsive Design.
These examples override the primary ('mobile first') styles.
Modify as content requires.
========================================================================== */
@media only screen and (min-width:35em) {
/* Style adjustments for viewports that meet the condition */ }
@media print, (-webkit-min-device-pixel-ratio:1.25), (min-resolution:1.25dppx), (min-resolution:120dpi) {
/* Style adjustments for high resolution devices */ }
/* ==========================================================================
Print styles.
Inlined to avoid the additional HTTP request:
https://www.phpied.com/delay-loading-your-print-css/
========================================================================== */
@media print {
*, *::before, *::after { background: #fff !important; color: #000 !important; /* Black prints faster */ box-shadow: none !important; text-shadow: none !important; }
a, a:visited { text-decoration: underline; }
a[href]::after { content: " ("attr(href) ")"; }
abbr[title]::after { content: " ("attr(title) ")"; }
/*
* Don't show links that are fragment identifiers,
* or use the `javascript:` pseudo protocol
*/
a[href^="#"]::after, a[href^="javascript:"]::after { content: ""; }
pre { white-space: pre-wrap !important; }
pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
tr, img { page-break-inside: avoid; }
p, h2, h3 { orphans: 3; widows: 3; }
h2, h3 { page-break-after: avoid; }
}