/*!
 * This file is part of ORY Editor.
 *
 * ORY Editor is free software: you can redistribute it and/or modify
 * it under the terms of the GNU Lesser General Public License as published by
 * the Free Software Foundation, either version 3 of the License, or
 * (at your option) any later version.
 *
 * ORY Editor is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU Lesser General Public License for more details.
 *
 * You should have received a copy of the GNU Lesser General Public License
 * along with ORY Editor.  If not, see <http://www.gnu.org/licenses/>.
 *
 * @license LGPL-3.0
 * @copyright 2016-2018 Aeneas Rekkas
 * @author Aeneas Rekkas <aeneas+oss@aeneas.io>
 *
 */

/* http://typecast.com/blog/a-more-modern-scale-for-web-typography */

:root {
  /* equivalent to 16px */
  /* equivalent to 20px */
}

body {
  font-size: 100%;
}

body, caption, th, td, input, textarea, select, option, legend, fieldset, h1, h2, h3, h4, h5, h6 {
  font-size-adjust: 0.5;
}

.editable-area p, .editable-area h1, .editable-area h2, .editable-area h3, .editable-area h4, .editable-area h5, .editable-area h6, .editable-area blockquote, .editable-area pre {
  margin: 1em 0 0.5em;
}

.editable-area p:first-child, .editable-area h1:first-child, .editable-area h2:first-child, .editable-area h3:first-child, .editable-area h4:first-child, .editable-area h5:first-child, .editable-area h6:first-child, .editable-area blockquote:first-child, .editable-area pre:first-child {
  margin-top: 0
}

.editable-area p:last-child, .editable-area h1:last-child, .editable-area h2:last-child, .editable-area h3:last-child, .editable-area h4:last-child, .editable-area h5:last-child, .editable-area h6:last-child, .editable-area blockquote:last-child, .editable-area pre:last-child {
  margin-bottom: 0
}

.editable-area ul, .editable-area ol {
  margin: 0;
}

.editable-area li {
  margin: 1em 0;
}

.editable-area body {
  font-size: 1em;
  line-height: 1.25em;
}

.editable-area em {
  font-style: italic;
}

.editable-area strong {
  font-weight: 700;
}

.editable-area h1 strong, .editable-area h2 strong, .editable-area h3 strong, .editable-area h4 strong, .editable-area h5 strong, .editable-area h6 strong {
  font-weight: 800;
}

@media only screen and (max-width: 64em) and (min-width: 48em) {

  .editable-area body {
    font-size: 1em;
    line-height: 1.375em;
  }
}

.editable-area h1 {
  margin: 1em 0 0.5em 0;
  font-size: 2em;
  line-height: 1.25em;
}

.editable-area h1:first-child {
  margin-top: 0
}

@media only screen and (max-width: 64em) and (min-width: 48em) {

  .editable-area h1 {
    font-size: 2.5em;/* 2.5x body copy size = 40px */
    line-height: 1.125;
  }
}

@media only screen and (max-width: 64em) and (min-width: 48em) {

  .editable-area h1 {
    font-size: 3em;/* 3x body copy size = 48px */
    line-height: 1.05;/* keep to a multiple of the 20px line height and something more appropriate for display headings */
  }
}

.editable-area h2 {
  margin: 0.8em 0 0.5em 0;
  font-size: 1.625em;/* 1.625x body copy size = 26px */
  line-height: 1.15384615;/* 30px / 26px */
}

@media only screen and (max-width: 64em) and (min-width: 48em) {

  .editable-area h2 {
    font-size: 2em;/* 2x body copy size = 32px */
    line-height: 1.25em;
  }
}

@media only screen and (max-width: 48em) {

  .editable-area h2 {
    font-size: 2.25em;/* 2.25x body copy size = 36px */
    line-height: 1.25em;
  }
}

.editable-area h3 {
  margin: 0.8em 0 0.5em 0;
  font-size: 1.375em;/* 1.375x body copy size = 22px */
  line-height: 1.13636364;/* 25px / 22px */
}

@media only screen and (max-width: 64em) and (min-width: 48em) {

  .editable-area h3 {
    font-size: 1.5em;/* 1.5x body copy size = 24px */
    line-height: 1.25em;
  }
}

@media only screen and (max-width: 48em) {

  .editable-area h3 {
    font-size: 1.75em;/* 1.75x body copy size = 28px */
    line-height: 1.25em;
  }
}

.editable-area h4 {
  margin: 0.8em 0 0.5em 0;
  font-size: 1.125em;/* 1.125x body copy size = 18px */
  line-height: 1.11111111;
}

@media only screen and (max-width: 64em) and (min-width: 48em) {

  .editable-area h4 {
    line-height: 1.25em;
  }
}

@media only screen and (max-width: 48em) {

  .editable-area h4 {
    line-height: 1.25em;
  }
}

.editable-area h5 {
  margin: 0.8em 0 0.5em 0;
  font-size: 1.085em;/* 1.125x body copy size = 18px */
  line-height: 1.055;
}

@media only screen and (max-width: 64em) and (min-width: 48em) {

  .editable-area h5 {
    line-height: 1.25em;
  }
}

@media only screen and (max-width: 48em) {

  .editable-area h5 {
    line-height: 1.25em;
  }
}

.editable-area h6 {
  margin: 0.8em 0 0.5em 0;
  font-size: 1.055em;/* 1.125x body copy size = 18px */
  line-height: 1.005;
}

@media only screen and (max-width: 64em) and (min-width: 48em) {

  .editable-area h6 {
    line-height: 1.25em;
  }
}

@media only screen and (max-width: 48em) {

  .editable-area h6 {
    line-height: 1.25em;
  }
}

.editable-area blockquote {
  font-size: 1em;
  font-style: italic;
  padding: 0 2.5em;
}