/*=====================================
  HMS SOLUTIONS - animation.css
======================================*/

/* Fade In */
@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.fade-in {
    animation: fadeIn 1s ease-in-out;
}

/* Fade Up */
@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(40px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.fade-up {
    animation: fadeUp 1s ease;
}

/* Fade Down */
@keyframes fadeDown {
    from {
        opacity: 0;
        transform: translateY(-40px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.fade-down {
    animation: fadeDown 1s ease;
}

/* Fade Left */
@keyframes fadeLeft {
    from {
        opacity: 0;
        transform: translateX(-60px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.fade-left {
    animation: fadeLeft 1s ease;
}

/* Fade Right */
@keyframes fadeRight {
    from {
        opacity: 0;
        transform: translateX(60px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.fade-right {
    animation: fadeRight 1s ease;
}

/* Zoom In */
@keyframes zoomIn {
    from {
        opacity: 0;
        transform: scale(.8);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.zoom-in {
    animation: zoomIn .8s ease;
}

/* Zoom Out */
@keyframes zoomOut {
    from {
        transform: scale(1.2);
        opacity: 0;
    }
    to {
        transform: scale(1);
        opacity: 1;
    }
}

.zoom-out {
    animation: zoomOut .8s ease;
}

/* Floating Animation */
@keyframes floating {
    0% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(-15px);
    }

    100% {
        transform: translateY(0px);
    }
}

.float {
    animation: floating 3s ease-in-out infinite;
}

/* Pulse */
@keyframes pulse {

    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.08);
    }

    100% {
        transform: scale(1);
    }

}

.pulse {
    animation: pulse 2s infinite;
}

/* Rotate */
@keyframes rotate360 {

    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }

}

.rotate {
    animation: rotate360 5s linear infinite;
}

/* Bounce */
@keyframes bounce {

    0%,100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-20px);
    }

}

.bounce {
    animation: bounce 2s infinite;
}

/* Shine Button Effect */

.btn-shine {
    position: relative;
    overflow: hidden;
}

.btn-shine::before {

    content: "";

    position: absolute;

    top: 0;

    left: -100%;

    width: 100%;

    height: 100%;

    background: rgba(255,255,255,.4);

    transform: skewX(-25deg);

    transition: .8s;

}

.btn-shine:hover::before {
    left: 130%;
}

/* Card Hover */

.hover-card {

    transition: .4s;

}

.hover-card:hover {

    transform: translateY(-10px);

    box-shadow: 0 15px 35px rgba(0,0,0,.2);

}

/* Image Zoom */

.img-hover {

    overflow: hidden;

}

.img-hover img {

    transition: .5s;

}

.img-hover:hover img {

    transform: scale(1.1);

}

/* Icon Hover */

.icon-hover {

    transition: .4s;

}

.icon-hover:hover {

    color: #FFC107;

    transform: scale(1.2);

}

/* Underline Animation */

.link-animation {

    position: relative;

    text-decoration: none;

}

.link-animation::after {

    content: "";

    position: absolute;

    left: 0;

    bottom: -5px;

    width: 0;

    height: 2px;

    background: #FFC107;

    transition: .4s;

}

.link-animation:hover::after {

    width: 100%;

}

/* Loading Spinner */

.loader {

    width: 60px;

    height: 60px;

    border: 6px solid #ddd;

    border-top: 6px solid #0D47A1;

    border-radius: 50%;

    animation: rotate360 1s linear infinite;

}

/* Smooth Reveal */

.reveal {

    opacity: 0;

    transform: translateY(60px);

    transition: all .8s ease;

}

.reveal.active {

    opacity: 1;

    transform: translateY(0);

}