/* ===========================
   Stylesheet Hoeren Sie selbst
   Datei: xhoer.css
   Datum: 2024-01-14
   Autor: Matthias Meiners 
   ===========================*/


/* Allgemein */

* {margin: 0;
   padding: 0;}
   
html {height: 101%; background-color: #225588;}

body {
   position: relative;
   width: 1003px;
   margin: 0 auto 0 auto;
   min-width: 800px;
   font-family: Arial, Helvetica, sans-serif;
   color: #222222;
   font-size: 95%;
   background: #FFFFFF url(bilder/praeludio_16.gif) repeat-y top left;}

h1, h2 {font-size: 1.3em;}
h3 {font-size: 1.1em;}
h4 {font-size: 1.0em;}
h5 {font-size: 0.9em;}

h1, h2, h3, h4 {font-family: Arial, Verdana, Helvetica, sans-serif;}
h1 {color: #750000;}
h2, h4 {color: #666666;}
h3, h5 {color: #555555;}

p {
   font-size: 0.8em;
   line-height: 1.4em;}

ul, ol {line-height: 1.3em;}

.stopFloat {display: block;
            float: none;
            clear: both;
            height: 1px;
            width: auto;
            line-height: 0;
            font-size: 0;}

.nofloat {float: none;
          clear: both;}

.hidden {position: relative;
   top: -7000px;
   left: -7000px;
   margin: 0;
   padding: 0;
   font-size: 0;
   width: 0;
   height: 0;}

/* Hyperlinks */

a {
   color: #003399;
   font-size: 0.8em;
   font-weight: bold;
   text-decoration: none;}

a:link,
a:visited {color: #003399;
   outline: none;}

a:hover {color: #5588BB;
   text-decoration: none;
   border-bottom: #5588BB solid 1px;}

a:active {color: #5588BB;
   outline: none;}

a.intern {
   font-weight: bold;}
a.intern:link,
a.intern:visited {
   font-size: 0.8em;
   color: #5588BB;
   text-decoration: none;
   outline: none;}
a.intern:hover {
   color: #0033AA;
   border-bottom: #0033AA 1px solid;}


a.intern2 {font-weight: bold;
   margin-left: 20px;}
a.intern2:link,
a.intern2:visited {
   font-size: 0.8em;
   color: #5588BB;
   text-decoration: none;
   outline: none;}
a.intern2:hover {
   color: #0033AA;
   border-bottom: #0033AA 1px solid;}

a.intern3 {font-weight: bold;}
a.intern3:link,
a.intern3:visited {
   font-size: 1em;
   color: #5588BB;
   text-decoration: none;
   outline: none;}
a.intern3:hover {
   color: #0033AA;
   border-bottom: #0033AA 1px solid;}

a.extern {
   color: #003399;
   font-size: 0.8em;
   font-weight: bold;
   text-decoration: none;
   padding: 1px 1px 0 2px;}

a.extern:link,
a.extern:visited {
   font-size: 0.8em;
   color: #003399;
   text-decoration: none;
   outline: none;}

a.extern:hover {
   color: #FFFFFF;
   background-color: #003399;
   text-decoration: none;}

a.extern2 {
   color: #003399;
   font-size: 0.8em;
   font-weight: bold;
   text-decoration: none;
   padding: 1px 1px 0 0;}

a.extern2:link,
a.extern2:visited {
   font-size: 0.8em;
   color: #003399;
   text-decoration: none;
   outline: none;}

a.extern2:hover {
   color: #FFFFFF;
   background-color: #003399;
   text-decoration: none;}

a.extern3 {
   color: #003399;
   font-size: 0.8em;
   font-weight: bold;
   text-decoration: none;
   padding: 1px 3px 0 2px;}

a.extern3:link,
a.extern3:visited {
   font-size: 0.8em;
   color: #003399;
   text-decoration: none;
   outline: none;}

a.extern3:hover {
   color: #FFFFFF;
   background-color: #003399;
   text-decoration: none;}

a.exklusiv {
   color: #FFFFFF;
   background-color: #003399;
   text-decoration: none;
   border: 0;
   border-radius: 4px;
   font-size: 1em;
   padding: 2px 2px 2px 3px;}

a.exklusiv span.messe {color: #FFF;}

a.exklusiv:link,
a.exklusiv:visited {
   font-size: 1em;
   color: #003399;
   text-decoration: none;
   outline: none;}

a.exklusiv:hover {
   background-color: #FFF;
   font-size: 1em;
   font-weight: bold;
   text-decoration: none;
   padding: 2px 2px 2px 3px;}

a.exklusiv:hover span.messe {
   color: #003399;}

/* Sonderformen der Linkgestaltung */

a.extern2:hover span.text_fett{color: #CCC; background-color: #003399;}


/* Textgestaltung */

.intern {
   font-weight: bold;
   font-size: 1.1em;}
.text_fett {font-weight: bold;
   color: #222222;}
.text_fett2 {font-weight: bold;
   color: #222222;
   padding-left: 2px;}
.text_fett3 {font-weight: bold;
   color: #555555;}
.text_kursiv {font-weight: bold;
   font-style: italic;}
.text_kursiv2 {
   font-weight: bold;
   font-style: italic;
   color: #222222;}
.text_kursiv3 {
   font-weight: bold;
   font-style: italic;
   color: #003399;}
.text_kursiv4 {font-weight: normal;
   font-style: italic;}
.text_kursiv5 {
   font-weight: bold;
   font-style: italic;}
.text_eng {line-height: 1.4em;}
.text_blau {font-weight: bold;
   color: #0033BB;}
.text_grau {font-weight: bold;
   color: #444444;}
.text_grau2 {font-weight: bold;
   color: #555555;
   padding-right: 2px;}
.text_gros {font-weight: bold;
   font-size: 1.1em;}
.text_gros2 {font-weight: bold;
   font-size: 1em;}
.preis {font-weight: bold;
   color: #BF0000;}
.liste {font-size: 0.8em;}
.punkte li {list-style: circle;}
.p1 {padding-bottom: 10px;
   line-height: 1.4em;}
.p2 {padding-bottom: 15px;}
.pc3 {padding-bottom: 30px;}
.pc4 {padding-bottom: 5px;}
.pc5 {padding: 20px 0 10px 0;}
.pc6 {padding: 20px 0 30px 0;}
.pc7 {padding: 10px 0 30px 0;}
.pc8 {padding-top: 20px;}
.besonders {padding-bottom: 20px;
   line-height: 1.4em;}
.register {position: relative;
   top: -3px;
   padding-left: 1px;}
span.kopierrecht {position: relative; left: 2px; bottom: 3px;}

.padd-ob-20 {padding-top: 20px;}
.padd-u-20 {padding-bottom: 20px;}

.abstand-o10 {margin-top: 10px;}
.abst-u20 {margin-bottom: 20px;}

.abstand-u30 {margin-bottom: 30px;}
.marg-u15 {margin-bottom: 15px;}
.marg-ob-20 {margin-top: 20px;}
.fs09 {font-size: 0.9em;}
.fs08 {font-size: 0.8em;}
#impressuminhalt ul.copylist {
	font-size: 0.82em;
	margin: 5px 0 15px 20px;}
#impressuminhalt ul.copylist li {margin-bottom: 4px;}

.rand {
   display: block;
   margin: 5px 0 4em 0px;}
.rand1h {
   display: block;
   margin: 20px 0 7px 0px;}
.randnav {
   display: block;
   margin: 5px 0 4em 20px;}

.trenner2 {display: block;
   width: 75%;
   height: 100px;
   background-image: url(bilder/trenner1.jpg);
   background-repeat: no-repeat;
   margin: 70px 0 80px 30px;}
 a.trenner2:hover {border-bottom: 0;}

.trenner5 {display: block;
   width: 605px;
   height: 100px;
   background-image: url(bilder/trenner1.jpg);
   background-repeat: no-repeat;
   margin: 100px 0 50px 30px;}
 a.trenner5:hover {border-bottom: 0;}

.trennerx5 {display: block;
   width: 720px;
   height: 100px;
   background-image: url(bilder/trennerx5.jpg);
   background-repeat: no-repeat;
   margin: 100px 0 50px -50px;
   opacity: 0.7;}
 a.trennerx5:hover {border-bottom: 0;}


/* Seitenkopf */

.logo {background-image: url(bilder/hbg143.gif);
   background-repeat: repeat-x;}
.logo-ganz {
   display: block;
   width: 1003px;
   height: 143px;
   padding: 0;
   margin: 0;
   background-image: url(bilder/hoeren-sie-selbst-logo.png);
   background-repeat: no-repeat;}
a.logo-ganz:hover {border-bottom: 0;}

/* Spalte Impressum */

.spalte {width: 140px;
   position: absolute;
   top: 250px;
   left: 845px;}

a.einladung {display: block;
   width: 116px;
   height: 116px;
   background-image: url(bilder/hoerbeispiele.jpg);
   background-repeat: no-repeat;}
a.einladung:hover {display: block;
   width: 116px;
   height: 116px;
   background-image: url(bilder/selberhoeren.jpg);
   background-repeat: no-repeat;
   border-bottom: 0px;}

/* Navigation */
   
.navi {width: 140px;
   position: absolute;
   top: 110px;
   left: 0;
   background-image: url(bilder/praeludio_16.gif);
   padding-top: 65px;}

.nav01, .nav02, .nav03 {
   position: relative;
   left: 36px;
   margin-top: 0px;
   border-bottom: 0px;}

#startseite a.nav01 {
   background-image: url(bilder/hoeren-ac.png);
   background-repeat: no-repeat;}
#startseite a.nav01:hover {background-image: url(bilder/hoeren-ov.png);}

#links a.nav02 {
   background-image: url(bilder/links-ac.png);
   background-repeat: no-repeat;}
#links a.nav02:hover {background-image: url(bilder/links-ov.png);}

#impressum a.nav03 {
   background-image: url(bilder/impressum-ac.png);
   background-repeat: no-repeat;}
#impressum a.nav03:hover {background-image: url(bilder/impressum-ov.png);}

a.nav01 {display: block;
   width: 123px;
   height: 31px;
   background-image: url(bilder/hoeren-pa.png);
   background-repeat: no-repeat;}   
a.nav01:hover {background-image: url(bilder/hoeren-ov.png);
   border-bottom: 0px;}

a.nav02 {display: block;
   width: 123px;
   height: 31px;
   border: 0;
   background-image: url(bilder/links-pa.png);
   background-repeat: no-repeat;}
a.nav02:hover {background-image: url(bilder/links-ov.png);
   border-bottom: 0px;}

a.nav03 {display: block;
   width: 123px;
   height: 31px;
   background-image: url(bilder/impressum-pa.png);
   background-repeat: no-repeat;}   
a.nav03:hover {background-image: url(bilder/impressum-ov.png);
   border-bottom: 0px;}

a.nav01, a.nav02, a.nav03 {outline: none;}

/* preload */

div.preload {display: none; width: 0; height: 0; border: 0;}

/* priming bilder */

.picplac {position: absolute; left: 0;}

a#priming50:hover, a#priming146:hover, a#priming147:hover, a#priming148:hover,
a#priming149:hover, a#priming150:hover, a#priming151:hover,
a#priming152:hover, a#priming153:hover, a#priming154:hover,
a#priming155:hover, a#priming156:hover, a#priming157:hover,
a#priming158:hover, a#priming159:hover, a#priming160:hover, a#priming163:hover,
a#priming164:hover, a#priming165:hover, a#priming166:hover,
a#priming167:hover, a#priming168:hover, a#priming184:hover,
a#priming193:hover, a#priming194:hover, a#priming197:hover,
a#priming198:hover, a#priming199:hover, a#priming200:hover,
a#priming201:hover,
a#priming301:hover, a#priming302:hover, a#priming303:hover {border-bottom: 0;}

a#primx01 {display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/performopt.jpg);
   margin-top: 0em;
   text-decoration: none;
   border: 0;}
a#primx01 img#picprimx01 {text-decoration: none;
   border: 0;}
a#primx01:hover img#picprimx01 {opacity: 0; text-decoration: none;
   border: 0;}

a#primx02 {display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/selberklicken.jpg);
   margin-top: 0em;
   text-decoration: none;
   border: 0;}
a#primx02 img#picprimx02 {text-decoration: none;
   border: 0;}
a#primx02:hover img#picprimx02 {opacity: 0; text-decoration: none;
   border: 0;}


#priming50 {display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/klavierstimmerei.jpg);
   margin-top: 0em;}
a#priming50:hover {display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/praegestimmt.jpg);
   margin-top: 0em;}

#priming146 {
   display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/hoergut.jpg);}

#priming147 {
   display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/harmoniepotenzial.jpg);}

#priming148 {
   display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/musikton.jpg);}

#priming149 {
   display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/hybridstimmtechnik.jpg);}
a#priming149:hover {display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/nurklick.jpg);}

#priming150 {
   display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/tutsogut.jpg);
   margin-top: 1em;}

#priming151 {
   display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/klavierstimmerei.jpg);}
a#priming151:hover {display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/praegestimmt.jpg);}

#priming152 {
   display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/hybridpiano.jpg);}
a#priming152:hover {display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/klickhypiano.jpg);}

#priming153 {
   display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/selberstimmen.jpg);}
a#priming153:hover {display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/sestilern.jpg);}

#priming157 {
   display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/praegestimmt.jpg);
   margin-top: -1em;}
a#priming157:hover {display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/klavierstimmerei.jpg);
   margin-top: -1em;}

#priming160 {
   display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/0800prae.jpg);
   margin-top: 0em;}

#priming164 {
   display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/erfolgslust.jpg);}
a#priming164:hover {
   display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/sestilern.jpg);}

#priming165 {
   display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/entspannung.jpg);}

#priming167 {
   display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/nichts.jpg);}

#priming168 {
   display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/wohltemp.jpg);}

#priming200 {
   display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/praegestimmt.jpg);
   margin-top: -1em;}
a#priming200:hover {display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/klavierstimmerei.jpg);
   margin-top: -1em;}

#priming301 {
   display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/flexton.jpg);}

#priming302 {
   display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/jahresstimmung100.jpg);}
   
#priming303 {
   display: block;
   width: 140px;
   height: 288px;
   background-image: url(bilder/stimmungmachtmusik.jpg);}

img#pic1 {margin: 20px 0 0 0;}
img#pic2 {margin: 0 0 0 0;}
img#pic3 {margin: 0 0 0 0;}

/* Seite Startseite */

#startseite ul {list-style: none;}
#frageninhalt {margin-left: 170px;
   padding: 0px 70px 500px 70px;}
#frageninhalt h3 {margin: 0 0px 15px 0; padding: 0;}
#frageninhalt h3 a {padding-top: 20px;}
#frageninhalt h4 {margin: 0px 20px 15px 0;
   padding: 0px;}
#frageninhalt h5 {margin: 15px 0 15px 0;}
#frageninhalt ul {
   font-size: 0.8em;
   margin: 15px 10px 10px 15px;}
#frageninhalt ul li {list-style: circle;}
#frageninhalt li a {  font-size: 1.1em;}
#frageninhalt li a.extern,
#frageninhalt li a.extern2 {  font-size: 1em;}
div#meineantworten {padding-top: 0;}
#meineantworten ol {font-size: 0.8em;
   margin: 10px 20px 0 20px;}
#meineantworten ol a {font-size: 1em;}
#meineantworten p a {font-size: 1em;}
#meineantworten ul li {list-style-type: circle;}
#meineantworten p.p4 {padding: 10px 0 10px 0;}
#meineantworten p.p5 {padding: 0 0 5px 0;}
#meineantworten p.p6 {padding-top: 10px;}

#startseite #kundenfragen ul {margin-left: 20px; margin-bottom: 40px;}
#startseite #kundenfragen ul li {margin-bottom: 8px; list-style: none; /*width: 410px; height: 22px; background-color: #DDD; padding-left: 7px; border: #888 1px solid;*/}
#startseite #kundenfragen ul li a {display: block; width: 410px; height: 22px; background-color: #DDD; padding: 3px 0 0 7px; border: #888 1px solid; 
	-webkit-box-shadow: hsla(210, 100%, 30%, 0.8) 3px 2px 3px;
    -moz-box-shadow: hsla(210, 100%, 30%, 0.8) 3px 2px 3px;
     box-shadow: hsla(210, 100%, 30%, 0.8) 3px 2px 3px;}
#startseite #kundenfragen ul li a:hover {display: block; width: 410px; height: 22px; color: #FFF; background-color: #6799CC; padding: 3px 0 0 7px; border: #1C398A 1px solid; text-decoration: none; 
	-webkit-box-shadow: hsla(230, 100%, 30%, 0.8) 3px 2px 3px;
    -moz-box-shadow: hsla(230, 100%, 30%, 0.8) 3px 2px 3px;
     box-shadow: hsla(230, 100%, 30%, 0.8) 3px 2px 3px;}


#links #kundenfragen ul {margin-left: 20px; margin-bottom: 40px;}
#links #kundenfragen ul li {margin-bottom: 8px; list-style: none;}
#links #kundenfragen ul li a {display: block; width: 525px; height: 22px; background-color: #DDD; padding: 3px 0 0 7px; border: #888 1px solid;
	-webkit-box-shadow: hsla(210, 100%, 30%, 0.8) 3px 2px 3px;
    -moz-box-shadow: hsla(210, 100%, 30%, 0.8) 3px 2px 3px;
     box-shadow: hsla(210, 100%, 30%, 0.8) 3px 2px 3px;}
#links #kundenfragen ul li a:hover {display: block; width: 525px; height: 22px; color: #FFF; background-color: #6799CC; padding: 3px 0 0 7px; border: #1C398A 1px solid; text-decoration: none;
	-webkit-box-shadow: hsla(230, 100%, 30%, 0.8) 3px 2px 3px;
    -moz-box-shadow: hsla(230, 100%, 30%, 0.8) 3px 2px 3px;
     box-shadow: hsla(230, 100%, 30%, 0.8) 3px 2px 3px;}

#meineantworten ul.antw {margin: 0 0 30px 20px;}

#meineantworten ul.weiterliste {margin: 0 0 20px 20px;}

#meineantworten ul.antw li,
#meineantworten ul.weiterliste li {line-height: 1.4em; margin-bottom: 6px; padding-right: 20px; list-style-type: circle;}

#meineantworten ul.weiterliste li {list-style-type: disc;}

#meineantworten h4.weiterleitung {margin-top: 50px;} 

div.videomob {
	padding-top: 56.25%;
	position: relative;
	width: 100%; 
	margin: 20px 0 50px 0; 
	border: 0;}

div.videomob iframe {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	border-radius: 10px 10px 10px 10px;
	-moz-border-radius: 10px 10px 10px 10px;
	-webkit-border-radius: 10px 10px 10px 10px;
	box-shadow: 4px 4px 10px #333;
	-moz-box-shadow:4px 4px 10px #333;
	-webkit-box-shadow:4px 4px 10px #333;
	border: 1px solid #BBB;}

.markrand01 {
	background-color: #225588;
	padding: 2px;
	border: 2px solid #BBB;
	border-radius: 10px 10px 10px 10px;
	-moz-border-radius: 10px 10px 10px 10px;
	-webkit-border-radius: 10px 10px 10px 10px;}

/* Fragen Hörbeispiele */

#startseite #frageninhalt h2#text {position: relative; padding: 0; margin: 35px 0 40px 25px; color: #666; font-size: 1.1em;}
#startseite #frageninhalt h2#text a img#praenamen {border: 0;}
#startseite #frageninhalt h2#text a {position: absolute; top: -29px; left: 362px; border: 0; display: block; width: 128px; background-image: url(bilder/praenamklick.png); border: 0;}
#startseite #frageninhalt h2#text a:hover img#praenamen {border: 0; text-decoration: none; opacity: 0;}

#startseite #meineantworten iframe#zugabe   {position: relative; margin: 30px 0 10px 30px;}

#links #frageninhalt h2#text {position: relative; padding: 0; margin: 35px 0 40px 25px; color: #666; font-size: 1.1em;}
#links #frageninhalt h2#text a img#praenamen {border: 0;}
#links #frageninhalt h2#text a {position: absolute; top: -29px; left: 384px; border: 0; display: block; width: 128px; background-image: url(bilder/praenamklick.png); border: 0;}
#links #frageninhalt h2#text a:hover img#praenamen {border: 0; text-decoration: none; opacity: 0;}

#startseite #meineantworten h3,
#links #meineantworten h3 {padding-top: 20px;}

/* Netzwerke */

div#netzwerk {position: absolute;
   width: 140px;
   height: 300px;
   top: 225px;
   right: 15px;}


div#netzwerk div#primateq {position: absolute;
   top: 10px;
   left: 0;
   width: 122px;
   height: 207px;}

div#netzwerk div#primateq a#aufeins {
   display: block;
   width: 122px;
   height: 207px;
   border: 0;
   text-decoration: none;}

div#netzwerk div#primateq a#aufeins img#startprima {
   display: block;
   width: 122px;
   height: 207px;
   border: 0;
   text-decoration: none;}

div#netzwerk div#primateq a#aufeins:hover {
   display: block;
   width: 122px;
   height: 207px;
   background-image: url(bilder/primajetzt.jpg);
   border: 0;
   text-decoration: none;}

div#netzwerk div#primateq a#aufeins:hover img#startprima {
   display: block;
   width: 122px;
   height: 207px;
   opacity: 0;
   border: 0;
   text-decoration: none;}


div#netzwerk a#rahmen {
   display: block;
   width: 116px;
   height: 50px;
   position: absolute;
   top: 300px;
   left: 3px;
   border: 0;
   text-decoration: none;}

div#netzwerk a#rahmen img#starttwitter {
   display: block;
   width: 116px;
   height: 50px;
   border: 0;
   text-decoration: none;}

div#netzwerk a#rahmen:hover {
   display: block;
   width: 116px;
   height: 50px;
   position: absolute;
   top: 300px;
   left: 3px;
   background-image: url(bilder/praefollow.jpg);
   border: 0;
   text-decoration: none;}

div#netzwerk a#rahmen:hover img#starttwitter {
   display: block;
   width: 116px;
   height: 50px;
   position: absolute;
   top: 300px;
   left: 3px;
   opacity: 0;
   border: 0;
   text-decoration: none;}

/* 311  */

div#netzwerk a#aura {position: absolute;
  top: 235px;
  left: 3px;
  width: 116px;
  height: 50px;
  border: 0;
  text-decoration: none;}

div#netzwerk a#aura img#startblog {
  width: 116px;
  height: 50px;
  border: 0;
  text-decoration: none;}

div#netzwerk a#aura:hover {position: absolute;
  top: 235px;
  left: 3px;
  width: 116px;
  height: 50px;
  background-image: url(bilder/blogadd.jpg);
  background-repeat: no-repeat;
  border: 0;
  text-decoration: none;}

div#netzwerk a#aura:hover img#startblog {position: absolute;
  top: 235px;
  left: 3px;
  width: 116px;
  height: 50px;
  opacity: 0;
  border: 0;
  text-decoration: none;}



/* Player-Hintergrund-Bilder und Beschriftungen für Hoerbeispiele 100514 */

a.player {
	position: relative;
	display: block;
   	width: 700px;
   	height: 135px;
   	margin-left: 0px; 
   	margin-bottom: 20px;
   border: #003388 1px solid;
   	-webkit-box-shadow: hsla(580, 100%, 30%, 0.8) 10px 5px 20px;
   	-moz-box-shadow: hsla(580, 100%, 30%, 0.8) 10px 5px 20px;
   	 box-shadow: hsla(580, 100%, 30%, 0.8) 10px 5px 20px;
   	 -webkit-border-radius: 15px;
   	 -moz-border-radius: 15px;
     border-radius: 15px;}

a.player:hover {-webkit-box-shadow: hsla(580, 100%, 30%, 0.8) 10px 5px 50px;
   	-moz-box-shadow: hsla(580, 100%, 30%, 0.8) 10px 5px 50px;
   	 box-shadow: hsla(580, 100%, 30%, 0.8) 10px 5px 50px;
   	border: #6699CC 1px solid;
   	 text-decoration: none;}

a.bgeins {background-image: url(bilder/playerbg-eins.jpg); }
a.bgzwei {background-image: url(bilder/playerbg-zwei.jpg);}
a.bgdrei {background-image: url(bilder/playerbg-drei.jpg);}
a.bgvier {background-image: url(bilder/playerbg-vier.jpg);}
a.bgfuenf {background-image: url(bilder/playerbg-fuenf.jpg);}
a.bgsechs {background-image: url(bilder/playerbg-sechs.jpg);}
a.bgsieben {background-image: url(bilder/playerbg-sieben.jpg);}
a.bgacht {background-image: url(bilder/playerbg-acht.jpg);}

a.player span.kurztext {font-size: 2.4em; color: #333; position: absolute; left: 40%; top: 25px; min-width: 300px;}
a.player span.langtext {font-size: 2.0em; color: #333; position: absolute; left: 30%; top: 25px; min-width: 350px;}

a.player:hover span.kurztext {opacity: 0.5;}
a.player:hover span.langtext {opacity: 0.5;}

#startseite div.hbspe {margin: 30px 0 40px 0;}


/*Impressum */

#impressuminhalt {
   width: auto;
   margin-left: 240px;
   padding: 36px 70px 100px 0;
   overflow: hidden;}

h2 {margin-bottom: 20px; font-size: 1.1em;}

#block-4 {width: auto;
   float: left;}
#block-5 {width: auto;
   float: left;
   margin-left: 105px;
   margin-bottom: 20px;}
#impressuminhalt #block-5 p.p1 a.extern,
#impressuminhalt a.extern {font-size: 1em;}

#impressuminhalt p.px {padding-bottom: 10px;
   margin-top: 20px;}
#impressuminhalt p.p3 {padding-bottom: 40px;}
#impressuminhalt #spez {padding: 0 3px;}
#impressuminhalt p.p3 span.register {position: relative;
   top: -3px;
   padding-left: 2px;}

#links div#frageninhalt p a.extern {font-size: 1em;}
#links div#frageninhalt p a.intern {font-size: 0.8em;}

#impressuminhalt p.mobil {margin: 30px 0 20px 0;}