/* =========================
   FLOATING
========================= */

@keyframes float {

    0%{
        transform:translateY(0px);
    }

    50%{
        transform:translateY(-20px);
    }

    100%{
        transform:translateY(0px);
    }

}

.float{
    animation:float 4s ease-in-out infinite;
}

/* =========================
   GLOW PULSE
========================= */

@keyframes glowPulse {

    0%{
        box-shadow:
        0 0 10px rgba(0,255,255,.2);
    }

    50%{
        box-shadow:
        0 0 30px rgba(0,255,255,.8),
        0 0 60px rgba(0,255,255,.5);
    }

    100%{
        box-shadow:
        0 0 10px rgba(0,255,255,.2);
    }

}

.glow-pulse{
    animation:glowPulse 3s infinite;
}

/* =========================
   TEXT GLOW
========================= */

@keyframes textGlow {

    0%,100%{
        text-shadow:
        0 0 10px #00ffff;
    }

    50%{
        text-shadow:
        0 0 30px #00ffff,
        0 0 60px #00ffff;
    }

}

.text-glow{
    animation:textGlow 3s infinite;
}

/* =========================
   ROTATE
========================= */

@keyframes rotate {

    from{
        transform:rotate(0deg);
    }

    to{
        transform:rotate(360deg);
    }

}

.rotate{
    animation:rotate 20s linear infinite;
}

/* =========================
   ROBOT FLOAT
========================= */

@keyframes robotFloat {

    0%,100%{
        transform:
        translateY(0);
    }

    50%{
        transform:
        translateY(-25px);
    }

}

.robot-float{
    animation:robotFloat 5s ease-in-out infinite;
}

/* =========================
   HOLOGRAM FLICKER
========================= */

@keyframes hologram {

    0%{
        opacity:1;
    }

    5%{
        opacity:.8;
    }

    10%{
        opacity:1;
    }

    15%{
        opacity:.7;
    }

    20%{
        opacity:1;
    }

    100%{
        opacity:1;
    }

}

.hologram{
    animation:hologram 2s infinite;
}

/* =========================
   SCAN LINE
========================= */

@keyframes scan {

    0%{
        top:-100%;
    }

    100%{
        top:100%;
    }

}

.scan-line{
    position:absolute;
    width:100%;
    height:4px;

    background:
    linear-gradient(
    90deg,
    transparent,
    #00ffff,
    transparent
    );

    animation:scan 3s linear infinite;
}

/* =========================
   STARS MOVE
========================= */

@keyframes starsMove {

    from{
        transform:
        translateY(0);
    }

    to{
        transform:
        translateY(200px);
    }

}

/* =========================
   METEOR
========================= */

@keyframes meteor {

    0%{
        transform:
        translateX(0)
        translateY(0)
        rotate(45deg);

        opacity:1;
    }

    100%{
        transform:
        translateX(-1200px)
        translateY(1200px)
        rotate(45deg);

        opacity:0;
    }

}

.meteor{
    position:absolute;

    width:3px;
    height:120px;

    background:
    linear-gradient(
    white,
    transparent
    );

    animation:
    meteor 5s linear infinite;
}

/* =========================
   FADE UP
========================= */

@keyframes fadeUp {

    from{
        opacity:0;
        transform:
        translateY(50px);
    }

    to{
        opacity:1;
        transform:
        translateY(0);
    }

}

.fade-up{
    animation:
    fadeUp 1s ease forwards;
}

/* =========================
   ZOOM IN
========================= */

@keyframes zoomIn {

    from{
        opacity:0;
        transform:
        scale(.8);
    }

    to{
        opacity:1;
        transform:
        scale(1);
    }

}

.zoom-in{
    animation:
    zoomIn 1s ease forwards;
}

/* =========================
   AI CORE
========================= */

@keyframes aiCore {

    0%{
        transform:
        scale(1);
    }

    50%{
        transform:
        scale(1.25);
    }

    100%{
        transform:
        scale(1);
    }

}

.ai-core{
    animation:
    aiCore 2s infinite;
}

/* =========================
   BUTTON GLOW
========================= */

@keyframes buttonGlow {

    0%,100%{

        box-shadow:
        0 0 10px rgba(0,255,255,.4);

    }

    50%{

        box-shadow:
        0 0 40px rgba(0,255,255,.9);

    }

}

.button-glow{
    animation:
    buttonGlow 2s infinite;
}

/* =========================
   ORBIT PLANET
========================= */

@keyframes orbit {

    from{
        transform:
        rotate(0deg)
        translateX(180px)
        rotate(0deg);
    }

    to{
        transform:
        rotate(360deg)
        translateX(180px)
        rotate(-360deg);
    }

}

.orbit{
    animation:
    orbit 12s linear infinite;
}

/* =========================
   CURSOR GLOW
========================= */

@keyframes cursorPulse {

    0%,100%{
        transform:scale(1);
    }

    50%{
        transform:scale(1.5);
    }

}

.cursor-glow{
    animation:
    cursorPulse 1s infinite;
}