/* This bit isn't written by an AI! This is actually built by me- Bloxxer126g */

:root{
  --green:#00ff88;--red:#ff4466;--yellow:#ffcc00;
  --bg:#0a0a0f;--bg2:#0f0f1a;
  --border:#00ff8818;--border2:#00ff8840;
  --text-dim:#00ff8855;--text-mid:#00ff8899;
}

.AppearingText:nth-child(1) {
    animation-duration: 300ms;
}
.AppearingText:nth-child(2) {
    animation-duration: 500ms;
}
.AppearingText:nth-child(3) {
    animation-duration: 700ms;
}
.AppearingText:nth-child(4) {
    animation-duration: 900ms;
}

.AppearingText {
    color: var(--green);
    animation-name: TextAppear;
}

.AppearingProject:nth-child(1) {
    animation-duration: 600ms;
}

.AppearingProject:nth-child(2) {
    animation-duration: 800ms;
}

.AppearingProject:nth-child(3) {
    animation-duration: 1000ms;
}

.AppearingProject:nth-child(4) {
    animation-duration: 1200ms;
}

.AppearingProject {
    animation-name: ProjectAppear;
}

@keyframes ProjectAppear {
    from {
        scale: 0;
        opacity: 0%;
        transform: translate(0, 100px);
    }

    to {
        scale: 1;
        opacity: 100%;
    }
}

@keyframes TextAppear {
    from{
        opacity: 0%;
        font-size: 0;
    }

    to{
        opacity: 100%;
    }
}