body{
    background-image: url(../bilder/background.jpeg);
    background-size: cover;
    background-repeat:repeat;

}

.main{
    position: relative;
    width: 1500px;
    height: 900px;  
    top: 20px;
    margin: auto;
    overflow: hidden; 
    border:5px solid white ;
    background-color: rgba(0, 0, 0, 0.6);
}
.banner{
    position:relative;
    height:120px; 
    width: 1499px; 
    overflow:hidden;
    background-color: rgba(0, 0, 0, 0.7);

}
.bild-banner{    
    position:relative;
    left: 500px; 
    height:120px; 
    width: 500px; 
    overflow:hidden;
    background-image: url(../bilder/banner.png);
        
}


.menue{  
    position:relative;
    height:100px; 
    width: 1500px;
    left:-5px;
    overflow: hidden;
    border:5px solid white ;
    background-color: black;
}
/* -----------------------
menue link bilder
-------------------------*/

.bild-home{
    position:relative;
    height:100px; 
    width: 100px;
    top: 0px;
    left: -10px;
    overflow: hidden;
    background-image: url(../bilder/home.jpeg);
}    
.bild-bandgeschichte{
    position:relative;
    top:-100px;
    left:110px;
    height:100px; 
    width: 210px;
    overflow: hidden;
    background-image: url(../bilder/bandgeschichte.jpeg);
}


.bild-konzerte{
    position:relative;
    height:100px; 
    width: 210px;
    left:340px;
    top: -200px;
    overflow: hidden;
    background-image: url(../bilder/konzerte.jpeg);
}
.bild-merch{
    position:relative;
    height:100px; 
    width: 210px;
    left:550px;
    top: -290px;
    overflow: hidden;
    background-image: url(../bilder/merch.jpeg);
}   
.bild-socialmedia{
    position:relative;
    height:100px; 
    width: 210px;
    left:740px;
    top: -400px;
    overflow: hidden;
    background-image: url(../bilder/socialmedia.jpeg);
}
.bild-wikipedia{
    position:relative;
    height:100px; 
    width: 210px;
    left:960px;
    top: -500px;
    overflow: hidden;
    background-image: url(../bilder/wiki.jpeg);
}
.bild-impressum{
    position:relative;
    height:100px; 
    width: 240px;
    left:1190px;
    top: -590px;
    overflow: hidden;
    background-image: url(../bilder/impressum.jpeg);
}


.haupt{
    position:relative; 
    width: 1500px;
    height: 680px;
    top:  0px;   
    overflow:hidden;
    overflow: scroll;
    background-color: rgba(0, 0, 0, 0.3);
  
}
.haupt2{
    position:relative; 
    width: 1500px;
    height: 680px;
    top:  0px;   
    overflow:hidden;
    background-color:black;
    overflow:scroll;

  
}





/*----------------------------------
--------------------------------------------------------------------------------------------------------------------------------
Home seite
---------------------------------------------------------------------------------------------------------------------------------
---------------------------------*/
.text1{
    position: relative;
    top: 30px;
    left: 40px
    
}

/*-------------------------
Bilder für Seiten
------------------*/



.bild1{
    position: relative;
    width: 720px;
    height: 540px;
    top: 100px;
    left: 50px;
    background-image: url(../bilder/auftritt.jpeg);    
    border:3px solid white;
    overflow:hidden;
}
.bildunterschrift{
    position: relative;
    top: 80px;
    left: 30px;   
}

.text2{
    
    position: relative;
    top: 740px;
    left: 50px    
}



.bild2{
    position: relative;
    width: 320px;
    height: 430px;
    top: 140px;
    left: 50px;
    background-image: url(../bilder/ratte.png);    
    border:3px solid white;
    overflow:hidden;
}


.bildunterschrift2{
    position: relative;
    top: 120px;
    left: 30px;
}


.bild3{
    position: relative;
    width: 320px;
    height: 430px;
    top: -360px;
    left: 450px;
    background-image: url(../bilder/kotze.png);    
    border:3px solid white;
    overflow:hidden;
}

.bildunterschrift3{
    position: relative;
    top: -380px;
    left: 430px;
}

.bild4{
    position: relative;
    width: 320px;
    height: 430px;
    top: -320px;
    left: 50px; 
    background-image: url(../bilder/pisse.png);    
    border:3px solid white;
    overflow:hidden;
}

.bildunterschrift4{
    position: relative;
    top: -340px;
    left: 30px;
}
.bild5{
    position: relative;
    width: 320px;
    height: 430px;
    top: -820px;
    left: 450px; 
    background-image: url(../bilder/Stoephan.jpeg);    
    border:3px solid white;
    overflow:hidden;
}

.bildunterschrift5{
    position: relative;
    top: -840px;
    left:430px;
}

.video{
    position: relative;
    left: 900px;
    top: -2505px;
    width:500px;
    height: 300px;    
    border:1px solid white;
    overflow:hidden;
}
.video2{
    position: relative;
    left: 900px;
    top: -2370px;
    width:500px;
    height: 300px;    
    border:1px solid white;
    overflow:hidden;
}

.video3{
    position: relative;
    left: 900px;
    top: -2225px;
    width:500px;
    height: 300px;    
    border:1px solid white;
    overflow:hidden;
}

.video4{
    position: relative;
    left: 900px;
    top: -2095px;
    width:500px;
    height: 300px;    
    border:1px solid white;
    overflow:hidden;
}


.Stoere{
    position: relative;
    top: -2000px;
    left: 40px
    
}
/*----------------------------
---------------------------------------------------------------------------------------------------
Merch seite
---------------------------------------------------------------------------------------------------
----------------------------*/


.image-container {
    position: relative;
    width: 260px;
    height: 325px;
    border: 5px solid #EA3472;
    border-radius: 10px;
}

/* Positionierung der einzelnen Container */
.image-container:nth-child(1) {
    left: 200px;
    top: 100px;
}

.image-container:nth-child(2) {
    left: 200px;
    top: 170px; 
}


.image-container:nth-child(3) {
    left: 200px;
    top: 240px; 
}

.image-container:nth-child(4) {
    left: 200px;
    top: 310px; 
}

.image-container img {
    width: 100%;
    height: 100%;
    position: absolute;
    transition: opacity 0.5s ease-in-out;
}
.image-container img.hover {
            opacity: 0;
}

.image-container:hover img.default {
    opacity: 0;
}

.image-container:hover img.hover {
    opacity: 1;
}



.text_shirt{
    position: relative;
    top: -850px;
    left: 500px;        
}



.text_sticker{
    position: relative;
    top: -620px;
    left: 500px;        
}


.text_buttons{
    position: relative;
    top: -340px;
    left: 500px;        
}



.text_merch2{
    position: relative;
    top: 70px; 
    left: 300px; 

    
}



/*-----------------------------------------
----------------------------------------------------------------------------------------------------
Social media
----------------------------------------------------------------------------------------------------
-----------------------------------------*/


.text3{
    position: relative;
    top: 10px;
    left: 450px 
    
    
}

.insta{
    position: relative;
    top: 50px;
    left: 200px;
    height: 230px;
    width: 230px;
    overflow: hidden;
    background-image: url(../bilder/insta%20logo.jpg);
    border:5px solid white;
    border-radius: 20px;    
}
.youtube{
    position: relative;
    top: 70px;
    left: 200px;
    height: 230px;
    width: 230px;
    overflow: hidden;
    background-image: url(../bilder/youtube%20logo.jpg);
     border:5px solid white;
    border-radius: 20px;    
}

.tiktok{
    position: relative;
    top: -430px;
    left: 600px;
    height: 230px;
    width: 230px;
    overflow: hidden;
    background-image: url(../bilder/tiktok%20logo.jpg);
    border:5px solid white;
    border-radius: 20px;     
    
    
}

.bandcamp{
    position: relative;
    top: -410px;
    left: 600px;
    height: 230px;
    width: 230px;
    overflow: hidden;
    background-image: url(../bilder/bandcamp%20logo.jpg);
    border:5px solid white;
    border-radius: 20px;     
    
    
}


.spotify{
    position: relative;
    top: -910px;
    left: 1000px;
    height: 230px;
    width: 230px;
    overflow: hidden;    
    background-image: url(../bilder/spotify%20logo.jpg);
    border: 5px solid white;
    border-radius: 20px;        
}


.facebook{
    position: relative;
    top: -890px;
    left: 1000px;
    height: 230px;
    width: 230px;
    overflow: hidden;    
    background-image: url(../bilder/facebook%20logo.jpg);
    border: 5px solid white;
    border-radius: 20px;        
}

.onlyfans{
    position: relative;
    top: -870px;
    left: 600px;
    height: 230px;
    width: 230px;
    overflow: hidden;    
    background-image: url(../bilder/onlyfans.jpg);
    border: 5px solid white;
    border-radius: 20px;    
   

}

/*----------------------------------------------------------------------------------------------------
---------------------------
Geschichte
---------------------------
------------------------------------------------------------------------------------------------------*/



.text4{
    position: relative;
    top: 30px;
    left: 40px;
    
}

.table1{
    position:relative;
    width: 300px;
    height: 200px;
    top:20px;
    left: 40px;
   
   
    
}
.table2{
    position:relative;
    width: 300px;
    height: 200px;
    top:-180px;
    left: 500px;

   
    
}

.text5{
    position: relative;
    top:-150px;
    left: 0px;
    height: 800px;
    width: 1400px;

    
}

/*-------------------------------------------------------------------------------
-------------
Konzerte 
-------------
--------------------------------------------------------------------------------*/

/*Tourdaten*/

.Tourdates{
    position:relative;
    width:750px;
    height:1200px;   
}



.table3{
    position:relative;
    width: 500px;
    height: 630Spx;
    top:100px;
    left: 150px;

   
    
}



/*Auftrittsbilder/ videos*/


.Auftrittsbilder{
    position:relative;
    top:-660px;
    left:750px;
    width:750px;
    height:660px;    
    
}

.video-deadrat{
    position: relative;
    width:600px;
    height: 360px; 
    top: -330px;
    left: 70px; 
    border:3px solid white;
    overflow:hidden; 
    
    
}
.untertext{
    position: relative;
    top:-350px;
    left:50px;
    height: 800px;
    width: 1400px;
    
    
}
.video-deadrat2{
    position: relative;
    width:600px;
    height: 360px; 
    top: -1000px;
    left: 70px;    
    border:3px solid white;
    overflow:hidden; 
    
    
}


.untertext2{
    position: relative;
    top:-1020px;
    left: 50px;
    height: 800px;
    width: 1400px;
}





/*-------------------------------------
text und links
-------------------------------------*/
h1{
    color:#EA3472;
    padding: 0px 0px 0px 10px;
}
h2{
    color:#EA3472;
    padding: 0px 0px 0px 10px;
}
h3{
    color: white;
    padding: 0px 0px 0px 20px;
    font-weight: 900;
}


p{
    color: white;
    font-size: 20px;
    text-align: left;
    padding: 0px 0px 0px 20px;   
}

a:link{
    color: #EA3472;
    text-decoration: none;   
}

a:hover {
  color: #AAA;
}



/*----------------------------------------------------------------
Tabelle
-----------------------------------------------------------------*/

th, td {
    text-align: left;
    background-color: #000;
    border: 1px solid white;
    padding: 8px;
    color: white;
}
th {
    background-color:#ddd ;
    color:#EA3472;
    font-weight: bold;
    text-transform: uppercase;
    background-color: #000;
}