html {font-family: Arial, sans-serif;}
#player {
    border: 6px solid #666;
      border-radius: .5em;
        max-width: 24em;
          background: #0e0c0b;
            margin:auto;
          }


          #player audio {width: 99%;   margin: 25px 0 0 0; border:1px solid transparent;} /* 25px fuer Android */
          #player audio:focus, #player audio:hover {background:#bbb;} /* die Rahmenfarbe */

          @media screen and (-webkit-min-device-pixel-ratio:0) { /*chrome only*/
              audio { filter: invert(1);}
            }

            #player ul {margin:0;padding:0}
            #player li {
                box-sizing:border-box;
                  -moz-box-sizing:border-box; /* Firefox */
                    list-style-type:none;
                      /*padding:6px;*/
                      border-top: 2px solid #666;
                        /* width: 240px; */
                    }

                    #player li a {padding:6px;}
                    #player li a:focus, #player li a:hover {background:#ccc;color:#000;outline:0}
                    #player li, #player li a {color:white;text-decoration:none; font-size: .9rem;display:block;}
                    .star {font-size: 1.3rem; line-height: .1rem; /*vertical-align: -.5rem;*/}
                    .bem {
                        font-size: .8rem; 
                          -webkit-text-size-adjust: none; /* was es alles gibt! */
                        }

                        h1, p, #gemafrei {text-align:center;}



                        /* Smartphones and iPad (portrait and landscape) ----------- */
                        @media only screen 
                        and (min-device-width : 320px) 
                        and (max-device-width : 1024px) {
                            #gemafrei:before {content:'iOS und Android mögen leider kein Autostart.'; display:block;}
                              #player li{border-top: 1px solid #888;}
                            }