@charset "utf-8";

/****************************
 * CLASSES GERAIS
 ***************************/
.container{max-width:1200px; padding:0 10px; margin: 0 auto;}
.titulo-pagina{ display: block; font-family: Roboto; font-size: 35px; color:#000; font-weight: 900; text-align: center; position: relative; margin-bottom: 50px; text-transform: uppercase; }
.titulo-pagina:after{ content:""; width: 70px; height: 5px; background: #034575; position: absolute; bottom: -20px; left:50%; transform: translateX(-50%); }
.titulo-pagina.white{ color:#FFF; }
.titulo-pagina.white:after{ background: #fedf05; }
.subtitulo{ display: block; text-align: center; font-size: 16px; color:#666; font-weight: normal; font-family: Roboto; }
.ico-whatsapp{ display: block; text-indent: -100000px; position: fixed; left:15px; bottom:15px; width: 50px; height: 50px; background: url(/template/imagens/ico-whatsapp.png) no-repeat center center / cover; z-index: 999; }

/****************************
 * MENU MOBILE
 ***************************/
.menumobile{ position: fixed; top:0; left:-208px; width: 208px; height: 100%; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; background: #024474; padding: 15px; -webkit-transition: left 0.6s ease; -moz-transition: left 0.6s ease; -o-transition: left 0.6s ease; transition: left 0.6s ease; }
body.animated .menumobile{ left:0; }
.menumobile > ul > li{ display: block; border-top: 1px solid #FFF; height: 40px; line-height: 40px; }
.menumobile > ul > li:first-child{ border-top: none; }
.menumobile > ul > li > a{ display: block; color:#FFF; font-family: Roboto; font-size: 14px; font-weight: 400; }

/****************************
 * CADASTRO
 ***************************/
 .cadastro > .container > form > ul{ display: block; max-width: 500px; margin: 20px auto 0; }
 .cadastro > .container > form > ul > li{ display: block; margin-top: 15px; width: 100%; overflow: hidden; }
 .cadastro > .container > form > ul > li.double{ width: calc(50% - 15px); margin-left: 15px; float: left; }
 .cadastro > .container > form > ul > li.double.first{ margin-left: 0; width: 50%; }
 .cadastro > .container > form > ul > li:first-child{ margin-top: 0; }
 .cadastro > .container > form > ul > li > input[type=text]{ display: block; width: calc(100% - 22px); padding: 5px 10px; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius: 5px; border:1px solid #024474; -moz-box-sizing:border-box; font-family: Roboto; font-size: 16px; color:#024474; font-weight: 700; }
 .cadastro > .container > form > ul > li > select{ display: block; width: calc(100% - 2px); height: 40px; line-height: 40px; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius: 5px; border:1px solid #024474; font-family: Roboto; font-size: 16px; color:#024474; font-weight: 700; }
 .cadastro > .container > form > ul > li > textarea{ display: block; width: calc(100% - 22px); padding: 5px 10px; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius: 5px; border:1px solid #024474; -moz-box-sizing:border-box; font-family: Roboto; font-size: 16px; color:#024474; font-weight: 700; resize: none; }
 .cadastro > .container > form > ul > li > label{ display: block; font-family: Roboto; font-size: 16px; color:#666; font-weight: normal; margin-bottom: 5px; }
 .cadastro > .container > form > ul > li > button[type=submit]{ display: block; float: left; width: calc(50% - 7.5px); height: 40px; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; background: #024474; font-family: Roboto; font-size: 16px; color:#FFF; font-weight: 700; border:none; }
 .cadastro > .container > form > ul > li > button[type=reset]{ display: block; float: left; width: calc(50% - 7.5px); height: 40px; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; background: #ccc; font-family: Roboto; font-size: 16px; color:#999; font-weight: 700; border:none; margin-left: 15px; }

/****************************
 * TOPO
 ***************************/
.topo{ width: 100%; background: rgba(255,255,255,.9); height: 100px; position: fixed; overflow: hidden; z-index: 5; -moz-box-shadow:0 0 5px rgba(0,0,0,.3); -webkit-box-shadow:0 0 5px rgba(0,0,0,.3); box-shadow:0 0 5px rgba(0,0,0,.3); }
.topo > .container{ position: relative; height: 100px; }
.topo > .container > .logo{ display: block; position: absolute; left:10px; top:50%; transform: translateY(-50%); width: 100px; text-indent: -1000000px; background: url(/template/imagens/logo.png) no-repeat center center / contain; }
.topo > .container > .logo > img{ opacity: 0; }
.topo > .container > .contatos{ position: absolute; right:10px; top:30px; }
.topo > .container > .contatos > .telefone{ display: block; float:left; padding: 5px 20px 5px 35px; font-family: Roboto; font-size: 18px; color:#024474; font-weight: bold; margin-left: 15px; position: relative; }
.topo > .container > .contatos > .telefone:before{ content:""; width: 19px; height: 19px; position: absolute; left:10px; top:50%; transform: translateY(-50%); background: url(/template/imagens/ico-phone.png) no-repeat center center; }
.topo > .container > .contatos > .telefone > b{ font-size: 14px; }
.topo > .container > .contatos > .social{ display: block; float:left; margin-left: 40px; }
.topo > .container > .contatos > .social > a{ display: block; width: 30px; height: 30px; float:left; text-decoration: none; background: url(/template/imagens/sprite-social.png) no-repeat; -moz-transition:all .2s; -webkit-transition: all .2s; transition: all .2s; text-indent: -1000000px; margin-right: 10px; }
.topo > .container > .contatos > .social > a:last-child{ margin-right: 0; }
.topo > .container > .contatos > .social > .twitter{ background-position: left top; }
.topo > .container > .contatos > .social > .twitter:hover{ background-position: left -30px; }
.topo > .container > .contatos > .social > .facebook{ background-position: -30px top; }
.topo > .container > .contatos > .social > .facebook:hover{ background-position: -30px -30px; }
.topo > .container > .contatos > .social > .instagram{ background-position: right top; }
.topo > .container > .contatos > .social > .instagram:hover{ background-position: right -30px; }
.topo > .container > .menu{ position: absolute; top: 50%; right:10px; transform: translateY(-50%); }
.topo > .container > .menu > li{ display: block; float:left; position: relative; }
.topo > .container > .menu > li > a{ display: block; padding: 10px; font-family: Roboto; font-size: 12px; color:#666; font-weight: bold; text-decoration: none; }
.topo > .container > .menu > li:last-child > a, .topo > .container > .menu > li:last-child:hover > a{ background:#024474; color:#FFF; -moz-border-radius:20px; -webkit-border-radius:20px; border-radius: 20px; }
.topo > .container > .menu > li.active > a, .topo > .container > .menu > li:hover > a{ color:#024474; }

.topo > .container > .ico-mobile{ display: none; position: absolute; left:10px; top:50%; transform: translateY(-50%); width: 30px; text-decoration: none; }
.topo > .container > .ico-mobile:after, 
.topo > .container > .ico-mobile:before, 
.topo > .container > .ico-mobile > div{ background-color: #000; border-radius: 5px; content: ''; display: block; height: 4px; margin: 5px 0; transition: all .2s ease-in-out; }
.topo > .container > .ico-mobile.active:before { transform: translateY(6px) rotate(135deg); }
.topo > .container > .ico-mobile.active:after { transform: translateY(-12px) rotate(-135deg); }
.topo > .container > .ico-mobile.active > div { transform: scale(0); }

/****************************
 * RODAPÉ
 ***************************/
.rodape{ display: block; padding: 30px 0 0; width: 100%; background:#174C7E; }
.rodape > .direitos{ display: block; margin-top: 30px; width: 100%; font-family: 'Roboto'; font-size: 14px; color:#FFF; text-align: center; padding: 15px 0; background: #024474; }
.rodape > .container{ display: flex; }
.rodape > .container .titulo{ display: block; font-family: 'Roboto'; font-size: 22px; color:#FFF; font-weight: 700; }
.rodape > .container .subtitulo{ display: block; font-family: 'Roboto'; font-size: 12px; color:#eee; font-weight: 400; text-align: left; }
.rodape > .container > .sobre{ display: block; flex: 1; }
.rodape > .container > .sobre > .texto{ display: block; max-width: 320px; padding-top: 20px; font-family: 'Roboto'; font-size: 15px; color:#FFF; font-weight: normal; }
.rodape > .container > .sobre > .texto > a{ display: block; margin-top: 15px; font-family: 'Roboto'; font-size: 14px; color:#FFF; font-weight: 700; text-decoration: underline; }
.rodape > .container > .social{ display: block; min-width: 320px; }
.rodape > .container > .social > ul{ display: flex; margin-top: 20px; }
.rodape > .container > .social > ul > li{ flex: 1; }
.rodape > .container > .social > ul > li > a{ display: block; text-indent: -1000000px; width: 30px; height: 30px; background: url(/template/imagens/sprite-social.png) no-repeat; }
.rodape > .container > .social > ul > li.fb > a{ background-position: center 0; }

/****************************
 * MODAL
 ***************************/
.modal, .carregando{ position: fixed; top:0; left:0; width: 100%; height: 100%; display: none; background: rgba(0,0,0,.4); }
.modal > .box{ display: block; width: 90%; max-width: 600px; background: #FFF; -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); max-height: 95vh; }
.modal > .box > .header{ display: block; height: 45px; line-height: 45px; font-family: Roboto; font-size: 16px; color:#024474; font-weight: 700; -moz-border-radius:10px 10px 0 0; -webkit-border-radius:10px 10px 0 0; border-radius:10px 10px 0 0; background: #eee; padding: 0 15px; }
.modal > .box > .body{ display: block; padding: 0 15px 15px; overflow-y:scroll; height: calc(95vh - 120px); }
.modal > .box > .body > .titulo{ display: block; font-family: Roboto; font-size: 20px; color:#333; font-weight: 700; margin-top:15px; margin-bottom: 10px; }
.modal > .box > .body > .head{ display: block; height: 35px; line-height: 35px; background: #eee; text-indent: 15px; font-family: Roboto; font-size: 16px; color:#666; font-weight: 700; margin-bottom: 10px; }
.modal > .box > .body > .row{ display: block; max-width: 100%; }
.modal > .box > .body > .row > .col{ display: block; float:left; margin-left: 10px; background: #024474; font-family: Roboto; font-size: 14px; color:#fff; font-weight: 400; padding: 5px; margin-bottom: 10px; }
.modal > .box > .footer{ display: block; margin-top: 15px; height: 45px; line-height: 45px; text-align: right; padding:0 15px; }
.modal > .box > .footer > a{ font-family: Roboto; font-size: 16px; color:#333; font-weight: 400; }

/****************************
 * LOADING
 ***************************/
.carregando > .box{ width: 50px; height: 50px; -moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%; background: #FFF url(/template/imagens/ajax-loader.gif) no-repeat center center; position: absolute; left:50%; top:50%; transform: translate(-50%, -50%); }