/*---------- Anfang Universal ---------------------------*/

* {
    margin: 0;
    padding: 0;
    font-family: Arial, sans-serif;
}

@viewport {
    width: device-width;
    zoom: 1.0;
}
/*---------- Ende Universal -----------------------------*/

/*---------- Anfang Allgemein ---------------------------*/

h1 {
    font-size: 2em;
    text-align: center;
    margin: 2em 0 1em 0;
}

h2 {
    font-size: 1.5em;
    
}

h3 {
    font-size: 1em;
    margin-top: 2em;
    margin-bottom: 1em;
}

h4 {
    font-size: 1.7em;
    text-align: center;
}

.seitenanfang {
    width: 31.25em;
    margin: 0 auto;
    font-size: 0.8em;
}

.seitenanfang a {
    text-decoration: none;
}

body {
    background-image: url(bilder/hg.jpg);
}
/*---------- Ende Allgemein -----------------------------*/

/*---------- Anfang Kopf/Logo ---------------------------*/

#logo {
    border: silver 1px solid;
    width: 45em;
    height: 18.5em;
    background-image: url(bilder/logo72.jpg);
    background-repeat: no-repeat;
    background-position: center;
    margin: 3em auto 0 auto;
}
/*---------- Ende Kopf/Logo -----------------------------*/

/*---------- Anfang Navigation --------------------------*/

nav {
    text-align: center;
    width: 43.75em;
    margin: 1em auto 0 auto;
}

.navikl1 {
    display: none;
}

nav li {
    display: inline-block;
    box-shadow: 1px 1px 6px 3px gray;
    margin: 0 1em;
    
}

nav a {
    display: inline-block;
    list-style-type: none;
    border: black 1px solid;
    border-radius: 2px;
    height: 2em;
    font-size: 1em;
    background-color: lightgray;
    padding: 0.1em 1em;
    color: black;
    font-weight: bold;
    line-height: 2em;
    text-align: center;
    text-decoration: none;
}

nav a:hover {
    color: white;
    background-color: darkgray;
}

.linkinakt:hover {
    color: black;
    background-color: lightgray;
}
/*---------- Ende Navigation ----------------------------*/

/*---------- Anfang Fussbereich -------------------------*/

footer {
    text-align: center;
    width: 45em;
    margin: 1em auto 6em auto;
}

footer li {
    display: inline-block;
    box-shadow: 1px 1px 6px 3px gray;
    margin: 0 1em;
}

footer li a {
    display: inline-block;
    list-style-type: none;
    border: black 1px solid;
    border-radius: 2px;
    height: 2em;
    font-size: 1em;
    background-color: lightgray;
    padding: 0.1em 1em;
    color: black;
    font-weight: bold;
    line-height: 2em;
    text-align: center;
    text-decoration: none;
}

footer a:hover {
    color: white;
    background-color: darkgray;
}

footer p {
    text-align: center;
    margin: 1em 0 0.5em 0;
    line-height: 1.5em;
}

#ssua {
    font-size: 1.6em;
}
/*---------- Ende Fussbereich ---------------------------*/

/*---------- Anfang Inhalt Startseite--------------------*/

/* Anfang Lauftext */
box-sizing: border-box;

@-webkit-keyframes marquee {
 0%   { transform: translate(0%, 0);}
 100% { margin-left:-100%; transform: translate(-100%, 0);}
}
@keyframes marquee {
 0%   { transform: translate(0%, 0);}
 100% { margin-left:-100%; transform: translate(-100%, 0);}
}

.marquee {
    width:600px;
    margin:10px auto;
    padding:2px;
    white-space: nowrap;
    overflow: hidden;
}
.marquee span {
    display:block;
    margin-left:100%;
    width:100%;
    font-size:1.5em;
    color: red;
    text-align:center;
    animation: marquee 30s linear infinite;
    -webkit-animation: marquee 30s linear infinite;
}
/* Ende Lauftext */

#start {
    text-align: center;
}

#alk {
    font-size: 1.3em;
    line-height: 1.5em;
    margin-top: 3em;
}

.blau {
    color: blue;
}
/*---------- Ende Inhalt Startseite ---------------------*/

/*---------- Anfang Inhalt Ansprechpartner --------------*/

#ansprech {
    text-align: center;
    width: 37.5em;
    margin: 0 auto;
    font-size: 1.2em;
}

#ansprech li {
    display: inline-block;
    margin: 0 1em;
}
/*---------- Ende Inhalt Ansprechpartner ----------------*/

/*---------- Anfang Inhalt Gespraechsrunde --------------*/

#ubgespr {
    text-align: center;
}

#gespr dl {
    width: 18.75em;
    margin: 1em auto;
}

#gespr dt {
    font-weight: bold;
    font-size: 1.3em;
    width: 3.75em;
    float: left;
}

#gespr dd {
    margin-left: 4.0625em;
    margin-bottom: 0.5em;
    font-size: 1.3em;
}
/* Einfärbung im Kalender anfang */
.rot {
    color: red;
}
/* Einfärbung im Kalender ende */
/*---------- Ende Inhalt Gespraechsrunde ----------------*/

/*---------- Anfang Inhalt Satzung ----------------------*/

#ubpara {
    text-decoration: underline;
    margin-top: 2em;
    margin-bottom: 1em;
    
}

#satzung {
    width: 43.75em;
    margin: 0 auto;
    line-height: 1.4em;
}

#satzung p {
    margin-left: 1em;
    margin-bottom: 1em;
}

#satzung dl {
    width: 43.75em;
    
}

#satzung dt {
    font-size: 1.2em;
    width: 5em;
    float: left;
}

#satzung dd {
    margin-left: 6.25em;
    margin-bottom: 1em;
}

#satzung ol {
    margin-left: 1em;
    padding-left: 1em;
    margin-bottom: 1em;
}

#satzung ol li {
    padding: 0 0 1em 0.5em;
        
}

#satzung ul {
    margin-left: 1em;
    padding-left: 1em;
    list-style-type: lower-latin;
}

#inkr {
    margin-top: 5em;
}
/*---------- Ende Inhalt Satzung ------------------------*/

/*---------- Anfang Inhalt Impressum --------------------*/

#impr {
    width: 43.75em;
    margin: 0 auto;
    line-height: 1.4em;
}

.ubimph2 {
    margin-top: 2em;
    margin-bottom: 2em;
}

#impr p {
    margin-bottom: 0.5em;
}
/*---------- Ende Inhalt Impressum ----------------------*/

/*---------- Anfang Inhalt Datenschutz ------------------*/

#daten {
    width: 43.75em;
    margin: 0 auto;
    line-height: 1.4em;
}

#daten h2 {
    margin-top: 2em;
    margin-bottom: 2em;
}

#daten p {
    margin-bottom: 1em;
}
/*---------- Ende Inhalt Datenschutz --------------------*/
/*---------------------------------------------------------------*/
/*---------- Anfang responsive design -------------------*/

@media only screen and (max-width: 50em) {
    #logo {
        width: 31.25em;
        height: 12.8125em;
        background-image: url(bilder/logo50.jpg);
        margin: 1em auto 0 auto;
}
    #ubwillk {
        font-size: 1.5em;
}
    nav {
        width: 30em;
}
    nav li {
        margin: 0;
    
}
    nav a {
        height: 1.5em;
        font-size: 1em;
        padding: 0.1em 0.5em;
        line-height: 1.5em;
}
    footer {
        width: 30em;
}
    footer li {
        margin: 0;
}
    footer li a {
        height: 1.5em;
        font-size: 1em;
        padding: 0.1em 0.5em;
        line-height: 1.5em;
}
    #ssua {
        font-size: 1.4em;
}
    .marquee {
        width:300px;
}
    .marquee span {
        animation: marquee 15s linear infinite;
        -webkit-animation: marquee 15s linear infinite;
}
/*---------- Anfang responsive Ansprechpartner ----------*/

    #ansprech {
        font-size: 1em;
}
/*---------- Ende responsive Ansprechpartner ------------*/
    
/*---------- Anfang responsive Satzung ------------------*/
 
    #ubsatz {
        font-size: 1.5em;
}
    #ubpara {
        font-size: 1.2em;        
}
    #satzung {
        width: 35em;
}
    #satzung dl {
        width: 35em;
}
    #satzung dt {
        width: 4.2em;
        font-size: 0.9em;
        font-weight: bold;
}
    #satzung dd {
        font-size: 0.9em;
        margin-left: 5em;
}
/*---------- Ende responsive Satzung --------------------*/
    
/*---------- Anfang responsive Impressum ----------------*/
    
    #impr {
        width: 31.25em;
}
/*---------- Ende responsive Impressum ------------------*/
    
/*---------- Anfang responsive Datenschutz --------------*/
    
    #daten {
        width: 31.25em;
}
/*---------- Ende responsive Datenschutz ----------------*/
}
/*-------------------------------------------------------*/

@media only screen and (max-width: 37.5em) {
    #logo {
        width: 18.75em;
        height: 7.6875em;
        background-image: url(bilder/logo30.jpg);
        margin: 0.5em auto 0 auto;
}
    #ubwillk {
        font-size: 1em;
        text-align: center;
        margin: 1.5em 0 0.8em 0;
}
    nav {
        width: 18.5em;
}
    nav li {
        box-shadow: none;
}
    nav a {
        height: 1em;
        font-size: 0.6em;
        padding: 0.6em 0.3em;
        line-height: 1em;
}
    footer {
        width: 18.5em;
}
    footer li {
        box-shadow: none;
}
    footer li a {
        height: 1em;
        font-size: 0.6em;
        padding: 0.6em 0.3em;
        line-height: 1em;
}
    #alk {
        width: 18em;
        margin-left: auto;
        margin-right: auto;
        font-size: 1em;
}
    footer p {
        margin: 0.5em 0;
        font-size: 0.8em;
}
    #ssua {
        font-size: 1em;
}
    .marquee {
        width:200px;
}
    .marquee span {
        font-size: 1em;
}
/*---------- Anfang responsive Ansprechpartner ----------*/

    #ubansp {
        font-size: 1.5em;
        margin-top: 3em;
}
    #ansprech {
        width: 23em;
        font-size: 0.8em;
}
/*---------- Ende responsive Ansprechpartner ------------*/
    
/*---------- Anfang responsive Gesprächsrund ------------*/
 
    #ubgesp {
        font-size: 1.5em;
        margin-top: 3em;
}
    #ubgespr {
        font-size: 1em;
}
    #gespr dt {
        font-size: 1.1em;
}
    #gespr dd {
        font-size: 1.1em;
        margin-left: 5em;
}
    .seitenanfang {
        width: 20em;
}
/*---------- Ende responsive Gesprächsrund --------------*/
    
/*---------- Anfang responsive Satzung ------------------*/
    
    #ubsatz {
        font-size: 0.9em;
        margin-top: 4em;
}
    
    #ubpara {
        font-size: 0.85em;        
}
    #satzung {
        width: 20em;
        line-height: 1em;
}
    #satzung dl {
        width: 20em;
}
    #satzung dt {
        width: 4.2em;
        font-size: 0.6em;
}
    #satzung dd {
        font-size: 0.8em;
        margin-left: 3.2em;
}
    #satzung p {
        font-size: 0.8em;
}
    #satzung li {
        font-size: 0.8em;
}
    #ubh3 {
        font-size: 0.8em;
}
/*---------- Ende responsive Satzung --------------------*/
    
/*---------- Anfang responsive Impressum ----------------*/
    
    #impr {
        width: 18em;
        font-size: 1em;
        line-height: 1.2em;
        margin: 1em auto 1em auto;
}
    #ubimpr {
        font-size: 1.5em;
}
    .ubimph2 {
        font-size: 1.3em;
        margin: 1em auto;
}
/*---------- Ende responsive Impressum ------------------*/
    
/*---------- Anfang responsive Datenschutz --------------*/

    #ubdaten {
        font-size: 1.5em;
        margin-top: 3em;
}
    #ubdatenh2 {
        font-size: 1.3em;
}
    #daten {
        width: 19em;
        font-size: 1em;
        line-height: 1.2em;
        margin: 0 0.5em;
}
/*---------- Ende responsive Datenschutz ----------------*/
} 
/*-------------------------------------------------------*/
.mb {
    display: none;
}
@media only screen and (max-width: 20em) {
    #logo {
        width: 15.625em;
        height: 6.375em;
        background-image: url(bilder/logo25.jpg);
        margin: 0 auto;
}
    #ubwillk {
        margin-top: 4em;
}
    nav {
        text-align: left;
        width: 10em;
        margin: 0.5em;
}
    nav li {
        display: block;
}
    nav a {
        display: block;
        border-radius: 0;
        text-align: left;
}
    .navikl2 {
        display: none;
}
    .navikl1 {
        display: block;
}
    .navi {
        display: none;
}
    #navmauf:target .navi {
        display: block;
}
    #navmauf:target .mbauf {
        display: none;
}
    .mb {
        background-color: darkblue;
        display: block;
        position: absolute;
        left: 12em;
        top: 7em;
        padding: 0.5em;
        color: white;
        text-decoration: none;
        cursor: pointer;
}
/*---------- Anfang responsive Ansprechpartner ----------*/

    #ansprech {
        width: 21em;
        font-size: 0.6em;
}
/*---------- Ende responsive Ansprechpartner ------------*/
    
/*---------- Anfang responsive Gesprächsrund ------------*/

    #ubgespr {
        font-size: 1em;
}
    #gespr dt {
        font-size: 1em;
        margin-left: 2em;
}
    #gespr dd {
        font-size: 1em;
        margin-left: 5em;
}
/*---------- Ende responsive Gesprächsrund --------------*/
    
/*---------- Anfang responsive Satzung ------------------*/
    
    #ubpara {
        font-size: 0.85em;        
}
    #satzung {
        width: 18em;
        line-height: 1em;
}
    #satzung dl {
        width: 18em;
}
    #satzung dt {
        float: none;
        margin-top: 0.5em;
}
    #satzung dd {
        font-size: 0.8em;
        margin:0;
}
/*---------- Ende responsive Satzung --------------------*/
    
/*---------- Anfang responsive Impressum ----------------*/
    
    #impr {
        width: 17em;
        font-size: 0.9em;
        line-height: 1.1em;
        margin: 0.6em auto;
}
    #ubimpr {
        font-size: 1.5em;
        margin-top: 3em;
}
    .ubimph2 {
        font-size: 1.1em;
        margin: 1em auto;
}
/*---------- Ende responsive Impressum ------------------*/
    
/*---------- Anfang responsive Datenschutz --------------*/

    #ubdaten {
        font-size: 1.4em;
        margin-top: 3em;
}
    #ubdatenh2 {
        font-size: 1.1em;
}
    #daten {
        width: 17em;
        font-size: 0.9em;
        line-height: 1.1em;
        margin: 0 auto;
}
/*---------- Ende responsive Datenschutz ----------------*/
}
/*---------- Ende responsive design ---------------------*/