* {
    margin: 0;
    padding: 0;
    font-family: Arial, Helvetica, sans-serif; /* hier wird die Sprache für alles gesetzt */
}

/* Hintergrundbild für die gesamte Seite */
body {
    /* Hier: Festlegzung wo das Menue steht*/
    text-align: center;       /* keine Auswirkung. Wird wahrscheinlich überall überschrieben */
    background-image: url(baseimage/gpl.JPG);
    background_color: white;
    background-attachment: fixed; 
}

/* Festlegungen für angegebene Bereiche */
header, nav, footer, aside, section {
    display: block;  
}

/*---------------------------------------------------------------------------*/
/* Alles ist in einen Rahmen eingebettet auf welchen immer referenziert wird */
#wrapper {
  position: absolute;
  width: 100%; 
  /*height: 100%; */
       /* max und min einsetzen, damit der Text automatisch an das Fenster angepasst wird */
  /*   max-width: 800px;
      min-width: 300px;    */
         /* max-width: 900px;  max und min bewirkt den Zeilenumbruch des Textes 
       min-width: 260px;  */
    /*border: 2px solid red;    hiermit kann man sehen wie groß der Rahmen ist */
    margin: 0;   /* den ganzen Rahmen links setzen */
    /* Ausrichtung gesamter Text innerhalb der Seite (alle bereiche) Ohne left wird er mittig ausgegeben */
    text-align: left;
}

/*---------------------------------------------------------------------------*/
/* Bild im Kopfbereich bzw. hier Text im Kopfbereich*/
header {
    /*background-image: url(baseimage/Siebenbuerger.jpg);  */
    height: 90px;       /* erst nach diesem Abstand fägt der mittlere Teil an */
    width:  800px;
    margin: 0 auto; 
}

header li{
    list-style: none;    /* Sprachlinks ohne Auflistungspunkte anzeigen*/
    padding-left: 10px;  /* die Farbe des Textes der Links muss im index.html festgelegt werden?! */
    font-size: 11pt;     /*   14pt */
}

/* Text im header-Bild */
#logotext {
    /* background-color: transparent; */
     text-align: center; 
     font-style: italic; 
     padding-top: 70px;  /* Abstand der Überschrift von oben */
     color: black;
     font-size: 20pt; 
}

/*---------------------------------------------------------------------------*/
/* Navigationsleiste / Menue */
nav {                           
  position: absolute;
  width: 100%;
  background:  #9ac0cd; /* white; oder hellgrau #eeeeee; oder #9ac0cd;    Hintergrund */
  font-size: 16px;
  box-shadow: 0 0 10px rgba(0,0,0,1);
}

/* first stage */

nav > ul {
  position: relative;
  width: 800px;
  margin: 0 auto;
  padding: 0;
  text-align: center;
}

nav a {
  display: block;
  color: black;    /* hier Text im topmenue */
  text-decoration: none;
}

nav li {                    /* Verwendung noch nicht gefunden */
  display: inline-block;    
  color: #4096ee; 
  list-style: none;
  transition: 0.5s;
}

nav > ul > li > a {
  padding: 2px 25px 2px 25px;
}

nav ul > li.submenu > a:after {          /* erstellt den Pfeil neben dem ausklappbaren menue */
  position: relative;
  float: right;
  content: '';
  margin-left: 10px;
  margin-top: 8px;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid black;
  border-bottom: 5px solid transparent;
}

nav ul > li.submenu:hover > a:after {    /* ändert die Pfeilrichtung  */
  margin-top: 2px;
  border-top: 5px solid transparent;
  border-bottom: 5px solid black;
}

nav > ul > li:hover {
  background: #668A9A; /*#4096ee; Farbe bei ausgewähltem Menue*/
}

/* second stage (the mega-menu) */

nav ul.megamenu {                /* Festlegungen Untermenue */
  position: absolute;
  width: 150px; /* Breite ausgeklapptes Menue 800px; */
  top: -9999px;  /* ohne diese EInstellung bleibt das menue ausgeklappt. Warum?*/
  /*left: 0;   */
  padding: 5px 0px 5px 5px;      /* Abstand Text von oben, rechts, unten, links */
  background: #eeeeee; /* #eeeeee helgrauu wenn nicht ausgewählt.  #9ac0cd; ausgeklappes menue*/
  text-align: left;
 border-top: 5px  solid #c1cdcd; /*  kleine Spalte oberhalb des ausgeklappten menues */
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.5);
  z-index: 1;
}

nav ul li:hover ul.megamenu {
  top: 100%;
}

/* third stage (child-menus in the mega-menu) */

nav .megamenu li {
  display: block;
}

nav .megamenu li a {
     border:3px solid #eeeeee;   
  transition: 0.5s;  
  color: #000;      /* Schriftfarbe aufgeklapptes Menue schwarz */
}

nav .megamenu li a:hover {
   /* color: #0000FF; Schriftfarbe blau oder  dunkelgrau *#668A9A; wenn ausgewählt*/  
   color: black;   
   border:3px solid #668A9A;
   background: #668A9A;
  font-weight: bold; 
}

/*---------------------------------------------------------------------------*/
/* Mittlerer Teil Haupttext */
section {
    padding-top: 50px;   /* Innenabstand oben  */
    margin-left: 40px;   
    margin-right: 250px;     
    line-height: 150%;     /* Zeilenabstand im mittleren Text */
 /*   background-image: url(baseimage/grosspold.JPG);
    height: 190px;
    width:  900px;
  */
}

#sectiontext li { 
    margin-left:20 px;   /* Welcher Text ist dies?   Außenabstand links */  
} 

/*---------------------------------------------------------------------------*/
/* rechter Bereich: Fotos */
aside {
    padding-top: 50px;           /* Innenabstand oben  */ 
    padding-left: 10px;     
    width: 230px; 
    margin-top:6px;
    margin-right: 4px;   
    float: right; 
    position:absolute;             /* am rechten Rand setzen*/
    right: 10px;                  /* Abstand vom Rand */

}

img {
  padding:1px;
  border:thin solid #eeeeee; /* die Fotos sind alle in einen hellen Rahmen eingebettet */
}

#inforight p{
 /* font-style: bold;    */
  font-size: 0.9em;
  /*font-size: 12pt;  */ 
  
}
#inforight a{
   float: right;
}

/* Link Spende */
#inforight a{
  font-style: bold;
  font-size: 1.0em;
}
  
/*---------------------------------------------------------------------------*/
footer {
   background-color: #9ac0cd;  /* hellgrau #eeeeee;   */
   padding-top:3px;                /* Innenabstand oben  */
   padding-bottom:3px;             /* Innenabstand unten */
   padding-left:0px;              /*  Innenabstand links */  
  /* margin-left:20px;       */ 
  /* width:  900px;        */  
   position:absolute;
   bottom: 0;                  /* Fußzeile Absolut am unteren Rand */
   width: 100%;
}

footer a{
   float: right;       /*  inerhalb der Fußzeile steht dieser Text rechts */
   padding-right:20px;    /* mit etwas Abstand zum Rand */
}
footer p{
   padding-left:20px;   
}

/*------- verhindern ------------*/

p span.no {
display:none;
}