/*==================================================
Animate.css Lite v1.0
==================================================*/

.animate{animation-duration:.8s;animation-fill-mode:both}
.animate-fast{animation-duration:.4s}
.animate-slow{animation-duration:1.5s}
.animate-delay-1{animation-delay:.2s}
.animate-delay-2{animation-delay:.4s}
.animate-delay-3{animation-delay:.6s}
.animate-infinite{animation-iteration-count:infinite}

/* Fade */
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.fadeIn{animation-name:fadeIn}

@keyframes fadeUp{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}
.fadeUp{animation-name:fadeUp}

@keyframes fadeDown{from{opacity:0;transform:translateY(-40px)}to{opacity:1;transform:translateY(0)}}
.fadeDown{animation-name:fadeDown}

@keyframes fadeLeft{from{opacity:0;transform:translateX(-40px)}to{opacity:1;transform:translateX(0)}}
.fadeLeft{animation-name:fadeLeft}

@keyframes fadeRight{from{opacity:0;transform:translateX(40px)}to{opacity:1;transform:translateX(0)}}
.fadeRight{animation-name:fadeRight}

/* Zoom */
@keyframes zoomIn{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}
.zoomIn{animation-name:zoomIn}

@keyframes zoomOut{from{opacity:0;transform:scale(1.2)}to{opacity:1;transform:scale(1)}}
.zoomOut{animation-name:zoomOut}

/* Slide */
@keyframes slideUp{from{transform:translateY(100%)}to{transform:translateY(0)}}
.slideUp{animation-name:slideUp}

@keyframes slideDown{from{transform:translateY(-100%)}to{transform:translateY(0)}}
.slideDown{animation-name:slideDown}

@keyframes slideLeft{from{transform:translateX(-100%)}to{transform:translateX(0)}}
.slideLeft{animation-name:slideLeft}

@keyframes slideRight{from{transform:translateX(100%)}to{transform:translateX(0)}}
.slideRight{animation-name:slideRight}

/* Rotate */
@keyframes rotateIn{from{opacity:0;transform:rotate(-180deg)}to{opacity:1;transform:rotate(0)}}
.rotateIn{animation-name:rotateIn}

/* Bounce */
@keyframes bounce{
0%,20%,50%,80%,100%{transform:translateY(0)}
40%{transform:translateY(-18px)}
60%{transform:translateY(-8px)}
}
.bounce{animation:bounce 1s}

/* Pulse */
@keyframes pulse{
0%{transform:scale(1)}
50%{transform:scale(1.05)}
100%{transform:scale(1)}
}
.pulse{animation:pulse 1.2s infinite}

/* Float */
@keyframes floating{
0%{transform:translateY(0)}
50%{transform:translateY(-12px)}
100%{transform:translateY(0)}
}
.float{animation:floating 3s ease-in-out infinite}

/* Shake */
@keyframes shake{
0%,100%{transform:translateX(0)}
20%,60%{transform:translateX(-8px)}
40%,80%{transform:translateX(8px)}
}
.shake{animation:shake .6s}

/* Flip */
@keyframes flipX{
0%{transform:perspective(400px) rotateX(90deg);opacity:0}
100%{transform:perspective(400px) rotateX(0);opacity:1}
}
.flipX{animation-name:flipX}

@keyframes flipY{
0%{transform:perspective(400px) rotateY(90deg);opacity:0}
100%{transform:perspective(400px) rotateY(0);opacity:1}
}
.flipY{animation-name:flipY}

/* Ripple */
@keyframes ripple{
0%{box-shadow:0 0 0 0 rgba(253,126,20,.5)}
100%{box-shadow:0 0 0 25px rgba(253,126,20,0)}
}
.ripple{animation:ripple 1.5s infinite}

/* Hero Image */
.hero-img img{animation:floating 4s ease-in-out infinite}

/* Counter */
.counter-box:hover{animation:pulse .8s}

/* Card Hover */
.card-hover{transition:.35s}
.card-hover:hover{transform:translateY(-8px);box-shadow:0 15px 35px rgba(0,0,0,.15)}

/* Button Hover */
.btn-hover{transition:.3s}
.btn-hover:hover{transform:translateY(-3px) scale(1.03)}

/* Image Hover */
.img-hover{overflow:hidden}
.img-hover img{transition:.5s}
.img-hover:hover img{transform:scale(1.08)}

/* Rotate Hover */
.rotate-hover{transition:.4s}
.rotate-hover:hover{transform:rotate(3deg) scale(1.02)}


/*==================================================
Advanced Animation
==================================================*/

/* Scroll Reveal */
.reveal{opacity:0;transform:translateY(60px);transition:all .8s ease}
.reveal.active{opacity:1;transform:translateY(0)}

.reveal-left{opacity:0;transform:translateX(-60px);transition:all .8s ease}
.reveal-left.active{opacity:1;transform:translateX(0)}

.reveal-right{opacity:0;transform:translateX(60px);transition:all .8s ease}
.reveal-right.active{opacity:1;transform:translateX(0)}

.reveal-scale{opacity:0;transform:scale(.8);transition:all .8s ease}
.reveal-scale.active{opacity:1;transform:scale(1)}

/* Spinner */
@keyframes spin{100%{transform:rotate(360deg)}}
.spin{animation:spin 1s linear infinite}

/* Skeleton */
@keyframes skeleton{
0%{background-position:-200px 0}
100%{background-position:calc(200px + 100%) 0}
}
.skeleton{
background:#eee;
background-image:linear-gradient(90deg,#eee,#f5f5f5,#eee);
background-size:200px 100%;
animation:skeleton 1.4s infinite;
border-radius:6px;
}

/* Typing */
@keyframes typing{
from{width:0}
to{width:100%}
}
@keyframes blink{
50%{border-color:transparent}
}
.typing{
overflow:hidden;
white-space:nowrap;
border-right:3px solid var(--primary);
width:0;
animation:typing 4s steps(40,end) forwards,blink .8s infinite;
}

/* Gradient */
@keyframes gradient{
0%{background-position:0 50%}
50%{background-position:100% 50%}
100%{background-position:0 50%}
}
.gradient-bg{
background:linear-gradient(-45deg,#fd7e14,#ff9800,#ffc107,#fd7e14);
background-size:400% 400%;
animation:gradient 8s ease infinite;
}

/* Wave */
@keyframes wave{
0%,100%{transform:rotate(0)}
25%{transform:rotate(8deg)}
75%{transform:rotate(-8deg)}
}
.wave:hover{
animation:wave .7s;
transform-origin:70% 70%;
}

/* Floating Icon */
@keyframes floatingIcon{
0%{transform:translateY(0)}
50%{transform:translateY(-8px)}
100%{transform:translateY(0)}
}
.icon-float{
animation:floatingIcon 2.5s infinite;
}

/* Notification */
@keyframes notify{
0%{transform:translateX(100%)}
100%{transform:translateX(0)}
}
.notification-show{
animation:notify .5s ease;
}

/* Toast */
@keyframes toast{
0%{opacity:0;transform:translateY(25px)}
100%{opacity:1;transform:translateY(0)}
}
.toast-show{
animation:toast .35s;
}

/* Modal */
@keyframes modalZoom{
0%{opacity:0;transform:scale(.7)}
100%{opacity:1;transform:scale(1)}
}
.modal-content{
animation:modalZoom .35s;
}

/* Progress */
@keyframes progressBar{
0%{width:0}
100%{width:100%}
}
.progress-bar-animate{
animation:progressBar 2s linear;
}

/* Success */
@keyframes successPulse{
0%{box-shadow:0 0 0 0 rgba(25,135,84,.5)}
100%{box-shadow:0 0 0 18px rgba(25,135,84,0)}
}
.success-ring{
animation:successPulse 1.5s infinite;
}

/* Error */
@keyframes errorShake{
0%,100%{transform:translateX(0)}
20%,60%{transform:translateX(-6px)}
40%,80%{transform:translateX(6px)}
}
.error-shake{
animation:errorShake .4s;
}

/* Navbar */
.navbar .nav-link{
transition:.3s;
}
.navbar .nav-link:hover{
transform:translateY(-2px);
}

/* Dropdown */
.dropdown-menu{
animation:fadeDown .25s;
transform-origin:top;
}

/* Mega Menu */
.mega-menu{
animation:fadeUp .3s;
}

/* Accordion */
.accordion-button{
transition:.3s;
}
.accordion-button:hover{
padding-left:1.5rem;
}

/* Image Zoom */
.zoom-hover{
overflow:hidden;
}
.zoom-hover img{
transition:.5s;
}
.zoom-hover:hover img{
transform:scale(1.12);
}

/* Glass Hover */
.glass-hover{
transition:.35s;
backdrop-filter:blur(8px);
}
.glass-hover:hover{
transform:translateY(-8px);
box-shadow:0 20px 45px rgba(0,0,0,.15);
}

/* Lift */
.lift{
transition:.35s;
}
.lift:hover{
transform:translateY(-10px);
}

/* Rotate */
.rotate:hover{
transform:rotate(4deg);
transition:.35s;
}

/* Scale */
.scale:hover{
transform:scale(1.05);
transition:.35s;
}

/* Blur */
.blur-hover{
transition:.35s;
}
.blur-hover:hover{
filter:blur(2px);
}

/* Glow */
.glow{
transition:.35s;
}
.glow:hover{
box-shadow:0 0 25px rgba(253,126,20,.45);
}

/* Border Animation */
.border-animate{
position:relative;
overflow:hidden;
}
.border-animate::before{
content:"";
position:absolute;
left:-100%;
top:0;
width:100%;
height:2px;
background:var(--primary);
transition:.5s;
}
.border-animate:hover::before{
left:0;
}

/* Infinite Rotate */
@keyframes rotate360{
100%{transform:rotate(360deg)}
}
.rotate360{
animation:rotate360 6s linear infinite;
}

/* Heart Beat */
@keyframes heartbeat{
0%,100%{transform:scale(1)}
25%{transform:scale(1.1)}
50%{transform:scale(.95)}
75%{transform:scale(1.08)}
}
.heartbeat{
animation:heartbeat 1.2s infinite;
}

/* Blink */
@keyframes blinkOpacity{
50%{opacity:.3}
}
.blink{
animation:blinkOpacity 1s infinite;
}

/* End */