@keyframes telColorChange {
    0% { background-color: #13198C; }
    25% { background-color: #256DDA; }
    50% { background-color: #13198C; }
    75% { background-color: #256DDA; }
    100% { background-color: #13198C; }
}

@keyframes bottomBtn01 {
  0% { background-color: #256DDA; color: #fff; }
  25% { background-color: #fff; color: #256DDA; }
  50% { background-color: #256DDA; color: #fff;}
  75% { background-color: #fff; color: #256DDA; }
  100% { background-color: #256DDA; color: #fff;}
}
@keyframes bottomBtn02 {
  0% { background-color: #222; color: #fff;}
  25% { background-color: #fff; color: #222; }
  50% { background-color: #222; color: #fff;}
  75% { background-color: #fff; color: #222; }
  100% { background-color: #222; color: #fff; }
}

@keyframes mainBannerArrow {
    0% { opacity: 0; transform: translate3d(0px, 0px, 0px); }
    25% { opacity: 1; transform: translate3d(0px, 20px, 0px); }
    50% { opacity: 1; transform: translate3d(0px, 0px, 0px); }
    75% { opacity: 1; transform: translate3d(0px, 20px, 0px); }
    100% { opacity: 0; transform: translate3d(0px, 0px, 0px); }
}
  
@keyframes fadeIn {
    0% { opacity: 0; transform: translate3d(0px, 50px, 0px); }
    100% { opacity: 1; transform: translate3d(0px, 0px, 0px); }
}
@keyframes fadeInLeft {
    0% { opacity: 0; transform: translate3d(-50px, 0px, 0px); }
    100% { opacity: 1; transform: translate3d(0px, 0px, 0px); }
}
@keyframes fadeInRight {
    0% { opacity: 0; transform: translate3d(50px, 0px, 0px); }
    100% { opacity: 1; transform: translate3d(0px, 0px, 0px); }
}
@keyframes fadeInCard {
    0% { opacity: 0.5; transform: translate3d(0px, 50px, 0px); }
    100% { opacity: 1; transform: translate3d(0px, 0px, 0px); }
}

@keyframes rotate {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}