#how_work .how_box h3 {

font-weight: 700;

}



#headline {
	font-size: 40px;
	color: #ffffff;
	font-family: "Menda", Sans-serif;
	text-transform: none;
	font-weight: 900;
  }
  
  .highlight {
	color: #b6ff4c;
	font-size: 80px;  
	font-family: "Menda", Sans-serif;
	font-weight: 900;
  }
  
  
  
  
  .price-all{
    color: #000;    
    font-size: 20px;
    font-family: "Menda", Sans-serif;
    
}

.price-plan{
    color: #6bad02;
    font-weight: 700;
    font-size: 40px;
	font-family: "Menda", Sans-serif;

}



.price-all-plus{
    color: #fff;    
    font-size: 20px;
    font-family: "Menda", Sans-serif;
    
}

.price-plan-plus{
    color: #bbff4f;
    font-weight: 700;
    font-size: 40px;

}


.price-all{
    color: #000;
    
    font-size: 20px;
    font-family: "Menda Bold", Sans-serif;
    
}

.price-plan{
    color: #6bad02;
    font-weight: 600;
    font-size: 40px;

}

  
  
  
  
  .highlight-underline {
	position: relative;
	z-index: 1; /* Garante que o conteúdo fique acima da imagem */
	display: inline-block; /* Garante que o conteúdo se ajuste corretamente */
  }
  
  .highlight-underline::before {
	content: "";
	position: absolute;
	top: 50%; /* Posiciona o fundo no meio da altura */
	left: -30px;
	width: 190%; /* Garante que a imagem cubra toda a largura do contêiner */
	height: 150%; /* Ajuste para que a altura da imagem não seja cortada */
	background-image: url('/wp-content/uploads/brush.png');
	background-size: contain; /* Faz com que a imagem se ajuste dentro do espaço */
	background-position: center;
	background-repeat: no-repeat;
	z-index: -1;
	transform: translateY(-50%); /* Centraliza verticalmente a imagem */
  }
  
  

  




/* Definindo a animação */
.herobg {
 
	margin: 0;
	background: radial-gradient(circle closest-side, #9cff00, #bbff4f); /* Ajuste para manter bordas arredondadas */
	background-size: 100%; /* Agora o tamanho da bola será ajustado automaticamente */
	background-repeat: no-repeat;
	animation: moverGradienteHerobg 3s ease infinite;
  }
  
  /* Definindo os keyframes de animação */
  @keyframes moverGradienteHerobg {
	0% {
	  background-position: 50% 50%;
	}
	25% {
	  background-position: 0% 30%;
	}
	50% {
	  background-position: 90% 0%;
	}
	75% {
	  background-position: 90% 10%;
	}
	100% {
	  background-position: 50% 50%;
	}
  }
  
  
  
  
  
  /* Estilo do contêiner do texto */
  .text-slider-top {
	width: 100%; /* Faz o contêiner ocupar toda a largura disponível */
	overflow: hidden; /* Esconde o texto que está fora do contêiner */
	white-space: nowrap; /* Garante que o texto não será quebrado em várias linhas */
  }
  
  /* Estilo do texto que será deslizante */
  .text-slider-top p {
	display: inline-block; /* Faz com que o texto ocupe apenas uma linha */
	animation: slideText 15s linear infinite; /* Aplica a animação contínua */
  }
  
  /* Definindo a animação */
  @keyframes slideText {
	0% {
	  transform: translateX(100vw); /* Começa completamente fora da tela à direita */
	}
	100% {
	  transform: translateX(-60vw); /* Vai até fora da tela à esquerda */
	}
  }
  
  
  
  
  
  
  
  
  .text-slider-top2 {
	width: 100%; /* Faz o contêiner ocupar toda a largura disponível */
	overflow: hidden; /* Esconde o texto que está fora do contêiner */
	white-space: nowrap; /* Garante que o texto não será quebrado em várias linhas */
  }
  
  /* Estilo do texto que será deslizante */
  .text-slider-top2 p {
	display: inline-block; /* Faz com que o texto ocupe apenas uma linha */
	animation: slideText2 15s linear infinite; /* Aplica a animação contínua */
  }
  
  /* Definindo a animação */
  @keyframes slideText2 {
	0% {
	  transform: translateX(-45vw); /* Começa completamente fora da tela à esquerda */
	}
	100% {
	  transform: translateX(100vw); /* Vai até fora da tela à direita */
	}
  }
  
  
  
  
  
  
  
  
  /* Contêiner da imagem */
  .my-image-container {
	position: relative; /* Torna o contêiner o ponto de referência para o texto */
	width: 100%; /* Ajuste conforme necessário */
	height: auto;
  }
  
  /* A imagem */
  .my-image {
	width: 100%; /* Ajuste conforme necessário */
	height: auto;
	display: block;
	position: relative; /* Deixa a imagem no fluxo normal */
	z-index: 1; /* Coloca a imagem acima do texto */
  }
  
  
  

  





.e-card {
  margin: 100px auto;
  background: #bcff50;
  box-shadow: 0px 8px 28px -9px rgba(0,0,0,0.45);
  position: relative;
  width: 80%;
  height: 330px;
  border-radius: 16px;
  overflow: hidden;
  color:#000;

  
}

.wave {
  position: absolute;
  width: 540px;
  height: 700px;
  opacity: 0.6;
  left: 0;
  top: 0;
  margin-left: -32%;
  margin-top: -30%;
  background: linear-gradient(744deg, #4cff62, #BCFF50 60%, #28f985);
}



.infotop {
    text-align: center;
    font-size: 20px;
    position: absolute;
    max-width: 520px;
    top: 5.6em;
    left: 0;
    right: 0;
    color: #013c3d;
    font-weight: 900;
    font-family: "Menda", Sans-serif;
    margin: auto;
	 color: #000;
}

.infotop2 {
    text-transform: uppercase;
    font-size: 51px;
    line-height: 40px;
}


.infotop3 {
    line-height: 22px;
    margin-top: 17px;
    font-family: 'Montserrat';
}


.wave:nth-child(2),
.wave:nth-child(3) {
  top: 210px;
}

.playing .wave {
  border-radius: 40%;
  animation: wave 9000ms infinite linear;
}

.wave {
  border-radius: 40%;
  animation: wave 5555ms infinite linear;
}

.playing .wave:nth-child(2) {
  animation-duration: 8000ms;
}

.wave:nth-child(2) {
  animation-duration: 50s;
}

.playing .wave:nth-child(3) {
  animation-duration: 85000ms;
}

.wave:nth-child(3) {
  animation-duration: 45s;
}

@keyframes wave {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}



.e-card.playing::before {
  content: "";
  position: absolute;
  top: -10px; /* Posiciona a barra logo acima da seção */
  left: 0;
  width: 100%;
  height: 10px; /* Ajuste a altura conforme necessário */
  background-color: #00FF00; /* Cor da barra (modifique conforme necessário) */
}








/* Css botão /////////////////////////////////////////////// */

#botao.rox .animated-button {
  color: rgb(255, 255, 255);
  font-family: "Menda", Sans-serif;
  background-color: #370977;
  font-weight: 700;
  border: 0px;
  font-size: clamp(0.7rem, 1vw, 1rem);

}

#botao.rox .animated-button svg {

  fill: rgb(255, 255, 255);

}






#botao .animated-button {
  position: relative;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 16px 36px;
  border: 4px solid;
  border-color: transparent;
  font-size: 16px;
  background-color: inherit;
  border-radius: 100px;
  font-weight: 600;
  color: greenyellow;
  box-shadow: 0 0 0 2px greenyellow;
  cursor: pointer;
  overflow: hidden;
  transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1);
  font-family: "Menda", Sans-serif;
  font-weight: 900;
  letter-spacing:1px;
  text-transform: none;
}

#botao .animated-button svg {
  position: absolute;
  width: 24px;
  fill: greenyellow;
  z-index: 9;
  transition: all 0.8s cubic-bezier(0.23, 1, 0.32, 1);
}

#botao .animated-button .arr-1 {
  right: 16px;
}

#botao .animated-button .arr-2 {
  left: -25%;
}

#botao .animated-button .circle {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 20px;
  height: 20px;
  background-color: greenyellow;
  border-radius: 50%;
  opacity: 0;
  transition: all 0.8s cubic-bezier(0.23, 1, 0.32, 1);
}

#botao .animated-button .text {
  position: relative;
  z-index: 1;
  transform: translateX(-12px);
  transition: all 0.8s cubic-bezier(0.23, 1, 0.32, 1);
}

#botao .animated-button:hover {
  box-shadow: 0 0 0 12px transparent;
  color: #212121;
  border-radius: 30px;
}

#botao .animated-button:hover .arr-1 {
  right: -25%;
}

#botao .animated-button:hover .arr-2 {
  left: 16px;
}

#botao .animated-button:hover .text {
  transform: translateX(12px);
}

#botao .animated-button:hover svg {
  fill: #212121;
}

#botao .animated-button:active {
  scale: 0.95;
  box-shadow: 0 0 0 4px greenyellow;
}

#botao .animated-button:hover .circle {
  width: 320px;
  height: 220px;
  opacity: 1;
}



/* /////////////////////////////////////////////// */







.typing-effect {
  font-family: 'Courier New', Courier, monospace; /* Fonte de estilo "máquina de escrever" */
  font-size: 24px;
  white-space: nowrap;
  overflow: hidden;
  border-right: 2px solid #000; /* Simula o cursor piscando */
  width: 0;
  animation: typing 15s steps(30) 10s infinite, blink 3s step-end infinite;
}

/* Efeito de digitação */
@keyframes typing {
  0% {
    width: 0;
  }
  50% {
    width: 100%;
  }
  100% {
    width: 0;
  }
}

/* Efeito do cursor piscando */
@keyframes blink {
  50% {
    border-color: transparent;
  }
}







/* ///////ANIMA COMO//////////////////////////////////////// */


.main span{
	margin: 0 15px;
	line-height: .7;
	text-shadow: 0 0 2px rgba(0, 0, 0, .45);
	animation: span 3s ease-in infinite alternate;
}
.main{
	display: flex;
	justify-content: center;
	align-items: flex-start;
  font-family: "Menda", Sans-serif;
  color:#fff;
  font-size: 12em;
  font-weight: 900;
  	

}
.main .letter{
	display: inline-flex;
	height: 130px;
	width: 80px;
	/* border: 2.5px solid #FF1EAD; */
	border: 40px solid rgb(255, 255, 255);
	border-radius: 100px;
	box-shadow:
		0 0 2px rgba(255, 255, 255, 0.75),
		inset 0 0 2px rgba(255, 255, 255, 0.45);

	animation: letter 3s ease-in-out infinite alternate;
}
@keyframes span {
	0%,30%{ margin: 0 15px; }
	70%,100%{ margin: 0 5px; }
}
@keyframes letter {
	0%,30%{ width: 180px; }
	70%,100%{ width: 30vw; }
}








/* ////////////Pay bottom/////////////////////////////////// */










#botton-plan {
	display: flex;
	flex-direction: column;
	transform: rotatex(10deg);
	animation: rotateAngle 6s linear infinite;
}

#botton-plan .elementor-button {
	display: block;
	position: relative;

	cursor: pointer;

  width: 74%;
  margin: auto;
	mix-blend-mode: color-dodge;
	perspective: 500px;
	transform-style: preserve-3d;

	&:before, &:after {
		--z: 0px;
		position: absolute;
		top: 0;
		left: 0;
		display: block;
		content: '';
		width: 100%;
		height: 100%;
		opacity: 0;
		mix-blend-mode: inherit;
		border-radius: inherit;
		transform-style: preserve-3d;
		transform: translate3d(
			calc(var(--z) * 0px), 
			calc(var(--z) * 0px), 
			calc(var(--z) * 0px)
		);
	}
	
  #botton-plan .elementor-button	span {
		mix-blend-mode: none;
		display: block;
	}
	
	&:after {
		background-color: #01a718;
	}
	
	&:before {
		background-color: #2ff52f;
	}
	
	&:hover {
	
		transition: background .3s 0.1s;
	}
	
	&:hover:before {
		--z: 0.04;
		animation: translateWobble 2.2s ease forwards;
	}
	
	&:hover:after {
		--z: -0.06;
		animation: translateWobble 2.2s ease forwards;
	}
}

@keyframes rotateAngle {
	0% {
		transform: rotateY(0deg) rotateX(10deg);
		animation-timing-function: cubic-bezier(0.61, 1, 0.88, 1);
	}
	25% {
		transform: rotateY(30deg) rotateX(10deg);
	}
	50% {
		transform: rotateY(0deg) rotateX(10deg);
		animation-timing-function: cubic-bezier(0.61, 1, 0.88, 1);
	}
	75% {
		transform: rotateY(-30deg) rotateX(10deg);
	}
	100% {
		transform: rotateY(0deg) rotateX(10deg);
	}
}

@keyframes translateWobble {
  0% {
		opacity: 0;
		transform: translate3d(
			calc(var(--z) * 0px), 
			calc(var(--z) * 0px), 
			calc(var(--z) * 0px)
		);
  }
  16% {
		transform: translate3d(
			calc(var(--z) * 160px), 
			calc(var(--z) * 160px), 
			calc(var(--z) * 160px)
		);
  }
  28% {
		opacity: 1;
		transform: translate3d(
			calc(var(--z) * 70px), 
			calc(var(--z) * 70px), 
			calc(var(--z) * 70px)
		);
  }
  44% {
		transform: translate3d(
			calc(var(--z) * 130px), 
			calc(var(--z) * 130px), 
			calc(var(--z) * 130px)
		);
  }
  59% {
		transform: translate3d(
			calc(var(--z) * 85px), 
			calc(var(--z) * 85px), 
			calc(var(--z) * 85px)
		);
  }
  73% {
		transform: translate3d(
			calc(var(--z) * 110px), 
			calc(var(--z) * 110px), 
			calc(var(--z) * 110px)
		);
  }
	88% {
		opacity: 1;
		transform: translate3d(
			calc(var(--z) * 90px), 
			calc(var(--z) * 90px), 
			calc(var(--z) * 90px)
		);
  }
  100% {
		opacity: 1;
		transform: translate3d(
			calc(var(--z) * 100px), 
			calc(var(--z) * 100px), 
			calc(var(--z) * 100px)
		);
  }
}









/* /////////////////////Letreiro marquee////////////////////////// */






.marquees {
	align-content: center;
	height: 100%;
	display: grid;
	gap: 0vw;
	overflow: hidden;
  }

.marquee {

	--marquee--repeat-count: 12;
	--marquee--base-duration: 1s;
	--marquee--repeat-size: calc(100% / var(--marquee--repeat-count));
	--marquee--double-size: calc(var(--marquee--repeat-size) * 2);
	--marquee--duration: calc(
		var(--marquee--base-duration) * var(--char-count, 20)
	);
	overflow: hidden;
	width: 110%;
	margin-left: -5%;
	
	transform: rotate(0deg); /* Esse é o rotate do odd */
	background: var(--marquee--colour);
	color: #000;
	padding-bottom: 3px;
  }
  .marquee:nth-child(even) { /* Isso aqui é bem legal, ele entende a sequencia de even e odd, odd é o default e o even é configurado aqui, isso é maseado no class, se tiver mais que dois, ele continua intercalando */
	--marquee--direction: -1;
	transform: rotate(0deg);

	color: var(--marquee--colour);
  }


  
  .marquee p {
	transform: translateY(0.07em);
	font-weight: bold;
	margin: 0;
	display: flex;
	gap: 0.5em;
	line-height: 1.1;
	font-size: clamp(1.5rem, 8vw, 2rem);
	font-family: "Menda", Sans-serif;
	font-weight: 900;
	/* An empty psuedo element creates a gap after the last element */
  }
  .marquee p::after {
	content: "*";
	transform: translateY(0.175em);
  }
  .marquee p::before {
	content: "";
  }
  
  .marquee--inner {
	width: max-content;
	display: flex;
	
  }
  @media (prefers-reduced-motion: no-preference) {
	.marquee--inner {
	  animation: marquee var(--marquee--duration) infinite linear, reduce-marquee var(--marquee--duration) infinite linear paused;
	  animation-composition: add;
	}
	.marquee--inner:hover {
	  animation-play-state: running;
	}
  }
  
  @keyframes marquee {
	from {
	  transform: translateX(calc( 		(-1 * var(--marquee--double-size)) - 			(var(--marquee--double-size) * var(--marquee--direction, 1)) 	));
	}
	to {
	  transform: translateX(calc(var(--marquee--double-size) * -1));
	}
  }
  @keyframes reduce-marquee {
	from {
	  transform: translateX(calc(var(--marquee--repeat-size) * var(--marquee--direction, 1)));
	}
	to {
	  transfrom: translateX(calc(var(--marquee--double-size) * -1));
	}



  }





/* ///////////////////////////////////////////// */




/* /////Letreiro Portfolio//////////////////////////////////////// */





#portfolio .marquees {
	align-content: center;
	height: 100%;
	display: grid;
	gap: 0vw;
	overflow: hidden;
  padding-top: 45px;
  }

  #portfolio .marquee {

	--marquee--repeat-count: 6;
	--marquee--base-duration: 2s;
	--marquee--repeat-size: calc(200vw / var(--marquee--repeat-count));
	--marquee--double-size: calc(var(--marquee--repeat-size) * 2);
	--marquee--duration: calc(
		var(--marquee--base-duration) * var(--char-count, 20)
	);
	overflow: hidden;
	width: 115%;
	margin-left: -5%;
	
	transform: rotate(-20deg); /* Esse é o rotate do odd */
	background: var(--marquee--colour);
	color: #000;
	padding-bottom: 3px;
  }
  #portfolio .marquee:nth-child(even) { /* Isso aqui é bem legal, ele entende a sequencia de even e odd, odd é o default e o even é configurado aqui, isso é maseado no class, se tiver mais que dois, ele continua intercalando */
	--marquee--direction: -1;
	transform: rotate(-20deg);

	color: var(--marquee--colour);
  }


  
  #portfolio .marquee p {
	transform: translateY(0.07em);
	font-weight: bold;
	margin: 0;
	display: flex;
	gap: 0em;
	line-height: 1.1;
	font-size: clamp(1.5rem, 8vw, 2rem);
	font-family: "Menda", Sans-serif;
	font-weight: 900;
	/* An empty psuedo element creates a gap after the last element */
  height: clamp(11rem, 20vw, 30rem);
  }
  #portfolio .marquee p::after {
	content: "";
	transform: translateY(0.175em);
  }
  #portfolio .marquee p::before {
	content: "";
  }
  
  #portfolio .marquee--inner {
	width: max-content;
	display: flex;
	
  }
  @media (prefers-reduced-motion: no-preference) {
    #portfolio .marquee--inner {
	  animation: marquee2 var(--marquee--duration) infinite linear, reduce-marquee2 var(--marquee--duration) infinite linear paused;
	  animation-composition: add;
	}
	#portfolio .marquee--inner:hover {
	  animation-play-state: running;
	}
  }
  
  @keyframes marquee2 {
	from {
	  transform: translateX(calc( 		(-1 * var(--marquee--double-size)) - 			(var(--marquee--double-size) * var(--marquee--direction, 1)) 	));
	}
	to {
	  transform: translateX(calc(var(--marquee--double-size) * -1));
	}
  }
  @keyframes reduce-marquee2 {
	from {
	  transform: translateX(calc(var(--marquee--repeat-size) * var(--marquee--direction, 1)));
	}
	to {
	  transfrom: translateX(calc(var(--marquee--double-size) * -1));
	}



  }
















/* ///////////////////////////////////////////// */




.text-slider-top3 {
  white-space: nowrap;
  overflow: hidden;
  position: relative;
}

.text-slider-top3 p {
  font-family: "Menda", Sans-serif;
  font-weight: 900;
  display: inline-block;
  font-size: 30px; /* Ajuste o tamanho da fonte */
  
  animation: scroll-left1 30s linear infinite; /* Usando scroll-left para o movimento da esquerda para a direita */
}

@keyframes scroll-left1 {
  0% {
    transform: translateX(-600px); /* Começa fora da tela à esquerda */
  }
  100% {
    transform: translateX(35px); /* Vai para fora da tela à direita */
  }
}



.text-slider-top4 {
  white-space: nowrap;
  overflow: hidden;
  position: relative;
  margin-top: -40px; 
}

.text-slider-top4 p {
  font-family: "Menda Black", Sans-serif;
  display: inline-block;
  font-size: 30px; /* Ajuste o tamanho da fonte */
  animation: scroll-right 30s linear infinite; /* Usando scroll-left para o movimento da esquerda para a direita */
}

@keyframes scroll-right {
  0% {
    transform: translateX(0px); /* Começa fora da tela à esquerda */
  }
  100% {
    transform: translateX(-635px); /* Vai para fora da tela à direita */
  }
}



.slide_one{
color: #000;
}

.slide_two{
color: #aeaeae;
}





#faq .e-n-accordion-item-title{
	
	    border-radius: 40px;
		background-color:#fff;
		border:none;
}

#faq .e-n-accordion-item .e-con{
	
	border:none;

}

#faq .e-n-accordion-item{
margin-top: 10px;
}







@media (min-width: 1025px) and (max-width: 1150px) {
    /* Exemplo de estilos para telas entre 1025px e 1150px */
    


body:not(.rtl) .elementor-207 .elementor-element.elementor-element-e91c770 {
    right: 337px;
}




.elementor-207 .elementor-element.elementor-element-d6abdd3 {

    top: -230px;

}

body:not(.rtl) .elementor-207 .elementor-element.elementor-element-d6abdd3 {
    left: 67px;
}


body:not(.rtl) .elementor-207 .elementor-element.elementor-element-4d050d6 {
    right: 160px;
}




.elementor-207 .elementor-element.elementor-element-4d050d6 {

    top: -240px;
}







}











@media (min-width: 768px) and (max-width: 1024px) {
    /* Seus estilos específicos para telas entre 768px e 1024px Tabelt */ 
	
	
#problemas{
	background-image:none;
}



#com_bliva .box_green{
	--position:static;
}




.title_all::after {
  content: "";
  position: absolute;
  top:20px;
  bottom: 0px; /* Alinha a imagem ao fundo da div */
  right: 20px; /* Alinha a imagem à direita da div */
  width: 300px; /* Ajuste o tamanho da imagem conforme necessário */
  height: 180px; /* Ajuste o tamanho da imagem conforme necessário */
  background-image: url('/bliva/wp-content/uploads/perfect-design.png');
  background-size: contain; /* Faz com que a imagem se ajuste ao tamanho */
  background-repeat: no-repeat; /* Impede que a imagem se repita */
  z-index: 1; /* Garante que a imagem fique sobreposta ao conteúdo da div */
}








.main{

  font-size: 8em;
  	

}
.main .letter{
	display: inline-flex;
	height: 85px;
	width: 90px;
	/* border: 2.5px solid #FF1EAD; */
	border: 23px solid rgb(255, 255, 255);
	border-radius: 50px;
	box-shadow:
		0 0 2px rgba(255, 255, 255, 0.75),
		inset 0 0 2px rgba(255, 255, 255, 0.45);

	animation: letter 3s ease-in-out infinite alternate;
}
@keyframes span {
	0%,30%{ margin: 0 0px; }
	70%,100%{ margin: 0 5px; }
}
@keyframes letter {
	0%,30%{ width: 130px; }
	70%,100%{ width: 30vw; }
}







}

























@media (max-width: 767px) {


  #portfolio .marquee {

    --marquee--base-duration: 0.5s;
  }

  #portfolio .marquees {
    padding-top: 122px;
}

 .typing-effect p{
    font-size: 0.9em;
  }

#how_work .how_box {
 max-width: 328px;
}
 
 
 #headline{
	 font-size:8vw;
 }
 
#headline .highlight{
	font-size:10vw;
}


#problemas{
	background-image:none;
}


#headline2{
	 font-size:10vw;
}
#headline2 .highlight-brand{
		font-size:14vw;
}


#com_bliva .box_green{
	--position:static;
}




.title_all::after {
  content: "";
  position: absolute;
  top:90px;
  bottom: 0px; /* Alinha a imagem ao fundo da div */
  right: 20px; /* Alinha a imagem à direita da div */
  width: 167px; /* Ajuste o tamanho da imagem conforme necessário */
  height: 180px; /* Ajuste o tamanho da imagem conforme necessário */
  background-image: url('/bliva/wp-content/uploads/perfect-design.png');
  background-size: contain; /* Faz com que a imagem se ajuste ao tamanho */
  background-repeat: no-repeat; /* Impede que a imagem se repita */
  z-index: 1; /* Garante que a imagem fique sobreposta ao conteúdo da div */
}







.service_list .even {
    background-color: #f3f3f3;
}

.service_list .odd {
    background-color: #f3f3f3;
}


.box_green::after {
    left: -10px;
	content:none;
}



#stop .txt1{
	font-size: 17vw;
}

#stop .txt2{
    font-size: 9vw;
	margin-top: 23px;
}
#stop .txt3{
    font-size: 9vw;
	    line-height: 37px;
}








#contacto .elementor-icon-box-icon {
  display: flex;
  justify-content: center;  /* Alinha horizontalmente */
  align-items: center;      /* Alinha verticalmente */
  height: 100%;             /* Garante que o elemento ocupe toda a altura disponível */
  margin-left:19px;
  margin-top:10px;
}








.main{

  font-size: 4em;
  	

}
.main .letter{
	display: inline-flex;
	height: 38px;
	width: 90px;
	/* border: 2.5px solid #FF1EAD; */
	border: 15px solid rgb(255, 255, 255);
	border-radius: 20px;
	box-shadow:
		0 0 2px rgba(255, 255, 255, 0.75),
		inset 0 0 2px rgba(255, 255, 255, 0.45);

	animation: letter 3s ease-in-out infinite alternate;
}
@keyframes span {
	0%,30%{ margin: 0 0px; }
	70%,100%{ margin: 0 5px; }
}
@keyframes letter {
	0%,30%{ width: 100px; }
	70%,100%{ width: 100vw; }
}










.e-card {

  width: 100%;
  height: 350px;

}
.infotop2 {
  font-size: 34px;
  line-height: 32px;
  width: 80%;
  margin: auto;
}


.infotop3{
  font-size: 18px;
  line-height: 21px;
  width: 80%;
  margin: auto;
  margin-top: 16px;

}


.wave {

  margin-left: -80%;
}




#botao .animated-button{

  font-size: 3.6vw;
  
}







#botao.rox .animated-button{

  font-size: 3vw;
}








 
 }