:root{
    --rotation: 10;
    --size: 10vh;
    --winered: rgb(52, 6, 6);
    background-color: black;
}

.body{
    background-color: black;/*grey;*/
    
    
}
.animation{
    display: flex;
    position: absolute;
    background-color: black;
    left:0vh;
    right:0vh;
    bottom:0vh;
    top: 0vh;
    color: white;
}
.animation_no{
    display: none;
}
.v1{
    background-color: black;
    display: flex;
    position: absolute;
    width: 10vh;
    height: 10vh;
    left:50%;
    top: 30%;
 
  

}
.v1_no{
    display: none;
}
.bombe1{
    display: flex;
    position: absolute;
    width: 65vh;
    height: 65vh;
    left:37%;
    top: 4%;
 
  

}
.bombe_no{
    display: none;
 
  

}

.exp_no{
    display: none;
}
.exp{
    display: flex;
    position: absolute;
    top:0vh;
    left:0vw;
    width: 100vw;
    height: 100vh;
    z-index: 10;
    background-color: rgba(151, 0, 0, 0.897);
}

.bg{
    display: block;
    position: absolute;
    background-color: black;
    top:0vh;
    left:0vw;
    width: 100vw;
   
    bottom: 0vh;
    pointer-events: none;
}
.sections{
    display: flex;
    position: absolute;
    top:0vh;
    left:0vw;
    width: 100vw;
    
    height: 300vh;
    min-height: 3000px;;
  
    background-color: black; /* rgb(85, 84, 82);*/
    pointer-events: none;

}


.sections_no{
    display: none;
}

.middle_long{
    display: inline-block;
    position: relative;
    width: 60vw;
   
    left:20vw;
    pointer-events: none;
    
    
    
}
.spaceholder_nav{
  height: 10vh;
}
.nav_box{
  display: flex;
  position: absolute;
  width: 60vw;
  left:20vw;
  top:25vw;

}
.header{
    display: flex;
    position: relative;
    
    z-index: 2;
    top: 0vh;
    left: 0vw;
    width: 100%;
    
}
.left{
    display: block;
    position: absolute;
    background-color: black;
    /*#8c172a;*/
    z-index: 25;
    top: 0vh;
    left: 0vw;
    width: 20vw;
    border-right: double;
    border-color: rgba(119, 119, 119, 0.171);
    bottom: 0vw;
   

}
.left_fixed{
  display: block;
  position: fixed;
  width: 20vw;
  top:20vh;
  left:0vw;
  color: white;
}
.left_news{
  position: relative;
  
  /*width: 16vw;*/
  margin-left: 5%;
  margin-right: 5%;
  margin-bottom: 5vh;
  

}
.the_news{
  position: relative;
  width: 16vw;
  margin-left: 5%;
  margin-right: 5%;
  margin-bottom: 2vh;
}

.right{
    display: block;
    position: absolute;
    background-color: black;
    
    /*#8c172a;*/
    z-index: 25;
    top: 0vh;
    right: 0vw;
    width: 18vw;
    bottom: 0vh;
    border-left: double;
    border-color: rgba(121, 121, 121, 0.185);
    
}

.right_fixed{
  display: block;
  position: fixed;
  width: 20vw;
  top:20vh;
  left:80vw;
  color: white;

}

.bottom{
  display: flex;
  position: fixed;
  background-color: black;
  /*#8c172a;*/
  z-index: 23;

  top: 95vh;
  height: 5vh;
  width: 100vw;
  border-left: double;
  border-color: rgba(121, 121, 121, 0.185);
  justify-content: center;
  align-items: center;
  vertical-align: middle;
  text-align: center;

}

.bottom_fixed{
display: block;
background-color: black;
width: 100%;
height: 100%;
position: relative;
color: white;
z-index: 24;

}
.bottom_fixed:hover{
  display: block;
  background-color: rgb(47, 47, 47);
  width: 100%;
  height: 100%;
  position: relative;
  color: white;
  z-index: 24;
  
  }
.next_up_titel{
  position: relative;
  left: 5vw;
  margin-bottom: 5vh;
  font-size: larger;
  

}
.gigs_up{
  position: relative;
  left: 5vw;
  margin-bottom: 2vh;
}
.header_im{
    position:relative;
    width: 100%;
    
    
}
.middle{
    display: flex;
    position: relative;
    z-index: 5;
    top:5vw;
    width: 60vw;
    
    pointer-events: none;
    height: 120vh;
   
}
.trinity_im{
  background-color: black;
  display: flex;
  position: absolute;
  opacity: 0.3; /*0.05*/
  z-index: 2;
  
  width: 70vw;
  left:15vw;
}

@media screen and (max-width: 600px) {
  .right{
    display: none;
  }
  .left{
    display: none;
  }
  .middle_long{
    width: 100vw;
    left:0vw;
  }
  .middle{
    width: 100vw;
    left:0vw;
  }
  .nav_box{
    top:40vw;
    width: 100vw;
    left:0vw;
  }
  .trinity_im{
    width: 100vw;
    left:0vw;
  }
 
}




.show_dates{
  display: block;
  pointer-events: all;
  margin-left:auto;
  margin-right:auto;
  width: 60%;
}
.bottom_leer{
  display: flex;
  height: 5vh;
  width: 100%;

}

.cast_elem_div_class{
  display: block;
  border-style: solid;
  border-color: var(--winered);/* rgb(99, 0, 0);*/
  margin-top: 10px;
  margin-bottom: 10px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  background-color: rgba(0, 0, 0, 0.581);
}
.show_impresum{
  display: block;
  color: white;
  text-align: center;
  text-shadow: 2px 2px black;
}
.show_stuff{
  display: flex;
  width: 100%;
  pointer-events: none;
}
.footer{
    display: flex;
    position: relative;
    top:auto;
    width: 60vw;
    top: 0vh;
    background-color: black;/*rgb(85, 84, 82);*/
    z-index: 3;
}
.footer_im{
    display: flex;
    position: relative;
    
   
  
    top: 0vh;
    width: 60vw;
    z-index: 8;

}

.nukes_im{
  position:relative;
  margin-top: 0vw;
  width: 80%;
  left:10%;
}


 /* Add a black background color to the top navigation */
 .topnav {
   
   position: relative;
   
   
   
    width: 100%;
    z-index: 15;
    pointer-events: all;
    align-items: center;
    

    
    
    
  }
  
  /* Style the links inside the navigation bar */
  .topnav a {
    
    float: left;
    display: block;
    color: yellow;
    
   
    /*color: #f2f2f2;*/
    text-align: center;
    padding: 5px 4.5%;
    
    text-decoration:none; 
    font-size: 25px;
    
    
  }

 
  .topnav a.active{
    color:red;
  }
 
  /* Add an active class to highlight the current page */
  .active {
   
  }
  
  /* Hide the link that should open and close the topnav on small screens */
  .topnav .icon {
    display: none;
  }
  
  /* Dropdown container - needed to position the dropdown content */
  .dropdown {
    
    float: right;
    overflow: hidden;
  }
  
  /* Style the dropdown button to fit inside the topnav */
  .dropdown .dropbtn {
    font-size: 17px;
    border: none;
    outline: none;
    color: black;
    padding: 14px 16px;
    background-color: inherit;
    font-family: inherit;
    margin: 0;
  }
  
  /* Style the dropdown content (hidden by default) */
  .dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
  }
  
  /* Style the links inside the dropdown */
  .dropdown-content a {
    
    float: none;
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    text-align: left;
    z-index: 15;
  }
  
  /* Add a dark background on topnav links and the dropdown button on hover */
  .topnav a:hover {

    opacity: 1;
    /*color: rgb(78, 78, 0);*/
  }
  .dropdown:hover .dropbtn{
    opacity: 1;
    background-color: rgb(44, 44, 44);
  }
  
  /* Add a grey background to dropdown links on hover */
  .dropdown-content a:hover {
    background-color: #ddd;
    color: black;
  }
  
  /* Show the dropdown menu when the user moves the mouse over the dropdown button */
  .dropdown:hover .dropdown-content {
    display: block;
    
  }
  
  /* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the topnav (.icon) */
  @media screen and (max-width: 600px) {
    .topnav a:not(:first-child), .dropdown .dropbtn {
      display: none;
      
    }
    .topnav a.icon {
       
      float: right;
      display: block;
      
    }
  }
  
  /* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
  @media screen and (max-width: 600px) {
    .topnav.responsive {position: relative;}
    .topnav.responsive a.icon {
      position: absolute;
      
      right: 0;
      top: 0;
    }
    .topnav.responsive a {
     
      float: none;
      display: block;
     /* width: 20%;
      right:0vw;*/
      
     
      text-align: left;
    }

    .topnav.responsive a:not(:first-child) {
      
      background-color: black;
      float: none;
      display: block;
      
      
      
     
      text-align: right;
    }

   


    .topnav.responsive .dropdown {float: none; }
    .topnav.responsive .dropdown-content {position: relative; }
    .topnav.responsive .dropdown .dropbtn {
     
      display: block;
      width: 100%;
      
      text-align: right;
    }
  } 

.newshome{
  color: white;
  text-align: center;
  text-shadow: 2px 2px black;
  
  
}
.newdates{
  color: white;
  text-shadow: 2px 2px black;
  /*margin-left: 5%;
  margin-right: 5%;*/
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

.stuff_menu{
  width: 80%;
  display: flex;
  position: absolute;
  left:10%;
  align-items: center;
  justify-content: space-around;
  font-size: larger;
  
  pointer-events: none;
  text-align: center;
  
}

@media screen and (max-width: 600px) {

  .stuff_menu{
    width: 80%;
    display: flex;
    position: absolute;
    /*left:10%;*/
    align-items: center;
    justify-content: space-around;
    font-size: medium;
    margin-left: auto;
    margin-right: auto;
    
    pointer-events: none;
    text-align: center;
    
  }

}
.but_stuff{
  background-color: transparent;
  display: flex;
  
  color: white;
  border: none;
  
  z-index: 30;
  pointer-events: all;
  font-size: larger;
  
  
}
.but_stuff_selected{
  background-color: transparent;
  display: flex;
  
  color: red;
  border: none;
  
  z-index: 30;
  pointer-events: all;
  font-size: larger;
  
  
}
.but_stuff:hover{
  color: rgba(255, 255, 255, 0.555);
}
.stuff_display{
  margin-top: 12vh;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  position:relative;
  width: 80%;
  /*height: 35vw;*/
  
 
  background-color: black;
  min-height: 5vw;
  color: white;
  text-align: center;
  align-items: center;
  align-content: center;
  
  

  border: var(--winered);/* rgb(182, 3, 3);*/
border-style: solid;
}

@media screen and (max-width: 600px) {
  .stuff_display{
    margin-top: 13vh;
    /*margin-left: auto;
    margin-right: auto;*/
    display: flex;
    position:relative;
    width: 98vw;
    /*height: 35vw;*/
    
  
    background-color: black;
    min-height: 5vw;
    color: white;
    text-align: center;
    align-items: center;
    align-content: center;
    
    

  border: var(--winered);/*rgb(182, 3, 3);*/
  border-style: solid;
  }
}

.display_aus{
  margin-top: 2vh;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  position: relative;
  width: 80%;
 
 
  min-height: 5vw;
  color: white;
  text-align: center;
  align-items: center;
  align-content: center;
  
}

@media screen and (max-width: 600px) {
  .display_aus{
    margin-top: 2vh;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    position: relative;
    width: 100vw;
   
   
    min-height: 5vw;
    color: white;
    text-align: center;
    align-items: center;
    align-content: center;
    
  }
}
.menu_line{  /* PC version 3 Einträge*/
  display: flex;
  /*margin-top: 5vh;*/
}

@media screen and (max-width: 600px) {
  .menu_line{
    display: flex;
    /*margin-top: 5vh;*/
    margin-left: 4vw;
    margin-right: auto;
  }
}
.menu_beschr_block{
  display: block;
}
.menu_beschr{
  display: flex;
  font-size: smaller;
  text-align: center;
}
@media screen and (max-width: 600px) {
  .menu_beschr{
    display: none;
    font-size: 60%;
  }

}
/*
@media screen and (max-width: 600px) {
  .menu_line{
    display: block;
    margin-top: 5vh;
  }
}*/
.menu_block{ /* Gesamt in blocks containing menu_lines*/
  display: block;
  width: 100%;
}


@media screen and (max-width: 600px) {
  .menu_block{ /* Gesamt in blocks containing menu_lines*/
    display: block;
    width: 100%;
  }
}

.menu_block_eintrag{
  display: flex;
  width: 10vw;
  /*height: 10vw;*/
  margin-bottom: 5vh;
  /*margin-left: auto;
  margin-right: auto;*/
  margin-right: 2vw;
  background-color: rgb(0, 0, 0);
  min-height: 10vh;
  pointer-events: all;
  border: var(--winered);/* rgb(74, 0, 0);*/
  border-style: solid;


}
.menu_block_eintrag:hover{
 opacity: 70%;
 border: rgb(255, 0, 0);
  border-style: solid;


}
@media screen and (max-width: 600px) {
  .menu_block_eintrag{
    display: flex;
    width: 20vw;
    /*height: 20vw;*/
    /*margin-top: 5vh;*/
    /*margin-left: auto;
    margin-right: auto;*/

    /*margin-left: 2vw;*/
    margin-right: 2vw;
    
    background-color: rgb(0, 0, 0);
    min-height: 10vh;
  
  
  }

}
/*
@media screen and (max-width: 600px) {
.menu_block_eintrag{
  display: flex;
  width: 80vw;
  height: 80vw;
  margin-top: 5vh;
  margin-left: auto;
  margin-right: auto;
  background-color: green;
  min-height: 10vh;


}
}*/


.stuff_block{
  display: block;
  width: 100%;
  pointer-events: none;
}

.show_artwork{
  display: block;
  width: 100%;
  pointer-events: none;
}

.elgato_pic1{
  width: 20vw;
}
.artwork_Elgato{
  display: flex;
  color: white;
  display: flex;
  align-items: center;
  align-self: center;
  text-align: center;
  margin-right: auto;
  margin-left: auto;

}

.artwork_vertical_list{
  display: flex;
  width: 100%;
  justify-content: center;
  align-items: center;
  vertical-align: middle;
  margin-bottom: 10%;
}

.artwork_horizontal_list{
  display: block;
  width: 100%;
  justify-content: center;
  align-items: center;
  /*vertical-align: middle;*/

}
@media screen and (max-width: 600px) {
  .artwork_vertical_list{
    display: block;
    width: 100%;
    justify-content: center;
    align-items: center;
    /*vertical-align: middle;*/
    margin-bottom: 10%;
  }
  .elgato_pic1{
    width: 20vw;
    justify-content: center;
    align-items: center;
  }

}
.artwork_element_list{
  display: block;
  margin-left: 5%;
  margin-right: 5%;
  width: 90%;
}

.video_image{
  width: 80vw;
  height: 35vw;
  pointer-events: all;
}

@media screen and (max-width: 600px) {
  .video_image{
    width: 98vw;
    height: 60vw;
    pointer-events: all;
  }

}

.photo_image{
  width: 100%;
  /*height: 35vw;*/
  pointer-events: all;
}

@media screen and (max-width: 600px) {
  .photo_image{
    width: 98vw;
    /*height: 60vw;*/
    pointer-events: all;
  }

}

.img_but_R{
  display: flex;
  position: absolute;
  right: 0;
  top: 45%;
  pointer-events: all;
  width: 2.8vw;
  opacity: 70%;
}
.img_but_L{
  display: flex;
  position: absolute;
  left: 0;
  top: 45%;
  pointer-events: all;
  width: 2.8vw;
  opacity: 70%;
}
.img_but_R:hover{
  /*background-color: green;*/
  opacity: 100%;
}
.img_but_L:hover{
  /*background-color: green;*/
  opacity: 100%;
}

@media screen and (max-width: 600px) {
  .img_but_R{
    display: flex;
    position: absolute;
    right: 0;
    top: 40%;
    pointer-events: all;
    width: auto;
    opacity: 50%;

  }
  .img_but_L{
    display: flex;
    position: absolute;
    left: 0;
    top: 40%;
    pointer-events: all;
    width: auto;
    opacity: 50%;
  }


}
.display_menu{
  display: flex;
  margin-top: 5vh;
  margin-left: 10%;
  margin-right: 10%;
  
  
  
}

@media screen and (max-width: 600px) {
  .display_menu{
    display: flex;
    margin-top: 5vh;
    /*margin-left: 10%;
    margin-right: 10%;*/
    margin-left: 0%;
    margin-right: 0%;
  }
}

.show_photo_details{
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  width: 100%;
  border: var(--winered);/* rgb(255, 0, 0);*/
  border-style: solid;
  background-color: black;
  color: white;
}
@media screen and (max-width: 600px) {
  .show_photo_details{
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: 96%;
    border: var(--winered) ;/* rgb(255, 0, 0);*/
    border-style: solid;
    background-color: black;
  }


}

.show_photo_details_details{
  display: flex;
  margin-left: auto;
  margin-right: auto;
  
}

@media screen and (max-width: 600px) {
  .show_photo_details_details{
    display: flex;
    margin-left: auto;
    margin-right: auto;
    font-size: smaller;
    
  }


}

.show_photo_details_link{
  pointer-events: all;
  background-color: black;
  color: red;
  border-style: none;
  margin-left: auto;
  margin-right: auto;
}

.show_photo_details_link:hover{
  color: rgb(0, 96, 198);
}

.music_text{
  color: white;
  width: 35%;
  margin-left: auto;
  margin-right: auto;
  justify-content: center;
    align-items: center;
    text-align: center;

}

.music_image{
  pointer-events: all;
  width: 55%;
  margin-left: auto;
  margin-right: auto;
  background-color: black;
}


.rows_buttons{
  display: block;
  
}
.button_display_menu{
 
  display: block;
  margin-left: 1vw;
  background-color: transparent;
  color: white;
  border: none;
  
  
  pointer-events: all;
}
.button_display_menu:hover{
  color: rgba(255, 255, 255, 0.26)
}

.booking_block{
  display: block;
  color: white;
  margin-left: 5%;
  margin-right: 5%;
  text-align: left;
  pointer-events: all;

  
}

.image_booking{
  
 margin-left: 20%;
  width: 60%;
  
  margin-top: 10vh;
  margin-bottom: 10vh;
}
.audio_booking{
  pointer-events: all;
  width: 60%;
  margin-left: 20%;
  margin-right: 20%;
  margin-bottom: 2vh;
  
}
.Audio_bezeichnung{
  width: 60%;
  margin-left: 20%;
  margin-right: 20%;
  margin-bottom: 2vh;
  font-size: larger;
}
.audio_class{
  display: block;
  align-items: center;
}

.display_discography{
  display: block;
}
.discography_line{
  display: flex;
  margin-bottom: 2vh;
}
@media screen and (max-width: 600px) {
  .discography_line{
    display: block;
  }
}
.discography_cover_pic{
  width: 48%;
  margin-left: 0vw;
  border-style: solid;
  border-color: var(--winered);/* rgb(125, 2, 2);*/
  margin-bottom: auto;
}
.discography_songs_list{
  width: 48%;
  margin-right: 0vw;
  margin-left: auto;
  border-style: solid;
  border-color: var(--winered); /* rgb(125, 2, 2);*/
  background-color: black;
  opacity: 70%;
}

@media screen and (max-width: 600px) {
  .discography_cover_pic{
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    border-style: solid;
    border-color: var(--winered); /* rgb(125, 2, 2);*/
  }
  .discography_songs_list{
    width: 80%;
    margin-right: auto;
    margin-left: auto;
    border-style: solid;
    border-color: var(--winered);/*rgb(125, 2, 2);*/
  }

}

.Album_name_Fett{
  color: white;
  justify-content: center;
  align-items: center;
  text-align: center;
  width: 100%;
  font-size: large;
  margin-top: 1vh;
  margin-bottom: 1vh;
}

.Song_names_klein{
  color: white;
  justify-content: center;
  align-items: left;
  text-align: left;
  /*margin-left: 1vw;*/
  width: 100%;
  font-size: medium;
  pointer-events: all;
  background-color: black;
  /*border-style: none;*/
  border-color: grey;
  margin-bottom: 0.2vw;
}

.Song_names_klein:hover{
  background-color: grey;

}

.download_buy{
  display: flex;
  margin-top: 10vh;
  margin-bottom: 2vh;
  width: 90%;
  margin-right: auto;
  margin-left: auto;

}

.download{
  width: 45%;
  margin-left: 0vw;
  margin-right: auto;
  background-color: rgb(1, 200, 1);
  color: black;
  pointer-events: all;
}

.download:hover{
  background-color: rgb(0, 244, 0);
  
}

@media screen and (max-width: 600px) {
  .download{
    width: 45%;
    margin-left: 0vw;
    margin-right: auto;
    background-color: rgb(1, 200, 1);
    color: black;
    pointer-events: all;
  }

}

.donate{
  width: 45%;
  margin-left: auto;
  margin-right: 0vw;
  background-color: rgb(200, 1, 1);
  color: black;
  pointer-events: all;
}

.donate:hover{

  background-color: rgb(231, 0, 0);
 
}

@media screen and (max-width: 600px) {
  .donate{
    width: 45%;
    margin-left: auto;
    margin-right: 0vw;
    background-color: rgb(200, 1, 1);
    color: black;
    pointer-events: all;
  }

}
.show_booking{
  display: flex;
  width: 100%;
  pointer-events: all;
}
.show_epk{
  display: block;
  position: relative;
  width: 100%;
  pointer-events: all;
}



.epk_all_class{
  margin-top: 8vh;
  display: block;
  position: relative;
  width: 60%;
  margin-left: auto;
  margin-right: auto;
  background-color: rgba(0, 0, 0, 0.705);
  
}


@media screen and (max-width: 600px) {
  .epk_all_class{
    margin-top: 8vh;
    display: block;
    position: relative;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    background-color: rgba(0, 0, 0, 0.705);
    
  }

 


}

.EPK_class{
  display: flex;
  color:rgb(255, 255, 255);
  font-size: xx-large;
  width: 60%;
  margin-left: auto;
  margin-right: auto;
  /*background-color: rgb(40, 40, 40);*/
  margin-bottom: 2vh;
  justify-content: center;
  text-align: center;
  align-items: center;
  /*height: 12vh;*/
}

.besch_epk_class{
  display: flex;
  color: rgb(213, 213, 213);
  background-color: rgb(43, 43, 43);
  width: 100%;
  border-color: rgb(52, 6, 6);
  border-width: 4px;
  border-style: solid;
  text-align: center;
  justify-content: center;
  font-size: x-large;
  margin-top: 16px;
}

.besch_epk_class:hover{
  background-color: rgb(52, 6, 6);
}

.besch_epk_class_div{
  display: block;
  width: 100%;
  
}

.titel_epk_class{
  /*color: white;*/
  color: rgb(213, 213, 213);
  font-size: larger;
}
.titel_epk_class2{
  
  /*color: white;*/
  color: rgb(213, 213, 213);
  font-size: x-large;
  /*border-color: rgba(73, 72, 72, 0.604);
  border-style: solid;*/
  justify-content: center;
  text-align: center;
}

.path_epk_class{
  color: rgb(31, 109, 255);
  font-size: large;

}

.music_image2{
  pointer-events: all;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  margin-top: 2px;
  margin-bottom: 2px;
  background-color: black;
}

.epk_album_div{
  width: 100%;
  display: flex;
  background-color: rgb(0, 0, 0);
  border-color: rgba(255, 0, 0, 0.077);
  border-style: solid;
}

.video_epk{
  width: 100%;
}

.first_pic_epk{
  display: flex;
  width: 70%;
  margin-left: auto;
  margin-right: auto;
}

.img_but_R2{
  display: flex;
  position: relative;
  /*right: 0;*/
  margin-right:0%;
  margin-left:auto;
  margin-top: auto;
  margin-bottom: auto;
  top: 45%;
  pointer-events: all;
  /*width: 2.8vw;*/
  width: 10%;
  opacity: 70%;
}
.img_but_L2{
  display: flex;
  position: relative;
  margin-left: 0;
  margin-right: auto;
  margin-top: auto;
  margin-bottom: auto;
  top: 45%;
  pointer-events: all;
  /*width: 2.8vw;*/
  width: 10%;
  opacity: 70%;
}
.img_but_R2:hover{
  /*background-color: green;*/
  opacity: 100%;
}
.img_but_L2:hover{
  /*background-color: green;*/
  opacity: 100%;
}


.photo_image2{
  width: 80%;
  /*height: 35vw;*/
  pointer-events: all;
}

@media screen and (max-width: 600px) {
  .img_but_R2{
    /*display: none;*/
    /*display: flex;
    position: absolute;
    right: 0;
    top: 40%;
    pointer-events: all;
    width: auto;
    opacity: 50%;*/
    width: 7vw;


  }
  .img_but_L2{
    /*display: none;*/
    /*
    display: flex;
    position: absolute;
    left: 0;
    top: 40%;
    pointer-events: all;
    width: auto;
    opacity: 50%;*/
    width: 7vw;

  }
  .photo_image2{
    width: 80%;
    /*height: 35vw;*/
    pointer-events: all;
  }

 


}

.besch_butt{
  display: flex;
  width: 100%;
  background-color: rgb(199, 199, 199);
  /*background-color: white;*/
  /*border-color: grey;*/
  justify-content: center;
  color: rgb(0, 0, 0);
  align-items: center;
  vertical-align: middle;
  text-align: center;
  border-radius: 10px;
  
}

.besch_butt:hover{
  background-color: rgb(160, 160, 160);
  
}
.bes_epk_class{

  justify-content: center;
  align-items: center;
  vertical-align: middle;
  text-align: center;

}

.pi1_class{
  position: relative;
  margin-left: 5%;
  height: 30px;
  /*width: auto;*/
  margin-right: 0;
  margin-left: auto;
}
.pi2_class{
  position: relative;
  /*margin-left: 2%;*/
  height: 30px;
  /*width: auto;*/
  margin-right: 0;
  /*margin-left: auto;*/
}

.pi3_class{
  position: relative;
  /*margin-left: 2%;*/
  height: 30px;
  /*width: auto;*/
  margin-right: 0;
  margin-left: auto;
}

.sec_no{
  display: none;
  margin-bottom: 8px;
  height: 16px;
}




/* HOME ----------------------*/



.show_home{
  display: flex;
  width: 100%;
  pointer-events: all;
}
.show_no{
  display: none;
}

.home_up{
  /*background-color: green;*/
  width: 100%;
  /*height: 50vh;*/
}

.home_down{
  display: flex;
  /*background-color: red;*/
  width: 100%;
  /*height: 50vh;*/
}


.home_left{
  display: block;
  /*background-color: grey;*/
  width: 48%;
  margin-left: 0;
  margin-right: auto;

}

.home_right{
  display: block;
  /*background-color: grey;*/
  width: 48%;
  margin-left: auto;
  margin-right: 0;

}

@media screen and (max-width: 600px) {
  .home_down{
    display: block;
    /*background-color: red;*/
    width: 100%;
    /*height: 50vh;*/
  }
  .home_left{
    margin-top: 10px;
    display: block;
    /*background-color: grey;*/
    width: 80%;
    margin-left: auto;
    margin-right: auto;
  
  }
  
  .home_right{
    margin-top: 10px;
    display: block;
    /*background-color: grey;*/
    width: 80%;
    margin-left: auto;
    margin-right: auto;
  
  }
  }

.next_gig_class{
  color: white;
}

.nukes{
  display: block;
  position:relative;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  
}

.home_title{
  font-size: xx-large;
  color: white;
  justify-content: center;
  text-align: center;
  align-items: center;

}
.home_titleL{
  font-size: x-large;
  color: white;
  justify-content: center;
  text-align: left;
  align-items: center;

}
.home_undertitle{
  font-size: x-large;
  color: white;
  justify-content: center;
  text-align: center;
  align-items: center;
  
}
.home_underundertitle{
  font-size: medium;
  color: white;
  justify-content: center;
  text-align: center;
  align-items: center;

}
.home_image_class{
  width: fit-content;
  /*height: auto;*/
  max-width: 100%;
  max-height: 100%;
}