[class*=jpa-] {
	display: inline-block;
	width: 1em;
	height: 1em;
	margin: -.2ex .05em 0 .1em;
	line-height: normal;
	vertical-align: middle;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 1em 1em;
}

$size-map: (
	"sm": 1,
	"med": 2,
	"lg": 4
);

@each $name, $size in $size-map {
	.jpa-#{$name} {
		width: 32px * $size;
		height: 32px * $size;
		margin: -.2ex * $size .05em * $size 0 .1em * $size;
		background-size: 1em * $size 1em * $size;
	}
}

@import '_joypixels-awesome.map';

@each $code, $name in $emoji-map {

	.jpa-#{$name} {
		background-image: url("https://cdn.jsdelivr.net/joypixels/assets/#{$version}/png/unicode/128/#{$code}.png");
	}

	.jpa-rel-#{$name} {
		background-image: url("joypixels/assets/#{$version}/png/unicode/128/#{$code}.png");
	}
}