:root {
  --dark: #222430;
  --light: #ddd;
  --link: #c0c;
  --link-hover: #f0f;
  --turquoise: #3ed2cb;
  --turquoise-dark: #26817d;
}

.hl,
h1.hl,
h2.hl,
h3.hl,
h4.hl {
	color: var(--turquoise);
}

.reveal {
	font-size: 28px;
}

.reveal a,
.reveal a:visited {
	color: var(--link);
}

.reveal a:hover,
.reveal a:active {
	color: var(--link-hover);
}

.img-bg-light {
	background-color: #edf;
	border-radius: 5px;
}

body.reveal-viewport {
	background: var(--light);
}

.reveal h1 {
  text-shadow:
  0 1px 0 red,
  0 2px 0 orange,
  1px 3px 0 yellow,
  1px 4px 0 green,
  2px 5px 0 cyan,
  2px 6px 0 blue,
  2px 7px 0 violet;
}

.reveal h1.notransform,
.reveal h2.notransform,
.reveal h3.notransform,
.reveal h4.notransform {
	text-transform: none;
}

quote {
	border-left: 7px solid gray;
	padding-left: 0.5em;
	margin: 0.3em 0;
	font-size: 1.1em;
	display: block;
	text-align: left;
}

i {
	text-decoration: underline dotted;
	font-style: italic;
}

.rainbow-gradient {
  background: linear-gradient(to right, red, orange , yellow, green, cyan, blue, violet);
}
.rainbow-text {
  background: linear-gradient(to right, red, orange , yellow, green, cyan, blue, violet);
  background-clip: text;
  -webkit-text-fill-color: transparent;
}