body {
    /* background-color: black; */
    /*background: url(res/bg.png);
    background-size: cover;
    background-attachment: fixed; */
    font-family: BeonMedium;
}

h1 {
    font-size: 4em;
}

h2 {
    font-size: 2em;
}

.icon:hover {
    border: 3px solid rgba(255, 200, 255, 0.75);
    border-radius: 3px;
}



/*********************color options*/

/*red*/
.border-red-neon {
    border: 5px solid rgb(255, 175, 175);
    border-radius: 15px;
}

.red-neon {
    color: rgb(255, 175, 175);
    text-shadow: 0px 0px 3px rgba(255, 0, 0, 0.95), 0px 0px 15px rgba(255, 100, 100, 0.9);
}

/*yellow*/
.border-yellow-neon {
    border: 5px solid rgb(255, 255, 175);
    border-radius: 15px;
}

.yellow-neon {
    color: rgb(255, 255, 175);
    text-shadow: 0px 0px 3px rgba(255, 255, 0, 0.95), 0px 0px 15px rgba(255, 255, 100, 0.9);
}

/*green*/
.border-green-neon {
    border: 5px solid rgb(175, 255, 175);
    border-radius: 15px;
}

.green-neon {
    color: rgb(175, 255, 175);
    text-shadow: 0px 0px 3px rgba(0, 255, 0, 0.95), 0px 0px 15px rgba(100, 255, 100, 0.9);
}

/*blue*/
.border-blue-neon {
    border: 5px solid rgb(175, 175, 255);
    border-radius: 15px;
}

.blue-neon {
    color: rgb(175, 175, 255);
    text-shadow: 0px 0px 3px rgba(0, 0, 255, 0.95), 0px 0px 15px rgba(100, 100, 255, 0.9);
}

/*purple*/
.border-purple-neon {
    border: 5px solid rgb(255, 175, 255);
    border-radius: 15px;
}

.purple-neon {
    color: rgb(255, 175, 255);
    text-shadow: 0px 0px 3px rgba(255, 0, 255, 0.95), 0px 0px 15px rgba(255, 100, 255, 0.90);
}



/*********************text flicker options*/

/*red*/
.flicker-fast-red {
    -webkit-animation: flickerfastred 1s infinite;
    animation: flickerfastred 1s infinite;
    animation-direction: alternate;
}

.flicker-med-red {
    -webkit-animation: flickermedred 3s infinite;
    animation: flickermedred 3s infinite;
    animation-direction: alternate;
}

.flicker-slow-red {
    -webkit-animation: flickerslowred 5s infinite;
    animation: flickerslowred 5s infinite;
    animation-direction: alternate;
}

/*yellow*/
.flicker-fast-yellow {
    -webkit-animation: flickerfastyellow 1s infinite;
    animation: flickerfastyellow 1s infinite;
    animation-direction: alternate;
}

.flicker-med-yellow {
    -webkit-animation: flickermedyellow 3s infinite;
    animation: flickermedyellow 3s infinite;
    animation-direction: alternate;
}

.flicker-slow-yellow {
    -webkit-animation: flickerslowyellow 5s infinite;
    animation: flickerslowyellow 5s infinite;
    animation-direction: alternate;
}

/*green*/
.flicker-fast-green {
    -webkit-animation: flickerfastgreen 1s infinite;
    animation: flickerfastgreen 1s infinite;
    animation-direction: alternate;
}

.flicker-med-green {
    -webkit-animation: flickermedgreen 3s infinite;
    animation: flickermedgreen 3s infinite;
    animation-direction: alternate;
}

.flicker-slow-green {
    -webkit-animation: flickerslowgreen 5s infinite;
    animation: flickerslowgreen 5s infinite;
    animation-direction: alternate;
}

/*blue*/
.flicker-fast-blue {
    -webkit-animation: flickerfastblue 1s infinite;
    animation: flickerfastblue 1s infinite;
    animation-direction: alternate;
}

.flicker-med-blue {
    -webkit-animation: flickermedblue 3s infinite;
    animation: flickermedblue 3s infinite;
    animation-direction: alternate;
}

.flicker-slow-blue {
    -webkit-animation: flickerslowblue 5s infinite;
    animation: flickerslowblue 5s infinite;
    animation-direction: alternate;
}

/*purple*/
.flicker-fast-purple {
    -webkit-animation: flickerfastpurple 1s infinite;
    animation: flickerfastpurple 1s infinite;
    animation-direction: alternate;
}

.flicker-med-purple {
    -webkit-animation: flickermedpurple 3s infinite;
    animation: flickermedpurple 3s infinite;
    animation-direction: alternate;
}

.flicker-slow-purple {
    -webkit-animation: flickerslowpurple 5s infinite;
    animation: flickerslowpurple 5s infinite;
    animation-direction: alternate;
}



/*********************text flicker animations*/

/*red*/
@-webkit-keyframes flickerfastred {
    from {
        color: rgba(255, 175, 175, 0);
        text-shadow: 0px 0px 50px rgba(255, 0, 0, 0), 0px 0px 150px rgba(255, 100, 100, 0);
    }
    to {
        color: rgb(255, 175, 175);
        text-shadow: 0px 0px 50px rgba(255, 0, 0, 0.95), 0px 0px 150px rgba(255, 100, 100, 0.90);
    }
}

@-webkit-keyframes flickermedred {
    from {
        color: rgba(255, 175, 175, 0);
        text-shadow: 0px 0px 50px rgba(255, 0, 0, 0), 0px 0px 150px rgba(255, 100, 100, 0);
    }
    to {
        color: rgb(255, 175, 175);
        text-shadow: 0px 0px 50px rgba(255, 0, 0, 0.95), 0px 0px 150px rgba(255, 100, 100, 0.90);
    }
}

@-webkit-keyframes flickerslowred {
    from {
        color: rgba(255, 175, 175, 0);
        text-shadow: 0px 0px 50px rgba(255, 0, 0, 0), 0px 0px 150px rgba(255, 100, 100, 0);
    }
    to {
        color: rgb(255, 175, 175);
        text-shadow: 0px 0px 50px rgba(255, 0, 0, 0.95), 0px 0px 150px rgba(255, 100, 100, 0.90);
    }
}

/*yellow*/
@-webkit-keyframes flickerfastyellow {
    from {
        color: rgba(255, 255, 175, 0);
        text-shadow: 0px 0px 3px rgba(255, 255, 0, 0), 0px 0px 15px rgba(255, 255, 100, 0);
    }
    to {
        color: rgb(255, 255, 175);
        text-shadow: 0px 0px 3px rgba(255, 255, 0, 0.95), 0px 0px 15px rgba(255, 255, 100, 0.9);
    }
}

@-webkit-keyframes flickermedyellow {
    from {
        color: rgba(255, 255, 175, 0);
        text-shadow: 0px 0px 3px rgba(255, 255, 0, 0), 0px 0px 15px rgba(255, 255, 100, 0);
    }
    to {
        color: rgb(255, 255, 175);
        text-shadow: 0px 0px 3px rgba(255, 255, 0, 0.95), 0px 0px 15px rgba(255, 255, 100, 0.9);
    }
}

@-webkit-keyframes flickerslowyellow {
    from {
        color: rgba(255, 255, 175, 0);
        text-shadow: 0px 0px 3px rgba(255, 255, 0, 0), 0px 0px 15px rgba(255, 255, 100, 0);
    }
    to {
        color: rgb(255, 255, 175);
        text-shadow: 0px 0px 3px rgba(255, 255, 0, 0.95), 0px 0px 15px rgba(255, 255, 100, 0.9);
    }
}

/*green*/
@-webkit-keyframes flickerfastgreen {
    from {
        color: rgba(175, 255, 175, 0);
        text-shadow: 0px 0px 50px rgba(0, 255, 0, 0), 0px 0px 150px rgba(100, 255, 100, 0);
    }
    to {
        color: rgb(175, 255, 175);
        text-shadow: 0px 0px 50px rgba(0, 255, 0, 0.95), 0px 0px 150px rgba(100, 255, 100, 0.90);
    }
}

@-webkit-keyframes flickermedgreen {
    from {
        color: rgba(175, 255, 175, 0);
        text-shadow: 0px 0px 50px rgba(0, 255, 0, 0), 0px 0px 150px rgba(100, 255, 100, 0);
    }
    to {
        color: rgb(175, 255, 175);
        text-shadow: 0px 0px 50px rgba(0, 255, 0, 0.95), 0px 0px 150px rgba(100, 255, 100, 0.90);
    }
}

@-webkit-keyframes flickerslowgreen {
    from {
        color: rgba(175, 255, 175, 0);
        text-shadow: 0px 0px 50px rgba(0, 255, 0, 0), 0px 0px 150px rgba(100, 255, 100, 0);
    }
    to {
        color: rgb(175, 255, 175);
        text-shadow: 0px 0px 50px rgba(0, 255, 0, 0.95), 0px 0px 150px rgba(100, 255, 100, 0.90);
    }
}

/*blue*/
@-webkit-keyframes flickerfastblue {
    from {
        color: rgba(175, 175, 255, 0);
        text-shadow: 0px 0px 50px rgba(0, 0, 255, 0), 0px 0px 150px rgba(100, 100, 255, 0);
    }
    to {
        color: rgb(175, 175, 255);
        text-shadow: 0px 0px 50px rgba(0, 0, 255, 0.95), 0px 0px 150px rgba(100, 100, 255, 0.90);
    }
}

@-webkit-keyframes flickermedblue {
    from {
        color: rgba(175, 175, 255, 0);
        text-shadow: 0px 0px 50px rgba(0, 0, 255, 0), 0px 0px 150px rgba(100, 100, 255, 0);
    }
    to {
        color: rgb(175, 175, 255);
        text-shadow: 0px 0px 50px rgba(0, 0, 255, 0.95), 0px 0px 150px rgba(100, 100, 255, 0.90);
    }
}

@-webkit-keyframes flickerslowblue {
    from {
        color: rgba(175, 175, 255, 0);
        text-shadow: 0px 0px 50px rgba(0, 0, 255, 0), 0px 0px 150px rgba(100, 100, 255, 0);
    }
    to {
        color: rgb(175, 175, 255);
        text-shadow: 0px 0px 50px rgba(0, 0, 255, 0.95), 0px 0px 150px rgba(100, 100, 255, 0.90);
    }
}

/*purple*/
@-webkit-keyframes flickerfastpurple {
    from {
        color: rgba(255, 175, 255, 0);
        text-shadow: 0px 0px 50px rgba(255, 0, 255, 0), 0px 0px 150px rgba(255, 100, 255, 0);
    }
    to {
        color: rgb(255, 175, 255);
        text-shadow: 0px 0px 50px rgba(255, 0, 255, 0.95), 0px 0px 150px rgba(255, 100, 255, 0.90);
    }
}

@-webkit-keyframes flickermedpurple {
    from {
        color: rgba(255, 175, 255, 0);
        text-shadow: 0px 0px 50px rgba(255, 0, 255, 0), 0px 0px 150px rgba(255, 100, 255, 0);
    }
    to {
        color: rgb(255, 175, 255);
        text-shadow: 0px 0px 50px rgba(255, 0, 255, 0.95), 0px 0px 150px rgba(255, 100, 255, 0.90);
    }
}

@-webkit-keyframes flickerslowpurple {
    from {
        color: rgba(255, 175, 255, 0);
        text-shadow: 0px 0px 50px rgba(255, 0, 255, 0), 0px 0px 150px rgba(255, 100, 255, 0);
    }
    to {
        color: rgb(255, 175, 255);
        text-shadow: 0px 0px 50px rgba(255, 0, 255, 0.95), 0px 0px 150px rgba(255, 100, 255, 0.90);
    }
}