div, span, object, dl, dt, dd, ol, ul, li, menu, nav, section, summary, time, mark, audio, video, hamburger {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

body {
        width: 100%;
}

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {

}

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

blockquote:before, blockquote:after, q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:;
    background:transparent;
}

/* change colours to suit your needs */
ins {
    background-color:#ff9;
    color:#fff;
    text-decoration:none;
}

/* change colours to suit your needs */
mark {
    background-color:#ff9;
    color:#fff;
    font-style:italic;
    font-weight:bold;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}

table {

}




input, select {
    vertical-align:middle;
}

/* ##### reset END ############################################################ */

/* SIL Open Font License, 1.1 */

/*@font-face {
  font-family: 'Shadows Into Light Two';
  src: url(Shadows-Into-Light-Two.ttf.eot);
  src: local('Shadows Into Light Two'),
         url(Shadows-Into-Light-Two.ttf.woff) format('truetype');
}*/

/*html {
        background: rgb(235,235,235);
/*        background: -webkit-linear-gradient(top, rgb(250,250,250), rgb(200,200,195));
        background: -moz-linear-gradient(top, rgb(250,250,250), rgb(200,200,195));
        background: -o-linear-gradient(top, rgb(250,250,250), rgb(200,200,195));
        background: -ms-linear-gradient(top, rgb(250,250,250), rgb(200,200,195)); */
        /*background: linear-gradient(rgb(250,250,250), rgb(200,200,195));
        background-attachment:fixed;
}*/



body {

        /*max-width: 1024px;  px, weil responsiveslides sonst bei jedem Wechsel um 1 px zappelt */
        /*margin: 10px auto;
        line-height: 1.4em;
        -webkit-hyphens:auto;
        -moz-hyphens:auto;
        -ms-hyphens:auto;
        hyphens:auto;
        color: #444;*/
}


.nav-item a span {display:none;}
.nav-item li span, .nav-item li a {padding:0}


dfn, .weg, table caption, #navi h2,
.sr {
        position:absolute;
        left:-9000px;
        top:auto;
/*        overflow:hidden; weil sonst das jQuery Untermenu sofort wieder zugeht */
        display:inline;
        width:0;
        height:0;
        font-size: 0; /* h2 in der Navi */
}



#inhalt {padding:0 1px;}

#navi {
        display:block;
        margin-bottom: -2em; /* siehe #skip padding und $(window).scroll(function () */
        font-size: 1.3em; /* wenn JavaScript aus ist, koente man andernfalls durch JavaScript ueberschreiben */
}

#navi, #hamburger {
        width: 100%;
}

#hamburger {
        display:none;
        position:absolute;
        top:20px;
        width: 100%;

}

a.group {
        float:left;
        outline:none;
}

.group img {
        margin: .7em .5em 0 0;
        border-radius: 1em;
}

a:focus.group img, a:hover.group img {
-webkit-box-shadow: 2px 2px 10px #000000; /* webkit browser*/
-moz-box-shadow: 2px 2px 10px #000000; /* firefox */
box-shadow: 2px 2px 10px #000000;
}


.bildhinweis, .hinweis {font-family: Verdana, sans-serif;font-size:.8em; margin: .5em 0 0 0;clear:both;}

.sterne {white-space: nowrap; }
.sterne img {vertical-align: 25%;}

/* http://www.kick-image.at/weblog/09-02-2009/css-problem-listen-neben-element-floaten */
.inside {
overflow:auto; padding-left:18px;
min-width: 7em;
}


/* Definition Skiplink */
a.skiplink,
a:hover.skiplink,
a:visited.skiplink {
        position: absolute;
        overflow: hidden;
        top: auto;
        left: -1000px;
        color:#fff;
        font-size: 1.1em;
        background: #666;
        text-decoration: none;
        padding: .5em;
        z-index:20;
}

a:focus.skiplink,
a:active.skiplink {
        position: absolute;
        top: 0;
        left: 0;
}

a#skip {
text-decoration:none;
color: #666;
outline:none;
cursor: default;
display:block; padding-top: 2.2em; /* wg. fixed Menu: damit bleibt der Fokus im Saf iOS auf dem Sprungziel?, und Sprungziel verschwindet nicht im IE8 */
}


/* Ende Skiplink */


/* ##### responsive slides #### */

.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
/* width: 100%; das macht alles kaputt */
  padding: 0;
  margin: 0;
  }

.rslides li {
  /* -webkit-backface-visibility: hidden; */
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.rslides img {
  display: block;
/*  height: auto;
 float: left; */
  width: 100.01%; /* gegen das Springen um 1px bei Bildwechsel */
  border-top-left-radius: 1em;
  border-top-right-radius: 1em;
  }



.f-nav{ z-index: 9; position: fixed; top: 0; border-top: 10px solid #FAFAFA; max-width: 960px !important;} /* this make our menu fixed top, border-top color to match body bg-color */

/* mega menu list */
.nav-menu {
    display: block;
    background:#466E91;
        color:#fff;
    position: relative;
    list-style: none;
    z-index: 15;
    font-size: 1.3em;
    line-height: 40px;
    /*padding-left: 1em;*/
    text-align:left;



}

.nav-menu a {color:white; text-decoration:none; outline:none;}

.nav-menu a:hover:before,
.nav-menu a:focus:before {
    content: "";
    margin-left: -.8em;
    display:inline-block;
    width: .8em;
   /* font-size: 1.3em\9;  Hurra! ein IE8 Hack */
    line-height: .7em; /* der IE braucht das, weil er sonst zappelt */
    text-align:left;
}


/* a top level navigation item in the mega menu */
.nav-item {
    display: inline-block;
    min-width: 8em\9;
    color:white;
        background-color:none;
        text-align:left;
        /*padding-bottom:3px;*/
        border-bottom: 2px solid #fff;
}

.has_sub {min-width: 10em\9;} /* IE 8: Breite beibehalten, wenn f-nav greift */

.has_sub:after {
content: url(hamburger_w.gif);
}


/* first descendant link within a top level navigation item */
/*.nav-item > a, noscript li { */
.nav-item a, noscript li, .current, .current.sub-nav {
    position: relative;
    display: inline-block;
    padding: 1px 10px 1px 10px;
    text-align:left;

}


.current {color:#67533E;}
.current:before {
    content: "-";
    margin-left: -1.1em;
/*    display:inline-block; */
    width: .8em;
   /* font-size: 1.3em\9;  Hurra! ein IE8 Hack */
    line-height: 1.5; /* der IE braucht das, weil er sonst zappelt */
}

.sub-nav .current {margin-bottom: .3em; margin-left:0;}
.sub-nav .current:before {margin-left: .3em;}


/* focus/open states of first descendant link within a top level
   navigation item */
.nav-item > a:focus,
.nav-item > a:hover,
.nav-item > a.open {
        /* background-color: #555; */
}

/* open state of first descendant link within a top level
   navigation item */
.nav-item > a.open {
    background-color: #fff;
        /*width: 95%;*/
    z-index: 1;
    margin: 0 0 -1px 0; /* son Scheiss fuern IE */

}

/* sub-navigation panel */
.sub-nav {
    position: absolute; /* das fuer mobile weg */
    display: none;
    padding: 10px 20px 10px 20px;

    background-color: #fff;
    opacity: 0.9;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
        /* min-width: 20em; z. B. um mehrspaltiges Submenu zu erzwingen */
        /*box-shadow: 0px 4px 5px rgba(0,0,0,0.5);*/
}

ul.sub-nav-group {
 min-width: 12em; /* der IE8 braucht das */
}

/* sub-navigation panel open state */
.sub-nav.open {
    display: block;
}

.sub-nav.open li a {
    padding: 1px 20px 5px 20px;
}

/* list of items within sub-navigation panel */
.sub-nav ul {
    display: inline-block;
    vertical-align: top;
}

/* list item within sub-navigation panel */
.sub-nav li {
    display: block;

}

.sub-nav-left {border-right: 1px solid }


footer {
        color:white;
        background-color: #fff;
        margin-top: 1em;
        padding: .1em 1em .5em .5em;
        text-align:right;
}

footer li {display:inline;}
footer li a {color: #fff; text-decoration:none;}

/* den Skiplink zum Player verstecken, auch vor SR: */
.ywp-position-offscreen {display:none !important;}


/* Pill style */
#scrollUp {
        bottom: 1em;
        color: #222;
        text-decoration: none;
        font-size: 2em;
        line-height:.8em;
        outline:none;

        opacity: 0.6;
        right: 20px;
        border: 3px solid #222;
        border-radius: 1em;
        background: #fff;
        padding: 7px;
        height: 1em;
        /* width:1em; */
}


#scrollUp:hover { /* kein focus, weil sonst dieser Stil permanent? */
        background-color: #aaa;
        border: 3px solid #fff;
        color: #fff;
}


@media only screen and (max-width: 1200px) {
        body {
                width:100%;
                /*max-width: 58em;*/
        }
    .f-nav {
                width:98% !important;
                max-width: 68.2em !important;
        } /* max-width: 58 / 0.8 */
        /*#navi {font-size:80%;} */
    .nav-item a, noscript li, .current, .current.sub-nav {
                padding: 10px 10px 10px 15px;
        }
}

/* damit der rechte Rand von mehrspaltigen Subnavis nur bei Bedarf gezeigt wird.
Schwellenwert duch Versuche ermittlen */
@media only screen and (max-width: 819px) {
        .sub-nav-left {border-right: 0; }
}


@media only screen and (max-width: 1200px) {
        body {padding-top: 0; margin:3em auto 1em auto;}

        .f-nav{position: static; border-top: 0; width: 100% !important;} /* fixed menu auch wenn nicht mob */
        #inhalt {margin:0 !important;}
        #menu_hinweis {display:block !important;}




        #klapp_hide, #klapp_show dfn, #klapp_hide dfn {display:none;}
        #hamburger {display:block; text-align:right; margin-right: 5px; width:100%;right:0;background:#fff; }
        #hamburger img {margin-right: .4em;}
        #hamburger span {font-size: .55em; margin-top: -40px; margin-right: 9px; display:block;}

        #navi {display:none;font-size: .9em; background:#fff; margin-bottom:10em;}
        #klapp_show {display:block;}



    .nav-item {
            display: block; width: 99%;
            /* border-bottom: 1px solid; */
            border-bottom: 1px solid #fff;

        }

    .sub-nav {
            position: static; width:94%;
            opacity: 1;

    }



    .sub-nav li  {
                font-size:20px;
                padding: 10px 0 4px 6%;
                width: 100%;
                /* border-top:1px solid #888; */
    }
    .sub-nav-group, .sub-nav-group li, .sub-nav-group li a {
            display: block !important;
                width: 97%; /* damit die ganze Breite tapbar ist */

    }

    .nav-item > a.open {
            width: 94%;
            /* border-bottom: 1px solid #aaa; */
            background-color: #fff;
        }

    .nav-item > a, .sub-nav {
            padding: .5em 0 .5em 6%;
        }

        .sub-nav.open li a {
            padding: 0 20px 0 20px;
        }



        .nav-item > a:focus,
        .nav-item > a:hover,
        .nav-item > a.open {
                background-color: #fff;
                width: 95%;
        }
        .nav-menu {padding-left:0;}
        .nav-menu a {display:block;}

        .nav-menu a:hover:before,
        .nav-menu a:focus:before {
    /*        margin-left: -.65em;
            width: .65em;
            line-height: 1.2em;
            margin-left: -.8em;
            width: .8em; das macht die Navi fuer VO kaputt */
            display:none;


        }
        .nav-item a span {
            position:absolute;
                left:-9000px;
                overflow:hidden;
                display:inline;
                width:0;
                height:0;
    }

    .sub-nav-left {border-right: none }
        .current {width: 90%; margin-left: 0;}
        .current:before {content:"";line-height: .7em; margin-left:.3em;}
        .current:after {content: "";}
        .sub-nav .current {margin: -.2em;}
        #navi .hinweis {
                color:white;
                background-color: #666;
                padding: .1em 1em 1em;

        }

        a#skip {
        padding-top: 0; }

        .skiplink {display:none;}

        /* Pill style */
        #scrollUp, #scrollUp:hover {
                font-size: 2.5em;
                bottom: 1em;
                right: .2em;
                border: 0;
                padding:0;
                background:transparent !important;
                opacity: .7;
                color: #454;
                text-decoration:none;
        }



}