:root {
  --color-bg: #69F7BE;
  --color-text-main: #000000;
  --color-primary: #FFFF00;
  --wrapper-height: 87vh;
  --image-max-width: 300px;
  --image-margin: 3rem;
  --font-family: "HK Grotesk";
  --font-family-header: "HK Grotesk";
}

/* Basic page style resets */
* {
  box-sizing: border-box;
}
[hidden] {
  display: none !important;
}

/* Import fonts */
@font-face {
  font-family: HK Grotesk;
  src: url("https://cdn.glitch.me/605e2a51-d45f-4d87-a285-9410ad350515%2FHKGrotesk-Regular.otf?v=1603136326027")
    format("opentype");
}
@font-face {
  font-family: HK Grotesk;
  font-weight: bold;
  src: url("https://cdn.glitch.me/605e2a51-d45f-4d87-a285-9410ad350515%2FHKGrotesk-Bold.otf?v=1603136323437")
    format("opentype");
}


/*html {
    background: #293133;
    background-image: image image(rgb(41, 49, 51) 0%, rgb(41, 49, 51) 100%));
    -webkit-font-smoothing: antialiased;
    
    /*min-height: 100%;*/
    /*height: 1500px;*/
}*/


body {
    background: #fff;
    /*box-shadow: 0 0 2px rgba(0, 0, 0, 0.06);
    color: #545454;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 16px;
    
    line-height: 1.5;
    margin: 0 auto;
    width: 80vw;
    
    /*max-width: 900px;*/
   /* padding: 0.5em 2em 2em;
    
    min-height: 100%;
    height: 2100px;*/

}

header {
    background:  #DCdCdC;
    color: azure;
    text-align: center;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 25px;
    width: 100%;
    /*width: 900px;*/
    /*height: 200px;*/
    
    
}

.footer2 {
    text-align: right;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 12px;
    width: 100%;
    /*height: 20px;*/
   
}

.ersterArtikel {
     background: azure;
     color: black;
	float: left;
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        /*padding: 0.5em 0.5em 0.5em 0.5em;*/
    
}

.staerke {
     background: #f6fefa;
     color: black;
	float: left;
        width: 100%;
        /*margin-left: auto;
        margin-right: auto;*/
    
        
}

.was {
     background: #F5FFFA;
     color: black;
	float: left;
        width: 100%;
        margin-left: auto;
        margin-right: auto;
       /*padding: 0.5em 0.5em 0.5em 0.5em; */
    

}

.gescheitert {
     background: #F5FFFA;
     color: black;
	float: left;
        width: 100%;
        margin-left: auto;
        margin-right: auto;
       /*padding: 0.5em 0.5em 0.5em 0.5em; */
    

}

.gescheitert2 {
     background: #F5FFFA;
     color: black;
	float: left;
        width: 100%;
        margin-left: auto;
        margin-right: auto;
       /*padding: 0.5em 0.5em 0.5em 0.5em; */
    
}

.ersterArtikellinks {
float: left;
background: azure;
/*width: 250px;*/
width: 50%;
padding: 0px;
height: 100%;


}

.ersterArtikelrechts {	
float: left;
background: azure;
/*width: 630px;*/
width: 50%;    
padding: 0px;
height: 100%;

}

.divabstand {
background: #fff;
width: 100%;
/*height: 20px;*/
height: 2%; 

}

h1 {
    color: aliceblue
    font-size: 40px;
    text-align: center;
}

h7 {
    color: azure;
    font-size: 1px;
    text-align: center;
    margin-top: 0.1em;
    margin-bottom: 0.1em;
    margin-left: 1em;
    margin-right: 1em;
}

h2, h3, h4, h5, h6 {
    color: #222;
    font-weight: 600;
    line-height: 1.3;
}

h2 {
    margin-top: 0.1em;
    margin-left: 1em;
    margin-right: 1em;
}

a {
    color: #0083e8;
}

b, strong {
    font-weight: 600;
}

samp {
    display: none;
}

img {
    animation: colorize 2s cubic-bezier(0, 0, .78, .36) 1;
    background: transparent;
    /* border: 10px solid rgba(0, 0, 0, 0.12);
    border-radius: 4px;*/
    display: left;
    
    
}
figure {
    text-align: left;
    width: 100%;    
    padding: 0px;
    height: 100%;
}

.level1 {
    color: black;
   
    text-align: center;
	
    font-size: 20px;
    display: inline; /* li nebeneinander anzeigen */
    list-style-type: none;  
     margin: 0 10px 0 10px; 
    background-color: azure;
    padding:1.5% 1% 1.5% 1%;
}

.pstandard {
    color: black;
    text-align: left;
    font-size: 25px;
    /*font-size: 0.9vw;*/
    margin-left: 0.7em;
    margin-right: 0.7em;
}

.navigation{
  text-align: center;
  background-color: #ccddee;
  padding: 1.5% 0px 1.5% 0px;
  width: 100%;
   
 /*line-height: 50px;*/
vertical-align: middle;
 
}

.plink {
    color: blue;
    text-align: right;
    font-size: 14px;
    padding: 0em;
    line-height: 1;	
	margin-top: 0.2; 		
	margin-bottom: 0;
    margin-right: 0.5em;
    
}
.staerke2 {
     background: #f6fefa;
     color: black;
	float:left;
        width: 100%;
        /*margin-left: auto;
        margin-right: auto;*/
    
        margin: -100px;
}

.was2 {
     background: #f6fefa;
     color: black;
	
        width: 100%;
        /*margin-left: auto;
        margin-right: auto;*/
    
        margin: -100px;
}
.wie2 {
     background: #f6fefa;
     color: black;
	
        width: 100%;
        /*margin-left: auto;
        margin-right: auto;*/
    
        margin: -100px;
}
.wer2 {
     background: #f6fefa;
     color: black;
	
        width: 100%;
        /*margin-left: auto;
        margin-right: auto;*/
    
        margin: -100px;
}
.staerke2 {
     background: #ffffff;
     color: black;
	
        width: 100%;
        /*margin-left: auto;
        margin-right: auto;*/
    
        margin: -100px;
}