html {
    background-attachment: fixed;
    background-color: black;
    background-image: url("../images/stars.gif");
    font-family: Arial, Helvetica, sans-serif;
}

header>h1 {
    color: white;
}

p.author,
p.date {
    display: none
}

body>h1 {
    text-align: center;
}

body>h1>span {
    font-style: italic;
    text-decoration: underline;
    border-radius: 500px;
    padding: 0.2em 1.5em;
    background-color: #0360df;
    background-image: radial-gradient(75% 50% at 50% 0%, purple, transparent), radial-gradient(75% 35% at 50% 80%, orange, transparent);
}

p {
    color: white;
    font-style: italic;
    text-align: center;
    font-weight: lighter;
}

ul {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    padding: 0px;
}

li {
    display: grid;
}

li>figure {
    margin: 5px;
    padding: 5px;
    border: 2px outset #616161;
    border-style: outset;
    background: #c0c0c0;
    background-image: url("../images/concrete.jpg");
    background-size: 190px;
}

li>figure>img {
    box-sizing: border-box;
    padding: 10px;
    border: 2px inset darkgrey;
    background: white;
}

li>figure>figcaption {
    vertical-align: middle;
    font-size: small;
    text-transform: uppercase;
    text-align: center;
}

#recent+p+ul>li>figure>figcaption {
    text-transform: lowercase;
}

/* #top+p+ul>li:last-child {
    grid-column-end: -2;
} */

@media only screen and (min-width: 992px) {

    ul {
        grid-template-columns: 1fr 1fr 1fr 1fr;
    }
/* 
    #top+p+ul>li:nth-last-child(2) {
        grid-column-end: -3;
    }

    #top+p+ul>li:last-child {
        grid-column-end: -2;
    } */

}