.block_loader{
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgb(197 197 197);
}
.loader_pulse{
    animation: 0.4s pulse infinite; 
    animation-iteration-count:4;
    animation-delay: 3s;
    position: absolute;
    top: 50%;
    left: 50%;   
    transform: translate(-50%,-50%);
    width: 400px;
    height: 400px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 0 0 rgba(204,169,44, 0.4);
}
.loader_circele{
    animation: 5s circle ; 
    animation-iteration-count:1;
    animation-delay: 0s;
    position: absolute;
    top: 50%;
    left: 50%;   
    transform: translate(-50%,-50%);
    width: 400px;
    height: 400px;
    background: #fff;
    border-radius: 50%;
}
.loader_text{
    position: fixed;
    text-align: center;
    font-family: "Audiowide", sans-serif;
    animation: 1s loader_text;
    animation-delay: 4.5s;
    animation-fill-mode: forwards;
    opacity: 0;
    /* margin-top: 41%; */
    left: 50%;
    bottom: 30px;
    transform: translate(-50%, 0);
    
}
.item_loader{
    position: absolute;
}
.png_3{
    animation: 1s png_3 ; 
    top: -100%;
    transform: translate(-50%,-50%);
    width: 350px;
    animation-fill-mode:forwards;
}
.png_1{
    animation: 0.5s png_1 ; 
    animation-delay: 1.25s;
    top: calc(-100%);
        left: calc(-100%);
    transform: translate(-50%,-50%);
    width: 115px;
    animation-fill-mode:forwards;
}
.png_2{
    animation: 0.5s png_2 ; 
    animation-delay: 2s;
    top: calc(-100%);
        right: calc(-100%);
    transform: translate(-50%,-50%);
    width: 115px;
    animation-fill-mode:forwards;
}
.png_4{
    animation: 0.5s png_4; 
    animation-delay: 2.75s;
    transform: translate(-50%,-50%);
    width: 177px;
    bottom: calc(-100%);
    left: calc(-100%);
    animation-fill-mode:forwards;
}
.png_5{
    animation: 0.5s png_5; 
    animation-delay: 3.5s;
    transform: translate(-50%,-50%);
    width: 176px;
    bottom: calc(-100%);
        right:  calc(-100%);
    animation-fill-mode:forwards;
}

.png_3_static{  
    animation: 0s png_3_static ; 
    animation-delay: 1s;
    transform: translate(-50%,-50%);
    width: 350px;
    top: 50%;
    left: 50%;  
    visibility: hidden;
    animation-fill-mode:forwards;
}
.png_1_static{
    animation: 0s png_1_static ; 
    animation-delay: 1.75s;
    transform: translate(-50%,-50%);
    width: 115px;
    top: calc(50% - 122px);
    left: calc(50% - 93px);
    visibility: hidden;
    animation-fill-mode:forwards;
}
.png_2_static{
    animation: 0s png_2_static ; 
    animation-delay: 2.5s;
    transform: translate(-50%,-50%);
    width: 115px;
    top: calc(50% - 121px);
    right: calc(50% + -208px);
    visibility: hidden;
    animation-fill-mode:forwards;
}
.png_4_static{
    animation: 0s png_4_static; 
    animation-delay: 3.25s;
    transform: translate(-50%,-50%);
    width: 177px;
    bottom: calc(50% - 193px);
    left: calc(50% - 88px);
    visibility: hidden;
    animation-fill-mode:forwards;
}
.png_5_static{
    animation: 0s png_5_static; 
    animation-delay: 4s;
    transform: translate(-50%,-50%);
    width: 176px;
    bottom: calc(50% - 193px);
    right: calc(50% - 264px);    
    visibility: hidden;  
    animation-fill-mode:forwards;
}

.pulse {
  position: relative;
  text-align: center; 
  padding: 160px; 
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  border-radius: 50%; 
  background: #fff;
  width: 80px;
  height: 80px;
}
.pulse::before {
content: ''; 
position: absolute;
border: 8px solid #3D64FF;
left: -20px;
opacity: 0;
right: -20px;
top: -20px;
bottom: -20px;
border-radius: 50%;
animation-delay:2s;
animation: pulse 1.5s linear infinite; 
}


@keyframes png_1 {
    from{
        top: calc(-100%);
        left: calc(-100%);
    }
    to{
        top: calc(50% - 122px + 5px);
        left: calc(50% - 93px + 5px);
        visibility: hidden;
    }
}
@keyframes png_2 {
    from{
        top: calc(-100%);
        left: calc(-100%);
    }
    to{
        top: calc(50% - 121px);
        right: calc(50% + -208px);
        visibility: hidden;
    }
}
@keyframes png_3 {
    from{
        top: calc(-100%);
    }
    to{
        top: 50%;
        left: 50%;  
        visibility: hidden;
    }
}
 @keyframes png_4 {
    from{
        bottom: -100%;
        left: -100%;
    }
    to{
        bottom: calc(50% - 193px);
        left: calc(50% - 88px);
        visibility: hidden;
    }
} 
 @keyframes png_5 {
    from{
        bottom: calc(-100%);
        right: calc(-100%);
    }
    to{
        bottom: calc(50% - 193px);
        right: calc(50% - 265px);  
        visibility: hidden;    
    }
} 
/* @keyframes png_5 {
    from{
        bottom: calc(-100%);
        right: calc(-100%);
    }
    to{
        bottom: calc(50% - 192px);
        right: calc(50% - 264px);      
    }
} */

@keyframes png_1_static {
    from{
        visibility: hidden;    
    }
    to{
        visibility: visible;    
    }
}
@keyframes png_2_static {
    from{
        visibility: hidden;    
    }
    to{
        visibility: visible;    
    }
}
@keyframes png_3_static {
    from{
        visibility: hidden;    
    }
    to{
        visibility: visible;    
    }
}
 @keyframes png_4_static {
    from{
        visibility: hidden;    
    }
    to{
        visibility: visible;    
    }
} 
 @keyframes png_5_static {
    from{
        visibility: hidden;    
    }
    to{
        visibility: visible;    
    }
} 
 @keyframes loader_text {
    from{
        opacity: 0;
    }
    to{
        opacity: 1;
    }
} 


@keyframes circle {
    20%{
        top: 50%;
        left: 50%;  
    }
    23%{
         top: calc(50% + 5px);
        left: 50%;
    }
    25%{
        top: 50%;
        left: 50%;  
    }


    35%{
        top: 50%;
        left: 50%;  
    }
    38%{
        top: calc(50% + 5px);
        left: calc(50% + 5px);
    }
    40%{
        top: 50%;
        left: 50%;  
    }


    50%{
        top: 50%;
        left: 50%;  
    }
    53%{
        top: calc(50% + 5px);
        left: calc(50% - 5px);
    }
    55%{
        top: 50%;
        left: 50%;  
    }

    65%{
        top: 50%;
        left: 50%;  
    }
    68%{
        top: calc(50% - 5px);
        left: calc(50% + 5px);
    }
    70%{
        top: 50%;
        left: 50%;  
    }

    80%{
        top: 50%;
        left: 50%;  
    }
    83%{
        top: calc(50% - 5px);
        left: calc(50% - 5px);
    }
    85%{
        top: 50%;
        left: 50%;  
    }
}
/* @keyframes pulse {
0% {
transform: scale(0.5);
opacity: 0;
}
50% {
opacity: 1;
}
100% {
transform: scale(1.2);
opacity: 0;
}
} */