* {
  margin: 0;
  padding: 0;
}

:root {
    --column-width: min(90vh, 70vw);
    --margin-width: calc((100vw - var(--column-width)) / 2);

    --dark-gray:  rgb(27, 36, 48);
}

body {
    /*background-image: conic-gradient(#ee7752, #e73c7e, #23a6d5, #23d5ab,#ee7752);*/
    /*filter: blur(20px);*/
    background-image: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
    background-size: 100vw 100vh;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
}

nav, footer {
    background-color: var(--dark-gray);
    color: floralwhite;
}
.footer-container {
    font-size:0.85em;
    height:2em;

    display: flex;
    align-items:center;
    justify-content: space-between;
}
.footer-container > a {
    color: floralwhite;
}

.centered-column {
    margin-left: var(--margin-width);
    margin-right: var(--margin-width);
}

.flex-column {
    min-height:100vh;
    display:flex;
    flex-direction: column;
}

.card-container {
    padding-top: 2em;
    display:grid;
    grid-template-columns: 1fr;
    gap: 1em;
}
.card {
    padding: 2em 5em;
    box-shadow: 5px 5px 10px black;
    background: floralwhite;

    display: flex;
}
.align-right {
    margin-left: auto;
}

.align-bottom {
    margin-top: auto;
}

@media (min-width: 500px) { .card-container { grid-template-columns: 1fr 1fr; } }