*{
  box-sizing: border-box;
}

body { 
  margin: 0 auto !important; 
  float: none !important; 
  background-color: white;
  font-size: 12px;
}
@media screen and not (min-width: 680px) {
  body { 
    font-size: 16px;
  }
}

h1 { font-size: 2em;}
h2 { font-size: 1.8em;}
h3 { font-size: 1.5em;}
h4 { font-size: 1.2em;}
h5 { font-size: 1.0em;}
h6 { font-size: 1.0em;}

.done {display: none;}

.content, .content0, .content1 { 
  display: block;
  float: left;
  max-width: 640px; 
  width: 100%;
  height: 100%;
  margin: 30px 30px auto 40px; 
  padding: 0 8px 0 8px; 
  word-wrap: break-word;
}
.content1 { 
  margin: 108px 30px auto 40px; 
}
@media screen and (max-width: 680px) {
  .content0, .content1 { 
    margin: 0; 
  }
}

@media (min-width: 680px) {
  .hidden {
    display: none !important;
  }
}

pre {
  white-space: pre-wrap;
  line-height: 140%;
}

form {
  width: 100%;
  margin: 10px 0 20px 0;
}

textarea {
  width: 100%;
  height: 80vh;
  border: 1px solid #777777;
  margin-top: 10px;
}
textarea.expand {
  height: 90vh;
}

input {
  width: 100%;
  height: 2.5em;
  border: 1px solid #777777;
}

button {
  background-color: #dddddd;
  background-image: linear-gradient(#eeeeee,#dddddd);
  border: 1px solid #777777;
  font-weight: 600;
  height: 2.5em;
  width: 6em;
}

input[type='checkbox'] { /*display: none;*/ opacity:0; height:0;}
.wrap-foldable { margin: 1.2rem 0; }
.lbl-toggle { display: block; font-weight: bold; font-family: monospace; text-align: left; padding: 1rem; color: #eee; background: #aaa; cursor: pointer; border-radius: 7px; margin-top: 0.2em; transition: all 0.1s ease-out; }
.lbl-toggle:hover { color: #FFF; }
.lbl-toggle::before { content: ' '; display: inline-block; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-left: 5px solid currentColor; vertical-align: middle; margin-right: .7rem; transform: translateY(-2px); transition: transform .1s ease-out; }
.toggle:checked+.lbl-toggle::before { transform: rotate(90deg) translateX(-3px); }
.foldable-content { max-height: 10em; overflow: hidden; transition: max-height .1s ease-in-out; }
.toggle:checked + .lbl-toggle + .foldable-content { max-height: 100%; }
.toggle:checked+.lbl-toggle { border-bottom-right-radius: 0; border-bottom-left-radius: 0; }
.foldable-content .inner-content { background: #fff; border-bottom: 1px solid -255; border-bottom-left-radius: 7px; border-bottom-right-radius: 7px; padding: .5rem 1rem; }

div.edlnk {
  float: right;
  font-size: 90%;
  font-style: italic;
  margin-top: 2.5em;
}

.chapter h2, .chapter h3 {
  margin-top: 2.5em;
}

.content, .content0, .content1 {
  counter-reset: section subsection;
}

.chapter h2::before {
  counter-set: subsection;
  counter-increment: section;
  content: counter(section) " ";
}

.chapter h3::before {
  counter-increment: subsection;
  content: counter(section) "." counter(subsection) " ";
}

.chapter {
  line-height: 1.6em;
}