*,
*::before,
*::after {
    box-sizing: border-box;
}

* {
    margin: 0;
}

:root {
    /* Old Style */
    --font-old: 'Iowan Old Style', 'Palatino Linotype', 'URW Palladio L', P052, serif;
    /* Rounded Sans */
    --font-default: ui-rounded, 'Hiragino Maru Gothic ProN', Quicksand, Comfortaa, Manjari, 'Arial Rounded MT', 'Arial Rounded MT Bold', Calibri, source-sans-pro, sans-serif;
    --primary: blue;
}

body {
    font-family: var(--font-default);
    background-color: darkslategray;
}

main {
    padding: 2em;
}

header {
    background-color: azure;
    padding: 2em;
}

footer {
    background-color: azure;
    margin-top: 3em;
    padding: 1em;
    display: flex;
    ul {
        display: flex;
        * {
            grid-auto-flow: column;
            margin-right: 3em;
            gap: 13em;
            list-style-type: none
        }
    }
}

nav {

}

h1,
h2,
h3,
h4 {
    font-family: var(--font-old);
    color: azure;
}

p {
    font-family: var(--font-default);
}

a {
    text-decoration: none;
    color: inherit;
}

a:hover {
    text-decoration: underline;
}

.info-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, 25em);
    justify-content: center;
    margin-top: 2em;
    gap: 1em;

    article {
        display: flex;
        flex-direction: column;
        display: grid;
        place-items: end;
        img {
            border-radius: 1em;
            grid-row: 1 / 2;
            grid-column: 1 / 2;
            width: 100%;
            object-fit: cover;
            display: block;
        }
        
        div {
            border-radius: 1em;
            padding: 1em;
            background-color: black;
            color:aliceblue;
            grid-row: 1 / 2;
            grid-column: 1 / 2;
            height: max-content;
            width: 100%;
        }
    }
}

.info-container>article {}