main {  
        position: relative;
}
    body {
  padding-top: 2em;
  font-family: Georgia, "Times New Roman",
        Times, serif;
  color: purple;
  background-color: #4bc9ff;
  background-image: radial-gradient(circle, #12b886 5%, #ffd43b 95%);
  /*background-image: url(rindviecher.jpg);*/
 }
 
    div.box {padding:0;border:solid; border-width: 
   thick;height:8em; width:45em;left: 2.6em;
   ;background-color: #80FFFF;
    border-radius: 55px;box-shadow: 20px 10px 25px green;
    /*img {vertical-align: middle;}
   transform: rotate(10deg);*/
   }  
   div.box1 { border: solid; border-width: thick;align:"left";
   height: 100%; width: 100%;background-color: #80FFFF;
   border-radius: 10px;box-shadow: 20px 10px 25px blue;
   
    } 
    
           a.button3{
 display:inline-block;
 list-style-type: none; 
 padding:0.3em 1.0em;  /*ButtonGr��e*/
 margin:0 0.3em 0.3em 0;
 border-radius:2px;
 box-sizing: border-box;
 text-decoration:none;
 font-family:'Roboto',sans-serif;
 font-weight:300;
 color:#FFFFFF;
 background-color:#4eb5f1;
 text-align:center;
 transition: all 0.2s;
}
a.button3:hover{
 background-color:#c6129c;
}
@media all and (max-width:30em){
 a.button3{
  display:block;
  margin:0.2em auto;
 }
} 
 #box2{
     background-color: yellow;
    width: 15em; 
    height: 1.2em;
    box-shadow;border-width: thin;
}
#navibereich li {
  display: inline;            /* Listenelemente nebeneinander */
  list-style-type: none;      /* Aufz�hlungszeichen entfernen */
}
#navibereich {
  /*background-color: #F7FFC3;         Hintergrundfarbe f�r die Navigation */ 
  padding: 4px 0;                   /* Innenabstand: oben/unten 4px, li/re 0 */
  /*border-top: 3px solid #668BCC;     Rahmenlinie oben */
 /* border-bottom: 3px solid #668BCC; /* Rahmenlinie unten */
  margin: 1;                        /* Keinen Au�enabstand */ 
}

h1 {
  font-family: Helvetica, Geneva, Arial,
        SunSans-Regular, sans-serif 
        box-sizing: content-box;
        }
       
  
pre{
color:black;
background-color: #F7FFC3;
font-size: 12pt;
}
address {
  margin-top: 1em;
  padding-top: 1em;
  border-top: thin dotted;
  color:red;
   }
.flex-container {
  display: flex;
  flex-direction: row | row-reverse | column | column-reverse | center;
  flex-flow: column nowrap;
  max-width: 65em;
  border: 2px dotted;
  margin: 1em;
    
}
.flex-item {
  background-color: white;
  width: 450px;
  margin: 10px;
  text-align: center;
  line-height: 100px;
  font-size: 50px;
}
.grid-Container {
  display: flex;
  grid-template-columns: 10% 10% 10%; 
  grid-template-rows: 1;
  gap: 1em;
  margin: 0em;
}
/* Abstand nach unten */
h1,h2, p, ul, ol { margin-bottom: 0.5em; }
 /*
html { 
  background-color: whitesmoke; 
  background-image: url(sundown.jpg); 
} */