/* Stylesheet fuer www.die-klarinette.de und www.the-clarinet.info */
/* Generelle Einstellungen */

	body {
		font-family: arial, helvetica, sans-serif;
		font-style: normal;
		font-weight:normal;
		font-size: 0.9em;
		margin: 0;
		background-color: #FAF9ED;
    	padding-left: 210px;
		}

	.fixed-area {			/* left fixed part, contains menu (there is a fix for ie<7 in the html-file, too */
		width: 200px;
		height: 100%;
		position: absolute; 	/* fuer alte Browser, fixiert fuer neue (siehe unten) */
		top:  0;
		left: 0;
		margin: 0;
		padding: 0;
		}
		
	html>body .fixed-area { 	/* fixed for modern browsers, old ones see: absolute + css in HTML */
		position: fixed;
		}
		
	.scroll {		 	/* this is defined in detail in a ie<7-specific css in HTML */
		}			/* used to force a scroll-bar (would not be necessary with compliant browsers */
	
	.zentriert {			/* centers all content within this div (and contains .content, which left-aligns text again) */
		margin : 0 auto 0 auto;	/* this does it for compliant browsers */
		text-align : center;	/* this does it for non-compliant browsers (<IE7) */
		width: 755px;		
		}

	.header {
		margin: 0;
		padding-top: 12px;
		padding-left: 60px;
		height: 25px;
		text-align: left;
		background: url(images/dk-pagetop4.png);  
		background-repeat: no-repeat;
		}

	.header_home {
		margin: 0;
		padding-top: 12px;
		padding-left: 40px;
		height: 70px;
		text-align: left;
		background: url(images/dk-pagetop3.png);
		background-repeat: no-repeat;
		}

	.content {              	/* white box with contents */
		margin: 0;
		margin-top: -14px;
		padding-top: 60px;
		padding-right: 60px;
		padding-bottom: 0px;
		padding-left: 60px;
		background-color: #FCFCF8;
		border-right: 1px solid #CCCCCC;
		border-left: 1px solid #EFEFEF; 
		text-align: left;	/* sets the text-align: left; from body */
		}

	.footer {
		margin: 0;
		padding: 0;
		height: 80px;
		background: url(images/page_bottom2.png);
		background-repeat: no-repeat;
		}
	
/* Styles aus HTML */

	h1, h2, h3, h4, ul, ol, li, p, div, th, address, blockquote, nobr, b, i {
		margin-top: 0.5em;
		margin-bottom: 0em;
		color: #444444;
		font-weight: normal;
		}

	h1, h2, h3, h4 {
    margin-top: 1em;
    font-family: Georgia,"Times New Roman",Times,serif;
		}

	h1 {
		font-size: 2em;
		line-height:120%;
		}
		
	h2 {
		font-size: 1.8em;
		}

	h3 {
		font-size: 1.6em;
    font-style:italic;
		}

	h4 {
		font-size: 1.4em;
		color: #990000;
		}

	ul, ol, dl {
		display: block;
		margin-top: 15px;
		margin-bottom: 0;
		}

	th {
		font-size: em;
		}

	tt {
  	font-family: "Courier New", Courier;
		font-size: 10pt;
		}

	p {
		margin-bottom: 0;
		padding-top: 0.6em;
		padding-bottom: 0.2em;
		line-height:1.4em;
		}

	img, faq-q.img {
		float: left;
 		margin-right: 20px;
		margin-top: 10px;
		margin-bottom: 10px;
		}

	blockquote {
    font-style:italic;
    }
		
	hr {
	    height: 0px;
	    border: 0px;
  		border-bottom: 1px dotted gray;
    }	
		
	td {
		vertical-align: top;
		}

	a  {
  		text-decoration: none;
  		color: darkblue;
  		outline: none;
  		border-bottom: 1px dotted gray;
		}

	a:link {
		}

	a:visited {
		}

	a:active {
		color: #990000;
		}

	a:hover {
		color: #990000;
		}

/* Geschachtelte Styles */


	table {		
		border-collapse:collapse;		
		border-color: grey;
		border: 1px dotted;
	}


	table tr td  {
		padding: 0.5em;
		background-color: white;
	}

	a img {
		float: left;
		margin: 0;
		margin-right: 10px;
 		border-bottom: none;
		}

	p img {
		float: none;
		margin: 0;
		margin-right: 10px;
		}
		
	dl.bildbox dt img{
		float: none;
		margin: 0;
	}


/* Klassen und geschachtelte Styles mit Klasse */

	.domaene {
		height: 64px;
		width: 100%;
		margin: 0px;
		padding-top: 18px;
		text-align: center;
		font-size: 14pt;
		color: DimGrey;
		background: url(images/menu-logo.png);
	}
		
	.domaene_home {
		height: 64px;
		width: 100%;
		margin: 0px;
		padding-top: 18px;
		text-align: center;
		font-size: 14pt;
		color: DimGrey;
		background: url(images/menu.png);
	}


	.suchfeld {
		height: 22px;
		width: 168px;
		margin: 0;
		padding-left:38px;
		padding-top: 5px;
		background: url(images/suchfeld2.png);
		background-repeat: no-repeat;
	}

	#menu {
		width: 200px;
		height: 93%;      /* makes the scroll bar appear when the window is not high enougth for the menu */
		display: block;
		margin: 0;
		padding: 0;
		padding-top: 1px;
		font-size: 0.9em;
		background: url(images/menu.png);
		overflow: auto;
	}

	#menu dl dd a {
 		text-decoration: none;
		display: block;
		margin-left: -40px;
		padding-left: 40px;
 		border-bottom: none;
		}

	#menu dl dd a:hover {       	/* IE6 can only do hover for a href, correct browsers see below */
 		text-decoration: none;
		display: block;
		margin: 0;
		padding: 0;
		margin-left: -40px;
		padding-left: 40px;
		background: url(images/menu-liste-hov.png);
		background-repeat: none;
		}

	html>body #menu dl dd:hover a { 
 		text-decoration: none;
		display: block;
		margin: 0;
		padding: 0;
		margin-left: -40px;
		padding-left: 40px;
		color: black; 
		background: url(images/menu-liste-hov.png);
		background-repeat: none;
		}
		
	#menu-active {
 		text-decoration: none;
		margin: 0;
		padding: 0;
		margin-left: -40px;
		padding-left: 40px;
		color: black;
		display: block;
		background: url(images/menu-liste-act.png);
		background-repeat: none;
		}
		
	.input {
		font-size: 9pt;
		height: 16px;
		margin-left: 0;
		margin-top: 0;
		padding: 0;
		background-color: transparent;
		border-style: none;
		}

	.adsense {
		margin: 0;
		margin-bottom: 10px;
		padding: 0;
		text-align: center;
		}

	.idx-box {
		margin-top:15px;
		margin-bottom: 10px;
		padding: 15px;
		border-top: 1px dotted;
		border-right: 1px dotted;
		border-bottom: 1px dotted;
		border-left: none;
		}

	.idx-box a {
		margin-left:12px;
		}

	.idx-box dd a {
		margin-left:0px;
		}


	.idx-box h3 {
		margin-top:0;
		}

	/* Bildbeschriftung per Definitionsliste */
	dl.bildbox {
	   float: left; /* ohne width => so breit wie das Bild */ 
	   text-align: center;
	   background-color: white;
	   padding: 0.5em;
	   border: 1px solid;
     border-color: #aaa;
	   margin: 1em 1em 1em 0; /* Abstand zum Text */}
	
	dl.bildbox dd {
	   font-size: 90%;
	   margin: 0;
	}


	.lang-switch a img {
		margin-top: 20px;
		margin-bottom: 10px;
		margin-left: 595px;
		float: none;
		}

	.qnq {
		text-align: center;
		}

		
	.lit {
		border-bottom: 1pt solid #666;
		}

	.lit-text {
		margin-left: 110px;
		}

	.clearing {
		clear: both;
		}

	.links	{
		float: left;
		width: 10em;
		min-width: 140px;
		margin-bottom: 2em;
		}

	.mittig	{
		text-align: center;
		}
		
	.rechts	{
		float: right;
		width: 10em;
		min-width: 140px;
		margin-bottom: 2em;
		}
		
	.popup {
		padding: 10px;
		font-family: Arial,Verdana,Helvetica,sans-serif;
		font-size: 10pt;
		}

	.faq-q {
		width: 650px;
		margin: 1em 0em 2em;
		background: #EEEEEE;
		}

	.faq-q p {
		font-size: 90%;
		padding-top: 0.5em 1em 1em 1em;
		margin: 1em;
		}

	.faq-symbol {
		float: left;
		font-size: 150%;
		width: 1.2em;
		text-align: center;
		padding: 0.1em 0.1em 0;
		background: darkblue;
		color: white;
		border: solid white 1px;
		border-width: 0 0.2em 0.2em 0;
		margin: 0 0.5em 0.2em 0;
		}

	.back-top {
		font-family: Arial,helvetica,sans-serif;
		font-size: 10pt;
		font-weight: normal;
		margin-top: -15px;
		margin-left: 90%;
		margin-bottom: 1em;
		}

	.marker {
		background-color: Yellow;
		}

	.libri, .libri a:link, .libri a:hover, .libri a:visited {
		color: White;
		background-color: #000066;
		text-decoration: none;
		font-size: 8pt;
		font-stretch:narrower;
		}

	.line-icon {
		margin-top: 0px;
		}

 	.tab-1cm {
		margin: 16px 1px 16px 1cm;
		}


	.winzig {
  		font-family: Arial, Helvetica,sans-serif;
		font-size: 9pt;
		}