body { background-color:#efefef; }
ul { list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; justify-content:center; width:100%; }
ul li { background-color:#fff; margin:10px; display:flex; align-items:center; justify-content:center; padding:19px; border:1px solid #ebebeb; width:100px; height:100px; transition:transform 0.5s ease-in-out; }
ul li img { max-width:85px; max-height:85px; margin-bottom:10px; }
ul li span { display:block; clear:both; text-align:center; font-weight:bold; }
ul li a { text-decoration:none; color:#333; }
ul li .icon { text-transform:uppercase; text-align:center; height:70px; width:70px; background-color:#efefef; border-radius:10px; margin:0 auto 10px; font-size:3rem; font-weight:bold; color:#fff; display:flex; align-items:center; justify-content:center; }

@media only screen and (min-width: 375px) {
    ul li img { max-width:100px; max-height:100px; margin-bottom:10px; }
    ul li { padding:30px; width:100px; height:100px; }
    ul li .icon { height:85px; width:85px; margin:0 auto 20px; font-size:3rem; }
}

@media only screen and (min-width: 1024px) {
    main { width:1024px; margin:0 auto; display:block; }
    ul li { width:150px; height:150px; }
    ul li:hover { transform:scale(1.05); }
}