/* ------------------------------------- FONTES TEMA ------------------------------------- >> Títulos: Oswald-Light >> Textos: Oswald-Light ------------------------------------- CORES TEMA ------------------------------------- >> 004c64: azul petróleo >> 0095da: azul celeste >> 0096dd: azul celeste >> daedf1: azul claro >> e1e1e1: cinza claro >> 808080: cinza escuro ------------------------------------- BREAK POINTS ------------------------------------------------------------------------- TIPO MÍDIA TAMANHO BOOTSTRAP RANGE DIMENSÕES ------------------------------------------------------------------------- >> SMARTPHONE (XXS) 0px - 479px >> SMARTPHONE (XS) 480px - 575px >> SMARTPHONE|TABLET (SM) 576px - 767px >> TABLET (MD) 568px - 991px >> TABLET LANDSCAPE (LG) 992px - 1024px >> LAPTOP (LG) 1024px - 1199px >> DESKTOP (XL) 1200px - 1399px >> WIDE SCREEN|PROJETOR (XXL) 1400px - ++ */ :root { --nome-cliente: "LDF"; --primary-color: #004698; --secondary-color: #2C6DF5; --third-color: #e6e8e9; --extra-color: #ffe946; --default-font: 'Oswald-Light', sans-serif; --logo-cabecalho: url('../../Images/Monetiza/PingSolucoes/Logos/logo-cabecalho.png'); --logo-rodape: url('../../Images/Monetiza/logo.png'); --logo-gti: url('../../Images/Monetiza/PingSolucoes/Logos/logo-rodape-2.png'); --logo-fim: url("../../Images/Monetiza/PingSolucoes/Logos/logo-rodape.png"); --logo-parceiro-1: url("../../Images/Monetiza/PingSolucoes/Logos/logo-parceiro-1.png"); --logo-parceiro-2: url("../../Images/Monetiza/PingSolucoes/Logos/logo-parceiro-2.png"); --logo-parceiro-3: url("../../Images/Monetiza/PingSolucoes/Logos/logo-parceiro-3.png"); --logo-parceiro-4: url("../../Images/Monetiza/PingSolucoes/Logos/logo-parceiro-4.png"); --logo-parceiro-auto-moto-fun: url("../../Images/Monetiza/PingSolucoes/Logos/logo-parceiro-auto-moto-fun.png"); --logo-parceiro-saude: url("../../Images/Monetiza/PingSolucoes/Logos/logo-parceiro-saude.png"); --logo-parceiro-sura: url("../../Images/Monetiza/PingSolucoes/Logos/logo-parceiro-sura.png"); --img-rodape: url("../../Images/Monetiza/PingSolucoes/rodape.png"); --img-home: url("../../Images/Monetiza/PingSolucoes/home.png"); --img-home-10-ASRC: url('../../Images/Monetiza/PingSolucoes/home-residencial.png'); --img-home-5: url("../../Images/Monetiza/PingSolucoes/home-pet.png"); --img-home-19: url("../../Images/Monetiza/PingSolucoes/home-saude.png"); --img-home-999: url("../../Images/Monetiza/PingSolucoes/home-automovel.png"); --img-home-12: url("../../Images/Monetiza/PingSolucoes/home-rastreador.png"); --img-home-10-ASAE: url("../../Images/Monetiza/PingSolucoes/home-auto-moto.png"); --img-home-10-ARSP: url("../../Images/Monetiza/PingSolucoes/home-auto-moto-fun.png"); --img-btn-62-Monetiza_PL_1: url('../../Images/Monetiza/PingSolucoes/btn-62-IDEAL.png'); --img-btn-64-PROTEGEVC_PL_1: url('../../Images/Monetiza/PingSolucoes/btn-64-PROTEGEVC_PL_1.png'); --img-index-62-Monetiza_PL_1: url('../../Images/Monetiza/PingSolucoes/index-62-IDEAL.png'); --img-index-64-PROTEGEVC_PL_1: url('../../Images/Monetiza/PingSolucoes/index-64-PROTEGEVC_PL_1.png'); --img-plano-62: url("../../Images/Monetiza/PingSolucoes/plano_62.png"); --img-plano-64: url("../../Images/Monetiza/PingSolucoes/plano_64.png"); --img-fim-10-ASRC: url("../../Images/Monetiza/PingSolucoes/fim-10-ASRC.png"); --img-fim-19: url("../../Images/Monetiza/PingSolucoes/fim-19.png"); --img-fim-10-ASAE: url("../../Images/Monetiza/PingSolucoes/fim-10-ASAE.png"); --img-fim-10-ARSP: url("../../Images/Monetiza/PingSolucoes/fim-10-ARSP.png"); --img-fim-44: url("../../Images/Monetiza/PingSolucoes/fim-44.png"); --img-cob-eletricista: url("../../Images/Monetiza/PingSolucoes/Icons/cobertura-eletricista.png"); --img-cob-chaveiro: url("../../Images/Monetiza/PingSolucoes/Icons/cobertura-chaveiro.png"); --img-cob-encanador: url("../../Images/Monetiza/PingSolucoes/Icons/cobertura-encanador.png"); --img-cob-limpeza: url("../../Images/Monetiza/PingSolucoes/Icons/cobertura-limpeza.png"); --img-cob-telhado: url("../../Images/Monetiza/PingSolucoes/Icons/cobertura-telhado.png"); --img-cob-vidraceiro: url("../../Images/Monetiza/PingSolucoes/Icons/cobertura-vidraceiro.png"); --img-cob-vigilante: url("../../Images/Monetiza/PingSolucoes/Icons/cobertura-vigilante.png"); --img-cob-linha-branca: url("../../Images/Monetiza/PingSolucoes/Icons/cobertura-linha-branca.png"); --img-cob-funeral: url("../../Images/Monetiza/PingSolucoes/Icons/cobertura-funeral.png"); --img-cob-mecanicoeletrico: url("../../Images/Monetiza/PingSolucoes/Icons/cobertura-mecanico-eletrico.png"); --img-cob-guincho: url("../../Images/Monetiza/PingSolucoes/Icons/cobertura-guincho.png"); --img-cob-auto-chaveiro: url("../../Images/Monetiza/PingSolucoes/Icons/cobertura-auto-chaveiro.png"); --img-cob-taxi: url("../../Images/Monetiza/PingSolucoes/Icons/cobertura-taxi.png"); --img-cob-pneu: url("../../Images/Monetiza/PingSolucoes/Icons/cobertura-pneu.png"); --img-cob-transporte-alternativo: url("../../Images/Monetiza/PingSolucoes/Icons/cobertura-transporte-alternativo.png"); --img-cob-hospedagem: url("../../Images/Monetiza/PingSolucoes/Icons/cobertura-hospedagem.png"); --img-cob-transporte-recuperacao: url("../../Images/Monetiza/PingSolucoes/Icons/cobertura-transporte-recuperacao.png"); --img-cob-translado: url("../../Images/Monetiza/PingSolucoes/Icons/cobertura-translado.png"); --img-cob-rede-medica: url("../../Images/Monetiza/PingSolucoes/Icons/cobertura-rede-medica.png"); --img-cob-farmacia: url("../../Images/Monetiza/PingSolucoes/Icons/cobertura-farmacia.png"); --img-cob-sem-carencia: url("../../Images/Monetiza/PingSolucoes/Icons/cobertura-sem-carencia.png"); --img-cob-sem-limite-idade: url("../../Images/Monetiza/PingSolucoes/Icons/cobertura-sem-limite-idade.png"); --img-cob-sem-limite-utilizacao: url("../../Images/Monetiza/PingSolucoes/Icons/cobertura-sem-limite-utilizacao.png"); --img-cob-quitacao-franquia: url("../../Images/Monetiza/PingSolucoes/Icons/icone-cobertura-mini.png"); --img-cob-morte-acidental: url("../../Images/Monetiza/PingSolucoes/Icons/icone-cobertura-mini.png"); --img-cob-sorteios: url("../../Images/Monetiza/PingSolucoes/Icons/icone-cobertura-mini.png"); --img-passos: url("../../Images/Monetiza/PingSolucoes/Passos/passos.png"); --img-passo-1: url("../../Images/Monetiza/PingSolucoes/Passos/passo-1.png"); --img-passo-2: url("../../Images/Monetiza/PingSolucoes/Passos/passo-2.png"); --img-passo-3: url("../../Images/Monetiza/PingSolucoes/Passos/passo-3.png"); --img-passo-4: url("../../Images/Monetiza/PingSolucoes/Passos/passo-4.png"); --img-local-1: url("../../Images/Monetiza/PingSolucoes/Icons/local-azul.png"); --img-email-1: url("../../Images/Monetiza/PingSolucoes/Icons/email-azul.png"); --img-telefone-1: url("../../Images/Monetiza/PingSolucoes/Icons/telefone-azul.png"); --img-local-2: url("../../Images/Monetiza/PingSolucoes/Icons/local-branco.png"); --img-email-2: url("../../Images/Monetiza/PingSolucoes/Icons/email-branco.png"); --img-telefone-2: url("../../Images/Monetiza/PingSolucoes/Icons/whatsapp-branco.png"); --img-suporte: url("../../Images/Monetiza/PingSolucoes/Icons/suporte.png"); --img-corretor: url("../../Images/Monetiza/PingSolucoes/Icons/carteira.png"); --img-oficina: url("../../Images/Monetiza/PingSolucoes/Icons/oficina.png"); --img-sorteio: url("../../Images/Monetiza/PingSolucoes/Icons/sorteio.png"); --img-sorteado: url("../../Images/Monetiza/PingSolucoes/Icons/sorteado.png"); --img-index-sorteio: url("../../Images/Monetiza/PingSolucoes/index-sorteio.png"); --titulo-1: "O que é o Portal " var(--nome-cliente) "?"; --texto-1: "O Portal " var(--nome-cliente) " é um marketplace de seguros e assistências, focado em conectar pessoas interessadas em seguros, trazendo produtos de qualidade para o público e vendas segmentadas com comissões à vista para os corretores parceiros."; --titulo-2: "Nossos Parceiros"; --texto-2: "A " var(--nome-cliente) " conta com parceiros de confiança e com conhecimento sobre seguros para trazer soluções inovadoras aos clientes e altas comissões para corretores."; --texto-endereco: "Av. Paulista, Nº 2300, 19º Andar, Conj. 192, Bela Vista, 01310-200 - São Paulo"; --texto-email: "contato@sura.com.br"; --texto-telefone: "+55 (11) 3556 - 7000"; --texto-cnpj: "CNPJ 33.065.699/0001-27"; --titulo-banner: " "; --titulo-banner-complemento: " "; --titulo-faixa-frase: "Dá uma olhada no que a Monetiza te oferece!"; --titulo-parceiro-sura: "Parceiro: Sura"; --texto-parceiro-sura-1: "A Sura é uma empresa dedicada a proteger o que é mais valioso para as pessoas e empresas. Com uma abordagem focada em cuidado e prevenção, ela busca oferecer soluções que ajudam seus clientes a enfrentarem os desafios do dia a dia com mais segurança e confiança. Seu compromisso está em construir relações de confiança e oferecer suporte contínuo para que cada cliente se sinta protegido."; --texto-parceiro-sura-2: "Com uma visão de futuro, a Sura se posiciona como parceira na promoção de um estilo de vida mais equilibrado e sustentável. Por meio da inovação e do cuidado, ela se propõe a transformar a experiência de proteção em algo acessível e relevante, contribuindo para o bem-estar de quem confia na sua atuação."; --texto-oficina-1: "Cadastre já e comece a aumentar seu faturamento "; --texto-oficina-2: "vendendo Livre de Franquia para os seus clientes."; --texto-sorteio: "Acompanhe os resultados dos sorteios e veja se você foi sorteado."; --texto-titulo-sorteio: "Confira o resultado dos Sorteios"; --texto-sorteados: "Sorteados"; --div-suporte: none; --div-corretor: none; --div-contato: none; --div-banner: none; --background-formulario-viagem: #2C6DF5; /*--video-src: url("https://www.youtube.com/embed/kmmq0NU_V3U?si=OkrBDRfGVLcn5veV");*/ --label-parceiro: "Parceiro"; --label-parceiro-select: "Selecione um parceiro"; } /******************************************************************* DEFINIÇÕES DEFAULT DO SITE ********************************************************************/ /* #region site default */ @media all { @font-face { font-family: 'Oswald-Light'; src: url('../../Content/Ping/Oswald-Light.ttf') format('truetype'); } @font-face { font-family: 'Oswald-Bold'; src: url('../../Content/Ping/Oswald-Bold.ttf') format('truetype'); } @font-face { font-family: 'Oswald-Regular'; src: url('../../Content/Ping/Oswald-Regular.ttf') format('truetype'); } @font-face { font-family: 'Roboto'; src: url('Roboto-ThinItalic-webfont.eot'); src: url('Roboto-ThinItalic-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-ThinItalic-webfont.woff') format('woff'), url('Roboto-ThinItalic-webfont.ttf') format('truetype'), url('Roboto-ThinItalic-webfont.svg#RobotoThinItalic') format('svg'); font-weight: 200; font-style: italic; } html, body { margin: 0; padding: 0; display: flex; font-size: 8px; overflow-x: hidden; flex-direction: column; } header, footer { margin: 0; /*padding: 0;*/ color: #ffffff; font-size: small; font-family: var(--default-font); } h1 { color: var(--primary-color); font-size: larger; font-family: 'Oswald-Light', 'transat-text', sans-serif; } p, span { color: #808080; font-weight: 400; font-size: 1.75rem; font-family: var(--default-font); } a, a:hover, a:visited { color: var(--primary-color); cursor: pointer; font-weight: 400; font-size: medium; text-decoration: none; font-family: var(--default-font); } .bgcolor-gray { background-color: #e1e1e1; } .error { color: red; font-size: small; padding-left: 5px; font-family: var(--default-font); } .color-secondary { color: var(--secondary-color); } .link-login, .link-login:hover { color: var(--primary-color) !important; font-size: 22px !important; } /*------------------------------------ CUSTOMIZAÇÃO BOTÕES --------------------------------------*/ button, .btn-default { /*font-family: var(--default-font);*/ font-weight: 500; color: var(--extra-color); background-color: var(--secondary-color); font-size: 19px !important; } button:hover, .btn-default:hover { /*font-family: var(--default-font) !important;*/ font-weight: 500 !important; color: var(--secondary-color); background-color: var(--extra-color); font-size: 19px !important; } /*.btn-contratacoes-menu{ color: var(--primary-color); } /*------------------------------------ CUSTOMIZAÇÃO CARROSSEL --------------------------------------*/ .carousel-indicators li { padding: 5px; width: 8px !important; height: 8px !important; border-radius: 50px !important; background-color: #808080 !important; } .carousel-indicators .active { opacity: .5 !important; background-color: var(--secondary-color) !important; } .carousel-control-prev, .carousel-control-next { opacity: .5 !important; } /*------------------------------------ IMAGENS --------------------------------------*/ .logo-cabecalho { content: var(--logo-cabecalho); } .logo-rodape { content: var(--logo-rodape); } .logo-gti { display: none; content: var(--logo-gti); } .logo-fim { content: var(--logo-fim); } .logo-parceiro-1 { content: var(--logo-parceiro-1); } .logo-parceiro-2 { content: var(--logo-parceiro-2); } .logo-parceiro-3 { content: var(--logo-parceiro-3); } .logo-parceiro-4 { content: var(--logo-parceiro-4); } .logo-parceiro-auto-moto-fun { content: var(--logo-parceiro-auto-moto-fun); } .logo-parceiro-saude { content: var(--logo-parceiro-saude); } .logo-parceiro-sura { content: var(--logo-parceiro-sura); } .img-home-44-IDEAL { content: var(--img-home-44-IDEAL); } .img-btn-62-Monetiza_PL_1 { content: var(--img-btn-62-Monetiza_PL_1); } .img-btn-64-PROTEGEVC_PL_1 { content: var(--img-btn-64-PROTEGEVC_PL_1); } .img-index-62-Monetiza_PL_1 { content: var(--img-index-62-Monetiza_PL_1); } .img-index-64-PROTEGEVC_PL_1 { content: var(--img-index-64-PROTEGEVC_PL_1); } .img-plano-44 { content: var(--img-plano-62); } .img-plano-64 { content: var(--img-plano-64); } .img-fim-10-ASRC { content: var(--img-fim-10-ASRC); width: 35%; } .img-fim-10-ASAE { content: var(--img-fim-10-ASAE); width: 35%; } .img-fim-10-ARSP { content: var(--img-fim-10-ARSP); width: 35%; } .img-fim-19 { content: var(--img-fim-19); } .img-fim-44 { content: var(--img-fim-44); } .img-cob-eletricista { content: var(--img-cob-eletricista); display: inline-flex; } .img-cob-chaveiro { content: var(--img-cob-chaveiro); display: inline-flex; } .img-cob-encanador { content: var(--img-cob-encanador); display: inline-flex; } .img-cob-limpeza { content: var(--img-cob-limpeza); display: inline-flex; } .img-cob-telhado { content: var(--img-cob-telhado); display: inline-flex; } .img-cob-vidraceiro { content: var(--img-cob-vidraceiro); display: inline-flex; } .img-cob-vigilante { content: var(--img-cob-vigilante); display: inline-flex; } .img-cob-linha-branca { content: var(--img-cob-linha-branca); display: inline-flex; } .img-cob-funeral { content: var(--img-cob-funeral); display: inline-flex; } .img-cob-mecanicoeletrico { content: var(--img-cob-mecanicoeletrico); display: inline-flex; } .img-cob-guincho { content: var(--img-cob-guincho); display: inline-flex; } .img-cob-auto-chaveiro { content: var(--img-cob-auto-chaveiro); display: inline-flex; } .img-cob-taxi { content: var(--img-cob-taxi); display: inline-flex; } .img-cob-pneu { content: var(--img-cob-pneu); display: inline-flex; } .img-cob-transporte-alternativo { content: var(--img-cob-transporte-alternativo); display: inline-flex; } .img-cob-hospedagem { content: var(--img-cob-hospedagem); display: inline-flex; } .img-cob-transporte-recuperacao { content: var(--img-cob-transporte-recuperacao); display: inline-flex; } .img-cob-translado { content: var(--img-cob-translado); display: inline-flex; } .img-cob-rede-medica { content: var(--img-cob-rede-medica); display: inline-flex; } .img-cob-farmacia { content: var(--img-cob-farmacia); display: inline-flex; } .img-cob-sem-carencia { content: var(--img-cob-sem-carencia); display: inline-flex; } .img-cob-sem-limite-idade { content: var(--img-cob-sem-limite-idade); display: inline-flex; } .img-cob-sem-limite-utilizacao { content: var(--img-cob-sem-limite-utilizacao); display: inline-flex; } .img-cob-quitacao-franquia { content: var(--img-cob-quitacao-franquia); display: inline-flex; } .img-cob-morte-acidental { content: var(--img-cob-morte-acidental); display: inline-flex; } .img-cob-sorteios { content: var(--img-cob-sorteios); display: inline-flex; } .img-passos { content: var(--img-passos); } .img-passo-1 { content: var(--img-passo-1); } .img-passo-2 { content: var(--img-passo-2); } .img-passo-3 { content: var(--img-passo-3); } .img-passo-4 { content: var(--img-passo-4); } .img-local-1 { content: var(--img-local-1); } .img-email-1 { content: var(--img-email-1); } .img-telefone-1 { content: var(--img-telefone-1); } .img-local-2 { content: var(--img-local-2); } .img-email-2 { content: var(--img-email-2); } .img-telefone-2 { content: var(--img-telefone-2); } .img-suporte { content: var(--img-suporte); } .img-corretor { content: var(--img-corretor); } .img-oficina { content: var(--img-oficina); } .img-sorteio { content: var(--img-sorteio); } .img-sorteado { content: var(--img-sorteado); } .img-index-sorteio { content: var(--img-index-sorteio); } .header-mobile { display: none; } /*------------------------------------ TEXTOS --------------------------------------*/ .titulo-1:before { content: var(--titulo-1); } .texto-1:before { content: var(--texto-1); } .titulo-2:before { content: var(--titulo-2); } .texto-2:before { content: var(--texto-2); } .texto-endereco:before { content: var(--texto-endereco); } .texto-email:before { content: var(--texto-email); } .texto-telefone:before { content: var(--texto-telefone); } .texto-emailBRcnpj:before { content: var(--texto-email); } .texto-emailBRcnpj:after { content: var(--texto-cnpj); } .texto-central-atendimento:before { content: var(--texto-central-atendimento); } .titulo-banner:before { color: var(--secondary-color); content: var(--titulo-banner); font-weight: 400; } .titulo-banner-complemento:before { color: var(--secondary-color); content: var(--titulo-banner-complemento); font-weight: 600; } .titulo-faixa-frase:before { content: var(--titulo-faixa-frase); } .titulo-parceiro-sura:before { content: var(--titulo-parceiro-sura); } .texto-parceiro-sura:before { content: var(--texto-parceiro-sura-1); } .texto-parceiro-sura:after { content: var(--texto-parceiro-sura-2); } .texto-oficina-1:before { content: var(--texto-oficina-1); } .texto-oficina-2:before { content: var(--texto-oficina-2); } .texto-sorteio:before { content: var(--texto-sorteio); font-size: 1.50rem; } .texto-titulo-sorteio:before { content: var(--texto-titulo-sorteio); } .texto-sorteados:before { content: var(--texto-sorteados); } .label-parceiro { color: inherit; font-weight: inherit; font-size: inherit; font-family: inherit; } .label-parceiro:before { content: var(--label-parceiro); } #label-parceiro-select:before { content: var(--label-parceiro-select); } /*------------------------------------ ELEMENTOS --------------------------------------*/ .div-suporte { display: var(--div-suporte); } .div-corretor { display: var(--div-corretor); } .div-contato { display: var(--div-contato); } .div-banner { display: var(--div-banner); } .div-logo-rodape { flex: 0 0 100% !important; max-width: 100% !important; } } /*#endregion */ /******************************************************************* MASTER PAGE | CABEÇALHO | DEFAULT ********************************************************************/ /* #region cabeçalho default */ @media all { header { color: var(--primary-color); font-size: small; background-color: #ffffff; } header div.row span { color: #ffffff; font-size: small; } header div.row img { width: 80%; margin-left: 15%; } } /*#endregion */ /******************************************************************* MASTER PAGE | RODAPÉ | DEFAULT ********************************************************************/ /* #region RODAPÉ DEFAULT */ @media all { footer span { color: white; } .rodape-default { font-weight: 200; color: white !important; font-family: var(--default-font); } #faixa-fim{ background-color: var(--primary-color) !important; } .container-suporte .card-suporte-info .btn-suporte h7 { color: var(--secondary-color); font-weight: 400; font-size: 2.15rem; display: flex; flex-direction: column; } .container-suporte .card-suporte-info .btn-suporte h8 { color: var(--secondary-color); font-weight: 400; font-size: 1.25rem; display: flex; flex-direction: column; } .medio { font-size: 1.50rem !important; } .card-titulo h6 { color: var(--secondary-color); font-weight: 400; font-size: 2.5rem; display: flex; flex-direction: column; } } /*================================================================= SMARTPHONE (<= 767px) ===================================================================*/ @media (max-width: 991px) { .rodape-default { width: 100%; font-size: 1.1rem; margin: 0px !important; padding: 0px !important; background-color: #193e6c; } .rodape-default .container { height: 100%; } .rodape-default .endereco img, .rodape-default .central-atendimento img { width: 4vh; height: 4vh; } .rodape-default .email-ping-cnpj img { width: 4vh; height: 3vh; } .rodape-default .imagens-parceria { display: flex; align-items: center; flex-direction: column; } header div.row img { margin-left: 0; } } @media (min-width: 575px) { .mini { font-size: 1.25rem !important; } } @media (max-width: 575px) { .mini { font-size: 2.0rem !important; } h5 { font-size: 1.75rem !important; } label { font-size: 1.75rem !important; } .container-suporte .card-suporte-info .btn-suporte h7 { font-size: 2.75rem !important; } } /*================================================================= DESKTOP (>= 992px) ===================================================================*/ @media (min-width: 992px) { /*--------------------------------------- RODAPÉ -----------------------------------------*/ .rodape-default { width: 100%; font-size: 1.5rem; margin: 0px !important; padding: 0px !important; background-color: #193e6c; zoom: 58%; } .rodape-default .container { width: 90%; } .rodape-default .bloco-dir:before { display: flex; content: ""; right: 100%; height: 100%; position: absolute; transform: translateX(-50%); border-left: 2px solid white; padding: 1% !important; font-size: 1.5rem; } .rodape-default .endereco img, .rodape-default .central-atendimento img { width: 30px; height: 30px; } .rodape-default .email-ping-cnpj img { width: 30px; height: 23px; font-size: 1.5rem; } .rodape-default .imagens-parceria { display: flex; flex-direction: row; align-items: center; font-size: 1.5rem; } .rodape-default .imagens-parceria img { width: 300px; } .container-suporte .card-suporte-info .btn-suporte h6 { color: var(--secondary-color); font-weight: 400; font-size: 2.5rem; display: flex; flex-direction: column; } } /*#endregion */ /******************************************************************* TELA INDEX | PRINCIPAL ********************************************************************/ /*#region index principal */ /*====================================================== LAYOUT PRINCIPAL | MOBILE (< 768px) ======================================================*/ /* #region layout mobile */ /*------------------------------- SMARTPHONE (xs) -------------------------------*/ @media all /*(max-width: 575.9px)*/ { html, body { color: #808080; font-size: 8px; font-weight: 400; font-family: var(--default-font); } #pagina-index-principal section .borda-principal { padding: 5% 7% !important; } #pagina-index-principal .carousel-indicators { margin: 3%; } #pagina-index-principal .navigation-buttons a img { width: 7vw; height: auto; } /*------------------------------------ SEÇÃO 1 | BANNER PRINCIPAL ------------------------------------*/ /* #region */ #pagina-index-principal #section-1 { width: 100%; height: auto; max-height: 60vw; background-size: cover; background-position-x: right; background-position-y: top; background-repeat: no-repeat; background-image: var(--img-home); } #pagina-index-principal #section-1 .borda-principal { padding: 5% 7% 3% 7% !important; } #pagina-index-principal #section-1 h1 { width: 90%; color: dimgray; font-size: 2.6rem; font-family: 'Oswald-Light', sans-serif; } #pagina-index-principal #section-1 .fonteDestaque { color: var(--secondary-color); display: inline; font-size: inherit; font-family: 'Oswald-Bold', 'Oswald-Light', sans-serif; } #pagina-index-principal #section-1 .btn-tipo-usuario { display: flex; flex-direction: column; } #pagina-index-principal #section-1 a.divSouCorretor, #pagina-index-principal #section-1 a.divSouCorretor:hover { color: white; display: flex; cursor: pointer; text-wrap: nowrap; align-items: center; justify-content: center; background-color: var(--secondary-color); } #pagina-index-principal #section-1 a.divQueroSimular, #pagina-index-principal #section-1 a.divQueroSimular:hover { color: var(--secondary-color); display: flex; cursor: pointer; font-weight: 500; text-wrap: nowrap; align-items: center; justify-content: center; border: 1.6px solid var(--secondary-color); background-color: transparent; } #pagina-index-principal #section-1 a { width: 100%; height: auto; min-width: 150px; min-height: 30px; max-width: 230px; max-height: 35px; font-size: 1.35rem; padding: 10px 20px; border-radius: 30px; } .div-video { padding-top: 0 !important; margin-top: 0 !important; } /*#endregion */ /*------------------------------------ SEÇÃO 2 | PRODUTOS ------------------------------------*/ /* #region */ #pagina-index-principal #section-2 .borda-principal { padding: 10% 7% 3% 7% !important; } #pagina-index-principal #div-produtos-desktop { display: none !important; } #pagina-index-principal #div-produtos-mobile { /*display: block;*/ display: flex; align-content: center; justify-content: center; } #pagina-index-principal #section-2 .carousel-control-prev { left: -25% !important; } #pagina-index-principal #section-2 .carousel-control-next { right: -25% !important; } #pagina-index-principal #section-2 .carousel-inner { padding-bottom: 25%; } #pagina-index-principal #section-2 .card { color: white; cursor: pointer; text-align: center; width: 53.5vw !important; height: 79.5vw !important; margin: 1.5% 1.2% 1.5% 1.2%; display: inline-block !important; background-color: var(--secondary-color) !important; border: 1px solid white !important; border-radius: 12% 12% 5% 5% !important; } #pagina-index-principal #section-2 .card-footer { color: white; height: 9.5vw; display: flex; font-size: 1.85rem; align-items: center; justify-content: center; border: none !important; font-family: var(--default-font); } /*#endregion */ /*------------------------------------ SEÇÃO 3 | PING SOLUÇÕES ------------------------------------ SEÇÃO 4 | PARCEIROS ------------------------------------ SEÇÃO 5 | PASSO-A-PASSO ------------------------------------*/ /* #region */ #pagina-index-principal #section-3 h1, #pagina-index-principal #section-4 h1, #pagina-index-principal #section-5 h1 { color: var(--primary-color); font-size: 2.85rem; font-family: 'Oswald-Light'; } #pagina-index-principal #section-3 span, #pagina-index-principal #section-4 span, #pagina-index-principal #section-5 span { font-size: 2rem; } /*#endregion */ /*------------------------------------ SEÇÃO 4 | PARCEIROS ------------------------------------*/ /* #region */ #pagina-index-principal #section-4 .borda-principal { padding: 3% 7% 10% 7% !important; } #pagina-index-principal #div-parceiros-desktop { display: none !important; } #pagina-index-principal #div-parceiros-mobile { display: block; } #pagina-index-principal #section-4 .carousel-control-prev { left: 0% !important; } #pagina-index-principal #section-4 .carousel-control-next { right: 0% !important; } #pagina-index-principal #section-4 .carousel-inner { padding-bottom: 15%; text-align: -webkit-center; } #pagina-index-principal #section-4 .parceiro-item { width: 40vw; height: 40vw; margin: 5% 20%; border-radius: 50%; background-color: white; display: flex; align-items: center; justify-content: center; } #pagina-index-principal #section-4 .parceiro-item img { width: 30vw !important; } /*#endregion */ /*------------------------------------ SEÇÃO 5 | PASSO-A-PASSO ------------------------------------*/ /* #region */ #pagina-index-principal #section-5 .borda-principal { padding: 5% 7% 10% 7% !important; } #pagina-index-principal #div-passos-desktop { display: none !important; } #pagina-index-principal #div-passos-mobile { display: block; } #pagina-index-principal #section-5 .table-passos-corretor td { text-align: right; } #pagina-index-principal #section-5 .table-passos-cliente td { text-align: left; } #pagina-index-principal #section-5 img { width: auto; min-height: 30vw; max-height: 40vw; } /*#endregion */ /*------------------------------------ SEÇÃO 6 | RODAPÉ INDEX ------------------------------------*/ /* #region */ #pagina-index-principal footer.rodape-index { color: white !important; background-size: cover; background-position-x: right; background-position-y: top; background-image: var(--img-rodape) !important; } #pagina-index-principal footer.rodape-index div.row { padding: 10% 7% 15% 7% !important; } #pagina-index-principal footer.rodape-index h1 { color: white; font-size: 2.85rem; font-family: 'Oswald-Light', "transat-text", sans-serif; } #pagina-index-principal footer.rodape-index h6 { color: white; font-size: 2rem; font-weight: 400; font-family: var(--default-font); } #pagina-index-principal footer.rodape-index span { color: white; font-size: 2rem; font-weight: 400; font-family: var(--default-font); } #pagina-index-principal footer.rodape-index img { width: 6vw; } #pagina-index-principal footer.rodape-index .form-input { width: 100%; margin: 1.5%; padding: 3% 5%; font-size: 1.65rem !important; font-family: var(--default-font); } #pagina-index-principal footer.rodape-index select:invalid { color: gray; } #pagina-index-principal footer.rodape-index option { color: dimgray; } #pagina-index-principal footer.rodape-index .btn-transparente { width: 100%; height: 45px; float: right; display: flex; align-items: center; justify-content: center; color: white; font-size: 1.75rem; text-align: center; border-radius: 30px; border: 1px solid white; background-color: transparent; font-family: var(--default-font); } /*#endregion */ } /*------------------------------- SMARTPHONE | TABLET I (sm) -------------------------------*/ @media (min-width: 576px) and (max-width: 767.9px) { html { font-size: 12px; } .btn-sorteio{ width: auto !important; } #pagina-index-principal .navigation-buttons a img { width: 5vw; height: auto; } /*------------------------------------ SEÇÃO 1 | BANNER PRINCIPAL ------------------------------------*/ /* #region */ #pagina-index-principal #section-1 h1 { width: 80%; font-size: 2.85rem; } #pagina-index-principal #section-1 a { width: 100%; height: auto; min-width: 230px; min-height: 40px; max-width: 280px; max-height: 45px; font-size: 1.35rem; border-radius: 30px; } /*#endregion */ /*------------------------------------ SEÇÃO 2 | PRODUTOS ------------------------------------*/ /* #region */ #pagina-index-principal #section-2 .carousel-control-prev { left: -45% !important; } #pagina-index-principal #section-2 .carousel-control-next { right: -45% !important; } #pagina-index-principal #section-2 .card { width: 40.5vw !important; height: 60.5vw !important; } #pagina-index-principal #section-2 .card-footer { height: 8vw; font-size: 1.5rem; } /*#endregion */ /*------------------------------------ SEÇÃO 3 | PING SOLUÇÕES ------------------------------------ SEÇÃO 4 | PARCEIROS ------------------------------------ SEÇÃO 5 | PASSO-A-PASSO ------------------------------------*/ /* #region */ #pagina-index-principal #section-3 h1, #pagina-index-principal #section-4 h1, #pagina-index-principal #section-5 h1 { font-size: 3rem; } #pagina-index-principal #section-3 span, #pagina-index-principal #section-4 span, #pagina-index-principal #section-5 span { font-size: 1.8rem; } #pagina-index-principal #section-4 .carousel-inner { padding-bottom: 10%; } #pagina-index-principal #section-4 .parceiro-item { width: 35vw; height: 35vw; } #pagina-index-principal #section-4 .parceiro-item img { width: 25vw !important; } #pagina-index-principal #section-5 img { height: 25vw; max-height: 25vw; } /*#endregion */ /*------------------------------------ SEÇÃO 6 | RODAPÉ INDEX ------------------------------------*/ /* #region */ #pagina-index-principal .rodape-index h1 { font-size: 2.85rem; } #pagina-index-principal .rodape-index h6, #pagina-index-principal .rodape-index span { font-size: 1.8rem !important; } #pagina-index-principal .rodape-index img { width: 5vw; } #pagina-index-principal .rodape-index .form-input { font-size: 1.25rem !important; } #pagina-index-principal footer.rodape-index .btn-transparente { height: 60px; font-size: 1.75rem; } /*#endregion */ } /*------------------------------- TABLET II (md) -------------------------------*/ @media (min-width: 768px) and (max-width: 991.9px) { html { font-size: 12px; } #pagina-index-principal .navigation-buttons a img { width: 5vw; height: auto; } /*------------------------------------ SEÇÃO 1 | BANNER PRINCIPAL ------------------------------------*/ /* #region */ #pagina-index-principal #section-1 h1 { width: 80%; font-size: 3.5rem !important; } #pagina-index-principal #section-1 a { width: 100%; height: auto; min-width: 230px; min-height: 40px; max-width: 280px; max-height: 45px; font-size: 1.35rem; border-radius: 30px; } /*#endregion */ /*------------------------------------ SEÇÃO 2 | PRODUTOS ------------------------------------*/ /* #region */ #pagina-index-principal #section-2 .borda-principal { padding: 7% 7% 3% 7% !important; } #pagina-index-principal #section-2 .carousel-control-prev { left: -80% !important; } #pagina-index-principal #section-2 .carousel-control-next { right: -80% !important; } #pagina-index-principal #section-2 .card { width: 30.5vw !important; height: 45.5vw !important; } #pagina-index-principal #section-2 .card-footer { height: 5.5vw; font-size: 1.5rem; } /*#endregion */ /*------------------------------------ SEÇÃO 3 | PING SOLUÇÕES ------------------------------------ SEÇÃO 4 | PARCEIROS ------------------------------------ SEÇÃO 5 | PASSO-A-PASSO ------------------------------------*/ /* #region */ #pagina-index-principal #section-3 h1, #pagina-index-principal #section-4 h1, #pagina-index-principal #section-5 h1 { font-size: 3.25rem; } #pagina-index-principal #section-3 span, #pagina-index-principal #section-4 span, #pagina-index-principal #section-5 span { font-size: 1.8rem; } #pagina-index-principal #section-4 .carousel-inner { padding-bottom: 10%; } #pagina-index-principal #section-4 .parceiro-item { width: 30vw; height: 30vw; } #pagina-index-principal #section-4 .parceiro-item img { width: 20vw !important; } #pagina-index-principal #section-5 img { height: 25vw; max-height: 25vw; } /*#endregion */ /*------------------------------------ SEÇÃO 6 | RODAPÉ INDEX ------------------------------------*/ /* #region */ #pagina-index-principal .rodape-index h1 { font-size: 2.5rem !important; } #pagina-index-principal .rodape-index h6, #pagina-index-principal .rodape-index span { font-size: 1.65rem !important; } #pagina-index-principal .rodape-index img { width: 4vw !important; } #pagina-index-principal .rodape-index .form-input { margin: 1.25%; padding: 4% 5%; font-size: 1.25rem !important; } #pagina-index-principal footer.rodape-index .btn-transparente { height: 60px; font-size: 1.75rem; border-radius: 50px; } /*#endregion */ } /*#endregion */ /*==================================================== LAYOUT SECUNDÁRIO | WEB (< 768) ====================================================*/ /* #region layout web */ @media (min-width: 992px) { html { font-size: 13.5px !important; } #pagina-index-principal section .borda-principal { padding: 5% 10% !important; } #pagina-index-principal .carousel-inner { padding-bottom: 4% !important; } #pagina-index-principal .carousel-indicators { margin: 1.5% !important; } #pagina-index-principal .navigation-buttons a img { width: 3.5vw !important; height: auto !important; } /*------------------------------------ SEÇÃO 1 | BANNER PRINCIPAL ------------------------------------*/ /* #region */ #pagina-index-principal #section-1 .borda-principal { padding: 7% 10% 3% 10% !important; } #pagina-index-principal #section-1 { width: 100% !important; height: auto !important; max-height: 50vw !important; background-size: cover !important; background-position-x: right !important; background-position-y: top !important; background-repeat: no-repeat !important; } #pagina-index-principal #section-1 h1 { width: 80% !important; font-size: 3.5rem !important; } #pagina-index-principal #section-1 a { width: 100% !important; height: auto !important; min-width: 230px !important; min-height: 65px !important; max-width: 310px !important; max-height: 70px !important; font-size: 1.45rem !important; border-radius: 50px !important; } #pagina-index-principal #section-1 .btn-tipo-usuario div { display: flex !important; flex-direction: row !important; } /*#endregion */ /*------------------------------------ SEÇÃO 2 | PRODUTOS ------------------------------------*/ /* #region */ #pagina-index-principal #section-2 .borda-principal { padding: 5% 10% 3% 10% !important; } #pagina-index-principal #div-produtos-desktop { display: block !important; text-align: center !important; } #pagina-index-principal #div-produtos-mobile { display: none !important; } #pagina-index-principal #section-2 .carousel-control-prev { left: -5% !important; } #pagina-index-principal #section-2 .carousel-control-next { right: -5% !important; } #pagina-index-principal #section-2 .card { color: white; cursor: pointer; text-align: center; width: 18.5vw !important; height: 29vw !important; margin: 2.5% 1.0% 2.5% 1.0% !important; display: inline-block !important; background-color: var(--secondary-color) !important; border: 1px solid white !important; border-radius: 12% 12% 5% 5% !important; } #pagina-index-principal #section-2 .card-footer { color: white; height: 4.5vw !important; font-size: 1.35rem !important; display: flex; align-items: center; justify-content: center; border: none !important; font-family: var(--default-font); } /*#endregion */ /*------------------------------------ SEÇÃO 3 | PING SOLUÇÕES ------------------------------------ SEÇÃO 4 | PARCEIROS ------------------------------------ SEÇÃO 5 | PASSO-A-PASSO ------------------------------------*/ /* #region */ #pagina-index-principal #section-3 .borda-principal { padding: 5% 10% !important; } #pagina-index-principal #section-3 h1, #pagina-index-principal #section-4 h1, #pagina-index-principal #section-5 h1 { font-size: 3.5rem !important; } #pagina-index-principal #section-3 span, #pagina-index-principal #section-4 span, #pagina-index-principal #section-5 span { font-size: 1.8rem !important; } /*#endregion */ /*------------------------------------ SEÇÃO 4 | PARCEIROS ------------------------------------*/ /* #region */ #pagina-index-principal #section-4 .borda-principal { padding: 5% 10% !important; } #pagina-index-principal #div-parceiros-desktop { display: block !important; } #pagina-index-principal #div-parceiros-mobile { display: none !important; } #pagina-index-principal #section-4 .carousel-control-prev { left: -10% !important; } #pagina-index-principal #section-4 .carousel-control-next { right: -10% !important; } #pagina-index-principal #section-4 .carousel-item { display: flex !important; align-items: center !important; align-content: center !important; justify-content: center !important; } #pagina-index-principal #section-4 .parceiro-item { width: 13vw !important; height: 13vw !important; margin: 2% 2% !important; padding: 5% 2% !important; border-radius: 50% !important; } #pagina-index-principal #section-4 .parceiro-item img { width: 10vw !important; } /*#endregion */ /*------------------------------------ SEÇÃO 5 | PASSO-A-PASSO ------------------------------------*/ /* #region */ #pagina-index-principal #section-5 .borda-principal { padding: 5% 10% !important; } #pagina-index-principal #div-passos-desktop { display: block !important; } #pagina-index-principal #div-passos-mobile { display: none !important; } #pagina-index-principal #section-5 img { width: 28vw !important; height: auto !important; min-height: 67vw !important; max-height: 70vw !important; } /*#endregion */ /*------------------------------------ SEÇÃO 6 | RODAPÉ INDEX ------------------------------------*/ /* #region */ #pagina-index-principal footer.rodape-index div.row { padding: 8% 7% !important; } #pagina-index-principal footer.rodape-index h1 { font-size: 2.3rem !important; } #pagina-index-principal footer.rodape-index h6, #pagina-index-principal footer.rodape-index span { font-size: 1.5rem !important; } #pagina-index-principal footer.rodape-index img { width: 2.5vw !important; } #pagina-index-principal footer.rodape-index .form-input { margin: 1.5% 5% !important; padding: 4.5% 5% !important; font-size: 1.25rem !important; } #pagina-index-principal footer.rodape-index .btn-transparente { height: 60px !important; font-size: 1.5rem !important; border-radius: 50px !important; } /*#endregion */ } /*------------------------------- NOTEBOOK (lg) -------------------------------*/ @media (min-width: 1024px) { /*------------------------------------ SEÇÃO 3 | PING SOLUÇÕES ------------------------------------ SEÇÃO 4 | PARCEIROS ------------------------------------ SEÇÃO 5 | PASSO-A-PASSO ------------------------------------*/ /* #region */ #pagina-index-principal #section-3 h1, #pagina-index-principal #section-4 h1, #pagina-index-principal #section-5 h1 { font-size: 45px !important; } #pagina-index-principal #section-5 img { width: 25vw !important; height: auto !important; min-height: 65vw !important; } /*#endregion */ } /*------------------------------- DESKTOP (xl) -------------------------------*/ @media (min-width: 1150px) { html { font-size: 14.5px !important; } /*------------------------------------ SEÇÃO 5 | PASSO-A-PASSO ------------------------------------*/ /* #region */ #pagina-index-principal #section-5 img { width: 20vw !important; height: auto !important; min-height: 60vw !important; } /*#endregion */ } /*------------------------------- WIDE SCREEN (xl) -------------------------------*/ @media (min-width: 1250px) { /*------------------------------------ SEÇÃO 3 | PING SOLUÇÕES ------------------------------------ SEÇÃO 4 | PARCEIROS ------------------------------------ SEÇÃO 5 | PASSO-A-PASSO ------------------------------------*/ /* #region */ #pagina-index-principal #section-3 span, #pagina-index-principal #section-4 span, #pagina-index-principal #section-5 span { font-size: 27px !important; } #pagina-index-principal #section-5 img { width: 20vw !important; height: auto !important; min-height: 55vw !important; } /*#endregion */ } /*------------------------------- PROJETOR (xl) -------------------------------*/ @media (min-width: 1440px) { /*------------------------------------ SEÇÃO 1 | BANNER PRINCIPAL ------------------------------------*/ /* #region */ #pagina-index-principal #section-1 a { width: 100% !important; height: auto !important; min-width: 230px !important; min-height: 65px !important; max-width: 370px !important; max-height: 70px !important; font-size: 1.45rem !important; border-radius: 50px !important; } /*#endregion */ /*------------------------------------ SEÇÃO 2 | PRODUTOS ------------------------------------*/ /* #region */ #pagina-index-principal #section-2 .card { width: 20.5vw !important; height: 31vw !important; } /*#endregion */ /*------------------------------------ SEÇÃO 5 | PASSO-A-PASSO ------------------------------------*/ /* #region */ #pagina-index-principal #section-5 .break-line { display: block !important; } #pagina-index-principal #section-5 img { height: auto !important; width: 10vw !important; min-height: 40vw !important; } /*#endregion */ } /*#endregion */ /*#endregion */ /******************************************************************* TELA INDEX | CORRETOR ********************************************************************/ /* #region INDEX CORRETOR */ /*================================================================= TODOS OS TAMANHOS ===================================================================*/ @media all { } /*================================================================= SMARTPHONE (<= 767px) ===================================================================*/ @media (max-width: 991px) { } /*================================================================= VÍDEO: ===================================================================*/ @media (max-width: 768px) { .div-video { padding-top: 3rem !important; margin-top: 3rem !important; padding-left: 0 !important; padding-top: 0 !important; } } @media (min-width: 769px) { .div-video { padding-top: 3rem !important; margin-top: 3rem !important; } } @media (max-width: 767px) { .video-banner { display:none; } } @media (min-width: 768px) and (max-width: 1090px) { .video-banner { display:none; } } @media (min-width: 1091px) { .video-banner { display: none; } } /*================================================================= TABLET (768px - 991px) ===================================================================*/ /*@media (min-width: 768px) AND (max-width: 991px) { }*/ /*================================================================= DESKTOP (>= 992px) ===================================================================*/ @media (min-width: 992px) { } /*#endregion */ /******************************************************************* TELA INDEX | CLIENTE ********************************************************************/ /* #region INDEX CLIENTE */ /*================================================================= TODOS OS TAMANHOS ===================================================================*/ @media all { } /*================================================================= SMARTPHONE (<= 767px) ===================================================================*/ @media (max-width: 768px) { #pagina-index-cliente .btn-default { /*width: 150px;*/ font-size: 1rem; padding: 8px 10px; } } /*================================================================= TABLET (768px - 991px) ===================================================================*/ /*@media (min-width: 768px) AND (max-width: 991px) { }*/ /*================================================================= DESKTOP (>= 992px) ===================================================================*/ @media (min-width: 769px) { } /*#endregion */ /******************************************************************* TELA | ASSISTENCIA RESIDENCIAL | PLANOS ********************************************************************/ /* #region ASSISTENCIA RESIDENCIAL | PLANOS */ /*================================================================= TODOS OS TAMANHOS ===================================================================*/ @media all { #pagina-planos-residencial body .container-fluid { font-weight: 400; font-family: var(--default-font); } #pagina-planos-residencial h1, #pagina-planos-residencial h3 { color: #004698; font-weight: 200; font-family: 'Oswald-Light', sans-serif; font-size: 2.5rem !important; white-space: nowrap !important; } .titulo-faixa { color: var(--primary-color); font-weight: 200; text-align: center; background-color: var(--third-color); font-family: var(--default-font); } .titulo-primary { color: var(--primary-color); font-family: var(--default-font); } .faixa-principal { background-color: var(--primary-color); } .botao { font-family: var(--default-font); font-weight: 500; color: #0033a0; background-color: #ffffff; font-size: 18px !important; padding: 12px; border: none; -webkit-transition: all .4s ease-out; transition: background-color .4s ease; border-radius: 20px; } .botao:hover { font-family: var(--default-font); font-weight: 500; color: #ffffff; background-color: #0033a0; font-size: 18px !important; padding: 12px; cursor: pointer; border: none; -webkit-transition: all .4s ease-out; transition: background-color .4s ease; border-radius: 20px; } .fw-600 { font-weight: 600 !important; } } /*================================================================= SMARTPHONE (<= 767px) ===================================================================*/ @media (max-width: 991px) { /*--------------------------------------- COMUM -----------------------------------------*/ #pagina-planos-residencial .container-fluid { margin: 0px; padding: 0px; overflow-x: hidden; } /*--------------------------------------- CONTAINER | PLANOS -----------------------------------------*/ #pagina-planos-residencial .container-planos h1 { font-size: 3.8rem; text-align: center; } #pagina-planos-residencial .coberturas-lista span { color: #808080; font-size: 1.9rem; } /*--------------------------------------- CONTAINER | COBERTURAS -----------------------------------------*/ #pagina-planos-residencial .container-coberturas .titulo-faixa h2 { font-weight: 200; font-size: 2.5rem; } #pagina-planos-residencial .container-coberturas p { color: #808080; font-size: 1.5rem; } #pagina-planos-residencial .container-coberturas h3 { text-align: left; font-size: 2.28rem; font-weight:700 !important; } #pagina-planos-residencial .container-coberturas .btn-default { font-size: 1.5rem; padding: 20px 55px; } #pagina-planos-residencial .container-coberturas .cobertura-item .icon-cobertura img { width: 75px !important; } #pagina-planos-residencial .cobertura-item { margin-bottom: 30px; } /*--------------------------------------- CONTAINER | PARCEIROS -----------------------------------------*/ #pagina-planos-residencial .container-parceiros h1 { font-size: 2.8rem; text-align: center; } #pagina-planos-residencial .container-parceiros span { font-size: 1.4rem; } #pagina-planos-residencial .content-parceiros { display: block; } #pagina-planos-residencial .content-parceiros img { width: 250px !important; } a, a:hover, a:visited { color: var(--primary-color); } } /*================================================================= TABLET (768px - 991px) ===================================================================*/ /*@media (min-width: 768px) AND (max-width: 991px) { }*/ /*================================================================= DESKTOP (>= 992px) ===================================================================*/ @media (min-width: 992px) { /*--------------------------------------- COMUM -----------------------------------------*/ #pagina-planos-residencial .container-fluid { margin: 0px; padding: 0px; overflow-x: hidden; } div[class^="icon-cobertura"] { margin-right: -2% !important; max-width: 14% !important; } div[class^="fa-stack-3x"] { color: #ad1d1d; } div[class="cobertura-item col-lg-6 col-xl-6 col-xxl-6 p-2 p-lg-5 p-xl-5 p-xxl-5 d-block"] { /* background-color: yellow !important;*/ padding: 1% !important; margin-right: 0% !important; } /*--------------------------------------- CONTAINER | PLANOS -----------------------------------------*/ #pagina-planos-residencial .container-planos h1 { font-size: 4rem; text-align: left; } #pagina-planos-residencial .coberturas-lista span { color: #808080; font-size: 1.75rem; } #pagina-planos-residencial .container-planos .cobertura-item .icon-cobertura img { width: 75px !important; max-width: 52% !important; } /*--------------------------------------- CONTAINER | COBERTURAS -----------------------------------------*/ #pagina-planos-residencial .container-coberturas .titulo-faixa h2 { font-weight: 200; font-size: 2.8rem; } #pagina-planos-residencial .container-coberturas p { color: #808080; font-size: 1.27rem; } #pagina-planos-residencial .container-coberturas h3 { text-align: left; font-size: 2.2rem; } #pagina-planos-residencial .container-coberturas .btn-default { font-size: 2rem; padding: 13px 70px; } #pagina-planos-residencial .container-coberturas .cobertura-item .icon-cobertura img { width: 41px !important; } /*--------------------------------------- CONTAINER | PARCEIROS -----------------------------------------*/ #pagina-planos-residencial .container-parceiros h1 { font-size: 5rem; text-align: left; } #pagina-planos-residencial .container-parceiros span { font-size: 1.8rem; } #pagina-planos-residencial .content-parceiros { display: flex; align-items: center; flex-direction: row; } #pagina-planos-residencial .content-parceiros img { width: 250px !important; } a, a:hover, a:visited { color: var(--primary-color); } } /******************************************************************* TELA | ASSISTENCIA AUTO-MOTO | PLANOS ********************************************************************/ /* #region ASSISTENCIA RESIDENCIAL | PLANOS */ /*================================================================= TODOS OS TAMANHOS ===================================================================*/ @media all { #pagina-planos-auto-moto body .container-fluid { font-weight: 400; font-family: var(--default-font); } #pagina-planos-auto-moto h1, #pagina-planos-auto-moto h3 { color: var(--primary-color); font-weight: 200; font-family: 'Oswald-Light', sans-serif; font-size: 2.5rem !important; } #pagina-planos-auto-moto .titulo-faixa { color: white; font-weight: 200; text-align: center; background-color: var(--primary-color); font-family: var(--default-font); } .card-title, .card-text { font-weight: 700; color: var(--primary-color); text-align: center; font-size: x-large !important; } .card { background-color: var(--third-color) !important; border-color: var(--primary-color) !important; border-radius: 4.25rem !important; margin-bottom: 20px; min-width: 260px !important; } .card .btn-primary { color: #ffffff; width: 100px; padding: 10px; font-weight: 200; font-size: 1.4rem; border-radius: 15px; border: 1px solid var(--primary-color); background-color: var(--primary-color); font-family: var(--default-font); text-decoration: none; } .card-coberturas span { color: black; font-size: medium; } } /*================================================================= SMARTPHONE (<= 767px) ===================================================================*/ @media (max-width: 991px) { /*--------------------------------------- COMUM -----------------------------------------*/ #pagina-planos-auto-moto .container-fluid { margin: 0px; padding: 0px; overflow-x: hidden; } /*--------------------------------------- CONTAINER | PLANOS -----------------------------------------*/ #pagina-planos-auto-moto .container-planos h1 { font-size: 3.8rem; text-align: center; } #pagina-planos-auto-moto .coberturas-lista span { color: #808080; font-size: 1.9rem; } /*--------------------------------------- CONTAINER | COBERTURAS -----------------------------------------*/ #pagina-planos-auto-moto .container-coberturas .titulo-faixa h2 { font-weight: 200; font-size: 1.8rem; } #pagina-planos-auto-moto .container-coberturas p { color: #808080; font-size: 1.5rem; } #pagina-planos-auto-moto .container-coberturas h3 { text-align: left; font-size: 2.28rem; font-weight: 700 !important; } #pagina-planos-auto-moto .container-coberturas .btn-default { font-size: 1.5rem; padding: 20px 55px; } #pagina-planos-auto-moto .container-coberturas .cobertura-item .icon-cobertura img { width: 75px !important; } /*--------------------------------------- CONTAINER | PARCEIROS -----------------------------------------*/ #pagina-planos-auto-moto .container-parceiros h1 { font-size: 2.8rem; text-align: center; } #pagina-planos-auto-moto .container-parceiros span { font-size: 1.4rem; } #pagina-planos-auto-moto .content-parceiros { display: block; } #pagina-planos-auto-moto .content-parceiros img { width: 250px !important; } } /*================================================================= TABLET (768px - 991px) ===================================================================*/ /*@media (min-width: 768px) AND (max-width: 991px) { }*/ /*================================================================= DESKTOP (>= 992px) ===================================================================*/ @media (min-width: 992px) { /*--------------------------------------- COMUM -----------------------------------------*/ #pagina-planos-auto-moto .container-fluid { margin: 0px; padding: 0px; overflow-x: hidden; } div[class^="icon-cobertura"] { margin-right: -2% !important; max-width: 14% !important; } div[class^="fa-stack-3x"] { color: #ad1d1d; } div[class="cobertura-item col-lg-6 col-xl-6 col-xxl-6 p-2 p-lg-5 p-xl-5 p-xxl-5 d-block"] { /* background-color: yellow !important;*/ padding: 1% !important; margin-right: 0% !important; } /*--------------------------------------- CONTAINER | PLANOS -----------------------------------------*/ #pagina-planos-auto-moto .container-planos h1 { font-size: 4rem; text-align: left; } #pagina-planos-auto-moto .coberturas-lista span { color: #808080; font-size: 1.75rem; } #pagina-planos-auto-moto .container-planos .cobertura-item .icon-cobertura img { width: 75px !important; max-width: 52% !important; } /*--------------------------------------- CONTAINER | COBERTURAS -----------------------------------------*/ #pagina-planos-auto-moto .container-coberturas .titulo-faixa h2 { font-weight: 200; font-size: 2.8rem; } #pagina-planos-auto-moto .container-coberturas p { color: #808080; font-size: 1.27rem; } #pagina-planos-auto-moto .container-coberturas h3 { text-align: left; font-size: 2.2rem; white-space:nowrap; } #pagina-planos-auto-moto .container-coberturas .btn-default { font-size: 2rem; padding: 13px 70px; } #pagina-planos-auto-moto .container-coberturas .cobertura-item .icon-cobertura img { width: 41px !important; } /*--------------------------------------- CONTAINER | PARCEIROS -----------------------------------------*/ #pagina-planos-auto-moto .container-parceiros h1 { font-size: 5rem; text-align: left; } #pagina-planos-auto-moto .container-parceiros span { font-size: 1.8rem; } #pagina-planos-auto-moto .content-parceiros { display: flex; align-items: center; flex-direction: row; } #pagina-planos-auto-moto .content-parceiros img { width: 250px !important; } a, a:hover, a:visited { color: var(--primary-color); } } /* #region FORMULARIO VIAGEM */ @media all { #formulario-principal-viagem label { font-size: medium !important; color: white !important; font-family: Roboto, sans-serif !important; } #formulario-principal-viagem { background-color: var( --background-formulario-viagem) !important; margin-top: 1%; } #formulario-principal-viagem h2 { line-height: 40px !important; font-size: 20px !important; color: white !important; text-align: center !important; } #botacoContinuar { font-family: Roboto, sans-serif !important; font-weight: 500 !important; color: var(--secondary-color) !important; background-color: var(--extra-color) !important; font-size: 18px !important; padding: 12px !important; border: none !important; -webkit-transition: all .4s ease-out !important; transition: background-color .4s ease !important; border-radius: 10px !important; } #botacoContinuar:hover { font-family: var(--default-font); font-weight: 500; color: var(--secondary-color); background-color: var(--extra-color); font-size: 18px !important; padding: 12px; cursor: pointer; border: none; -webkit-transition: all .4s ease-out; transition: background-color .4s ease; border-radius: 20px; } #btnanterior { font-family: Ubuntu, sans-serif !important; font-weight: 500 !important; color: var(--secondary-color) !important; background-color: var(--extra-color) !important; font-size: 18px !important; padding: 12px !important; border: none !important; -webkit-transition: all .4s ease-out !important; transition: background-color .4s ease !important; border-radius: 10px !important; } #btnanterior:hover { font-family: var(--default-font); font-weight: 500; color: var(--secondary-color); background-color: var(--extra-color); font-size: 18px !important; padding: 12px; cursor: pointer; border: none; -webkit-transition: all .4s ease-out; transition: background-color .4s ease; border-radius: 20px; } #btProcessar { font-family: Ubuntu, sans-serif !important; font-weight: 500 !important; color: var(--secondary-color) !important; background-color: var(--extra-color) !important; font-size: 18px !important; padding: 12px !important; border: none !important; -webkit-transition: all .4s ease-out !important; transition: background-color .4s ease !important; border-radius: 10px !important; } #btProcessar:hover { font-family: var(--default-font); font-weight: 500; color: var(--secondary-color); background-color: var(--extra-color); font-size: 18px !important; padding: 12px; cursor: pointer; border: none; -webkit-transition: all .4s ease-out; transition: background-color .4s ease; border-radius: 20px; } input[type=date], input[type=datetime-local], input[type=month], input[type=time] { font-family: Roboto, sans-serif !important; } #formulario-principal-viagem input { font-family: Roboto, sans-serif !important; } #formulario-principal-viagem .form-control { font-family: Roboto, sans-serif !important; } #formulario-passageiro-viagem .accordion { --bs-accordion-bg: var( --background-formulario-viagem) !important; } #formulario-passageiro-viagem label { font-size: medium !important; color: white !important; font-family: Roboto, sans-serif !important; } #formulario-passageiro-viagem input { font-family: Roboto, sans-serif !important; } #formulario-passageiro-viagem .form-control { font-family: Roboto, sans-serif !important; } .formulario pagamento { font-size: medium !important; color: white !important; font-family: Ubuntu, sans-serif !important; background-color: var( --background-formulario-viagem) !important; } #formulario-pagamento-viagem { background-color: var( --background-formulario-viagem) !important; } /* .formulario { background-color: var( --background-formulario-viagem) !important; }*/ #painel-pagamento-cartao-conteudo row formulario { background-color: var( --background-formulario-viagem) !important; } #formulario-pagamento-viagem h2 { color: white; font-family: Roboto, sans-serif !important; } #formulario-pagamento-viagem .box_pagamento h2 { text-align: center; font-size: 26px; color: black; } #formulario-pagamento-viagem #painel-pagamento-cartao-conteudo label { color: white; font-size: small; font-family: Roboto, sans-serif !important; } #Quantidade-passageiros { color: white; font-size: small; font-family: Roboto, sans-serif !important; } #formulario-principal-viagem .plano .btn:hover { background-color: #3284a6; border: 1px solid #a63253; color: white !important; text-transform: uppercase; } #formulario-principal-viagem .valor { font-size: medium; font-family: Roboto, sans-serif !important; } #formulario-principal-viagem .bg-white.pt-4.pb-4.m-2 { font-size: medium; font-family: Roboto, sans-serif !important; } #formulario-principal-viagem .btn-primary { font-family: Ubuntu, sans-serif !important; font-weight: 500 !important; color: var(--secondary-color) !important; background-color: var(--extra-color) !important; font-size: 18px !important; padding: 12px !important; border: none !important; -webkit-transition: all .4s ease-out !important; transition: background-color .4s ease !important; border-radius: 10px !important; } #formulario-principal-viagem .btn-primary :hover { color: black !important; font-weight: 600; box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.21); background-color: white; } } /*#endregion */