html {
    height: 100%;
}
body {
    background-color: darkgreen;
    width: 100%;
    height: 100%;
    margin: 0;
}

nav {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    grid-template-rows: repeat(auto-fill, minmax(250px, 1fr));
    justify-content: center;
}

nav a {
    text-align: center;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-image: url("../images/background.png");
}

a img {
    width: 50%;
    height: 50%;
    margin: 20%;
}

nav a:hover {
    background-color: purple;
    background-image: none;
}