
a.webbadge {
	grid-column-end: span 2;
}

a.webbadge.vertical-webbadge {
	height: 5.52em;
	grid-column-end: span 1;
	grid-row-end: span 2;
	margin-left: auto;
	margin-right: auto;
}

.badge-wall {
	display: grid;
	grid-template-columns: repeat(var(--cols, 2), 3.3em);
	width: fit-content;
	gap: .3em;
}

@media (min-width: 12em) {
	.badge-wall { --cols: 3; }
}

@media (min-width: 15.5em) {
	.badge-wall { --cols: 4; }
}

@media (min-width: 19em) {
	.badge-wall { --cols: 5; }
}

@media (min-width: 22.5em) {
	.badge-wall { --cols: 6; }
}

@media (min-width: 26em) {
	.badge-wall { --cols: 7; }
}

@media (min-width: 30em) {
	.badge-wall { --cols: 8; }
}

@media (min-width: 34em) {
	.badge-wall { --cols: 9; }
}

@media (min-width: 38.5em) {
	.badge-wall { --cols: 10; }
}

@media (min-width: 42em) {
	.badge-wall { --cols: 11; }
}

@media (min-width: 45.5em) {
	.badge-wall { --cols: 12; }
}

@media (min-width: 49em) {
	.badge-wall { --cols: 13; }
}

@media (min-width: 53em) {
	.badge-wall { --cols: 15; }
}

@media (min-width: 62em) {
	.badge-wall { --cols: 17; }
}

