
/* -- Backgrounds -- */

.highlight {
	background: #eeeeee;
}
.highlight.white {
	background: white;
}
.highlight.light-gray {
	background: #e0e0e0;
}
.highlight.dark-gray {
	background: linear-gradient(150deg, #2c3e50, #5d6d7e);
}
.highlight.black {
	background: linear-gradient(150deg, #252521, #17202a);
}
.highlight.gray {
	background: #546275;
}
.highlight.blue {
	background: linear-gradient(150deg, #0669bf, #4b8ab3);
}
.highlight.navy-blue {
	background: #023059;
}
.highlight.dark-blue {
	background: linear-gradient(140deg, #0d47a1, #0a325a);
}
.highlight.indigo {
	background: linear-gradient(150deg, #614385, #516395);
}
.highlight.violet {
	background: #516395;
}
.highlight.aquamarine {
	background: linear-gradient(150deg, #c6ffdd, #89bef9);
}
.highlight.purple {
	background: linear-gradient(150deg, #197ad0, #8966c9 70%);
}

/* -- Styles -- */

.highlight hr:not(.margin) {
	background: #e0e0e0;
}
.highlight.violet hr:not(.margin) {
	opacity: 0.4;
}


/* -- Dark Styles -- */

.highlight.dark-gray,
.highlight.black,
.highlight.gray,
.highlight.blue,
.highlight.navy-blue,
.highlight.dark-blue,
.highlight.indigo,
.highlight.violet,
.highlight.purple {
	color: white;
}
.highlight.dark-gray a:not(.button),
.highlight.black a:not(.button),
.highlight.gray a:not(.button),
.highlight.blue a:not(.button),
.highlight.navy-blue a:not(.button),
.highlight.dark-blue a:not(.button),
.highlight.indigo a:not(.button),
.highlight.violet a:not(.button),
.highlight.purple a:not(.button) {
	text-decoration: underline;
	color: white;
}
.highlight.dark-gray .button,
.highlight.black .button,
.highlight.gray .button,
.highlight.blue .button,
.highlight.navy-blue .button,
.highlight.dark-blue .button,
.highlight.indigo .button,
.highlight.violet .button,
.highlight.purple .button {
	background: rgba(255, 255, 255, 0.2);
	border-color: transparent;
	color: white;
}
.highlight.dark-gray .button.image,
.highlight.black .button.image,
.highlight.gray .button.image,
.highlight.blue .button.image,
.highlight.navy-blue .button.image,
.highlight.dark-blue .button.image,
.highlight.indigo .button.image,
.highlight.violet .button.image,
.highlight.purple .button.image {
	background: transparent;
}


/* -- Black Theme -- */

@media (prefers-color-scheme: dark) {
	/*html, body {
		background: #252521;
		color: white;
	}*/
}