/* noto-serif-regular - latin */
@font-face {
  font-family: 'Noto Serif';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/noto-serif-v6-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Noto Serif'), local('NotoSerif'),
       url('../fonts/noto-serif-v6-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-serif-v6-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-serif-v6-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-serif-v6-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/noto-serif-v6-latin-regular.svg#NotoSerif') format('svg'); /* Legacy iOS */
}
/* roboto-slab-regular - latin */
@font-face {
  font-family: 'Roboto Slab';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/roboto-slab-v7-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Roboto Slab Regular'), local('RobotoSlab-Regular'),
       url('../fonts/roboto-slab-v7-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/roboto-slab-v7-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/roboto-slab-v7-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/roboto-slab-v7-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/roboto-slab-v7-latin-regular.svg#RobotoSlab') format('svg'); /* Legacy iOS */
}

body, html {
  height: 100%;
  overflow: hidden;
  font-family: 'Roboto Slab', serif;
  color: #b7b7b7;
  font-size: 12px;
}

h1 {}

.headline {
  font-size: 1.4em;
  line-height: 1.2
}

a {
  color: #7fc3ff;
}
.row {
  margin: 0px;
}

#background {
  width: 100%;
  height: 100%;
  background: #0e0e0e    /*    background: -webkit-linear-gradient(top,rgba(207,164,139,0),rgba(207,164,139,1));    background: -o-linear-gradient(top,rgba(207,164,139,0),rgba(207,164,139,1));    background: -moz-linear-gradient(top,rgba(207,164,139,0),rgba(207,164,139,1));    background: linear-gradient(to bottom, rgba(207,164,139,0), rgba(207,164,139,1)); */;
}

#signature {
  margin: auto;
  max-width: 95%;
  display: block;
  /* padding-top: 35%; */
  filter: drop-shadow(2px 2px 6px rgba(200, 200, 200, 0.5));
}

#main-image {
  box-shadow: 2px 2px 20px 2px rgba(0,0,0,0.5);
  filter:brightness(115%) contrast(95%);
  margin-bottom:1.5em;
  max-width: 50%;
  display: block;
  margin: auto;
  -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
  filter: grayscale(100%);
}

#fronttext {
  text-align: center;
  padding: 1em;
  font-size: 1.2em
}

.project_bild {
  display: block;
  margin: auto;
  max-width: 50%
}
#ziher-image {
  width: 100%
}

@media (min-width: 768px) {
  #signature {
    margin: auto;
    max-width: 70%;
    display: block;
    /* padding-top: 10%; */
    filter: drop-shadow(2px 2px 6px rgba(0,0,0,0.5));
  }
}
@media (min-height: 900px) {
  body, html {
    font-size: 13px;
  }
  /*#signature {
    padding-top: 5%;
    max-width: 95%;
  }*/
  #main-image {
    max-width: 95%;
  }
  .headline {
    font-size: 1.5em;
  }
  .project_bild {
    max-width: 70%
  }
}
@media (min-width: 1441px) {
  body, html {
    font-size: 15px;
  }
  /*#signature {
    padding-top: 10%;
    max-width: 95%;
  }*/
  #main-image {
    max-width: 95%;
  }
  .headline {
    font-size: 1.6em;
  }
  .project_bild {
    max-width: 95%
  }
}

.container {
  height:100%;
  /*background: rgba(255, 0, 0, 0.1);*/
  padding: 15px;
  /*width:75%*/
}

.rotation-container {
  -ms-transform-origin: 2000% 100%;
  -webkit-transform-origin: 2000% 100%;
  transform-origin: 2000% 50%;
}

.rotate {
  transform: rotate(-3deg);
  -ms-transform: rotate(-3deg);
  -webkit-transform: rotate(-3deg);
}
.transition {
  -webkit-transition: -webkit-transform 1s;
  -ms-transition: -ms-transform 1s;
  transition: transform 1s;
}

.content-container {
  width: 100%;
  position: absolute;
  padding-left: 10px;
  padding-right: 10px;
  overflow-x: auto;
}

.toggle {
  width: 100%;
  display: none;
}

.content {
  padding-bottom: 40px;
  padding-top: 40px;
}


.termin_date {
  color: #b7b7b7;
  text-align: right;
  background-color: rgba(0,0,0,0)
}

.termin_ort {
  color: #b7b7b7;
  text-align: left;
  background-color: rgba(0, 0, 0, 0)
}

.termin_text {
  font-size: 1em;
  margin-bottom: 10px;
  margin-top: 5px
}

.termin_klein {
  font-size: 0.7em;
}

::-webkit-scrollbar {
    width: 0px;  /* remove scrollbar space */
    background: transparent;  /* optional: just make scrollbar invisible */
}

.pointer {
  cursor: pointer;
}

.page-headline {
  position:sticky;
  font-family: 'Noto Serif', serif;
  /*text-transform: uppercase;*/
  font-weight: bold;
  color: #b7b7b7;
  margin-bottom: -0.2em;
}

/*@media (min-width: 1450px) {
  .page-headline {
    font-size: 20px;
  }
  .saite {
    height: 12px;
  }
}*/
@media (min-width: 2000px) {
  body, html {
    font-size: 16px;
  }
  .saite {
    height: 15px;
  }
}

a {
  font-style: italic;
}

.overflow-bottom {
  height: 40px;
  width: 100%;
  background-color: rgb(215, 58, 153);
  z-index: 100;
  position: absolute;
  background: -webkit-linear-gradient(top,rgba(0, 0, 0, 0),#0e0e0e);
  background: -o-linear-gradient(top,rgba(0, 0, 0, 0),#0e0e0e);
  background: -moz-linear-gradient(top,rgba(0, 0, 0, 0),#0e0e0e);
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0),#0e0e0e));
}

.overflow-top {
  height: 40px;
  width: 100%;
  background-color: rgb(215, 58, 153);
  z-index: 100;
  position: absolute;
  background: -webkit-linear-gradient(bottom,rgba(0, 0, 0, 0),#0e0e0e);
  background: -o-linear-gradient(bottom,rgba(0, 0, 0, 0),#0e0e0e);
  background: -moz-linear-gradient(bottom,rgba(0, 0, 0, 0),#0e0e0e);
  background: linear-gradient(to top,rgba(0, 0, 0, 0),#0e0e0e);
}

.saite {
  cursor: pointer;
  overflow: hidden;
  z-index: 200;
  height: 9px;
  width: 400%;
  margin-left: -100%;
  background: #BBB; /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(#0000,#8a87877a, #8a8787,#8a87877a, #0000); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(#0000,#8a87877a, #8a8787,#8a87877a, #0000); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(#0000,#8a87877a, #8a8787,#8a87877a, #0000); /* For Firefox 3.6 to 15 */
  background: linear-gradient(#0000,#8a87877a, #8a8787,#8a87877a, #0000); /* Standard syntax */
}

.glow{
  -webkit-box-shadow: 0px 0px 2em 0.5em rgba(63, 63, 63, 0.5);
  -moz-box-shadow: 0px 0px 2em 0.5em rgba(227, 227, 227, 0.5);
  box-shadow: 0px 0px 2em 0.5em rgba(0, 0, 0, 0);
  z-index: 200;
}

#home {
  -ms-transform: rotate(-0deg);
  -webkit-transform: rotate(-0deg);
  transform: rotate(-0deg);
}

.modal-content {
  color: #0e0e0e
}
