@font-face {
	font-family: "NaN Tragedy";
	font-style: normal;
	font-weight: 700;
	src: url("./fonts/NaNTragedyText-Bold.woff2") format("woff2"), url("./fonts/NaNTragedyText-Bold.woff") format("woff");
	font-display: swap
}

@font-face {
	font-family: "NaN Tragedy";
	font-style: italic;
	font-weight: 700;
	src: url("./fonts/NaNTragedyText-BoldItalic.woff2") format("woff2"), url("./fonts/NaNTragedyText-BoldItalic.woff") format("woff");
	font-display: swap
}

@font-face {
	font-family: "NaN Tragedy";
	font-style: normal;
	font-weight: 400;
	src: url("./fonts/NaNTragedyText-Regular.woff2") format("woff2"), url("./fonts/NaNTragedyText-Regular.woff") format("woff");
	font-display: swap
}

@font-face {
	font-family: "NaN Tragedy";
	font-style: italic;
	font-weight: 400;
	src: url("./fonts/NaNTragedyText-Italic.woff2") format("woff2"), url("./fonts/NaNTragedyText-Italic.woff") format("woff");
	font-display: swap
}

body{
  margin: 0px;
  font-family: "NaN Tragedy", 'Helvetica', sans-serif !important;
  font-size: 22px;
  color: black;
  font-weight: 400;
  overflow-y: hidden;
  overflow-x: hidden;
  background-color: white;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

a{
  text-decoration: none;
  color: black;
}

a:hover{
  color: #945B5B;
}

body::-webkit-scrollbar {
  display: none;
}

.clients{
  grid-column: span 2;
}

.background-img{
  max-height: 70vh;
  max-width: 50vw;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

#lectorbooks:hover + #lectorbooks-img{
  display: flex;
}

#lectorbooks-img {
  display: none;
}

#common-matters:hover + #common-matters-img{
  display: flex;
}

#common-matters-img {
  display: none;
}

#tramundbass:hover + #tramundbass-img{
  display: flex;
}

#tramundbass-img {
  display: none;
}

#waw:hover + #waw-img{
  display: flex;
}

#waw-img {
  display: none;
}

#minigolf:hover + #minigolf-img{
  display: flex;
}

#minigolf-img {
  display: none;
}

#baustell:hover + #baustell-img{
  display: flex;
}

#baustell-img {
  display: none;
}

#hgk:hover + #hgk-img{
  display: flex;
}

#hgk-img {
  display: none;
}

#hgk:hover + #hgk-img{
  display: flex;
}

#hgk-img {
  display: none;
}

#zw:hover + #zw-img{
  display: flex;
}

#zw-img {
  display: none;
}

#ubs:hover + #ubs-img{
  display: flex;
}

#ubs-img {
  display: none;
}

#circe:hover + #circe-img{
  display: flex;
}

#circe-img {
  display: none;
}

#es:hover + #es-img{
  display: flex;
}

#es-img {
  display: none;
}

#fogo:hover + #fogo-img{
  display: flex;
}

#fogo-img {
  display: none;
}

#lff:hover + #lff-img{
  display: flex;
}

#lff-img {
  display: none;
}

#deg:hover + #deg-img{
  display: flex;
}

#deg-img {
  display: none;
}

#zuri:hover + #zuri-img{
  display: flex;
}

#zuri-img {
  display: none;
}

#zhdk:hover + #zhdk-img{
  display: flex;
}

#zhdk-img {
  display: none;
}

#fabi:hover + #fabi-img{
  display: flex;
}

#fabi-img {
  display: none;
}

#contact{
  margin-bottom: 8em;
}

.background-container{
  position: fixed;
  z-index: -500;
  top: 0;
  height: 100vh;
  width: 64vw;
  align-items: center;
  justify-content: center;
}

.basegrid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 1em;
  padding-left: 18vw;
  padding-right: 18vw;
}

.sections{
  display: block;
  height: 100vh;
  overflow-y: scroll;
  scroll-behavior: smooth !important;
}

p{
  font-size: 1em;
  margin-bottom: 0.5em;
  line-height: 1.15em;
  margin-top: 0.5em;
} 

p b{
  font-weight: 500 !important;
}

p a{
  color: black;
  text-decoration: none;
}


.lead{
  height: 40vh;
  font-size: 1em;
  text-align: justify;
  text-justify: inter-word;
  font-weight: 400;
  grid-column: 1 / span 3;
  line-height: 1.05em;
  padding-top: 0.5em;
  margin: 0px;
  letter-spacing: -0.02em;
  margin-bottom: 2em;
  display: flex;
  align-items: center;
  justify-content: center;
}

nav{
  font-family: Helvetica, Arial, sans-serif;
  padding-top: 0.8em;
  padding-bottom: 0.8em;
  width: 100%;
  text-align: center;
  background-color: transparent;
  right: 0px;
  z-index: 300;
}

@media only screen and (max-width: 900px) {
  .basegrid{
    grid-template-columns: 1fr;
    padding: 2em;
  }


  nav{
    padding: 0.5em;
  }

  .background-container{
    width: 100%;
    padding-right: 4em;
  }

  #tableinfo{
    display: none;
  }

  .lead{
    padding-right: 0em;
    height: 60vh;
  }

  .nav-mobile{
    display: block;
  }
}

@media (prefers-color-scheme: dark) {
  body{
    background-color: black;
    color: white;
  }

  a{
    color: white;
  }

  #green{
    opacity: 0.8;
  }

  .line{
    background-color: white;
  }

  h2{
    border-bottom: white solid 1px;
  }

  .bild{
    border-right: white solid 1px;
  }


  .logo-black{
    display: none;
  }

  .logo-white{
    display: block;
  }

  .nav-divider{
    height: 0.25em;
    margin-bottom: 0.25em;
    border-bottom: solid 1px white !important;
  }
}