





/*header {
    background-color:cornflowerblue;
    color: white;
    padding: 1rem;
    background-image: url("uschrift2png.png");
    background-position: right;
    background-size: contain;
    background-repeat: no-repeat;
}*/

header {
    background-color:rgb(22, 167, 56);
    background-image: linear-gradient( rgb(22, 167, 56), rgb(36, 253, 87)) ;
    color: white;
    padding: 1rem; }
    
    
 /*   display:grid;
    grid-template-columns: 1fr 2fr 1fr; 
    grid-template-rows: auto auto;
    grid-template-areas:
    "logo ueberschrift headerrechts"
    "motto";
    justify-content:center} */

 /*   .logo {grid-area: logo; grid-column: 1;
        grid-row: 1}
    .ueberschrift {grid-area: ueberschrift;grid-column:2;
    grid-row:1; text-align: center}
    .motto {grid-area: motto;grid-column:span 3;
    grid-row: 2 }
    .headerrechts {grid-area: headerrechts; grid-column:3;
    grid-row: 1 } 

    .gesamtheader{
        display:grid;
        grid-template-columns: 1fr 2fr 1fr; 
        grid-template-rows: auto auto; 
        grid-template-areas:  
            "logo ueberschrift headerrechts" 
            "motto" ;
        justify-content:center;}
    
    @media screen and (max-width: 55em) { 
        .gesamtheader{
        
        grid-template-columns: none; 
        grid-template-rows: auto auto auto auto;
        grid-template-areas:
        "logo"
        "ueberschrift"
        "headerrechts"
        "motto";
        
        justify-content:center;
        
        order: not;
        width: auto;}
    } */

 /*   .logo {grid-area: logo; grid-column: 1;
        grid-row: 1}
    .ueberschrift {grid-area: ueberschrift;grid-column:2;
    grid-row:1; text-align: center}
    .motto {grid-area: motto;grid-column:span 3;
    grid-row: 2 }
    .headerrechts {grid-area: headerrechts; grid-column:3;
    grid-row: 1 } */
        
      

 /*  .flex-container {display:flex;justify-content: center;}
        .flex-item {text-align: center;}*/
        .flex-container {display:flex;}
        .flex-item {justify-content: center;}
   
    
    
        @media screen and (max-width: 55em)
          {
            div {display: flex; flex-direction: column; text-align: center; align-items:center} 
        
         
            
        }
      

    
  h1{text-align: center}
    h2{text-align: center} 
        
    
    html {
        height: 100%;
      }
      
      body {
        height: 100%;
        display: flex;
        flex-direction: column;
      }
      
    main {
        flex: 1;
      }       

    


    /*background-image: url("css/uschrift2png.png");
    background-position: right;
    background-size: contain;
    background-repeat: no-repeat;*/
    


h1 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 3rem;
    color:white;
}

h2 {
    font-family: mistral, "Segoe UI", Roboto, -apple-system;
    font-size: 2.5rem;
    font-weight:100;
    color: black;
    
}



h3 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 2rem;
    color: rgb(22, 167, 56);
}

h4  {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.5rem;
    color: black;
    padding-top: 0;
}

nav li {
    display: inline;
    margin-right: 0.5rem;
    font-size: larger;
}

nav {
    background-color: blueviolet;
    color: white;
    padding: 0.5rem;
   /* margin: 1rem 0;*/
}

nav ul {
    padding: 0.25rem;
    margin: 0;
}

nav a {
    color: white;
    text-decoration: none;
}


footer {
    background-color: blueviolet;
    color: white;
    text-align: center;
    padding: 0,5rem;
    margin-top:auto;

}

footer a {
    color: white;
    text-decoration: none;

}

.content_index li{
    font-family: comic, "Segoe UI", Roboto, -apple-system;
    font-size: x-large;
    padding-left: 1rem;   
}

.content_index_flexbox{
    display: flex;
    flex-direction:row; align-items:stretch; align-content:center;justify-content: space-evenly;
    @media all and (max-width:55em) {flex-direction:column};
    
}

.content_vermittlung_flexbox{
    display:flex; flex-direction: column; align-items:stretch; justify-content: space-evenly;
    background: url("bretter2.png") no-repeat;
    -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.content_vermittlung ul{
    display: flex;
    justify-content: flex-start;
    align-items: stretch;
    list-style: none;
    background: url("bretter2.png") no-repeat; 
 -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;}

    .content_vermittlung li{
    font-family: comic, "Segoe UI", Roboto, -apple-system;
    font-size: x-large;
    /*padding-left: 1rem;*/
    font-weight: bolder} 
    

    .content_fundkatzen ul{
    display: flex;
    justify-content: flex-start;
    align-items: stretch;
    list-style: none;
    background: url("bretter2.png") no-repeat; 
 -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


    .content_fundkatzen li{
    font-family: comic, "Segoe UI", Roboto, -apple-system;
    font-size: xx-large;
    font-weight:bolder;
    padding-left: 1rem;
    
    }  

 

  /*  .content_wir ul {display: flex;
        justify-content: flex-start;
        align-items: stretch;
        list-style: none;
        background: url("bretter2.png") no-repeat; 
     -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;}*/

      .content_wir 
       
        p{
        font-family: comic, "Segoe UI", Roboto, -apple-system;
        font-size: x-large;
        /*font-weight:bolder;*/
        /*padding-left: 1rem;*/
      }

      .content_vermittlung1 p{
        font-family: comic, "Segoe UI", Roboto, -apple-system;
        font-size: x-large;}