/*-------------------------------------------------------------------
--- MEDIA CONTAINER fuer SLIDESHOWS, EINZELENE IMAGES UND MOVIES ---
-------------------------------------------------------------------*/
#mediahead {
 margin-bottom:0em;
 border:0px solid #ccc;
 border-top:none;
}

#media {
 margin-bottom:2em;
 border:0px solid #ccc;
 border-top:none;
}

/*-------------------------------------------------------------------
--- UEBERSCHRIFT FUER DEN MEDIAPLAYER ---
-------------------------------------------------------------------*/
#mediahead h1{
 font-size:.625em;
 font-weight:normal;
 color:#999;
 padding:.25em .75em .25em 0;
 border-width:1px 0 0 0;
 border-style:solid;
 border-color:#fff;
 background:transparent url(ximages/strg_verlauf.jpg) 0 1px repeat-x;
}
#mediahead h1 em{color:#666; font-style:normal;}


#media .bildcontainer {
 background:#fff;
 padding:0;
 text-align:center;
 border-width:0px 0px 0px 0;
 border-color:#ccc;
 border-style:solid;
}
/*----------------------------------------------------------------------------
--- NOTE: Groesse Bild und Rahmen=.125em,
-- 1em = 16px
--- 534px = 33.375em
--- muss mit typo3 abgeglichen werden
-----------------------------------------------------------------------------*/

#media .bildcontainer img{
 width:33.375em; margin:.5em 0;/* border-width:0 1px 1px 0; border-color:#ccc; border-style:solid;wichtig damit beim vergroessern nund verkleinern der browserdarstellung das bild mit zieht*/
}


/* NEU */
#steuerung {border-top:1px solid #ccc; border-bottom:0px dotted silver;height:3em;}
#steuerung p {
 display:block;
 float:left;
 background:transparent url(images/strg_verlauf.jpg) 0 -.625em repeat-x;
 }

#steuerung .back,
#steuerung .forth {
 margin-top:0em;
 position:relative;
 overflow:hidden;
 width:3em;
 height:2em;
 /*background:lime;*/
}


#steuerung .back a,
#steuerung .forth a,
#steuerung .back a:link,
#steuerung .forth a:link,
#steuerung .back a:visited,
#steuerung .forth a:visited {
 display:block;
 width:3em;
 height:2em;
}

#steuerung .back a img,
#steuerung .forth a img { height:2em; display:block; border:none ;}

#steuerung .back a:hover,
#steuerung .forth a:hover { margin-left:-3em;}


#steuerung .back a:active,
#steuerung .forth a:active{ margin-left:-6em;}



#linkleiste {
 background-image:url(images/footer_pipe.gif);
 background-position:left center;
 background-repeat:no-repeat;
/* background:orange;
 border-left:1px dotted #999; */
 height:2em;
 width:30.25em;
 }

#linkleiste a {
 float:left;
 display:block;
 text-align:center;
 font-size: .75em; /* wichtig fuer die groesse, liegt die groessen angabe im uebergeordneten div so erhoeht sich auch der abstand vom linken rand*/
 margin: .75em .5em .5em .5em;
 padding: .5em;
 background:#ddd;
 }
 
 *:first-child+html #linkleiste a{ padding: 0px 3px; }
 * html #linkleiste a { padding: 5px 1px; }
 

#linkleiste a:hover {
 background-color: #c00 !important;
 }

#linkleiste a.current {
 background-color :#999 !important;
 }




/* IMAGE SLIDES Display */

.slide { display: none;}