body { background: #fff; font-family: Arial, sans-serif; text-align: center; }
.logo { display: block; max-width: 900px; margin: 100px auto; }
.wrap { max-width: 960px; margin: 0 auto; }
.row { display: flex; flex-direction: row; justify-content: space-evenly; }
.site { width: 25%; border-radius: 25px; padding: 30px; box-shadow: 0px 3px 0px rgba(0,0,0,0.2); }
    .site.workplace { background: #ef6869; }
    .site.education { background: #167ac1; }
    .site.sport { background: #469723; }
    .site img { width: 100px; display: block; margin-top: 10px; margin-left: auto; opacity: 0.4; }
    .site a, .site a:active, .site a:visited, .site a:hover { font-weight: 200; color: #fff; font-size: 40px; text-decoration: none; }

@media only screen and (max-width: 960px) {
    .row { display: block; }
    .row .site { width: 70%; margin: 20px auto; }
}