body {
  font-family:'arial',sans-serif;
  color: #3A3C69;
  font-size:1em;
background-image:url(texture07.jpg);                    /*  texture09.jpg    */
background-color:#B0C4DE;
background-repeat:repeat;
background-attachment:fixed;
background-position:left top;
margin:10px;
}

div#wrapper {
  background-color:#FAEBD7;
  background-image:url(texture07.jpg);
  border: #3A3C69 1px solid;
  margin: 0px auto;
  max-width: 50em;
  display: flex;
  flex-flow: row wrap;
}

header {
  width:100%;  
  border: 0px solid;
  padding:3% 6% 0 6%;
  text-align:center;
  margin:0;  
  flex: 1 100%;
  align-items:center;
  }

.sticky {
  position:sticky;
  top: 0; /* Element bleibt oben im Viewport */
}


/*  Schriften   */
h1 {font-family:"baskerville";padding-bottom:0px;padding-top:0;}             /*   2em   */
h2 {padding-bottom:0px;padding-top:0;}                                       /*   1.5em    */
h3 {padding-bottom:0px;padding-top:0;text-align:center;}                                       /*  1.17em   */
h4 {padding-bottom:0px;padding-top:0;text-align:center;}                                       /*   1em   */

/*   schriftgrößen   */
.klein  {font-size:0.9em;}
.super  {font-size:0.7em;}
.superklein  {font-size:0.6em;text-align:justify;}
.link  {color:#3A3C69;font-family:"arial","sans-serif";font-size:0.9em;}

img{
max-width:80px;
border-top:#ffffff 1px solid;
border-right:#3A3C69 1px solid;
border-bottom:#3A3C69 1px solid;
border-left:#ffffff 1px solid;
margin-bottom:0em;
}  

main {
  width:100%;
  border: 0px solid;
  padding:0 6%;
  margin:0; 
}



article {
  padding: 10px;
  margin: 0px;
  border: 0px solid red;
}

footer {
  width:100%;
  border: 0px solid;
  padding:0 6% 6% 6%;
  text-align:center;
}

/*   Linien   */
hr {background-color:#3A3C69;height:1px;border:0px;}                               /*    #666666;   */
.unten{margin-top:2em;}

/*   Ausrichtung   */
.xlfoto  {text-align:center;padding-top:6%;}
.normal_m  {text-align:center;padding:10px;}
.center {text-align:center;}
.justify {text-align:justify;}
.links{text-align:left;padding-left:5%;padding-right:5%;}

/*   Links  */ 
a:link{color:#3A3C69;text-decoration:none;}
a:visited{color:#3A3C69;text-decoration:none;}
a:hover{color:maroon;text-decoration:underline;}                /*  #58ACFA   */
a:active{color:maroon;text-decoration:none;}

[aria-current] {color:maroon;text-decoration:none;}

/* Add your flexbox CSS below here */


article div {
  display: flex;
  flex: 1;
  ustify-content: space-between;
  gap:8px;
}

/* Smart Phones und Tablets mit mittlerer Auflösung */

@media all and (min-width: 600px) {

section {
  display: flex;
}  
article {
  flex: 1;
flex-direction:column;
}

article div{
flex: 1;
flex-direction:column;
gap:30px;
}

article:nth-of-type(2) {
  flex: 2;
}

img {
max-width:100%;
margin:0;
}       
}

/* Large screens */
@media all and (min-width: 800px) {

body {background-image:url(texture03.jpg);}
}

                           
