/* theaterBOT - style.css */
    /* chakra-petch-300 - latin */
@font-face {
  font-family: 'Chakra Petch';
  font-style: normal;
  font-display: swap;
  font-weight: 300;
  src: url('../fonts/chakra-petch-v9-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/chakra-petch-v9-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/chakra-petch-v9-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/chakra-petch-v9-latin-300.woff') format('woff'), /* Modern Browsers */
       url('../fonts/chakra-petch-v9-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/chakra-petch-v9-latin-300.svg#ChakraPetch') format('svg'); /* Legacy iOS */
}
/* chakra-petch-regular - latin */
@font-face {
  font-family: 'Chakra Petch';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url('../fonts/chakra-petch-v9-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/chakra-petch-v9-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/chakra-petch-v9-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/chakra-petch-v9-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/chakra-petch-v9-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/chakra-petch-v9-latin-regular.svg#ChakraPetch') format('svg'); /* Legacy iOS */
}
/* chakra-petch-500 - latin */
@font-face {
  font-family: 'Chakra Petch';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url('../fonts/chakra-petch-v9-latin-500.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/chakra-petch-v9-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/chakra-petch-v9-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/chakra-petch-v9-latin-500.woff') format('woff'), /* Modern Browsers */
       url('../fonts/chakra-petch-v9-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/chakra-petch-v9-latin-500.svg#ChakraPetch') format('svg'); /* Legacy iOS */
}
/* chakra-petch-600 - latin */
@font-face {
  font-family: 'Chakra Petch';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url('../fonts/chakra-petch-v9-latin-600.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/chakra-petch-v9-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/chakra-petch-v9-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/chakra-petch-v9-latin-600.woff') format('woff'), /* Modern Browsers */
       url('../fonts/chakra-petch-v9-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/chakra-petch-v9-latin-600.svg#ChakraPetch') format('svg'); /* Legacy iOS */
}
/* chakra-petch-700 - latin */
@font-face {
  font-family: 'Chakra Petch';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url('../fonts/chakra-petch-v9-latin-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/chakra-petch-v9-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/chakra-petch-v9-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/chakra-petch-v9-latin-700.woff') format('woff'), /* Modern Browsers */
       url('../fonts/chakra-petch-v9-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/chakra-petch-v9-latin-700.svg#ChakraPetch') format('svg'); /* Legacy iOS */
}
::-webkit-scrollbar {
    display: none;
}



    html, body {
      background-color: #212121;
        margin: 0;
        font-family: 'Chakra Petch';
        
        height: 100%;
        padding: 0;
        overflow: hidden;
        cursor:crosshair;
        -webkit-tap-highlight-color: transparent;
        -ms-overflow-style: none;
        
    }
    
p{
		color: #
    ;
    font-weight:400;
}	



h1, h2, h3, h4, h5, h6 {
font-weight:600;  
}

h1{
  font-size: 3em;
  margin: 0.5em 0;
}

.overlay a, .overlay p{
  font-weight:600;

}

/*  Highligh-Farbe - BEIDE ggf. austauschen

Aquamarine: #7FFFD4             <-- Hauptfarbe
SpringGreen: #00FF7F
HotPink: #FF69B4
LightSalmon: #FFA07A            <-- Hauptfarbe II
LightSeaGreen: #20B2AA
LightSkyBlue; #87CEFA
MediumPurple: #9370DB
Yellowish tan: #fcfc81
Quiteschgrün: #00fe5e;

*/

.overlay .closebtn, .telefon, .overlay p, #menu li, #menu li:hover {
    color:#7FFFD4;
}
.bgtext, #news{
    background-color:#7FFFD4;
}



    a:link    {color:#fff;}
    a:visited {color:#fff;}
    a:hover   {color:#fff;}
    a:active  {color:#fff;}



    .box-content a:link    {color:#000;}
    .box-content a:visited {color:#000;}
    .box-content a:hover   {color:#000;}
    .box-content a:active  {color:#000;}

    #title{
      font-weight:600;
    }
    
    #news{
        width:90%;
        padding-left:5%;
        padding-right:5%;
        text-align: center;
        font-size:1.2em;
        z-index:100;
        position: fixed;
        top:0;
        animation: overlapcolorsub 2s ease-out;
        font-weight:600;
    }
    
    #news a{
        color:#777;
    }
    
    

#bgvideo video{
       position: fixed; 
  right: 0; 
  bottom: 0;
  min-width: 100%; 
  min-height: 100%;
  object-fit: cover!important;
  -webkit-border-radius: 1px;
    }
    #content{
       position: fixed;
  right: 0;
  bottom: 0;
  min-width: 100%;
  min-height: 100%;
    }

    #main {
      background: no-repeat center center fixed;
        background-image: url(./img/sky.gif);
        background-color:#202020;
        background-size: cover;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        height: 100%;
		    margin: 0;
        padding: 0;
		    opacity: 1;
        position: relative;
  bottom: 0;
    }

#main-coming-soon {
      background: no-repeat center center fixed;
  
        background-color:#fff;
        background-size: cover;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        height: 100%;
        margin: 0;
        padding: 0;
        opacity: 1;
    }

#seite {
      background: no-repeat center center fixed;
      background-image: url();
        background-color:#1;
        background-size: cover;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        height: 100%;
        margin: 0;
        padding: 0;
        opacity: 1;
    }
	

    #title-hover {
        color: white;
        font-size: 8em;
        margin: 0;
        position: absolute;
        top: 50%;
        width: 100%;
        transform: translate(0, -50%);
        text-align: center;
        animation: overlapcolor 2s ease-out;
        z-index: 99;
        opacity: 1;
      
    }
    
    #title-mobile {
        color: white;
        font-size: 8em;
        margin: 0;
        position: absolute;
        top: 50%;
        width: 100%;
        transform: translate(0, -50%);
        text-align: center;
        animation: overlapcolor 2s ease-out;
        z-index: 99;
        opacity: 1;
        display:none;
    }

    #title-hover a, #title-mobile a, #title-hover p, #title-mobile p{
          text-decoration: none;
          font-weight:500;
          /*cursor:crosshair;*/
    }


    

     .title .hover {
      display:none;
    }
    .title:hover .normal {
      display:none;
    }
    .title:hover .hover {
      display:inline;  /* CHANGE IF FOR BLOCK ELEMENTS */
    }
    
@media (max-width: 881px){
     #title-hover{
         top:30%;
         font-size:6em;
     }
     
}

.menu-mob{
      height:32px;
      width:32px;
     }
 
@media only screen and (max-device-width: 736px){
     #title-hover{
         display:none;
     }
    #title-mobile{
         top:45%;     /* bei aktiviertem Subtitle 30% */
       display:block;
     } 
     .menu-mob{
      height:54px;
      width:54px;
     }
     
}





@media (min-width: 1600px){
   #title-hover, #title-mobile {
        font-size: 10em;
    }
}

@media (min-width: 2200px){
   #title-hover, #title-mobile {
        font-size: 16em;
    }
}



.subtitle {
        font-size: 1.2em;
        position:absolute;
        margin-left: auto;
        margin-right: auto;
        left: 0;
        right: 0;
        bottom:27px;
        width:960px;
        max-width: 90vw;
        text-align: center;
        animation: overlapcolorsub 2s ease-out;
        z-index: 99;
        opacity: 1;
        color: black;
        line-height:1.5;
         font-weight:500;
    }
    
@media (min-device-width: 737px){
    .absatz{
        display:none;    
    }

    
}

@media only screen and (max-device-width: 736px){
    .subtitle{
        bottom:45%!important;
        font-size: 2.5em;
        line-height:1.8;
    }
    #news{
        font-size: 2.5em;
        padding-top: 10px;
        padding-bottom: 10px;
    }
}

@media (max-width:1600px){
    .subtitle{
        bottom:100px;
    }
}
    
@media (min-width:2600px){
    .subtitle{
        bottom:100px;
    }
}

@media (min-width:3600px){
    .subtitle{
        bottom:150px;
    }
}

.bgtext{
  margin-bottom:100px;
  animation: overlapcolorsub 2s ease-out;
}

.telefon{
    font-size: 0.8em; 
    margin-top:30px;
    animation: overlapcolortel 2s ease-out;
     font-weight:600;
}


    @keyframes overlapcolor {
        0% {
            color: black;
            opacity: 0;
        }

        25% {
            opacity: 0;
        }

        50% {
            color: black;
            opacity: 1;
        }

        100% {
            color: white;
        }
    }

    @keyframes overlapcolortel {
        0% {
            
            opacity: 0;
        }

        25% {
            opacity: 0;
        }

        50% {
            
            opacity: 0;
        }

        100% {
            opacity: 1;
        }
    }

@keyframes overlapcolorsub {
        0% {
            color: black;
            opacity: 0;
        }

        25% {
            opacity: 0;
        }

        50% {
            color: black;
            opacity: 1;
        }

        100% {
            color: black;
        }
    }
    

    @keyframes hideAtStart {
        0% {
            opacity: 0;
        }

        99.99% {
            opacity: 0;
        }

        100% {
            opacity: 1;
        }
    }

    @keyframes cursoranim {
        0% {
            color: transparent;
        }


        50% {
            color: white;

        }
    }






#menu {
        text-align: right;
        width: 100%;
        margin: 0 0 10px 0;
        padding: 0;
        position: absolute;
        bottom: 0;
    }

.fade-in {
        animation: overlapcolorsub 3s ease-out;
    }

#menu a{
        text-decoration: none;
    }

.aktive-seite a{
  color:#fff!important;
}

#menu li {
        display: inline;
        margin: 0 25px 0 25px;
        transition: all 0.2s;
        text-decoration: none;
    }
    
    .mfont {
        font-size: 2.8em;
         font-weight:500;
   
    }

     
@media only screen and (max-device-width: 736px) {
    .mfont {font-size: 4.5em;}
    }

    #menu li:hover {
        cursor:pointer;
    }
    
  
    #transition-placeholder {
        position: absolute;
        top: 100%;
        width: 100%;
        height: 100%;
        background-color: #212121;
        animation: overlap 2s cubic-bezier(0, 0, 0.08, 1.02);
        display: none;
    }

    

    @keyframes overlap {
        0% {
            top: 0%;
        }

        50% {
            top: 0%;
        }

        100% {
            top: 100%;
        }
		
    }
    
.overlay {
  height: 100%;
  width: 100%;
  display: none;
  position: fixed;
  z-index: 999;
  top: 0;
  left: 0;
  background-color: rgb(0,0,0);
  background-color: rgba(0,0,0, 0.9);
  
}

.overlay-content {
  position: relative;
  top: 10%;
  width: 95%;
  left:2.5%;
  text-align: center;
  margin-top: 30px;
  font-size: 3.5vw;
}

@media (max-width:1200px) {
.overlay-content {
  margin-top: 50px;
  font-size: 4vw
}
}

@media (max-width:881px) {
.overlay-content {
  margin-top: 50px;
  font-size: 4.5vw
}
}

@media (max-width:736px) {
.overlay-content {
  margin-top: 50px;
  font-size: 5vw
}
}

@media (min-width:2200px) {

 .subtitle{
    font-size:2em; 
    width:1600px;
}
.overlay-content {
  top:5%;
  font-size: 4vw
}
}

@media (min-width:2700px) {
#title-hover{
    font-size:20em;
}
}
@media (min-width:3800px) {
#title-hover{
    font-size:24em;
}
 .subtitle{
    font-size:3em; 
    width:2400px;
}
}

@media only screen and (max-device-width: 736px) {
   .overlay-content {
  margin-top: 50px;
  font-size: 4em
}}



.overlay .social {
    position: fixed; 
     bottom:100px;
     text-align: center;
     width: 95%;
     left:2.5%;
     font-size: 50%;
}

.overlay .imprint {
   font-size: 16px;  
   position: fixed;
   width:100%;
   bottom:20px;
   display: block!important;
   opacity: 0.3;
   left: 0px;
}

@media only screen and (max-device-width: 736px) {
    .overlay .imprint {
   font-size: 24px;  
   bottom:40px;
}}

.overlay a {
  padding: 8px;
  text-decoration: none;
  color: #fff;
  display: inline;
  margin:0 20px;
  transition: 0.3s;
  /*cursor:crosshair;*/
}

.overlay-title {
  padding: 8px;
  text-decoration: none;
  font-size: 2em;
  color: #fff;
  display: block;
  transition: 0.3s;
}


.overlay .closebtn {
  position: absolute;
  top: 0;
  right: 10px;
  font-size: 6em;
}

.kaffee {

  position: fixed;
  left:25px;
  top: 35px;
  display: block;
  z-index: 5;
}

.kaffee a, .kaffee-seite a{
  font-size: 1.4em;
 line-height: 0em;
 color:#212121;
 text-decoration: none;
 font-family: 'Chakra Petch';
 font-weight: 700;
 background-color: #7FFFD4;
 /*border:  1px solid #7FFFD4;*/
}
/*.kaffee a:hover{
 line-height: 0em;
 color:#7FFFD4;
 background: none;
}*/

@media only screen and (max-device-width: 736px) {
.kaffee {
 display: none;
}
}

.kaffeemob {
  position: fixed;
  left:40px;
  top: 40px;
  display: none;
}

.kaffeemob a{
  font-size: 2.4em;
 color:#212121;
 text-decoration: none;
 font-family: 'Chakra Petch';
 font-weight: 700;
 background-color: #7FFFD4;
 white-space:nowrap;
/*border:  1px solid #7FFFD4;*/
}

.kaffeemob-seite a{
  font-size: 1.4em;
 margin:0 1em 0 0;
 color:#212121;
 text-decoration: none;
 font-family: 'Chakra Petch';
 font-weight: 700;
 background-color: #7FFFD4;
 border:  2px solid #212121;
 white-space:nowrap;
}
.nomargin a, .nomargin {
  margin:0!important;
}

@media only screen and (max-device-width: 736px) {
.kaffeemob {
 display: block;
}}


@media only screen and (max-device-width: 640px) {
.kaffeemob-seite a{
  font-size: 2em;

}
}

@media only screen and (max-device-width: 480px) {
.kaffeemob-seite a{
  font-size: 2.8em;

}
}




.kaffee-seite {
  position: absolute;
  bottom: 35px;
  left: calc(30% + 30px);
  display: block;
  z-index: 5;
}

.kaffeemob-seite {
  position: fixed;
  left:25px;
  top: 20px;
  text-align: center;
  display: none;

}

@media (max-width:1280px) {
.kaffeemob-seite {
 display: block;
 position: relative;
 height: 80px;
 margin: 0 0 80px 0;
 left:0;
}
@media (max-width:1280px) and (min-width: 881px) {
  kaffeemob-seite {
 width: 100%;
}
  }
.kaffeemob-seite img{
display:block;
    margin:auto;}

.kaffee-seite {
 display: none;
}}


@media (pointer: coarse) {
.kaffeemob-seite img {width: 400px!important;height: 80px!important;}
}

.abstandhalter{
  background-color: none!important;
  color: none!important;
margin: 0 10px;
}
.abstandhaltermob{
  background-color: none!important;
  color: none!important;
margin: 20px;
}




.social-logos {
  position: fixed;
  right:20px;
  top: 18px;
  color:#222!important;
}


.social-link{
  width: 32px;
  height: 32px;
  margin-left: 10px;
}

@media only screen and (max-device-width: 736px) {
.social-link{
  width: 64px;
  height: 64px;
  margin-left: 20px;

}

.social-logos, .social-logos-seite {
  right:25px;
  top: 25px;
}
}

/* Unterseiten */

/* Startseite */
.farbfilter0{
  filter: brightness(0) saturate(100%) invert(87%) sepia(66%) saturate(340%) hue-rotate(78deg) brightness(99%) contrast(103%);
}
.farbfilter0-bg, .farbfilter0-bg a{
  background-color: #7FFFD4;
}

/* Rakete 1 */
.farbfilter1{
  filter: brightness(0) saturate(100%) invert(93%) sepia(56%) saturate(695%) hue-rotate(344deg) brightness(104%) contrast(98%);
}
.farbfilter1-bg, .farbfilter1-bg a{
  background-color: #fcf75e;
}
/* Anfangsverdacht, Spenden */
.farbfilter2{
  filter: brightness(0) saturate(100%) invert(75%) sepia(10%) saturate(1704%) hue-rotate(169deg) brightness(102%) contrast(96%);
}
.farbfilter2-bg, .farbfilter2-bg a{
  background-color: #87CEFA;
}
/* Spenden */
.farbfilter3{
    filter: brightness(0) saturate(100%) invert(74%) sepia(41%) saturate(5448%) hue-rotate(214deg) brightness(104%) contrast(96%);
}
.farbfilter3-bg, .farbfilter3-bg a{
  background-color: #b991fa;
}
/* Easy Listening */
.farbfilter4{
  filter: brightness(0) saturate(100%) invert(69%) sepia(7%) saturate(3014%) hue-rotate(326deg) brightness(103%) contrast(101%);
}
.farbfilter4-bg, .farbfilter4-bg a{
  background-color: #FFA07A;
}



#box{
  position: absolute;
  top:0;
  left:0;
  width:30%;
  height:100%;
   margin:0;
  overflow-y: scroll;
  scrollbar-width: none;

}

@media (max-width: 1280px) {
  #box{
    width: 50%;
  }
  .kaffee-seite {
    left: calc(50% + 90px);
  }
}

@media (max-width: 736px) {
  #box{
    width: 100%;
    top: 30%;
    height: 70%;
  }
  .bg-mobile {
    background-size: cover!important;
    background-position: center!important;
  }
  .menu-mobile{
    bottom: 70%!important;
  }
}

@media only screen and (max-device-width: 640px) {
   #box{
    width: 100%;
    top: 30%;
    height: 70%;
  }
   #seite{
    background: no-repeat center/100%;
    height: 30%;
  }

  .fade-in {
    animation: 0s;
  }

  .menu-mobile{
    bottom: 70%!important;
  }
}


.box1{
  color: #212121;
}

#wrapper{
position: relative;
margin:0 auto;  
width: calc(100% - 60px);
}


.box-content{

      margin: 0 auto;
  width: 100%;
  padding-bottom: 60px;
}

.verstecken {
  display: none!important;
}
#paypalbtn{
  margin-block-end: 0;
}

@media (max-device-width: 736px) {
   .mobverstecken{
   display: none;
   }
   #paypalbtn input[type=image] {
    width:196px;
   }
   .linienlos {
    text-decoration: none;
   }
   /*.bg-mobile{
    background-image: url(./img/bg_10_small.jpg)!important;
   }*/
   
}


@media (max-width: 540px) {
    p {
        font-size:18px !important;
    }
}

figure {
  display: inline-block;
  margin:0;
  vertical-align: top;
}
figure figcaption {
  text-align: center;
   font-family: 'Chakra Petch';
   margin-top: 0.6em
 }

 /* 

.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 0;
    height: 0;
    overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
} */

