html, body{
margin:0 !important;
padding:0 !important;
font-family: 'Barlow', sans-serif !important;
width: 100%;
max-width: 100%;
height: 100%;
min-height: 100vh;
background:#FFF !important;
color:#414141;
}
a{
text-decoration: none;
transition:all 0.2s linear;
}
ul{
margin:0 !important;
padding:0 !important;
}
ul li{
padding:0;
margin:0;
list-style: none;
}
img{
max-width: 100%;
height:auto;
border:0;
outline: 0;
}
button, input, a, select, textarea{
outline: 0 !important;
border:0;
text-decoration: none;
transition:all 0.2s linear;
}
main{
overflow: hidden;
}
.container{
max-width:1200px !important;
width:100% !important;
position:relative;
z-index:3;
}
#topo{
position:relative;
height:100vh;
display: flex;
align-items: center;
background-color:#fff;
padding:40px 0 60px;
}
#topo .image-top{
width:50%;
height:100%;
position: absolute;
right:0;
top:0;
}
#topo .image-top img{
width:100%;
height:100%;
object-fit:cover;
}
.scroll-down{
position: absolute;
bottom:12px;
left:calc(50% + 30px);
transform:translatex(-50%);
z-index:6;
}
.scroll-down .mouse{
width: 30px;
height: 60px;
border: 2px solid #fff;
border-radius: 18px;
position: relative;
margin: 0 auto 10px;
}
.scroll-down .mouse i{
position: absolute;
top: 0;
left: 50%;
transform: translatex(-50%);
color:#FFF;
font-size: 18px;
opacity: 1;
animation: mouse 1.7s infinite;
display: block;
}
@keyframes mouse{
  from{
    opacity:1;
    top:-0px;
  }
    to{
    opacity:0.1;
    top:35px;
  }
}
@keyframes slideInTop {
  from {
    transform: translateY(-200px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes slideInBottom {
  from {
    transform: translateY(200px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes slideInLeft {
  from {
    transform: translateX(-200px);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes slideInRight {
  from {
    transform: translateX(200px);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}
.animate{opacity:0;}
.animate-from-left.visible {
animation: slideInLeft 2s forwards;
}
.animate-from-left-1.visible {
animation: slideInLeft 2.5s forwards;
}
.animate-from-left-2.visible {
animation: slideInLeft 3s forwards;
}
.animate-from-top {
animation: slideInTop 2s forwards;
}
.animate-from-bottom.visible {
animation: slideInBottom 2s forwards;
}
.animate-from-right.visible {
animation: slideInRight 2s forwards;
}
main{
overflow:hidden;
}
.content-topo .logo{
max-width: 180px;
margin: 0 0 30px;
}
.content-topo h1{
text-align: left;
font: normal normal 800 44px/54px Barlow;
letter-spacing: 0px;
color: #0052A2;
text-transform: uppercase;
position: relative;
margin:0 0 20px;
padding:0 0 20px;
}
.content-topo h1 span{
display: block;
color: #0292D7;
font-weight: 600;
}
.text-after{
position: relative;
padding-bottom: 20px;
margin-bottom: 20px;
}
.text-after:after{
content:"";
width:50px;
height:3px;
background: linear-gradient(90deg, rgba(2,146,215,1) 60%, rgba(211,211,211,1) 60%);
position: absolute;
left: 0;
bottom:0;
}
.text-after.after-center:after{
left: 50%;
transform:translatex(-50%);
}
.content-topo p{
text-align: left;
font: normal normal normal 17px/26px Barlow;
letter-spacing: 0px;
color: #414141;
max-width: 530px;
margin:0 0 40px;
}
a.btn-acao{
background: linear-gradient(90deg, rgba(2,146,215,1) 30%, rgba(0,82,162,1) 70%);
width: 280px;
height: 50px;
border-radius: 40px;
text-decoration: none;
transition: all .3s linear;
position: relative;
font: normal normal bold 18px/30px Barlow;
letter-spacing: 0px;
color: #FFF;
text-transform: uppercase;
padding-right: 30px;
box-shadow: 0px 10px 20px rgba(0, 82, 162, 0.4);
}
a.btn-acao span{
width: 40px;
height: 40px;
background: #fff;
border-radius: 50%;
position: absolute;
top: 5px;
right: 5px;
color: #0052a2;
font-size: 29px;
display: flex;
align-items: center;
justify-content: center;
}
a.btn-acao:hover{
background: linear-gradient(-90deg, rgba(2,146,215,1) 0%, rgba(0,82,162,1) 100%);
box-shadow: 0px 10px 20px rgba(2,146,215, 0.4);
}
#servicos{
position: relative;
background:#F4F4F4;
padding:60px 0;
}
#servicos h2{
text-align: center;
font: normal normal 800 42px/52px Barlow;
letter-spacing: 0px;
color: #0052A2;
text-transform: uppercase;
position: relative;
}
#servicos h2 span{
color: #0292D7;
font-weight: 600;
}
.servicos{
padding:40px 0 60px;
}
.servicos .servico{
width:22%;
}
.servicos .servico .content-servico{
border:1px solid #0292D7;
border-radius: 18px;
background:#fff;
padding:30px 40px 50px;
position: relative;
height:100%;
}
.servicos .servico .content-servico .icone{
width:100%;
height:60px;
margin-bottom: 20px;
}
.servicos .servico .content-servico .icone img{
width:auto;
height:100%;
}
.servicos .servico .content-servico h3{
text-align: left;
font: normal normal bold 17px/24px Barlow;
letter-spacing: 0px;
color: #0292D7;
text-transform: uppercase;
margin:0 0 30px;
}
.servicos .servico .content-servico p{
text-align: left;
font: normal normal normal 17px/26px Barlow;
letter-spacing: 0px;
color: #414141;
margin:0;
}
.servicos .servico .content-servico:after{
content:"";
width:50px;
height:3px;
background: linear-gradient(90deg, rgba(2,146,215,1) 60%, rgba(211,211,211,1) 60%);
position: absolute;
left: 50%;
bottom:20px;
transform:translatex(-50%);
}
#sobre{
background:#fff;
padding:60px 0;
position: relative;
}
#sobre h2.text-after{
text-align: left;
font: normal normal 600 42px/52px Barlow;
letter-spacing: 0px;
color: #0292D7;
text-transform: uppercase;
position: relative;
padding:0 20px 20px;
}
#sobre h2.text-after:after{
left:20px;
}
.box-sobre{
border: 1px solid #0292D7;
border-radius: 20px;
max-width: 1130px;
margin: 0 auto 50px;
}
.box-sobre .image{
width:430px;
max-width: 100%;
}
.box-sobre .texto{
width:calc(100% - 430px);
padding: 40px 40px 0;
}
.box-sobre .texto img{
max-width:90%;
}
footer{
background: linear-gradient(90deg, rgba(2,146,215,1) 30%, rgba(0,82,162,1) 70%);
padding:30px 0 20px;
}
.content-footer .logo-rodape{
text-align: center;
margin:0 auto 20px;
max-width: 170px;
}
.content-footer p{
text-align: center;
font-size: 15px;
color:#fff;
line-height: 28px;
}
.content-footer p a{
text-decoration: none;
font-weight: 600;
color:#fff;
transition: all .3s linear;
}
.content-footer p a:hover{
color:#f4f4f4;
}
.copyright{
text-align: center;
font-size: 14px;
color:#fff;
}
.copyright strong{
display: block;
}

@media(max-width:1600px){
.container {
  max-width: 1100px !important;
  width: 100% !important;
  position: relative;
  z-index: 3;
}
.content-topo .logo {
  max-width: 160px;
  margin: 0 0 20px;
}
.content-topo h1 {
  text-align: left;
  font: normal normal 800 38px/44px Barlow;
}
.content-topo p {
  text-align: left;
  font: normal normal normal 16px/24px Barlow;
  max-width: 480px;
  margin: 0 0 30px;
}
a.btn-acao {
  width: 260px;
  height: 46px;
  font: normal normal bold 16px/30px Barlow;
}
a.btn-acao span {
  width: 36px;
  height: 36px;
  font-size: 26px;
}
#servicos h2 {
  text-align: center;
  font: normal normal 800 36px/46px Barlow;
}
.servicos .servico .content-servico {
  padding: 30px 35px 50px;
}
.servicos .servico .content-servico .icone {
  width: 100%;
  height: 52px;
  margin-bottom: 20px;
}
.servicos .servico .content-servico h3 {
  text-align: left;
  font: normal normal bold 16px/24px Barlow;
  margin: 0 0 20px;
}
.servicos .servico .content-servico p {
  text-align: left;
  font: normal normal normal 16px/24px Barlow;
}
.box-sobre .image {
  width: 360px;
  max-width: 100%;
}
#sobre h2.text-after {
  text-align: left;
  font: normal normal 600 36px/46px Barlow;
}
.box-sobre .texto {
  width: calc(100% - 360px);
}
.box-sobre .texto img {
  max-width: 100%;
}
.box-sobre {
  max-width: 940px;
}
.box-sobre.box-parceiros .texto .logos  img{
max-width: 90%;
margin-top:20px;
}
.content-footer p {
  text-align: center;
  font-size: 14px;
  color: #fff;
  line-height: 24px;
}
.copyright {
  text-align: center;
  font-size: 13px;
  color: #fff;
}
.logo-rodape img{
max-width: 100px;
}

}
@media(max-width:992px){
#topo .image-top{
display:none;
}
.container{
padding: 0 25px !important;
}
.content-topo .logo {
  max-width: 150px;
  margin: 0 0 20px;
}
.content-topo h1 {
  text-align: left;
  font: normal normal 800 28px/36px Barlow;
}
#topo {
  padding: 40px 0 100px;
}
.scroll-down .mouse{
border-color:#0052a2;
}
.scroll-down .mouse i{
color:#0052a2;
}
.scroll-down {
  position: absolute;
  bottom: 12px;
  left: 50%;
  transform: translatex(-50%);
  z-index: 6;
}
#servicos {
  padding: 40px 0;
}
#servicos h2 {
  text-align: center;
  font: normal normal 800 28px/40px Barlow;
}
.servicos .servico {
  width: 100%;
  max-width: 320px;
  margin: 0 auto 20px;
}
.servicos {
  padding: 30px 0 30px;
}
.box-sobre.box-investimento{
flex-direction:column-reverse;
}
.box-sobre .texto {
  width: 100%;
  padding: 30px 15px;
}
#sobre h2.text-after {
  text-align: left;
  font: normal normal 600 28px/38px Barlow;
}
#sobre h2.text-after {
  padding: 0 5px 20px;
}
#sobre h2.text-after:after{
left:5px;
}
.box-sobre .image {
  width: 100%;
  max-width: 100%;
  height: 200px;
}
.box-sobre .image img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 20px;
}
.box-sobre.box-parceiros .texto .logos img {
  max-width: 100%;
  margin-top: 0;
}



}