@media screen and (max-device-width: 480px) {
 body {
  -webkit-text-size-adjust: none; /* Font Resizing deaktivieren */
 }
}
* {
 margin: 0;
 padding: 0;
}
html {
 height: 100%;
}
body {
 background-color: #FFFFFF;
 height: 100%;
}
.Seite {
 position: relative;
 min-height: 100%;
 width: 100%;
}
.Kopfzeile {
    position:fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 45px;
    background-color:#FFFFFF;
    z-index:4;
}
.Titelbild {
  position:absolute;
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
    /*position:relative;
    top: 60px;
    margin: 0px auto;*/
    z-index:2;
}
.Titelblatt {
    position:absolute;
    margin-left:0.5%;
    margin-right:0.5%;
    top: 45px;
    width: 99%;
    z-index:1;
}
#Inhalt {
    padding-top:70px;
    width: 100%;
    z-index:1;
}
.Lied {
    padding-top:50px;
    width: 100%;
    z-index:1;
}
.links {
  text-align:left;
}
.mittig {
  text-align:center;
}
.rechts {
  text-align:right;
}
.Breite50 {
  width: 50%;
}
.Menuezeile {                   
    margin-top:3px;
    margin-left:0.5%;
    border:0px;
    min-width:99%;
    width:99%;
}
.Menuepunkt {
    border:0px;
    width:16.6%;
    text-align:center;
    line-height:34px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -o-border-radius: 5px;
    box-shadow: 0px 1px 2px #444444;
    -moz-box-shadow: 0px 1px 2px #444444;
    -webkit-box-shadow: 0px 1px 2px #444444;
    -o-box-shadow: 0px 1px 2px #444444;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.Rahmen_Songtitel {
   margin-top:1px;
   width:99%;              /* fuer aeltere Browser */
   min-width:99%;
   margin-left:0.5%;
   overflow:hidden;
   text-overflow:ellipsis;
   white-space:nowrap;
   background-image:url(/Safe/Allgemeines/Bilder/Punkt.bmp);
   background-repeat:repeat-x;
   background-position:bottom;
   padding-bottom:2px; /* wg 2px-border um Ring_on */
}
.Spalte1v1 {
    float:left;
    width: 99%;
    padding-left:0.5%;
}
.Spalte1v3 {
    float:left;
    width: 32.7%;
    padding-left:0.5%;
    background:url(/Safe/Allgemeines/Bilder/Linie_senkrecht.jpg);
    background-size: 1px 100%;
    background-repeat:no-repeat;
    background-position:right;
}
 
.Spalte2v3 {
    float:left;
    width: 32.7%;
    padding-left:0.5%;
    background:url(/Safe/Allgemeines/Bilder/Linie_senkrecht.jpg);
    background-size: 1px 100%;
    background-repeat:no-repeat;
    background-position:right;
}
 
.Spalte3v3 {
    float:left;
    width: 32.6%;
    padding-left:0.5%;
}
.Bemerkung {
    clear:left;
    background:url(/Safe/Allgemeines/Bilder/Linie_waagerecht.jpg);
    background-size: 99% 1px;
    background-repeat:no-repeat;
    background-position:top;
    margin-left:0.5%;
    margin-right:0.5%;
}
.Fusszeile1 {
    position:fixed;
    bottom: 0px;
    width: 100%;
    height:28px;
    background:url(/Safe/Allgemeines/Bilder/Dot_ganzweiss28.jpg);
    background-repeat:repeat-x;
    background-position:bottom;
    float:left;
    z-index:3;
}
.Fusszeile2 {
    position:fixed;
    bottom: 0px;
    width: 100%;
    height:45px;
    background:url(/Safe/Allgemeines/Bilder/Dot_ganzweiss45.jpg);
    background-repeat:repeat-x;
    background-position:bottom;
    float:left;
    z-index:3;
}
.Fusszeile {
    margin-top:1px;
    margin-bottom:1px;
}
.Rahmen_Fusszeile {
    min-width:99%;
    width:99%;
    margin-left:0.5%;
    border:0px;
    margin-top:3px;
    background-image: url(/Safe/Allgemeines/Bilder/FussPunkt.jpg);
    background-repeat:repeat-x;
    background-position:top;
}
.Fusszeile_links {
     margin-left:0px;
     margin-top:3px;
}
.Fusszeile_rechts {
     margin-right:0px;
     margin-left:auto;
     margin-top:3px;
}
.Akkordzeile {
    line-height:16px;
    vertical-align:baseline;
}
.Textzeile {
    line-height:18px;
    vertical-align: bottom;
}
.Textzeile_r {
    line-height:18px;
    vertical-align: bottom;
    float:right;
    margin-right:8px;
}
.Erklaerungszeile {
    text-overflow: ellipsis;
    white-space: nowrap;
}
.Schrift_Menue {
    font-family: Geneva, Arial, Helvetica, sans-serif;
    font-size: 16px;
    color: #000000;
    text-decoration: none;
    font-weight:normal;
    text-shadow:1px 1px 1px #919191;
}
.Schrift_Menue_rot {
    font-family: Geneva, Arial, Helvetica, sans-serif;
    font-size: 16px;
    color: #009933;
    text-decoration: none;
    font-weight:normal;
    text-shadow:1px 1px 1px #919191;
}
.Schrift_Menue_grau {
    font-family: Geneva, Arial, Helvetica, sans-serif;
    font-size: 16px;
    color: #919191;
    text-decoration: none;
    font-weight:normal;
    text-shadow:1px 1px 1px #919191;
}
.Schrift_Menue_gr {
    font-family: Geneva, Arial, Helvetica, sans-serif;
    font-size: 20px;
    color: #000000;
    text-decoration: none;
    font-weight:normal;
    text-shadow:2px 2px 2px #919191;
}
.Schrift_Menue_gr_rot {
    font-family: Geneva, Arial, Helvetica, sans-serif;
    font-size: 20px;
    color: #ff0000;
    text-decoration: none;
    font-weight:normal;
    text-shadow:2px 2px 2px #919191;
}
.Schrift_Menue_klein {
    font-family: Geneva, Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #000000;
    text-decoration: none;
    font-weight:normal;
    text-shadow:2px 2px 2px #919191
}
.Symbol {
    font-family: Geneva, Arial, Helvetica, sans-serif;
    vertical-align:0px;
    font-size: 20px;
    color: #006600;
    text-decoration: none; 
}
.Symbol_weiss {
    font-family: Geneva, Arial, Helvetica, sans-serif;
    vertical-align:0px;
    font-size: 20px;
    color: #ffffff;
    text-decoration: none; 
}
.Symbol {
    font-family: Geneva, Arial, Helvetica, sans-serif;
    vertical-align:0px;
    font-size: 20px;
    color: #006600;
    text-decoration: none; 
}
.Akkord {
    font-family: Arial, Helvetica, sans-serif;
    vertical-align:0px;
    font-size: 16px;
    color: #ff0000;
    text-decoration: none; 
}
.Akkord_grau {
    font-family: Arial, Helvetica, sans-serif;
    vertical-align:0px;
    font-size: 16px;
    color: #919191;
    text-decoration: none; 
}
.Akkord_weiss {
    font-family: Arial, Helvetica, sans-serif;
    vertical-align:0px;
    font-size: 16px;
    color: #ffffff;
    text-decoration: none; 
}
.Akkord_grau_hoch {
    font-family: Arial, Helvetica, sans-serif;
    vertical-align:top;
    position:relative;
    top:-2px;
    font-size: 12px;
    color: #919191;
    text-decoration: none; 
}
.Akkord_weiss_hoch {
    font-family: Arial, Helvetica, sans-serif;
    vertical-align:top;
    position:relative;
    top:-2px;
    font-size: 12px;
    color: #ffffff;
    text-decoration: none; 
}
.Akkord_ul {
    font-family: Arial, Helvetica, sans-serif;
    vertical-align:0px;
    font-size: 16px;
    color: #ff0000;
    text-decoration:none;
    background-image:url(/Safe/Allgemeines/Bilder/Hintergrund_Akkord_geschlossen.gif);
    background-repeat:repeat-x;
    background-position:bottom;
}
.Akkord_ul_b {
    font-family: Arial, Helvetica, sans-serif; font-style:oblique;
    vertical-align:0px;
    font-size: 16px;
    color: #ff0000;
    font-weight:bold;
    text-decoration:none;
    background-image:url(/Safe/Allgemeines/Bilder/Hintergrund_Akkord_geschlossen.gif);
    background-repeat:repeat-x;
    background-position:bottom;
}
.Akkord_ul_grau {
    font-family: Arial, Helvetica, sans-serif;
    vertical-align:0px;
    font-size: 16px;
    color: #919191;
    text-decoration:overline;
    text-decoration:none;
    background-image:url(/Safe/Allgemeines/Bilder/Hintergrund_Akkord_geschlossen.gif);
    background-repeat:repeat-x;
    background-position:bottom;
}
.Akkord_ul_b_grau {
    font-family: Arial, Helvetica, sans-serif;
    font-style:oblique;
    vertical-align:0px;
    font-size: 16px;
    color: #919191;
    text-decoration:none;
    background-image:url(/Safe/Allgemeines/Bilder/Hintergrund_Akkord_geschlossen.gif);
    background-repeat:repeat-x;
    background-position:bottom;
    font-weight:bold;
}
.Akkord_hoch {
    font-family: Arial, Helvetica, sans-serif;
    vertical-align:top;
    position:relative;
    top:-2px;
    font-size: 12px;
    color: #ff0000;
    text-decoration: none; 
}
.Ton {
    font-family: Arial, Helvetica, sans-serif; font-style: italic;
    vertical-align:0px;
    font-size: 16px;
    color: #3300cc;
    text-decoration: none; 
}
.Ton_weiss {
    font-family: Arial, Helvetica, sans-serif; font-style: italic;
    vertical-align:0px;
    font-size: 16px;
    color: #ffffff;
    text-decoration: none; 
}
.Ton_ul {   
    font-family: Arial, Helvetica, sans-serif; font-style: italic;
    vertical-align:0px;
    font-size: 16px;
    color: #3300cc;
    text-decoration: none; 
    background-image:url(/Safe/Allgemeines/Bilder/Hintergrund_Akkord_geschlossen.gif);
    background-repeat:repeat-x;
    background-position:bottom;
}
.Ton_hoch { 
    font-family: Arial, Helvetica, sans-serif; font-style: italic;
    vertical-align:top;
    position:relative;
    top:-2px;
    font-size: 12px;
    color: #3300cc;
    text-decoration: none; 
}
.Ton_hoch_grau {
    font-family: Arial, Helvetica, sans-serif; font-style: italic;
    vertical-align:top;
    position:relative;
    top:-2px;
    font-size: 12px;
    color: #919191;
    text-decoration: none; 
}
.Ton_hoch_weiss {
    font-family: Arial, Helvetica, sans-serif; font-style: italic;
    vertical-align:top;
    position:relative;
    top:-2px;
    font-size: 12px;
    color: #ffffff;
    text-decoration: none; 
}
.Ton_tief {
    font-family: Arial, Helvetica, sans-serif; font-style: italic;
    font-size: 10px;
    font-style: normal;
    color: #3300cc;
    text-decoration: none; 
    vertical-align:0px;
}
.Text_gr_schattiert {
    font-family: Arial, Helvetica, sans-serif; font-style: italic;
    font-size: 26px;
    color: #000000;
    text-decoration: none;
    font-weight:normal;
    text-shadow:2px 2px 2px #919191
}
.Kleintext {
     font-family: Geneva, Arial, Helvetica, sans-serif;
     font-size: 14px;
     color:#000000;
     text-decoration: none;
     background-color:#FFFFFF;
}
.Kleintext_blau_ul {
     font-family: Geneva, Arial, Helvetica, sans-serif;
     font-size: 14px;
     color:#3300cc;
     text-decoration:underline;
}
.Kleintext_grau {
     font-family: Geneva, Arial, Helvetica, sans-serif;
     font-size: 14px;
     color:#919191;
     text-decoration: none;
}
.Normaltext_ul {
     font-family: Geneva, Arial, Helvetica, sans-serif;
     font-weight:normal;
     font-size: 16px;
     color:#000000;
     text-decoration:underline;
}
.Normaltext {
     font-family: Geneva, Arial, Helvetica, sans-serif;
     font-weight:normal;
     font-size: 16px;
     color:#000000;
     text-decoration: none;
}
.Normaltext_em {
     font-family: Geneva, Arial, Helvetica, sans-serif;
     font-size: 16px;
     font-style:italic;
     color:#000000;
     text-decoration: none;
}
.Normaltext_fett {
     font-family: Geneva, Arial, Helvetica, sans-serif;
     font-size: 16px;
     font-weight:bold;
     color:#000000;
     text-decoration: none;
}
.Normaltext_grau {
     font-family: Geneva, Arial, Helvetica, sans-serif;
     font-size: 16px;
     color:#919191;
     text-decoration: none;
}
.Normaltext_blau {
     font-family: Geneva, Arial, Helvetica, sans-serif;
     font-size: 16px;
     color:#3300cc;
     text-decoration: none;
}
.Normaltext_rot {
     font-family: Geneva, Arial, Helvetica, sans-serif;
     font-size: 16px;
     color:#ff0000;
     text-decoration: none;
}
.Normaltext_gruen {
     font-family: Geneva, Arial, Helvetica, sans-serif;
     font-size: 16px;
     color:#009966;
     text-decoration: none;
}
.Normaltext_weiss {
     font-family: Geneva, Arial, Helvetica, sans-serif;
     font-size: 16px;
     color:#ffffff;
}
.Text_Inhaltsverzeichnis {
     font-family: Geneva, Arial, Helvetica, sans-serif;
     font-weight:normal;
     background-color:white;
     color:#000000;
     text-decoration: none;
}
.Text_Titelseite {
     font-family: Geneva, Arial, Helvetica, sans-serif;
     font-size:19px;
     color:#cccccc;
     text-decoration: none;
     font-weight:normal;
     text-shadow:none;
     text-align:justify;
}
.Text_Fusszeile {
     font-family: Geneva, Arial, Helvetica, sans-serif;
     font-size:12px;
     color:#000000;
     text-decoration: none;
     font-weight:normal;
     text-shadow:none
}
.Text_Fusszeile_grau {
     font-family: Geneva, Arial, Helvetica, sans-serif;
     font-size:12px;
     color:#919191;
     text-decoration: none;
     font-weight:normal;
     text-shadow:none
}
.Text_Fusszeile_grau_kursiv {
     font-family: Geneva, Arial, Helvetica, sans-serif;
     font-size:12px;
     color:#919191;
     text-decoration: none;
     font-weight:normal;
     text-shadow:none;
     font-style:italic;
}
.Refrain {
     background-image: url(/Safe/Allgemeines/Bilder/Farbverlauf_kurz.jpg); background-repeat:repeat-y;
     border-collapse:collapse;
     padding-left:3px;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
}
.Strophe {
     border-collapse:collapse;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
}
.Inhalt_Text {
     font-family: Geneva, Arial, Helvetica, sans-serif;
     font-size: 16px;
     color:#000000;
     background-color:#ff0000;
}
.Tabelle_Sprachwahl {
     padding-left:12px;
     width:100%;
}
.Tabellenzelle_top {
      vertical-align:top;
}
.Tabelle_Mitte {
     margin-left:auto;
     margin-right:auto;
}
.Foto_mitte,
.Bild_mittig {
     vertical-align: middle;
}
.Foto_unten {
     vertical-align: bottom;
}
.Foto_oben {
     vertical-align: top;
}
.mit_Scrollbalken {
    overflow-y: scroll;
}
.Ring_ohne,
.Ring_off,
.Ring,
.Ring_on {                                       /* fuer Songs mit mehreren Versionen */
   border-radius:50%;
   -moz-border-radius:50%; 
   -webkit-border-radius:50%;
   -o-border-radius:50%;
   margin-right:3px; /* wg Ring_on_Schatten zum Kapo-Symbol */
}
.Ring_ohne,
.Ring {                      /* weisser Schatten */
   box-shadow:0px 0px 5px #fff;
   -moz-box-shadow:0px 0px 5px #fff;
   -webkit-box-shadow:0px 0px 5px #fff;
   -o-box-shadow:0px 0px 5px #fff;
}
.Ring {                      /* weisser Schatten */
   padding:2px; /* Ersatz fuer border:2px */
}
.Ring_off {                      /* roter Schein */
   box-shadow:0px 0px 6px #fff;
   -moz-box-shadow:0px 0px 6px #fff;
   -webkit-box-shadow:0px 0px 6px #fff;
   -o-box-shadow:0px 0px 6px #fff;
   border:2px solid #fff;
}
.Button_on,
.Ring_on {      
   box-shadow:0px 0px 6px #33cc00;
   -moz-box-shadow:0px 0px 6px #33cc00;
   -webkit-box-shadow:0px 0px 6px #33cc00;
   -o-box-shadow:0px 0px 6px #33cc00;
   border:2px solid #33cc00;
}
.Button_on,
.Button {                                     
   padding:2px;  /* wg 2px-border um Ring_on */
   border-radius:5px;
   -moz-border-radius:5px; 
   -webkit-border-radius:5px;
   -o-border-radius:5px;
   vertical-align:middle;
   overflow:hidden;
   text-overflow:ellipsis;
   white-space:nowrap;
   background-color:#ffffff;
}
.Button {                                     
   border:2px solid #ffffff;
   box-shadow:0px 1px 2px #666666;
   -moz-box-shadow:0px 1px 2px #666666;
   -webkit-box-shadow:0px 1px 2px #666666;
   -o-box-shadow:0px 1px 2px #666666;
}
.Songtitel_linker_Teil,
.Songtitel_rechter_Teil {
  border-collapse:collapse;
  border:0px;
}
.Songtitel_linker_Teil {
  margin-left:0px;
}
.Songtitel_rechter_Teil {
  margin:0 0 0 auto;         /* rechtsbuendig */
}
/*.Songtitel_linker_Teil {
     border-collapse:collapse;
     border:0px;
     margin-left:0px;
}
.Songtitel_rechter_Teil {
     border-collapse:collapse;
     border:0px;
     margin: 0 0 0 auto;
}*/

.div-hauptcontainer {
    margin: 10px 0 0 10px;
    width:100%;
    height:80%;
    float: left;
    background-color:#E8E8E8;
}
.Eingabefeld {
   background-color:#f3f3f3;
   /*vertical-align:middle;*/
   font-family:Geneva, Arial, Helvetica, sans-serif;
   text-decoration:none;
   font-weight:normal;
   font-size:16px;
   color:#000000;
   border:none;
   border-radius:3px;
   -moz-border-radius:3px; 
   -webkit-border-radius:3px;
   -o-border-radius:3px;
   width:80%;
   margin-left:8px;
}
.LoginBox_Wdh,
.LoginBox {
    position:relative;
    top: 160px;
    margin: 0px auto;
    z-index:100;
    width:35%;
    height:226px;
    background-color:#fff;
    box-shadow: 1.5px 1.5px 3px 0.5px #9e9ea0; /*rgba(91,93,134,1);*/
    -moz-box-shadow: 1.5px 1.5px 3px 0.5px #9e9ea0;
    -webkit-box-shadow: 1.5px 1.5px 3px 0.5px #9e9ea0;
    -o-box-shadow: 1.5px 1.5px 3px 0.5px #9e9ea0;
    border-radius: 16px;
    -moz-border-radius: 16px;
    -webkit-border-radius: 16px;
    -o-border-radius: 16px;
    padding:8px;
}
.LoginBox_Wdh {
  animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
  transform: translate3d(0, 0, 0);
  backface-visibility: hidden;
  perspective: 1000px;
}
@keyframes shake {
  10%, 90% {
    transform: translate3d(-1px, 0, 0);
  }
  
  20%, 80% {
    transform: translate3d(2px, 0, 0);
  }
  30%, 50%, 70% {
    transform: translate3d(-4px, 0, 0);
  }
  40%, 60% {
    transform: translate3d(4px, 0, 0);
  }
}

/* Cookie-Hinweis */
 
  /* Haupt-Container */
.cookie-notice-container {
     font-family: Geneva, Arial, Helvetica, sans-serif;
     font-size: 14px;
     color:#000000;
     text-decoration: none;
  background: #f4ffca; 
  position:fixed;
  bottom:3px;
  left:4px; 
  right:6px;
  z-index:20; 
  line-height:24px;
 text-align:center;
  color: #000070; /* ehem. 000033 */
  box-shadow: 1.5px 1.5px 3px 0.5px #9e9ea0; /*rgba(91,93,134,1);*/
  -moz-box-shadow: 1.5px 1.5px 3px 0.5px #9e9ea0;
  -webkit-box-shadow: 1.5px 1.5px 3px 0.5px #9e9ea0;
  -o-box-shadow: 1.5px 1.5px 3px 0.5px #9e9ea0;
  border-radius: 16px;
  -moz-border-radius: 16px;
  -webkit-border-radius: 16px;
  -o-border-radius: 16px;
}
 
  /* Button-Container */
.cookie-notice-buttons {
 margin-top:8px;
 margin-bottom:8px;
 text-align:center;
  font-family: Geneva, Arial, Helvetica, sans-serif;
  text-decoration: none;
  font-size: 0.75rem; /* = 12/16 px */
}
 
  /* Ok-Button */ 
.cookie-notice-button-accept{
  background: #919191;
  margin: 0px;
  padding:0px;
  padding-left:auto;
  padding-right:auto;
  font-family: Geneva, Arial, Helvetica, sans-serif;
  text-decoration: none;
  font-size: 0.875rem; /* = 14/16 px */
  color: #ffffff;
  font-weight:bold;
  box-shadow: 1.5px 1.5px 3px 0.5px #9e9ea0; /*rgba(91,93,134,1);*/
  -moz-box-shadow: 1.5px 1.5px 3px 0.5px #9e9ea0;
  -webkit-box-shadow: 1.5px 1.5px 3px 0.5px #9e9ea0;
  -o-box-shadow: 1.5px 1.5px 3px 0.5px #9e9ea0;
  border-radius: 6px;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  -o-border-radius: 6px;
}
/* Ende Cookie-Hinweis */

/* POP-UP ohne Java */

body {
  font-family: Arial, sans-serif;
  /* background: url(http://ak.picdn.net/assets/cms/2d850dac5bcfcb86514922660d6e357aa44fd06e-crop-shutterstock_310408637.jpg) no-repeat;*/
  background-size: cover;
  height: 100vh;
}
h1 {
  text-align: center;
  font-family: Tahoma, Arial, sans-serif;
  color: #06D85F;
  margin: 80px 0;
}
.box {
  width: 40%;
  margin: 0 auto;
  background: rgba(255,255,255,0.2);
  padding: 35px;
  border: 2px solid #fff;
  border-radius: 20px/50px;
  background-clip: padding-box;
  text-align: center;
}
.button {
  font-size: 1em;
  padding: 10px;
  color: #fff;
  border: 2px solid #06D85F;
  border-radius: 20px/50px;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.3s ease-out;
}
.button:hover {
  background: #06D85F;
}
.overlay {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.7);
  transition: opacity 500ms;
  visibility: hidden;
  opacity: 0;
}
.overlay:target {
  visibility: visible;
  opacity: 1;
}
.popup {
  margin: 70px auto;
  padding: 20px;
  background: #fff;
  border-radius: 5px;
  width: 30%;
  position: relative;
  transition: all 5s ease-in-out;
}
.popup h2 {
  margin-top: 0;
  color: #333;
  font-family: Tahoma, Arial, sans-serif;
}
.popup .close {
  position: absolute;
  top: 20px;
  right: 30px;
  transition: all 200ms;
  font-size: 30px;
  font-weight: bold;
  text-decoration: none;
  color: #333;
}
.popup .close:hover {
  color: #06D85F;
}
.popup .content {
  max-height: 30%;
  overflow: auto;
}
@media screen and (max-width: 700px){
  .box{
    width: 70%;
  }
  .popup{
    width: 70%;
  }
}
/* Ende POP-UP ohne Java */
