* {box-sizing: border-box;}

html {height: 100%;scroll-behavior: smooth;}

body {
    width: 100%;
    margin: 0;
    padding: 0;
    font-family: 'Roboto', sans-serif;
    color: #555;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    hyphens: auto;
    font-size: 1.25em;
    line-height: 1.75em;
}

@media screen and (max-width:700px) {
    body {font-size:1.1em;line-height:1.6em;}
}

/* Fonts */
/* roboto-100 - latin */
@font-face {
  font-display: swap; 
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 100;
  src: url('fonts/roboto-v32-latin-100.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-100italic - latin */
@font-face {
  font-display: swap; 
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 100;
  src: url('fonts/roboto-v32-latin-100italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-300 - latin */
@font-face {
  font-display: swap; 
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/roboto-v32-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-300italic - latin */
@font-face {
  font-display: swap; 
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 300;
  src: url('fonts/roboto-v32-latin-300italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-regular - latin */
@font-face {
  font-display: swap; 
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/roboto-v32-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-italic - latin */
@font-face {
  font-display: swap; 
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 400;
  src: url('fonts/roboto-v32-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-500 - latin */
@font-face {
  font-display: swap; 
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: url('fonts/roboto-v32-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-500italic - latin */
@font-face {
  font-display: swap; 
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 500;
  src: url('fonts/roboto-v32-latin-500italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-700 - latin */
@font-face {
  font-display: swap; 
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/roboto-v32-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-700italic - latin */
@font-face {
  font-display: swap; 
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 700;
  src: url('fonts/roboto-v32-latin-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-900 - latin */
@font-face {
  font-display: swap; 
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 900;
  src: url('fonts/roboto-v32-latin-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-900italic - latin */
@font-face {
  font-display: swap; 
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 900;
  src: url('fonts/roboto-v32-latin-900italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* Main */
.main1 {
    width:100%;
    max-width:1000px;
    margin:25px auto 25px auto;
    text-align: center;
    padding:20px;
}
.main1 h1 {
    font-size: clamp(2em, 5vw, 6em);
    line-height: clamp(2em, 3.5vw, 4em);
    font-weight:400;
    margin:0 0 25px 0;
}
.main1 h2 {
    color:#D30030;
    font-weight:400;
    border-bottom:1px solid silver;
    line-height: 3rem;
}
h2.startueberschrift {
    font-size: clamp(1.3em, 1.65vw, 2em);
    line-height: clamp(1.25em, 1.5vw, 1.75em);
    color:#333;
    font-weight:300;
    border:none;
}
.main1 h3 {
    font-weight: 300;
    font-size:1.2em;
    color:#0B436D;
}
.main1 p {
    margin:3rem auto;
    column-count: 2;
    column-gap: 30px;
    text-align: justify;
}
.main1 p.blocksatz {
    text-align:justify;
    column-count: 1;
}
.projektlogo {
    animation: fadedown 3s;
}
/*.fadedown {
    animation-name: fadedown;
    animation-duration: 5s;
    animation-iteration-count: 2;
    animation-timing-function: ease-in-out;
}*/
@keyframes fadedown {
    from {transform:translate(0%, -50px);opacity: 0;}
    to {transform: translate(0%, 0px);opacity: 1;}
}

.main2 {
    width:100%;
    background-color:#efefef;
}
.foerderung {
    max-width:1000px;
    margin:2rem auto 0 auto;
    padding:1rem;
    text-align: center;
}
.haftungsausschluss {
    max-width:1000px;
    margin:2rem auto 0 auto;
    padding:1rem;
}
.haftungsausschluss p {
    color:#333;
    border: 1px solid silver;
    padding:1rem;
}
.text_linksbuendig {
    max-width:1000px;
    margin:2rem auto 0 auto;
    padding:1rem;
    text-align: left;
    color:#003398;
}
.graubereich {
    max-width:1000px;
    margin:0 auto;
    text-align: center;
    padding:2rem 0.5rem 0.5rem 0.5rem;
    width:100%;
}
.graubereich_impressum {
    max-width:1000px;
    margin:0 auto;
    text-align: left;
    padding:1rem;
    width:100%;
}
.graubereich_impressum h3, h4 {
    color:#003398;
}
.graubereich_impressum p {
    text-align:justify;
    column-count: 1;
}

.modul-flexbox {
    width:100%;
    max-width:1000px;
    margin:0 auto;
    display:flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding:2rem;
}
.modul-item-1 {
    width:63.5%;
    padding:1rem;
}
.modul-item-2 {
    width:33.5%;
    padding:1rem;
}

.modulbild {
    max-width:1000px;
    margin:3rem auto 0 auto;
    text-align: left;
}
.modulbild img {
    max-width:100%;
    height:auto;
}
.modullink {
    width:100%;
    background-color:#efefef;
    padding:1rem;
}

/* Seite Kontakt */
.kontakt-flexbox {
    width:100%;
    max-width:1000px;
    margin:0 auto;
    display:flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding:0rem;
}
.kontakt-item {
    width:45%;
    text-align:left;
    margin-bottom: 2rem;
}
.kontakttext {text-align:left;margin-left:70px;}

/* Seite Teams */
.team-flexbox {
    width:100%;
    max-width:1000px;
    margin:2rem auto;
    display:flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}
.team-item-1 {
    width:48.5%;
    text-align:center;
    margin-bottom: 2rem;
}
.team-item-2 {
    width:48.5%;
    text-align:left;
}
.verantwortliche {
    margin:0 auto;
    max-width:375px;
    text-align: left;
}

/* Links*/
.linkpfeil {
    color:#D30030;
    font-size:smaller;
}
.textlink, .textlink:visited, .textlink:active {
    color:#003398;
    text-decoration: none;
    border-bottom:1px dashed #D30030;
}
.textlink:hover {
    color:#D30030;
    text-decoration: none;
    border-bottom:none;
}
.mutschrift {
    color:#003398;
    background-color: #fafafa;
    padding:1px;
}

/* Bilder */
.maxauto {
    max-width:100%;
    height:auto;
}
.bildsub {
    font-style: italic;
    font-size:0.75em;
    line-height: 1em;
    text-align: left;
    column-count: 1;
    margin:0;
}
.smalltext {
    font-style: italic;
    font-size:0.75em;
    line-height: 1.25em;
    text-align: left;
    column-count: 2;
    margin:25px 0;
}



/* Media Queries */
@media screen and (max-width:700px) {
    .projektlogo {width:75%;}
    .main1 p {margin:25px auto;column-count: 1;text-align: left;}
    .modul-item-1, .modul-item-2 {width:100%;}
    .kontakt-item {width:100%;}
    .team-item-1, .team-item-2 {width:100%;}
}




    
