html, body {margin:0; padding:0;position: relative; height:100%}
html {scroll-behavior: smooth;}
@font-face{font-family:'FontAwesome';src:url('../fonts/fontawesome-webfont.eot?v=4.5.0');src:url('../fonts/fontawesome-webfont.eot?#iefix&v=4.5.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff2?v=4.5.0') format('woff2'), url('../fonts/fontawesome-webfont.woff?v=4.5.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.5.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.5.0#fontawesomeregular') format('svg');font-weight:normal;font-style:normal;}


/* Für Mobile Bereitstellen */
#menu {display:none}
/*  Für Mobile Bereitstellen */

.asfe {align-self: flex-end}
.ar {text-align:right}
.al {text-align:left}
.ac {text-align: center;}
.aj {text-align:justify;}
.as {align-self: center;}
.flex_center  {display: -webkit-flex;display: -ms-flex;display: flex;width: 100%;justify-content:center}
.flex  {display: -webkit-flex;display: -ms-flex;display: flex;}
.flex_row {display: -webkit-flex;display: -ms-flex;display: flex;flex-direction: row;-ms-flex-wrap: wrap;flex-wrap: wrap;}
.flex_row_wrap  {display: -webkit-box;display: -moz-box;display: -ms-flexbox;display: -webkit-flex;display: flex; -webkit-flex-flow: row wrap;flex-flow: row wrap;}
.flex_column {display: -webkit-flex;display: -ms-flex;display: flex;flex-direction: column;}
.flex_end {justify-content:flex-end}
.flex02{flex:0.2}
.flex05{flex:0.5}
.flex07{flex:0.7}
.flex08{flex:0.8}
.flex1{flex:1}
.flex2{flex:2}
.flex3{flex:3}
.flex4{flex:4}
.flex5{flex:5}
.w50p {width: 50%;}
.black {color:black}
.shadow {box-shadow: 0 1px 2px rgba(0, 0, 0, .3);}
body {
    background: #003054;
    margin: 0 auto;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
    font-size:18px;
    font-family: 'Exo',sans-serif;
    line-height: 1.42857143;
    color: #000;
}
h1 {
    margin-top: 0;
    font-size: 22px;
}
main {
    background: transparent url(../img/bg-layout.png) repeat-x scroll center center;
}
body, html {width: 100%}
main > div, footer > div   {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    background: #fff;
    padding: 50px;
    margin-top:50px ;
}
footer > div   {
    padding-top: 10px;
    margin-top:0px ;
}

a {color: #00aa1e;}
a:hover,
a:active	{
    color: #0057b5;
    text-decoration: underline;
}
footer ul {list-style: none}

#SubSite .images.img2 img {width: 300px; height: auto; margin:20px }
#SubSite .images.img2 {justify-content: center}
#changePreferences {color:#00aa1e; text-decoration: underline; cursor: pointer }



@media screen and (max-width: 768px) {
    span.mob {display: block;margin-top: 10px; font-weight: bold}


    .flex {flex-direction: column}
    img, div {max-width: 100%}
    main {width:100%}

    main > div, footer > div, ul, li  {margin: 0; padding:0}
    ul {padding-left: 20px}
    .wrapper, .footerWrapper {background: transparent;}
    .wrapper > div, footer .footerWrapper > div {background: #fff; margin: 20px; padding:20px}
    .footerWrapper .flex > div {margin-bottom: 20px}


}
