@import url("style_nav.css");
/* Navigation Main Setup*/
@import url("style_header.css");
/* Header Setup */
@import url("style_aside.css");
/* Sidebar Setup */
@import url("style_css-general-text.css");
/* Setup for Text Styles used in Text */
@import url("style_content.css");
/* Setup general Content */
@import url("style_content-ul.css");
/* Content UL Setting*/
@import url("style_images-fig.css");
/* Figure Image and Caption */
@import url("style_blog-projects.css");
/* Setup for layout of Blog- and Projectposts */
@import url("style_blockquotes.css");
/* Setup Blockquote Styles */
@import url("style_pagination.css");
/* Setup Pagination Styles */
@import url("style_footer.css");
/* Footer-Styles Setup */
@import url("style_dialog-box.css");
/* Dialogbox Style */

/* Pre-defined Variables for ease of use */
:root {
  --mainfont: "Vollkorn", serif;
  --headfont: "Roboto", Helvetica, sans-serif;
  --specialfont: "Monoton", system-ui;
  --specialfont-2:
    "UnifrakturMaguntia", var(--specialfont-3), var(--specialfont);
  --specialfont-3: "Freckle Face", var(--specialfont-2), var(--specialfont);
  --codefont: monospace !important;
  --color-1: #efefef;
  --color-2: #00424a;
  --color-2-lt: #d4eff2;
  --footer-color-1: var(--color-2);
}

:focus {
  outline: none;
}

html {
  background-color: #00424a;
  scrollbar-gutter: stable;

}

body:has(#enroll-dialog[open]) {
  overflow: hidden;
  position: fixed;
  width: 100%;
  overflow: hidden;
  overscroll-behavior: none;
}

body {
  color: var(--color-1);
  font-size: 1.75rem !important;
  font-family: var(--mainfont) !important;
  display: grid;
  grid-template-rows: auto 1fr auto;
  min-height: 100vh;
  cursor: crosshair;
}

/* General Setup HEADLINES */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--headfont);
}

/* CONTENT WRAPPER */
#wrapper {
  display: grid;
  grid-auto-flow: column;
}