body {font-family: 'Lato', Helvetica, Arial, sans-serif; color: #3f3f3f; /* font-smoothing: antialiased; -moz-font-smoothing: antialiased; -webkit-font-smoothing:antialiased; */}
*{outline:0px;}

/* HEADER */
.navbar {height: 86px; background: url(../img/bgHeader.png) left top repeat;}
.navbar.navbar-default {border-bottom: none;}
.navbar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand {margin:18px 0 18px 0px; }
.navbar-brand {width: 107px; height: 48px; background: url(../img/base.png) left top repeat;}
.navbar-nav {margin-top: 16px;}
.navbar-default .navbar-nav>li>a {color:#fff; font-size: 11px; font-weight: 700; text-transform: uppercase;}
.navbar-default .navbar-nav>li>a:hover, 
.navbar-default .navbar-nav>li>a.active {color:#397f7a;}

.home .navbar-default .navbar-nav>li>a.home,
.sobre .navbar-default .navbar-nav>li>a.sobre, 
.servicos .navbar-default .navbar-nav>li>a.servicos,
.suporte .navbar-default .navbar-nav>li>a.suporte,
.atendimento .navbar-default .navbar-nav>li>a.atendimento {color:#397f7a;}

.nav.navbar-nav {float: right!important;}
.navbar-collapse { border-top: none;}
.collapse.in {background: #333;}
.collapse.in .nav { display: block;}
.opacity .collapse.in .nav {opacity:1;}

.collapse.in .navbar-nav>li>a { text-align: right;}

.navbar-toggle { margin-top: 24px;}
.navbar-default .navbar-toggle { border: none;}
.navbar-default .navbar-toggle .icon-bar { background-color: #fff;}
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus { background-color: #202020; border-radius: 3px;}

.navbar .telefones {float: right; width: 262px; height: 86px; margin-left: 30px; color: #d9d9d9;}
.navbar .telefones strong.principalTelefone {float:left; width: 165px; font-weight: 400; margin-top: 28px; font-size: 14px; text-align: right;}
.navbar .telefones strong.principalTelefone span {font-weight: 700; font-size: 18px;}
.maisTelefones {float:right; width: 82px; height: 86px; background: url(../img/bgTelefonesIcos.png) left top no-repeat; -webkit-transition: 300ms;-moz-transition: 300ms;transition: 300ms;}
.maisTelefones .acionaTelefone {float:right; width: 100%; height: 86px; background: url(../img/bgTelefonesIcos.png) left -86px no-repeat; opacity:0;display: none; -webkit-transition: 300ms;-moz-transition: 300ms;transition: 300ms;}
.maisTelefones .acionaTelefone ul { position: relative; padding-left: 0; right: 180px; top: 80px; width: 262px; background: #3d3d3d; border-bottom: 3px solid #397f7a; list-style: none; -webkit-transition: 300ms;-moz-transition: 300ms;transition: 300ms;}
.maisTelefones .acionaTelefone ul li { width: 100%; text-align: left; text-indent: 24px; margin-left:0; padding-left: 0; line-height: 40px; background: url(../img/icoCel.png) 213px 10px no-repeat; }
.maisTelefones .acionaTelefone ul li:first-child {border-bottom: 1px solid #646464;background: url(../img/icoCel0.png) 211px 11px no-repeat;}
.maisTelefones .acionaTelefone ul li strong {font-weight: 400; font-size: 13px;}
.maisTelefones .acionaTelefone ul li span {font-weight: 700; font-size: 16px;}

.maisTelefones:hover {cursor: pointer;}
.maisTelefones:hover .acionaTelefone { opacity: 1;display:block;}
.maisTelefones:hover .acionaTelefone ul {}

.arrow-up {width: 0; height: 0; border-left: 7px solid transparent;border-right: 7px solid transparent;border-bottom: 7px solid #3d3d3d;}
.maisTelefones:hover .arrow-up {position:relative; top:80px; right: -33px;}

/* HOME */
.headerSlide {width: 100%; min-height: 575px; background: url(../img/headerSlider.jpg) center top no-repeat; background-size: cover;}
.headerSlide h1 {margin-top: 230px; color:#fff; font-size: 32px;}
.headerSlide p {color: #fff; font-size: 16px; font-weight: 400; margin-bottom: 32px;}

.boxHome img { margin-top: -70px;}
.boxHome article { height: 320px; margin-top: 20px; background:#f6f6f6;}
.boxHome article.nuvem {background: url(../img/bgNuvem.png) right bottom no-repeat #f6f6f6;}
.boxHome article.seguranca {background: url(../img/bgSeguranca.png) right bottom no-repeat #f6f6f6;}
.boxHome article.mobilidade {background: url(../img/bgMobilidade.png) right bottom no-repeat #f6f6f6;}

.wFull.camadas { background: #f5f5f5; margin-top: 20px;}
.wFull.camadas h3 { margin-top: 65px; font-size: 32px; font-weight: 700; color: #353535;}
.wFull.camadas p { font-size: 16px; font-weight: 400; margin-bottom: 32px;}
.wFull.camadas figure { margin-top: 30px; width: 100%;}
.wFull.camadas figure img { width: 100%; max-width: 100%;}
.wFull.camadas .btnGeral { margin-bottom: 40px;}

#parallaxGroup {position: relative;}
.parallax {position: absolute;}
.parallax img { width: 100%;}

/* ARTICLE */
article {padding: 12px 18px;}`
article h2,
article h3 {text-transform: uppercase; font-size:16px; color:#353535; font-weight: 700;}
article p {font-size: 16px; color: #545454; font-weight: 400; line-height: 1.5em; margin-bottom: 24px;}
article ul{margin:0 0 24px 0;}
article ul li{font-size: 16px; color: #545454; font-weight: 400; line-height: 1.5em; list-style:none;}

.txtSobre article { padding:24px 24px 24px 0; background: #fff;}


.listaContainer { margin-top: 24px;}
.item { width: 300px; margin-bottom: 24px;}
.item article {padding:0;background: url(../img/bgArticle.png) right bottom no-repeat #f6f6f6;}
.item article.active { background-color: #34a4a4;}
.item article.active p {color:#fff;}
.item article.active h2 {color:#ffffff; font-size: 18px;}
.item article.null { opacity: 0.3;}
.item article section {padding: 12px 18px 24px 18px;}

.item article figure { width: 100%;}
.item article figure img { width: 100%; max-width: 100%;}

.headerGeral { background: #f5f5f5; padding-top: 120px;}
.page-header { border: none; margin-top: 30px;}
.page-header h1 {}
.page-header h2 { font-size: 14px; font-weight: 700; text-transform: uppercase; margin: 24px 0 14px 0;}
.page-header p {font-size: 16px; color: #545454; font-weight: 400; line-height: 1.5em; margin-bottom: 24px;}
.breadcrumbs {float:left; display: block; width: 100%;}
.breadcrumbs ul { float: left; list-style: none; padding-left: 0;}
.breadcrumbs ul li { float: left; list-style: none; font-size: 11px; text-transform: uppercase; font-weight: 400; color: #3f3f3f;}
.breadcrumbs ul li span { margin: 0 8px;}
.breadcrumbs ul li a { color: #3f3f3f;}

.atendimentoServ { float:left; width:400px; margin:20px 0 60px 0; }
.atendimentoServ img{ float:left; margin:0 20px 0 20px;}
.atendimentoServ h3 { float:left; text-transform: uppercase; font-size: 21px; color: #333; font-weight: 700; }
.atendimentoServ a{ display:block; font-size:16px; color:#333;}
.atendimentoServ a:hover{ color:#34a4a4; text-decoration:none;}
.atendimentoServ .btnGeral { float:left; font-size:12px; height: 52px;padding: 0 26px;line-height: 48px; margin:20px 0 0 125px;}

.atendimentoTelefones { height: 96px; padding-top: 16px; background: #3f3f3f; border-bottom: 3px solid #dfd720;}
.atendimentoTelefones strong { float: left; width: 100%; font-weight: normal; color:#d9d9d9;}
.atendimentoTelefones  span { font-size: 12px;}
.atendimentoTelefones  span span{ font-size: 16px; font-weight: 700;}

.atendimentoEndereco {height: 96px; padding-top: 16px; background: #00afc0; border-bottom: 3px solid #dfd720; color:#fff;}
.atendimento footer { margin-top: 60px;}
.mapBtn {background: url(../img/content/bgMap.png) 95% 12px no-repeat #109ba8; height: 75px; margin-bottom: -75px; z-index: 999;}
#toogleBusca {color: #0e575e; font-weight:700; line-height: 75px; font-size: 12px; text-transform: uppercase;}

/* MAPA RESPONSIVO */
.iframe-rwd  {position: relative;padding-bottom: 25%;padding-top: 30px;height: 0;overflow: hidden;}
.iframe-rwd iframe {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.map {width: 100%; /* height: 400px; overflow: hidden; */}

/* SOBRE */
.imgSobre { position: absolute; right: 0;}
.imgSobre figure { width: 100%;}
.imgSobre figure img { width: 100%; max-width: 100%;}

.servicosLista a{float:left; width:100%; color:#fff; text-transform: uppercase; background:#01aebe; font-size: 16px; padding: 28px 0 28px 20px; text-decoration:none; color:#fff; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; -ms-transition:all 0.5s ease; transition:all 0.5s ease;}
.servicosLista a:hover{ background:#23ada1;}

/* SERVICOS */

.accordion{ width:93%; margin:30px 0 30px 0; outline:none;}
.accordion img{ max-width:100%;}
.accordion .titulo {width:100%; height:50px; background: url(../img/content/arrow-down.png) no-repeat 92% 20px #23ada1; cursor:pointer; color:#cf3d31; -webkit-transition:background 0.5s ease-out; -moz-transition:background 0.5s ease-out; -o-transition:background 0.5s ease-out; -ms-transition:background 0.5s ease-out; margin:10px 0 0 0;}
.accordion .titulo:hover {background:url(../img/content/arrow-down.png) no-repeat 92% 23px #397763; color:#fff; filter:alpha(opacity=100); -moz-opacity:1; opacity:1;}
.accordion .titulo h2 {width:auto; margin:auto; text-decoration:none; font-size:18px; color:#fff; text-transform:uppercase; padding:15px 0 0 30px;}
.accordion .titulo h2:hover{color:#fff;}
.accordion .informacoes{ width:100%; background:#fff; margin:0 0 30px 0; border-bottom:1px solid #d9d9d9; border-left:1px solid #d9d9d9; border-right:1px solid #d9d9d9;}
.accordion .informacoes p{ margin:5%;}


/* FOOTER */
.cinza1 {background: #3f3f3f;}
.cinza2 {background: #353535;}
.cinza3 {background: #282828;}
footer {color:#d9d9d9;}
footer h4 {text-transform: uppercase; font-weight: 700; margin-top: 32px; color: #34a4a4; font-size: 12px;}
footer .footerTelefones strong { float: left; width: 100%; font-weight: normal;}
footer .footerTelefones span { font-size: 12px;}
footer .footerTelefones span span{ font-size: 16px; font-weight: 700;}
footer a.mailFooter {color: #d9d9d9;}
footer a.mailFooter:hover {color:#397f7a;text-decoration: none;}
footer cite {float:left; width: 55%; margin-top:40px; margin-bottom: 30px;font-style: italic; font-size: 12px; color: #8b8b8b;}
footer .brandFooter {float:left; margin-top: 24px; width: 107px; height: 48px; background: url(../img/base.png) left top repeat;}
footer nav ul { margin-left: 0; padding-left:0; list-style: none;}
footer nav ul li {float:left; font-size: 11px; font-weight: 700; margin-top:30px; margin-bottom: 35px; margin-right: 20px; list-style: none; text-transform: uppercase;}
footer nav ul li a {color:#fff;}
footer nav ul li a:hover {color:#397f7a;text-decoration: none;}

footer .midiasSociais { list-style: none; padding-left: 0; margin-left: 0;}
footer .midiasSociais li { list-style: none; float: left; margin-right: 12px; margin-top: 12px;}
footer .midiasSociais li a { float:left; width: 30px; height: 30px; background: url(../img/base.png) left top repeat #282828; cursor: pointer; -webkit-transition: 300ms;-moz-transition: 300ms;transition: 300ms; }
footer .midiasSociais li a:hover { background-color: #34a4a4;}
footer .midiasSociais li a.facebook { background-position: 0 -86px;}
footer .midiasSociais li a.googlePlus { background-position: -30px -86px;}

footer hr {border-top: 1px solid #282828; margin-top: 30px;}
footer .posicionaTop { position: relative; width: 100%; height: 44px; float: left; margin-bottom: 20px;}
footer .toTop {float:left; position: absolute; right:50%; margin-right: -44px; width: 44px; height: 44px; border:2px solid #282828; -webkit-border-radius: 4px;-moz-border-radius: 4px; border-radius: 4px; background: url(../img/base.png) left -116px no-repeat; -webkit-transition: 300ms;-moz-transition: 300ms;transition: 300ms;}
footer .toTop:hover {border:2px solid #34a4a4;background-color: #34a4a4; background-position: 0 -156px;}

footer .author {float:right; width: 67px; height: 95px;background: url(../img/base.png) -36px -110px no-repeat;}

/* GERAL */
.wFull {width: 100%;}
.bgBranco { background: #fff;}
.bgCinza { background: #f4f4f4;}
.bgCinzaEscuro { background: #eeeeee;}
.off {display: none; visibility: hidden;}

/* BOTÕES */
.btnGeral {display:table; padding: 16px 32px; text-transform:uppercase; font-size:12px;color: #fff; border:2px solid #fff; -webkit-border-radius: 4px;-moz-border-radius: 4px; border-radius: 4px;-webkit-transition: 300ms;-moz-transition: 300ms;transition: 300ms;}
.btnGeral:hover {color:#fff; background:#34a4a4;border:2px solid #34a4a4; text-decoration: none;}
.btnGeral.btnBranco {}

.btnGeral.btnVerde {border:2px solid #34a4a4; color:#34a4a4;} 
.btnGeral.btnVerde:hover {color:#fff;background:#34a4a4;}

.btnGeral.btnAmarelo {border:2px solid #efe70f; color:#efe70f;} 
.btnGeral.btnAmarelo:hover {color:#34a4a4;background:#efe70f;}

/* FORM */
.formulario form { width: 100%; float: left; margin:40px 0;}
.formulario form legend { display: none; visibility: hidden;}
.formulario form .form-group { position: relative;margin-bottom: 32px;}
.formulario form label { position:absolute; top:-21px;float:left; padding: 3px 12px; background: #909090;  text-transform: uppercase; color: #fff; font-weight: 400; font-size: 12px; }
.flexbox .formulario form label {padding-left: 0; padding-right: 16px;}
.flexbox .formulario form label:before {content: "";display: inline-block;vertical-align: middle;margin-bottom: -26px; margin-left: 4px; width: 0;height: 0; border-left: 5px solid transparent;border-right: 5px solid transparent;border-top: 5px solid #909090;}

button.btnGeral.btnVerde {float:right; background: transparent; margin-top: -15px;}
input.form-control, textarea.form-control { border: 2px solid #909090;}
input.form-control {height: 42px;}

.mensagem_contato { margin-top: -12px;}
.mensagem_contato p span{ float: left; padding: 10px; margin-bottom: 3px; color: #fff; background-color: #AC2B37; text-transform: uppercase; font-size: 11px; font-weight: 700; letter-spacing: 0.05em;}

.alertaSucesso {display: none; visibility: hidden; position: fixed; width: 280px; left:50%; top: 150px; margin-left: -160px; z-index: 999;-webkit-box-shadow: 4px 4px 0px 0px rgba(118, 118, 8, 0.10);-moz-box-shadow:    4px 4px 0px 0px rgba(118, 118, 8, 0.10);box-shadow:4px 4px 0px 0px rgba(118, 118, 8, 0.10);}
.alertaSucesso div {padding: 30px; background-color:#397f7a;}
.alertaSucesso p {color: #0e575e; text-align: center;}
.alertaSucesso p strong{ text-transform: uppercase;}
.alertaSucesso.active { display: block; visibility: visible;}

@media (max-width: 420px) {
	.navbar { position: absolute;}
	.navbar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand {margin-left:30px; }
	.row { margin: 0;}

	.headerSlide h1 { margin-top: 150px;}
	.boxHome article {height: 360px;}
	.imgSobre { position: static;}
	.wFull.camadas h3 { margin-top: 15px;}

	footer nav ul li { margin-right: 16px;}

	.listaContainer { margin: 0 15px;}
	.iframe-rwd  {padding-bottom: 45%;}

	footer cite {margin-top:30px;}
	footer .toTop { right: 0; margin-right: 0;}
	
	.accordion{ width:100%; margin:30px auto 30px auto;}
	.accordion .titulo{background: url(../img/content/arrow-down-p.png) no-repeat 96% 23px #23ada1;}
	.accordion .titulo:hover {background: url(../img/content/arrow-down-p.png) no-repeat 96% 23px #23ada1;}
	.accordion .titulo h2 { font-size:12px; padding:20px 0 0 8px; }
	.accordion .titulo h2:hover { font-size:12px; padding:20px 0 0 8px; background: url(../img/content/arrow-down-p.png) no-repeat 96% 23px #23ada1;}

	.atendimentoServ { float:none; width:80%; margin:20px auto 60px auto;}
	.atendimentoServ .btnGeral {  margin:20px auto 60px auto;}
}

@media (min-width: 421px) and (max-width: 767px) {
	.navbar { position: absolute;}
	.navbar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand {margin-left:30px; }
	.row { margin: 0;}

	.headerSlide h1 { margin-top: 150px;}
	.boxHome article {height: 300px;}
	.imgSobre { position: static;}
	.wFull.camadas h3 { margin-top: 15px;}

	footer nav ul li { margin-right: 16px;}

	.listaContainer { margin: 0 15px;}
	.iframe-rwd  {padding-bottom: 45%;}

	footer cite {margin-top:30px;}
	footer .toTop { right: 0; margin-right: 0;}
	
	.atendimentoServ { float:none; width:80%; margin:20px auto 60px auto;}
	.atendimentoServ .btnGeral {  margin:20px auto 60px auto;}
}

@media (min-width: 768px) and (max-width: 991px) {
	.headerSlide h1 { margin-top: 180px;}
	.boxHome article {height: 260px;}
	.imgSobre { position: static;}
	.accordion{ width:84.2%; margin:30px auto 30px auto;}
	.atendimentoServ { float:none; width:400px; margin:20px auto 60px auto; }
	.atendimentoServ .btnGeral {  margin:20px auto 60px 125px;}

}

@media (min-width: 992px) and (max-width: 1199px) {
	.boxHome article {height: 380px;}
}

@media (min-width: 1200px) {
}

@media (min-width: 1400px) {
	.imgSobre figure { width: 80%;}
}



