@font-face{

	src: url(../fonts/TrajanPro-Regular.otf) format('opentype');
	font-family: 'Trajan Pro';

}

@font-face{

	src: url(../fonts/TrajanPro-Bold.otf) format('opentype');		
	font-family: 'Trajan Pro';
	font-weight: bold;

}

@font-face{

	src: url(../fonts/HelveticaLTStd-Light.otf) format('opentype');
	font-family: 'Helvetica';

}

html, body{margin: 0; font-family: 'Helvetica';}
body{position: relative;}
body:not(.build){pointer-events: none; user-select: none;}

::selection{background-color: #790000; color: #fff;}

h1, h2{font-family: 'Trajan Pro'; margin: 0; font-size: 4em; font-weight: normal; color: #58595b;}
h3{display: inline-block; margin: 0; color: #790000; transform: translate(-10px, -10px); opacity: 0; transition: all .5s ease;}
.build h3{transform: translate(0, 0); opacity: 1; transition: all .5s ease .5s;}

p, address{font-size: 1.2em; line-height: 1.7em; color: #58595b;}
img{max-width: 100%; user-select: none; vertical-align: bottom;}
img.responsiveOnly{display: none;}

/* Multi Purpose */

h1:not(.boxed){transform: translate(-10px, -10px); opacity: 0; transition: all .5s ease .5s;}
.build h1:not(.boxed){transform: translate(0, 0); opacity: 1;}

h1.boxed{padding: 20px 0; position: relative; height: .9em; margin-bottom: 30px; font-size: 2.7em; font-weight: bold; color: transparent; text-indent: -10px; line-height: calc(1.2em - 10px); transition: all .5s ease .5s;}
h1.boxed.overlap:before{content: ''; position: absolute; top: 0; bottom: 0; left: -50px; width: 0; border: 1px solid #fff; box-sizing: border-box; pointer-events: none; opacity: 0; transition: all .5s ease;}
h1.boxed:after{content: ''; position: absolute; width: 0; height: 100%; left: -50px; top: 0; border: 1px solid #58595b; pointer-events: none; opacity: 0; box-sizing: border-box; transition: all .5s ease;}
h1.boxed.overlap:after{border-right: 0;}
.build h1.boxed{color: #58595b; text-indent: 0; line-height: 1.2em;}
.build h1.boxed.overlap:before{opacity: 1; width: 135%;}
.build h1.boxed:after{opacity: 1; width: 150%;}
.build h1.boxed.overlap:after{width: calc(100% + 100px);}

body p, address{transform: translate(50px, 50px); opacity: 0; transition: all .5s ease;}
.build p, .build address{transform: translate(0); opacity: 1; transition: all .5s ease .5s;}

.build h1.white.boxed, p.white, h1:not(.boxed).white{color: #fff;}
h1.white.boxed:after{width: 100%; border-color: #fff;}

.logo{transform: translateY(-5%); opacity: 0; transition: all .5s ease;}
.build .logo{transform: translateY(0); opacity: 1;}

#preloader{display: none;}

.dots{position: absolute; z-index: 1;}
.dots span{display: inline-block; margin-right: 10px; width: 5px; height: 5px; background-color: #fff; border-radius: 50%; opacity: 0; transform: translateY(-20px); transition: all .5s ease;}
.dots.dark span{background-color: #58595b;}
.dots span:nth-child(2){transition-delay: .1s;}
.dots span:nth-child(3){transition-delay: .2s;}
.dots span:nth-child(4){transition-delay: .3s;}
.dots span:nth-child(5){transition-delay: .4s;}
.dots span:nth-child(6){transition-delay: .5s;}
.build .dots span{transform: translateY(0); opacity: 1;}

.bottomBar{position: absolute; width: 0; bottom: 0; left: 0; height: 50px; background-color: #790000; transition: all .5s ease;}
.build .bottomBar{width: 100%;}

/* Floating Header */

header.floating{position: absolute; box-sizing: border-box; user-select: none; pointer-events: none; z-index: 5;}
header.floating .logo{pointer-events: all; width: fit-content; width: -webkit-fit-content; width: -moz-fit-content;}
header.floating .logo a{text-decoration: none;}
header.floating .logo a span{display: block; text-align: right; text-decoration: none !important; text-transform: uppercase; color: #780e00; letter-spacing: .4em; margin: 10px -.4em 0 0; text-align: center; font-weight: bold;}
header.floating .menuTrigger{width: 0; height: 50px; cursor: pointer; opacity: 0; transition: all .5s ease; pointer-events: all;}
.build header.floating .menuTrigger{width: fit-content; opacity: 1;}
header.floating .menuTrigger:before,
header.floating .menuTrigger:after{border: 1px solid #58595b; box-sizing: border-box; transition: opacity 0s linear .5s, background-color .5s ease, margin .5s ease .5s, transform .5s ease;}
header.floating .menuTrigger:hover:before,
header.floating .menuTrigger:hover:after,
header.floating .menuTrigger.close:before,
header.floating .menuTrigger.close:after{background-color: #58595b;}
header.floating .menuTrigger.close:before,
header.floating .menuTrigger.close:after,
header.floating .menuTrigger.close span{transition: opacity 0s linear .5s, background-color .5s ease, margin .5s ease, transform .5s ease .5s;}
header.floating .menuTrigger:before,
header.floating .menuTrigger:after{content: ''; display: block; height: 10px;}
header.floating .menuTrigger span{display: block; margin: 10px 0; color: #58595b; text-transform: uppercase; text-align: center; letter-spacing: 0.4em; margin-right: -0.4em; transition: all .5s ease .5s;}
header.floating .menuTrigger.white span{color: #fff;}
.build header.floating .menuTrigger.close span{margin: -.9em -.4em -.9em 0; opacity: 0;}
.build header.floating .menuTrigger.close:before{margin-top: 1.8em; transform: rotate(-45deg);}
.build header.floating .menuTrigger.close:after{transform: rotate(45deg);}
header.floating nav{position: absolute; text-align: right; overflow: hidden; pointer-events: none; z-index: 1;}
header.floating nav.open{pointer-events: all;} 
header.floating nav > *{display: block; white-space: nowrap; text-decoration: none; background-color: #58595b; color: rgba(255, 255, 255, 0); font-size: 1.1em; padding: 10px 30px; margin-bottom: 10px; transform: translateX(calc(100% + 1px)); transition: transform .5s ease .1s, color .3s ease; cursor: pointer;}
.build header.floating nav.open  > *{transform: translateX(0); color: #fff; transition: transform .5s ease, color .3s ease .1s;}
header.floating nav > *:nth-child(2){transition: transform .5s ease .2s, color .3s ease .1s;}
header.floating nav > *:nth-child(3){transition: transform .5s ease .3s, color .3s ease .2s;}
header.floating nav > *:nth-child(4){transition: transform .5s ease .4s, color .3s ease .3s;}
header.floating nav > *:nth-child(5){transition: transform .5s ease .5s, color .3s ease .4s;}
header.floating nav > *:nth-child(6){transition: transform .5s ease .6s, color .3s ease .5s;}
header.floating nav > *:nth-child(7){transition: transform .5s ease .7s, color .3s ease .6s;}
header.floating nav.open > *:nth-child(2){transition: color .3s ease .2s, transform .5s ease .1s;}
header.floating nav.open > *:nth-child(3){transition: color .3s ease .3s, transform .5s ease .2s;}
header.floating nav.open > *:nth-child(4){transition: color .3s ease .4s, transform .5s ease .3s;}
header.floating nav.open > *:nth-child(5){transition: color .3s ease .5s, transform .5s ease .4s;}
header.floating nav.open > *:nth-child(6){transition: color .3s ease .6s, transform .5s ease .5s;}
header.floating nav.open > *:nth-child(7){transition: color .3s ease .7s, transform .5s ease .6s;}
header.floating nav .dropdownHolder{padding: 0;}
header.floating nav .dropdownHolder .tag{padding: 10px 30px; cursor: pointer;}
header.floating nav .dropdownHolder .dropdown{max-width: 180px; white-space: initial; margin-left: auto;}
header.floating nav .dropdownHolder .dropdown a{display: block; color: inherit; text-decoration: inherit; font-size: 0; padding: 0; transform: translateX(100%); transition: font-size .3s ease .5s, padding .3s ease .5s, transform .3s ease;}
header.floating nav .dropdownHolder:hover .dropdown a{font-size: 0.9em; padding: 10px 30px; transform: translateX(0); transition: font-size .3s ease, padding .3s ease, transform .3s ease .5s;}
header.floating nav .dropdownHolder .dropdown a:nth-child(2){transition: font-size .3s ease .6s, padding .3s ease .6s, transform .3s ease .1s;}
header.floating nav .dropdownHolder .dropdown a:nth-child(3){transition: font-size .3s ease .76s, padding .3s ease .76s, transform .3s ease .2s;}
header.floating nav .dropdownHolder:hover .dropdown a:nth-child(2){transition: font-size .3s ease .1s, padding .3s ease .1s, transform .3s ease .6s;}
header.floating nav .dropdownHolder:hover .dropdown a:nth-child(3){transition: font-size .3s ease .2s, padding .3s ease .2s, transform .3s ease .7s;}
header.floating nav a.active{background-color: #790000;}

header.floating.top{left: 0; top: 0; width: 100%; padding: 50px 10vw;}

header.floating.leftMain .menuTrigger{position: absolute; top: calc(50% - 25px); right: 10vw;}
header.floating.leftMain nav{right: 10vw; top: calc(50% + 55px);}

header.floating.rightMain .logo{width: fit-content; width: -webkit-fit-content; width: -moz-fit-content; margin-left: auto;}
header.floating.rightMain .menuTrigger{position: absolute; top: calc(50% - 25px); left: 10vw;}
header.floating.rightMain nav{left: 10vw; top: calc(50% + 55px);}
header.floating.rightMain nav > *{transform: translateX(calc(-100% - 1px)); text-align: left;}
.build header.floating.rightMain nav.open > *{transform: translateX(0);}
header.floating.rightMain nav .dropdownHolder .dropdown a{transform: translateX(-100%);}
header.floating.rightMain nav .dropdownHolder:hover .dropdown a{transform: translateX(0);}

header.floating .menuTrigger.nonAbsolute{position: initial; transition: all .5s ease .5s;}
header.floating .menuTrigger.nonAbsolute.close{padding-top: 10px; transition: all .5s ease;}
header.floating .menuTrigger.nonAbsolute + nav{position: initial;}

header.floating nav.white > *{background-color: #fff; color: rgba(88, 89, 91, 0); font-weight: bold;}
.build header.floating nav.white.open > *{color: #58595b;}
header.floating .white.menuTrigger:before,
header.floating .white.menuTrigger:after{border-color: #fff;}
header.floating .white.menuTrigger:hover:before,
header.floating .white.menuTrigger:hover:after,
header.floating .white.menuTrigger.close:before,
header.floating .white.menuTrigger.close:after{background-color: #fff;}

/* Slider */

.slider{width: 100%; overflow: hidden; position: relative; flex: 0 1 auto; transform: translateY(-5%); opacity: 0; transition: all .5s ease;}
.build .slider{transform: translateY(0); opacity: 1;}
.slider .sliderMat:before{content: ''; background-color: #790000; position: absolute; top: 0; width: 0; height: 100%; z-index: 1; transition: width .4s ease;}
.slider.left .sliderMat:before{left: 0; width: 100%;}
.slider.right .sliderMat:before{right: 0; width: 100%;}
.slider .sliderMat .sliderRow{position: absolute; top: 0; left: -100%; width: 100%; transition: all .5s ease .4s;}
.slider .sliderMat .sliderRow.active{left: 0; z-index: 2;}
.slider .sliderMat .sliderRow.active ~ .sliderRow{left: 100%;}
.slider .controls{position: absolute; top: 50%; left: 0; padding: 0; opacity: 0; width: 100%; transform: translateY(-50%); pointer-events: none; box-sizing: border-box; transition: all .5s ease; z-index: 2;}
.slider:hover .controls{opacity: 1; padding: 0 5%;}
.slider .controls div{position: relative; width: 50px; height: 50px; border: 2px solid #fff; float: left; cursor: pointer; pointer-events: all;}
.slider .controls div[data-slide="right"]{float: right; transform: rotate(180deg);}
.slider .controls div:before{content: ''; position: absolute; top: 50%; left: 12.5px; width: 20px; height: 20px; border-left: 5px solid #fff; border-top: 5px solid #fff; transform-origin: top left; transform: rotate(-45deg); border-radius: 3px;}

/* Home */

.home{display: flex; flex-flow: column; height: 100vh;}

.home header{width: 100vw; display: table; user-select: none;}
.home header > *{display: table-row;}
.home header .logo .logoContainer{display: table-cell; vertical-align: middle; text-align: center;}
.home header .logo .logoContainer img{display: table-cell; margin: auto; padding: 30px 0;}
.home header nav{height: 70px; background-color: transparent; transition: all .5s ease; position: relative;}
.home.build header nav{background-color: #58595b; transition: all .5s ease .5s;}
.home header nav .menuContainer{display: table-cell; vertical-align: middle; padding: 0 10vw; position: relative;}
.home header nav .menuContainer:before{content: ''; position: absolute; left: 0; top: 0; width: 0; height: 100%; background-color: #58595b; transition: all .5s ease; z-index: -1;}
.home.build header nav .menuContainer:before{width: 100%;}
.home header nav .menuContainer > *{display: inline-block; color: #fff; font-size: 1.1em; text-decoration: none; margin-right: 5vw; opacity: 0; transition: opacity .5s ease;}
.home.build header nav .menuContainer > *{opacity: 1; transition: opacity .5s ease .5s;}
.home header nav .menuContainer > *:hover{font-weight: bold;}
.home header nav .menuContainer .dropdownHolder{position: relative;}
.home header nav .menuContainer .dropdownHolder .tag{cursor: pointer; position: relative; z-index: 5;}
.home header nav .menuContainer .dropdownHolder .dropdown{position: absolute; left: 0; top: calc(100% + 10px); z-index: 50; background-color: #58595b; opacity: 0; pointer-events: none; transition: all .3s ease .3s, pointer-events 0s linear .6s;}
.home header nav .menuContainer .dropdownHolder:hover .dropdown, .home header nav .menuContainer .dropdownHolder .dropdown:hover{opacity: 1; top: 100%; pointer-events: all; transition: all .3s ease, pointer-events 0s linear .6s;}
.home header nav .menuContainer .dropdownHolder .dropdown a{display: block; padding: 10px 20px; box-sizing: border-box; font-size: inherit; text-decoration: inherit; color: inherit; font-weight: normal;}
.home header nav .menuContainer .dropdownHolder .dropdown a:hover{font-weight: bold;}
.home header nav .menuContainer span#restrictAreaBtn{position: absolute; background-image: url(../images/home/restrict_area_btn.png); background-repeat: no-repeat; margin-right: 0; padding: 10px 52.5px; right: 10vw; top: 50%; transform: translateY(-50%); cursor: pointer;}

.home main{position: relative; flex: 1 0 auto;}
.home main:before{content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-image: url(../images/home/home_banner.jpg); background-position-x: -50px; opacity: 0; transition: all .5s ease;}
.home.build main:before{background-position-x: 0; opacity: 1;}
.home main:after{content: ''; width: 0; position: absolute; top: 0; right: 0; height: 100%; transition: all .5s ease; background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(121,0,0,1) 100%); background: -webkit-linear-gradient(left, rgba(255,255,255,.2) 0%,rgba(121,0,0,1) 100%); background: linear-gradient(to right, rgba(121,0,0,0) 0%, rgba(121,0,0,1) 60%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#790000',GradientType=1 ); pointer-events: none;}
.home.build main:after{width: 100%;}
.home main article{position: absolute; z-index: 1; color: #fff; left: 33vw; top: 50%; transform: translateY(-50%);}
.home main article *::selection{background-color: #fff; color: #790000;}
.home main article h1{width: fit-content; width: -webkit-fit-content; width: -moz-fit-content; margin-bottom: 40px; transform: translate(-50px, -50px); opacity: 0; transition: all .5s ease;}
.home.build main article h1{transform: translate(0); opacity: 1; transition: all .5s ease .5s;}
.home main article p{width: fit-content; width: -webkit-fit-content; width: -moz-fit-content;}
.home main .dots{left: 10vw; top: 20px;}

/* Historia */

.historia{padding-bottom: 50px;}
.historia header.floating{left: 0; top: 0; width: 100%; padding: 50px 10vw;}
.historia header.floating .menuTrigger{position: absolute; top: calc(50% - 25px); right: 10vw;}
.historia header.floating nav{right: 10vw; top: calc(50% + 55px);}

.historia main{position: relative; display: flex; min-height: 100vh; flex-flow: row;}
.historia main article{color: #58595b; flex: 0 1 auto; width: 20vw; align-self: center; padding: 250px 50px 0 10vw; position: relative; max-height: 100%; margin-top: 100px;}
.historia main article .dots{top: 200px;}

.historia .imageAside{flex: 1 1 auto; overflow: hidden; z-index: -2; transform: translateY(-50px); opacity: 0; transition: all .5s ease; background-image: url(../images/historia/main_history_banner.png); background-size: cover; background-position: center;}
.build.historia .imageAside{transform: translateY(0); opacity: 1;}
.historia .imageAside img{max-height: calc(100vh - 50px); max-width: initial; transform: translateX(-50%); margin-left: 50%;}

/* Parcerias */

body.parcerias{min-height: 100vh; width: 100vw; display: flex; flex-flow: column; position: relative;}
 
.parcerias header.floating{bottom: 50px; width: fit-content; width: -webkit-fit-content; width: -moz-fit-content; right: 10vw; z-index: 100;}
.parcerias header.floating nav{bottom: calc(100% + 25px); right: 0;}
.parcerias header.floating .menuTrigger{margin: 0 0 20px auto; transition: all .5s ease .5s;}

.parcerias main{flex: 1 0 auto; display: flex; align-items: center;}
.parcerias main .container{height: 100%; padding: 0 10vw; width: 100%; box-sizing: border-box;}
.parcerias main .container article{position: relative; padding: 50px 0;}
.parcerias main .container article h1{width: 21vw;}
.parcerias main .container article .dots{top: 25px; display: flex;}

.parcerias .bottomBar{flex: 0 1 20px; position: initial;}

/* Trabalhista */

.trabalhista{padding-bottom: 50px;}
.trabalhista main{width: 100%; min-height: 100vh; display: flex; flex-flow: row; box-sizing: border-box;}
.trabalhista main article{height: fit-content; width: -webkit-fit-content; width: -moz-fit-content; flex: 0 1 100%; box-sizing: border-box; align-self: center; position: relative; margin-top: 120px;}
.trabalhista main article.left{padding: 200px 50px 0 10vw;}
.trabalhista main article.right{padding: 0 10vw 0 50px;}
.trabalhista main article p b{color: #790000;}
.trabalhista main article .dots{top: 150px;}
.trabalhista main .imageCentered{position: relative; z-index: -1; height: 100vh; max-width: 30vw; overflow: hidden; vertical-align: middle; flex: 1 0 auto; transform: translateY(-50px); opacity: 0; transition: all .5s ease;}
.build.trabalhista main .imageCentered{transform: translateY(0); opacity: 1;}
.trabalhista main .imageCentered img{display: block; height: calc(50% - 5px); max-width: initial;}
.trabalhista main .imageCentered img:first-child{margin-bottom: 10px; margin-left: 100%; transform: translateX(-100%);}

.trabalhista .bottomBar{z-index: -2;}

/* Civil/Empresarial e Consumidor */

.civil_consumidor header.floating.top.rightMain .logo{filter: brightness(0) invert(1);}

.civil_consumidor main{vertical-align: middle; display: table; width: 100%; min-height: 100vh; box-sizing: border-box; padding-top: 200px; overflow: hidden;}
.civil_consumidor main:before{content: ''; background-image: url(../images/civil_empresarial_e_consumidor/background.jpg); background-position: calc(100% + 50px) 0; background-repeat: no-repeat; background-color: rgba(0, 0, 0, .7); background-blend-mode: multiply; position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; transition: all .5s ease .5s;}
.build.civil_consumidor main:before{background-position: 0 0; opacity: 1; transition: all .5s ease .5s;}
.civil_consumidor main .articleHolder{display: table-cell; vertical-align: middle; padding: 0 50vw 0 10vw;}
.civil_consumidor main .articleHolder article:last-child{margin-top: 50px;}

/* Administrativo e Tributário */

.administrativo_tributario main{display: flex; flex-flow: row; width: 100%; min-height: 100vh; overflow: hidden;}
.administrativo_tributario main *::selection{background-color: #fff; color: #790000;}
.administrativo_tributario main .articleHolder{box-sizing: border-box; padding: 250px 100px 0 10vw; flex: 0 1 50vw; position: relative;}
.administrativo_tributario main .articleHolder:before{content: ''; position: absolute; top: 0; right: 50px; width: 100%; height: 100%; background-color: #790000; opacity: 0; transition: all .5s ease .5s;}
.build.administrativo_tributario main .articleHolder:before{right: 0; opacity: 1; transition: all .5s ease;}
.administrativo_tributario main .articleHolder article:first-child{margin-bottom: 50px;}
.administrativo_tributario main .imageAside{flex: 1 0 auto; position: relative; opacity: 0; transform: translateX(50px); transition: all .5s ease .5s;}
.build.administrativo_tributario main .imageAside{opacity: 1; transform: translateX(0);}
.administrativo_tributario main .imageAside:before{content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(255, 255, 255, .5);}

/* Equipe */

.equipe{display: flex; flex-flow: row; min-height: 100vh; width: 100%;}

.equipe header{position: relative; flex: 0 0 auto; height: 100%; padding: 50px 7.5vw;}
.equipe header .menuTrigger{margin: 50px 0;}
.equipe header .menuTrigger.close{margin: 40px 0 50px;}

.equipe main{display: flex; flex-flow: column; overflow: hidden;}
.equipe main .bannerImage{transform: translateX(50px); opacity: 0; transition: all .5s ease .5s;}
.build.equipe main .bannerImage{transform: translateX(0); opacity: 1; transition: all .5s ease;}
.equipe main .container{flex: 1 0 auto; box-sizing: border-box; padding: 0 50px; overflow: hidden;}
.equipe main .container .articleHolder{height: 100%; display: table;}
.equipe main .container .articleHolder article{display: flex; vertical-align: middle; position: relative; padding-top: 20px;}
.equipe main .container .articleHolder article .dots{top: 32.5px; display: flex;}
.equipe main .container .articleHolder article h1{position: relative; top: 25.5px;}
.equipe main .container .articleHolder article p{vertical-align: top; width: 50%; margin: 0 0 0 100px;}

/* Clientes */

.clientes header{bottom: 80px; right: 5vw;}
.clientes header nav{position: relative; right: 0 !important;}
.clientes header .menuTrigger{margin: 50px 0 50px auto;}
.clientes header .menuTrigger.close{margin: 40px 0 50px auto;}

.clientes main{display: flex; flex-flow: column; height: 100vh; overflow: hidden;}
.clientes main .showcaseBox{flex: 1 0 auto; background-image: url(../images/clientes/background.jpg); background-size: cover; background-position: center; background-color: #790000; background-blend-mode: multiply; display: flex; transform: translateY(-50px); opacity: 0; transition: all .5s ease .5s; position: relative; z-index: -1;}
.build.clientes main .showcaseBox{transform: translateY(0); opacity: 1; transition: all .5s ease;}
.clientes main .showcaseBox h1{position: absolute; left: 5vw; top: 100px; font-size: 3em;}
.clientes main .showcaseBox .dots{left: 5vw; top: 50px;}
.clientes main .showcaseBox .bigLogoBox{width: 60vw; height: 80%; padding: 0 10vw; box-sizing: border-box; display: table; background-color: rgba(221, 221, 221, 0.6); border-radius: 25px; margin: 0 auto -50px; align-self: flex-end; opacity: 0; transition: all .5s ease;}
.build.clientes main .showcaseBox .bigLogoBox{opacity: 1; transition: all .5s ease .5s;}
.clientes main .showcaseBox .bigLogoBox .bigLogoContainer{display: table-cell; vertical-align: middle; filter: brightness(0) invert(1); text-align: center;}
.clientes main .showcaseBox .bigLogoBox .bigLogoContainer img{transition: all .3s ease;}
.clientes main .showcaseBox .bigLogoBox .bigLogoContainer img.removing{opacity: 0;}
.clientes main .logoShowcase{flex: 0 1 auto; padding: 100px 360px 100px 5vw; counter-reset: logoShowcase;}
.clientes main .logoShowcase .logoPreview{display: inline-block; max-width: calc(100%/5 - 150px); vertical-align: middle; margin-right: 50px; cursor: pointer; transform: translateY(50px); opacity: 0; transition: all .5s ease;}
.build.clientes main .logoShowcase .logoPreview{transform: translateY(0); opacity: 1;}
.clientes main .logoShowcase .logoPreview:last-child{margin: 0;}
.clientes main .logoShowcase .logoPreview img{width: auto; max-height: 130px;}

/* Contato */

.contato{overflow-x: hidden;}

.contato main{display: flex; flex-flow: row; min-height: 1030px;}
.contato main .mapSide{flex: 0 1 auto; position: relative; padding: 350px 50px 0 10vw; width: 40vw; box-sizing: border-box;}
.contato main .mapSide .dots{top: 300px;}
.contato main .mapSide iframe{border: 0; width: 100%; position: absolute; top: calc(350px + 4em + 40px); left: 0; height: calc(100% - (350px + 4em + 40px) - 50px); opacity: 0; transition: all .5s ease;}
.build.contato main .mapSide iframe{opacity: 1; transition: all .5s ease 1s;}
.contato main .imageAside{flex: 1 1 auto; overflow: hidden; transform: translateY(-50px); opacity: 0; transition: all .5s ease .5s; position: relative; z-index: -1; background-image: url(../images/contato/predio.jpg); background-size: cover; background-position: left center;}
.build.contato main .imageAside{transform: translateY(0); opacity: 1; transition: all .5s ease;}
.contato main .imageAside img{max-width: initial;}

.contato article.overlay{position: absolute; top: 0; right: 0; left: initial; width: 40vw; padding: 200px 0 50px; box-sizing: border-box; text-align: center; background-color: transparent; z-index: initial; cursor: initial; flex-direction: column; justify-content: center; row-gap: 50px; display: flex;}
.contato article.overlay:before{content: ''; position: absolute; top: 0; right: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, .5); transform: translateX(100%); opacity: 0; transition: all .5s ease .5s;}
.build.contato article.overlay:before{transform: translateX(0); opacity: 1; transition: all .5s ease;}
.contato article.overlay .mailBox p > *{display: block; color: #fff; text-decoration: none; margin-bottom: 20px;}
.contato article.overlay .mailBox p i{width: 30px; margin: 0 auto 10px;}
.contato article.overlay .addressBox *{font-style: normal; color: #fff; text-decoration: none; margin: 0;}

/* Escritório */

.escritorio main{display: flex; flex-flow: row; min-height: 1080px; overflow: hidden; position: relative;}
.escritorio main article{flex: 1 1 auto; width: calc(30vw + 50px); padding: 350px 100px 0 10vw; position: relative; box-sizing: border-box;}
.escritorio main article .dots{top: 300px;}
.escritorio main article h1{font-size: 3em;}
.escritorio main article address{font-style: normal;}
.escritorio main article .expandableImages{position: absolute; top: 150px; left: calc(100% - 30px); width: 960px;}
.escritorio main article .expandableImages .imageContainer{display: inline-block; overflow: hidden; margin-right: 30px; width: 300px; height: 300px; cursor: pointer; transform: translateY(-50px); opacity: 0; transition: all .5s ease;}
.escritorio main article .expandableImages .imageContainer:nth-child(2){transition: all .5s ease .1s;}
.escritorio main article .expandableImages .imageContainer:last-child{margin: 0; transition: all .5s ease .2s;}
.build.escritorio main article .expandableImages .imageContainer{transform: translateY(0); opacity: 1; transition: all .5s ease .5s;}
.build.escritorio main article .expandableImages .imageContainer:nth-child(2){transition: all .5s ease .6s;}
.build.escritorio main article .expandableImages .imageContainer:last-child{transition: all .5s ease .7s;}
.escritorio main article .expandableImages .imageContainer img{max-width: initial; max-height: 100%; transform: translateX(-50%); margin-left: 50%;}
.escritorio main .imageAside{flex: 1 0 auto; transform: translateX(50px); opacity: 0; transition: all .5s ease .5s; position: relative; z-index: -1;}
.build.escritorio main .imageAside{transform: translateX(0); opacity: 1; transition: all .5s ease;}
.escritorio main .floatingBox{position: absolute; bottom: 0; left: 10vw; width: 35vw; transform: translateY(50px); opacity: 0; transition: all .5s ease;}
.build.escritorio main .floatingBox{transform: translateY(0); opacity: 1; transition: all .5s ease .8s; bottom: 10px;}

.escritorio .overlay{position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, .5); opacity: 0; pointer-events: none; transition: all .5s ease; z-index: 2;}
.escritorio.build .overlay.active{opacity: 1; pointer-events: all;}
.escritorio .overlay.active ~ header .logo{filter: brightness(0) invert(1);}

.escritorio .slider{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); opacity: 0; pointer-events: none; transition: all .5s ease; z-index: 2;}
.escritorio .slider .closeTrigger{position: absolute; top: 20px; right: 20px; width: 25px; height: 25px; z-index: 20; cursor: pointer; border-radius: 50%; background-color: rgba(0, 0, 0, .5);}
.escritorio .slider .closeTrigger:before, .escritorio .slider .closeTrigger:after{content: ''; position: absolute; width: 60%; height: calc(100%/6); top: calc(50% - 50%/6); left: 20%; transform: rotate(-45deg); background-color: #fff; border-radius: 3px;}
.escritorio .slider .closeTrigger:after{transform: rotate(45deg);}
.escritorio.build .slider.active{opacity: 1; pointer-events: all;}
.escritorio .slider .sliderRow{width: fit-content; width: -moz-fit-content; width: -webkit-fit-content;}
.escritorio .slider:not(.active) .sliderRow{transition: all 0s ease;}
.escritorio .slider .sliderRow img{max-width: 60vw;}
.escritorio .slider:not(.active) .controls div{pointer-events: none;}

/* Responsiveness */

@media(max-width: 1440px){
	
	h1, h2{font-size: 3em;}
	p, address{font-size: 1em;}
	
	h1:not(.overlap).boxed{width: fit-content; width: -moz-fit-content; width: -webkit-fit-content;}
	h1.boxed:after{left: -2.5vw;}
	.build h1.boxed:after{width: calc(100% + 5vw);}
	.build h1.boxed.overlap:after{width: calc(100% + 2.5vw + 50px);}
	
	header .logo img{width: 140px;}
	header nav .menuContainer > *{font-size: .9em;}
	
	header.floating.top{padding: 50px 5vw;}
	header.floating:not(.rightMain).top .menuTrigger, header.floating:not(.rightMain).top nav{right: 5vw;}
	header.floating.rightMain .menuTrigger, header.floating.rightMain nav{left: 5vw;}
	
	.home header nav .menuContainer{padding: 0 5vw;}
	.home header nav .menuContainer span#restrictAreaBtn{background-size: contain; background-position: center; right: 5vw;}
	.home main article{left: 25vw;}
	
	.historia header.floating{padding: 50px 5vw;}
	.historia header.floating .menuTrigger, .historia header.floating nav{right: 5vw;}
	.historia main article{width: 25vw; padding: 200px 50px 0 5vw;}
	.historia main article .dots{top: 150px;}
	
	.parcerias header.floating{right: 5vw;}
	.parcerias main .container{padding: 0 5vw;}
	
	.trabalhista main article.left{padding: 200px 50px 0 5vw;}
	.trabalhista main article.right{padding: 0 5vw 0 50px;}
	
	.civil_consumidor main:before{background-position: -100px;}
	.build.civil_consumidor main:before{background-position: center;}
	.civil_consumidor main .articleHolder{padding: 0 50vw 0 5vw;}
	
	.administrativo_tributario main .articleHolder{flex: 1 0 auto; width: 70vw; padding: 200px 5vw 0;}
	
	.equipe header{padding: 50px 5vw;}
	.equipe header .logo{margin: 0;}
	
	.clientes header.floating .logo{margin-left: auto;}
	.clientes main .showcaseBox .bigLogoBox{padding: 0 5vw; height: 60%;}
	.clientes main .logoShowcase .logoPreview{max-width: calc(100%/5 - 80px);}
	
	.escritorio main article{width: calc(35vw + 50px); padding: 350px 100px 0 5vw;}
	.escritorio main article .expandableImages{top: 200px;}
	.escritorio main article .expandableImages .imageContainer{width: 200px; height: 200px;}
	.build.escritorio main .imageAside{position: relative; overflow: hidden; width: calc(65vw - 50px);}
	.build.escritorio main .imageAside img{max-width: initial; position: absolute; bottom: 0; right: 0;}
	.escritorio main .floatingBox{width: 50vw; left: 5vw;}
		
	.contato main .mapSide{padding: 350px 50px 0 5vw;}
	.contato main .imageAside{width: calc(55vw - 50px);}
	
}

@media(max-width: 1024px){
	
	.home header nav .menuContainer > *{font-size: 1em;}
	.home header nav .menuContainer span#restrictAreaBtn{padding: 10px 30px;}
	
	.trabalhista main article{width: 20vw;}
	.trabalhista main .imageCentered{max-width: 20vw;}
	
	.historia header.floating .menuTrigger:before,
	.historia header.floating .menuTrigger:after,
	.historia header.floating .menuTrigger span{border: 1px solid #fff;}
	.historia header.floating .menuTrigger:hover:before,
	.historia header.floating .menuTrigger:hover:after,
	.historia header.floating .menuTrigger:hover span,
	.historia header.floating .menuTrigger.close:before,
	.historia header.floating .menuTrigger.close:after,
	.historia header.floating .menuTrigger.close span{background-color: #fff;}
	.historia header.floating nav > *{background-color: #fff; color: rgba(88, 89, 91, 0); font-weight: bold;}
	.historia.build header.floating nav.open > *{color: #58595b;}	
	.historia main article{width: 35vw;}
	
	.civil_consumidor main .articleHolder{padding: 0 45vw 0 5vw;}
	
	.escritorio main article .expandableImages .imageContainer{width: 150px; height: 150px;}
	
}

@media(max-width: 768px){
	
	h1, h2{font-size: 2.5em;}
	h1.boxed{font-size: 2.3em;}
	h1:not(.overlap).boxed{width: 100%;}
	h1.boxed.overlap:before{display: none;}
	.build h1.boxed.overlap:after{border-right: 1px solid #58595b; width: 105%; left: -2.5%;}
	
	img.responsiveOnly + img{display: none;}
	img.responsiveOnly{display: initial;}
	
	.home header nav .menuContainer{padding: 35px 5vw 0; display: grid; grid-template-areas: "area1 area2 area3 area4";}
	.home header nav .menuContainer > *{margin: 0 10px 30px; font-size: .9em;}
	.home header nav .menuContainer span#restrictAreaBtn{padding: 10px 25px; margin: 0; bottom: 0px; top: initial; right: calc(5vw + 10px);}
	.home main{display: flex;}
	.home main article{position: relative; transform: none; width: 70vw; margin: auto; top: initial; left: initial;}
	
	.historia header.floating{position: relative; padding: 20px 5vw;}
	.historia header.floating .menuTrigger:before, .historia header.floating .menuTrigger:after, .historia header.floating .menuTrigger span{border: 1px solid #58595b;}
	.historia header.floating .menuTrigger:hover:before, .historia header.floating .menuTrigger:hover:after, .historia header.floating .menuTrigger:hover span, .historia header.floating .menuTrigger.close:before, .historia header.floating .menuTrigger.close:after, .historia header.floating .menuTrigger.close span{background-color: #58595b;}
	.historia header.floating nav > *{background-color: #58595b; color: rgba(255, 255, 255, 0);}
	.historia.build header.floating nav.open > *{color: #fff;}
	.historia main{flex-flow: column; height: initial;}
	.historia main article{width: 80vw; padding: 50px 0;}
	.historia main article .dots{top: 0;}
	.historia main .imageAside{background-image: url(../images/historia/responsive_building_image.jpg); aspect-ratio: 1;}
	.build.historia main .imageAside{max-width: initial;}
	.historia .bottomBar{position: initial;}
	
	body.parcerias{height: initial; overflow-y: initial;}
	.parcerias .slider .sliderMat .sliderRow{overflow: hidden;}
	.parcerias .slider .sliderMat .sliderRow img{max-width: initial; transform: translateX(-50%); margin-left: 50%;}
	.parcerias main{padding: 100px 0 50px; width: 80vw; margin: auto;}
	.parcerias main .container article{padding: 0;}
	.parcerias main .container article .dots{top: -50px;}	
	.parcerias main .container article h1{width: 100%;}
	.parcerias header.floating{position: relative; width: 100%; right: initial; padding: 0 5vw; bottom: 0; margin-bottom: 50px;}
	.parcerias header.floating .menuTrigger{position: absolute; right: 5vw; top: 50%; transform: translateY(-50%);}
	.parcerias header.floating nav{right: 5vw;}
	
	.trabalhista{position: relative; padding-bottom: 50px;}
	.trabalhista main{display: block; height: initial;}
	.trabalhista main article{width: initial; padding: 50px 5vw;}
	.trabalhista main article.left{padding: 300px 5vw 50px;}
	.trabalhista main article.right{padding: 50px 5vw;}
	.trabalhista main article .dots{top: 250px;}
	.trabalhista main .imageCentered{max-width: 90vw; width: fit-content; margin: auto; height: initial;}
	.trabalhista main .imageCentered img{margin: 0 !important; transform: none !important; height: initial !important; max-width: 100%;}
	.trabalhista main .imageCentered img:first-child{margin-bottom: 10px !important;}
	
	.civil_consumidor{position: relative;}
	.civil_consumidor header.floating.top{position: relative;}
	.civil_consumidor main{height: initial; overflow: initial; padding: 0 0 50px; width: 80vw; margin: auto; display: block;}
	.civil_consumidor main:before{background-position: right; background-size: cover;}
	.civil_consumidor main .articleHolder{padding: 0; width: 100%; display: block;}
	
	.administrativo_tributario main{flex-flow: column-reverse; overflow: initial; height: initial;}
	.administrativo_tributario main .articleHolder{width: 100vw; padding: 50px 15vw; height: initial;}
	.administrativo_tributario header.floating.rightMain .menuTrigger,
	.administrativo_tributario header.floating.rightMain nav{left: initial; right: 5vw;}
	.administrativo_tributario header.floating.rightMain .logo{margin-left: initial;}
	.administrativo_tributario header.floating .white.menuTrigger:before,
	.administrativo_tributario header.floating .white.menuTrigger:after,
	.administrativo_tributario header.floating .white.menuTrigger span{border-color: #58595b;}
	.administrativo_tributario header.floating .white.menuTrigger:hover:before,
	.administrativo_tributario header.floating .white.menuTrigger:hover:after,
	.administrativo_tributario header.floating .white.menuTrigger:hover span,
	.administrativo_tributario header.floating .white.menuTrigger.close:before,
	.administrativo_tributario header.floating .white.menuTrigger.close:after,
	.administrativo_tributario header.floating .white.menuTrigger.close span{background-color: #58595b;}
	.administrativo_tributario header.floating nav.white > *{background-color: #58595b; color: rgba(88, 89, 91, 0);}
	.build.administrativo_tributario header.floating nav.white.open > *{color: #fff;}
	.administrativo_tributario header.floating.rightMain nav > *{text-align: right; transform: translateX(100%);}
	
	.equipe{height: initial;}
	.equipe header.floating{position: absolute; width: 100%; height: initial;}
	.equipe header.floating .logo{margin-left: initial; filter: brightness(0) invert(1);}
	.equipe header.floating .menuTrigger.nonAbsolute{position: absolute; left: initial; right: 5vw; margin: 0;}
	.equipe header.floating .menuTrigger.nonAbsolute.close{margin: 0; padding: 0;}
	.equipe header.floating .menuTrigger.nonAbsolute + nav{position: absolute; left: initial; right: 5vw;}
	.equipe header.floating .menuTrigger.nonAbsolute + nav > *, .equipe header.floating.rightMain nav .dropdownHolder .dropdown a{transform: translateX(100%); text-align: right;}
	.equipe header.floating .menuTrigger:before,
	.equipe header.floating .menuTrigger:after,
	.equipe header.floating .menuTrigger span{border-color: #fff;}
	.equipe header.floating .menuTrigger:hover:before,
	.equipe header.floating .menuTrigger:hover:after,
	.equipe header.floating .menuTrigger:hover span,
	.equipe header.floating .menuTrigger.close:before,
	.equipe header.floating .menuTrigger.close:after,
	.equipe header.floating .menuTrigger.close span{background-color: #fff;}
	.equipe header.floating nav > *{background-color: #fff; color: rgba(255, 255, 255, 0);}
	.build.equipe header.floating nav.open > *{color: #58595b;}
	.equipe header.floating .menuTrigger.nonAbsolute + nav.open > *,
	.equipe header.floating nav .dropdownHolder:hover .dropdown a{transform: translateX(0);}
	.equipe main .container{width: 80vw; padding: 100px 0 50px; margin: auto;}
	.equipe main .container .articleHolder article{flex-direction: column;}
	.equipe main .container .articleHolder article .dots{top: -50px;}
	.equipe main .container .articleHolder article h1{top: 0;}
	.equipe main .container .articleHolder article p{width: 100%; margin: 50px 0 0;}
	
	.clientes header.floating{top: 0; left: 0; bottom: initial; right: initial; width: 100%; padding: 50px 5vw;}
	.clientes header.floating nav{position: absolute; right: 5vw !important;}
	.clientes header.floating .menuTrigger{position: absolute; right: 5vw; margin: 0;}
	.clientes header.floating .logo{margin-left: initial; filter: brightness(0) invert(1);}
	.clientes main{height: initial;}
	.clientes main .showcaseBox{height: 700px;}
	.clientes main .showcaseBox .dots{top: 250px;}
	.clientes main .showcaseBox .bigLogoBox{height: 45%; width: 80%; padding: 50px;}
	.clientes main .showcaseBox h1.white{top: 300px;}
	.clientes main .logoShowcase{display: table; padding: 100px 5vw 50px;}
	.clientes main .logoShowcase .logoPreview{max-width: initial; margin-right: initial; width: 45%; margin-bottom: 50px;}
	.clientes main .logoShowcase .logoPreview:first-child{display: block; width: 70%; margin: 0 auto 50px;}
	.build.clientes main .logoShowcase .logoPreview:nth-child(2n){margin-right: 10%;}
	.clientes main .logoShowcase .logoPreview:last-child{margin-bottom: 50px;}
	
	.escritorio main{height: 1050px;}
	.escritorio main article{padding: 300px 50px 0 5vw; width: 50vw;}
	.escritorio main article address{display: none;}
	.escritorio main article .dots{top: 250px;}
	.escritorio main article .expandableImages{top: 400px; left: 0; width: 100vw;}
	.escritorio main article .expandableImages .imageContainer{width: calc(100vw/3 - 20px/3); height: calc(100vw/3 - 20px/3); margin-right: 10px;}
	.build.escritorio main .imageAside{width: 50vw; height: 100%;}
	.build.escritorio main .floatingBox{left: 0; width: 80vw;}
	.escritorio .slider .sliderRow img{max-width: 90vw;}
	
	.contato{height: 100%; position: relative; overflow: initial;}
	.contato main{height: 120vh;}
	.contato main .mapSide{position: initial; width: initial; padding: 350px 5vw 0; width: 50vw;}
	.contato main .mapSide h1.boxed.overlap:after{display: none;}
	.contato main .mapSide iframe{border: 0; bottom: initial; top: 120vh; transform: translateY(-100%);}
	.contato main .imageAside{width: 50vw; height: calc(100vh - 400px); padding-bottom: 400px;}
	.contato main .imageAside img{max-height: 100%;}
	.contato article.overlay{position: relative; width: 100vw; height: initial; top: initial; right: initial; padding: 50px 0 100px; flex-direction: column;}
	.contato article.overlay .addressBox{position: initial; transform: none; margin-top: 50px;}
	
}

@media(max-width: 425px){
	
	.civil_consumidor .articleHolder article:first-child h1:not(.overlap).boxed{font-size: 1.4em;}
	
	.administrativo_tributario .articleHolder article:first-child h1:not(.overlap).boxed{font-size: 1.4em;}
	.administrativo_tributario .articleHolder article:last-child h1:not(.overlap).boxed{font-size: 1.8em;} .administrativo_tributario header.floating .white.menuTrigger:before, .administrativo_tributario header.floating .white.menuTrigger:after, .administrativo_tributario header.floating .white.menuTrigger span{background-color: #58595b;}
	
	.escritorio main{height: 900px;}
	.escritorio main article h1{font-size: 1.6em;}
	.build.escritorio main .floatingBox{width: 90vw;}
	
}