style.css

*{
    box-sizing:border-box;
}

h1{
    text-align:center;
}

h2{
    text-align:center;
}

.gallery{
    vertical-align: top;
}
/* Clear floats after the columns */
.gallery:after {
    content: "";
    display: table;
    clear: both;
}

.image{
    width: 15%;
    padding: 1px;
    display:inline-block;
}

.image:hover{
    transition:all ease-in-out 0.2s;
    transform: scale(1.05, 1.05);
}

.description{
    text-align:left;
    background:white;
    font-size:0.65em;
    padding:0;
    height:min-content;
    word-break: break-all;
}

@media only screen and (max-width:1400px){
    .image{
        width:19.5%;
    }
}

@media only screen and (max-width:1300px){
    .image{
        width:19.5%;
    }
}

@media only screen and (max-width:900px){
    .image{
        width:24%;
    }
}

@media only screen and (max-width:800px){
    .image{
        width:24%;
    }
}

@media only screen and (max-width:700px){
    .image{
        width:32%;
    }
}

@media only screen and (max-width:500px){
    .image{
        width:48%;
    }
}

@media only screen and (max-width:380px){
    .image{
        width:100%;
    }
}