* {
    padding: 0px;
    margin: 0px;
    box-sizing: border-box;
}

body {
    display: flex;
    flex-direction: column;
    height: 100vh;
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
}

h1 {
    width: 100%;
    text-align: center;
    padding: 8px
}

main {
    display: flex;
    flex-grow: 1;
    gap: 8px;
    flex-direction: row;
    flex-wrap: wrap;
    padding: 8px 64px;
}

#emu {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border: 2px #1A2A3F solid;
    border-radius: 4px;
    height: fit-content;
    padding: 16px 12px;
    margin: 2px;
    box-shadow: 2px 2px 2px black;
    transition: all 128ms;
}

#emu:hover {
    box-shadow: 4px 6px 4px black;
    transform: translate(-2px, -4px);
    background-color: #d2d4e2;
}

#emu a {
    border: 2px #acabbc solid;
    color: #0a0b1a;
    text-decoration: none;
    border-radius: 4px;
    padding: 2px 8px;
    transition: all 196ms;
}

#emu a:hover {
    background-color: #acabbc;
    color: #2a2b3c;
    scale: 105%;
}

#emu a:active {
    background-color: #121234;
    color: #1A2A3F;
    scale: 95%;
}

footer {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    padding: 8px 64px;
    border-top: 2px #121234 solid;
}

footer a {
    color: #0a0b1a;
    text-decoration: none;
    text-shadow: 0px 0px 6px #2a2b3c;
    transition: all 32ms;
}

footer a:hover {
    scale: 110%;
}