svg {
    font-family: Arial, sans-serif;
    font-weight: bold;
    margin: -80px -30px;
    transform: scale(0.8);
}

svg a {
    transition: 0.3s ease-in-out;
    transform-origin: center;
}

path {
    fill: #f1f1f1;
    stroke: #2d2d2d;
    transition: 0.3s ease-in-out;
    filter: url("#drop-shadow");
}

g:hover path {
    fill: #f4f4f4;
    filter: url("#drop-shadow2");
}

svg a:hover, svg a:focus {
    transform: scale(1.02);
}

svg {
    text-align: center;
}

.hexGreen path {
    fill: #AFCC49;
}

.hexGreen:hover path {
    fill: #a7c248;
}

.hexGrey path {
    fill: #BCBCBC;
}

.hexGrey:hover path {
    fill: #AFAFAF;
}

@supports (-webkit-touch-callout: none) {
    path {
        filter: none;
    }

    g:hover path {
        filter: none;
    }
}