@charset "utf-8";

#abdecker
  {
    position: fixed;
    top: -9999px;
    left: 0px;
    height: 100%;
    width: 100%;
    background-color: #A0A0A0;
    padding: 10px 20px;
    opacity: 0.3;
    z-index: 99;
  }

#anleitung
  {
    position: fixed;
    width: 500px;
    font-size: 0.85em;
    margin-top: -175px;
    margin-left: -275px;
    top: -9999px;
    left: 50%;
    border: 5px solid #0040FF;
    border-radius: 8px;
    background-image: url("../bilder/HB_Training.jpg");
    text-align: left;
    padding: 10px 20px;
    z-index: 100;
  }

#anleitungstext
  {
    height: 250px;
    overflow-y: scroll;
    background: #FFFFFF;
    padding: 5px 10px;
    border: 2px solid black;
  }

#holder
  {
    width: 760px;
    background: #FFFF22;
    background-image: linear-gradient(#EEEE00, #FFFF66);
    margin: 0 auto 0 auto;
  }

#Arbeitscontainer
  {
    position: relative;
/*    height: 650px;*/
    overflow-y: hidden;
    z-index: 9;
  }

#Typauswahl
  {
    background: #FFFF99;
    margin: 10px;
    padding: 5px;
    text-align: center;
    border: 1px solid;
  }

#Grundtonauswahl
  {
    background: #FFFF99;
    margin: 10px;
    padding: 5px;
    text-align: center;
    border: 1px solid;
  }

#Anzeigefeld
  {
    position: relative;
    background: #C0A000;
    height: 220px;
    margin: 10px;
    padding: 5px;
    text-align: center;
    border: 1px solid;
  }

#Durcontainer
  {
    position: absolute;
    top: 150px;
    left: 18px;
    width: 385px;
    z-index: 20;
  }

#Mollncontainer
  {
    position: absolute;
    top: 150px;
    left: 18px;
    width: 385px;
    z-index: 2;
  }

#Mollhcontainer
  {
    position: absolute;
    top: 150px;
    left: 18px;
    width: 385px;
    z-index: 3;
  }

#Mollmcontainer
  {
    position: absolute;
    top: 150px;
    left: 18px;
    width: 385px;
    z-index: 4;
  }

#Dorcontainer
  {
    position: absolute;
    top: 150px;
    left: 18px;
    width: 385px;
    z-index: 5;
  }

#Phrygcontainer
  {
    position: absolute;
    top: 150px;
    left: 18px;
    width: 385px;
    z-index: 6;
  }

#Lydcontainer
  {
    position: absolute;
    top: 150px;
    left: 18px;
    width: 385px;
    z-index: 7;
  }

#Mixolydcontainer
  {
    position: absolute;
    top: 150px;
    left: 18px;
    width: 385px;
    z-index: 8;
  }

#Arabcontainer
  {
    position: absolute;
    top: 150px;
    left: 18px;
    width: 385px;
    z-index: 9;
  }

#Ungcontainer
  {
    position: absolute;
    top: 150px;
    left: 18px;
    width: 385px;
    z-index: 10;
  }

.Grundtonknopf
  {
    background: #FF4444;
    width: 113px;
    height: 35px;
    border-radius: 10px;
    font-size: 135%;
    font-weight: bold;
  }

#Cknopf
  {
    background: #FFBBBB;
  }