body
{
    color: rgb(0, 0, 0);
    background-image: url("../gimpel4.jpg");
    background-attachment: fixed;
    font-family:Comic Sans MS;
    letter-spacing: .5px;
    font-size: 90%;
    width: 90%;
    margin-left: 5%; 
}

   a:link {color: #0000FF;text-decoration: none;border-style: none;}
   a:visited {color: #3300FF;text-decoration: none;border-style: none;}
   a:hover {color: #ff0000;text-decoration: underline;border-style: none;}
   a:active {color: #ff0000;text-decoration: none;border-style: none;}

.normal {text-decoration:none; font-weight:normal;}
.durchgestrichen {text-decoration:line-through}
.unterstrichen {text-decoration:underline}
.ueberstrichen {text-decoration:overline}
.fett {font-weight:bold}
.kursiv {font-style: italic}
.small {font-size: 9pt}
.mittig {text-align: center;}
.highlight {background-color:yellow;}

#player {
    width: 100%;
    height: 100%;
}

#counter {
  font-size: 10pt;
}
a.unten_rechts:link,
a.unten_rechts:visited,
a.unten_rechts:hover,
a.unten_rechts:active {
	color: #333;
	text-decoration: none;
	border-style: outset;
	position:fixed;
	bottom:5px;
	right:5px;
	background-color: #ccc;
	border-radius: 5px;
	z-index: 500;
}
/*
div#navigation {
    font-size: 0.8em;
    text-align:center;
    float: left; width: 15em;
    margin: 0; padding: 0;
}

div#navigation h1 {
    font-size: 1.2em;
    text-align: center;
    margin-top: 20px;
    margin-bottom: 0px;
}

div#navigation h2 {
    font-size: 1em;
    text-align: center;
}

div#navigation p {
    font-size: 0.8em;
}

div#inhalt {
/*    margin: 0 5em 0 20em;   
    padding: 1em 1em;
}                        */

div#inhalt h1 {
    font-size: 2em;
    font-weight: bold;
    text-align: center;
}

div#inhalt h2 {
    font-size: 1.5em;
    font-weight: bold;
    text-align: center;
    margin-top: 50px;
}

div#inhalt h3 {
    font-size: 1.2em;
    font-weight: bold;
    text-decoration: underline;
}

div#inhalt p {
    font-size: 1em;
}

/* ======== Abmessungen - Position - Ränder ======== */
.menuXXXX   /* Wird erstmal nicht benötigt */
{
   width:13em;       /* iframe 16em 200px*/
   height: 100%;
   left: 0;
   margin-left:0;
   position: static;
   z-index: 20;
   border-style:solid;
   border-width:0px;
   border-color: blue;
   border-right-width:2px;
}
iframe[class].menu     /* Nur für moderne Browser ?*/
{
   position: relative;
}
#inhalt {
/*  width:100%; */
/*   margin: 0 auto;  */
   margin-top: 7.5em;   /*.5*/
/*   top: 60px;          /**/
   border: 0px solid blue;      /*  für Testzwecke */
   left:10px;
   margin-right: 10px;
/*   top: 7em;   */
   padding: 0px;
/*   width:90%;   */    /* 86%*/
/*   font-size: 90%;     /**/
   position: relative;
   z-index: 0;
}
#menuback {
  position: absolute;     /*absolute*/
  top:0px;      /* 80px */
  margin-top: 0;
  left: 0px;
  margin-left: 0px;
  width:10em;   /* Orig: 16em 170px 19%*/
  height: 100%;  /* 80%;      */
/*  padding: 0px;     */
/*  z-index:  5;    */
}
html>body #menuback {     /* Nur für moderne Browser */
  position:fixed;
}
#kopfbereich {
/*  color: #330000;  */
    background-image: url("../gimpel4.jpg");
    /*background-attachment: fixed;     /**/
  border: 3px ridge #080;  /**/
  font-size: 90%;
  text-align: left;     /*center*/
  top: 0;
  width:99.5%;
  border-radius: 8px ; 
  -moz-border-radius: 8px ; 
  -webkit-border-radius: 8px ; 
  -o-border-radius: 8px ; 
  -icab-border-radius: 8px ; 
  -khtml-border-radius: 8px ; 
  margin-top: 0;
  left: 0px;
  margin-left: 0px; /*12.2em;/* 0;     /*15.5*/
  height: auto; /* 75px;  /**/
  z-index:50;   /*50*/
}
.blk_head{
    height:48px; 
	width:48px;
}


div[id]#kopfbereich {     /* Nur für moderne Browser */
   position: fixed;
}
#headtable {        /*wrapper*/
/*   border:1px solid #f00; /* Test */
   width: 100%;
   display: table;
}

#head {      /**/
/*	border:1px solid #033; /* Test */
/*	background-color:#ffffc6;   /* */
	display: table-cell;
	font:bold 25px/28px arial, sans-serif;      /* 13px/35px *//* */
	letter-spacing: 0.05em;   /**/
	text-align: center;
	vertical-align: middle;
	color: #aa0000;
}

.headrow {         /**/
/*   border:1px solid #0f0; /* Test */
   display: table-row;
}

#headleft {        /**/
/*   border:1px solid #330; /* Test */
  text-align:center;
/*  display: table-cell;
/*  background-color:#ffcc00;   /**/
}

#headright {       /**/
/*   border:1px solid #303; /* Test */
   text-align:center;
   padding-right: .5em;          /* Beim FF gehts sonst über den rechten Rand hinaus!! */
/*  display: table-cell;        /**/
}

.headmiddle {      
/*   border:1px solid #033; /* Test */
  display: table-cell;   /**/
}
/*
#head2right {       /**/
/*   border:1px solid #303; /* Test */
/*  vertical-align: middle;
  display: table-cell;     /**/
/* }
#head2left {       /**/
/*   border:1px solid #303; /* Test */
/*  vertical-align: middle;
  display: table-cell;     /**/
/*}             /*) */


#seite {
  top: 0;
/*  width:100%; */
  margin: 0 auto;
/*  margin-left: 0;    */
/*  margin-left:15em;            /*5em*/
  padding: 0px;
/*  position: absolute; */
}
.bordertop {
    border-top: 1px solid #888;
    padding: 20px;
}
.listindex {
	list-style:none;   /* */
	margin: 20px;
	padding-left: 50px;
	position:relative; 
	width: 85%;
}
.listindex li{
	display: inline;
	float: left;            /*none = Menu untereinander, left= Menu nebeneinander*/
	width: 140px;
	padding-bottom: 5px;
}
/* ==================== Menu Definitionen =============================================== */

#menucontainer {
	background-image: url("/transparent.png");     /*bl1.jpg*/
	border: 0px solid green;       /* für Testzwecke */
	font: 12px/20px arial, sans-serif;      /* 13px/35px */
	left: 0px;
	margin-left: 0px;
	margin-top: 0px;
	padding: 0px;
	position:relative;
	top:auto;          /* 0px 5em*/
	height: 1.8em;
	clear: both;
	float: left;
	width: 100%;
/*	overflow: hidden;   /**/
}
#smallmenu {
	display: none;    /*block*/
	visibility: hidden;  /**/
/*	left: -9999px; /**/
}
#mainmenu {
/*   border: 1px solid green;       /* für Testzwecke */
/*	height:25px;         /*  */
/*	top: auto;          /**/
	text-align: left;    /**/
    font-weight:bold;
	position:relative;  /*absolute */
	float: left;
	/*float: left;      /**/
/*	position: relative; /* */
/*	left: 5%;            /*############*/
/*	right: 5%;          /*############*/
    left: 50%;
	margin: 0 auto;     /* */
	padding: 0;
/*	width: 100%;
/*	padding: 0 auto;    /* */
	list-style:none;
/*	border: 1px solid #0a0;  /**/
}
#mainmenu li {
/*	float: left;
	position: relative;     */
	right: 50%;
}
#mainmenu a {
width: auto;
display: block;
padding:0 10px;
line-height: 1.5em;
}
#mainmenu > li.menu > a{
/*	border: 1px solid #008800;    /**/
	background: -webkit-gradient( linear, left top, left bottom, color-stop(0.1, #DDFFDD), color-stop(0.9, #AADDAA) );
	background: -moz-linear-gradient( center top, #DDFFDD 10%, #AADDAA 90% );
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#DDFFDD', endColorstr='#AADDAA');
	background-color: #DDFFDD;
	-moz-box-shadow: inset 0px 2px 2px 2px #BBFFCC;
	-webkit-box-shadow: inset 0px 2px  2px 2px #BBFFCC;
	box-shadow: inset 0px 2px  2px 2px #BBFFCC;
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
	border-radius: 0px;
/*	font-weight: bold;   /**/
/*	margin: 5px 5px;    /**/
	padding: 2px 2px;
	color: #880000;
	letter-spacing: 1px;
/*	font-family: 'Arial', sans-serif;
	font-size: 14px;          /**/
/*	width: 80px;        /**/
	text-transform: none;
	text-align: center;
	text-decoration: none;
/*	cursor: pointer;   /**/
/*	display: inline-block;  /**/
}
#mainmenu > li.menu > a:hover{
	background: -webkit-gradient( linear, left top, left bottom, color-stop(0.1, #AADDAA), color-stop(0.9, #DDFFDD) );
	background: -moz-linear-gradient( center top, #AADDAA 10%, #DDFFDD 90% );
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#AADDAA', endColorstr='#DDFFDD');
	background-color: #AADDAA;
	text-shadow: 1px 1px 1px #ffeeee;
	color: #f00;
}
#mainmenu > li.menu > a:active{
position: relative;
top: 2px;
left: 0px;
}

#mainmenu > li.menu  {
	display: inline;
	float: left;            /*none = Menu untereinander, left= Menu nebeneinander*/
	position:relative; 
	margin-right:1px;  /**/
/*	margin: 0 2px;     /**/
/*	border: 2px solid #080;  /* Rahmenfarbe Menü */
/*	border-radius: 3px;     /**/
}

#mainmenu ul {                   /* Das herunter geklappte Submenu */
	padding:1px 1px; 
	margin:0; 
	list-style:none;   /* */
	position:absolute;  /* */
	left:0; 
	display:none;   /**/
	background:#ffe; 
	border-radius: 0 0 8px 8px;     /* ol or ur ul */
	border:1px solid #a1a1a1;
	z-index: 11;     /* */
}
#mainmenu > li > a {              /* Das Aussehen des Topmenus */
	display:block; 
	white-space:nowrap; 
	float: none; /*left;    /* ??? */
	text-decoration:none; 
	color:#100; 
	outline:0px;        /*???*/
	padding: 0 10px 0 5px;    /* 0 10px*/
/*	border:1px solid #000;     /**/
	background-color: #c8ffc8;       /* Hintergrundfarbe Menü */
	position:relative; 
	z-index:10;     /**/
}
#mainmenuX > li > a.topmenu  {     /* Pfeilspitze als Zeichen von Untermenus */
/*	padding:0 10px 0 5px;   /**/
	background: url(/images/arrow_down_brn.png) no-repeat right center #c8ffc8;
}
#mainmenu img {
/*	display:block;     /**/
	position:absolute; 
	left:0; 
	top:0; 
	width:100%; 
	height:100%; 
	display:none; 
	cursor:pointer;                             	
	z-index:10;
}  /**/

#mainmenu ul li a {
	display:block; 
	white-space:nowrap; 
	padding:0 10px; 
	text-decoration:none; 
	color:#930; 
	background:#ded;
}       /**/
#mainmenu ul li a:hover {
	color:#000; 
	background:#fff;
}
#mainmenu  li > a:focus {
	background:#ffe; 
	color:#000;
}

#mainmenuX > li > a:focus {
/*	line-height:36px;    /*???*/
/*	padding:0 10px 0 5px;   /**/
	background:url(/images/arrow_up_blk.png) no-repeat right center #ffe;
}
#mainmenu  li  a:focus ~ ul {   /*  Hier klappt das Submenu herunter */
	display:block;
}
#mainmenu  li  a:hover ~ ul {   /*  Hier klappt das Submenu herunter */
	display:inline;        /* block */
}

#mainmenu  li > a:focus + img {
	display:block;
}    /**/

#mainmenu ul:hover {
	display:inline;        /* block */
}

#mainmenu  li a:active {      /* #mainmenu > li > a:active */
   display: block;
}
#mainmenu ul li {
	border-top:1px dotted grey;
/*	border-bottom:1px dotted grey;   /**/
}
/*#head2right, #head2left {
   display: table-cell;     /**/
/*   visibility: hidden;   
}                          /**/
#mainmenu > li.menu:last-child > ul {
    left: auto;
    right: 0;
}

#guestbookback {
  position: relative;     /*absolute*/
  top:0px;      /* 80px */
  margin: 0px;
  left: 0;
  width:100%;   /* Orig: 16em 170px 19%*/
  height: 800px;  /* 80%;      */
/*  padding: 0px;     */
/*  z-index:  5;    */
}
/*========================== Sobald das Fenster < 720px wird ...=========================*/
@media all and (max-width: 720px)     /*720*/
{
#inhalt:before {
   /*content:"< 720px";     /**/
}
/* #mainmenu > li.menu {
	display: none;
	float: none;            /*none = Menu untereinander, left= Menu nebeneinander*/
/* 
}     /**/
#mainmenu > li.menu + img,
#mainmenu > li#smallmenu + img {
	display: block;
	float: none;            /*none = Menu untereinander, left= Menu nebeneinander*/
}
#mainmenu > li > a:focus + img {
	display:block;
}    /**/

#mainmenu > li  a:hover + img {
	display:inline;        /* block */
}    /**/

#mainmenu > li > a:active + img {
	display:block;
}    /**/

#mainmenu  li#smallmenu:focus ~ li.menu {   /*  Hier klappt das Submenu herunter */
	display:block;
}

#mainmenu  li#smallmenu:active ~ li.menu {   /*  Hier klappt das Submenu herunter */
	display:block;
}

#mainmenu  li#smallmenu {
	display: block;    /*block*/
	visibility: visible;  /**/
	border: 1px solid #a00;  /**/
/*	left: -9999px; /**/
}
body:after {
 content: "< 720px";    /**/
}
#mainmenu > li.menu:nth-last-child(2) > ul {
    left: auto;
    right: 0;
}

}
/* ============================== Ende der Menudefinitionen ============================ */
/*============== Sondereinstellungen bei schmaleren Screens =============================*/
@media all and (max-width: 640px)
{
body
{
   font-size: 10pt;
/*	top:45px;           /**/
}
#head {
/*	font:bold 25px/28px arial, sans-serif;      /* 13px/35px *//* */
   font:bold 20px/22px arial, sans-serif;      /* 13px/35px *//* */
	letter-spacing: 0em;   /**/
}

.multicolumn {             /* Experimentell */
	column-count: 1;
	column-gap: 5px;
	-webkit-column-count: 1;
	-webkit-column-gap: 5px;
	-moz-column-count: 1;
	-moz-column-gap: 5px;
	border-bottom: 1px solid #888;
	padding: 5px;
/*	height: 250px;  */
}
body:after {
 content: "< 640px";    /**/
}
#mainmenu > li.menu:nth-last-child(2) > ul {
    left: auto;
    right: 0;
}
#mainmenu > li.menu:nth-last-child(1) > ul {
    left: 0;
    right: auto;
}

}
@media all and (max-width: 600px)
{
#mainmenu > li.menu:nth-last-child(3) > ul {
    left: auto;
    right: 0;
}
#mainmenu > li.menu:nth-last-child(2) > ul,
#mainmenu > li.menu:nth-last-child(1) > ul {
    left: 0;
    right: auto;
}
}
@media all and (max-width: 550px)
{
bodyX
{
   font-size: 10pt;
/*	top:45px;           /**/
}
.blk_headX{
    height:40px; 
	width:40px;
}
#headX {
/*	font:bold 25px/28px arial, sans-serif;      /* 13px/35px *//* */
   font:bold 16px/18px arial, sans-serif;      /* 13px/35px *//* */
}
#head, #headleft, #headright {
/*   display: none;     /**/
   visibility: hidden;   
}
#kopfbereich {
	background-image: url("/images/head_background_480x45.png") !important;   /*bl1.jpg*/
	background-repeat:no-repeat;
	background-position: center top;
/*	height: 45px;    /**/
}
body:after {
 content: "< 550px";    /**/
}
#mainmenu > li.menu:nth-last-child(2) > ul,
#mainmenu > li.menu:nth-last-child(1) > ul {
    left: 0;
    right: auto;
}
}
@media all and (max-width: 520px)
{
#mainmenu > li.menu:nth-last-child(4) > ul {
    left: auto;
    right: 0;
}
#mainmenu > li.menu:nth-last-child(3) > ul,
#mainmenu > li.menu:nth-last-child(2) > ul,
#mainmenu > li.menu:nth-last-child(1) > ul {
    left: 0;
    right: auto;
}
}

@media all and (max-width: 475px)
{
.blk_head {
  display: none; /* hide; */
}
#kopfbereich {
	background-image: url("/images/head_background_320x30.png") !important;   /*bl1.jpg*/
	background-repeat:no-repeat;
	background-position: center top;
/*	height: 30px;    /**/
}
.headline_gruen {
   text-align: center;
   font-size: 160%;
   font-weight: bold;
   color: green;
   margin-bottom: 0em;
   padding-top:.5em;
   padding-bottom: 1em;
}
.noDisplayOnSmallScreens {
   display: none;
}
.header0, .sp_0,
.header4, .sp_4
{
   display: none;
   visibility: hidden;
}
body:after {
 content: "< 475px";    /**/
}
#mainmenu > li.menu:nth-last-child(3) > ul,
#mainmenu > li.menu:nth-last-child(2) > ul,
#mainmenu > li.menu:nth-last-child(1) > ul {
    left: 0;
    right: auto;
}
#mainmenu > li.menu:nth-last-child(4) > ul {
    left: auto;
    right: 0;
}
}
@media all and (max-width: 318px)
{
body
{
   font-size: 9pt;
	top:38px;
}
#kopfbereich {
	background-image: url("/images/head_background_160x38.png") !important;   /*bl1.jpg*/
/*	height: 38px;    /**/
    background-position: center top; 
}
body:after {
 content: "< 318px";    /**/
}
}
