.tracking-in-contract {
	-webkit-animation: tracking-in-contract 0.8s cubic-bezier(0.215, 0.610, 0.355, 1.000) both;
	        animation: tracking-in-contract 0.8s cubic-bezier(0.215, 0.610, 0.355, 1.000) both;
}
@-webkit-keyframes tracking-in-contract {
  0% {
    letter-spacing: 1em;
    opacity: 0;
  }
  40% {
    opacity: 0.6;
  }
  100% {
    letter-spacing: normal;
    opacity: 1;
  }
}
@keyframes tracking-in-contract {
  0% {
    letter-spacing: 1em;
    opacity: 0;
  }
  40% {
    opacity: 0.6;
  }
  100% {
    letter-spacing: normal;
    opacity: 1;
  }
}


  /*======Hover effect======*/
    .hoverbtn{
        display: inline-block;
    }
    .foure:hover:before{
        transform: translate(-101px,0)
    }
    .five{
        position: relative;
        z-index: 0;
        overflow: hidden;
    }
    .five:before{
        background: linear-gradient(90.13deg, #00D464 31.55%, #00C2FF 79.46%);
        content: "";
        display: inline-block;
        position: absolute;
        width:300px;
        height:300px;
        border-radius: 500px 100px 100px 100px;
        /* right:210px; */
        right: 100%;
        top:-79px;
        z-index: -90;
        transition: all .5s ease-in-out;
       
    }
    .five:hover:before{
        transform: rotate(90deg) translate(0,-300px);
    }
    .five:hover{
      transition: all .5s ease-in-out; 
      color:#FFF;
      border: none;
      border-color: #00D464 !important;
      background-color: #00D464 !important;
    }



    .cloud .card-body:hover
    {
      background: linear-gradient(90.13deg, #00C2FF 31.55%, #00D464 79.46%);
    }
    .cloud .card-body:hover .circle-icon
    {
      position: relative;
      z-index: 1;
      animation: beat 2s linear infinite;
    }
    @keyframes beat {
      0% {
        transform: scale(1);
      }
      14% {
        transform: scale(0.9);
      }
      21% {
        transform: scale(1.1) skew(0.004turn)
      }
      28% {
        transform: scale(1) skew(0.008turn);
      }
      35% {
        transform: scale(1) skew(0)
      }
    }
    
    @keyframes aniArrow02 {
      0% {
        transform:translateX(45px);
      }
      100% {
        transform:translateX(-44px);
      }
    }