body {
  font-size: 20px;
}

img {
  max-height: 1080px;
  max-width: 1900px;
}

img.quote, blockquote {
  display: block;
  box-shadow: 0.3em 0.3em 1em rgb(0 0 0 / 60%);
  position: relative;
  opacity: 0.9;
}

blockquote {
  font-size : 120%;
  width: 1024px;
  padding: 1px 2ex; /* something's collapsing the margin on child elements if I don't put a non-zero padding. */
  background-color: white;
}

blockquote em {
  font-weight: bold;
  font-size: 110%;
}

.step.in, .step.out, .step.both {
  transition: opacity 1s;
}

.step.in, .step.both, .step.out.past, .step.both.past  {
  opacity: 0;
}

.step, .step.active, .step.in.past  {
  opacity: 1;
}

p.reference {
  text-align: right;
}

#references ul {
  list-style-type: none;
  padding-left: 0;
}

#references ul > li {
  padding-left: 2em;
  text-indent: -2em;
}

#start {
  height: 1080px;
  width: 1900px;
}

#start img#valentine {
  width: 1024px; /* So each "page" is now 1438px high, and the whole thing 7190 high */
  max-height: none;
  display: block;
  margin : 0 438px;
}

#kids-started img {
  top: -240px;
}

#tflaim img {
  top: 80px;
}

#xiao2024 img {
  left: -600px;
}

#haines img, #ding img {
  left: -400px;
  rotate: -25deg;
}

#workman img, #karim img {
  left: 400px;
  rotate: 25deg;
}

#tflhealth blockquote {
  top: -100px;
}

#ding-car blockquote {
  left: -420px;
  top: 420px;
}

#zivarts img {
  top: -250px;
}

#karim-jobs blockquote {
  left: 400px;
  top: 200px;
}

#lakoff-vote blockquote {
  left: -410px;
  top: -420px;
}

#lakoff-view blockquote {
  left: 410px;
  top: -200px;
}

#lakoff-frame blockquote {
  left: -410px;
  top: 300px;
}

#lakoff-frame blockquote img {
  float: right;
  margin-left: 1ex;
  height: 230px;
}

#dearing img {
  left: 430px;
}

#agius img {
  left: -450px;
  top: 700px;
}

#dearing-avoiding blockquote {
  left: 410px;
  top: 200px;
}

#tfl2024no2 img {
  width: 800px;
  left: 410px;
  top: 200px;
}


#policy {
  width: 1900px;
  height: 1080px;
  background-color: white;
  opacity: 0.9;
}

.policy {
  width: 800px;
}

#holism {
  text-align: center;
}

#holism > div {
  position: relative;
  top: -360px;
}

#holism img {
  width: 200px;
}

#watts img {
  width: 400px;
  top: -400px;
  left: -600px;
}

#newell img {
  width: 400px;
  top: -200px;
  left: -400px;
}

#framing {
  text-align: center;
}

#dearing-framing blockquote {
  width: 400px;
  left: 600px;
}

#data {
  text-align: center;
}

#data > div {
  position: relative;
  top: 360px;
}

#references {
  width: 1900px;
  height: 1080px;
  background-color: white;
  opacity: 0.7;
}