/*------------------------------------------------------------*
**  Hoppel-bande Stylesheet | Copyright by www.hoppel-bande.de
**------------------------------------------------------------*/
body
       {
       margin:0;
       padding:0;
       width:100%;
       max-width:100%;
       min-width:100%;

       color:#000000;
       font:80% Arial, Helvetica, sans-serif;
       line-height:120%;
       text-align:center;

       border:0;

       background-color:#FFFFB9;
       }

/* --> Behebt fehlerhaftes :hover verhalten im IE */
*html body {behavior:url(design/csshover.htc);}

/*------------------------------------------------------------*
**  Rahmen
**------------------------------------------------------------*/
div#container
       {
       margin:0 auto;
       padding-left:5px;
       width:85%;
       max-width:900px;
       min-width:750px;

       text-align:left;

       background:white url(design/links_schatten.gif) repeat-y left;
       }


div#innercontainer
       {
       margin:0;
       padding-right:5px;
       width:100%;

       background: url(design/rechts_schatten.gif) repeat-y right;
       }

/*------------------------------------------------------------*
**  Seitenkopf
**------------------------------------------------------------*/
div#kopfzeile_e1
       {


       background:transparent url(design/kopfzeile_e1.gif) repeat-x;
       }

div#kopfzeile_e2
       {
       padding-right:40px;
       background:transparent url(design/kopfzeile_e2.gif) no-repeat right;
       }

div#kopfzeile_e3
       {
       margin:0;
       padding:0;
       width:100%;
       height:80px;

       text-align:right;

       background:transparent url(design/kopfzeile_e3.gif) no-repeat left;
       }

/*------------------------------------------------------------*/

div#kopfgrafik_e1
       {
       background:transparent url(design/kopf_gras.jpg) center;
       }

div#kopfgrafik_e2
       {
       background:transparent url(design/kopf_tapsi.gif) no-repeat right;
       }

div#kopfgrafik_e3
       {
       margin:0;
       padding:0;
       width:100%;
       height:140px;

       text-align:center;

       background:transparent url(design/kopf_kloli.gif) no-repeat left;
       }

/*------------------------------------------------------------*
**  Navigation
**------------------------------------------------------------*/
div #navigation
      {
      float:left;
      margin:0 0 20px 0;
      width:100%;

      background:#dae0d2 url(design/menu_hg.gif) repeat-x bottom;
      }

#navigation ul
      {
      margin:0;
      padding:10px 10px 0;

      list-style:none;
      }

#navigation li
      {
      float:left;
      display:inline;
      padding:0;

      background:transparent url(design/menu_button_rechts.gif) no-repeat right top;
      }

#navigation li:hover,
#navigation li:hover a
      {
      background-position:100% -150px;
      color:#333;
      }

#navigation li:hover a
      {
      background-position:0 -150px;
      }

#navigation a
      {
      float:left;
      display:block;
      position:relative;
      left:-9px;
      margin-right:-9px;
      width:.1em;
      padding:5px 20px;

      text-decoration:none;
      font-weight:bold;
      color:#4D667F;

      background:transparent url(design/menu_button_links.gif) no-repeat left top;
      }

#navigation > ul a {width:auto;}

/* --> Versteckt vor IE 5 Mac */
#navigation a {float:none;}
/* --> Ende */

#navigation a:hover
      {
      color:#333;
      }

#navigation li#aktiv,
#navigation li#aktiv a
      {
      background-position:100% -150px;
      color:#333;
      }

 #navigation li#aktiv a
      {
      background-position:0 -150px;
      }

#aktiv
      {
      margin:1px 0 0 9px;
      }

#navigation_home,
#navigation_themen,
#navigation_aktivitaeten,
#navigation_verschiedenes,
#navigation_hoppelbande
      {
      margin:0 0 -1px 9px;
      }
      

#noaktiv
      {
      margin:0px 0 1px 9px;

      }
*html #noaktiv
      {
      margin:0px 0 1px 9px;
      border-bottom:1px solid transparent;

      }
/*------------------------------------------------------------*/

#tooltip
      {
      display: none;
      }

#navigation a:hover #tooltip,
#navigation a:focus #tooltip
      {
      display: block;
      margin: 0;
      padding:0;
      position: absolute;
      top:30px;
      left: 0px;
      width: 200px;
      height:auto;

      color: black;

      opacity:0.90;
      filter:alpha(opacity=90);

      background:transparent url(design/tooltip_oben.gif) no-repeat top;
      }

#tooltip div
      {
      padding: 31px 0 13px 0;
      width: auto;
      height:auto;

      background:transparent url(design/tooltip_unten.gif) no-repeat bottom;
      }

#tooltip div span
      {
      display:block;
      padding: 0 5px 0 5px;
      position:relative;

      text-align:center;

      border-right:2px solid #8A9DC4;
      border-left:2px solid #8A9DC4;

      background-color:#D8E0F0;
      }

/*------------------------------------------------------------*
**  Seiteninhalt
**------------------------------------------------------------*/
div#content
       {
       margin-right:185px;
       }

*html div#content{width:100%;}

div#fullcontent
       {
       margin:1em;
       }

*html div#ullcontent{width:100%;}
/*------------------------------------------------------------*
**  Seitenleiste
**------------------------------------------------------------*/
div#sidebar
       {
       float:right;
       margin-top:-21px;
       padding-left:5px;
       padding-right:5px;
       width:150px;

       color:#000000;
       text-align:left;

       border-left:1px solid #4D667F;
       border-bottom:1px solid #4D667F;
       background: #FCFBFC;
       }

/*------------------------------------------------------------*
**  Inahltsbuendler
**------------------------------------------------------------*/
div#wrapper
       {
       float:left;
       margin-right:-188px;
       padding:1em;
       width:100%;
       }
       
div#fullwrapper
       {
       float:left;
       width:100%;
       }

/*------------------------------------------------------------*
**  Footer
**------------------------------------------------------------*/
div#unten
       {
       clear:both;
       padding-top:0.5em;

       color:black;
       font-size: 11px;
       text-align: center;

       border-top: 1px solid #C1C1C1;

       background-color : transparent;
       }

div#unten a
       {
       color:black;
       font-size: 11px;
       font-weight: normal;
       text-decoration:underline;
       }

div#unten a:hover {
       color:black;
       font-size: 11px;
       font-weight: normal;
       text-decoration:none;
       }

/*------------------------------------------------------------*
**  Copyright
**------------------------------------------------------------*/
div#copyright
       {
       padding-top:0.5em;
       padding-bottom:1em;

       color:#959595;
       font-size: 11px;
       text-align: center;

       background-color: transparent;
       }

div#printcopyright
       {
       display:none;
       }

div#fremdcopyright
       {
       margin:0;
       padding:0;
       font-size:70%;

       color:#808080;
       text-align: center;

       background-color: transparent;
       }

/*------------------------------------------------------------*
**  Horizontale Linie
**------------------------------------------------------------*/
HR
      {
      display:block;
      width:90%;
      height:1px;

      text-align : center;

      border: 1px solid #C1C1C1;
      }

/*------------------------------------------------------------*
**  Seitenberschrift
**------------------------------------------------------------*/
H1
      {
      margin-top: 0em;
      margin-bottom: 1.2em;
      padding-top:0;
      padding-bottom : 2px;

      color : #458E35;
      font-size : 175%;
      font-weight: bold;

      border-bottom: 3px double #E4E0E5;

      background-color: transparent;
      }

/*------------------------------------------------------------*
**  Themenberschrift
**------------------------------------------------------------*/
H2
      {
      margin-top: 2em;
      margin-bottom:0.8em;

      color : #000000;
      font-size :110%;
      font-weight: bold;
      text-decoration: underline;

      background-color: transparent;
      }

/*------------------------------------------------------------*
**  Achtung, Hinweis usw. bereich
**------------------------------------------------------------*/
H3
      {
      padding-left : 8px;

      color : #000000;
      font-size : 100%;
      font-weight: normal;

      border-left: 1px solid black;

      background-color: transparent;
      }
/*------------------------------------------------------------*
**  Fett, unterstrichen
**------------------------------------------------------------*/
H4
      {
      margin:0.4em 0 1em 0;
      padding:0;
      color : #000000;
      font-size : 120%;
      font-weight: bold;
      text-decoration:underline;
      text-align:center;

      background-color: transparent;
      }

/*------------------------------------------------------------*
**  Unterstrichen
**------------------------------------------------------------*/
H5
      {
      margin:0.3em 0 0 0;
      padding:0;
      color : #000000;
      font-size : 100%;
      font-weight: normal;
      text-decoration:underline;

      background-color: transparent;
      }
/*------------------------------------------------------------*
**  Unterstrichen
**------------------------------------------------------------*/
H6
      {
      margin:0.3em 0 0 1em;
      padding:0 11px; 0 0;
      color : #993399;
      font-size : 80%;
      font-weight: normal;
      text-decoration:normal;

      background: transparent url(design/mehr.gif) no-repeat left;
      }

/*------------------------------------------------------------*
**  Linkaussehen
**------------------------------------------------------------*/
A:link
      {
      color : #1B3773;
      background-color : transparent;
      font-weight: bold;
      text-decoration: underline;
      }

A:visited {
          color : #1B3773;
          background-color : transparent;
          font-weight: bold;
          text-decoration: none;
          }

A:hover {
        color: #000033;
        background-color : transparent;
        font-weight: bold;
        text-decoration: none;
        }

A:active {
         color: red;
         background-color : transparent;
         text-decoration: none;
         }

a[href^="http:"] {
background: transparent url('design/extern.png') 100% 50% no-repeat;
padding-right: 12px;
}

a[href^="http://hoppel-bande.de"],
a[href^="http://www.hoppel-bande.de"],
a[href^="http://hoppel-bande.i-networx.de"],
a[href^="http://www.hoppel-bande.i-networx.de"],
a[href^="http://0814net.de/cgi-bin/cms/gb/gb.cgi"],
a[href^="http://www.0814net.de/cgi-bin/cms/gb/gb.cgi"],
a[href^="http://80.237.175.195"],
a[href^="http://www.artmedic.de"],
a[href^="http://www.scripter.ch"]{
background: transparent;
padding-right: 0px;
}
/*------------------------------------------------------------*
**  Navigation
**------------------------------------------------------------*/
ul#navigationigation
       {
   width:100%;
	margin:0;
	padding:0;
       }
ul#navigationigation li {
   width:100%;
	margin:0;
	padding:0;
	list-style-type:none;
	list-style-position:outside;


  }

  ul#navigationigation a {
  color:#1B3773;
   font-size: 100%;       display: block;
	font-weight: bold;
	letter-spacing: 0em;
	line-height:190%;
	text-decoration: none;
	background-position: center left;
	background-repeat: no-repeat;
	padding: 0 0 0 28px;


  }



ul li a#home { background-image: url(design/home.gif); }
ul li a#home:hover { background-image: url(design/home_a.gif); color:red;}
ul li a#themen { background-image: url(design/themen.gif); }
ul li a#themen:hover { background-image: url(design/themen_a.gif); color:red;}
ul li a#aktivitaeten { background-image: url(design/aktivitaeten.gif); }
ul li a#aktivitaeten:hover { background-image: url(design/aktivitaeten_a.gif); color:red;}
ul li a#verschiedenes { background-image: url(design/verschiedenes.gif); }
ul li a#verschiedenes:hover { background-image: url(design/verschiedenes_a.gif); color:red;}
ul li a#hoppelbande { background-image: url(design/hoppelbande.gif); }
ul li a#hoppelbande:hover { background-image: url(design/hoppelbande_a.gif); color:red;}
ul li a#gaestebuch { background-image: url(design/gaestebuch.gif); }
ul li a#gaestebuch:hover { background-image: url(design/gaestebuch_a.gif); color:red;}
ul li a#kontakt { background-image: url(design/kontakt.gif); }
ul li a#kontakt:hover { background-image: url(design/kontakt_a.gif); color:red;}


.nodisplay {
           display : none;
           }

textarea, .textbereich, select {
          font-size: 100%;
          color: #000000;

          border: 1px solid #3F728B;
          background-color : #E9F9FF;
          }

.submit {
        font-size: 100%;
        color: #000000;
        background-color: #E9F9FF;

        cursor: pointer;
        }

.button {
        font-size: 100%;
        color: #000000;
        background-color: #E9F9FF;

        cursor: pointer;
        }
/*------------------------------------------------------------*
**  bord
**------------------------------------------------------------*/

.hiddentabelle{
      font-size: 100%;
border:0;
    border-collapse:collapse;
      }

.hiddentabelle td {
     font-size: 100%;
border:0;
     padding-right: 10px;
     padding-left: 10px;
     padding-top: 3px;
     padding-bottom: 3px;
     margin:0;
     }

.tabellenueberschrift {
	color: #356278;
  border-right: 0px solid black;
	border-left: 1px solid #ffffff;
	border-top: 1px solid #ffffff;
	border-bottom: 1px solid #3F728B;
	letter-spacing: 1px;
	font-weight:bold;

	text-align: center;

background-image:url('design/tabhg.gif');

              }

.tabellenueberschrift_l {
	color: #356278;
  border-right: 1px solid #3F728B;
	border-bottom: 0px solid #ffffff;
	border-top: 1px solid #ffffff;
	border-left: 1px solid #ffffff;
	letter-spacing: 1px;
	font-weight:bold;

	text-align: center;

background-image:url('design/tabhg.gif');

              }

table {
    border:1px solid #3F728B;
    width:90%;
    font-size:100%;
    border-spacing: 0;
    border-collapse: separate;
    *border-collapse: collapse; /* Ie l und 7 Tabellenfix */

}

td {
      font-size: 100%;
    border-bottom:1px solid #DEDEDE;
     padding-right: 10px;
     padding-left: 10px;
     padding-top: 3px;
     padding-bottom: 3px;
     margin:0;
     _position: relative; /* ie 6 und 7 Tabellenfix */
}



div#content ul {
   list-style-image: url(design/ecke.gif);
   }

caption {
caption-side: bottom;
}


            div#content_bildergalerie
       {
       margin-right:185px;
       }
        div#content_bildergalerie td {
     font-size: 100%;
     padding:0;
     }
     .bildergalerierahmen
      {
     height:140px; border:1px solid #4D667F; background:#CCE3BF;}

div#container_topmenu
       {
       margin:0;
       padding:0;
       width:100%;
       min-width:575px;

       color:#000000;
       text-align:left;



       background:transparent;
       }         .specialheadline
      {
     color:green;font-size : 130%;}

/*------------------------------------------------------------*
**  Seitenkopf
**------------------------------------------------------------*/
div#ganzseit_menue
       {
       margin:0;
       padding-top:10px;
       padding-bottom:10px;
       width:100%;


       color:white;
       text-align:center;

       border-bottom: 2px solid #4D667F;
        background:#CCE3BF;

       }

div#ganzseitmenuea{color:black;}
div#ganzseitmenue a:hover{color:black;}


/*------------------------------------------------------------*
**  rote Box
**------------------------------------------------------------*/
div #box_rot_lo
       {

       width:auto;
margin-left:25%;
margin-right:25%;

       background: transparent url(design/box_rot_lo.gif) no-repeat top left;
       }

div #box_rot_ro
       {
       padding-top:13px;

       background: transparent url(design/box_rot_ro.gif) no-repeat top right;
       }

div #box_rot_lu
       {
       background: transparent url(design/box_rot_lu.gif) no-repeat bottom
left;
       }

div #box_rot_ru
       {
       padding-bottom:13px;

       background: transparent url(design/box_rot_ru.gif) no-repeat bottom
right;
       }

#box_rot_ru span
      {
      display:block;
      padding: 0 5px 0 5px;
      position:relative;

      text-align:center;
      font-weight:bold;

      border-right:2px solid #FF524F;
      border-left:2px solid #FF524F;

      background-color:#FFCAC9;
      }

/*------------------------------------------------------------*
**  orange Box
**------------------------------------------------------------*/
div #box_orange_lo
       {
       margin:0 auto;
       width:100%;

       background: transparent url(design/box_orange_lo.gif) no-repeat top
left;
       }

div #box_orange_ro
       {
       padding-top:13px;

       background: transparent url(design/box_orange_ro.gif) no-repeat top
right;
       }

div #box_orange_lu
       {

       background: transparent url(design/box_orange_lu.gif) no-repeat bottom
left;
       }

div #box_orange_ru,
div #box_orange_ru_link
       {
       padding-bottom:13px;

       background: transparent url(design/box_orange_ru.gif) no-repeat bottom
right;
       }

#box_orange_ru span,
#box_orange_ru_link span
      {
      display:block;
      padding: 0 5px 0 5px;
      position:relative;

      text-align:left;
      font-weight:normal;

      border-right:2px solid #FFC44F;
      border-left:2px solid #FFC44F;

      background:#FFEDC9;
      }

#box_orange_ru_link span

      {
      background:#FFEDC9 url(design/box_orange_link.gif) no-repeat top
right;
      }






#uebersicht a:visited span {

display:inline;

padding:0 0.5em;
margin-left:1em;
font-size:0.8em;
  color:#c00;
  border:1px solid #c00;
  }
#uebersicht a span {
  display:none;
  }
#uebersicht a {

font-size:1.2em;
  }

#uebersicht table a:visited {

font-size:100%;
  color:#c00;
font-weight:normal;

  }

#uebersicht table a {

font-size:100%;
font-weight:normal;
  }


#sprblase
      {
      display: none;
      }

a:hover #sprblase,
a:focus #sprblase
      {
      display: block;
      width: 200px;
margin-top:-60px;
margin-left:150px;
      height:auto;
position:absolute;
      color: black;

      opacity:0.90;
      filter:alpha(opacity=90);

      background:transparent url(design/tooltip_oben.gif) no-repeat top;
      }

#sprblase div
      {
      padding: 31px 0 13px 0;
      width: auto;
      height:auto;

      background:transparent url(design/tooltip_unten.gif) no-repeat bottom;
      }

#sprblase div span
      {
      display:block;
      padding: 0 5px 0 5px;
      position:relative;

      text-align:center;

      border-right:2px solid #8A9DC4;
      border-left:2px solid #8A9DC4;

      background-color:#D8E0F0;
      }