nav {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: 1fr 1fr 1fr;
	grid-template-areas: "client client" "editor skins" "source patreon";
	grid-gap:2px;
	margin: 2em auto 0 auto;
}

nav a {
	font-size: 1.7em;
	font-weight: 600;
	display: block;
	text-align: center;
	padding: 8px;
	text-decoration: none;
	text-shadow: none;
	border-radius: 4px;
}

nav a:hover {
	color: #111;
}

/* Client */
#linkClient {grid-area: client;}
#linkClient:not(:hover) {
	background: var(--theme-color-dark);
	color: var(--theme-color);
}

#linkClient:hover {
	background: var(--theme-color);
}

/* Editor */
#linkEditor {grid-area: editor;}
#linkEditor:not(:hover) {
	background: var(--editor-theme-color-dark);
	color: var(--editor-theme-color);
}

#linkEditor:hover {
	background: var(--editor-theme-color);
}

/* Skins */
#linkSkins {grid-area: skins;}
#linkSkins:not(:hover) {
	background: var(--skins-theme-color-dark);
	color: var(--skins-theme-color);
}

#linkSkins:hover {
	background: var(--skins-theme-color);
}

/* Source */
#linkSource {grid-area: source;}
#linkSource:not(:hover) {
	background: #292929;
	color: #eee;
}

#linkSource:hover {
	background: #eee;
}

/* Patreon */
#linkPatreon {grid-area: patreon;}
#linkPatreon:not(:hover) {
	background: var(--patreon-orange);
	color: #eee;
}

#linkPatreon:hover {
	background: var(--patreon-orange);
	color: var(--patreon-navy);
}