@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap');
body{
    margin: 0;
    padding: 0;
    background-image: url(../event_assets/space-1569133.jpg);
    background-size: cover;
    background-attachment: fixed;
}

#up-arrow {
    position: fixed;
    bottom: 10px;
    right: 30px;
    height: 70px;
    animation: uparrow 1s infinite;
    z-index: 3;
}

@keyframes uparrow {
    from {
        transform: translateY(0px);
    }

    to {
        transform: translateY(-10px);
    }

}

#events-head{
    font-size: 70px;
    text-align: center;
    font-family: 'Press Start 2P';
    color: white;
    text-shadow: 0 0 5px #fff700, 0 0 10px #01c8ff, 0 0 15px #0073e6, 0 0 20px #0073e6, 0 0 25px #0073e6, 0 0 30px #01d5ff, 0 0 35px #0173ff;

}
#equinox-box,
#illuminati-box,
#synergy-box,
#aero-box,
#robotrax-box,

#literary-box,
#management-box,
#pharmquimica-box,
#design-box,
#media-box,
#lan-box,
#open-box
{
    display: flex;
    justify-content: space-around;
}

#equinox {
    font-size: 20px;
    border: 1px solid black;
    width: 550px;
    padding: 20px;
    letter-spacing: 1px;
    font-weight: 600;
    background-color:rgb(0, 187, 255);
    font-family: 'Press Start 2P';
    clip-path: polygon(49% 0, 100% 100%, 0 99%, 0 75%, 0 50%, 0 0);


}

#equinox-main {
    position: relative;
    margin-top: 80px;
    margin-bottom: 40px;
}

#equinox-line {

    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;

    height: 2px;
    background-color: rgb(0, 187, 255);
}

.event-main {
    /* background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0), black), url("/event_assets/Atalayar_FIFA\ 21.jpg"); */
    height: 300px;
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
    width: 250px;
    transition: all 2s ease;
}

.event-main:hover {

    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.527), black), url("../event_assets/Atalayar_FIFA\ 21.jpg");
}

.event-main:hover::before {
    content: "";
    position: absolute;

    height: 40px;
    width: 40px;

    left: 40%;
    top: 40%;

    background-image: url("../event_assets/add.png");
    background-size: cover;


}


#event-name {
    color: white;
    position: absolute;
    font-size: 30px;
    font-weight: 600;
    font-family: 'Courier New', Courier, monospace;
    bottom: 0;
    left: 0;
    width: 100%;
    text-align: center;
}