/* --- Main-CSS für www.speglitz.ch - Redesign Sommer 2006 --- */
/* --- made by SUTANET Webpublishing - www.sutanet.ch --- */
/* ... Farben:
background: #FFFFFF
background-inhalt: #......
font: #...... = 

navigation-link: #...... = 
navigation-link-hier: #...... = 
navigation-link-hover: #...... = 

textlink: #...... = 
textlink-hier: #...... = 
textlink:hover: #...... = 

content img-border: #...... = 
table#referenzen: #...... = 
*/
/* --- Allgemeines --- */

html, body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	background-color: #FFF;
	margin: 0px;
	padding: 0px;
/*	background-color: #611D1D;*/
/*	background-color: #EAEAEA;*/
	background-color: #ECE8EC;
}
body {
	padding: 20px 0 20px 0;
	text-align: center;
}
#all {
	background-color: #FEF7F7;
/*	border: 1px solid #333333;*/
	border: 1px solid #999999;
	text-align: left;
	width: 800px;
	margin: 0 auto 0 auto;
}
/* --- Inhalt --- */
#content {
	background: url(../bilder/layout_bilder/hg-noten-unten.jpg) no-repeat left top;
	background-color: #FEF7F7;
	position: relative;
	margin-top: -20px;
	padding: 30px 10px 20px 20px;
	font-size: 11px;
	width: 770px;
	min-height: 300px;
	height: auto;
	color: #330000;
}
/* --- dieser Stil ist für MAC IE5 --- */
#content-home {
	padding-top: 20px;
	position: absolute;
/*	margin-left: 200px;*/
	width: 550px;
}
/* --- @media screen versteckt diesen Stil vor alten IE-Versionen, z.B. MAC IE5 --- */
@media screen {
#content-home {
	padding-top: 20px;
	position: relative;
	margin-left: 200px;
	width: 550px;
}
}
/* --- dieser Stil ist für MAC IE5 --- */
#content-allgemein {
	padding-top: 0px;
	position: relative;
	margin-left: 0px;
	padding-left: 250px;
	width: 550px;
}
/* --- @media screen versteckt diesen Stil vor alten IE-Versionen, z.B. MAC IE5 --- */
@media screen {
#content-allgemein {
	padding-top: 0px;
	position: relative;
	margin-left: 200px;
	width: 550px;
	padding-left: 0px;
}
}
#content-allgemein a:hover {
	color: #CCCCCC;
}
#content-left {
	width: 180px;
	float: left;
}
/* --- Navigation --- */
/* --- dieser Stil ist für MAC IE5 --- */
#navcontainer {
	position: relative;
	top: 0px;
	height: 65px;
	background:url(../bilder/layout_bilder/hgnavoben.gif) repeat-x;
}
/* --- @media screen versteckt diesen Stil vor alten IE-Versionen, z.B. MAC IE5 --- */
@media screen {
#navcontainer {
	position: relative;
	top: -5px;
	height: 60px;
	background:url(../bilder/layout_bilder/hgnavoben.gif) repeat-x;
}
}
#navbottom {
	background: url(../bilder/layout_bilder/navigation_unten_links.gif) repeat-x;
	margin-left: -20px;
	padding-top: 5px;
	top: 0;
	height: 51px;
}
/* --- dieser Stil ist für MAC IE5 --- */
#navlisttop,
#navlistbot { 
	margin: 0px;
	padding: 0 0 0 20px;
	height: 30px;
}
#navlisttop li,
#navlistbot li {
	display: inline;
	float: left;
	padding: 0px;
	margin-top: 8px;
	height: 30px;
	width: 1px;
	list-style: none;
	border-left: 1px solid #FFF;
}
/* --- @media screen versteckt diesen Stil vor alten IE-Versionen, z.B. MAC IE5 --- */
@media screen {
#navlisttop,
#navlistbot  {
	margin: 0px;
	padding: 0 0 0 20px;
	height: 30px;
}
#navlisttop li,
#navlistbot li {
	display: inline;
	float: left;
	padding: 0px;
	margin-top: 8px;
	height: 30px;
	width: auto;
	list-style: none;
	border-left: 1px solid #FFF;
}
}
/* --- dieser Stil ist für MAC IE5 --- */
#navcontainer #navlisttop li.subnavlist{ /* - Nav oben - */
	margin: -5px 0 -15px -28px;
	padding: 0;
	border-left: 0;
	clear: both;
}
#navbottom #navlistbot li.subnavlist { /* - Nav unten - */
	margin: -5px 0 -15px -23px;
	padding: 0;
	border-left: 0;
	clear: both;
}
/* --- @media screen versteckt diesen Stil vor alten IE-Versionen, z.B. MAC IE5 --- */
@media screen {
#navcontainer #navlisttop li.subnavlist, #navbottom #navlistbot li.subnavlist  {
	margin: -5px 0 -15px -40px;
	padding: 0;
	border-left: 0;
	clear: both;
}
}
#navbottom #navlistbot li.sprache {
	border-left: 0;
} 
#navbottom #navlistbot li.de {
	border-left: 0;
	border-right: 1px solid #FFF;
	padding-left: 50px;
} 
/* --- dieser Stil ist für MAC IE5 --- */
#navlisttop a,
#navlistbot a,
#navlisttop li a:link, #navlisttop li a:visited,
#navlistbot li a:link, #navlistbot li a:visited {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px; 
	color: #F2F4F4;
	text-decoration: none;
	display: block;
	padding: 0 40px 0 5px;
	margin: 0px;
	height: 20px;
	float: left;
}
/* --- @media screen versteckt diesen Stil vor alten IE-Versionen, z.B. MAC IE5 --- */
@media screen {
#navlisttop li a:link,
#navlisttop li a:visited,
#navlistbot li a:link,
#navlistbot li a:visited {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #F2F4F4;
	font-weight: bold;
	text-decoration: none;
	display: block;
	padding: 0 40px 0 5px;
	margin: 0px;
	height: 20px;
	float: left;
}
}
#navbottom #navlistbot li a.deutsch,
#navbottom #navlistbot li a.franz {
	padding-right: 5px;
	display: none;
}
#navbottom #navlistbot li.sprache {
	display: none;
}
body#home.deu #navbottom #navlistbot li.sprache,
body#home.fran #navbottom #navlistbot li.sprache {
	display: block;
}
body#home.deu #navbottom #navlistbot li a.deutsch, 
body#home.deu #navbottom #navlistbot li a.franz,
body#home.fran #navbottom #navlistbot li a.deutsch,
body#home.fran #navbottom #navlistbot li a.franz {
	padding-right: 5px;
	display: block;
}
body#home.deu #navbottom #navlistbot li a.deutsch,
body#home.fran #navbottom #navlistbot li a.franz {
	color: #660033;
}
#navlisttop li a:hover,
#navlisttop li a:active,
#navlistbot li a:hover,
#navlistbot li a:active {
	color: #660033;
	text-decoration: none;
	text-align: left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
}
#home #navlisttop a.home,
#adress #navlisttop a.adress,
#curr #navlisttop a.curr,
#bilder #navlisttop a.bilder,
#engag #navlisttop a.engag,
#repertoire #navlisttop a.repertoire,
#unterricht #navlisttop a.unterricht,
#galerie #navlisttop a.galerie,
#impro #navlisttop a.impro,

#cd #navlistbot a.cd,
#sitemap #navlistbot a.sitemap,
#suchen #navlistbot a.suchen,
#denken #navlistbot a.denken,
#best #navlistbot a.best,
#kontakt #navlistbot a.kontakt {
	color: #fff;
	font-weight: normal;
 	text-transform: uppercase;
	text-decoration: none;
}
/* --- Ende Navigation --- */
/* --- allgemeine Textformatierungen --- */
h1 {
	font-size: 14px;
	font-weight: bold;
}
h2 {
	font-size: 12px;
	font-weight: normal;
}
p.left {
	font-weight: normal;
	font-size: 9px;
}
.subtext {
	margin-bottom: 20px;
}
.hoch {
	vertical-align: super;
	font-size: xx-small;
}
.bild { /* --- für MAC IE --- */
	border: 1px solid #999;
	margin-right: 20px;
	margin-top: 20px;
	padding: 3px;
}
@media screen {
.bild {
	float: left;
	border: 1px solid #999;
	margin-right: 20px;
	margin-top: 20px;
	padding: 3px;
}
}
.textlink {
	color: #333333;
}
.textlink:hover {
	color: #666666;
}
.textlink:visited {
	color: #CC3333;
}
#stunde {
	width: 400px;
	float: left;
	margin-right: 50px;
}
.spalte1 {
	width: 360px;
	float: left;
	margin-right: 30px;
}
.spalte2 {
	width: 360px;
	float: left;
}
.spalte-nein {
	clear: both;
}
.spalte-nein img {
	margin-right: 5px;
}
.abstand {
	margin-bottom: 20px;
}
.fusszeile {
	font-size: 9px;
}
/* --- Ende allgemeine Textformatierungen --- */
/* --- Listenformatierung --- */

/* --- dieser Stil ist für MAC IE5 --- */
ul#music {
	list-style-type: disc;
	list-style-position: outside;
	margin-left: -15px;
	width: 480px;
}
ul#music li ul li {
	list-style-type: circle;
	margin-left: 10px;
}
/* --- @media screen versteckt diesen Stil vor alten IE-Versionen, z.B. MAC IE5 --- */
@media screen {
ul#music {
	list-style-type: disc;
	list-style-position: outside;
	margin-left: -22px;
	width: auto;
}
ul#music li ul {
	list-style-type: circle;
	margin-left: -20px;
}
.adressliste, .engagliste, .repliste {
	list-style-type: disc;
	list-style-position: outside;
	margin-left: -28px;
}
}
/* --- Ende Listenformatierung --- */
/* --- Memory --- */
#memory tr, #memory td {
	border: 0px;
}
#memory img {
	border: 1px solid #666666;
}
.memory {
	padding-left: 5px;
}
/* --- Ende Memory --- */
/* ---  Bestenliste --- */
#bestenliste {
	margin-bottom: 20px;
	background-color: #E9E9E9;
}
#bestenliste th {
/*	border-bottom: 1px solid #666666;
	border-right: 1px solid #666666;
*/	padding-left: 5px;
	background-color: #DADADA;
}
#bestenliste th{
	width: 100px;
}
#bestenliste td{
/*	border-right: 1px solid #666666;
*/	padding-left: 5px;
}
/* --- Ende Bestenliste --- */
/* --- Fusszeile + alles was drin ist --- */
#footer {
	height: auto;
	font-size: 9px;
	padding: 0 0 10px 20px;
	background-color: #FEF7F7;
	position: relative;
	clear: both; /* --- für overflow in Bilderseite... --- */
}
.count {
	position: absolute;
	right: 20px;
}
#footer a {
	text-decoration: none;
	color: #666666;
}
#footer a:hover {
	color: #660033;
	text-decoration: underline;
}


/* --- Bildergalerie --- */
#manual {
	position: absolute;
	left: 20px;
	width: 200px;
	border: 1px solid #999;
	padding: 2px;
	margin: 10px 0 0 10px;
}
ul#gallery-right {
	width: 290px;
	padding: 0 0 10px 10px;
	margin-left: 450px;
	margin-top: 0;
	margin-bottom: 100px;
	list-style:none;
}
#gallery-right li {
	margin-bottom: 5px;
	width:83px;
	background-position:center center;
	background-repeat:no-repeat;
}
.pic {
	border: 1px solid #999;
	padding: 3px;
	text-align:  center;
}
#gallery-right a {
	display:block;
	height:83px;
	z-index: 1;
}
#gallery-right a img {
	position:absolute;
	top:30px;
	left:20px;
	width:0px;
	border: 0;
	z-index: 1;
}
* html ul#gallery-right a:hover {
	display:block;
	height:83px;
	border: 0;
}
* html ul#gallery-right a:active {
	display:block;
	height:83px;
	border: 0;
}
#gallery-right a:hover img {
	width: auto;
	border: 1px solid #999;
	padding: 5px;
	z-index: 1;
}
#gallery-right a:active img {
	width: auto;
	border: 1px solid #999;
	padding: 5px;
	z-index: 100;
}
#gallery-right a:focus img {
	width: auto;
	border: 1px solid #999;
	padding: 5px;
	z-index: 1;
}
/* --- Ende Bildergalerie --- */
/* --- Druckanweisungen --- */
.print {
	display: none;
}