@font-face {
    font-family: 'Source Sans Pro';
    src: url('/static/mondallee/fonts/SourceSansPro-Italic.eot');
    src: url('/static/mondallee/fonts/SourceSansPro-Italic.eot?#iefix') format('embedded-opentype'),
        url('/static/mondallee/fonts/SourceSansPro-Italic.woff2') format('woff2'),
        url('/static/mondallee/fonts/SourceSansPro-Italic.woff') format('woff'),
        url('/static/mondallee/fonts/SourceSansPro-Italic.ttf') format('truetype'),
        url('/static/mondallee/fonts/SourceSansPro-Italic.svg#SourceSansPro-Italic') format('svg');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('/static/mondallee/fonts/SourceSansPro-BoldItalic.eot');
    src: url('/static/mondallee/fonts/SourceSansPro-BoldItalic.eot?#iefix') format('embedded-opentype'),
        url('/static/mondallee/fonts/SourceSansPro-BoldItalic.woff2') format('woff2'),
        url('/static/mondallee/fonts/SourceSansPro-BoldItalic.woff') format('woff'),
        url('/static/mondallee/fonts/SourceSansPro-BoldItalic.ttf') format('truetype'),
        url('/static/mondallee/fonts/SourceSansPro-BoldItalic.svg#SourceSansPro-BoldItalic') format('svg');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('/static/mondallee/fonts/SourceSansPro-Bold.eot');
    src: url('/static/mondallee/fonts/SourceSansPro-Bold.eot?#iefix') format('embedded-opentype'),
        url('/static/mondallee/fonts/SourceSansPro-Bold.woff2') format('woff2'),
        url('/static/mondallee/fonts/SourceSansPro-Bold.woff') format('woff'),
        url('/static/mondallee/fonts/SourceSansPro-Bold.ttf') format('truetype'),
        url('/static/mondallee/fonts/SourceSansPro-Bold.svg#SourceSansPro-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('/static/mondallee/fonts/SourceSansPro-ExtraLightItalic.eot');
    src: url('/static/mondallee/fonts/SourceSansPro-ExtraLightItalic.eot?#iefix') format('embedded-opentype'),
        url('/static/mondallee/fonts/SourceSansPro-ExtraLightItalic.woff2') format('woff2'),
        url('/static/mondallee/fonts/SourceSansPro-ExtraLightItalic.woff') format('woff'),
        url('/static/mondallee/fonts/SourceSansPro-ExtraLightItalic.ttf') format('truetype'),
        url('/static/mondallee/fonts/SourceSansPro-ExtraLightItalic.svg#SourceSansPro-ExtraLightItalic') format('svg');
    font-weight: 200;
    font-style: italic;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('/static/mondallee/fonts/SourceSansPro-LightItalic.eot');
    src: url('/static/mondallee/fonts/SourceSansPro-LightItalic.eot?#iefix') format('embedded-opentype'),
        url('/static/mondallee/fonts/SourceSansPro-LightItalic.woff2') format('woff2'),
        url('/static/mondallee/fonts/SourceSansPro-LightItalic.woff') format('woff'),
        url('/static/mondallee/fonts/SourceSansPro-LightItalic.ttf') format('truetype'),
        url('/static/mondallee/fonts/SourceSansPro-LightItalic.svg#SourceSansPro-LightItalic') format('svg');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('/static/mondallee/fonts/SourceSansPro-SemiBoldItalic.eot');
    src: url('/static/mondallee/fonts/SourceSansPro-SemiBoldItalic.eot?#iefix') format('embedded-opentype'),
        url('/static/mondallee/fonts/SourceSansPro-SemiBoldItalic.woff2') format('woff2'),
        url('/static/mondallee/fonts/SourceSansPro-SemiBoldItalic.woff') format('woff'),
        url('/static/mondallee/fonts/SourceSansPro-SemiBoldItalic.ttf') format('truetype'),
        url('/static/mondallee/fonts/SourceSansPro-SemiBoldItalic.svg#SourceSansPro-SemiBoldItalic') format('svg');
    font-weight: 600;
    font-style: italic;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('/static/mondallee/fonts/SourceSansPro-SemiBold.eot');
    src: url('/static/mondallee/fonts/SourceSansPro-SemiBold.eot?#iefix') format('embedded-opentype'),
        url('/static/mondallee/fonts/SourceSansPro-SemiBold.woff2') format('woff2'),
        url('/static/mondallee/fonts/SourceSansPro-SemiBold.woff') format('woff'),
        url('/static/mondallee/fonts/SourceSansPro-SemiBold.ttf') format('truetype'),
        url('/static/mondallee/fonts/SourceSansPro-SemiBold.svg#SourceSansPro-SemiBold') format('svg');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('/static/mondallee/fonts/SourceSansPro-Regular.eot');
    src: url('/static/mondallee/fonts/SourceSansPro-Regular.eot?#iefix') format('embedded-opentype'),
        url('/static/mondallee/fonts/SourceSansPro-Regular.woff2') format('woff2'),
        url('/static/mondallee/fonts/SourceSansPro-Regular.woff') format('woff'),
        url('/static/mondallee/fonts/SourceSansPro-Regular.ttf') format('truetype'),
        url('/static/mondallee/fonts/SourceSansPro-Regular.svg#SourceSansPro-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('/static/mondallee/fonts/SourceSansPro-Light.eot');
    src: url('/static/mondallee/fonts/SourceSansPro-Light.eot?#iefix') format('embedded-opentype'),
        url('/static/mondallee/fonts/SourceSansPro-Light.woff2') format('woff2'),
        url('/static/mondallee/fonts/SourceSansPro-Light.woff') format('woff'),
        url('/static/mondallee/fonts/SourceSansPro-Light.ttf') format('truetype'),
        url('/static/mondallee/fonts/SourceSansPro-Light.svg#SourceSansPro-Light') format('svg');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('/static/mondallee/fonts/SourceSansPro-BlackItalic.eot');
    src: url('/static/mondallee/fonts/SourceSansPro-BlackItalic.eot?#iefix') format('embedded-opentype'),
        url('/static/mondallee/fonts/SourceSansPro-BlackItalic.woff2') format('woff2'),
        url('/static/mondallee/fonts/SourceSansPro-BlackItalic.woff') format('woff'),
        url('/static/mondallee/fonts/SourceSansPro-BlackItalic.ttf') format('truetype'),
        url('/static/mondallee/fonts/SourceSansPro-BlackItalic.svg#SourceSansPro-BlackItalic') format('svg');
    font-weight: 900;
    font-style: italic;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('/static/mondallee/fonts/SourceSansPro-ExtraLight.eot');
    src: url('/static/mondallee/fonts/SourceSansPro-ExtraLight.eot?#iefix') format('embedded-opentype'),
        url('/static/mondallee/fonts/SourceSansPro-ExtraLight.woff2') format('woff2'),
        url('/static/mondallee/fonts/SourceSansPro-ExtraLight.woff') format('woff'),
        url('/static/mondallee/fonts/SourceSansPro-ExtraLight.ttf') format('truetype'),
        url('/static/mondallee/fonts/SourceSansPro-ExtraLight.svg#SourceSansPro-ExtraLight') format('svg');
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('/static/mondallee/fonts/SourceSansPro-Black.eot');
    src: url('/static/mondallee/fonts/SourceSansPro-Black.eot?#iefix') format('embedded-opentype'),
        url('/static/mondallee/fonts/SourceSansPro-Black.woff2') format('woff2'),
        url('/static/mondallee/fonts/SourceSansPro-Black.woff') format('woff'),
        url('/static/mondallee/fonts/SourceSansPro-Black.ttf') format('truetype'),
        url('/static/mondallee/fonts/SourceSansPro-Black.svg#SourceSansPro-Black') format('svg');
    font-weight: 900;
    font-style: normal;
}



body{
  background: #000;
  overflow-y: auto;
  margin: 30px auto 0 auto;
  font-family: 'Source Sans Pro', sans-serif;
}
.clear{
  clear: both;
  height: 5px;
}

#theatre{
  width: 1304px; 
  height: 800px;
  margin: auto;
  position: relative;
  overflow: hidden;
  background: url('/static/mondallee/buehne.png') black top center no-repeat;
}
.theatredark{
  width: 1304px; 
  margin: auto;
  position: relative;
}
.theatredark>div.background{
  background: url('/static/mondallee/dunkleslicht.png') transparent top center no-repeat;
  position: absolute;
  width: 100%;
  height: 800px;
  z-index: 10000;
  opacity: 1;
}
.theatredark>div.background-text {
  position: absolute;
  top: 200px;
  left: 600px;
  color: #FFF;
  z-index: 10000;
}
#rahmen{
  width: 1293px; 
  height: 870px;
  position: absolute;
  background: url('/static/mondallee/Rahmen.png') bottom center no-repeat;
}
#surround{
  width: 100%;
  height: 100%;
}
#Filmstreifen{
  background: transparent url('/static/mondallee/Filmstreifen.png') center top no-repeat;
  height: 235px;
  width: 1100px;
  margin-top: -235px;
  left: 90px;
  position: absolute;
  z-index: 500;
}
#Filmstreifen .thumbwrapper{
  width: 862px;
  position: absolute;
  bottom: 43px;
  left: 120px;
  height: 57px;
  overflow: hidden;
}
#Filmstreifen .thumbs{
  position: absolute;
  overflow: hidden;
  width: auto;
  white-space: nowrap;
}
#Filmstreifen .thumbs .thumbnail {
  display: inline-block;
  white-space: nowrap;
  margin-right: 10px;
  box-shadow: 3px 3px 5px rgba(0,0,0,1);
}
#Filmstreifen .thumbs .thumbnail:hover {
  cursor:pointer;
  box-shadow: 2px 2px 3px rgba(0,0,0,1);
}
#Filmstreifen .thumbs .thumbnail.active{
  border: 2px solid white;
}
#controld{
  width: 1200px;
  height: 820px;
  left: 51px;
  background: transparent url('/static/mondallee/controld.png') center bottom no-repeat;
  position: absolute;
  top: -83px;
  z-index: 500;
}
#control{
  width: 1200px;
  height: 820px;
  left: 51px;
  background: transparent url('/static/mondallee/control.png') center bottom no-repeat;
  position: absolute;
  top: -20px;
  z-index: 500;
  /*-webkit-animation: lightning 3s linear;
  -moz-animation: lightning 3s linear;
  -ms-animation: lightning 3s linear;
  -o-animation: lightning 3s linear;
  animation: lightning 3s linear;*/
}
#impressum {
  position: absolute;
  bottom: 30px;
  left: 162px;
  width: 229px;
  height: 25px;
  color: #522F06;
  font-family: "Source Sans Pro", sans-serif;
  font-size: 15px;
  font-weight: bold;
  cursor: pointer;
}
#Start{
  width: 50px;
  height: 25px;
  position: absolute;
  right: 455px;
  bottom: 100px;
  z-index: 500;
  -webkit-transform: rotate(-43deg);
  -moz-transform: rotate(-43deg);
  -ms-transform: rotate(-43deg);
  -o-transform: rotate(-43deg);
  transform: rotate(-43deg);
}
#Werk{
  width: 38px;
  height: 25px;
  position: absolute;
  right: 419px;
  bottom: 123px;
  z-index: 500;
  -webkit-transform: rotate(-11deg);
  -moz-transform: rotate(-11deg);
  -ms-transform: rotate(-11deg);
  -o-transform: rotate(-11deg);
  transform: rotate(-11deg);
}
#Vita{
  width: 38px;
  height: 25px;
  position: absolute;
  right: 374px;
  bottom: 124px;
  z-index: 500;
  -webkit-transform: rotate(10deg);
  -moz-transform: rotate(10deg);
  -ms-transform: rotate(10deg);
  -o-transform: rotate(10deg);
  transform: rotate(10deg);
}
#Kontakt{
  width: 50px;
  height: 25px;
  position: absolute;
  right: 324px;
  bottom: 106px;
  z-index: 500;
  -webkit-transform: rotate(36deg);
  -moz-transform: rotate(36deg);
  -ms-transform: rotate(36deg);
  -o-transform: rotate(36deg);
  transform: rotate(36deg);
}
#Start, #Werk, #Vita, #Kontakt{
  cursor: pointer;
}
#totengraeber{
  position: absolute;
  top: 353px;
  left: 398px;
  width: 82px;
  height: 217px;
  background: transparent url('/static/mondallee/totengraeber.png') center center no-repeat;
}
#skelett{
  position: absolute;
  top: 375px;
  right: 399px;
  width: 90px;
  height: 242px;
  background: transparent url('/static/mondallee/sekelett.png') center center no-repeat;
}
#vorhang{
  position: absolute;
  top: -626px;
  left: 100px;
  width: 1099px;
  height: 621px;
  background: transparent url('/static/mondallee/vorhang.png') center center no-repeat;
  -webkit-transition: all 3s ease;
  -moz-transition: all 3s ease;
  -ms-transition: all 3s ease;
  -o-transition: all 3s ease;
  transition: all 3s ease;
}
#vorhang.down{
  top: 0px;
  -webkit-transition: all 3s ease;
  -moz-transition: all 3s ease;
  -ms-transition: all 3s ease;
  -o-transition: all 3s ease;
  transition: all 3s ease;
}
#vorhang .textscroll{
  display: none;
  left: 150px;
  padding: 10px;
  width: 800px;
}
#vorhang.down .textscroll{
  display: block;
  overflow: auto;
  height: 450px!important;
  position: absolute;
  z-index: 800!important;
}
#galerie{
  height: 1000px;
  width: 800;
  position: relative;
  margin-left: auto;
  margin-right: auto;
  margin-top: 115px;
}
#galerie .pic{
  display: none;
  position: absolute;
  width: 100%;
  z-index: 1500;
  background: rgba(0, 0, 0, 0.5);
  padding: 20px;
  box-sizing: border-box;
  border-radius: 17px;
}
#galerie .picImp{
  display: none;
  position: absolute;
  width: 35%;
  z-index: 1500;
  background: rgba(0, 0, 0, 0.5);
  padding: 20px;
  box-sizing: border-box;
  border-radius: 17px;
}
#galerie .picDs{
  display: none;
  position: absolute;
  width: 65%;
  z-index: 1500;
  background: rgba(0, 0, 0, 0.5);
  padding: 20px;
  box-sizing: border-box;
  border-radius: 17px;
  margin-left: 300px;
  height: 436px;
  overflow: scroll;
}
#galerie .picDs a,
#galerie .picDs a:link,
#galerie .picDs a:visited,
#galerie .picDs a:hover {color:#F00;}
.pic .small {
  width: 550px;
  float: left;
}
.pic .image-left, .pic .image-right {
  width: 200px;
  float: left;
  margin-top: 15px;
}
#galerie .pic.hasimage{
  text-align: center;
  background: rgba(0, 0, 0, 0);
  padding: 0;
}
p{
  color: white;
}
#right, #left{
  width: 100px;
  height: 90px;
  position: absolute;
  z-index: 5000;
  bottom: 30px;
  cursor: pointer;
}
#right{
  right: 20px;
}
#left{
  left: 20px;
}
#zeiger{
  width: 200px;
  height: 200px;
  position: absolute;
  bottom: -70px;
  left: 691px;
  background: url('/static/mondallee/zeiger.png') transparent center center no-repeat;
  -webkit-transition: -webkit-transform 1s ease;
  -moz-transition: -moz-transform 1s ease;
  -ms-transition: -ms-transform 1s ease;
  -o-transition: -o-transform 1s ease;
  transition: transform 1s ease;
  /*-webkit-animation-delay: 3s;
  -moz-animation-delay: 3s;
  -ms-animation-delay: 3s;
  -o-animation-delay: 3s;
  animation-delay: 3s;*/
  /*-webkit-animation: lightning 3s linear;
  -moz-animation: lightning 3s linear;
  -ms-animation: lightning 3s linear;
  -o-animation: lightning 3s linear;
  animation: lightning 3s linear;*/
}
#zeiger.start{
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
#zeiger.werk{
  -webkit-transform: rotate(-13deg);
  -moz-transform: rotate(-13deg);
  -ms-transform: rotate(-13deg);
  -o-transform: rotate(-13deg);
  transform: rotate(-13deg);
}
#zeiger.vita{
  -webkit-transform: rotate(7deg);
  -moz-transform: rotate(7deg);
  -ms-transform: rotate(7deg);
  -o-transform: rotate(7deg);
  transform: rotate(7deg);
}
#zeiger.kontakt{
  -webkit-transform: rotate(34deg);
  -moz-transform: rotate(34deg);
  -ms-transform: rotate(34deg);
  -o-transform: rotate(34deg);
  transform: rotate(34deg);
}
#zeiger.impressum{
  -webkit-transform: rotate(-85deg);
  -moz-transform: rotate(-85deg);
  -ms-transform: rotate(-85deg);
  -o-transform: rotate(-85deg);
  transform: rotate(-85deg);
}
#uhr{
  height: 315px;
  width: 110px;
  position: absolute;
  top: 0px;
  left: 457px;
  background: url('/static/mondallee/uhr.png') transparent top center no-repeat;
  /*-webkit-animation: lightning 3s linear;
  -moz-animation: lightning 3s linear;
  -ms-animation: lightning 3s linear;
  -o-animation: lightning 3s linear;
  animation: lightning 3s linear;*/
}
#uhr.pending{
  -webkit-animation: pending 12s linear infinite;
  -moz-animation: pending 12s linear infinite;
  -ms-animation: pending 12s linear infinite;
  -o-animation: pending 12s linear infinite;
  animation: pending 12s linear infinite;
  -webkit-animation-delay: 3s;
  -moz-animation-delay: 3s;
  -ms-animation-delay: 3s;
  -o-animation-delay: 3s;
  animation-delay: 3s;
}

/* Pending */
@-webkit-keyframes pending {
  0%{
    -webkit-transform: rotate(0deg);
    margin-left: 0px;
  }
  25%{
    -webkit-transform: rotate(-2deg);
    margin-left: 15px;
  }
  50%{
    -webkit-transform: rotate(0deg);
    margin-left: 0px;
  }
  75%{
    -webkit-transform: rotate(2deg);
    margin-left: -15px;
  }
  100%{
    -webkit-transform: rotate(0deg);
    margin-left: 0px;
  }
}
@-moz-keyframes pending {
  0%{
    -moz-transform: rotate(0deg);
    margin-left: 0px;
  }
  25%{
    -moz-transform: rotate(-2deg);
    margin-left: 15px;
  }
  50%{
    -moz-transform: rotate(0deg);
    margin-left: 0px;
  }
  75%{
    -moz-transform: rotate(2deg);
    margin-left: -15px;
  }
  100%{
    -moz-transform: rotate(0deg);
    margin-left: 0px;
  }
}
@-ms-keyframes pending {
  0%{
    -ms-transform: rotate(0deg);
    margin-left: 0px;
  }
  25%{
    -ms-transform: rotate(-2deg);
    margin-left: 15px;
  }
  50%{
    -ms-transform: rotate(0deg);
    margin-left: 0px;
  }
  75%{
    -ms-transform: rotate(2deg);
    margin-left: -15px;
  }
  100%{
    -ms-transform: rotate(0deg);
    margin-left: 0px;
  }
}
@-o-keyframes pending {
  0%{
    -o-transform: rotate(0deg);
    margin-left: 0px;
  }
  25%{
    -o-transform: rotate(-2deg);
    margin-left: 15px;
  }
  50%{
    -o-transform: rotate(0deg);
    margin-left: 0px;
  }
  75%{
    -o-transform: rotate(2deg);
    margin-left: -15px;
  }
  100%{
    -o-transform: rotate(0deg);
    margin-left: 0px;
  }
}
@keyframes pending {
  0%{
    transform: rotate(0deg);
    margin-left: 0px;
  }
  25%{
    transform: rotate(-2deg);
    margin-left: 15px;
  }
  50%{
    transform: rotate(0deg);
    margin-left: 0px;
  }
  75%{
    transform: rotate(2deg);
    margin-left: -15px;
  }
  100%{
    transform: rotate(0deg);
    margin-left: 0px;
  }
}

/* lightning */
@-webkit-keyframes lightning {
  0%{
    opacity: 0.0;
  }
  10%{
    opacity: 0.20;
  }
  11%{
    opacity: 0.0;
  }
  15%{
    opacity: 0.0;
  }
  20%{
    opacity: 0.40;
  }
  21%{
    opacity: 0.0;
  }
  30%{
    opacity: 0.60;
  }
  31%{
    opacity: 0.0;
  }
  60%{
    opacity: 0.80;
  }
  61%{
    opacity: 0.0;
  }
  70%{
    opacity: 0.90;
  }
  71%{
    opacity: 0.0;
  }
  100%{
    opacity: 0.100;
  }
}
@-moz-keyframes lightning {
  0%{
    -moz-filter: brightness(0%);
  }
  10%{
    -moz-filter: brightness(20%);
  }
  11%{
    -moz-filter: brightness(0%);
  }
  15%{
    -moz-filter: brightness(0%);
  }
  20%{
    -moz-filter: brightness(40%);
  }
  21%{
    -moz-filter: brightness(0%);
  }
  30%{
    -moz-filter: brightness(60%);
  }
  31%{
    -moz-filter: brightness(0%);
  }
  60%{
    -moz-filter: brightness(80%);
  }
  61%{
    -moz-filter: brightness(0%);
  }
  70%{
    -moz-filter: brightness(90%);
  }
  71%{
    -moz-filter: brightness(0%);
  }
  100%{
    -moz-filter: brightness(100%);
  }
}
@-ms-keyframes lightning {
  0%{
    -ms-filter: brightness(0%);
  }
  10%{
    -ms-filter: brightness(20%);
  }
  11%{
    -ms-filter: brightness(0%);
  }
  15%{
    -ms-filter: brightness(0%);
  }
  20%{
    -ms-filter: brightness(40%);
  }
  21%{
    -ms-filter: brightness(0%);
  }
  30%{
    -ms-filter: brightness(60%);
  }
  31%{
    -ms-filter: brightness(0%);
  }
  60%{
    -ms-filter: brightness(80%);
  }
  61%{
    -ms-filter: brightness(0%);
  }
  70%{
    -ms-filter: brightness(90%);
  }
  71%{
    -ms-filter: brightness(0%);
  }
  100%{
    -ms-filter: brightness(100%);
  }
}
@-o-keyframes lightning {
  0%{
    -o-filter: brightness(0%);
  }
  10%{
    -o-filter: brightness(20%);
  }
  11%{
    -o-filter: brightness(0%);
  }
  15%{
    -o-filter: brightness(0%);
  }
  20%{
    -o-filter: brightness(40%);
  }
  21%{
    -o-filter: brightness(0%);
  }
  30%{
    -o-filter: brightness(60%);
  }
  31%{
    -o-filter: brightness(0%);
  }
  60%{
    -o-filter: brightness(80%);
  }
  61%{
    -o-filter: brightness(0%);
  }
  70%{
    -o-filter: brightness(90%);
  }
  71%{
    -o-filter: brightness(0%);
  }
  100%{
    -o-filter: brightness(100%);
  }
}
@keyframes lightning {
  0%{
    filter: brightness(0%);
  }
  10%{
    filter: brightness(20%);
  }
  11%{
    filter: brightness(0%);
  }
  15%{
    filter: brightness(0%);
  }
  20%{
    filter: brightness(40%);
  }
  21%{
    filter: brightness(0%);
  }
  30%{
    filter: brightness(60%);
  }
  31%{
    filter: brightness(0%);
  }
  60%{
    filter: brightness(80%);
  }
  61%{
    filter: brightness(0%);
  }
  70%{
    filter: brightness(90%);
  }
  71%{
    filter: brightness(0%);
  }
  100%{
    filter: brightness(100%);
  }
}

div.picDs {
  overflow: scroll;
  scrollbar-width: none;       /* Firefox */
  -ms-overflow-style: none;    /* Internet Explorer 10+ */
}

div.picDs::-webkit-scrollbar {
  display: none;               /* Chrome, Safari, Opera */
}