﻿/* FONTES */
@font-face { font-family: westonfree; src: url('../fontes/Weston/WestonFree-Regular.otf'); }

/* GERAL */
body, a, input, textarea { font-family: 'Abel', sans-serif; font-size: 20px; color: #001b36; font-weight: 400; }
.titulo { font-family: westonfree; font-size: 50px; letter-spacing: 1px; line-height: 1em; margin-bottom: 5px; }
.subtitulo { text-transform: uppercase; font-family: 'Abel', sans-serif; font-size: 20px; }

/* MASTER */
.whatsapp { position: fixed; width: 4rem; height: 4rem; bottom: 2rem; right: 2rem; background-color: #25d366; color: #fff; border-radius: 50%; text-align: center; transition: .3s; z-index: 999; }
.whatsapp:hover { background: #128c7e; }
.whatsapp svg { font-size: 2rem; margin-top: 1rem; }
.menu-botao { display: none; position: fixed; top: 18px; right: 0; background: #004990; padding: 15px 20px; cursor: pointer; font-size: 20px; z-index: 1001; border-radius: 10px 0 0 10px; color: #ffffc7; }
.menu-mobile { position: fixed; background: #00335f; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; padding: 0; margin: 0; z-index: 1000; display: none; }
.menu-mobile .conteudo { height: 100%; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; }
.menu-mobile .conteudo ul { width: 100%; }
.menu-mobile .conteudo ul li { margin: 15px 0; }
.menu-mobile .conteudo ul li a { font-weight: 700; text-transform: uppercase; margin-bottom: 10px; font-size: 2em; color: #ffffc7; }
.menu-mobile .conteudo ul li ul li a { font-size: 1.5em; color: #fecc2d; margin-bottom: 5px; }
.cabecalho { background: #fbfbd9; padding: 30px 0 25px 0; }
.cabecalho .logo { width: 300px; }
.cabecalho .logo-detalhe { width: 67px; position: absolute; margin: -10px 0 0 -300px; -webkit-animation: spin 3s linear 0s infinite reverse; -moz-animation: spin 3s linear 0s infinite reverse;   -ms-animation: spin 3s linear 0s infinite reverse; -o-animation: spin 3s linear 0s infinite reverse; animation: spin 3s linear 0s infinite reverse; }
@keyframes spin { 0% { transform: rotate(360deg); } 100% { transform: rotate(0deg); } }
@-webkit-keyframes spin { 0% {-webkit-transform: rotate(360deg); } 100% { -webkit-transform: rotate(0deg); } }
@-ms-keyframes spin { 0% {-ms-transform: rotate(360deg); } 100% { -ms-transform: rotate(0deg); } }
@-moz-keyframes spin { 0% { -moz-transform: rotate(360deg); } 100% { -moz-transform: rotate(0deg); } }
@-o-keyframes spin { 0% { -o-transform: rotate(360deg); } 100% { -o-transform: rotate(0deg); } }
.cabecalho .menu { margin-top: 25px; }
.cabecalho .menu li { margin-left: 30px; display: inline-block; }
.cabecalho .menu li a { text-transform: uppercase; font-size: 22px; transition: 0.3s; }
.cabecalho .menu li a:hover { color: #cc3539; }
.corpo { background: #00335f; color: #ffffc7; }
.corpo .produtos .listagem { margin-top: 60px; }
.corpo .produtos .listagem li { width: 30%; display: inline-block; margin: 0 1.5% 50px 1.5%; }
.corpo .produtos .listagem li img { width: 270px; border-radius: 100%; margin-bottom: 20px; transition: 0.3s; }
.corpo .produtos .listagem li img:hover { transform: rotate(15deg); }
.corpo .produtos .listagem li h2 { color: #ffffc7; font-family: westonfree; letter-spacing: 1px; font-size: 25px; transition: 0.3s; }
.corpo .produtos .listagem li h2:hover { color: #06fff9; }
.corpo .produtos .listagem li h3 { color: #ffffc7; transition: 0.3s; }
.corpo .produtos .listagem li h3:hover { color: #06fff9; }
.corpo .depoimentos { background: #001b36; padding: 100px 0 60px 0; }
.corpo .depoimentos .listagem { width: 800px; cursor: move; margin-top: 40px; }
.corpo .depoimentos .listagem p { line-height: 1.5em; }
.corpo .depoimentos .listagem .usuario { width: 300px; margin: 20px 10px 0 -150px; left: 50%; position: relative; }
.corpo .depoimentos .listagem .usuario img { width: 100px; border-radius: 100%; margin-right: 10px; }
.corpo .depoimentos .listagem .usuario .infos { line-height: 1.3em; margin-top: 10px; }
.corpo .depoimentos .listagem .usuario .infos h3 { font-weight: 700; }
.slick-dots li button::before { font-size: 20px!important; color: #06fff9!important; }
.corpo .formulario input, .corpo .formulario textarea { width: calc(100% - 40px); background: #fbfbd9; padding: 20px 20px 15px 20px; font-family: westonfree; letter-spacing: 1px; border: none; margin-bottom: 5px; border-bottom: 5px solid #e1e1c3; }
.corpo .formulario textarea { height: 150px; }
.corpo .formulario .botao { cursor: pointer; background: #ffe187; border-color: #ccb46c; transition: 0.3s; width: 100%; }
.corpo .formulario .botao:hover { background: #001b36; border-color: #00162b; color: #ffffc7; }
.rodape { background: #06fff9 url("../img/fundo-rodape.jpg"); background-repeat: no-repeat; background-size: cover; background-position: center center; padding-bottom: 30px; }
.rodape .representantes { background: #fff; padding-top: 50px; }
.rodape .representantes h2 { font-size: 30px; font-family: westonfree; letter-spacing: 1px; padding: 0 50px; }
.rodape .representantes h3 { padding: 20px 50px 40px 50px; font-family: 'Abel', sans-serif; }
.rodape .representantes a { width: 100%; display: inline-block; background: #ffe187; padding: 20px 0; text-transform: uppercase; font-size: 25px; font-family: westonfree; letter-spacing: 5px; border-bottom: 5px solid #ccb46c; transition: 0.3s; }
.rodape .representantes a:hover { background: #001b36; border-color: #00162b; color: #ffffc7; }
.rodape .contatos { margin-left: 20%; padding-top: 50px; }
.rodape .contatos h2 { font-size: 30px; font-family: westonfree; letter-spacing: 1px; margin-bottom: 20px; }
.rodape .contatos a { margin-bottom: 10px; display: inline-block; }
.rodape .contatos .telefone { font-size: 35px; margin-bottom: 20px; }
.rodape .contatos .social svg { background: #001b36; padding: 10px; border-radius: 100%; width: 30px; height: 30px; color: #ffffc7; margin-right: 5px; transition: 0.3s; }
.rodape .contatos .social svg:hover { background: #00335f; }
.rodape .desenvolvedor { text-transform: uppercase; font-size: 16px; margin-top: 50px; }
.rodape .desenvolvedor a { transition: 0.3s; font-size: 16px; font-weight: bold; }
.rodape .desenvolvedor a:hover { color: #00335f; }

/* DEFAULT */
.page-home .anuncios { background-repeat: no-repeat; background-size: cover; background-position: center center; padding-top: 50px; }
.page-home .anuncios .infos { background: #004990; color: #ffffc7; padding-top: 70px; font-family: westonfree; letter-spacing: 1px; position: relative; top: 300px; }
.page-home .anuncios .infos h2 { font-size: 40px; line-height: 1.2em; padding: 0 50px; }
.page-home .anuncios .infos h3 { line-height: 1.8em; padding: 0 50px; margin: 20px 0 60px 0; }
.page-home .anuncios .infos a { width: 100%; display: inline-block; background: #ffe187; padding: 20px 0; text-transform: uppercase; font-size: 25px; font-family: westonfree; letter-spacing: 5px; border-bottom: 5px solid #ccb46c; transition: 0.3s; }
.page-home .anuncios .infos a:hover { background: #001b36; border-color: #00162b; color: #ffffc7; }
.page-home .video { width: 100%; }
.page-home .video iframe { min-width: 100%; max-height: 600px; aspect-ratio: 16 / 9; }
.page-home .video .infos { background: #004990; color: #ffffc7; padding-top: 70px; font-family: westonfree; letter-spacing: 1px; position: relative; top: -200px; margin-bottom: -500px; }
.page-home .video .infos h2 { font-size: 40px; line-height: 1.2em; padding: 0 50px; }
.page-home .video .infos h3 { line-height: 1.8em; padding: 0 50px; margin: 20px 0 60px 0; }
.page-home .video .infos a { width: 100%; display: inline-block; background: #ffe187; padding: 20px 0; text-transform: uppercase; font-size: 25px; font-family: westonfree; letter-spacing: 5px; border-bottom: 5px solid #ccb46c; transition: 0.3s; }
.page-home .video .infos a:hover { background: #001b36; border-color: #00162b; color: #ffffc7; }
.page-home .ligamos { padding: 70px 0; float: right!important; }
.page-home .ligamos h2 { font-family: westonfree; font-size: 40px; letter-spacing: 1px; line-height: 0.9em; }
.page-home .ligamos h2 span { font-size: 25px; letter-spacing: 7px; }
.page-home .ligamos p { text-transform: uppercase; margin: 20px 0; }
.page-home .ligamos .formulario .telefone { width: calc(80% - 40px); }
.page-home .ligamos .formulario .botao { width: calc(20% - 5px); }
.page-home .produtos { padding: 50px 0 30px 0; }
.page-home .parceiros { padding: 70px 0; }
.page-home .parceiros .listagem { margin-top: 50px; padding: 20px 0; background: #fff; }
.page-home .parceiros .listagem li { vertical-align: middle; cursor: move; }
.page-home .parceiros .listagem img { max-width: 80%; max-height: 100px; display: inline-block; }

/* INSTITUCIONAL */
.page-institucional { padding: 70px 0; }
.page-institucional .sobre { line-height: 1.5em; margin-top: 40px; }
.page-institucional .valores { margin-left: 20%; }
.page-institucional .valores li { background: #004990; padding: 30px; margin-bottom: 10px; }
.page-institucional .valores li h2 { font-size: 40px; font-family: westonfree; letter-spacing: 1px; }
.page-institucional .valores li h3, .page-institucional .valores li p { text-transform: uppercase; font-size: 20px; line-height: 1.5em; margin-top: 15px; }
.page-institucional .video iframe { margin-bottom: 70px; }

/* PRODUTOS */
.page-produtos { padding: 70px 0 20px 0; }

/* PRODUTO */
.page-produto { padding: 70px 0; }
.page-produto .tituloPrincipal { line-height: 1em; }
.page-produto .descricao { line-height: 1.5em; margin: 30px 0; }
.page-produto .foto { width: 100%; cursor: pointer; }
.page-produto iframe { width: 100%; height: 500px; }
.page-produto .interessado { background: #004990; padding: 30px; width: 80%; margin-left: 10%; }
.page-produto .interessado h2 { font-family: westonfree; font-size: 25px; letter-spacing: 7px; line-height: 1.5em; }
.page-produto .interessado h2 span { font-size: 40px; letter-spacing: 1px; }
.page-produto .interessado p { text-transform: uppercase; margin: 20px 0; }
.page-produto .opcoes { margin-top: 60px; }
.page-produto .opcoes .observacao { background: #2ac6ef; width: 90%; margin: 30px 0 -40px 5%; color: initial; font-size: 16px; padding: 5px 0; display: none; }
.page-produto .opcoes table { width: 80%!important; margin-left: 10%; border: 1px solid #2ac6ef; }
.page-produto .opcoes table td { padding: 10px 0; font-size: 14px; }

/* REPRESENTANTES */
.page-representantes { padding: 70px 0; }
.page-representantes .subtitulo { margin-bottom: 60px; }
.page-representantes .mapa { position: relative; }
.page-representantes .mapa #svg-map path { fill: #001b36; }
.page-representantes .mapa #svg-map path.marcado { fill: #004990; }
.page-representantes .mapa #svg-map text { fill: #ffffc7; cursor: pointer; }
.page-representantes .mapa #svg-map a { text-decoration: none; font-size: 15px; }
.page-representantes .mapa #svg-map a:hover { cursor: pointer; text-decoration: none; }
.page-representantes .mapa #svg-map a:hover path { fill: #004990!important; }
.page-representantes .mapa #svg-map .circle { fill: #004990; }
.page-representantes .mapa #svg-map a:hover .circle { fill: #004990!important; cursor: pointer; }
.page-representantes .infos p { line-height: 1.5em; margin-bottom: 30px; }
.page-representantes .infos h2 { font-size: 25px; font-family: westonfree; letter-spacing: 1px; }
.page-representantes .representantes { margin-top: 20px; }
.page-representantes .representantes .topo { font-family: westonfree; letter-spacing: 1px; border-bottom: 1px solid #ffffc7; padding-bottom: 20px; }
.page-representantes .representantes .listagem li { padding: 20px 0; border-bottom: 1px solid #ffffc7; }
.page-representantes .representantes .listagem li ul li { padding: 0; border: 0; }

/* CONTATO */
.page-contato { padding-top: 70px; }
.page-contato .formulario .subtitulo { margin-bottom: 40px; }
.page-contato .formulario input { width: calc(33.33% - 50px); float: left; margin: 0 5px 10px 5px; }
.page-contato .formulario textarea { margin-bottom: 10px; width: calc(100% - 50px); }
.page-contato .formulario .botao { width: calc(100% - 10px);  }
.page-contato #mapa { height: 500px; margin-top: 70px; }