@font-face {
    font-family: 'BigNoodleTitling';
    src: url('fontes/BigNoodleTitling.eot');
    src: url('fontes/BigNoodleTitling.eot?#iefix') format('embedded-opentype'),
        url('fontes/BigNoodleTitling.woff2') format('woff2'),
        url('fontes/BigNoodleTitling.woff') format('woff'),
        url('fontes/BigNoodleTitling.ttf') format('truetype'),
        url('fontes/BigNoodleTitling.svg#BigNoodleTitling') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'BigNoodleTitling';
    src: url('fontes/BigNoodleTitling-Oblique.eot');
    src: url('fontes/BigNoodleTitling-Oblique.eot?#iefix') format('embedded-opentype'),
        url('fontes/BigNoodleTitling-Oblique.woff2') format('woff2'),
        url('fontes/BigNoodleTitling-Oblique.woff') format('woff'),
        url('fontes/BigNoodleTitling-Oblique.ttf') format('truetype'),
        url('fontes/BigNoodleTitling-Oblique.svg#BigNoodleTitling-Oblique') format('svg');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'Neue Haas Grotesk Display Pro';
    src: url('fontes/NeueHaasDisplay-Mediu.eot');
    src: url('fontes/NeueHaasDisplay-Mediu.eot?#iefix') format('embedded-opentype'),
        url('fontes/NeueHaasDisplay-Mediu.woff2') format('woff2'),
        url('fontes/NeueHaasDisplay-Mediu.woff') format('woff'),
        url('fontes/NeueHaasDisplay-Mediu.ttf') format('truetype'),
        url('fontes/NeueHaasDisplay-Mediu.svg#NeueHaasDisplay-Mediu') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Neue Haas Grotesk Display Pro';
    src: url('fontes/NeueHaasDisplay-Roman.eot');
    src: url('fontes/NeueHaasDisplay-Roman.eot?#iefix') format('embedded-opentype'),
        url('fontes/NeueHaasDisplay-Roman.woff2') format('woff2'),
        url('fontes/NeueHaasDisplay-Roman.woff') format('woff'),
        url('fontes/NeueHaasDisplay-Roman.ttf') format('truetype'),
        url('fontes/NeueHaasDisplay-Roman.svg#NeueHaasDisplay-Roman') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Neue Haas Grotesk Display Pro';
    src: url('fontes/NeueHaasDisplay-Bold.eot');
    src: url('fontes/NeueHaasDisplay-Bold.eot?#iefix') format('embedded-opentype'),
        url('fontes/NeueHaasDisplay-Bold.woff2') format('woff2'),
        url('fontes/NeueHaasDisplay-Bold.woff') format('woff'),
        url('fontes/NeueHaasDisplay-Bold.ttf') format('truetype'),
        url('fontes/NeueHaasDisplay-Bold.svg#NeueHaasDisplay-Bold') format('svg');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Neue Haas Grotesk Display Pro';
    src: url('fontes/NeueHaasDisplay-Thin.eot');
    src: url('fontes/NeueHaasDisplay-Thin.eot?#iefix') format('embedded-opentype'),
        url('fontes/NeueHaasDisplay-Thin.woff2') format('woff2'),
        url('fontes/NeueHaasDisplay-Thin.woff') format('woff'),
        url('fontes/NeueHaasDisplay-Thin.ttf') format('truetype'),
        url('fontes/NeueHaasDisplay-Thin.svg#NeueHaasDisplay-Thin') format('svg');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}
body{
background:#000;
}
ul{
margin:0;
padding:0;
}
ul li{
padding:0;
margin:0;
list-style: none;
}
img{
max-width: 100%;
height:auto;
border:0;
outline: 0;
}
button, input, a, select{
outline: 0 !important;
border:0;
text-decoration: none;
}
a{
text-decoration:none;
}
.js .anime {
transform: translate3D(0px, -90%, 0px);
}
.js .anime.anime-top{
transform: translate3D(0px, 80px, 0px);
opacity:0;
}
.js .anime.anime-bottom{
transform: translate3D(0px, -80px, 0px);
opacity: 0;
}
.js .anime-init.anime-top{
transform: translate3D(0px, 0px, 0px);
opacity:1;
}
.js .anime-init.anime-bottom{
transform: translate3D(0px, 0px, 0px);
opacity: 1;
}
.js .anime.anime-title{
opacity:0;
transform:translateX(-40%) !important;
}
.js .anime-init.anime-title{
opacity:1;
transform:translateX(-50%) !important;
}
.js .anime-init.anime-fade{
opacity:1 !important;
transition:6s all ease;
}
.js .anime.anime-fade{
opacity:0;
}
.m90{
transform: translate3D(0px, -90px, 0px) !important;
transition:2s all ease !important;
}
.m180{
transform: translate3D(0px, -180px, 0px) !important;
transition:2s all ease !important;
}
.m270{
transform: translate3D(0px, -270px, 0px) !important;
transition:2s all ease !important;
}
.m360{
transform: translate3D(0px, -360px, 0px) !important;
transition:2s all ease !important;
}
.m450{
transform: translate3D(0px, -450px, 0px) !important;
transition:2s all ease !important;
}
.fundo.m90{
transform: translate3D(0px, 0px, 0px) !important;
transition:2s all ease !important;
background-position: center bottom -430px;
}
.fundo.m180{
transform: translate3D(0px, 0px, 0px) !important;
transition:2s all ease !important;
background-position: center bottom -460px;
}
.fundo.m270{
transform: translate3D(0px, 0px, 0px) !important;
transition:2s all ease !important;
background-position: center bottom -490px;
}
.fundo.m360{
transform: translate3D(0px, 0px, 0px) !important;
transition:2s all ease !important;
background-position: center bottom -520px;
}
.fundo.m450{
transform: translate3D(0px, 0px, 0px) !important;
transition:2s all ease !important;
background-position: center bottom -550px;
}
.js .anime-init {
transform: translate3D(0px, 0px, 0px);
transition:2.5s all ease;
}
.js .anime-two.anime-init {
transform: translate3D(0px, 0px, 0px);
transition:2s all ease;
}
.js .anime-tres.anime-init {
transform: translate3D(0px, 0px, 0px);
transition:2.5s all ease;
}
.timeline{
display:flex;
flex-direction:column;
align-items:center;
text-align:center;
background:transparent linear-gradient(180deg, rgba(135, 139, 150, 0.20) 0%, rgba(0, 1, 3, 0.72) 54%, rgba(0, 0, 0, 0.72) 100%) 0% 0% no-repeat padding-box;
color:#fff;
overflow:hidden;
height:100vh;
justify-content:center;
position:absolute;
top:0;
left:0;
width:100%;
}
.time{
position:relative;
top:20%;
}
.time .ano{
height:95px;
position:relative;
}
.time .ano:after{
content:"";
width:2px;
height:55px;
bottom:0px;
background:#fff;
position:absolute;
left:50%;
transform:translatex(-50%);
}
.time .ano{
opacity:0.25;
}
.time .ano p{
opacity:0;
transition:2s all ease;
font-size: 23px;
line-height: 35px;
}
.time .ano p small{
display: block;
font-size:15px;
margin-top:-8px;
font-weight: 100;
}
.time .ano strong{
font-size:23px;
font-weight:600;
transition:2s all ease !important;
}
.time .ano.ativo{
opacity:1;
}
.time .ano.ativo:after{
display:none;
}
.time .ano.ativo p{
opacity:1;
margin-bottom:0;
}
.bt-next{
position:absolute;
right:20px;
top:50%;
transform:translatey(-50%);
}
.bt-last{
position:absolute;
left:20px;
top:50%;
transform:translatey(-50%);
}
.bt-pass{
display:none;
cursor:pointer;
width:50px;
height:50px;
}
.bt-pass.ativo{
display:block;
}
.grafico{
position: fixed;
bottom: 50px;
width: 1222px;
left: 50%;
transform: translatex(-50%) !important;
}
.grafico .linha{
font-size: 19px;
color: #fff;
position: relative;
margin-bottom: 35px;
}
.grafico .linha span{
display: block;
width: 50px;
text-align: center;
}
.grafico .linha.linha6{
margin-bottom: 0;
}
.grafico .linha:after{
content:"";
width:calc(100% - 50px);
left:50px;
background:rgb(255,255,255,.4);
height:1px;
top:50%;
transform:translatey(-50%);
position: absolute;
}
.grafico .traca{
width: 50px;
font-size: 19px;
color: #fff;
text-align: center;
position: relative;
}
.grafico .traca:before{
content:"";
width:1px;
left:50%;
background:rgb(255,255,255,.4);
height: 340px;
bottom: 42px;
transform:translatex(-50%);
position: absolute;
}
.grafico .traca:after{
content:"";
width:14px;
height:14px;
border-radius:50%;
background:#fff;
bottom:35px;
left:50%;
transform:translatex(-50%);
position: absolute;
}
.grafico .tracos{
width: 1180px;
display: flex;
justify-content: space-between;
padding-left: 100px;
}
.traca .ponto{
position:absolute;
width:6px;
height:6px;
background:#E75000;
border-radius: 50%;
left:50%;
transform:translatex(-50%);
top:35px;
z-index:3;
}
.traca1 .ponto{
top: -220px;
}
.traca2 .ponto{
top: -95px;
}
.traca3 .ponto{
top: -108px;
}
.traca4 .ponto{
top: -85px;
}
.traca5 .ponto{
top: -88px;
}
.traca6 .ponto{
top: -235px;
}
.traca .ponto:before{
content: "";
position: absolute;
border-top: 2px dotted #E75000;
}
.traca .ponto:after{
content:"235%";
color:#E75000;
font-weight:700;
font-size:17px;
position:absolute;
right:-50px;
top:-25px;
}
.traca6 .ponto:before{
width: 248px;
height: 2px;
top: 77px;
left: -225px;
transform: rotate(144.5deg);
}
.traca5 .ponto:before{
width: 205px;
height: 2px;
top: 3px;
left: -205px;
transform: rotate(-1deg);
}
.traca4 .ponto:before{
width: 208px;
height: 2px;
top: -9px;
left: -207px;
transform: rotate(6.4deg);
}
.traca3 .ponto:before{
width: 206px;
height: 2px;
top: 9px;
left: -206px;
transform: rotate(-3.7deg);
}
.traca2 .ponto:before{
width: 238px;
height: 2px;
top: -62px;
left: -222px;
transform: rotate(31deg);
}
.traca5 .ponto:after{
content:"113%";
}
.traca4 .ponto:after{
content:"103%";
}
.traca3 .ponto:after{
content:"132%";
}
.traca2 .ponto:after{
content:"129%";
}
.traca1 .ponto:after{
content:"213%";
}
.fundo{
background-image:url(imagens/bg_principal.jpg);
background-position: center bottom -400px;
background-size:cover;
background-repeat: no-repeat;
display: fixed;
left:0;
top:0;
width:100%;
height:100vh;
z-index: -1;
}
body{
font-family: 'Neue Haas Grotesk Display Pro';
font-weight:500;
}
.cabecalho{
position: fixed;
top: 0;
padding: 50px;
width: 100%;
max-width: 1900px;
z-index:3;
display: none;
}
.eliel img, .eliel h5, .eliel h6{
display: none;
}
.inicio{
position: fixed;
z-index: 4;
top: 20px;
left: 20px;
}
.inicio a svg{
width: 24px;
height:24px;
fill:#fff;
}
.inicio a:hover svg{
fill:#E75000;
}
.cabecalho.sticky{
background: rgba(0, 0, 0, 0.85);
padding: 20px 50px;
}
.perfil{
display: flex;
align-items: center;
}
.perfil .foto{
width: 90px;
margin-right: 15px;
}
.perfil .nome h3{
text-align: left;
font-size: 16px;
letter-spacing: 0px;
color: #FFFFFF;
margin-bottom: 0;
font-weight: normal;
}
.perfil .nome span{
font-size: 13px;
color: #fff;
font-weight: 500;
line-height: 13px;
}
.title{
display: flex;
align-items: center;
position: absolute;
top:200px;
left:50%;
transform:translateX(-50%);
width: 1440px;
max-width: 100%;
}
.title h2{
font-family: 'BigNoodleTitling';
letter-spacing: -4.29px;
color: #E75000;
font-size: 125px;
line-height: 1;
margin-bottom: 0;
}
.title img{
width:95px;
margin-right:20px;
}
.entrada{
width:100%;
height:100vh;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top:0;
left:0;
}
.entrada .logo{
max-width:480px;
}
.grupo .fundo{
background:transparent linear-gradient(180deg, #1D2B53 0%, #060911 100%) 0% 0% no-repeat padding-box;
}
.grupo .title {
width: 90%;
max-width: 100%;
justify-content: center;
border-bottom: 1px solid rgba(255, 255, 255, 0.7);
padding-bottom: 100px;
margin-bottom: 100px;
position: relative;
left: 0;
top: 0;
}
.content{
display: flex;
align-items: center;
justify-content: center;
position: absolute;
flex-direction: column;
top: 0;
left: 0;
width: 100%;
height: 100vh;
}
.content .itens{
display: block;
width: 1400px;
max-width: 100%;
}
.content .itens .item{
text-align: center;
}
.content .itens .item .icone{
height:34px;
margin: 0 auto 15px;
display: flex;
justify-content: center;
}
.content .itens .item p{
text-align: center;
font-size: 19px;
font-weight: 500;
letter-spacing: 0px;
color: #FFFFFF;
line-height: 24px;
min-height: 48px;
margin-bottom: 35px;
}
a.bt-mais{
display: flex;
align-items: center;
justify-content: center;
background: #181E29 0% 0% no-repeat padding-box;
border: 2px solid #F5F8FF;
border-radius: 23px;
height: 37px;
letter-spacing: -0.27px;
color: #fff;
width: 120px;
margin: auto;
font-size:15px;
}
a.bt-mais span{
display: flex;
align-items: center;
justify-content: center;
background: #fff;
border-radius: 50%;
width: 16px;
height: 16px;
margin-left: 10px;
color: #121212;
font-size: 16px;
font-weight: 400;
}
a.bt-mais:hover{
color: #fff;
background:#E75000;
}
.modal-open{
display: flex;
align-items: center;
justify-content: center;
background: rgba(0, 0, 0, 0.75);
animation-name: fadeInOpacity;
animation-iteration-count: 1;
animation-timing-function: ease-in;
animation-duration: 1s;
}
@keyframes fadeInOpacity {
    0% {
    opacity: 0;
    }
    100% {
    opacity: 1;
    }
}
.content-modal-item{
max-width: 1220px;
position: relative;
padding-top:45px;
}
.content-modal-item .image{
border-radius: 42px;
overflow: hidden;
}
.content-modal-item .bt-close-modal{
position: absolute;
top: 0;
left: 50%;
transform: translatex(-50%);
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
cursor:pointer;
}
.bt-close-modal svg{
width: 100%;
height: 100%;
}
.text-section h4{
text-align: left;
font-weight:500;
font-size:50px;
line-height: 60px;
letter-spacing: 0px;
color: #FFFFFF;
}
.title-br{
display: block;
text-align: center;
width: 90%;
border-bottom: 1px solid rgba(255, 255, 255, 0.7);
padding-bottom: 100px;
margin-bottom: 110px;
}
.title-br h2{
letter-spacing: 0px;
color: #FFFFFF;
font-size: 60px;
line-height: 1;
font-weight: 500;
}
.one .fundo{
background-image: url(imagens/bg_principal.jpg);
background-position: center bottom -700px;
background-size: cover;
background-repeat: no-repeat;
position: fixed;
left: -50%;
top: -50%;
width: 200%;
height: 200vh;
z-index: -1;
}
.fundo.anime-rotate{
transform: rotate(0deg) !important;   
}
.fundo.anime-init.anime-rotate{
transform: rotate(10deg) !important;   
}
.oneagrama{
width: 100%;
height: 100vh;
position: fixed;
left: 0;
top: 0;
background: linear-gradient(180deg, rgba(0, 0, 0, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
display: flex;
align-items: center;
justify-content: center;
}
.oneagrama .image{
max-width: 950px;
margin-top: 50px;
}
.tabela-row .fundo, .cases .fundo{
background: linear-gradient(180deg, rgba(0,0,0,1) 40%, rgba(13,76,167,1) 100%);
}
.tabela{
position: fixed;
width: 100%;
height: 100vh;
top: 0;
left: 0;
text-align: center;
overflow: hidden;
padding-top: 100px;
}
.tabela .image{
overflow: hidden;
}
.tabela.rola .image img{
transform: translate3D(0px, -50%, 0px);
transition:2s all ease !important;
}
.tabela.sobe .image img{
transform: translate3D(0px, 0, 0px);
transition:2s all ease !important;
}
.produtos .content .itens{
width: 900px;
max-width: 100%;
}
.produtos .oneagrama{
flex-direction: column;
}
.produtos-list{
display: flex;
align-items: flex-start;
justify-content: space-between;
width: 1180px;
max-width: 100%;
}
.infoproduto h3{
text-align: center;
letter-spacing: -0.72px;
color: #FFFFFF;
opacity: 1;
font-size: 24px;
margin: 10px 0 25px;
}
.produtos .title-infos h2{
font-size: 50px;
font-weight: 500;
color: #fff;
margin-bottom: 100px;
}
.page-produto.caio{
background:#1d1d1d;
background-image:url(https://i.ibb.co/ByWJGpr/bg-caio.png);
background-size:cover;
background-position: center top;
background-attachment: fixed;
}
.page-produto.mari{
background:#1d1d1d;
background-image:url(https://i.ibb.co/JBVH6bD/bg-mari.png);
background-size:cover;
background-position: center top;
background-attachment: fixed;
}
.page-produto.drew{
background:#1d1d1d;
background-image:url(https://i.ibb.co/MsvFc0D/bg-drew.png);
background-size:cover;
background-position: center top;
background-attachment: fixed;
}
.topo-info{
min-height:100vh;
position: relative;
display: flex;
justify-content: center;
width:100%;
flex-direction: column;
padding-top:70px;
}
.site-view{
display: flex;
align-items: center;
justify-content: space-between;
width: 1296px;
margin: auto;
flex-wrap: wrap;
}
.site-view h3.title-view{
justify-content: flex-start;
margin-bottom: 10px;
margin-left: 110px;
}
h3.title-view{
width:100%;
margin-bottom: 35px;
text-align: left;
font: normal normal normal 40px/44px BigNoodleTitling;
letter-spacing: 0px;
color: #FFFFFF;
display: flex;
align-items: center;
justify-content: space-between;
}
h3.title-view small{
text-align: left;
font-family: 'Neue Haas Grotesk Display Pro';
font-size:16px;
font-weight:500;
letter-spacing: 0px;
color: #FFFFFF;
opacity: 1;
}
.site-view .desktop{
width:80%;
}
.site-view .mobile{
width:20%;
}
.criativos{
margin-bottom: 100px;
}
.criativos .criativo{
padding-right:10px;
}
.criativos .slick-list{
padding-right:100px;
}
.img-bottom{
margin-bottom: 150px;
}
.cases .title {
border-bottom: 0;
padding-bottom: 0;
margin-bottom: 85px;
}
.sub-title{
font-size: 35px;
letter-spacing: 0px;
color: #FFFFFF;
font-weight: 500;
margin-bottom: 100px;
text-align: center;
line-height: 1.2;
}
.cases .content .itens .item .icone {
height: 90px;
margin-bottom: 20px;
display: flex;
align-items: center;
justify-content: center;
}
.cases .content .itens .item {
text-align: center;
}
.cases .content .itens.topi .item{
margin-bottom: 70px;
}
.case-sucesso{
background:#010006;
}
.case-sucesso .topo-info {
padding-top: 170px;
margin-bottom: 0px;
}
.case-sucesso .criativos .slick-list {
padding-right: 300px;
}
.historia .title{
width: 100%;
text-align: center;
justify-content: center;
margin-bottom: 100px;
position: relative;
top: 0;
left: 0;
}
.historia .fundo{
background-position: center bottom -550px;
}
.list-feito{
max-width: 1200px;
width: 100%;
display: flex;
justify-content: space-between;
}
.list-feito .feito{
width:25%;
text-align: center;
}
.feito .image{
width: 100%;
height: 105px;
margin-bottom: 20px;
display: flex;
justify-content: center;
}
.feito .image img{
width: auto;
max-height: 100%;
}
.feito p{
font-size: 26px;
letter-spacing: 0px;
color: #FFFFFF;
line-height: 31px;
}
.list-setores{
display: flex;
align-items: flex-start;
justify-content: space-between;
max-width: 100%;
width:1200px;
}
.list-setores .setor{
padding:0 10px;
}
.list-setores .setor .image{
margin-bottom: 20px;
}
.list-setores .setor p{
text-align: center;
font-size:20px;
font-weight:500;
line-height: 25px;
letter-spacing: 0px;
color: #FFFFFF;
}
.title-mini h2{
margin-bottom: 100px;
color: #fff;
font-size: 32px;
}
.logo-clientes{
max-width: 1200px;
width: 100%;
padding-top:50px;
}
.metabox{
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100vh;
}
.metabox img{
width:27px;
margin-bottom: 15px;
}
.metabox h2{
font-size: 120px;
letter-spacing: 0px;
color: #FFFFFF;
font-weight: 500;
margin-bottom: 0;
line-height: 1;
}
.metabox h3{
font-size: 60px;
letter-spacing: 0px;
color: #E75000;
text-transform: uppercase;
font-weight: 600;
}
.atributos .metabox img{
width:1100px;
max-width: 100%;
margin-bottom: 0;
}
.obrigado .fundo{
background-image:none;
background-color:#091126;
}
.logo-rodape{
position: fixed;
bottom: 30px;
width: 100%;
text-align: center;
}
.logo-rodape img{
max-width: 300px;
}
.metabox .eliel{
text-align: center;
}
.metabox .eliel img{
width: 209px;
}
.metabox .eliel h5{
letter-spacing: 0px;
color: #FFFFFF;
font-size: 17px;
font-weight: 500;
line-height: 1.2;
margin-bottom: 0;
}
.metabox .eliel h6{
color: #fff;
font-weight: 100;
font-size: 14px;
line-height: 22px;
margin-bottom: 15px;
}
.metabox .eliel h2{
font: normal normal normal 130px/130px BigNoodleTitling;
letter-spacing: -4.29px;
color: #E75000;
margin-bottom: 60px;
}
.desktop, .mobile{
position:relative;
}
.desktop .scroll-lp{
position: absolute;
top: 45px;
left: 149px;
width: 730px;
overflow-y: auto;
overflow-x: hidden;
height: 440px;
border-radius: 5px;
}
.mobile .scroll-lp-mobi{
position: absolute;
top: 37px;
width: 233px;
left: 13px;
overflow-y: auto;
overflow-x: hidden;
height: 476px;
border-radius:15px;
}
.nicescroll-rails{
opacity:0 !important;
}
.desktop .scroll-lp:before{
content: "";
width: 730px;
height: 510px;
position: fixed;
top: 11px;
left: 149px;
background: url(https://i.ibb.co/cg8431Z/brilho.png);
background-position: center top;
 }
.mobile .scroll-lp-mobi:before{
content: "";
width: 233px;
height: 527px;
position: fixed;
top: -12px;
left: 13px;
background: url(https://i.ibb.co/cbWVz2F/brilho-smart.png);
background-position: center top;
border-radius: 15px;
background-repeat: no-repeat;
}
.cabecalho .foto, .eliel img{
cursor:pointer;
}
.slick-dots{
display:flex;
align-items: center;
justify-content: center;
margin-top:20px;
}
.slick-dots li button{
font-size: 0;
border-radius: 50%;
background: #fff;
width: 10px;
height: 10px;
margin: 0 3px;
}
.slick-dots li.slick-active button{
width: 22px;
border-radius: 5px;
background: #E75000;
}
.produtos-list .capa{
display: flex;
justify-content: center;
}
.drew .mobile .scroll-lp-mobi{
border-radius: 20px 20px 15px 15px;
}
.mari .mobile .scroll-lp-mobi{
border-radius: 26px 26px 15px 15px;
}


@media(min-width:1000px){
.content .itens .slick-track{
width:100% !important;
display:flex;
justify-content: space-between;
}
.produtos-list .slick-track{
width:100% !important;
display:flex;
justify-content: space-between;
}
.content .itens .item{
text-align: center;
max-width: 15%;
min-width: 12%;
}
.cases .content .itens .item {
text-align: center;
max-width: 20%;
min-width: 20%;
}
}

@media(max-width:1600px){
.grafico{
width:1150px;
max-width: 100%;
}
.grafico .tracos {
width: 1100px;
}
.traca2 .ponto::before {
width: 220px;
height: 2px;
top: -48px;
left: -202px;
transform: rotate(28deg);
}
.traca3 .ponto::before {
width: 190px;
height: 2px;
top: 8px;
left: -190px;
transform: rotate(-3.3deg);
}
.traca4 .ponto::before {
width: 195px;
height: 2px;
top: -6px;
left: -190px;
transform: rotate(4.5deg);
}
.traca5 .ponto::before {
width: 190px;
height: 2px;
top: 4px;
left: -185px;
transform: rotate(-1.5deg);
}
.traca6 .ponto::before {
width: 225px;
height: 2px;
top: 55px;
left: -203px;
transform: rotate(150deg);
}
.fundo{
background-position: center bottom -350px;
}
.fundo.m90{
transform: translate3D(0px, 0px, 0px) !important;
transition:2s all ease !important;
background-position: center bottom -230px;
}
.fundo.m180{
transform: translate3D(0px, 0px, 0px) !important;
transition:2s all ease !important;
background-position: center bottom -260px;
}
.fundo.m270{
transform: translate3D(0px, 0px, 0px) !important;
transition:2s all ease !important;
background-position: center bottom -290px;
}
.fundo.m360{
transform: translate3D(0px, 0px, 0px) !important;
transition:2s all ease !important;
background-position: center bottom -320px;
}
.fundo.m450{
transform: translate3D(0px, 0px, 0px) !important;
transition:2s all ease !important;
background-position: center bottom -350px;
}
.one .fundo{
background-position: center bottom -500px;
}
.oneagrama .image{
max-width: 640px;
margin-top: 50px;
}
.time .ano strong {
font-size: 21px;
}
.time .ano p{
font-size:21px;
}
.time{
top:25%;
}
.grafico{
bottom:20px;
}
.title {
top: 120px;
width: 1100px;
max-width: 100%;
}
.title img {
width: 67px;
}
.title h2 {
font-size: 90px;
}
.tabela.rola .image img{
transform: translate3D(0px, -60%, 0px);
transition:2s all ease !important;
}
.topo-info{
padding-top:100px;
margin-bottom: 70px;
}
.historia .fundo {
background-position: center bottom -420px;
}
.tabela .image{
max-width: 700px;
margin: auto;
}
.tabela{
padding-top:120px;
}
.cabecalho{
padding:20px 50px;
}
.perfil .foto {
width: 80px;
}
.grafico .linha{
margin-bottom: 20px;
}
.grafico .traca::before{
height:270px;
}
.traca1 .ponto {
top: -175px;
}
.traca2 .ponto {
top: -75px;
}
.traca3 .ponto {
top: -86px;
}
.traca4 .ponto {
top: -71px;
}
.traca5 .ponto {
top: -76px;
}
.traca6 .ponto {
top: -185px;
}
.bt-pass{
width:40px;
height:40px;
}
.grupo .title, .title-br{
padding-bottom:80px;
margin-bottom: 80px;
}
.content .itens{
width:1200px;
}
.content .itens .item p {
font-size: 17px;
line-height: 21px;
min-height: 42px;
margin-bottom: 25px;
}
a.bt-mais {
height: 33px;
font-size: 15px;
}
.content-modal-item .image {
border-radius: 42px;
overflow: hidden;
max-width: 850px;
}
.text-section h4 {
font-size: 40px;
line-height: 50px;
}
.title-br h2{
font-size:45px;
}
.infoproduto .capa img{
width: 160px;
}
.infoproduto h3{
font-size:21px;
}
.produtos-list{
width:900px;
}
.produtos .title-infos h2 {
font-size: 40px;
margin-bottom: 80px;
}
.site-view{
width:1050px;
}
.desktop .scroll-lp {
position: absolute;
top: 35px;
left: 124px;
width: 585px;
height: 355px;
}
.desktop .scroll-lp::before {
width: 586px;
height: 390px;
top: 1px;
left: 124px;
}
.mobile .scroll-lp-mobi {
top: 30px;
width: 190px;
left: 10px;
height: 401px;
}
.mobile .scroll-lp-mobi::before {
content: "";
width: 191px;
height: 449px;
top: -18px;
left: 10px;
}
.cases .title {
padding-bottom: 0 !important;
margin-bottom: 80px !important;
}
.sub-title {
font-size: 28px;
margin-bottom: 70px;
}
.cases .content .itens .item .icone {
height: 55px;
}
.cases .content .itens .item .icone img{
width:auto;
max-height:100%;
max-width: 200px;
}
.case-sucesso .topo-info {
padding-top: 130px;
max-width: 1100px;
margin: auto;
}
.feito .image {
width: 100%;
height: 65px;
margin-bottom: 20px;
}
.feito p {
font-size: 22px;
line-height: 28px;
}
.list-feito {
max-width: 1000px;
}
.historia .title, .title-mini h2{
margin-bottom: 70px;
}
.list-setores .setor .image {
margin: 0 auto 15px;
max-width: 120px;
}
.list-setores .setor p{
font-size:18px;
}
.list-setores{
width:1050px;
}
.logo-clientes {
max-width: 1050px;
padding-top:20px;
}
.metabox img {
width: 23px;
}
.metabox h2 {
font-size: 95px;
}
.metabox h3 {
font-size: 40px;
}
.atributos .metabox img {
width: 900px;
}
.metabox .eliel img {
width: 170px;
}
.metabox .eliel h2 {
font: normal normal normal 110px/110px BigNoodleTitling;
}
.logo-rodape img {
max-width: 230px;
}
.entrada .logo {
max-width: 400px;
}

}

@media(min-height:820px){
    .oneagrama .image {
        max-width: 730px;
    }
}

@media(max-width:998px){
.fundo {
background-position: center bottom 0px;
}
.bt-pass {
width: 35px;
height: 35px;
margin-top: 50px;
}
.bt-next{
right:10px;
}
.bt-last{
left:10px;
}
.cabecalho {
padding: 20px 20px;
background: rgba(0, 0, 0, 0.8);
}
.perfil .foto {
width: 70px;
}
.time .ano p {
font-size: 18px;
line-height: 1.2;
padding: 0 30px;
position: relative;
}
.time {
top: 38%;
}
.title {
top: 140px;
justify-content: center;
z-index:3;
}
.title img {
width: 57px;
margin-right: 10px;
}
.title h2 {
font-size: 78px;
}
.time .ano {
opacity: 0.15;
}
.fundo.m90{
transform: translate3D(0px, 0px, 0px) !important;
transition:2s all ease !important;
background-position: center bottom 0px;
}
.fundo.m180{
transform: translate3D(0px, 0px, 0px) !important;
transition:2s all ease !important;
background-position: center bottom 0px;
}
.fundo.m270{
transform: translate3D(0px, 0px, 0px) !important;
transition:2s all ease !important;
background-position: center bottom 0px;
}
.fundo.m360{
transform: translate3D(0px, 0px, 0px) !important;
transition:2s all ease !important;
background-position: center bottom 0px;
}
.fundo.m450{
transform: translate3D(0px, 0px, 0px) !important;
transition:2s all ease !important;
background-position: center bottom 0px;
}
.time .ano p small {
font-size: 14px;
margin-top: 0;
}
.time .ano {
height: 115px;
}
.m90{
transform: translate3D(0px, -115px, 0px) !important;
transition:2s all ease !important;
}
.m180{
transform: translate3D(0px, -230px, 0px) !important;
transition:2s all ease !important;
}
.m270{
transform: translate3D(0px, -345px, 0px) !important;
transition:2s all ease !important;
}
.m360{
transform: translate3D(0px, -460px, 0px) !important;
transition:2s all ease !important;
}
.m450{
transform: translate3D(0px, -575px, 0px) !important;
transition:2s all ease !important;
}
.ano h5{
color:#E75000;
font-weight: 700;
font-size: 18px;
margin-top: 10px;
opacity: 0;
}
.ano.ativo h5{
opacity: 1;
}
.ano h5 svg{
fill:#E75000;
margin-right:6px;
}
.entrada .logo {
max-width: 100%;
width: 300px;
}
.grupo .title, .title-br {
padding-bottom: 50px;
margin-bottom: 50px;
margin-top: 80px;
}
.text-section h4 {
font-size: 32px;
line-height: 40px;
padding: 0 50px;
text-align: center;
}
.title-br h2 {
font-size: 35px;
}
.one .fundo {
background-position: center bottom 0px;
}
.tabela.rola .image img {
transform: translate3D(0px, -30%, 0px);
}
.cases .content .itens.topi .item {
margin-bottom: 0px;
}
.cases .content .itens.topi{
margin-bottom: 50px;
}
.historia .fundo {
background-position: center bottom -80px;
}
.historia .title h2 {
font-size: 67px;
letter-spacing: -3px;
}
.list-setores .setor .image {
margin: 0 auto 15px;
max-width: 140px;
}
.list-setores .setor p {
font-size: 22px;
}
.historia .title, .title-mini h2 {
margin-bottom: 70px;
text-align: center;
font-size: 28px;
}
.metabox img {
width: 20px;
}
.metabox h2 {
font-size: 85px;
}
.metabox h3 {
font-size: 35px;
text-align: center;
line-height: 1.1;
}
.metabox .eliel h2 {
font: normal normal normal 90px/90px BigNoodleTitling;
}
.logo-clientes {
padding: 0 30px;
}
.metabox{
padding:0 30px;
}
h3.title-view{
flex-wrap: wrap;
}
h3.title-view small{
display: block;
width:100%;
}
.produtos .title-infos h2 {
font-size: 35px;
margin-bottom: 60px;
text-align: center;
}
.produtos .fundo {
background-position: center bottom -80px;
}
.site-view {
width: 380px;
margin: auto;
}
.site-view .desktop, .site-view .mobile {
width: 100%;
}
.site-view h3.title-view {
margin-left: 0;
margin-top: 30px;
}
.desktop .scroll-lp {
position: absolute;
top: 13px;
left: 55px;
width: 267px;
height: 168px;
}
.desktop .scroll-lp::before {
width: 267px;
height: 202px;
top: -20px;
left: 56px;
}
.site-view .mobile{
max-width: 230px;
margin: 40px auto 0;
}
.mobile .scroll-lp-mobi {
top: 33px;
width: 208px;
left: 11px;
height: 426px;
}
.mobile .scroll-lp-mobi::before {
content: "";
width: 208px;
height: 476px;
top: -15px;
left: 12px;
}
.cabecalho.sticky {
padding: 20px 20px;
}
h3.title-view {
font: normal normal normal 35px/40px BigNoodleTitling;
}
.content-modal-item .image {
border-radius: 25px;
overflow: hidden;
max-width: 95%;
margin: auto;
}
.modal{
min-height:100vh;
height:auto;
padding: 40px 0 70px;
position: absolute;
}



}