html,
html * {
    box-sizing: border-box;
    color: #FFFFFF;
}

html {
    background-image: url("img/background-low-poly-grid-haikei.svg");
    background-size: cover;
}

body {
    padding: 10px;
}

div.row {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 10px;
}

a:has(img) {
    display: inline-block;
    width: 120px;
    height: 120px;
    border: 8px solid #333333;
    border-radius: 50%;
    overflow: hidden;
    flex-grow: 0;
    flex-shrink: 0;
}

a > img {
    height: 100%;
    width: 100%;
    object-fit: scale-down;
    zoom: 1.1;
}
a:has(img.center75) {
    display: inline-flex;
    justify-items: center;
    align-items: center;
    justify-content: center;
}

a > img.center75 {
    height: 75%;
    width: 75%;
    object-fit: contain;
}

a:has(img):hover,
a:has(img):active {
    border-width: 4px;
    border-color: #398EE7;
}