/* Version 1.19  */
/*               */
/* eigene Überschrift für Jahreszahlen bei Chronik */
/* eigene DIV ID für galerie.html */
/* eigenes Design für Cookie setzen in index.html - nicht auf Server getestet*/
/* ohne Rahmen bei Neues */
/* mit höherem Footer  */
/* fester Abstand nach einem Artikel */
/* fester Abstand am Ende einer Seite */  
/* neu Klasssen: inhaltheadline1 und  -2 als neue Überschriften verwendet */
/* neu Klassse: inhaltheadline0 als neue erste Überschrift einer Seite verwendet */
/* neu Zeilenabstand größer als 1.2 bei #inhalt und #neues verwendet */
/* neu Klassen Farblinkinhalt und Farblinkfuss Definition fester Linkfarben  */
/* neu Klasse kopfbild ist nun mit weiss hinterlegt  */
/* neu kein Hintergrundbild mehr sondern Grau-Farbverlauf  */
/* Aufzaehlungen haben mehr Abstand untereinander  */
/* Korrektur .abskl */

* {
    margin: 0;
    padding: 0;
    
}

html, body {
    height: 100%;    
    margin-top: 1px;  /* Scrollbalken immer erzwingen ; somit kein horizontales Springen mehr bei kleineren Inhalten */
    text-align: center;
  /*  background-image: url(../pic/background.jpg);   */
  /*  background-image: linear-gradient(180deg, #b30000 60%, #00487d 100%);   */
  /*  background-image: linear-gradient(to right top, red, black);    */
  background-image: linear-gradient(180deg, #B1B1B1 30%, #F1F1F1 100%);
	
  /*  background-image: linear-gradient(180deg, #F1F1F1 30%, #B1B1B1 100%);  */
   
    background-attachment: fixed;
    background-repeat: no-repeat;

    /* background-repeat: repeat-x; */
    font-family: Arial, Verdana, sans-serif;       /* Schriftart */
}

header, nav, footer, aside, section {                  /* HTML5 Elemete als Blockelement Definition   */
    display: block;
}
#wrapper
{
 width: 1077px;                                      /* 1044 breite der Bilder + 5*3 Abstand */
 text-align: center;
 margin: 0 auto; 
 
}  


.kopfbild
{
    
    

    margin: 0 auto;                       /* mittige Anordnung */            
  
    background-color: white;           /* weiss wegen Logo */   

    
    height: 123px;                                    /* neu 120px höhe und 3px */
  
   
    
}

.kopfbild img
{
  /* display: inline ;                           */ 

 padding: 3px;                         /* 3 Px Abstand Bilder untereinander */
 padding-bottom: 0px;             /* Bilder kommen direkt oberhalb Navigation */

  float: left
  
}

.clear {
    clear: both;                  /* float Eigenschaft zurücksetzen */
}

.navi
{
  
    position: -webkit-sticky;
    position: sticky;
    top: 1px;        
    width: 100%;
   
    
    background-color: gray;           /* grau */
    color: white; 
    background-image: url(../pic/grau-50.png);
    height: 24px;
    /* position: fixed;  */     /* geht nicht */
    
}



.navi ul {
    list-style-type: none;
}

.navi li {
    display: inline;
}

.navi a {
    display: block;
    width: 134px;
  
    float: left;
 
    text-align: center;
    line-height: 24px;
    color: white;
    text-decoration: none;
  
    

}

.navi a:hover {
  background-image: url(../pic/grau-50.png);

} 
 
#seite {
    position: relative;
    
    min-height: 100%;                 /* Seite beschreibbar bis nach unten zum Fuss */
    /* width: 1200px;       */
    margin: 0 auto;
   /* background-color: #FFFAF0;           froralweis */
    background-color: white;               /* neu weiss */
 
    
    
}
 

 
#inhalt {
   float: left;
    
    width: 772px;
    background-color: white;
    line-height:1.3;            /*neu 1.3 Zeilenabstand */
   
    padding-left: 0.5em;
    padding-right: 0.5em;
    padding-bottom: 2em;
    text-align: left;
    border: solid;
    border-width: 1px;
    border-color: #BEBEBE;            /* grau */

    /* neu */
    min-height: 100%;                 /* Seite beschreibbar bis nach unten zum Fuss */
    height: auto !important; /* important Befehl (bei modernen Browsern */
    height: 100%; /* IE soll wie gewünscht interpretieren */  
   /*  overflow: hidden !important; /* Firefox Scrollleiste */     */

    
} 

/* neu */
a.Linkfarbinhalt:link {color: #0066b3; }       /* Endeavour hellblau */
a.Linkfarbinhalt:visited {color: #00487d; }   /*Congress blue dunkelblau */
a.Linkfarbinhalt:hover {color: gray; }
a.Linkfarbinhalt:focus {color: #8B008B; }   /* Darkmagenta */
a.Linkfarbinhalt:active {color: #8B008B; }    /* Darkmagenta */




#imageline {                                                /* Austausch Bilder Startseite ?    */
float:left;
margin-left: 0.20em;
margin-right: 0.6em;
margin-top: 0.1em;
}

#testlinks {                                             /* Txxt nach CSS Bildtausch links schreiben ?   */
float:left;
margin-left: 0.20em;
margin-right: 0.6em;
margin-top: 0.1em;
}


 
#inhalt img {        /* setzt generell alle Bilder unter div inhalt mit diesen Abständen  */
float:left;
margin-left: 0.20em;
margin-right: 0.6em;
margin-top: 0.1em;
}







#inhalt ul {                                   /* margin-left geht nicht */
float: none;
margin-left: 2.20em;
margin-right: 0.6em;
margin-top: 0.1em;
}   
 

#inhalt li {                                   /* Aufzaehlungen haben mehr Abstand untereinander */
margin: 0.6em;
}   


.neuesueb {                                              /* Haupt Überschriften Neues */

    width: auto;
    padding: 0.5em;                       /* Abstand Schrift vom Rahmen */
    margin: 0.15em;                        /* Abstand oben und links  */
    margin-bottom: 1.0em;                  /* Abstand unter Ueberschrift */

    color: black;
    /* background-color: #EE4000;               /* OrangeRed2 */

    font-size:13pt;                            /* Größe 13pt   */
    text-align: left;
    
    
    
    /* border-top: #00CD00 0.12em solid;        green3 */
    /* border-left: #00CD00 0.12em solid;       green3 */
    
    
    
    border-top: #ff0000 0.12em solid;        /* red */
    border-left: #ff0000 0.12em solid;       /* red */
    
    /* border-bottom: ...; */
    /* border-right: ...;   */

}


.absgr {                                              /* fester großer Abstand nach einem Artikel */

    width: auto;
    padding: 0.5em;                       /* Abstand Schrift vom Rahmen */
    margin: 0.15em;                        /* Abstand oben und links  */
    margin-bottom: 5.0em;                  /* Abstand unter Ueberschrift */
}

.abskl {                                              /* fester kleiner Abstand nach einem Artikel z.B. Startseite */

    width: auto;
    padding: 0.5em;                       /* Abstand Schrift vom Rahmen */
    margin: 0.15em;                        /* Abstand oben und links  */
    margin-bottom: 2.0em;                  /* Abstand unter Ueberschrift */
}


.absende {                                              /* fester kleiner Abstand nach letztem Artikel auf Seite */

    width: auto;
    padding: 0.5em;                       /* Abstand Schrift vom Rahmen */
    margin: 0.15em;                        /* Abstand oben und links  */
    margin-bottom: 25.0em;                  /* Abstand unter Ueberschrift */
}


#neues {

    
    height: auto !important; /* important Befehl (bei modernen Browsern */
    height: 100%; /* IE soll wie gewünscht interpretieren */
    min-height: 100%; /* Mindesthöhe auf 100 % (bei modernen Browsern) */
    float: right;
   
    width: 277px;
    /* background-color: #FFFAFA;                 #FFFAFA schneeweiss */
    background-color: white;                       /* neu weiss */
    
  
    padding-left: 0.5em;
    padding-bottom: 2em;
    line-height:1.3;            /*neu 1.3 Zeilenabstand */
    text-align: left;
    border: none;
    border-width: 0px;
    border-color: #BEBEBE;            /* grau */


   
} 

#neu1 {
  margin-bottom: 1.0em;
  font-size:1.04em;                           /* Größe 1.1em TEST */ 
}


#neu1 a {
color: black;
text-decoration: none;

}

#neu1 a:hover {
color: gray;
text-decoration: none;

} 



#neu2 {
 margin-bottom: 1.0em;
}
 
   
#neu2 a {
color: darkblue;


}

#neu2 a:hover {
color: gray;
text-decoration: none;

}


#neu3 {
 margin-bottom: 1.0em;
}

#neu3 a {
color: black;
text-decoration: none;

}

#neu3 a:hover {
color: gray;
text-decoration: none;

}

#neu4 {
 margin-bottom: 1.0em;
}
 
   
#neu4 a {
color: darkblue;
}

#neu4 a:hover {
color: gray;
text-decoration: none;

}

.inhaltueb {                                              /* Haupt Überschriften Inhalt */

    width: auto;
    padding: 0.5em;                       /* Abstand Schrift vom Rahmen */
    margin: 0.15em;                        /* Abstand oben und links  */
    margin-bottom: 1.0em;                  /* Abstand unter Ueberschrift */

    color: black;
    background-color: #00CD00;               /* green3 */

    font-size:12.5pt;                            /* Größe 12.5pt   */
    text-align: left;
    border-top: red 0.12em solid;
    border-left: red 0.12em solid;
    /* border-bottom: ...; */
    /* border-right: ...;   */

}

.inhaltueb1 {                                              /* Haupt Überschriften Jahreszahlen bei Chronik */
                                                                /* Absage Text wegen Corona Krise */

    width: auto;
    padding: 0.0em;                       /* Abstand Schrift vom Rahmen */
    margin: 0.0em;                        /* Abstand oben und links  */
    margin-bottom: 1.0em;                  /* Abstand unter Ueberschrift */
    margin-top: 2.0em;                  /* Abstand oberhalb Ueberschrift */
    
    color: darkblue;
    color: #00487d;       /* congress blue */
    background-color: white;               /* green3 */

    font-size:13.5pt;                            /* Größe 13.5pt   */
    text-align: left;
}


.inhaltueb2 {                                              /* Unter Überschriften Inhalt */

    width: auto;
    padding: 0.0em;                       /* Abstand Schrift vom Rahmen */
    margin: 0.0em;                        /* Abstand oben und links  */
    margin-bottom: 1.0em;                  /* Abstand unter Ueberschrift */
    margin-top: 2.0em;                  /* Abstand oberhalb Ueberschrift */
    color: black;
    background-color: white;               /* green3 */

    font-size:13pt;                            /* Größe 13pt   */
    text-align: left;
}


.inhaltheadline0                                  /* Haupt Überschriften Inhalt immer die erste einer Seite */
{
 width: auto;
    padding: 0.0em;                       /* Abstand Schrift vom Rahmen */
    margin: 0.0em;                        /* Abstand oben und links  */
    margin-bottom: 0.3em;                  /* Abstand unter Ueberschrift */
    margin-top: 1.0em;                  /* Abstand oberhalb Ueberschrift */

    color: black;
    background-color: white;               /* weiß */

    font-size:11.0pt;                            /* Größe 11pt   */
    font-weight:bold;                            /* fett */
    text-align: left;


}

.inhaltheadline1                                  /* Haupt Überschriften Inhalt bis auf erste einer Seite */
{
 width: auto;
    padding: 0.0em;                       /* Abstand Schrift vom Rahmen */
    margin: 0.0em;                        /* Abstand oben und links  */
    margin-bottom: 0.3em;                  /* Abstand unter Ueberschrift */
    margin-top: 2.2em;                  /* Abstand oberhalb Ueberschrift */

    color: black;
    background-color: white;               /* weiß */

    font-size:11.0pt;                            /* Größe 11pt   */
    font-weight:bold;                            /* fett */
    text-align: left;
    

}


.inhaltheadline2 {                                              /* Unter Überschriften Inhalt noch nicht benutzt */

    width: auto;
    padding: 0.0em;                       /* Abstand Schrift vom Rahmen */
    margin: 0.0em;                        /* Abstand oben und links  */
    margin-bottom: 0.8em;                  /* Abstand unter Ueberschrift */
    margin-top: 0.3em;                  /* Abstand oberhalb Ueberschrift */
    
    /* color: #b30000;                      bright red */
   
    /* color: #00cc00;                     green */
    color: #008f00;                     /* japanese laurel */
    background-color: white;               /* weiß */

    font-size:14.5pt;                            /* Größe 15pt   */
    font-weight:bold;                            /* fett */
    text-align: left;
}



/*  Design für das Setzen des Coikies auf der Startseite index.html     */ 
#mbmcookie {position: fixed; bottom: 0; left: 0; right: 0; background: #eee; padding: 20px; font-size: 14px; font-family: verdana;}
#mbmcookie a.button {cursor: pointer; background: #ccc; padding: 8px 20px; margin-left: 10px; border-radius: 5px; font-weight: bold; float: right;}
#mbmcookie a.button:hover {background-color: #aaa;}
#mbmcookie p.cookiemessage {display: block; padding: 0; margin: 0;}



#fuss {
    
    position:absolute;
    bottom: 0;
    width: 100%;
    background-color: #D3D3D3;           /* hell grau */
    height: 3.5em;                                    /* vorher 2.2em */
    font-size: 11pt;                                 
    padding-bottom: 0.8em;                /* vorher 0.5em */
    padding-top: 0.8em;                      /* vorher 0.5em */
   
}

/* neu */
a.Linkfarbfuss:link {color: #0066b3; }       /* Endeavour hellblau */
a.Linkfarbfuss:visited {color: #00487d; }   /* Congress blue dunkelblau */
a.Linkfarbfuss:hover {color: #b30000; }      /* Bright Red  */
a.Linkfarbfuss:focus {color: #8B008B; }   /* Darkmagenta */
a.Linkfarbfuss:active {color: #8B008B; }    /* Darkmagenta */




/* eigene ID für Bildergalerie  */


#inhaltgal {
   float: left;
    
    width: 772px;
    background-color: white;
   
    padding-left: 0.5em;
    padding-right: 0.5em;
    padding-bottom: 2em;
    text-align: left;
    border: solid;
    border-width: 1px;
    border-color: #BEBEBE;            /* grau */
    
    
} 

/* Klassen unter inhaltgal  */


.piclink {
  display: inline-block;
  
  margin: 0 5px 10px 5px;
 
  /* line-height: 0; */
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  border: 3px solid #BFBFBF;   /* grey 75 */
  /* -webkit-transition: all 0.1s ease-out; */
  /* -moz-transition: all 0.1s ease-out; */
  /* -o-transition: all 0.1s ease-out; */
  /* transition: all 0.1s ease-out; */
}

.piclink:hover {
  border: 3px solid #5e5e5e;  /* grey37 */
}

.picclass {
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
}