:root {
    --text-color: #fff;
    --background: #383C4A;
    --background-darker: #2E323E;
    --background-darkest: #2A2D38;
    --blue: #5BCEFA;
    --pink: #F5A9B8;
    --blurple: #7289DA;
    --dark-blurple: #4E5D94;
    --href: var(--blurple);
    --href-darker: var(--dark-blurple);
    --main-font: "OpenDyslexic2";
}

#shadow img {
    position: relative;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2), 0 6px 20px rgba(0, 0, 0, 0.15);
    border-radius: 25px;
}

.pulse {
    animation: pulse 1s infinite ease-in-out alternate;
}

@keyframes pulse {
    from {
        transform: scale(0.8);
    }
    to {
        transform: scale(1.2);
    }
}

#wordmark {
    filter: drop-shadow(2px 2px 4px #222);
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

#universe .grid-container {
    padding-top: 2px;
    align-items: center;
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
}

#universe figure {
    text-align: center;
    padding: 5px;
}

#universe figcaption {
    background-color: var(--blurple);
}

#universe figure img {
    border-radius: 2px;
    background-color: var(--dark-blurple);
    padding-bottom: 0;
    height: 475px;
    width: 260px;
}