:root {
  --r-main-font-size: 18pt;
  /*--r-main-font: "Latin Modern Roman";*/
  @media (prefers-color-scheme: light) {
    --dim: rgba(33, 37, 41, 0.75); /* bootstrap secondary */
    --red: hsl(   0, 90%, 50%);
    --pink: #d63384; /* bootstrap code color */
    --blue: hsl( 240, 75%, 40%);
    --orange: hsl( 30, 100%, 40%);
    --green: hsl( 120, 75%, 25%);
    --cyan-bg: hsl( 180, 20%, 95%);
  }
  @media (prefers-color-scheme: dark) {
    --dim: rgba(222, 226, 230, 0.75); /* bootstrap secondary */
    --red: hsl(   0, 90%, 50%);
    --pink: #e685b5; /* bootstrap code color */
    --blue: hsl( 240, 75%, 80%);
    --orange: hsl( 30, 100%, 50%);
    --green: hsl( 120, 75%, 75%);
    --cyan-bg: hsl( 180, 20%, 10%);
  }
}

.reveal {
  text-align: justify;
  hyphens: auto;
}

.reveal > .slides > section > section {
  transform-style: flat;
}

/* Don't capitalize math in headings (or anywhere else) */
mjx-container.MathJax { text-transform: none; }

span.box { display: inline-block; }
.box {
  border: 1px solid;
  border-radius: 1ex;
  border-color: var(--blue);
  padding: 1ex 2ex;
}
.box-red    { border-color: var(--red); }
.box-pink    { border-color: var(--pink); }
.box-blue   { border-color: var(--blue);  }
.box-orange { border-color: var(--orange);  }
.box-green { border-color: var(--green);  }

.text-red   { color: var(--red); }
.text-pink   { color: var(--pink); }
.text-blue  { color: var(--blue); }
.text-orange  { color: var(--orange); }
.text-green  { color: var(--green); }

.box-bg-cyan { background-color: var(--cyan-bg) }
div.box h3 { margin-bottom: 0px; text-align: left;}

/* Same classes as boostrap5 */
.text-start {text-align: left}
.text-end {text-align: right}
.text-center {text-align: center}

.mt-0 {margin-top: 0ex !important}
.mt-1 {margin-top: 1ex !important}
.mt-2 {margin-top: 2ex !important}
.mt-3 {margin-top: 3ex !important}
.my-0 {margin-top: 0ex !important; margin-bottom: 0ex !important}
.my-1 {margin-top: 1ex !important; margin-bottom: 1ex !important}
.my-2 {margin-top: 2ex !important; margin-bottom: 2ex !important}
.my-3 {margin-top: 3ex !important; margin-bottom: 3ex !important}
.mb-0 {margin-bottom: 0ex !important}
.mb-1 {margin-bottom: 1ex !important}
.mb-2 {margin-bottom: 2ex !important}
.mb-3 {margin-bottom: 3ex !important}
.ml-0 {margin-left: 0ex !important}
.ml-1 {margin-left: 1ex !important}
.ml-2 {margin-left: 2ex !important}
.ml-3 {margin-left: 3ex !important}
.mx-0 {margin-left: 0ex !important; margin-right: 0ex !important}
.mx-1 {margin-left: 1ex !important; margin-right: 1ex !important}
.mx-2 {margin-left: 2ex !important; margin-right: 2ex !important}
.mx-3 {margin-left: 3ex !important; margin-right: 3ex !important}
.mr-0 {margin-right: 0ex !important}
.mr-1 {margin-right: 1ex !important}
.mr-2 {margin-right: 2ex !important}
.mr-3 {margin-right: 3ex !important}

.py-1 {padding-top: 1ex !important; padding-bottom: 1ex !important}
.py-2 {padding-top: 2ex !important; padding-bottom: 2ex !important}
.py-3 {padding-top: 3ex !important; padding-bottom: 3ex !important}

.float { float: right; width: 30%; }
.inline-block { display: inline-block; }

.width-31  { width: 31%; }
.width-32  { width: 32%; }
.width-33  { width: 33%; }
.width-34  { width: 34%; }
.width-35  { width: 35%; }

figcaption {
  /* display: block; */
  font-size: 0.6em;
  line-height: 1.2em;
  color: var(--blue);
}
.float img { margin: 0px }
.reveal ul .float {text-align: center}

code {
  color: var(--pink);
  font-size: 0.9em;
}

abbr {
  color: var(--blue);
}

.smaller { font-size: .8em; }

.footnote {
  font-size: 0.6em;
  color: var(--dim);
  text-align: left;
  /*border-top: 1px solid var(--dim);*/
  /*border-clip: 1in;*/
  /*padding: 0.3em 0;*/
  /*margin: 10px 0;*/
}
