dnd.scss

@import 'https://fonts.googleapis.com/css?family=Libre+Baskerville&display=swap';
// http://api.thumbr.it/whitenoise-600x600.png?background=e1c699&noise=f9e4b7&density=20&opacity=62

$background-color: #f7ebcb;
$header-color: #7a2b17;
$header-border-color: tan;

body {
  background: $background-color;
  font-family: 'Libre Baskerville', serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 16px;
}

h1, h2, h3, h4, h5, h6 {
  color: $header-color;
  text-transform: uppercase;
  line-height: 1.1;
  margin: 24px 0 12px 0;

  &::first-letter {
    font-size: 150%;
  }
}

h1 {
  font-size: 24px;
  border-bottom: 2px solid $header-border-color;
}

h2 {
  border-bottom: 2px solid $header-border-color;
}

p {
  line-height: 1.4;
  margin: 0;
}

p + p {
  text-indent: 24px;
  margin-top: 0!important;
}

.box {
  background-color: white;
  padding: 16px;
  border-left: 2px solid black;
  border-right: 2px solid black;
  overflow: hidden;
  margin: 16px 0;
}