Template:Icon/styles.css

.loka-icon {
	display: inline;
}

/* Breathing room between the icon graphic and whatever sits right after it
   -- the editor's own following word for a bare icon, or the bundled
   label link for a linked one. */
.loka-icon img {
	margin-right: .2em;
}

/* A linked icon is really two adjacent <a>s (image + label) to the same
   target, not one -- MediaWiki here doesn't parse a [[File:...]] nested
   inside another link's label (confirmed live: the brackets come out as
   literal text), and raw <a href> HTML is sanitized away (also confirmed
   live), so a true single anchor isn't reachable from wikitext. Hovering
   the *parent* span to underline both children makes the pair read and
   behave as one link regardless of which half the pointer is actually
   over -- the icon sits in the link the same way an emoji sits in text. */
.loka-icon--linked a {
	text-decoration: none;
}

.loka-icon--linked:hover a {
	text-decoration: underline;
}

.loka-icon--orbs img {
	vertical-align: -1.5px;
}

.loka-icon--ascalon img {
	vertical-align: middle;
}

.loka-icon--kalros img {
	vertical-align: middle;
}

.loka-icon--garama img {
	vertical-align: middle;
}

.loka-icon--aladra img {
	vertical-align: middle;
}

.loka-icon--balak img {
	vertical-align: middle;
}

.loka-icon--rivina img {
	vertical-align: middle;
}

.loka-icon--zyre img {
	vertical-align: middle;
}

.loka-icon--the-end img {
	vertical-align: middle;
}

.loka-icon--nether img {
	vertical-align: middle;
}

.loka-icon--loka img {
	vertical-align: -1.5px;
}