dt {
  font-weight: bold;
  margin-top: 0.5em;
  display: inline-block;
  margin-bottom: 2px;
  clear: both; }

dl.inline dt {
  width: 200px;
  float: left;
  text-align: right;
  padding-right: 15px;
  clear: both;
  margin: 0 0 2px 0; }

.structural li {
  color: #333; }
.structural li:first-child,
.structural li:last-child {
  font-weight: bold; }
.structural li:first-of-type,
.structural li:last-of-type {
  text-decoration: line-through; }
.structural li:nth-child(even) {
  background-color: #CCC; }
.structural li:nth-child(3) {
  color: #CCC; }
.structural li:nth-of-type(odd) {
  background-color: #FFF; }
.structural li:nth-of-type(4n) {
  color: #ddaa00; }
.structural li:nth-of-type(3n-1) {
  text-align: right; }

.count {
  margin: 0 10px;
  padding: 0; }
  .count li {
    background-color: #ddd;
    display: inline-block;
    text-align: center;
    color: black; }
  .count li:nth-of-type(odd) {
    background-color: #da0;
    color: white; }
  .count li:only-of-type {
    width: 100%; }
  .count li:nth-of-type(1):nth-last-of-type(2),
  .count li:nth-of-type(2):nth-last-of-type(1) {
    width: 50%; }
  .count li:nth-of-type(1):nth-last-of-type(3),
  .count li:nth-of-type(3):nth-last-of-type(1),
  .count li:nth-of-type(2):nth-last-of-type(2) {
    width: 33.33%; }
  .count li:nth-of-type(1):nth-last-of-type(4),
  .count li:nth-of-type(2):nth-last-of-type(3),
  .count li:nth-of-type(3):nth-last-of-type(2),
  .count li:nth-of-type(4):nth-last-of-type(1) {
    width: 25%; }

.firstletter:first-of-type::first-letter {
  position: relative;
  top: 8px;
  float: left;
  font-size: 3em;
  line-height: 1;
  color: #ddaa00;
  padding: 0 4px 2px 0;
  font-weight: bold; }

input[type=checkbox]:checked + label {
  color: red; }

input {
  transform: scale(1.01); }

input:valid {
  border: 1px solid green; }

input:invalid {
  border: 1px solid red; }

input:required,
input[aria-required="true"] {
  border-width: 5px; }

input:optional {
  border-width: 10px; }

input:out-of-range {
  background-color: #cc0000; }

input:in-range {
  background-color: lightgreen; }

.thisSlide *::selection {
  background-color: #ddaa00;
  color: #333333; }

.thisSlide.foo {
  -webkit-tap-highlight-color: #bada55;
  -webkit-user-select: none;
  -webkit-touch-callout: none; }

.beforeafter:before {
  content: "before - ";
  font-weight: bold; }

.beforeafter:after {
  content: " - after";
  font-weight: bold; }

.ex.right {
  float: right;
  width: 200px; }

.active {
  color: red;
  font-weight: bold;
  background-color: rgba(255, 255, 255, 0.3); }

.columns {
  -webkit-columns: 3;
  columns: 3;
  font-size: 0.9rem;
  line-height: 1; }

:root {
  font-size: 162.5%; }

body {
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif, 'Droid Sans';
  padding: 0;
  margin: 0;
  width: 100%;
  height: 100%;
  left: 0px;
  top: 0px;
  background: #333333;
  color: #ddd; }

dt {
  background-color: #444; }

.title h1 {
  color: #da0; }

.slide:after {
  color: #d0a; }
