body{
    text-align: center;
}

h1, h2 {
    font-family: 'Merriweather Sans', sans-serif;
}

img{
    cursor: pointer;
}

.grid{
    display: grid;
    grid-template-columns: 1fr;
    background-image: radial-gradient(white, black) ;
    padding: 10vw;
    border-radius: 12px;
}

@keyframes animateEnlarge {
    from {}
    to {
        max-width: 120%;
    }
}

@keyframes animateShrink {
    from {
        max-width: 120%;
    }
    to {
        max-width: 50%;
    }
}

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

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

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