#add_esign #esign_btn {
    animation: esign_btn 15s ease-out infinite;
    transform-origin: center;
	transform-box: fill-box;
}

#add_esign #request {
    animation: request 15s ease-out infinite;
}

#add_esign #esign_page {
    animation: esign_page 15s ease-out infinite;
}

#add_esign #sign_box {
    animation: sign_box 15s ease-out infinite;
    transform-origin: center;
	transform-box: fill-box;
}

#add_esign #signature {
    animation: signature 15s ease-out infinite;
    transform-origin: center;
	transform-box: fill-box;
}

#add_esign #overlay {
    animation: overlay 15s infinite;
}

#add_esign #sign {
  stroke-dasharray: 7200;
  stroke-dashoffset: 7200;
  animation: sign 15s ease infinite;
}

#add_esign #draw_popup {
    animation: draw_popup 15s ease-out infinite;
}

#add_esign #sign_b {
    animation: sign_b 15s ease-out infinite;
}

#add_esign #aadhaar_esign_btn {
    animation: aadhaar_esign_btn 15s ease-out infinite;
    transform-origin: center;
    transform-box: fill-box;
}

#add_esign #aadhar_popup {
    animation: aadhar_popup 15s ease-out infinite;
}

#add_esign #Placeholder_aadhaar {
    animation: Placeholder_aadhaar 15s ease-out infinite;
}

#add_esign #SEND_OTP {
    animation: SEND_OTP 15s ease-out infinite;
    transform-origin: center;
    transform-box: fill-box;
}

#add_esign #Placeholder_otp {
    animation: Placeholder_otp 15s ease-out infinite;
}

#add_esign #verify_btn {
    animation: verify_btn 15s ease-out infinite;
    transform-origin: center;
    transform-box: fill-box;
}

#add_esign #esign_valid {
    animation: esign_valid 15s ease-out infinite;
}

#add_esign #success {
    animation: success 15s ease-out infinite;
}

@keyframes request {
	0%, 14% {
		opacity: 1;
	}
    16%, 100% {
        opacity: 0;
    }
}

@keyframes esign_btn {
	0%, 2% {
		opacity: 1;
	}
	4% {
        opacity: 1;
        transform: scaleX(1) scaleY(1);
	}
	6% {
        opacity: 1;
        transform: scaleX(0.8) scaleY(0.8);
	}
	8% {
        opacity: 1;
        transform: scaleX(1) scaleY(1);
	}
	10%, 12% {
		opacity: 1;
	}
    14%, 100% {
        opacity: 0;
    }
}

@keyframes esign_page {
    0%, 10% {
        opacity: 0;
    }
    12%, 88% {
        opacity: 1;
    }
    90%, 100% {
        opacity: 0;
    }
}

@keyframes sign_box {
    0%, 12% {
        opacity: 0;
    }
    14% {
        opacity: 1;
    }
    16% {
        opacity: 1;
        transform: scaleX(1) scaleY(1);
    }
    18% {
        opacity: 1;
        transform: scaleX(0.9) scaleY(0.9);
    }
    20% {
        opacity: 1;
        transform: scaleX(1) scaleY(1);
    }
    22%, 38% {
        opacity: 1;
    }
    40%, 100% {
        opacity: 0;
    }
}

@keyframes signature {
    0%, 12% {
        opacity: 0;
    }
    14% {
        opacity: 1;
    }
    16% {
        opacity: 1;
        transform: scaleX(1) scaleY(1);
    }
    18% {
        opacity: 1;
        transform: scaleX(0.9) scaleY(0.9);
    }
    20% {
        opacity: 1;
        transform: scaleX(1) scaleY(1);
    }
    22%, 38% {
        opacity: 1;
    }
    40%, 100% {
        opacity: 0;
    }
}

@keyframes overlay {
    0%, 24% {
        opacity: 0;
    }
    26%, 38% {
        opacity: 0.18;
    }
    40%, 56% {
        opacity: 0;
    }
    58%, 80% {
        opacity: 0.18;
    }
    82%, 100% {
        opacity: 0;
    }
}

@keyframes draw_popup {
    0%, 24% {
        opacity: 0;
    }
    26%, 38% {
        opacity: 1;
    }
    40%, 100% {
        opacity: 0;
    }
}

@keyframes sign {
  0% {
    stroke-dashoffset: 7200;
    opacity: 0;
  }
  28% {
    stroke-dashoffset: 7200;
    opacity: 1;
  }
  100% {
    stroke-dashoffset: 0;
    opacity: 1;
  }
}

@keyframes sign_b {
    0%, 42% {
        opacity: 0;
    }
    44%, 88% {
        opacity: 1;
    }
    90%, 100% {
        opacity: 0;
    }
}

@keyframes aadhaar_esign_btn {
    0%, 46% {
        opacity: 0;
    }
    48% {
        opacity: 1;
    }
    50% {
        opacity: 1;
        transform: scaleX(1) scaleY(1);
    }
    52% {
        opacity: 1;
        transform: scaleX(0.8) scaleY(0.8);
    }
    54% {
        opacity: 1;
        transform: scaleX(1) scaleY(1);
    }
    56%, 80% {
        opacity: 1;
    }
    82%, 100% {
        opacity: 0;
    }
}

@keyframes aadhar_popup {
    0%, 56% {
        opacity: 0;
    }
    58%, 80% {
        opacity: 1;
    }
    82%, 100% {
        opacity: 0;
    }
    
}

@keyframes Placeholder_aadhaar {
    0%, 60% {
        opacity: 0;
    }
    62%, 100% {
        opacity: 1;
    }
    
}

@keyframes SEND_OTP {
    0%, 56% {
        opacity: 0;
    }
    58% {
        opacity: 1;
    }
    60% {
        opacity: 1;
    }
    62% {
        opacity: 1;
        transform: scaleX(1) scaleY(1);
    }
    64% {
        opacity: 1;
        transform: scaleX(0.8) scaleY(0.8);
    }
    66% {
        opacity: 1;
        transform: scaleX(1) scaleY(1);
    }
    68%, 100% {
        opacity: 1;
    }
}

@keyframes Placeholder_otp {
    0%, 70% {
        opacity: 0;
    }
    72%, 100% {
        opacity: 1;
    }
    
}

@keyframes verify_btn {
    74% {
        opacity: 1;
        transform: scaleX(1) scaleY(1);
    }
    76% {
        opacity: 1;
        transform: scaleX(0.8) scaleY(0.8);
    }
    78% {
        opacity: 1;
        transform: scaleX(1) scaleY(1);
    }
    80%, 82% {
        opacity: 1;
    }
    84%, 100% {
        opacity: 0;
    }
}

@keyframes esign_valid {
    0%, 80% {
        opacity: 0;
    }
    82%, 88% {
        opacity: 1;
    }
    90%, 100% {
        opacity: 0;
    }
}

@keyframes success {
    0%, 88% {
        opacity: 0;
    }
    90%, 100% {
        opacity: 1;
    }
}