@font-face {
  font-family: Roboto Slab;
  src: url(/assets/fonts/RobotoSlab-Regular.ttf);
}

@font-face {
  font-family: Lato;
  src: url(/assets/fonts/Lato-Regular.ttf);
}

body {
  color: #FFF;
  margin: 0;
}

.logo {
  max-width: 100%;
  height: auto;
  min-height: 1px;
  -ms-interpolation-mode: bicubic;
}

.portrait {
  display: block;
  margin-left: auto;
  margin-right: auto;
  -ms-interpolation-mode: bicubic;
  width: 200px;
}

a {
  text-decoration: none;
  color: #FFF;
}

.link:hover {
  text-decoration: underline;
}

* {
  font-family: 'Lato', sans-serif;
}

.primary {
  font-family: 'Roboto Slab', serif;
  font-size: 2.25em;
}

.secondary {
  font-family: 'Roboto Slab', serif;
  font-size: 1.5em;
}

.Lee.primary {
  color: #FFF;
}

.Lee.secondary {
  color: #FFF;
}

.Dirk.primary {
  color: #FFF;
}

.Dirk.secondary {
  color: #FFF;
}

.Ser.primary {
  color: #FFF;
}

.elevator {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%;
  text-align: center;
}

.four ul, .six ul, .twelve ul {
  list-style: none;
  margin-block-start: 0;
  margin-block-end: 0;
  padding-inline-start: 0;
}

.contact-container {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.contact td {
  padding: 6px;
}

.hours td, caption {
  padding: 0;
  text-align: justify;
}

.cookieModal {
  display: flex;
  position: fixed;
  left: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0);
  border: 1px solid white;
  z-index: 1000;
  padding: 10px;
  margin: 6px;
  white-space: nowrap;
}

.fa-times-circle {
  float: right;
  cursor: pointer;
  margin: 0 0 8px 8px;
}

.gallery-heading {
  font-family: 'Roboto Slab', serif;
  font-size: 2.1em;
  color: black;
  position: relative;
  font-weight: 700;
}

.gallery-heading:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 2px;
  bottom: 0;
  left: 0;
  background-color: #000;
  visibility: hidden;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transition: all 0.2s ease-in-out 0s;
  transition: all 0.2s ease-in-out 0s;
}

.gallery-heading:hover:before {
  visibility: visible;
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  .contact-container {
    display: block;
  }
  .contact-inner-right {
    display: block;
    border-left: none;
  }
  .contact-item {
    text-align: center;
  }
  .contact-phone {
    padding-top: 0px;
  }
}

.txt-restrict {
  width: 80%;
}

/* scrolling */

.first-third {
  position: absolute;
  height: 100%;
  width: 33.333333%;
}

.second-third {
  position: fixed;
  height: 100%;
  width: 33.333333%;
  left: 33.333333%;
}

.third-third {
  position: absolute;
  height: 100%;
  width: 33.333333%;
  left: 66.666666%;
}

.one, .two, .three, .four, .five, .six, .seven, .eight, .nine {
  /* linear-gradient(#d5d4ea 27%, #003b91 76%, #1A224C); blaue oder so*/
  /* background-image: linear-gradient(#EBCEE5,#4b00fe); */
  /* tolle farbe: #7ef2e0 */
  background: linear-gradient(#ACBACB, #2A2A2A);
  text-align: center;
}

.four, .two, .six, .ten, .eleven, .twelve {
  background: linear-gradient(#2A2A2A, #ACBACB);
}

.four, .six {
  top: 100%;
}

.seven, .nine {
  top: 200%;
}

.ten, .twelve {
  top: 300%;
}