/* open-sans-300 - latin_latin-ext_math_symbols */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/open-sans-v40-latin_latin-ext_math_symbols-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-300italic - latin_latin-ext_math_symbols */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 300;
  src: url('../fonts/open-sans-v40-latin_latin-ext_math_symbols-300italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-regular - latin_latin-ext_math_symbols */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/open-sans-v40-latin_latin-ext_math_symbols-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-italic - latin_latin-ext_math_symbols */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 400;
  src: url('../fonts/open-sans-v40-latin_latin-ext_math_symbols-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-500 - latin_latin-ext_math_symbols */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/open-sans-v40-latin_latin-ext_math_symbols-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-500italic - latin_latin-ext_math_symbols */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 500;
  src: url('../fonts/open-sans-v40-latin_latin-ext_math_symbols-500italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-600 - latin_latin-ext_math_symbols */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/open-sans-v40-latin_latin-ext_math_symbols-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-600italic - latin_latin-ext_math_symbols */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 600;
  src: url('../fonts/open-sans-v40-latin_latin-ext_math_symbols-600italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-700 - latin_latin-ext_math_symbols */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/open-sans-v40-latin_latin-ext_math_symbols-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-700italic - latin_latin-ext_math_symbols */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 700;
  src: url('../fonts/open-sans-v40-latin_latin-ext_math_symbols-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-800 - latin_latin-ext_math_symbols */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 800;
  src: url('../fonts/open-sans-v40-latin_latin-ext_math_symbols-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-800italic - latin_latin-ext_math_symbols */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 800;
  src: url('../fonts/open-sans-v40-latin_latin-ext_math_symbols-800italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

.ag-chords-markdown-top-container {
  font-family: "Open Sans", system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  font-size: 16px;
}

.ag-song-title {
  display: none;
  font-weight: 300;
  margin-top: 0;
  margin-bottom: 0.25em;
  font-size: 1.75em;
  line-height: 1;
  letter-spacing: -1px;
}

@media screen and (max-width: 768px) {
  .ag-song-title {
    font-size: 1.5em;
  }
}

.with-title .ag-song-title{
  display: block;
}

.ag-title-spacer {
  display: block;
  height: 1em;
}

.with-capo-info .ag-title-spacer,
.with-guitar-tuning .ag-title-spacer,
.with-chord-images .ag-title-spacer,
.with-credits .ag-title-spacer {
  display: none;
}

.ag-song-credits {
  display: none;
  font-size: 1em;
  font-style: italic;
  font-weight: 300;
  margin-top: 0;
  margin-bottom: 0.5em;
  flex-direction: column;
}

.with-credits .ag-song-credits {
  display: flex;
}

.ag-guitar-tuning,
.ag-capo-info {
  display: none;
  font-size: 1em;
  font-weight: 400;
  margin-top: 0;
  margin-bottom: 0.5em;
}

.ag-capo-info {
  font-weight: 700;
}

.with-guitar-tuning .ag-guitar-tuning {
  display: block;
}

.with-capo-info .ag-capo-info {
  display: block;
}

.ag-guitar-tuning-text {
  letter-spacing: 0.5em;
  font-weight: 900;
}

.ag-chord-images {
  display: none;
  margin-top: 0;
  margin-bottom: 0.5em;
}

.with-chord-images .ag-chord-images {
  display: flex;
}

.line {
  position: relative;
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
}

.line.empty {
  height: 2em;
}

.chunk {
  display: flex;
  flex-direction: column;
}

.chunk .chords {
  font-size: 1.25em;
  font-weight: bold;
  font-style: italic;
  justify-self: flex-start;
}

.chunk.lyrics-only {
  justify-content: flex-end;
}

.with-section-labels .line {
  padding-left: 4em;
}


.section-label {
  display: none;
  padding: 0.125em 0.5em;
  border: 2px solid black;
  border-radius: 0.5em;
  font-size: 1.5em;
  font-weight: bold;
  position: absolute;
  min-width: 2em;
  text-align: center;
  left: 0;
}

.with-section-labels .section-label {
  display: block;
}

/*
@media screen, print {
    .print-view {
      font-family: "Open Sans", system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
      font-size: 16px;
      line-height: 1.4;
      background-color: #fff;
      color: #333;
    }
    .print-view h1 {
      font-size: 36px;
      font-weight: 300;
      color: #333;
      letter-spacing: -1px;
      margin-bottom: 40px;
    }
    .print-view .refrain {
      margin-left: 50pt;
    }
    .print-view .refrain:before {
      content: "Refr.:";
      font-size: 16pt;
      font-weight: 700;
      font-style: italic;
      display: inline-block;
      float: left;
      margin-left: -50pt;
      vertical-align: bottom;
    }
    .print-view .tip {
      display: inline-block;
      position: relative;
      width: 0;
      height: 1em;
      margin-top: 1.8em;
    }
    .print-view .tip .content {
      color: black;
      position: absolute;
      bottom: 120%;
      font-size: 1.15em;
      font-weight: 700;
      font-style: italic;
      display: inline-block;
      width: 500pt;
    }
  }
  @media screen {
    .print-view {
      font-family: "Open Sans";
      font-size: 1.4rem;
      line-height: 1.45;
      background-color: transparent;
      color: #333;
      padding: 2rem;
    }
    .print-view h1 {
      font-size: 2em;
      font-weight: 300;
      color: #333;
      letter-spacing: -1px;
      margin-bottom: 1.5em;
    }
    .print-view .refrain {
      margin-left: 2em;
      min-height: 1em;
    }
    .print-view .refrain:before {
      display: block;
      content: "Refr.:";
      font-size: 1em;
      font-weight: 700;
      font-style: italic;
      float: none;
      margin-left: -2em;
      vertical-align: bottom;
    }
    .print-view .tip {
      display: inline-block;
      position: relative;
      width: 0;
      height: 1em;
      margin-top: 1.8em;
    }
    .print-view .tip .content {
      color: black;
      position: absolute;
      bottom: 120%;
      font-size: 1.15em;
      font-weight: 700;
      font-style: italic;
      display: inline-block;
      width: 20em;
    }
  }
  @media screen and (max-width: 600px) {
    .print-view {
      font-size: 1.25rem;
    }
  }
  @media screen and (max-width: 480px) {
    .print-view {
      font-size: 1.1rem;
    }
  }
  @media print {
    html, body {
      background: white !important;
      margin: 0 !important;
    }

    .print-view {
      padding: 2.5cm;
      font-size: 20pt;
    }
    .print-view h1 {
      font-size: 38pt;
    }
  }

  .line {
      position: relative;
      display: flex;
      justify-content: flex-start;
      flex-wrap: wrap;
  }

  .line.empty {
      height: 2rem;
  }

  .chunk {
      display: flex;
      flex-direction: column;
  }

  .chunk .chords {
      font-size: 1.5em;
      font-weight: bold;
      font-style: italic;
      justify-self: flex-start;
  }

  .chunk.lyrics-only {
      justify-content: flex-end;
  }

  .with-section-labels .line {
      padding-left: 4rem;
  }


  .section-label {
      display: none;
      padding: 0.125rem 0.5rem;
      border: 2px solid black;
      border-radius: 0.5rem;
      font-size: 1.5rem;
      font-weight: bold;
      position: absolute;
      min-width: 2rem;
      text-align: center;
      left: 0;
  }

  .with-section-labels .section-label {
      display: block;
  }
      */