@charset "UTF-8";
/* Einfache fließende Medien
Hinweis: Für fließende Medien müssen Sie die Attribute 'height' und 'width' des Medium aus dem HTML-Code entfernen
http://www.alistapart.com/articles/fluid-images/ 
*/
img, object, embed, video {
max-width: 100%;
}
/* IE 6 unterstützt keine maximale Breite, verwenden Sie daher eine Standardbreite von 100% */
.ie6 img {
width:100%;
}

/*
Dreamweaver-Eigenschaften für fließende Raster
----------------------------------
dw-num-cols-mobile:		5;
dw-num-cols-tablet:		8;
dw-num-cols-desktop:	10;
dw-gutter-percentage:	25;

Idee durch den Artikel "Responsive Web Design" von Ethan Marcotte 
http://www.alistapart.com/articles/responsive-web-design

und "Golden Grid System" von Joni Korpi
http://goldengridsystem.com/
*/

/* Layout für Mobilgeräte: 480 px oder weniger. */

.gridContainerWhite {
width: 100%;
max-width: 2500px;
display:none;
}
#content {
width:50%;
clear: none;
float: left;
position:absolute;
top:-95px;
left:0;	
display: none;
}
.audio-player {
position: relative;
width:50%;
height: 100px;
margin: 0 0 0 0;
}
#audio-player {
}


#divOpener {
width:100%;
height: calc(100vh - 0px);		
background-image:url(links/01.mobil.jpg);
background-size:100vw 100vh;
background-attachment:fixed;
clear: both;
float: left;
display: block;
}
#divScopesA {
display:none;
position:absolute;
bottom:55%;
left:0;	
font-size: 28px;
line-height:28px;
letter-spacing: 0em;
font-weight:normal;
text-align: left;
font-family:sans-serif, Helvetica, Arial;
color: black;
}
#divScopesB {
width:auto;
position:absolute;
top:0;
left:0;	
display: none;
font-size: 28px;
line-height:28px;
letter-spacing: 0em;
font-weight:normal;
text-align: right;
font-family:sans-serif, Helvetica, Arial ;
color: black;
}





.gridContainerBlack {
background-color:;
width:100%;
height:100%;
/*height: calc(100vh - 0px);	*/
background-image:url(links/01.mobil.jpg);
background-repeat:no-repeat;

background-size:contain;

background-position:center top;
background-size:100%;
display: block;
/*margin-bottom:-50%;*/
}

/* -------------------------------------- */


#content {
width:50%;
clear: none;
float: left;
position:absolute;
top:-95px;
left:0;
display: none;
}
.audio-player {
position: relative;
width:50%;
height: 100px;
margin: 0 0 0 0;
}
#audio-player {
}
/* -------------------------------------- */

#divClipScopesTel {
clear: none;
float: left;
width: 90%;
margin: 5% 5% 5% 5%;
display: block;
}
#divClipScopesTab {
display: none;
}
#divClipScopesDesk {
display: none;
}


#divScopesATel {
background-color:;
width:auto;
position:relative;
left:0;	
display: block;
font-size: 33px;
line-height:33px;
letter-spacing: 0.07em;
font-weight:normal;
text-align: left;
font-family:sans-serif, Helvetica, Arial ;
color: white;
margin:130% 0 5% 1%;
}



.gridContainerTexte {
background-color:;
width: 100%;
margin:5% 0 0 0 ;
}
#divEinleitung {
clear: both;
float: left;
width: 99%;
display: block;
padding:0 0 11% 1%;
margin:0 0 0 0;
font-size: 22px;
line-height:28px;
letter-spacing: 0.05em;
font-weight:normal;
text-align: left;
font-family:sans-serif, Helvetica, Arial ;
color: white;
}
#divTourdates {
background-color:white;
clear: both;
float: left;
width: 98%;
display: block;
padding:10% 5% 10% 5%;
margin:0 1% 0 1%;
font-size: 22px;
line-height:28px;
letter-spacing: 0.05em;
font-weight:normal;
text-align: center;
font-family:sans-serif, Helvetica, Arial ;
color: black;
}



#divBenA{
display: none;
}
#divBenB {
display: none;
}
#divTonyA {
display: none;
}
#divTomA {
display: none;
}
#divTomB {
display: none;
}
#divMathiasA {
display: none;
}
#divMathiasB {
display: none;
}

#divBenTel{
clear: both;
float: left;
width: 98%;
display: block;
padding:0 1% 22% 1%;
margin:0 0 0 0;
font-size: 22px;
line-height:28px;
letter-spacing: 0.05em;
font-weight:normal;
text-align: left;
font-family:sans-serif, Helvetica, Arial ;
color: white;
}
#divTonyTel {
clear: both;
float: left;
width: 98%;
display: block;
padding:0 1% 22% 1%;
margin:0 0 0 0;
font-size: 22px;
line-height:28px;
letter-spacing: 0.05em;
font-weight:normal;
text-align: left;
font-family:sans-serif, Helvetica, Arial ;
color: white;
}
#divTomTel {
clear: both;
float: left;
width: 98%;
display: block;
padding:0 1% 22% 1%;
margin:0 0 0 0;
font-size: 22px;
line-height:28px;
letter-spacing: 0.05em;
font-weight:normal;
text-align: left;
font-family:sans-serif, Helvetica, Arial ;
color: white;
}
#divMathiasTel {
clear: both;
float: left;
width: 98%;
display: block;
padding:0 1% 33% 1%;
margin:0 0 0 0;
font-size: 22px;
line-height:28px;
letter-spacing: 0.05em;
font-weight:normal;
text-align: left;
font-family:sans-serif, Helvetica, Arial ;
color: white;
}

#divFooter {
clear: both;
float: left;
width: auto;
padding:0 1% 1% 1%;
display: block;
font-size: 33px;
line-height:33px;
letter-spacing: 0.07em;
font-weight:normal;
text-align: left;
font-family:sans-serif, Helvetica, Arial ;
color: white;

}

#divPfeil {
clear: both;
float: left;
width: 100px;
display: none;
margin: 0 0 7% 7%;
}


/* Layout für Tablet-PCs: 481 bis 768 px. Erbt Stile vom: Layout für Mobilgeräte. */

@media only screen and (min-width: 555px) {
		  .gridContainerWhite {
		  width: 100%;
		  max-width: 2500px;
		  display:none;
		  }
		  
          
		  
		  
		  
              /*
          #divOpener {
		  width:100%;
		  height: calc(100vh - 0px);		
		  background-image:url(links/01.mobil.jpg);
		  background-size:100vw 100vh;
		  background-attachment:fixed;
		  clear: both;
		  float: left;
		  display: block;
               }
               */
              
              #divOpener {
              width:100%;
              height: calc(100vh - 0px);
              background-image:url(links/01.mobil.jpg);
              background-size:100vw 100vh;
              background-attachment:fixed;
              clear: both;
              float: left;
              display: block;
              }
              #content {
              width:50%;
              clear: none;
              float: left;
              position:absolute;
              top:-95px;
              left:0;
              display: none;
              }
              .audio-player {
              position: relative;
              width:50%;
              height: 100px;
              margin: 0 0 0 0;
              }
              #audio-player {
              }
          
          
          
          
		  #divScopesA {
		  display:none;
		  position:absolute;
		  bottom:55%;
		  left:0;	
		  font-size: 28px;
		  line-height:28px;
		  letter-spacing: 0em;
		  font-weight:normal;
		  text-align: left;
		  font-family:sans-serif, Helvetica, Arial;
		  color: black;
		  }
		  #divScopesB {
		  width:auto;
		  position:absolute;
		  top:0;
		  left:0;	
		  display: none;
		  font-size: 28px;
		  line-height:28px;
		  letter-spacing: 0em;
		  font-weight:normal;
		  text-align: right;
		  font-family:sans-serif, Helvetica, Arial ;
		  color: black;
		  }
		  
		  
		  
		  
		  /*
		  .gridContainerBlack {
			  background-color:;
			  background-attachment:fixed;

		  width:100%;
          height:100%;
		  /* height: calc(100vh - 0px);	*/
      /*    background-size:contain;
          
		  background-image:;
		  background-repeat:no-repeat;
		  background-position:center top;
		  background-size:100%;
		  display: block;
		  /*margin-bottom:-50%;*/
        
          

            .gridContainerBlack {
            background-color:;
            width:100%;
            height:100%;
            /*height: calc(100vh - 0px);    */
            background-image:url(links/01.mobil.jpg);
            background-repeat:no-repeat;

            background-size:contain;

            background-position:center top;
            background-size:100%;
            display: block;
            /*margin-bottom:-50%;*/
            }
		  
          /* -------------------------------------- */
          #content {
          width:50%;
          clear: none;
          float: left;
          position:absolute;
          top:-95px;
          left:0;
          display: none;
          }
          .audio-player {
          position: relative;
          width:50%;
          height: 100px;
          margin: 0 0 0 0;
          }
          #audio-player {
          }
          /* -------------------------------------- */

		  
		  #divClipScopesTel {
		  display: none;
		  }
		  #divClipScopesTab {
		  clear: none;
		  float: left;
		  width: 90%;
		  margin: 5% 5% 0% 5%;
		  display: block;
		  }
		  #divClipScopesDesk {
		  display: none;
		  }
		  
          #divScopesATel {
          background-color:;
          width:auto;
          position:relative;
          left:0;
          display: block;
          font-size: 33px;
          line-height:33px;
          letter-spacing: 0.07em;
          font-weight:normal;
          text-align: left;
          font-family:sans-serif, Helvetica, Arial ;
          color: white;
          margin:130% 0 5% 1%;
          }

         /*
		  #divScopesATel {
		  background-color:;
		  width:auto;
		  position:relative;
		  left:0;	
		  display: block;
		  font-size: 33px;
		  line-height:33px;
		  letter-spacing: 0.07em;
		  font-weight:normal;
		  text-align: left;
		  font-family:sans-serif, Helvetica, Arial ;
		  color: white;
		  margin:102% 0 0 1%;
		  }
		  */
		  
		  
		  .gridContainerTexte {
		  background-color:;
		  width: 100%;
		  margin:5% 0 0 0;
		  }
		  #divEinleitung {
		  clear: both;
		  float: left;
		  width: 99%;
		  display: block;
		  padding:0 0 11% 1%;
		  margin:0 0 0 0;
		  font-size: 22px;
		  line-height:28px;
		  letter-spacing: 0.05em;
		  font-weight:normal;
		  text-align: left;
		  font-family:sans-serif, Helvetica, Arial ;
		  color: white;
		  }
		  #divTourdates{
		  background-color:white;
		  clear: both;
		  float: left;
		  width: 90%;
		  display: block;
		  padding:5% 5% 7% 5%;
		  margin:0 5% 0 5%;
		  font-size: 33px;
		  line-height:33px;
		  letter-spacing: 0.05em;
		  font-weight:normal;
		  text-align: center;
		  font-family:sans-serif, Helvetica, Arial ;
		  color: black;
		  }
		  
		  #divBenA{
		  display: none;
		  }
		  #divBenB {
		  display: none;
		  }
		  #divTonyA {
		  display: none;
		  }
		  #divTomA {
		  display: none;
		  }
		  #divTomB {
		  display: none;
		  }
		  #divMathiasA {
		  display: none;
		  }
		  #divMathiasB {
		  display: none;
		  }
		  
		  #divBenTel{
		  clear: both;
		  float: left;
		  width: 98%;
		  display: block;
		  padding:0 1% 22% 1%;
		  margin:0 0 0 0;
		  font-size: 22px;
		  line-height:28px;
		  letter-spacing: 0.05em;
		  font-weight:normal;
		  text-align: left;
		  font-family:sans-serif, Helvetica, Arial ;
		  color: white;
		  }
		  #divTonyTel {
		  clear: both;
		  float: left;
		  width: 98%;
		  display: block;
		  padding:0 1% 22% 1%;
		  margin:0 0 0 0;
		  font-size: 22px;
		  line-height:28px;
		  letter-spacing: 0.05em;
		  font-weight:normal;
		  text-align: left;
		  font-family:sans-serif, Helvetica, Arial ;
		  color: white;
		  }
		  #divTomTel {
		  clear: both;
		  float: left;
		  width: 98%;
		  display: block;
		  padding:0 1% 22% 1%;
		  margin:0 0 0 0;
		  font-size: 22px;
		  line-height:28px;
		  letter-spacing: 0.05em;
		  font-weight:normal;
		  text-align: left;
		  font-family:sans-serif, Helvetica, Arial ;
		  color: white;
		  }
		  #divMathiasTel {
		  clear: both;
		  float: left;
		  width: 98%;
		  display: block;
		  padding:0 1% 33% 1%;
		  margin:0 0 0 0;
		  font-size: 22px;
		  line-height:28px;
		  letter-spacing: 0.05em;
		  font-weight:normal;
		  text-align: left;
		  font-family:sans-serif, Helvetica, Arial ;
		  color: white;
		  }
		  
		  #divFooter {
		  clear: both;
		  float: left;
		  width: auto;
		  padding:0 1% 1% 1%;
		  display: block;
		  font-size: 33px;
		  line-height:33px;
		  letter-spacing: 0.07em;
		  font-weight:normal;
		  text-align: left;
		  font-family:sans-serif, Helvetica, Arial ;
		  color: white;
		  
		  }
		  
		  #divPfeil {
		  clear: both;
		  float: left;
		  width: 100px;
		  display: none;
		  margin: 0 0 7% 7%;
		  }
		  
		  }

/* Desktoplayout: 769 bis maximal 1232 px.  Erbt Stile von: den Layouts für Mobilgeräte und Tablet-PCs. */

@media only screen and (min-width: 769px) {
.gridContainerWhite {
width: 100%;
max-width: 2500px;
display:block;
}
#content {
width:100%;
clear: none;
float: left;
position:absolute;
top:0;
left:0%;	
width: 100%;
display: block;
}
.audio-player {
position: relative;
width: 100%;
height: 100px;
margin: 0 0 0 0;

}
#audio-player {
}
#divOpener {
width:100%;
height: calc(100vh - 0px);
/* height: 100%; */
background-image:url(links/01.a.jpg);
/* background-size:100vw 100vh; */
background-repeat:no-repeat;
background-size:cover;
background-attachment:fixed;
clear: both;
float: left;
display: block;
}

#divScopesA {
visibility:visible;
position:absolute;
bottom:0;
left:0;	
display: block;
font-size: 66px;
line-height:66px;
letter-spacing: 0.03em;
font-weight:normal;
text-align: left;
font-family:sans-serif, Helvetica, Arial ;
color: black;
}
#divScopesATel {
display: none;
}
#divScopesAPad {
display: none;
}
#divScopesB {
width:auto;
position:absolute;
top:8.7%;
right:0;	
display: block;
text-align:right;
font-size: 66px;
line-height:77px;
letter-spacing: 0.03em;
font-weight:normal;
text-align: right;
font-family:sans-serif, Helvetica, Arial ;
color: black;
}






.gridContainerBlack {
background-color:black;
width:100%;
height: auto;		
background-image:none;
background-repeat:no-repeat;
background-position:center top;
background-size:40%;
display: block;

}
#divClipScopesTel {
display: none;
}
#divClipScopesTab {
display: none;
}
#divClipScopesDesk {
clear: none;
float: left;
width: 80%;
margin:3% 10% 0% 10%;
display: block;
}





.gridContainerTexte {
background-color:black;
width: 90%;
margin:5% 0 0 5% ;
}
#divEinleitung {
clear: both;
float: left;
width: 100%;
display: block;
padding:0 5% 5% 5%;
margin:0 0 4% 0;
font-size: 44px;
line-height:55px;
letter-spacing: 0.07em;
font-weight:normal;
text-align: left;
font-family:sans-serif, Helvetica, Arial ;
color: white;
}
#divTourdates {
background-color:white;
clear: both;
float: left;
width: 100%;
display: block;
padding:3% 5% 5% 5%;
margin:0 0 4% 0;
font-size: 44px;
line-height:55px;
letter-spacing: 0.07em;
font-weight:normal;
text-align:center;
font-family:sans-serif, Helvetica, Arial ;
color: black;
}

#divBenTel {
display: none;
}
#divTonyTel {
display: none;
}
#divTomTel {
display: none;
}
#divMathiasTel {
display: none;
}
#divBenA {
clear: both;
float: left;
width: 25%;
padding:0 1% 0 5%;
display: block;
font-size: 22px;
line-height:30px;
letter-spacing: 0.09em;
font-weight:normal;
text-align: left;
font-family:sans-serif, Helvetica, Arial ;
color: white;
}
#divBenB {
clear: none;
float: left;
width: 25%;
padding:0 1% 0 1%;
display: block;
font-size: 22px;
line-height:30px;
letter-spacing: 0.09em;
font-weight:normal;
text-align: left;
font-family:sans-serif, Helvetica, Arial ;
color: white;
}
#divTonyA {
clear: none;
float: left;
width: 50%;
padding:0 5% 2.5% 0.5%;
display: block;
font-size: 22px;
line-height:30px;
letter-spacing: 0.09em;
font-weight:normal;
text-align: left;
font-family:sans-serif, Helvetica, Arial ;
color: white;
}
#divTomA {
clear: both;
float: left;
width: 25%;
padding:0 1% 0 5%;
display: block;
font-size: 22px;
line-height:30px;
letter-spacing: 0.09em;
font-weight:normal;
text-align: left;
font-family:sans-serif, Helvetica, Arial ;
color: white
}
#divTomB {
clear: none;
float: left;
width: 25%;
padding:0 1% 0 1%;
display: block;
font-size: 22px;
line-height:30px;
letter-spacing: 0.09em;
font-weight:normal;
text-align: left;
font-family:sans-serif, Helvetica, Arial ;
color: white;
}
#divMathiasA {
clear: none;
float: left;
width: 25%;
padding:0 1% 0 0.5%;
display: block;
font-size: 22px;
line-height:30px;
letter-spacing: 0.09em;
font-weight:normal;
text-align: left;
font-family:sans-serif, Helvetica, Arial ;
color: white;
}
#divMathiasB {
clear: none;
float: left;
width: 25%;
padding:0 5% 0 0;
display: block;
font-size: 22px;
line-height:30px;
letter-spacing: 0.09em;
font-weight:normal;
text-align: left;
font-family:sans-serif, Helvetica, Arial ;
color: white;
}

#divFooter {
clear: both;
float: left;
width: auto;
padding:0 5% 0 0;
display: block;
font-size: 66px;
line-height:66px;
letter-spacing: 0.03em;
font-weight:normal;
text-align: left;
font-family:sans-serif, Helvetica, Arial ;
color: white;

}


#divPfeil {
clear: both;
float: left;
width: 100px;
display: block;
margin: 0 0 7% 7%;
}

}