.fat-fingers {
  fill: transparent;
}
@media (any-hover: hover) {
  .fat-fingers {
    display: none !important;
  }
}
@media (any-hover: none) {
  .rp-controls-help {
    display: none;
  }
}
.rp-controls-help {
  cursor: pointer;
  height: 100%;
}
.rp-help-dialog {
  background-color: rgba(0,0,0,0.85);
  color: #fff;
  font-size: 1.5rem;
  height: 100vh;
  padding: 5vh 10vh;
  width: 160vh;
  position: fixed;
  left: calc(50vw - 80vh);
  top: 0;
  z-index: 1001;
}
.rp-help-dialog > button {
  background: none;
  border: none;
  color: #f00;
  cursor: pointer;
  font-family: sans-serif;
  font-size: 5em;
  position: absolute;
  right: 2%;
  top: -1%;
}
.rp-help-tables {
  display: flex;
  justify-content: space-around;
}
.rp-help-tables > table {
  border-collapse: separate;
  border-spacing: 1em 1.5em;
  font-family: sans-serif;
  vertical-align: top;
}
.rp-help-tables > table > caption {
  color: #1a69b5;
  font-family: sans-serif;
  font-size: 1.2em;
  font-weight: bold;
}
.rp-help-tables > table th {
  font-weight: normal;
  text-align: right;
}
.rp-help-tables kbd {
  color: #ff0;
}
.rp-loading-screen {
  background-color: rgba(0,0,0,0.7);
  display: block;
  height: 100%;
  position: absolute;
  width: 100%;
  z-index: 10000;
}
.rp-loading-spinner {
  border: 2rem solid #f3f3f3;
  border-top: 2rem solid #1a69b5;
  border-radius: 50%;
  margin: 40vmin auto 0 auto;
  width: 20vmin;
  height: 20vmin;
  animation: spin 1s linear infinite;
}
@-moz-keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@-webkit-keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@-o-keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.draggable {
  cursor: grab;
  cursor: -webkit-grab;
}
body.dragging .lv-canvas,
body.dragging .draggable,
.dragging {
  cursor: grabbing;
  cursor: -webkit-grabbing;
}
body {
  font-family: "Alegreya";
}
* {
  -webkit-tap-highlight-color: transparent !important;
}
.lv-canvas {
  background: #121212;
  color: #fff;
}
.lv-player.editor {
  background-color: #134e86;
}
.lv-thumbnail-title,
.lv-thumbnail-time {
  font-family: "Droid Sans Mono", sans-serif;
}
.lv-settings-dialog > table > tbody > tr {
  font-family: "Roboto Slab", sans-serif;
}
.lv-controls-time {
  font-family: "Droid Sans Mono", sans-serif;
}
body {
  overflow: hidden;
}
.rp-canvas {
  font-size: 1.5rem;
}
.rp-canvas *:focus {
  outline: none;
}
.rp-canvas {
  user-select: none;
  -webkit-user-select: none;
}
/* colors */
.color-N {
  color: #ff0;
}
.color-N.fade {
  color: #404000;
}
.fill-N {
  fill: #ff0;
}
.fill-N.fade {
  fill: #404000;
}
.stroke-N {
  stroke: #ff0;
}
.stroke-N.fade {
  stroke: #404000;
}
.color-Z {
  color: #1a69b5;
}
.color-Z.fade {
  color: #0d345b;
}
.fill-Z {
  fill: #1a69b5;
}
.fill-Z.fade {
  fill: #0d345b;
}
.stroke-Z {
  stroke: #1a69b5;
}
.stroke-Z.fade {
  stroke: #0d345b;
}
.color-Q {
  color: #ae81ff;
}
.color-Q.fade {
  color: #220060;
}
.fill-Q {
  fill: #ae81ff;
}
.fill-Q.fade {
  fill: #220060;
}
.stroke-Q {
  stroke: #ae81ff;
}
.stroke-Q.fade {
  stroke: #220060;
}
.color-R {
  color: #a52117;
}
.color-R.fade {
  color: #3a0c08;
}
.fill-R {
  fill: #a52117;
}
.fill-R.fade {
  fill: #3a0c08;
}
.stroke-R {
  stroke: #a52117;
}
.stroke-R.fade {
  stroke: #3a0c08;
}
.color-M {
  color: #1bbb68;
}
.color-M.fade {
  color: #094124;
}
.fill-M {
  fill: #1bbb68;
}
.fill-M.fade {
  fill: #094124;
}
.stroke-M {
  stroke: #1bbb68;
}
.stroke-M.fade {
  stroke: #094124;
}
/* intro slide */
section h1 {
  color: #138684;
  font-size: 2.5em;
  padding-top: 1rem;
  width: 100%;
  text-align: center;
  position: static;
}
section h2 {
  color: #ff0080;
  display: block;
  font-size: 2em;
  text-align: center;
  width: 100%;
  position: absolute;
  top: 1.25rem;
}
#what-are {
  text-align: center;
  width: 100%;
  position: absolute;
  top: 7rem !important;
}
#number-two {
  color: #1a69b5;
  font-size: 2em;
}
#two-plus-two {
  color: #1a69b5;
  font-size: 3em;
}
*[id^="plus"],
*[id^="equals-"] {
  color: #1a69b5;
  font-size: 2.3em;
}
#apple-1 {
  position: absolute;
  top: 25rem;
  width: 5rem;
  left: 1.875rem;
}
#apple-2 {
  position: absolute;
  top: 25rem;
  width: 5rem;
  left: 6.875rem;
}
#apple-3 {
  position: absolute;
  top: 25rem;
  width: 5rem;
  left: 15rem;
}
#apple-4 {
  position: absolute;
  top: 25rem;
  width: 5rem;
  left: 20rem;
}
#apple-5 {
  position: absolute;
  top: 25rem;
  width: 5rem;
  left: 30rem;
}
#apple-6 {
  position: absolute;
  top: 25rem;
  width: 5rem;
  left: 35rem;
}
#apple-7 {
  position: absolute;
  top: 25rem;
  width: 5rem;
  left: 40rem;
}
#apple-8 {
  position: absolute;
  top: 25rem;
  width: 5rem;
  left: 45rem;
}
#money-1 {
  position: absolute;
  width: 11.25rem;
  left: 1.25rem;
  top: 38.4375rem;
  top: 38.125rem;
}
#money-2 {
  position: absolute;
  width: 11.25rem;
  left: 1.25rem;
  top: 38.4375rem;
  top: 37.5rem;
}
#money-3 {
  position: absolute;
  width: 11.25rem;
  left: 17.5rem;
  top: 38.125rem;
}
#money-4 {
  position: absolute;
  width: 11.25rem;
  left: 17.5rem;
  top: 37.5rem;
}
#money-5 {
  position: absolute;
  width: 11.25rem;
  left: 35rem;
  top: 38.125rem;
}
#money-6 {
  position: absolute;
  width: 11.25rem;
  left: 35rem;
  top: 37.5rem;
}
#money-7 {
  position: absolute;
  width: 11.25rem;
  left: 35rem;
  top: 36.875rem;
}
#money-8 {
  position: absolute;
  width: 11.25rem;
  left: 35rem;
  top: 36.25rem;
}
#money-9 {
  position: absolute;
  width: 11.25rem;
  left: 35rem;
  top: 35.625rem;
}
#money-10 {
  position: absolute;
  width: 11.25rem;
  left: 35rem;
  top: 35rem;
}
.canvas *:focus {
  outline: none;
}
#fractions-half {
  display: block;
  position: absolute;
  left: 0;
  top: 4rem;
  text-align: center;
  width: 100%;
  color: #ae81ff;
  font-size: 2em;
}
.fractions-eqn {
  position: absolute;
  text-align: center;
  line-height: 9rem;
  left: 20%;
  height: 9rem;
  width: 60%;
}
.fractions-eqn > * {
  position: absolute;
  top: 0;
}
.fractions-eqn > img,
.fractions-eqn > svg {
  width: 9rem;
  display: inline-block;
}
.fractions-eqn > :nth-child(1) {
  left: 0;
}
.fractions-eqn > :nth-child(3) {
  left: calc(9rem + 15%);
}
.fractions-eqn > :nth-child(5) {
  right: 0;
}
.fractions-eqn > span:nth-child(even) {
  color: #af1866;
  display: inline-block;
  font-size: 4em;
  vertical-align: top;
}
.fractions-eqn > span:nth-child(2) {
  left: calc(9rem + 4%);
}
.fractions-eqn > span:nth-child(4) {
  left: calc(100% - 18rem);
}
#fractions-pizza {
  top: 13.5rem;
}
#fractions-pizza > img {
  top: calc((1 - 694 / 894) / 2 * 9rem);
}
#fractions-hour {
  top: 24.5rem;
}
#fractions-baby {
  top: 35.5rem;
}
#fractions-pizza > img:nth-child(1),
#fractions-baby > img:nth-child(1) {
  clip-path: polygon(0% 0%, 50% 0%, 50% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 50% 0%, 50% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 50% 0%, 50% 100%, 0% 100%);
  left: calc(9rem / 2);
}
#fractions-pizza > img:nth-child(3),
#fractions-baby > img:nth-child(3) {
  clip-path: polygon(50% 0%, 100% 0%, 100% 100%, 50% 100%);
  -webkit-clip-path: polygon(50% 0%, 100% 0%, 100% 100%, 50% 100%);
  -webkit-clip-path: polygon(50% 0%, 100% 0%, 100% 100%, 50% 100%);
  left: calc(4.5rem + 15%);
}
.fractions-time {
  fill: rgba(26,105,181,0.627);
}
.crossout-parent {
  left: 0;
  top: 0;
  position: absolute;
  height: 100%;
  width: 100%;
}
#standard-svg circle {
  fill: none;
}
#standard-table {
  border-collapse: collapse;
}
#standard-table th,
#standard-table td {
  border: none;
  padding: 0.5em;
  text-align: left;
}
#standard-table thead {
  background-color: #138684;
}
#standard-table tr > :first-child {
  text-align: center;
}
#standard-table thead > tr > th:first-child {
  border-top-left-radius: 0.1em;
}
#standard-table > thead > tr > th:last-child {
  border-top-right-radius: 0.1em;
}
#standard-table > tbody > tr:last-child > *:first-child {
  border-bottom-left-radius: 0.1em;
}
#standard-table > tbody > tr:last-child > *:last-child {
  border-bottom-right-radius: 0.1em;
}
#standard-table tbody > tr:nth-child(even) {
  background-color: #202020;
}
#standard-table tbody > tr:nth-child(odd) {
  background-color: #222;
}
.standard-N {
  color: #ff0;
  stroke: #ff0;
}
.standard-Z {
  color: #1a69b5;
  stroke: #1a69b5;
}
.standard-Q {
  color: #ae81ff;
  stroke: #ae81ff;
}
.standard-R {
  color: #a52117;
  stroke: #a52117;
}
#standard-old,
#standard-new {
  font-size: 2em;
}
#standard-slide h2 {
  position: absolute;
  top: 1.25rem;
}
#standard-slide mark {
  background-color: transparent;
  color: inherit;
  text-transform: uppercase;
  text-decoration: underline;
}
#standard-zahlen,
#standard-quotient {
  font-size: 1.5em;
}
#three-minus,
#Z12-math {
  color: #1bbb68;
  font-size: 2em;
}
#modular-Z4-name,
#modular-Z12-name {
  margin-left: 1em;
}
#turns {
  line-height: 6.25rem;
  font-size: 3em;
  height: 6.25rem;
  width: 31.25rem;
  text-align: center;
}
#turns > * {
  box-sizing: border-box;
  display: inline-block;
  position: absolute;
  padding: 0.625rem;
  top: 0;
  height: 6.25rem;
  width: 6.25rem;
  vertical-align: middle;
}
#turns > :nth-child(1) {
  left: 0rem;
}
#turns > :nth-child(2) {
  left: 6.25rem;
}
#turns > :nth-child(3) {
  left: 12.5rem;
}
#turns > :nth-child(4) {
  left: 18.75rem;
}
#turns > :nth-child(5) {
  left: 25rem;
}
#modular-clock {
  width: 18.75rem;
}
#piano {
  width: 23.4375rem !important;
}
#intmod4 {
  color: #1bbb68;
  font-size: 1.2em;
}
#number-line {
  width: calc(1100 / 1280 * 100%);
  left: calc();
  top: calc(94 / 800 * 100%);
}
#morphisms-old,
#morphisms-new {
  font-size: 5em;
}
.MathJax * {
  stroke: #fff;
}
.standard-M,
*[data-annotation_class="standard-M"] {
  color: #1bbb68;
}
#morphisms-old.old-N .color-sym,
#morphisms-old.old-Z .color-sym,
#morphisms-old.old-Q .color-sym,
#morphisms-old.old-R .color-sym,
#morphisms-old.new .color-sym {
  color: #333;
}
#morphisms-old.new .color-N {
  color: #404000;
}
#morphisms-old.old-N .color-Z {
  color: #0d345b;
}
#morphisms-old.old-N .color-Q {
  color: #220060;
}
#morphisms-old.old-N .color-R {
  color: #3a0c08;
}
#morphisms-old.new .color-Z {
  color: #0d345b;
}
#morphisms-old.old-Z .color-N {
  color: #404000;
}
#morphisms-old.old-Z .color-Q {
  color: #220060;
}
#morphisms-old.old-Z .color-R {
  color: #3a0c08;
}
#morphisms-old.new .color-Q {
  color: #220060;
}
#morphisms-old.old-Q .color-N {
  color: #404000;
}
#morphisms-old.old-Q .color-Z {
  color: #0d345b;
}
#morphisms-old.old-Q .color-R {
  color: #3a0c08;
}
#morphisms-old.old-R .color-N {
  color: #404000;
}
#morphisms-old.old-R .color-Z {
  color: #0d345b;
}
#morphisms-old.old-R .color-Q {
  color: #220060;
}
#morphisms-old,
#morphisms-new {
  left: 0;
  position: absolute;
  text-align: center;
  width: 100%;
}
#morphisms-old {
  top: 10%;
}
#morphisms-new {
  bottom: 15%;
}
#number-line {
  position: absolute;
  left: 3.125%;
  width: 93.75%;
  top: 40%;
}
#morphisms-morph {
  font-size: 4em;
  position: absolute;
  top: 5%;
  text-align: center;
  width: 100%;
}
.md-A {
  color: #ff0080;
}
.md-B {
  color: #138684;
}
.md-f {
  color: #1bbb68;
  display: none;
}
dfn {
  color: #ff7000;
  font-style: normal;
  font-weight: bold;
}
#m-eqn-Z,
#m-eqn-Z4,
#m-eqn-R {
  font-size: 2em;
  display: none;
}
#morphisms-defn {
  font-size: 2.1em;
  top: 35%;
  left: 10%;
  position: absolute;
  width: 100%;
}
#morphisms-defn > li {
  padding-bottom: 0.5em;
}
#morphisms-defn > li > div {
  display: inline-block;
  padding-left: 0.5ex;
  vertical-align: top;
}
#morphisms-defn > li > div > dfn {
  display: block;
}
#morphisms-defn > li > div > dfn:not(:first-child) {
  font-size: 0.6em;
  width: 0;
}
#prompt-example {
  top: 0;
  left: 0;
  position: absolute;
}
#example-eqn,
#example-eqn-M {
  font-size: 5em;
  position: absolute;
  text-align: center;
  top: 5%;
  width: 100%;
}
#example-eqn .MathJax,
#example-eqn-M .MathJax {
  color: #fff !important;
}
#ex-eqn-Z,
#ex-eqn-R {
  font-size: 3em;
}
#ex-eqn-Z-M,
#ex-eqn-M {
  font-size: 2.7em;
}
#ex-eqn2-R,
#ex-eqn2-M {
  font-size: 2.5em;
}
#ex-eqn-Z {
  position: absolute;
  left: 5%;
  top: 40%;
}
#example-leadsto {
  position: absolute;
  left: 42%;
  top: 41%;
}
#ex-eqn-R {
  position: absolute;
  left: 63%;
  top: 40%;
}
#ex-eqn2-R {
  position: absolute;
  left: 61%;
  top: 58%;
}
#ex-eqn-Z-M {
  position: absolute;
  left: 3%;
  top: 40%;
}
#example-leadsto-M {
  position: absolute;
  left: 37%;
  top: 41%;
}
#ex-eqn-M {
  position: absolute;
  left: 54%;
  top: 40%;
}
#ex-eqn2-M {
  position: absolute;
  left: 55%;
  top: 58%;
}
#example-leadsto,
#example-leadsto-M {
  height: 4em;
}
#z-to-z12 {
  height: 100%;
  position: absolute;
  top: 10%;
}
#operations-slide {
  width: 100%;
  height: 100%;
}
#bill {
  background: #fff;
  color: #000;
  font-size: 1.8em;
  font-family: monospace;
  padding: 0.5em;
  position: absolute;
  width: 40%;
  top: 25%;
  left: 30%;
  text-align: center;
}
.server-name {
  float: left;
}
.table-name {
  float: right;
}
#bill > table {
  clear: both;
  margin: 2em auto 0;
  width: 100%;
  border-collapse: collapse;
}
#bill > table > * > tr > th {
  font-weight: normal;
}
#bill > table > * > tr > td {
  text-align: left;
}
#bill > table > * > tr > td:nth-child(2) {
  padding-left: 1em;
}
#bill > table > * > tr > td:last-child {
  text-align: right;
}
#bill > table > tfoot > tr > * {
  border-top: 1px solid #000;
}
.booth {
  position: absolute;
  width: 20%;
}
.booth:nth-of-type(1) {
  left: 6.666666666666667%;
  top: 5%;
}
.booth:nth-of-type(2) {
  left: 40%;
  top: 5%;
}
.booth:nth-of-type(3) {
  left: 73.33333333333334%;
  top: 5%;
}
.booth:nth-of-type(4) {
  left: 6.666666666666667%;
  top: 38%;
}
.booth:nth-of-type(5) {
  left: 73.33333333333334%;
  top: 38%;
}
.booth:nth-of-type(6) {
  left: 6.666666666666667%;
  top: 71%;
}
.booth:nth-of-type(7) {
  left: 40%;
  top: 71%;
}
.booth:nth-of-type(8) {
  left: 73.33333333333334%;
  top: 71%;
}
*[id^="omelette"] {
  width: 15%;
}
#omelette-1 {
  position: absolute;
  left: 4%;
  top: 27%;
  z-index: 4;
}
#omelette-2 {
  position: absolute;
  left: 6%;
  top: 15%;
  z-index: 3;
}
#omelette-3 {
  position: absolute;
  left: 8%;
  top: 27%;
  z-index: 2;
}
#omelette-4 {
  position: absolute;
  left: 10%;
  top: 15%;
  z-index: 1;
}
#omelette-5 {
  position: absolute;
  left: 33%;
  top: 27%;
  z-index: 5;
}
#omelette-6 {
  position: absolute;
  left: 35%;
  top: 15%;
  z-index: 4;
}
#omelette-7 {
  position: absolute;
  left: 37%;
  top: 27%;
  z-index: 3;
}
#omelette-8 {
  position: absolute;
  left: 39%;
  top: 15%;
  z-index: 2;
}
#omelette-9 {
  position: absolute;
  left: 81%;
  top: 12%;
}
#omelette-10 {
  position: absolute;
  left: 79%;
  top: 18%;
}
#omelette-11 {
  position: absolute;
  left: 77%;
  top: 24%;
}
#omelette-12 {
  position: absolute;
  left: 75%;
  top: 30%;
}
#omelette-13 {
  position: absolute;
  left: 73%;
  top: 12%;
}
#omelette-14 {
  position: absolute;
  left: 71%;
  top: 18%;
}
#omelette-15 {
  position: absolute;
  left: 69%;
  top: 24%;
}
#omelette-16 {
  position: absolute;
  left: 67%;
  top: 30%;
}
#plus-omelette {
  font-size: 3em;
  position: absolute;
  left: 27%;
  top: 20%;
}
#equals-omelette {
  font-size: 3em;
  position: absolute;
  left: 59%;
  top: 20%;
}
*[id^="table"] {
  width: 20%;
}
#table-1 {
  position: absolute;
  left: 4%;
  top: 60%;
}
#table-2 {
  position: absolute;
  left: 35%;
  top: 60%;
}
#table-3 {
  position: absolute;
  left: 70%;
  top: 60%;
}
#plus-table,
#equals-table {
  font-size: 3em;
}
#plus-table {
  position: absolute;
  left: 27%;
  top: 65%;
}
#equals-table {
  position: absolute;
  left: 59%;
  top: 65%;
}
.tl-4,
.tl-42,
.tl-8 {
  background: #fff;
  color: #000;
  font-family: monospace;
  font-size: 1.1em;
  font-weight: bold;
  padding: 0.2em;
}
.emoji {
  font-size: 1em;
  padding: 0.125em 0.04em 0.125em;
}
.tl-4 {
  position: absolute;
  left: 12.4%;
  top: 62%;
}
.tl-42 {
  position: absolute;
  left: 43.4%;
  top: 62%;
}
.tl-8 {
  position: absolute;
  left: 78.4%;
  top: 62%;
}
#ops-no {
  height: 19%;
  width: 86%;
  position: absolute;
  left: 4%;
  top: 60%;
}
#ops-no > path {
  stroke-width: 2.5;
}
#ops-term-set {
  font-size: 1.5em;
  position: absolute;
  left: 50%;
  top: 80%;
}
#ops-term-monoid {
  font-size: 1.5em;
  position: absolute;
  left: 45%;
  top: 43%;
}
#ops-units-eqn {
  font-size: 2.5em;
  text-align: center;
  width: 100%;
  position: absolute;
  left: 0;
  top: 10%;
}
#ops-cm3 {
  position: absolute;
  left: 83%;
  top: 10%;
}
#ops-lbft2 {
  position: absolute;
  left: 83%;
  top: 17.5%;
}
#ops-mps {
  position: absolute;
  left: 90%;
  top: 14%;
}
#ops-units-morph {
  position: absolute;
  left: 0;
  top: 50%;
  font-size: 2.5em;
  text-align: center;
  width: 100%;
}
#ops-graded {
  font-size: 2em;
  font-weight: bold;
  position: absolute;
  left: 55%;
  top: 25%;
}
#ops-graded-no {
  color: #f00;
  font-size: 1.5em;
  position: absolute;
  left: 80%;
  top: 26.5%;
}
#ops-map-cross {
  height: 8%;
  width: 68%;
  position: absolute;
  left: 16%;
  top: 60%;
}
#ops-map-cross > path {
  stroke-width: 6;
}
#ops-which {
  font-size: 2em;
  position: absolute;
  left: 0;
  top: 78%;
  text-align: center;
  width: 100%;
}
#conclusion-slide li:not(:first-child) > em {
  color: #ff7000;
}
#conclusion-slide > ul {
  position: absolute;
  left: 10%;
  top: 15%;
  color: #fff;
  font-size: 2em;
  width: 80%;
}
#conclusion-slide > ul > li {
  padding-bottom: 0.4em;
}
#conclusion-slide > ul > li > ul {
  font-size: 0.75em;
  padding-left: 1em;
}
#conclusion-slide > ul > li > ul > li > span {
  color: #ae81ff;
  margin-left: 1em;
}
#conclusion-slide > ul > li > ul > li > span > span {
  margin-left: 0.4em;
}
