
 


 	 
   .logoAni {
	   margin: 0 auto;
  width: 12.5px;
  aspect-ratio: 1;
  --c: no-repeat linear-gradient(to right ,#fff calc(50% - 10px),#50a7dd 0 calc(50% + 10px),#fff 0);
  background: 
    var(--c) 100% 0% border-box,  
    var(--c) 100% 50% border-box, 
    var(--c) 100% 100% border-box; 
  background-size: calc(200% + 20px) 19% ;
  height: 10.5px;
 
  
  
   animation: l4 3s infinite linear;
 }
 
 
  .loaderbar {
  width: 23px;
  aspect-ratio: 1;
  --c: no-repeat linear-gradient(to right ,#50a7dd calc(50% - 10px),#fff 0 calc(50% + 10px),#50a7dd 0);
  background: 
    var(--c) 100% 0% border-box,  
    var(--c) 100% 50% border-box, 
    var(--c) 100% 100% border-box; 
  background-size: calc(200% + 20px) 20% ;
  height: 18px;

  top: 18px;
  left: 23px;
    position: absolute;
  z-index: 999999;
   animation: l4 3s infinite linear;
 }
  
@keyframes l4 {
    0%   {background-position:   100% 0%, 100% 50%,    100% 100%}
    33%   {background-position:   0% 0%, 50% 50%,    100% 100%}
    50%  {background-position:   0% 0%, 0% 50%,  	80% 100%}
    80%  {background-position:   0% 0%, 0% 50%,  	80% 100%}
    100% {background-position:   0% 0%, 0% 50%,    0% 100%}
 
 }

 
 
  .mover{
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    bottom: 0;
         text-align: center;
    overflow: hidden;
 }


@keyframes mover {
  0% {
    transform: translate(0px, 0px) rotate(0deg);
  }
   
     
  25% {
    transform: translate(100px, 20px) rotate(2deg);
  }
  
  50% {
    transform: translate(-100px, -10px) rotate(-1deg);
  }
  
  75% {
    transform: translate(40px, -20px) rotate(-2deg);
  }
   
  100% {
    transform: translate(0px, 0px) rotate(0deg);
  }
}



.boleto {
  position: absolute;
  top: 45%;
  margin-left: -40px;
  left: 50%;
  animation: speeder 1s linear infinite;
}
.boleto > .lospan {
  height: 51px;
  width: 70px;
  background-image:url('../images/new/IconCoverv9.svg');
  
 background-repeat: no-repeat;
  position: absolute;
  top: 0px;
  left: 8px;
  z-index: 999;
 }

  

.boleto > span > span:nth-child(1),
.boleto > span > span:nth-child(2),
.boleto > span > span:nth-child(3),
.boleto > span > span:nth-child(4),
.boleto > span > span:nth-child(5) {
  width: 30px;
  height: 3px;
  background: #fff;
  position: absolute;
  color: #fff;
 }



.boleto > span > span:nth-child(1) {
  top: 7px;
  
  animation: fazer1 0.2s linear infinite;
    animation-delay: -1s;

}


.boleto > span > span:nth-child(2) {
  top: 17px;
  animation: fazer2 0.3s linear infinite;
   animation-delay: -1.5s;
}

.boleto > span > span:nth-child(3) {
  top: 25px;
  animation: fazer3 0.2s linear infinite;
 
}

.boleto > span > span:nth-child(4) {
  top: 35px;
  animation: fazer4 0.3s linear infinite;
   animation-delay: -1.5s;
  
 }

.boleto > span > span:nth-child(5) {
  top: 40px;
  animation: fazer5 0.3s linear infinite;
    animation-delay: -1s;

 }

@keyframes fazer1 {
  0% {
    left: 10px;
  }
  100% {
    left: -180px;
    opacity: 0;
  }
}
@keyframes fazer2 {
  0% {
    left: 5px;
  }
  100% {
    left: -300px;
    opacity: 0;
  }
}
@keyframes fazer3 {
  0% {
    left: 0;
  }
  100% {
    left: -150px;
    opacity: 0;
  }
}
@keyframes fazer4 {
  0% {
    left:5px;
  }
  100% {
    left: -300px;
    opacity: 0;
  }
}
@keyframes fazer5 {
  0% {
    left: 10px;
  }
  100% {
    left: -180px;
    opacity: 0;
  }
}
@keyframes speeder {
  0% {
    transform: translate(2px, 1px) rotate(0deg);
  }
  10% {
    transform: translate(-1px, -3px) rotate(-1deg);
  }
  20% {
    transform: translate(-2px, 0px) rotate(1deg);
  }
  30% {
    transform: translate(1px, 2px) rotate(0deg);
  }
  40% {
    transform: translate(1px, -1px) rotate(1deg);
  }
  50% {
    transform: translate(-1px, 3px) rotate(-1deg);
  }
  60% {
    transform: translate(-1px, 1px) rotate(0deg);
  }
  70% {
    transform: translate(3px, 1px) rotate(-1deg);
  }
  80% {
    transform: translate(-2px, -1px) rotate(1deg);
  }
  90% {
    transform: translate(2px, 1px) rotate(0deg);
  }
  100% {
    transform: translate(1px, -2px) rotate(-1deg);
  }
}

.pixeles {
  position: fixed;
  width: 100%;
  height: 100%;
}
.pixeles span {
  position: absolute;
  height: 5px;
  width: 20%;
  background: #fff;
}
.pixeles span:nth-child(1) {
  top: 20%;
  animation: lf 0.6s linear infinite;
  animation-delay: -5s;
}
.pixeles span:nth-child(2) {
  top: 40%;
  animation: lf2 0.8s linear infinite;
  animation-delay: -1s;
}
.pixeles span:nth-child(3) {
  top: 60%;
  animation: lf3 0.6s linear infinite;
}
.pixeles span:nth-child(4) {
  top: 80%;
  animation: lf4 0.5s linear infinite;
  animation-delay: -3s;
}

@keyframes lf {
  0% {
    left: -200%;
  }
  100% {
    left: 200%;
    opacity: 0;
  }
}
@keyframes lf2 {
  0% {
    left: -200%;
  }
  100% {
    left: 200%;
    opacity: 0;
  }
}
@keyframes lf3 {
  0% {
    left: -200%;
  }
  100% {
    left: 100%;
    opacity: 0;
  }
}
@keyframes lf4 {
  0% {
    left: -200%;
  }
  100% {
    left: 100%;
    opacity: 0;
  }
}
 
 
 
 	  .LogoAdmpointW{
		 background-image: url('../images/new/AdmPointW.svg');
width: 109px;
height: 20px;
position: relative;
display: inline-block;
background-repeat: no-repeat;
padding-left:22px;
top: 4px;
	 }
	 .LogoAdmpoint{
		 background-image: url('../images/new/AdmPoint.svg');
width: 109px;
height: 20px;
position: relative;
display: inline-block;
background-repeat: no-repeat;
padding-left:22px;
top: 4px;
	 }
	.LogoAdmpoint span{ 
		color: #03a3b4;
	}
.plAdmPoint{
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    bottom: 0;
    background-color:var(--light-purple);
    z-index: 999999;
    text-align: center;
    overflow: hidden;
 }

 
 @keyframes mover {
  0% {
    transform: translate(-100px, 10px) rotate(0deg);
  }
   
     
  25% {
    transform: translate(100px, 20px) rotate(2deg);
  }
  
  50% {
    transform: translate(-100px, -10px) rotate(-1deg);
  }
  
  75% {
    transform: translate(100px, -20px) rotate(-1deg);
  }
   
  100% {
    transform: translate(-100px, 10px) rotate(0deg);
  }
}


 