@font-face {
    font-family: Dry-Brush;
    src: url(../Dry-Brush.ttf);
}
 
@font-face {
    font-family: avant;
    src: url(../itc-avant-garde-gothic-bold.otf);
}
video {
    width: 100%;
    height: auto;
}
 
  html, body {

    background: #fff;
   padding: 0;
    margin: 0; 
	 box-sizing: border-box;
	 
}
 
.videosInterna iframe{ border: solid thin #df9c0c;  padding: 0 10px;}
/* estrutura */
html, body{font-family: 'Abel', sans-serif; font-size:20px; box-sizing: border-box; color: #011850;}
p{word-wrap:break-word; line-height: 160%;}
*{ box-sizing: border-box; }
a{ text-decoration:none;}
li{list-style:none; }
ul{margin: 0; padding: 0;}
h2{ text-align: center;font-size: 2.0em; }
.centro{text-align:center;} 
.centralizando{margin:auto;}
.box-centro{display:inline-block;}

.bolde{font-weight:bold;} 
.alinha-estrutura{max-width:1500px; box-sizing: border-box; padding: 0 40px;margin:auto;}
.limpaCss{clear:both; }

 
.branco{ color: #fff;}
.preto{ color: #000;}
.bgBranco{ background-color: #fff;}
.bgPreto{ background-color: #000;}
.flexL{display: flex; flex-direction: row;}
.flexC{display: flex; flex-direction: column;}
.alinhaFlex{ justify-content: center; align-items: center;}
.corPadrao{ color: #feb822;}
.bgPadrao{ color: #feb822;}



header{width:100%; position:fixed; z-index:100000;  background-color: #fff;  overflow: hidden   }
header nav {  position: relative;  flex-direction: row; align-self:center; display: none; padding: 10px 0 20px;   }
header nav ul{ display: flex; flex-direction: column;align-self: center;  }
header nav ul li{ display: flex; flex-direction: column; margin: 5px 8px;  border-bottom: dotted thin #feb822; text-align: center }
header nav ul li:last-child{  border-bottom: none;  }
 
 

header ul{ display: flex; flex-direction: row;}
header ul li{  margin: 20px; }
.alinhaTopo{ display: flex; flex-direction: column; justify-content: space-between;align-items: center;  background-color: transparent;  max-width: 1500px; margin: auto;  }
.logo{  position: relative; line-height: 60px; padding:20px 20px; font-family: "Dry-Brush";  font-size: 3.7em;color: #eb1b2b;   }


.containerHamburger{ position: absolute;  cursor:pointer; right:15px; top: 20px;	padding:5px; z-index: 9999999; display: block}
.container-fechar { position: absolute;  cursor:pointer; right:15px; top: 25px;	padding:5px; z-index: 9999999; display: block}
.bar1, .bar2, .bar3 { width:30px; height:3px; background-color:#feb822; margin:6px 0; -webkit-transition:0.4s; -o-transition:0.4s; transition:0.4s;}
.change1 {  -webkit-transform:rotate(-45deg) translate(-9px, 4px) ; -ms-transform:rotate(-45deg) translate(-12px, 4px); transform:rotate(-45deg) translate(-12px, 4px);}
.change2 { opacity:0;}
.change3 {  -webkit-transform:rotate(45deg) translate(-8px, -6px) ; -ms-transform:rotate(45deg) translate(-8px, -6px); transform:rotate(45deg) translate(-8px, -6px);}
/* Rotate first bar */
/* Rotate first bar */
.changebar1 {  -webkit-transform: rotate(-45deg) translate(-9px, 6px) ;    -ms-transform: rotate(-45deg) translate(-9px, 6px) ;    transform: rotate(-45deg) translate(-9px, 6px) ;}
/* Fade out the second bar */
.changebar2 {  opacity: 0;}
/* Rotate last bar */
.changebar3 { -webkit-transform: rotate(45deg) translate(-6px, -6px) ;    -ms-transform: rotate(45deg) translate(-6px, -6px) ;    transform: rotate(45deg) translate(-6px, -6px) ;}
.bgHome{ overflow: hidden;  }
   /* propagandaCanvas - anima borda CANVAS  */
.propagandaCanvas svg {   position: relative;  z-index: 99999999999;  width: 100%;   height: auto; }
.propagandaCanvas{font: 14.5em/1 Open Sans, Impact;   text-transform: uppercase;margin: 0;-webkit-touch-callout: none;
-webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none;  	 padding: 0px 0 ; height: auto;margin-bottom: 0px; position: relative;   }

 /* graficoHome */
.casesHome{    background-color: #feb822; min-height: 75vh;  padding: 110px 20px 100px; position: relative; z-index: 100   }
.casesHome > h2{   margin: 0;    font-size: 3.0em;   line-height: 100%;  font-family: "avant";}
.alinhaCasesHome{ display: flex; flex-direction: column; justify-content: center; align-items: center; max-width: 90%; flex-wrap: wrap; margin: auto;}
.alinhaCasesHome article{ padding: 0px; margin: 1%; width: 98%;  text-align: center  }
.alinhaCasesHome article:nth-child(odd){  margin: 1%;  width: 98%;  }
.alinhaCasesHome article h3{ margin-bottom: 10px; text-align: center;font-size: 1.3em; line-height: 100%;  }
.alinhaBt{margin: 20px auto; text-align: center;position:relative; z-index: 9999999999}

a.btHome:link{ position: relative; text-decoration:none; padding: 15px 30px; border-radius: 30px;  color:#fff; text-transform: uppercase; letter-spacing: 1px; font-weight: bold;  font-size: 16px;  border: 1px solid #ca1734 ; margin-bottom: 60px; background-color: #ca1734;z-index: 9999999999}
a.btHome:visited{text-decoration:none; color:#fff;border: 1px solid #ca1734 ;}
a.btHome:hover{text-decoration: none; color:#011850;border: 1px solid #ca1734 ; }
a.btHome:active{text-decoration: none; color:#fff;border: 1px solid #ca1734 ;}

 
a.linkVid:link { position:relative; text-decoration:none;  color:#011850; font-size: 1.0em; font-weight: bold; margin:5px 10px 0px; display: block;}
a.linkVid:visited { text-decoration:none;   color:#011850;}
a.linkVid:hover {   text-decoration: none;  color:#eb1b2b;}
a.linkVid:active {  text-decoration: none;  color:#011850;}

a.linkMenu:link{ position: relative; text-decoration:none;  color:#011850; text-transform: uppercase; letter-spacing: 1px; font-weight: bold; padding:0 20px;}
a.linkMenu:visited{text-decoration:none; color:#011850;}
a.linkMenu:hover{text-decoration: none; color:#feb822; }
a.linkMenu:active{text-decoration: none; color:#011850;}

a.linkSel:link{ position: relative; text-decoration:none;  color:#eb1b2b; text-transform: uppercase; letter-spacing: 1px; font-weight: bold; padding:0 20px;}
a.linkSel:visited{text-decoration:none; color:#eb1b2b;}
a.linkSel:hover{text-decoration: none; color:#eb1b2b; }
a.linkSel:active{text-decoration: none; color:#eb1b2b;}


.tour360{ background-color: #fff; position: relative;     padding: 30px 20px 90px; display: flex; flex-direction: column; align-items: center; z-index: 888}
.tour360 > div:nth-child(1){    width: 100%; margin-right: 0%;  }
.tour360 > div:nth-child(2){    padding:  20px; max-width: 900px; }
.tour360 h2{  text-align: left;font-size: 1.0em;   line-height: 100%;   font-family: "avant";}
.fotoTour img{ width: 100%; min-width: 230px; height: auto; padding: 40px; box-sizing: border-box;}
.alinhaTourInterna{ display: flex; flex-direction: row; justify-content: center;}
.alinhaTourInterna li{ width: 29%;margin: 2%; display: flex; flex-direction: column; justify-content: center; align-items: center}
.alinhaTourInterna li img{ width: 100%; max-width: 400px;   height: auto; padding: 20px; box-sizing: border-box;}

.contato{  position:relative; background-color:#feb822; padding:0px 0 0px; display:flex; flex-direction:column; justify-content: center; align-items: center; text-align: center;}
a.linTel:link { position:relative; text-decoration:none;  color:#011850; font-size: 1.5em; font-weight: bold; margin:0px 0px; display: block;}
a.linTel:visited { text-decoration:none;   color:#011850;}
a.linTel:hover {   text-decoration: none;  color:#fff;}
a.linTel:active {  text-decoration: none;  color:#011850;}

.txtSitesHome .far{ font-size: 2em;}
.alinhaCtoInfo{display: flex; flex-direction: row; align-items: center; justify-content: center; text-align: center; margin-bottom: 40px;}

a.linMail:link { position:relative; text-decoration:none;  color:#011850; font-size: 1.2em; font-weight: bold; margin:0px 10px; display: block;}
a.linMail:visited { text-decoration:none; color:#011850;}
a.linMail:hover {   text-decoration: none; color:#fff;}
a.linMail:active {  text-decoration: none;  color:#011850;}
.alinhaTour{  position:relative; background-color:#feb822; padding:0px 0 0px; display:flex; flex-direction:column; justify-content: center; align-items: center;}
.website{  position:relative; background-color:#feb822; padding:0px 0 0px; display: flex; flex-direction: column; }
.website > div{  width: 100%; min-height: 250px;display:flex; flex-direction:column; justify-content: center; align-items: center; padding: 50px;}	
.website h2{  text-align:left; font-size: 2.6em; margin:0; font-family:"avant"; color:#fff; }
 .website img{ width: 100%; max-width: 430px; height: auto; padding: 0px; box-sizing: border-box;}

.alinhaCases{ display: flex; flex-direction: column; justify-content: center; max-width: 90%; flex-wrap: wrap; margin: auto;margin-top: 0px;}
.titCase{ max-width: 75%; margin: auto;  margin-bottom: 60px; text-align: left !important;}
.alinhaCases article{ padding: 0px; margin:15px 2%; width: 96%;   }
.alinhaCases article:nth-child(odd){  margin:15px 2%;   width: 96%;  }
.alinhaCases article h3{ margin-bottom: 10px; text-align: center;font-size: 1.3em; line-height: 100%;  }
.alinhaCases article img{  position: relative; width: 100%; height: auto; display: block;  bottom: 0px; box-Shadow: 1px 2px 8px 0px rgba(153,153,153,0.67)}
.portfolio{ background-color: #fff; position: relative;    padding: 40px 0 90px; display: flex; flex-direction: column; align-items: center; z-index:60;}
 .portfolio h2{  text-align: left;font-size: 2.0em;   line-height: 100%;  margin: 0 0 60px; font-family: "avant";}
.portfolio h3{   margin: 0 0 5px; text-align: center}
.respiro{min-height: 200px; width: 100%;}


.topoCel{ background-color: #eee; width: 96%; min-height: 20px; margin:0 2%; }
.linhaCel li{ width: 29%; margin: 2%;  min-width: 60px; background-color: #eee; transition: all 1s ease-in-out;}
.linhaCel {  display: flex; flex-direction: row; justify-content: space-around; align-items: center; flex-wrap: wrap; padding: 20px 0;   }
.animaCel{ min-height: 250px;}
#containerCel{ position: relative;  height: auto;    display: flex; flex-direction: column;  justify-content: center;   } 
.txtSitesHome .far{ font-size: 2em;}
.ancora{ position: fixed; bottom: 70px; right: 25px; width: 22px; height: 24px; z-index: 99999;  display: none}
.ancora .fa-angle-double-up{color: #feb822; font-size: 1.6em;background-color: #011850 ;border-radius: 20px; padding: 5px 10px;}


@keyframes anima {
 0% {  width: 130px;   height: 241px; }
 10% {  width: 130px;   height: 241px; }
 30% {width: 200px;   height: 300px;}
 40% {width: 200px;   height: 300px;}
 60% {  width: 300px;   height: 241px;}
 70% {  width: 300px;   height: 241px;}
 100% {  width: 130px;   height: 241px; }
	
}

.smartphone {
  position: relative;
  width: 160px;
  height: 340px;
  margin: auto;
  border: 16px #011850 solid;
  border-top-width: 60px;
  border-bottom-width: 60px;
  border-radius: 36px; animation: anima 8s linear;   animation-iteration-count:infinite; overflow: hidden
}

/* The horizontal line on the top of the device */
.smartphone:before {
  content: '';
  display: block;
  width: 60px;
  height: 5px;
  position: absolute;
  top: -30px;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #fff;
  border-radius: 10px;
}

/* The circle on the bottom of the device */
.smartphone:after {
  content: '';
  display: block;
  width: 35px;
  height: 35px;
  position: absolute;
  left: 50%;
  bottom: -65px;
  transform: translate(-50%, -50%);
  background: #fff;
  border-radius: 50%;
}

/* The screen (or content) of the device */
.smartphone .content {
  width: 100%;
  height: 100%;
  background: white;
 
}	

 
 
.moving_shape {
    width: 100%;
    height: 100%;
    background: #FF0099;
    background: linear-gradient(270deg,#6008f0,#fe5e06,#fe0606, #fb7c00, #fede03);
    background-color: rgba(0, 0, 0, 0);
    background-repeat: repeat;
    background-size: auto auto;
    background-color:#ffd800;
    background-size: 1000%;
    background-repeat: repeat;
    color: #fff;
    animation: bg-move 30s linear infinite forwards, 
               border-move 15s linear infinite forwards;
}


.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.videosInterna{    background-color: #fff;padding: 20px 20px 50px; position: relative; z-index: 60  }


.text {   fill: none;   stroke-width: 6;   stroke-linejoin: round;   stroke-dasharray: 70 330;   stroke-dashoffset: 0;   -webkit-animation: stroke 6s infinite linear;   animation: stroke 6s infinite linear; }
.text:nth-child(5n + 1) {   stroke: #ff043f;   -webkit-animation-delay: -1.2s;   animation-delay: -1.2s; }
.text:nth-child(5n + 2) {   stroke: #381c75;   -webkit-animation-delay: -2.4s;   animation-delay: -2.4s; }
.text:nth-child(5n + 3) {   stroke: #E9F1DF;   -webkit-animation-delay: -3.6s;   animation-delay: -3.6s; }
.text:nth-child(5n + 4) {   stroke: #56D9CD;   -webkit-animation-delay: -4.8s;   animation-delay: -4.8s; }
.text:nth-child(5n + 5) {   stroke: #feb822;   -webkit-animation-delay: -6s;   animation-delay: -6s; }
@-webkit-keyframes stroke {  	100% {     stroke-dashoffset: -400;   } }
@keyframes stroke {  100% {    stroke-dashoffset: -400;  }}



.type-wrap{  transform: rotate(-0deg);    }
#typed{   font-size: 1.00em;  color: #011850;font-family: "avant"; }
.type-wrap span{ color: #011850; padding: 10px 0; }
.txtTyped{ font-size: 16px; font-weight: 300;font-family: 'Abel', sans-serif; font-style: italic; padding-right: 40px;}
.frasesBnr{ width:100%; font-size:1.0em;font-weight:300; font-family:'Abel', sans-serif; line-height:30px; padding:80px 0px 140px; user-select:none;margin-top: 40px; }
.txtBnrPrincipal{ position: relative;  width: 100%;      margin: auto; padding:0 20px; display: flex; flex-direction: row; justify-content: center; align-items: center;   }	
.palavra{  width:500px;  font-size:6em; line-height:100px; color:#eb1b2b; display: block;}
#container{ position:relative;  height: auto; height: 100vh;   overflow: hidden; z-index: 888; display: flex; flex-direction: column;  justify-content: center;   } 
#container .txtBnrPrincipal{ position: absolute;  width: 100%;  max-width: 40%;     margin: auto;padding:0 20px; display: flex; flex-direction: row; justify-content: center; align-items: center;max-width:1500px; box-sizing: border-box; padding: 0 40px;margin:auto; }
 
a.arrow:link{ position: absolute;  z-index:100; font-size:3em; left:50%;  color:#011850; border:#011850 solid 2px; }
a.arrow:visited{text-decoration:none; color:#011850;}
a.arrow:hover{text-decoration: none; color:#011850; }
a.arrow:active{text-decoration: none; color:#011850;}

 .bounce {  bottom: 75px; left: 50% ; width: 24px; height: 45px ; margin-left:0px;  	-webkit-border-radius:20px; -moz-border-radius:20px; -ms-border-radius:20px; border-radius:20px; 	display: flex; align-items: center; justify-content: center; cursor: pointer;position: absolute;z-index:888888; }
.traco{ position:relative;width: 2px; height: 8px; background-color: #011850; animation: bounce 2s infinite; -webkit-animation: bounce 2s infinite; -moz-animation: bounce 2s infinite; -o-animation: bounce 2s infinite;-webkit-border-radius:20px; -moz-border-radius:20px; -ms-border-radius:20px; border-radius:20px;
	z-index:998999889;   }

.beneficios .far{   font-size: 3.5em; padding:10px 20px; }
.beneficios{       padding: 0px 20px 50px; position: relative; }
.beneficiosTour li{  padding: 10px 20px; border-radius: 40px; display: flex; flex-direction: column; align-items: center;} 
.beneficiosTour{  max-width: 1000px; margin: auto; }
.alinhaTour > div {position: relative; margin: 20px 0;}
.alinhaVid > div {position: relative; margin: 20px 0;}
 .alinhaVid{ display: flex; flex-direction: column; align-items: center; justify-content: center; max-width: 1500px; margin: auto}
.alinhaTour{ display: flex; flex-direction: column; align-items: center; justify-content: center; max-width: 1500px; margin: auto}
.fotoVideo img{    width: 100%; min-width: 200px; height: auto;  display: block }	

.linkTour{}
a.linkTour:link{ position: relative;  display: inline-block;font-size:1.0em; letter-spacing: 1px;  margin-right: 10px; margin-bottom: 20px; color:#fff;font-weight: bold;  border-radius: 50px; background-color: #ca1734; padding: 15px;  }
a.linkTour:visited{text-decoration:none; color:#fff;}
a.linkTour:hover{text-decoration: none; color:#011850; font-weight: bold; }
a.linkTour:active{text-decoration: none; color:#fff;}

@media  screen and (max-width:580px) {
 	
}
	 
 
	 
/* min-width & max-width ( entre 767px e 950px )  TABLET*/ 
@media screen and (min-width: 581px) and (max-width: 950px) {
.alinhaTopo{  flex-direction: column; justify-content: space-between;align-items: center;  background-color: transparent;  max-width: 1500px; margin: auto; }		 
header nav ul{ display: flex; flex-direction: row;align-self: center; }
header nav ul li{ border-bottom: none;  }
.containerHamburger{  display: none}	
a.linMail:link { position:relative; text-decoration:none;  color:#011850; font-size: 1.8em; font-weight: bold; margin:0px 10px; display: block;}
.website h2{  text-align:left; font-size: 3.0em; margin:0; font-family:"avant"; color:#fff; }
.fotoVideo img{    width: 100%; min-width: 400px; height: auto;  display: block }	
.beneficiosTour li{  padding: 10px 20px; border-radius: 40px; display: flex; flex-direction: row; align-items: center;} 	
	
}
	 

/* min-width ( acima de 900px ) */  
@media screen and (min-width: 951px) {
.alinhaTopo{  flex-direction: row; justify-content: space-between;align-items: center;  background-color: transparent;  max-width: 1500px; margin: auto; }		
a.linkVid:link { position:relative; text-decoration:none;  color:#011850; font-size: 1.0em; font-weight: bold; margin:5px 10px 0px; display: block;}
.website{  padding:50px 0 50px;  flex-direction:row; justify-content: center; align-items: center;}
.website > div{  width: 100%; min-height: 250px; flex-direction:row; justify-content: center; align-items: center; padding: 50px;}	
.frasesBnr  {    max-width: 950px;   font-size: 2.5em; font-weight: 300;font-family: 'Abel', sans-serif; line-height: 60px;   padding:0 20px; user-select: none; }
#typed{   font-size: 1.35em;  color: #011850;font-family: "avant"; }
.txtTyped{ font-size: 24px; font-weight: 300;font-family: 'Abel', sans-serif; font-style: italic;}
.alinhaCases{ flex-direction: row; justify-content: center; max-width: 90%; flex-wrap: wrap; margin: auto;margin-top: 0px;}	
.alinhaCases article{ padding: 0px; margin:15px 2%; width: 46%;   }
.alinhaCases article:nth-child(odd){  margin: 2%;  width: 46%;  }	
.beneficiosTour li{  padding: 10px 20px; border-radius: 40px; display: flex; flex-direction: row; align-items: center;} 
.tour360 h2{  text-align: left;font-size: 2.0em;   line-height: 100%;   font-family: "avant";}	
.beneficios{       padding: 0px 20px 0px; position: relative; }
header{  background-color: transparent;     }
header nav { display: flex;   flex-direction: row; align-self:center;  padding: 10px 0 20px;   }
header nav ul{ display: flex; flex-direction: row;align-self: center; }
header nav ul li{ border-bottom: none;  }
.logo{   line-height: 60px; padding:20px 40px;   font-size: 3.7em;color: #eb1b2b;   }	
.containerHamburger{  display: none}	
.alinhaCasesHome{  flex-direction: row; justify-content: center; align-items: center; max-width: 90%; flex-wrap: wrap; margin: auto;}	
.alinhaCasesHome article{ padding: 0px; margin: 2%; width: 46%;  text-align: center  }
.alinhaCasesHome article:nth-child(odd){  margin: 2%;  width: 46%;  }
a.linMail:link { position:relative; text-decoration:none;  color:#011850; font-size: 1.8em; font-weight: bold; margin:0px 10px; display: block; }
.website h2{  text-align:left; font-size: 3.0em; margin:0; font-family:"avant"; color:#fff; }
.alinhaTour > div {position: relative; margin: 20px;}
.alinhaVid > div {position: relative; margin: 20px;}
.fotoVideo img{    width: 100%; min-width: 500px; height: auto;  display: block }
.beneficiosTour li{  padding: 10px 20px; border-radius: 40px;  flex-direction: row; align-items: center;} 
.fotoTour img{ width: 100%; min-width: 330px; height: auto; padding: 40px; box-sizing: border-box;}
	
 @keyframes anima {  0% {  width: 160px;   height: 341px; }  10% {  width: 160px;   height: 341px; }  30% {width: 288px;   height: 423px;}  40% {width: 288px;   height: 423px;}  60% {  width: 460px;   height: 341px;}  70% {  width: 460px;   height: 341px;}
}
	
}



.flex { /*Flexbox for containers*/
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.waves {
  position:relative;
  width: 100%;
  height:15vh;
  margin-bottom:-7px; /*Fix for safari gap*/
  min-height:100px;
  max-height:150px;
}

.content {
  position:relative;
  height:20vh;
  text-align:center;
  background-color: white;
}

/* Animation */
.bgAmarelo{background-color: rgba(254,184,34,1.00);}
.parallax > use {
  animation: move-forever 25s cubic-bezier(.55,.5,.45,.5)     infinite;
}
.parallax > use:nth-child(1) {
  animation-delay: -2s;
  animation-duration: 7s;
}
.parallax > use:nth-child(2) {
  animation-delay: -3s;
  animation-duration: 10s;
}
.parallax > use:nth-child(3) {
  animation-delay: -4s;
  animation-duration: 13s;
}
.parallax > use:nth-child(4) {
  animation-delay: -5s;
  animation-duration: 20s;
}
@keyframes move-forever {
  0% {
   transform: translate3d(-90px,0,0);
  }
  100% { 
    transform: translate3d(85px,0,0);
  }
}
/*Shrinking for mobile*/
@media (max-width: 768px) {
  .waves {
    height:40px;
    min-height:40px;
  }
  .content {
    height:30vh;
  }
  h1 {
    font-size:24px;
  }
}