/*Layoutdefinitionen für gesamtes Dokument-------------------------------------*/
/*Hexcodes Farben
 color: #2d6b99; Maiblau Dunkel
 color: #88aa00; Maigrün Hell
 */
 /*Ggf. vorhandene Browserspezifische Ansicht eliminieren*/
ul, li {
  display: block;
  padding: 0em;
  margin: 0em;
}
/*Einteilung des Seitenbereichs in ein Raster mit 2 Spalten und 5 Zeilen*/

body {
  background-color:rgb(255, 255, 255);
  display: grid;
  grid: "bild gruss"
        "deko1 deko1"
        "nav article"
        "deko2 deko2"
        "footer footer"
        /2fr 6fr;
  column-gap:1em;
  row-gap:10px;
  min-height:100vh;
  font-family:Helvetica;
}
/*Abfrage der Bildschirmgröße und darauf angepasste Darstellung*/
/*@media (min-width:25em){
  body{
    grid: "bild gruss"10em 40em
          "deko1 deko1"10em 40em
          "nav article"10em 40em
          "deko2 deko2"10em 40em
          "footer footer"10em 40em
    /2fr 6fr;
    min-height:75vh;
  }
}
@media (min-width:50em){
  body{
    grid: "bild gruss" 10em 40em
          "deko1 deko1"10em 40em
          "nav article"10em 40em
          "deko2 deko2"10em 40em
          "footer footer"10em 40em
    /2fr 6fr;
    min-height:50vh;
  }
}/*
/*Gestaltung des Headerbereichs....................................................*/
bildlogo img {
  grid-column:1/2;
  grid-row:1/2;
  /*align-self:center;
  justify-self:center;*/
  max-width:100%;
  height:auto;
}

gruss {
  grid-column:2/3;
  grid-row:1/2;
  font-size: 1.75em;
  font-weight: bold;
  color: #2d6b99;
  align-self:self-end;
}

bildslogan img {
  grid-column:2/3;
  grid-row:1/2;
  max-width:100%;  
  height: auto;
}

bildinside img {
  grid-column:2/3;
  grid-row:2/2;
  max-width:100%;
  height:auto;
}
/*Unterteilung des Ansichtsbereichs mit Hilfe einer Zierleiste.....................*/
deko1{
  grid-column:1/3;
  grid-row:2/3;
  align-self:center;
}
/*Darstellung des Navigationsbereichs..............................................*/
nav {
  grid-column: 1/2;
  grid-row:3/4;
 /* background-color:white;*/
  margin-left:1.5em;/*Abstand des Inhalts zum linken Kastenrand*/
  margin-right:0.5em;/*und rechts auch a bissel*/
  width:max-content;
  vertical-align:center;
}
/*Ungeordnete Liste*/
nav ul {
  flex-direction: column;
  align-self: center;
  box-shadow:10px 10px 3px 0px #2d6a99;
  padding:1.5em;
}
/*Ausrichtung der Liste*/
nav li {
  /*box-shadow:3px 3px 1px 0px coral;*/
  display:list-item;
  list-style-position: inside;
  list-style:circle;
  line-height:1.5em;
  margin:1em;
}
/*Erscheinungsbild der Links*/
nav a {
  display: block;
  font-weight: bold;
  font-size: 1.5em;
  color: black; 
  border-spacing: 1em;
  padding:0.2em;
}
/*Darstellungsvariante des "Links" für die aktuelle Seite........................*/
nav li[aria-current] a {
  text-decoration:none;
  font-weight:bold;
}
nav li[aria-current] a:focus,
nav li[aria-current] a:hover {
  text-decoration:none;
  font-weight:bold;
  background-color:rgb(53, 172, 252);
}
/*Was mit dem Link passiert, wenn die Maus drübergeht*/
nav a:focus,
nav a:hover
/*nav li[aria-current] a:focus,
nav li[aria-current] a:hover*/ {    
  color:black ; 
  background-color: #88aa00;
  transition: all.25s ease-in;
}
/*Ansicht des Haupt-Textbereichs*/
article {
  grid-column: 2/3;
  grid-row:3/4;
}
/*Überschrift*/
maihead {
  color: black;
  font-size: 1.75em;
  font-weight: bold;
  text-align: left;
}
/*Hervorgehobener Spezialtext in schwarz*/
overview {
  display: block;
  font-size: 1.25em;
  color: black;
  font-weight: bold;
  max-width:50em;
}

/*ganz normaler Text*/
textnorm {
  display: block;
  color: #2d6a99;
  font-size: 1.25em;
  text-align: justify;
  writing-mode: horizontal-tb;
  -webkit-hyphens: auto;
  hyphens: auto;
  max-width:50em;
  line-height:1.25em;
}
/*Hervorhebung im Textverlauf durch span*/

.wichtig{
  font-weight:bold;
}

.extrawurst{
  font-style:italic;
}

.center{
  font-weight:bolder;
  text-align:center;
}

/*Liste für normalen Text*/

.liste{
  /*color:#2d6b99;*/
  color:#2d6a99;
  list-style-type: disc;
  list-style-position:inside;
  font-size:1.25em;
}
.liste li{
  display:list-item;
  list-style-type: disc;
  list-style-position:inside;
  margin-left:1em;
}
/*Hervorhebung eines extra Textbereiches durch Kasten*/
textaktuell{
  display:block;
  border:0.1em;
  border-color:#2d6a99;
  border-style:solid;
  box-shadow:10px 10px 3px 0px #2d6a99;
  background-color:white;
  padding:0.5em;
  color: black;
  font-size: 1.25em;
  text-align: start;
  writing-mode: horizontal-tb;
  max-width:50em;
  line-height:1.25em;
}

/*Absetzung des unteren Bereichs durch Zierleiste*/
deko2{
  grid-column:1/3;
  grid-row:4/5;
  align-self:center;
}
/*Layoutdefinitionenen für den Footer-Bereich-----------------------------------*/
/*Lage, Größe, usw.*/
footer { 
  grid-column: 1/3;
  grid-row:5/6;			
  font-size:smaller;
  margin-bottom: 10px;
}