/*
Azul: #0a2673;
Vermelho: #b72031;
Laranja: #e0802c
Verde: #6ca11b
*/

.wow {visibility: hidden;}
html{height: 100%; font-size: 100%;}
body{font-size: 100%; font-family: 'Montserrat', sans-serif; font-weight: 300; width: 100%; height: 100%; overflow-x: hidden; position: relative;}
#over {background-color: rgba(0,0,0,0.5); display: none; height: 100vh; position: fixed; top: 0; width: 100%; z-index: 1000;}
h1,h2,h3,h4,h5,h6{font-family: "Lato", sans-serif; font-weight: 300; letter-spacing: -0.05rem;}
h1{font-size: 3.2rem;}
h2{font-size: 2.4rem;}
h4{font-size: 1.4rem;}
ul{list-style: none; padding: 0; margin: 0;}
.btn-default{background-color: #8c0000; border-color: transparent; text-transform: uppercase; color: #FFF; font-family: "Lato", sans-serif; font-weight: 300; }
a:not([href]){color: #FFF;}

.btn{position: relative;}
.btn::after {content: ''; position: absolute; top: 50%; left: 50%; width: 5px; height: 5px; background: rgba(255, 255, 255, .5); opacity: 0; border-radius: 50%; transform: scale(1, 1) translate(-50%); transform-origin: 50% 50%;}
.btn:hover::after {animation: ripple 1s ease-out;}
@keyframes ripple {0% {transform: scale(0, 0); opacity: 1; border-radius: 50%;} 20% { transform: scale(25, 25); opacity: 1; border-radius: 50%;} 100% { opacity: 0; transform: scale(40, 40); border-radius: 50%; } }

nav.sidebar{-webkit-transform: translateX(-100%); transform: translateX(-100%); transition: transform 200ms ease-out; will-change: transform; width: 85%; height: 100vh; padding: 0; position: fixed; z-index: 1000; overflow-x: hidden; background-color: #FFF; top: 0; padding-bottom: 30px; }
nav.sidebar.show-sidebar{-webkit-transform: none; transform: none; transition: transform 200ms ease-out;}
#over {background-color: rgba(0,0,0,0.5); display: none; height: 100vh; position: absolute; top: 0; width: 100%; z-index: 1000;}
#over.overshow{display: block;}

nav.sidebar div.logo-sidebar{height: 130px;}
nav.sidebar ul.menu{padding: 30px; margin: 0; flex-direction: column; height: auto !important; justify-content: unset !important; align-items: unset !important;}
nav.sidebar li, 
nav.sidebar a, 
nav.sidebar span,
nav.sidebar div.moduletable h3{display: block; font-family: "Roboto", sans-serif; font-weight: 700; color: #333; font-size: 0.85rem; text-transform: uppercase;}
nav.sidebar ul.menu > li{display: block; line-height: 40px; padding: 0; text-align: left;}
nav.sidebar ul.menu > li > a{padding: 0; text-align: left; line-height: unset; position: relative;}
nav.sidebar ul.menu > li.parent{line-height: 36px; padding: 0;}
nav.sidebar ul.menu > li.parent > a,
nav.sidebar ul.menu > li.parent > span,
nav.sidebar div.moduletable h3{border-top: solid 1px #CCC; margin-top: 10px; font-size: 0.75rem; color: rgba(0,0,0,0.6); font-weight: 700; pointer-events: none;}
nav.sidebar ul.menu > li.parent > ul{padding-left: 16px; margin: 0; width: 100%; list-style: none;}
nav.sidebar ul.menu > li > ul > li{background-color: transparent; border: none;}

button#toggle-menu i.fas{margin-right: 15px;}
button#toggle-menu{padding: 10px 20px; margin-top: 20px; color: #FFF;}

header#topmenu{position: fixed; width: 100%; height: 138px; z-index: 300; top: 0; transition: all 0.3s ease;}
header#topmenu > div.topbar{background-color: #662626;}
header#topmenu > div.topbar div.info{font-family: "Lato", sans-serif; font-size: 1rem; color: #FFF; letter-spacing: -0.03rem;}
header#topmenu > div.topbar > div.container > div.row{height: 45px;}
header#topmenu span, header#topmenu i{color: #FFF; font-size: 0.9rem;}
header#topmenu > div.toplogo{position: relative; background-color: rgb(255,255,255); box-shadow:  0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); }
header#topmenu > div.toplogo > div.container > div.row{height: 90px;}
header#topmenu > div.toplogo .col-sm-4 img{ width: 70%; }

header#topmenu ul.nav > li{position: relative; margin-right: 33px; height: 100%; display: flex; align-items: center; justify-content: center; transition: all 0.3s ease; flex: 1 1 auto!important; background-color: #E8EAF6;}
header#topmenu ul.nav > li::before{position: absolute; content:""; width: 32px; height: 90px; left: -32px; top: 0; -webkit-mask-image: url(../images/before-buttom.svg); mask-image: url(../images/before-buttom.svg); background-color: #E8EAF6; transition: all 0.3s ease;}
header#topmenu ul.nav > li::after{position: absolute; content:""; width: 32px; height: 90px; right: -32px; -webkit-mask-image: url(../images/before-buttom.svg); mask-image: url(../images/before-buttom.svg); background-color: #E8EAF6; transform: rotate(180deg); transition: all 0.3s ease;}
header#topmenu ul.nav > li:hover,
header#topmenu ul.nav > li:hover::before,
header#topmenu ul.nav > li:hover::after,
header#topmenu ul.nav > li.active,
header#topmenu ul.nav > li.active::after,
header#topmenu ul.nav > li.active::before{background-color: #929292;}

header#topmenu ul.nav > li:hover,
header#topmenu ul.nav > li:hover > a,
header#topmenu ul.nav > li.active > a,
header#topmenu ul.nav > li.active > span{color: #FFF; text-decoration: none;}
header#topmenu ul.nav a,
header#topmenu ul.nav span{font-family: "Lato", sans-serif; font-size: 1.1rem; color: #212121; letter-spacing: -0.03rem;}
header#topmenu ul.nav span:hover{cursor: pointer;}

/* submenu */
header#topmenu ul.nav > li.parent > ul{position: fixed; display: flex; flex-wrap: wrap; z-index: -1; transform: translateY(-200px); padding: 30px; width: 100%; left: 0; background-color: #E8EAF6; transition: all 0.3s ease;}
header#topmenu ul.nav > li.parent > ul > li{background-color: transparent; flex: 0 0 20%; padding: 15px; text-align: center;}
header#topmenu ul.nav > li.parent:hover ul{transform: translateY(100px); }
header#topmenu ul.nav > li.parent ul > li > a{position: relative; overflow: hidden; display: inline-block; width: 100%;}
header#topmenu ul.nav > li.parent ul > li > a > span{position: relative; display: inline-block; width: 100%; -webkit-transition: -webkit-transform 0.3s; -moz-transition: -moz-transform 0.3s; transition: transform 0.3s; font-weight: 300;}
header#topmenu ul.nav > li.parent ul > li > a:hover > span::before{position: absolute; top: 100%; content: attr(data-hover); -webkit-transform: translate3d(0,0,0); -moz-transform: translate3d(0,0,0); transform: translate3d(0,0,0); font-weight: 400;}
header#topmenu ul.nav > li.parent ul > li > a:hover > span{-webkit-transform: translateY(-100%); -moz-transform: translateY(-100%); transform: translateY(-100%);}

section#banner{position: relative;}
section#banner::after{position: absolute; content:""; width: 100%; height: 300px; bottom: -120px; z-index: 20; background-image: url(../images/after-banner.svg);}
section#banner div.carousel-item{will-change: transform; animation: slideShow 24s linear infinite alternate 0s;}
@keyframes slideShow {0% {transform:scale(1); -ms-transform:scale(1); } 100% {transform: scale(1.3); -ms-transformm:scale(1.3); }}

section#banner div.carousel-item div.carousel-caption{position: static !important; padding-top: 0 !important; padding-bottom: 0 !important;}
section#banner div.carousel-item div.carousel-caption h5{font-family: "Lato", sans-serif;  font-size: 3rem;}

div#banner-line1{width: 100%; position: absolute; z-index: 30; top: 100px;}
div#banner-line2{width: 100%; position: absolute; z-index: 30; top: 100px;}
div#canvas-quemsomos{top: -100px; margin-bottom: -150px; z-index: -1;}

section#quemsomos{z-index: 20; }
section#quemsomos span.perfil{background-color: #662626; bottom: 20px; left: -25%; font-family: "Lato", sans-serif; letter-spacing: -0.05rem; font-size: 1.3rem; font-weight: 400; color: #fff}

section#linhas::before{position: absolute; content: ""; width: 100%; top: 0; height: 100px; background-image: url(../images/wave-linhas.svg); transform: rotate(180deg); }
section#linhas::after{position: absolute; content: ""; width: 100%; bottom: 0; height: 100px; background-image: url(../images/wave-linhas.svg); }
section#linhas .hovereffect {width: 100%; height: 100%; float: left; overflow: hidden; position: relative; text-align: center; cursor: default;}
section#linhas .hovereffect .overlay {position: absolute; overflow: hidden; opacity: 0; filter: alpha(opacity=0); width: 80%; height: 80%; left: 10%; top: 10%; border-radius: 100%; border: 2px solid #662626; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(50%,50%,0); transform: translate3d(50%,50%,0);}
section#linhas .hovereffect:hover .overlay {background-color: rgba(0,0,0,0.5);}
section#linhas .hovereffect img {display: block; position: relative; -webkit-transition: all 0.35s; transition: all 0.35s;}
section#linhas .hovereffect:hover img {filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feComponentTransfer color-interpolation-filters="sRGB"><feFuncR type="linear" slope="1.4" /><feFuncG type="linear" slope="1.4" /><feFuncB type="linear" slope="1.4" /></feComponentTransfer></filter></svg>#filter'); filter: brightness(1.4); -webkit-filter: brightness(1.4);}
section#linhas .hovereffect a{text-transform: uppercase; text-align: center; position: relative; font-size: 1rem; padding: 10px; background-color: transparent; color: #FFF; opacity: 0; filter: alpha(opacity=0); -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(-150%,-400%,0); transform: translate3d(-150%,-400%,0);}
section#linhas .hovereffect:hover a, 
section#linhas .hovereffect:hover .overlay {opacity: 1; filter: alpha(opacity=100); -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0);}

section#planejados{height: 500px;}
section#planejados::before{position: absolute; content: ""; width: 100%; top: -20px; height: 100px; background-image: url(../images/wave-linhas.svg); transform: rotate(180deg); }
section#planejados::after{position: absolute; content: ""; width: 100%; bottom: 0; height: 100px; background-image: url(../images/wave-linhas.svg); }
section#planejados div#canvas-planejados{top: -140px; z-index: 20; width: 100%;}

section#contato{margin-top: 95px;}
section#contato::before{position: absolute; content: ""; width: 100%; height: 100px; top: -140px; background-image: url(../images/decor-contato.svg);}
section#contato div#mapa{height: 385px;}
section#contato div#mapa::after{position: absolute; content:""; border: solid 2px red; top: 15px; right: -15px; width: 100%; height: 100%; z-index: -1;}
section#contato a.mapboxgl-ctrl-logo { display:none; }
section#contato div.mapboxgl-ctrl-attrib-inner { display:none; } 
section#contato .marker{width: 16px; height: 16px; background-color: #d9030b; border-radius: 50%; z-index: 100;}
section#contato .effect{width: 16px; height: 16px; background-color: #d9030b; border-radius: 50%; }
section#contato div.info-wrapper{background-color: #662626; margin-bottom: 25px; padding: 15px; color: #FFF;}

section.contato-interno div.info-wrapper a{color: #FFF;}
section.contato-interno div.info-wrapper a:hover{color: #FFF; text-decoration: none;}

footer#footer div.copyright{background-color: #662626; height: 80px; line-height: 1rem;}

main.interna div[itemprop="articleBody"]{padding-top: 50px;}

main.interna{position: relative; background-color: #FFF; padding-bottom: 70px; 	}
main.interna div.item-page{position: relative; padding-top: 140px;}

main.interna div#banner-interno{position: relative; width: 100%; margin-top: -5px;}
main.interna div#banner-interno h1,
main.interna div#banner-interno h2{font-size: 1.8rem; color: #FFF; text-transform: uppercase;}
main.interna div#banner-interno p{color: #FFF;}
main.interna div#banner-interno::after{position: absolute; content: ""; width: 100%; bottom: 0; height: 100px; background-image: url(../images/wave-linhas.svg);}

main.interna section#contato{margin-top: 180px;}

@media screen and (prefers-reduced-motion: reduce){
  .carousel-item{transition: opacity .9s ease-in-out !important;}
  .btn {transition: all 0.3s ease;}
}

/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {

	html, body{max-width: 100%; overflow-x: hidden;	}
	main.home{margin-top: 0; padding-bottom: unset;}
	h2{font-size: 2rem;}
	
	header#top-mobile-menu{position: fixed; top: 0; height: 50px; background-color: #455A64; width: 100%; z-index: 900;}
	header#top-mobile-menu button{ color: #FFF; border: none; height: 50px; background-color: transparent; margin-top: 0; font-size: 1rem;}
	header#top-mobile-menu button i{font-size: 1.5rem;}

	main.interna div[itemprop="articleBody"]{padding-top: 0;}

	nav.sidebar div.logo-sidebar img{max-width: 80%; padding: 0 15px;}
	nav.sidebar ul.menunav{padding-bottom: 30px; display: block;}
	nav.sidebar > div.moduletable{padding: 0 10px 0 30px;}
	nav.sidebar > div.moduletable h3{padding-top: 10px;}
	nav.sidebar > div.moduletable ul{padding: 0 0 10px 15px;}

	/* homepage */
	div#banner-mobile > div{z-index: 2;}
	div#banner-mobile::before{position: absolute; content: ""; width: 80%; height: 50%; bottom: 30%; border-radius: 15px; left: 10%; background-color: rgba(0,0,0,0.5); }
	div#banner-mobile::after{position: absolute; content: ""; width: 100%; bottom: 0; height: 60px; background-image: url(../images/wave-linhas.svg);}
	div#banner-mobile-line1{width: 100%; position: absolute; z-index: 30; top: 70px;}
	div#banner-mobile-line2{width: 100%; position: absolute; z-index: 30; bottom: 138px;}

	main.interna{padding-bottom: 12px;}
	main.interna div#banner-interno::before{position: absolute; content:""; width: 100%; height: 100%; background: rgba(0,0,0,0.7); backdrop-filter: contrast(1) blur(4px);}
	main.interna a.btn.gallery{margin-top: 30px;}

	section#contato{position: relative; margin-top: 50px !important; padding-top: 60px;}
	section#contato::before{position: absolute; content: ""; top: -50px; width: 100%; height: 100px;  background-image: url(../images/decor-contato.svg);}

	section#linhas-mobile div.item::before {position: absolute; content:""; z-index: 2; width: 80%; height: 80%; left: 10%; top: 10%; background-color: rgba(0,0,0,0.5); border-radius: 50%; border: 2px solid #662626;}
	section#linhas-mobile div.item img {filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feComponentTransfer color-interpolation-filters="sRGB"><feFuncR type="linear" slope="1.4" /><feFuncG type="linear" slope="1.4" /><feFuncB type="linear" slope="1.4" /></feComponentTransfer></filter></svg>#filter'); filter: brightness(1.4); -webkit-filter: brightness(1.4);}
	section#linhas-mobile div.item a{text-transform: uppercase; font-size: 1rem; color: #FFF; z-index: 3; top: 45%;}
	
	section#planejados{margin-bottom: -100px;}
	section#planejados > div#parallax-planejados > div{top: 120px !important; left: 12.5% !important;}

	section.contato-interno form{margin-top: 0;}
	section.contato-interno h2{background-color: #b72031; font-family: "Caveat", cursive; font-weight: normal; font-size: 3rem;}
	
	main.interna div.item-page{padding-top: 50px;}
	main.interna div.item-page-quem-somos{padding-top: 50px;}
	main.interna div.item-page-servicos{padding-top: 50px;}
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767.98px) { 	

	html, body {overflow-x:hidden;}
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991.98px) {
	
    html, body {overflow-x:hidden;} 
	
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199.98px) {

}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {

}