﻿/* ############################################################################
Haupt-Stylesheet für die Website des VideoFilm Club Nürnberg 50plus e.V.
Website  :  www.vcn50plus.de
Erstellt :  4.8.2006
Autor    :  Kurt Henneberger
Copyright:  © 2006-2018 bei vcn50plus
Vers_Stand : 5.11.2009 / 1.11.2018
zuletzt validiert bei w3c am 20.10.2009

  Hier definierte Stile werden mögliicherweise von speziellen Stylesheets erweitert oder überschrieben

Eingebundene bzw. weitere Stylesheets können sein :
  ie.css
  druck.css
  vcnflyer.css
  
  +++ Inhalt Reihenfolge +++
  +++ universal Selektor Asterix 
  +++ Bereiche, Container, Ebenen, Sectionen 
  +++ Begrenzungslinien
  +++ Absätze - Listen - Texte - Schriften 
  +++ Text Hervorhebungen
  +++ Überschriften
  +++ Aussenabstand margin
  +++ Zeilenhöhen 
  +++ Tabelle zu termin.htm
  +++ Linkstile allgemein  
  +++ Bilderstile  und Anordnung 
  +++ neu hinzu ab 20_10_2009 
############################################################################## */

/* Druck Stylesheet */
/*    @import url('druck.css') all; */
/* Extrawurst für Internet Explorer */
/*    @import url('ie.css') all;    */

/* =========== CSS-Hacks für Internet Explorer und Firefox  ================ */
	/* Rahmen für h2-Überschriften anpassen
		  * html h2 { zoom: 1; }   	*/

* html .seitenleiste { display: inline; }  /* verdoppelte Außenabstände  reparieren */
html {height: 100%;}         /* für Fehlerkorrektur von Hintergrund-Bildern im Firefox */
.clear {min-height:1px;}     /* für IE5 6 7 */
* html .clear{height: 1px;}  /* für IE5 6 7 */

/* ############################################################################## */
/* ================= Stilgruppierung erfolgt nach Funktion und dann Selektortyp =============  */

/* +++++++++++++ universal Selektor Asterix  +++++++++++++ */
* {
	border-style: none;
	border-color: inherit;
	border: 0;
	margin: 0;
	padding: 0;
	text-align: justify;
	}

/* +++++++++++++ Bereiche, Container, Ebenen, Sectionen  +++++++++++++ */
body {
	margin: 0;
	padding: 0;
	background: #c0b9c6;      
	/* #CCCCFF #c0b9c6 oder #c0c0c0 #6f6285 url(../images/hintergrund_seite840.jpg ) repeat-y center top; */
	font-family: Arial, Helvetica, Sans-Serif;
	font-size: medium;
}
	/* mit Hintergrundbild,   background-color : #9797b0; background-color : #6f6285;   #E6E6E6 */
	/*für IE5 da float:auto nicht wirkt  */
 	/* ===kuhe erl===   max-width: 1200px; 	min-width: 800px;  min-height:600px;   */

/*  +++ Container ebene0 zentriert die Seite im Browserfenster und bestimmt das Websitefenster +++ */
#ebene0 {
	width: 900px;  /* 900px */
	height:   auto;
	  /* min-height:768px;          === 768px oder 100%=== */
	margin-top: 10px;
	margin-right: auto;        /* Browser ermittelt autom. die Seitenabstände */
	margin-left: auto;
	border-right: 1px solid gray;
	border-left: 1px solid gray;
	border-bottom: 5px solid gray;
	border-top: 1px solid gray;
	background-color: #c6bdce;    /*    #c6bdce = zentr, #6f6285 =ebene0,  #C0C0aa =Schatteneffekt links, rechts  */
	text-align: left;
	}  /* ===kuhe erl=== */

/* +++ Container für VCN-Logo horizontal +++ */
#head {
	position : relative;
	top: 0px;
	left: 0px;
	width : 100%;   /* war 780px */
	margin-top: 0;
	margin-right: auto; /* Browser ermittelt autom. die Seitenabstände */
	margin-left: auto;
	border-style: none;
	border-color: inherit;
	border-width: 0;
	padding: 0px;
	background-color : #6f6285;    /*  #9797b0 */
	text-align : center;
} /* ===kuhe erl=== */

/* +++ Container für VCN-Logo vertikal +++ */
#headvertikal {
	margin-top : 0px;
	margin-left:auto;
	padding-top : 0px;
	border : 0;
	background-color : #9797b0;
	float:right;
	}   /* ===kuhe erl=== */

.vertlogo {
	margin: 5px 5px 5px 5px;
}  /* ===kuhe erl=== */

/* +++ Container für obere Navigationszeile +++ */
#navhead {
	position : relative;
	top : 0px;
	left : 0px;
	width : 100%; /* 780px  kuhe erl=== */;
	margin-top : 0px;
	margin-bottom : 0px;
	margin-right: auto; /* Browser ermittelt autom. die Seitenabstände */;
	margin-left: auto;
	border-top : 2px solid #FFCC00;    /*border-color: #FFCC00; */
	border-bottom : 2px solid #FFCC00;
	padding-top : 3px;
	padding-left : 0px;
	padding-right: 0px;
	padding-bottom : 3px;
	background-color : #6f6285;
	text-align : center;
	white-space : normal;
	color: #ffffaa;
}    /* ===kuhe erl=== */

/* +++  Container zur Aufnahme von  ebene1 und ebene2   wird nicht gebraucht  in index.htm +++ */
#zentr {
	position : relative;
	top : 0px;
	left : 0px;
	width : 80%; /* % von ebene0  */;
	margin-right: auto; /* Browser ermittelt autom. die Seitenabstände */;
	margin-left: auto;
	border : 0px solid #ff0000;
	background-color : #c6bdce;
	text-align : center;
	}     /* ===kuhe erl  === */

/* +++ Container fuer Berichte ohne Seitenleiste, zentriert +++  */
#zentrbericht {
	position : relative;
	top : 0px;
	left : 0px;
	width : 100%;
	 /*  height : 100%;  */
	z-index : 5;
	margin-right:auto;            /* Browser ermittelt autom. die Seitenabstände */;
	margin-left:auto;
	border : 0 solid #ff0000;
	background-color : #FFFFF1; /* bisher #c6bdce  neu ab2018  #FFFFF1 */
	text-align : left;
			}


/* +++  Container ebene1, Gesamtbreite 148px, linke Seite mit Navigations-Menue  +++ */
#ebene1 {
	position : relative; /* war absolute;*/;
	top : 0px;
	left : 0px;
	width : 140px;
	height : 600px; /* 27.7.08 von 452 auf 480  gesetzt */;
	z-index : 1;
	margin : 0;
	border : 0px solid #ff0000;
	padding : 6px;
	background-color : #6f6285;
	visibility : visible;
	float: left; }


/* +++ Elemente im Container #ebene1   +++ */
#bild1 {

	/*height : 130px;   width : 136px;  */
	margin-left : 0px;
	border : 0 solid #ff0000;
	padding-left : 4px ;
	background-color : inherit;
	visibility : visible;
	}

#ebene1 ul {
	margin : 0;
	border : 0 solid #ff0000;
	padding-left : 4px;
	text-align : left;
	list-style-type : none;
	}



/* +++ Container ebene2,  Hauptinhaltsbereich der Seiten  +++  */
   		/* position: absolute; relative; fixed; static; inherit */
   		/* vertical-align : baseline; visibility : visible;     */
   		/* Reihenfolge bei  margin oder padding : top right bottom left     */

#ebene2 {
	position : relative;   /* war absolute;*/
	top : 0px;
	left : 0px;
	width : 744px;
	height : 600px;    /* 27.7.08 von 452 auf 480  gesetzt */
	z-index : 2;
	margin-left: 0px;
	padding: 10px 0px 0px 0px;
	border-bottom : solid 1px gray;
	background-color : #c6bdce; background-position: center 0;
	text-indent : 0;
	overflow : auto;
	float:right;
	}

/* +++ Container ebene3 Bildebene rechts, inherit   +++ */

#ebene3 {
	position : absolute;
	top : 0;
	left : 148px;
	width : 614px;
	height : 420px;
	z-index : 3;
	background-color : #c6bdce;
	background-position: center 0; border : solid 0 #ff0000;
	text-indent : 0; vertical-align : baseline; visibility : visible;
	overflow : auto; margin: 0; padding: 10px 4px 0; }

/* +++ Container ebene3b zu schmalfilm.htm ,Bild rechts +++ */

#ebene3b {
position : absolute;
top : 70px;
left : 320px;
width : 305px;
height : 210px;
z-index : 5;
background-color : #c0b9c6;
margin : 0 0 0 0;
padding : 0;
float : left;
text-indent : 0;
visibility : visible;
}

#ebene3c {
position : absolute;
top : 80px;
left : 260px;
width : 320px;
height : 240px;
z-index : 6;
background-color : #c6bdce;
margin : 0 0 0 0;
padding-top : 0;
padding-bottom : 0;
padding-right : 0;
padding-left : 0;
float : right;
text-indent : 0;
visibility : visible;
}

/* +++ Container zu aktuelles.htm +++ Bild rechts  style="left: 310px; top: 50px; width: 300px; height: 200px" +++ */


#ebene4 {
position : relative;
top : 25px;
left : 148px;
width : 606px;
height : 420px;
z-index : 4;
background-color : #c0b99f;
margin-top : 0;
margin-bottom : 0;
margin-right : 0;
margin-left : 0;
border : 4px solid #efeff7;
padding-top : 10px;
padding-bottom : 0;
padding-right : 0;
padding-left : 0;
text-indent : 0;
visibility : visible;
overflow : auto;
}

/* +++ Container als  Textebene links +++  */

#ebene4a {
position : relative;
top : 5px;
left : 0px;
width : 545px;
/*height : 210px;  #c0b9c6 */
z-index : 6;
background-color : #c0b9c6;
margin : 0 0 0 0;
padding : 0;
text-indent : 0;
visibility : visible;
}

/* +++ Container als  Bildebene rechts +++  */
#ebene4b {
position : relative;
top : 0px;
left : -30px;
width : 250px;
  /*   height : 600px;   #c0b9c6 */
background-color :transparent ;    /*transparent ;*/
margin : 0px;
padding : 0px;
text-indent : 0;
visibility : visible ;
float : right;
}

.bild {
float : right;
margin-top : 5px;
margin-bottom : 3px;
margin-right : 0;
margin-left : 3px;
}


/* +++ Container zu suchefinde.htm ohne Navigationsebenen +++  */
#ebene5 {
position : absolute;
top : 0;
left : 100px;
width : 570px;
height : 320px;
z-index : 2;
background-color : #c6bdce;
margin-top : 0;
margin-bottom : 0;
margin-right : 0;
margin-left : 0;
border : 0 solid #ff0000;
padding-top : 10px;
padding-bottom : 0;
padding-right : 4px;
padding-left : 4px;
text-indent : 0;
vertical-align : baseline;
visibility : visible;
overflow : auto;
}

/* +++ Container als id für Bildebene und Text nebeneinander  +++ */
#ebene6a {
position : relative;
top : 15px;
left : 10px;
width : 260px;
height : 200px;
background-color : #c0b9c6;
margin : 0 0 0 0;
padding : 0;
float : left;
text-indent : 0;
visibility : visible;
}

#ebene6b {
float : right;
margin-top : 5px;
margin-bottom : 3px;
margin-right : 0;
margin-left : 3px;
}

/* +++ Container zu aktuelle Hinweise  auf index.htm    +++ Bild rechts  +++ */
#ebene6c {
position : absolute;
top : 110px;
left : 560px;
width : 165px;
height : 400px;
z-index : 10;
margin : 0 ;
padding : 0;
border : 0px solid #ff0000;
background-color : #c6bdcc;
text-align : center;
text-indent : 0;
visibility : visible;
}

/* +++  Container für Seiten ohne linke Seitenleiste +++ */
#eb1szene {
position : absolute;
top : 0;
left : 5px;
width : 90%;
height : 100%;
z-index : 1;
background-color : #c6bdce;
margin-top : 0;
margin-bottom : 0;
margin-right : 0;
margin-left : 0;
border : 0 solid #ff0000;
padding-top : 10px;
padding-bottom : 0;
padding-right : 4px;
padding-left : 4px;
text-indent : 0;
vertical-align : baseline;
visibility : visible;
overflow : auto;
}





/* +++++++++++++  HTML Tag Selektor  z.B."<h1>" und class Kombination h5.rot  +++++++++++++ */


/*  +++ Begrenzungslinien  ===  hr,  hr.lin2,  hr.ende  +++ */
hr {
	text-align : center;
	margin-left:auto; margin-right:auto;           /*  linie  mittig setzen */
	width : 400px;
	height : 3px;
	background-color :	gray;                    /* rote linie  #ff8a9f    #ff0000   */
	}
hr.lin2 {
	text-align : center;
	margin-left:auto; margin-right:auto;            /*  linie  mittig setzen */
	width : 300px;
	height : 5px;
	background-image : url(../images/bar.gif);      /*  blaue linie  */
	}
hr.ende {
	text-align : center;
	margin-top:5px;
	margin-left:auto; margin-right:auto;            /*  linie  mittig setzen */
	background-image : url(../images/bgbuttom.jpg); /*  Farbverlauf */
	}





/* +++     Ueberschriften   ===  h1 bis h6, h5.rot  +++ */

h1, h2, h3, h4, h5, h6 {border : none;}

h1 {
color : #e88229; /*#6f6285;*/
}
h2 {
color : #e88229;
}
h3 {
color : #e88229;
}
h4 {
color : #4682b4;
}
h5 {
color : #4682b4;
}
h6 {
color : #4682b4;
}

h1 {
	margin-top : 15px;
	margin-right : 60px;
	margin-bottom : 0;
	margin-left : 60px;
	padding : 2pt 2pt 2pt 2pt;
	text-align : center;
	font-size : 18pt;
	font-family : Arial, Tahoma, Helvetica;
	}
h2 {
	margin: 0 20px;
	padding : 2pt;
	text-align : center;
	font-size : 16pt;
	font-family : Arial, Tahoma, Helvetica;
	}
h3 {
	margin-top : 0;
	margin-right : 20px;
	margin-left : 20px;
	padding : 2pt;
	text-align : center;
	font-size : 14pt;
	font-family : Tahoma;
	}
h4 {
	margin : 0;
	margin-bottom : 1px;
	padding : 0;
	padding-left : 10px;
	text-align : left;
	font-size : 12pt;
	font-family : Tahoma;
	}
h5 {
	margin : 0;
	margin-bottom : 1px;
	padding : 0;
	text-align : left;
	font-size : 11pt;
	font-family : Tahoma;
	}
h6 {
	margin : 0;
	margin-bottom : 5pt;
	padding : 0;
	text-align : center;
	font-size : 10pt;
	font-family : Arial;
	}

h5.rot {
	color : #d00000;
	margin-bottom : 10px;
	border-bottom : 3px solid #d00000;
	text-align : left;
	}
	
.vcnh1 {
	font-size : 11pt;
	font-weight : bold;
	}
.cent {
	text-align:center;
}


/* +++++++++++++ class(.) und id(#) Selektoren    +++++++++++++ */
/*  === #copyright, .senamt, vcnh1  usw   === */

#copyright {
	float: right;
	text-align: right;
	margin-right: 20px;
	color: #ffff8D;
	}
/*
#copyright p {
	font-size: 0.75em;
	line-height : 24px;
	color: #ffff8D;
	border-top: 1px dashed #999999;
	margin-right: 20px;
	font-weight: bold;
	color: #666666;
	padding: 5px 160px 20px;
	clear: both;
	}
*/

/*  alternativ auch ohne div 	*/
.copyright {
	font-size: 0.75em;
	line-height : 24px;
	color: #666666;
	text-align: right;
	margin-right: 20px;
	}

/* +++ Nach-oben-Link am Ende der Seite  +++ */
#pageup {
	clear : both;
	margin-top : 5px;
	margin-bottom : 20px;
	}


/* +++ Listen, unsortierte und Defintitionsliste  +++ */
/*  ===  ul, li  === */
ul {
	margin : 0;
	margin-left : 40px;
	border : 0;
	padding : 0;
	text-indent : 0;
	}

li {
	margin : 0;
	margin-left : 10px;
	border : 0;
	padding : 0;
	padding-left : 5px;
	padding-right : 5px;
	text-indent : 0;
	}
	

li.map {
	margin : 0;
	margin-left : 80px;
	font-size : 9pt;
}
li.bdm {
	margin : 0px;
	margin-left : 10px;
	font-size : 10px;
	display: inline;
}
.bdmbildli {
	float: left;
	vertical-align: top;
	margin: 5px 5px;
}


/*  ===  dl, dt, dd  === */

dl {
	margin-left : 30px;
	}
dt {
	background-color : #d9d9df;
	margin : 0;
	border : 1px solid #efeff7;
	padding-left : 5px;
	width : 650px;
	text-align : left;
	font-size : 9pt;
	line-height : 20px;
	}
dd {
	margin-left : 20px;
	margin-right : 20px;
	padding : 3px;
	text-align : left;
	font-size : 9pt;
	font-style : normal;
	}

.vcnlist {
	text-align : left;
	font-size : 10pt;
	font-weight : bold;
		/*  list-style-type: none;   es wird kein Markierpunkt gesetzt  */
	}
.vcnlist1 {
	text-align : left;
	font-size : 10pt;
	font-weight : 300;
	}
.vcnlist2 {
   text-align : left;
   font-size : 10pt;
   font-weight : 300;
   margin-left : 40px; }

.vcnlidezi {
  text-align : justify;
   font-size : 11pt;
   font-weight : normal;
   margin-left : 40px;
   margin-right : 40px;
   list-style-type: decimal; }  /* kuhe 21.6.2011 neu hinzu  */
   

/*  +++ Absätze - Texte - Schriften  +++ */

p {
	text-align : center;
	font-size : 10pt;
	font-family : Verdana, Arial, Tahoma, Helvetica, sans-serif;
	}
pre {
	text-align : left;
	font-size : 10pt;
	font-family : Verdana, Arial, Tahoma, Helvetica, sans-serif;
	}

.txtKopf {
	background : #d9d9d9;
	}
	
.txtbox {
	background : #d9d9d9;
	width: 790px;
	margin-left : 20px;
	margin-right : 20px;
	}
.senamt {
	text-align: center;
	font-size : 8pt;
	font-weight : normal;
	color: #B0C4DD;
	line-height:18px;
	}

.vcnzh1 {
	text-align : left;
	font-size : 10pt;
	font-weight : normal;
	line-height : 14px;
	}
.vcn {
	text-align : left;
	font-size : 10pt;
	font-weight : normal;
	}
.vcn8 {
	text-align : left;
	font-size : 8pt;
	font-weight : normal;
	}

.was {
	padding-left : 15px;
	font-weight : bold;
	color : #bf0000;
	}
.vcjust {
	padding-left : 15px;
	padding-right :15px;
	text-align : justify;
	font-size : 10pt;
	}
.bericht{
	font-size: 11pt;
	font-family : Arial,Verdana;
	font-weight:500 ;
	font-style: normal;
	font-variant: normal;
	line-height : 20px;
	text-align : left;
	margin-left : 60px;
	margin-right : 60px;
	padding-left: 20px;
	padding-right: 20px;
}	
.vcnjub {
	font-size: 11pt;
	font-family : Verdana, Arial;
	font-weight: 500;
	font-style: normal;
	font-variant: normal;
	line-height : 20px;
	text-align : left;
	margin-left : 40px;
	margin-right : 40px;
	padding-left: 5px;
	padding-right: 5px;
	}
	.vcnjub14 {
	font-size: 13pt;
	font-family : Verdana, Arial;
	font-weight: 500;
	font-style:  normal;
	font-variant: normal;
	line-height : 20px;
	text-align : left;
	margin-left : 40px;
	margin-right : 40px;
	padding-left: 5px;
	padding-right: 5px;
	}

.vcngrus {
	padding-left: 14px;
	padding-right: 14px;
	text-align : left;
	line-height : 24px;
	font-size: 11pt;
	font-family : Verdana, Arial;
	font-weight: 500;
	font-style: normal;
	font-variant: normal;
	}
.vcnsommer {
	padding-left : 10px;
	padding-right : 10px;
	text-align : center;
	line-height : 22px;
	font-size : 14pt;
	font-family : Tahoma, Arial;
	font-weight : 600;
	}

.vcngelb {
	text-align : left;
	font-size : 9pt;
	font-weight : 500;
	color : #ffffaa;
	margin-left : 0;
	margin-right : 20px;
	}

.vcnjhv {
	text-align : left;
	font-size : 10pt;
	font-weight : bold;
	list-style-type: none;   /* es wird kein Markierpunkt gesetzt  */
	}

.kursnr {
	font-size : 8pt;
	font-weight : normal;
	color : #000000;
	}
.vcnmenu {
	font-family : Arial;
	font-size : 10pt;
	font-weight : bold;
	line-height : 16pt;
	vertical-align : middle;
	font-style: normal;
}
	
/* +++ Text Hervorhebungen , decoration und position   em, acronym +++ */
em {
	color : #bd0329;
	font-weight : normal;
	font-style : normal;
	}
acronym {
	border-bottom : 1px dotted #666;
	cursor : help;
	}
	
/*  +++ Zeilenhöhen  +++ */
.zhoch1 {
	line-height : 18px;
	}
.zhoch2 {
	line-height : 40px;
	}

/*  +++ Text  +++ */
.einzug {
	text-indent : 20px;
	font-size : 9pt;
	}
.einzug60 {
	text-indent : 60px;
	font-size : 9pt;
	}

.aufzaehl1 {
	 list-style-type: square;
	}

.durchstr{
	text-decoration:line-through;
	}
.untstr{
	text-decoration:underline;
	}
	
.vcninlin {
	display : inline;
	text-align : right;
	}

.vcnbold {
	text-align : left;
	font-size : 10pt;
	font-weight : bold;
	}
.vcncent {
	text-align : center;
	font-size : 10pt;
	font-weight : bold;
	}
.vcnclip {
	text-align : center;
	font-size : 10pt;
	font-weight : normal;
	}

.vcncopy {
	text-align : center;
	font-size : 8pt;
	font-weight : 600;
	color : #ffffff;
	padding-bottom:5px
	}
.vcnre {
	text-align : right;
	}
.vcnarch {
	text-align : right;
	margin-top:-20px;
	margin-right : 50px;
	}

.rot10 {
	text-align : center;
	font-size : 10pt;
	font-weight : bold;
	color : #ff0000;
	}
.grau10 {
	text-align : center;
	font-size : 10pt;
	font-weight : bold;
	color : #808080;
	}
.grau {
	color : #808080;
	}

.back9 {
	text-align : center;
	font-size : 10pt;
	font-weight : bold;
	color : #ffffff;
	margin-top:5px;
	}


/*  +++ Aussenabstand  === margin  +++ */
.marg40r {
	margin-right : 40px;
	}

.marg20 {
	margin-left : 20px;
	margin-right : 20px;
	}
.marg40 {
	margin-left : 40px;
	margin-right : 40px;
	}
.marg50 {
	margin-left : 50px;
	margin-right : 5px;
	}
.marg60 {
	margin-left : 60px;
	margin-right : 60px;
	}
.marg80leri {
	margin-left : 80px;
	margin-right :80px;
	}

.marg100le {
	margin-left : 100px;
	margin-right : 20px;
	}
.marg100leri {
	margin-left : 100px;
	margin-right :100px;
	}
.marg200le {
	margin-left : 200px;
	margin-right : 20px;
	}

.marg250 {
	margin-left : 20px;
	margin-right : 250px;
	}
.marg220ri {
	margin-right : 220px;
	}

.marg300 {
	margin-left : 20px;
	margin-right : 300px;
	}

.marg300le {
	margin-left : 300px;
	margin-right : 20px;
	}




/* +++ Linkstile allgemein  +++ Achtung Reihenfolge link - visited - hover - active  beachten  +++ */
 a:link {
	text-decoration : none;      /* keine Unterstreichung   */
	font-family : Arial;
	color : #008000;
	font-weight : bold;
	}
a:visited {
	text-decoration : none;
	font-weight : normal;
	color : #009030;
	font-weight : bold;
	}
a:hover {
	text-decoration : none;
	/*   border-bottom: dashed 2px #9f3;  */
	color : #b1fa66;
	font-weight : bold;
	}
a:active {
	text-decoration : underline;
	color : #ff9000;
	}


/*  +++  Linkstile für Hauptmenü +++ Reihenfolge link - visited - hover - active  beachten  +++ */
#navhead a:link {
	text-decoration : none;
	color : #ffffaa;
	font-weight : bold;
	}
#navhead a:visited {
	color : #ffffcc;
	font-weight : bold;
	}
#navhead a:hover {
	text-decoration : underline;
	color : #ff6000;
	font-weight : bold;
	}
#navhead a:active {
	text-decoration : none;
	color : #ff6000;
	font-weight : bold;
	}

/*  +++   Linkstile für Seitenleiste  +++ */
a.vcnmenu:link {
	text-decoration : none;
	color : #ffffaa;
	font-weight : bold;
	}
a.vcnmenu:visited {
	color : #ffffcc;
	font-weight : bold;
	}
a.vcnmenu:hover {
	text-decoration : none;
	color : #ff6000;
	font-weight : bold;
	}
a.vcnmenu:active {
	text-decoration : none;
	color : #ff6000;
	font-weight : bold;
	}
	
/*  +++   Linkstile für Spezielles
	p a {
		line-height : 0;
		border-width : 0;
		}
*/

/* Keine Rahmen um Grafiken als Link */
a img {border-width:0px;}



/* +++ Linkstile neu hinzu ab 17_10_2009 , zur Darstellung eines Titelfensters im Text +++ */
a.info{
	position: relative;    /*this is the key*/
	z-index:24; background-color:#ccc;
	color:#000;
	text-decoration:none}

a.info:hover{z-index:25; background-color:#ff0}

a.info span{display: none}

a.info:hover span{         /*the span will display just on :hover state*/
	display:block;
	position:absolute;
	top:1em; left:-25em; width:30em;
	/*  top : 190px; 	left : 480px; 	width : 130px; 	height : 100px;  */
	border:1px solid #0cf;
	padding: 6px;
	background-color:#cff; color:#000;
	text-align: Left}


/*  +++ Tabellen  allgemein +++  */

table {
	height : 10px;
	margin:auto;
	}
tr  { border-color:navy; border-style:dotted; border-width:thin;
	}

td {
	padding-top : 2px;
	padding-right : 2px;
	padding-left : 2px;
	padding-bottom : 2px;
	}
.szenetab{
	caption-side:top;
	width:80%;
	height : 10px;
	margin-left:auto;
	padding:5px;
	border:0px;
	background-color:#9797b0;
	}

/* +++ Tabelle zu termin.htm  +++ */

.termTable {
	margin-left : 15px;
	border : 2px solid grey;
	padding : 4px;
	width : 95%;         /* 27.7.08 von 90% auf 95% gesetzt */
	border-collapse:collapse
	}
.termTD0 {                 /* 13.6.2011 neu gesetzt */
	width : 50px;
	text-align : left;
	border-color:navy; border-style:dotted; border-width:thin;
	}

.termTD1 {
	width : 80px;
	text-align : left;
	border-color:navy; border-style:dotted; border-width:thin;
	}
.termTD2 {
	width : 25px;
	background-color : #b0c4dd;
	border-color:navy; border-style:dotted; border-width:thin;
	}
.termTD3 {
	width : 380px;        /* 27.7.08 von 360 auf 380px  gesetzt */
	border-color:navy; border-style:dotted; border-width:thin;
	}
.termTD4 {
	width : 20px;
	background-color : #b0c4dd;
	border-color:navy; border-style:dotted; border-width:thin;
	}

.schatt1 {
	background-color : #d8d5d5;
	}
.schatt2 {
	background-color : #ffffee;
	}

/* +++ Tabelle zu  kontakt.htm +++ */
.konTab {
	margin : 0;
	margin-left : 60px;
	border : 1 solid #000000;
	padding : 4px;
	width : 90%;
	}
.konTD1 {
	width : 150px;
	text-align : left;
	}
.konTD2 {
	width : 500px;
	text-align : left;
	}

/* +++ Tabelle zu  xyz.htm +++ */
.sitetab {
	border : 1px solid #000000;
	width : 90%;
	}
.sitetd1 {
	width : 30px;
	text-align : left;
	}
.sitetd2 {
	width : 300px;
	background-color : #b0c4dd;
	}

/*  +++  Bilderstile  und Anordnung   +++ */

div.bild {
	position:relative;
	top:0px;left:-20px;
	margin-right: auto; /* Bild mittig setzen, Browser ermittelt autom. die Seitenabstände */;
	margin-left: auto;
	padding:0px;;
	vertical-align: top;
	text-align:center;
}
.bildmi {
	vertical-align: baseline;
	padding:5px;
	margin-right: auto; /* Browser ermittelt autom. die Seitenabstände */;
	margin-left: auto;
}
.bildli {
	float: left;
	vertical-align: baseline;
	margin: 10px 10px; 
}

.bildlicl {
	float: left;
	vertical-align: baseline;
	margin: 10px 10px; clear:left;
}
.bild20 {
	float: left;
	vertical-align: top;
	margin: 20px;
}

.bildre {
	float: right;
	vertical-align: baseline;
	margin: 10px 10px;
}

.bildre2 {
	 border-style: solid;
	 border-width: 1px;
	 margin: 5px;
	 float: right;
	}





/* +++ neu hinzu ab 20_10_2009 bei Ueberarbeitung mit missing manual +++ */
	/* in ebene0 ans Ende gesetzt   <br class="endclear clear"/>   */

br.endclear {clear:both;}

/*   Easy clearing Methode  */
.clear:after {
	display:block;
	content: ".";
	height:0;
	font-size:0;
	clear:both;
	visibility:hidden;
	}
	
/* +++ neu hinzu ab 23_10_2011 zu index.htm programmhefthinweis +++ */

	div#links a span {display: none;}
		
	div#links a:hover span {
		   display: block;
		   position: absolute;
		   top: 400px;
		   left: 550px;
		   width: 160px;
		   padding: 10px;
		   margin: 5px;
		   z-index: 100;
		   color: #000000;
		   background: #C0C0C0;
		   font: 12px Verdana, sans-serif;
		   text-align: center; }
		   
/* +++ neu hinzu ab 27_09_2017 zu holzgartenschule.htm zu laufbilder  
		div#links a span {display: none;	}
		
		div#links a:hover span {
			display: block;
			position:  relative;
			top: -100px;
			left: 120px;
			width: 260px;
			padding: 5px;
			margin: 1px;
			z-index: 100;
			color: #000000;
			background: #C0C0C0;
			font: 12px Verdana, sans-serif;
			text-align: center;
		}
+++ */

#laufbilder{
	position : relative;
	top: 10px;
	left: 0px;
	width :90%;   /* war 780px */
	height:100%;
	margin-top: 5px;
	margin-right: auto; /* Browser ermittelt autom. die Seitenabstände */
	margin-left: auto;
	border-style: solid; /* border-style:none; */
	border-color: black;
	border-width: 1px;
	padding: 5px;
	background-color : #6f6285;    /*  #9797b0 */
	text-align : center;
	}
   
	
/* ################################## Ende CSS ############################################## */

