
//>>>>> Video Animation Start <<<<<//
@-webkit-keyframes rippleOne {
    70% {
        -webkit-box-shadow: 0 0 0 40px rgba(244, 68, 56, 0);
        box-shadow: 0 0 0 40px rgba(244, 68, 56, 0);
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 rgba(244, 68, 56, 0);
        box-shadow: 0 0 0 0 rgba(244, 68, 56, 0);
    }
}

@keyframes rippleOne {
    70% {
        -webkit-box-shadow: 0 0 0 40px rgba(244, 68, 56, 0);
        box-shadow: 0 0 0 40px rgba(244, 68, 56, 0);
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 rgba(244, 68, 56, 0);
        box-shadow: 0 0 0 0 rgba(244, 68, 56, 0);
    }
}
//>>>>> Video Animation End <<<<<//

//>>>>> Progressbar Animation Start <<<<<//
@keyframes toggle {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
  }
  
  @-webkit-keyframes moveCursor1 {
  from {
	  -webkit-transform: scale(1);
			  transform: scale(1);
  }
  to {
	  -webkit-transform: scale(0.8);
			  transform: scale(0.8);
  }
  }
  
  @keyframes moveCursor1 {
  from {
	  -webkit-transform: scale(1);
			  transform: scale(1);
  }
  to {
	  -webkit-transform: scale(0.8);
			  transform: scale(0.8);
  }
  }
  
  @-webkit-keyframes moveCursor2 {
  0% {
	  -webkit-transform: scale(1);
			  transform: scale(1);
  }
  50% {
	  -webkit-transform: scale(1.5);
			  transform: scale(1.5);
  }
  100% {
	  -webkit-transform: scale(1);
			  transform: scale(1);
	  opacity: 0;
  }
  }
  
  @keyframes moveCursor2 {
  0% {
	  -webkit-transform: scale(1);
			  transform: scale(1);
  }
  50% {
	  -webkit-transform: scale(1.5);
			  transform: scale(1.5);
  }
  100% {
	  -webkit-transform: scale(1);
			  transform: scale(1);
	  opacity: 0;
  }
  }
//>>>>> Progressbar Animation End <<<<<//

//>>>>> Circle Animation Start <<<<<//
@keyframes cir36 {
    100%{
        transform: rotate(360deg);
    }
}

@keyframes rounded {
    50%{
        transform: rotate(15deg);
    }
}

//>>>>> Circle Animation End <<<<<//

// Animation rotate area start here ***
@keyframes rotate {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}
.animation__rotate {
	animation: rotate 40s linear infinite;
}
@keyframes rotateY {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(-360deg);
	}
}
.animation__rotateY {
	animation: rotateY 40s linear infinite;
}
// Animation rotate area end here ***

//animation
@keyframes rounded {
    50%{
        transform: rotate(30deg);
    }
}

@keyframes handed {
	100% {
		transform: rotate(-360deg);
	}
}

@keyframes right-image-bounce {
    0% {
      transform: translateX(8px);
    }
    50% {
      transform: translateX(-12px);
    }
    100% {
      transform: translateX(8px);
    }
}

@keyframes top-image-bounce {
    0% {
      transform: translateY(8px);
    }
    50% {
      transform: translateY(-12px);
    }
    100% {
      transform: translateY(8px);
    }
}

@-webkit-keyframes scale-up-one {
	0%   {-webkit-transform: scale(1);transform: scale(1);}
	40%  {-webkit-transform: scale(0.8);transform: scale(0.8);}
	100% {-webkit-transform: scale(1);transform: scale(1);}
  }
  @keyframes scale-up-one {
	0%   {-webkit-transform: scale(1);transform: scale(1);}
	40%  {-webkit-transform: scale(0.8);transform: scale(0.8);}
	100% {-webkit-transform: scale(1);transform: scale(1);}
  }

  //>>>>> Preloader Animation Start <<<<<//
 @-webkit-keyframes spinner {
	to {
		-webkit-transform: rotateZ(360deg);
		transform: rotateZ(360deg);
	}
}

@keyframes spinner {
	to {
		-webkit-transform: rotateZ(360deg);
		transform: rotateZ(360deg);
	}
}

@-webkit-keyframes letters-loading {
	0%,
	75%,
	100% {
		opacity: 0;
		transform: rotateY(-90deg);
	}
	25%,
	50% {
		opacity: 1;
		transform: rotateY(0deg);
	}
}

@keyframes letters-loading {
	0%,
	75%,
	100% {
		opacity: 0;
		transform: rotateY(-90deg);
	}
	25%,
	50% {
		opacity: 1;
		transform: rotateY(0deg);
	}
}

//>>>>> Preloader Animation Start <<<<<//
@keyframes loaderspin {
	0% {
	  transform: translate(-50%, -50%) rotate(0deg);
	}
	100% {
	  transform: translate(-50%, -50%) rotate(360deg);
	}
}


@keyframes tpswing{
	0% {
    -webkit-transform: rotate(20deg);
    -ms-transform:rotate(20deg);
    transform: rotate(20deg);
	}
    100% { 
      -webkit-transform: rotate(0deg);
      -ms-transform:rotate(0deg);
      transform: rotate(0deg);
	}
}


@keyframes width {
	0% {
	  width: 0%;
	}
	100% {
	  width: 100%;
	}
}

@-webkit-keyframes width {
	0% {
		width: 0%;
	  }
	  100% {
		width: 100%;
	}
}

@-webkit-keyframes loaderspin {
0% {
	transform: translate(-50%, -50%) rotate(0deg);
}
100% {
	transform: translate(-50%, -50%) rotate(360deg);
}
}

@keyframes loaderpulse {
0% {
	transform: scale(1);
}
100% {
	transform: scale(1.2);
}
}
//>>>>> Preloader Animation End <<<<<//
