/* noto-sans-tc-100 - latin */
@font-face {
  font-family: 'Noto Sans TC';
  font-style: normal;
  font-weight: 100;
  src: url('../fonts/noto-sans-tc-v26-latin-100.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/noto-sans-tc-v26-latin-100.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-tc-v26-latin-100.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-tc-v26-latin-100.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-tc-v26-latin-100.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/noto-sans-tc-v26-latin-100.svg#NotoSansTC') format('svg'); /* Legacy iOS */
}
/* noto-sans-tc-300 - latin */
@font-face {
  font-family: 'Noto Sans TC';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/noto-sans-tc-v26-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/noto-sans-tc-v26-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-tc-v26-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-tc-v26-latin-300.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-tc-v26-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/noto-sans-tc-v26-latin-300.svg#NotoSansTC') format('svg'); /* Legacy iOS */
}
/* noto-sans-tc-regular - latin */
@font-face {
  font-family: 'Noto Sans TC';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/noto-sans-tc-v26-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/noto-sans-tc-v26-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-tc-v26-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-tc-v26-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-tc-v26-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/noto-sans-tc-v26-latin-regular.svg#NotoSansTC') format('svg'); /* Legacy iOS */
}
/* noto-sans-tc-500 - latin */
@font-face {
  font-family: 'Noto Sans TC';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/noto-sans-tc-v26-latin-500.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/noto-sans-tc-v26-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-tc-v26-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-tc-v26-latin-500.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-tc-v26-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/noto-sans-tc-v26-latin-500.svg#NotoSansTC') format('svg'); /* Legacy iOS */
}
/* noto-sans-tc-700 - latin */
@font-face {
  font-family: 'Noto Sans TC';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/noto-sans-tc-v26-latin-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/noto-sans-tc-v26-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-tc-v26-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-tc-v26-latin-700.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-tc-v26-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/noto-sans-tc-v26-latin-700.svg#NotoSansTC') format('svg'); /* Legacy iOS */
}
/* noto-sans-tc-900 - latin */
@font-face {
  font-family: 'Noto Sans TC';
  font-style: normal;
  font-weight: 900;
  src: url('../fonts/noto-sans-tc-v26-latin-900.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/noto-sans-tc-v26-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-tc-v26-latin-900.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-tc-v26-latin-900.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-tc-v26-latin-900.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/noto-sans-tc-v26-latin-900.svg#NotoSansTC') format('svg'); /* Legacy iOS */
}
* {
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
     -o-box-sizing: border-box;
     box-sizing: border-box;
     font-family: 'Noto Sans TC', sans-serif;
     line-height: 1.5;
}

*, *:hover{
     -webkit-transition: all 1s ease;
     -moz-transition: all 1s ease;
     -o-transition: all 1s ease;
     transition: all 1s ease;     
}

body{
     background-repeat: repeat, repeat-y;
     background-image: url("../img/Rad.jpg");
     background-blend-mode: lighten;
     background-attachment: fixed;
     background-position: center;
     background-size: cover;
}
.spalten{
     column-count: 2;
}
.eng{ 
     width:  100%;
     text-align: center;
 }
 .container{

 }
 .gif{
     position: fixed;
     top:  40px;
     right: 40px;
     z-index: 1000;
 }
 .gif img{
     width: 150px;
     border:  3px solid green;
     border-radius: 100%;
     background-color: #cdcdcd;
     opacity: .5;
 }

 .gif img:hover{
     width: 350px;
     border:  15px;
     border-style: outset;
     opacity: 1;
 }
 

 .rahmen{
      list-style-type: none;
      margin: 10px 10px;
      padding: 10px ;
      border:  5px solid silver;
      background-color: #f2f2f2;
     text-align: center;
     cursor: pointer;

 }
 #h2rechts{
     text-align: center;
     background-color: transparent;
 }
.container h2{
     width: 100%;
     text-align: left;
     padding-left: 15px;
}

#img-spreewald{
     position: fixed;
     top: 0px;
     left: 0px;
     width: 100%;     
     opacity: .25;
     z-index: -1;
}
#warnFolder{
     position: fixed;
     top: 10px;
     left: 10px;
     z-index: 10000;
     width: 400px;
     height: 500px;
     background-color: white;
     padding: 10px;
     color: red;
     border: 1px red solid;
}
.main{
     position: fixed;
     top:  10px;
     left:  10px;
     padding:  10px;
     border:  2px solid black;
     background-color: #f2f2f2;
     z-index: 1000;

}
.div-control{
     padding:  .2vw;
     float:  left;
     max-width: 10.5vw;
}
.div-control p{
     width:  100%;
     text-align:  center;
     font-size: 12px;
}

.img-control{
     position: absolute;
     top:  350px;
}

.img-control img{
     width: 100%;
}

.img-show div{
     margin: 10px;
     max-width: 16.5vw;
     height: 45vh;
     background-color: transparent;
     border: none;
     opacity: 1;
     overflow: hidden;
}
.auswahl{
     position: absolute;
     top: 15px;
     left: 15px;
     width: 350px;
     padding: 10px;
     border: 2px red solid;
     background-color: #000000;
     color: #cdcdcd;

}
.auswahl a{
     color: #cdcdcd;
     text-decoration: none;
     cursor: pointer;
}

.auswahl a:hover{
     color: #ffffff;

     }

.auswahl li{
    line-height: 2.5em;
}

h2{
     width:  100%;
     text-align:  center;

     }
.container .datum{
     width:  100%;
     text-align:  center;
     background-image: linear-gradient(to right, transparent,transparent, green, green, green, transparent, transparent);
     }

#h2rechts, .h2rechts{
     visibility: visible;
}     

#boxing{
     box-shadow: silver;
     box-shadow: 5px 10px;
}

.linkbox{
      background-color: #404040;  
      border-radius: 10px;
}

.bonus{
     box-shadow: silver;
     box-shadow: 5px 10px;     
      background-color: #e6ffcc;  
      border-radius: 10px;
      text-align: center;
}
.bonus h2{
     width: 100%;
     text-align: center;
}

.bonus.rahmen:hover{
 background-color: #e6ffcc;  
}
#navi{
     position: fixed;
     top:  50px;
     left: 0px;
}
#video a{
     background-image: url("../img/video18.png");
          background-position: bottom;
           background-repeat: no-repeat;
     float: left;
     width: 175px;
     height: 175px;
}
#video a:hover, #video a:visited {
     background-image: url("../img/video48.png");
     }

.border5{
     border: 5px solid white;
     border-radius: 10px;
}
 a{
     padding: 5px;
     text-decoration: none;
     color: darkgreen;
}
 a:hover{
     background-color: #000000;  
     text-decoration: none;
     color: salmon;
}

li.rahmen a{
     padding: 5px;
     text-decoration: none;
     color: darkgreen;
}
li.rahmen a:hover{
     background-color: #000000;  
     text-decoration: none;
     color: salmon;
}

#boxing p{
     font-size: 1em; 
     font-weight: 500; 
     width: 97%; 
     text-align: center;
}
#boxing p:hover {
     color: white;
}

.img-show {
     clear:  both;
}
.img-show img{
     max-width: 15vw;
     opacity: 1;
     cursor: pointer;
}
li img{
     max-width: 25vw;
}
#img-bigger{
     max-width: 85vw;
     max-height: 85vh;
     margin-left:  5px;
     cursor: pointer;
}
#div-day{
     width: 95vw;
}
#txt-weite{
/*     max-width: 75%;*/
     font-size: .8em;
     text-align: center;
}
.tourblue{
     font-weight: 300;
     color: darkblue;
}
.txt-black{
     color: black;
}
.txt-center{
     text-align: center;
}
.txt12{
     font-size: 12px;
}
.ontour{
     position: absolute;
     top: 200px;
     right: 45vw;
     font-size: 3em;
     font-weight: 700;
    writing-mode: vertical-rl;
    -ms-transform: rotate(-112deg);
    -moz-transform: rotate(-112deg);
    -webkit-transform: rotate(-112deg);
    transform: rotate(-112deg);     

}
#div-vorhanden{
     font-size: 12px;
}
#audio{
     position: fixed;
     top:  5vh;
     right: 15vw;
     float: right;
     opacity: .5;
     /*display: none;*/
}

#audio:hover{
     opacity: 1;

}

#div-big-img{
     height: 25vw;
}

#big-img{
     height: 80%
}

.bigback{
     position: fixed;
     top:  1vh;
     left: 2vw;
}

.bigback .green{
     background-color: green;
     padding:  10px;
     border:  1px solid black;
     border-radius: 10px;
     cursor: pointer;
     }

.bigback .green:hover{
     color:  silver;
     border-color: silver;
     font-size: 1.1em;
}   

.bigback input{
     margin-right: 15px;
} 
.minfont{
     font-size: 10px;
} 
.text{
     position: fixed;
     bottom:  1vh;
     left: 5vw;
     border:  1px solid #000000;
     border-radius: 10px;
     padding:  1vw;
     background-color: #cdcdcd;
     opacity: 1;
/*     opacity: .3;*/
}

.text:hover{
     opacity: 1;
/*     opacity: .7;*/
     }

.txt-red{
     color: red;
}     
     
 .clearfix:before,.clearfix:after{
     content: " ";
     display: table;
}

 .clearfix:after{
     clear: both;
}

hr{
     width:  100%;
}

.hr-left h2{
     clear:  both;
}

.links{
     float:  left;
}

.rechts{
     float:  right;
}

@media screen and (max-width: 900px) {
     .h2rechts, #h2rechts{
          visibility: hidden;
     }  
     li img{
     max-width: 85vw;
}  

#video a{
     background-image: url("../img/video18.png");
          background-position: bottom;
           background-repeat: no-repeat;
     float: left;
     width: 150px;
     height: 150px;
     overflow-y: 
}

#video p{
     font-size: .75em;
     }

#navi, input[type="button"]{
     font-size: 12px;
     }

.container, #navi *, .img-big {
     font-size: 12px;
     }
#navi{
     width: 96%;
}
#div-big-img{
     height: 100%;
     font-size: 14px;
}


#big-img{
/*     max-height: 60vh;*/
     width: 100%;
}

#txt-weite{
     max-width: 90%;
     font-size: 14px;
}
.ontour{
     position: absolute;
     top: 200px;
     right: 28vw;
     font-size: 2em;
     font-weight: 700;
}
.gif img:hover{
width: 320px;
border:  15px;
border-style: outset;
opacity: 1;
 }
 #div-vorhanden{
     font-size: 14px;
}
.div-control{
     padding:  .2vw;
     float:  left;
     max-width: 70.5vw;
     float: none;
}