
/* ==== allgemeine Regeln am Anfang ==== */ 


@font-face {
       font-family: 'oracle';
       src: url(/f/Orc/ABCOracle-Bold-Trial.woff) format(woff);
       src: url(/f/Orc/ABCOracle-BoldItalic-Trial.woff) format(woff); 
       src: url(/f/Orc/ABCOracle-Book-Trial.woff) format(woff);
       src: url(/f/Orc/ABCOracle-BookItalic-Trial.woff);
       src: url(/f/Orc/ABCOracle-Light-Trial.woff2) format(woff);
       src: url(/f/Orc/ABCOracle-Regular-Trial.woff2) format(woff);
       src: url(/f/Orc/ABCOracle-RegularItalic-Trial.woff) format(woff); 
       src: url(/f/Orc/ABCOracle-Thin-Trial.woff2) format(woff); 

}

body { font-family: Helvetica, sans-serif;
       margin: 2px;
       padding: 2px;
   }
   
   header {
       display: flex;
       align-items: center;
       justify-content: space-between;
       color: black; 
       padding: 10px 20px;
   }
  /* ==== H1 Regeln  ==== */  

   h1 { font-family: Helvetica, sans-serif;
       font-size: 25px;
       text-shadow:  0 0 12px chartreuse;
       margin: 0;
   }
    /* ==== Nav Regeln  ==== */  

   nav ul {
       list-style: none;
       padding: 0;
       margin: 0;
       font-size: 13px;
   }
   
   nav ul li {
       display: inline;
       margin-left: 20px;
   }
   
   nav ul li:first-child {
       margin-left: 0;
   }
   
   nav ul li a {
       text-decoration: none;
       color: #fff;
   }

 /* ==== a:link Regeln  ==== */  

a:link { color: black;
       text-decoration: none;
}
        
a:visited { color: black;
        }
        
a:hover,
a:active
a:focus { color: chartreuse;
               font-style: italic;
}

/* ==== Styling für Class Section==== */

.content { flex: 1;
       font-size: 18px;
       margin-top: 12px;
       margin-left: 20px;
       margin-right: 20px;
       font-weight: bold;
}

.beschreibung { 
       font-size: 13px;
       grid-column-start: 2;
       grid-row: 5;
       margin-left: 20px;
       margin-top: 420px;
}

.container { 
       margin-top: 2;
       margin-left: 0;
}
/* ==== Styling für Bescheibung unten ==== */


.grid-container { 
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 20px;
    margin-right: 20px;
    margin-left: 20px;
}

.grid-item {
    font-size: 12px;
    margin-top: 400px;
}





