@font-face {
    font-family: 'tagettes'; /* Gewünschter Name */
        src: url('Fonts/tagtts2U.woff2') format('woff2');
}

@font-face {
    font-family: 'tagettesPlus'; /* Gewünschter Name */
        src: url('Fonts/tagttP2U.woff2') format('woff2');
}

@font-face {
  font-family: 'henry'; /* Gewünschter Name */
  src: url('Fonts/HenryItalic.woff2') format('woff2');
  font-style: italic;
}

@font-face {
  font-family: 'garamond'; /* Gewünschter Name */
  src: url('Fonts/GaramondClassicoItalic.woff2') format('woff2');
  font-style: italic;
}

html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    overflow: hidden; /* Verhindert das Scrollen */
  }

  body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

body {
    margin: 0;
    padding: 0;
    width: 100vw;
    height: 100vh;
    background-color: white;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed; /* Hintergrund fixiert */
    -webkit-font-smoothing: antialiased; /* Für Webkit-Browser wie Chrome */
    -moz-osx-font-smoothing: grayscale; /* Für macOS */
    font-smooth: never; /* Generische Option */
  }

  #bookmark {
    position: absolute;
    top: 0;
    left: calc(50% - 100px); /* Startet am linken Rand */
    width: 200px; /* Breite des Streifens */
    height: 100vh; /* Vertikal 100% der Fensterhöhe */
    background: rgba(255, 255, 255, 0.3); /* Halbtransparenter Hintergrund */
    backdrop-filter: blur(10px); /* Unschärfe-Effekt */
    -webkit-backdrop-filter: blur(10px); /* Für Safari */
    
    user-select: none; /* Verhindert Textauswahl */
  -webkit-user-select: none; /* Für Webkit-Browser (z. B. Chrome, Safari) */
  -ms-user-select: none; /* Für ältere IE-Versionen */
  overflow-y: auto; /* Scrollbar nur vertikal */
  padding:  5px 8px 5px 8px
  }

  #bookmark::-webkit-scrollbar {
    display: none; /* Versteckt den Scrollbalken */
  }

  .text {
    font-family: 'henry', 'garamond';
    font-style: italic;
    font-size: 13pt;
    line-height: 1.1;
    text-align: center;
    font-weight: normal;
    font-display: swap; /* For better font loading behavior */
  }

.text p::first-letter {
    font-family: 'tagettes'; /* Setzt für den ersten Buchstaben die Schriftart 'tagettes' */
    font-size: 13pt; /* Größeren Schriftgrad für den ersten Buchstaben */
}

.text p {
    margin-bottom: -5px; /* Verringert den Abstand zwischen den Absätzen */
}

.body {
    background-color: white;
}

a {
  color: #820000;
  font-family: 'tagettes';
  line-height: 0.3;
}