﻿
/**************/
/*Defaults*/
/*************/

    #wrappr{
        position: absolute;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        width: 100%;
        height: 100%;
        top: 0;
        right:0;
        z-index: 80;
    }


    html, body {
    background : #fff;
	overflow : auto;
	margin: 0;
	padding: 0;
	height: 100%;
	border: none;
	color:#345C6E;
	font-size: 0.97em;
	line-height: 1.6em;
	font-family: 'Fira Sans', sans-serif;
    }

    #halign{
        margin:auto;
        margin-top:3%;
        max-width:1238px;
        height:73%;
        z-index:15;
    }

    /*neu*/
     /*************/
    /* Template */
    /*************/
    .template{
        display:flex;
    }
    .flx1 img{
        width:100%;
        height:auto;
    }

     .flx1:nth-child(1){
        width:29%;
        max-width:347px;
        height:auto;
}
.lgo9 {
    display:none;
}


     /*************/
    /* content */
    /*************/

    .content{
        display:flex;
    }
    .tx1{
        font-size:1.7em;
        line-height:1.9em;
        font-weight:300;
        margin-top:22%;
    }


    /*************/
    /* footer */
    /*************/
    .footer{
         margin:auto;
         max-width:1238px;

    }
    .footer img{
        position:relative;
        margin-top:-3%;
        margin-left:-4.4%;
        width:14.7%;
        max-width:180px;
        height:auto;
    }
    .lang{
        margin-top:-2px;
        font-weight:700;
    }
     .lang{
        font-size:1.3em;
        font-weight:700;
    }
    .lang  a:link {
        color:#0a3455;
        text-decoration:none;
        background-color : transparent;
        font-size:0.95em;
        font-weight: 700;
    }
    .lang  a:visited {
        color:#0a3455;
        background-color : transparent;
        font-size:0.95em;
        font-weight: 700;
    }
    .lang  a:hover {
         color:#dba128;
        background-color : transparent;
        font-weight: 700;

    }


     /*************/
    /* Navigation */
    /*************/
  /*init hamburger*/
    /* menu btn */

      .header .menu-btn {
        display: none;
    }

    .header .menu-btn:checked ~ .menu {
        max-height: 800px;
    }

    .header .menu-btn:checked ~ .menu-icon .navicon {
        background: transparent;
    }

    .header .menu-btn:checked ~ .menu-icon .navicon:before {
        transform: rotate(-45deg);
    }

    .header .menu-btn:checked ~ .menu-icon .navicon:after {
        transform: rotate(45deg);
    }

    .header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:before,
    .header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after {
        top: 0;
    }
        .header .menu {
             position:relative;
            clear: none;
            left:86%;
            margin-top:33%;
            max-height: none;
            z-index:700;


        }
        .header .menu-icon {
            display: none;
        }

    .sham7{
    display:none;
    }

    /* // init hamburger */


    /*************/
    /* hmnu */
    /*************/

    ul.navlist
    {
        max-width:96%;
        list-style: none;
        flex-direction:row;
        z-index:140;
        position:relative;
        margin:24% 8.5% 0 0;
        font-size:2.4em;
        line-height:1.6em;
    }

    ul.navlist li
    {
        display:block;
        background-color:transparent;
        text-decoration:none;
        padding:4px 9px 4px 9px;
    }


    ul.navlist li a
    {
         display:block;
         color:#dba128;
         font-weight:700;
    }


    ul.navlist li.active a
    {
        color:#dba128;
        position:relative;
    }
    ul.navlist li a:hover
    {
         color:#005060;
    }
   /*************/
    /* FX */
    /*************/
     /*Langsamer rollover bei divs */


    .clear{
        clear:both;
    }
    .ct8{
        -moz-hyphens: auto; /*auto umbruch im Content*/
        -webkit-hyphens: auto;
        -ms-hyphens: auto;
        -o-hyphens: auto;
        hyphens: auto;

    }






    /*fertig neu*/






   .claim{

        font-family:'Roboto';
        line-height:1.4em;
       position:realtive;
       width:61%;
       opacity:0.6;
       margin:6% 0 3% 7%;
       font-size:1.2em;
       font-weight: 400;
       text-align:left;
       z-index:900;
   }
   .claim:hover{
        opacity:0.6;
   }








    a:link {
        color:#dba128;
        text-decoration : none;
        background-color : transparent;
        font-size:1.0em;
        font-weight: 600;
    }
    a:visited {
        color:#dba128;
        text-decoration : none;
        background-color : transparent;
        font-weight: 600;
    }
    a:hover {
        color:#05060;
        text-decoration : none;
        background-color : transparent;
        font-weight: 600;

    }
      h1 {
        margin: 0;
        margin-bottom:12px;
        padding: 0;
        font-size: 1.6em;
        line-height:1.45em;
        font-weight:400;
    }

     h2 {
        margin: 0;
        margin-bottom:6px;
        margin-top:24px;
        padding: 0;
        font-size: 0.95em;
        line-height: 1.35em;
        color:#00aeef;
        font-weight:700;
    }
    h3 {
        margin: 0;
        padding: 0;
        font-size: 0.95em;
        line-height: 1.25em;
        color:#000;
        font-weight:700;
    }
    h4 {
        margin: 0;
        margin-bottom:3px;
        padding: 0;
        font-size: 1.2em;
        line-height: 1.3em;
        color:#000;
        font-weight:700;
    }





    /***********************/
    /*Aktell Kacheln*/
    /**********************/

    .flexbx9{

       display: flex;
       margin:0;
       padding:0;
       width:61%;
       margin:-5% 0 4% 8.5%;


    }
    .flxit9{
        width:30%;
        padding:0px 8px 24px 0px;
        text-align:left;
        margin:0;

    }

    .flxit9 img{
        width:99%;
        height:auto;
        border-radius:5px 5px 0px 0px;
        border:1px solid #666666;
    }



    .flxit9 a{
        color:#393737;
        display:inline-block;
         opacity:0.9;
        width:100%;
        height:100%;

    }
    .flxit9 a:hover{
      opacity: 1;
       transition: opacity .25s ease-in-out;
       -moz-transition: opacity .25s ease-in-out;
       -webkit-transition: opacity .25s ease-in-out
    }
    .top9{
        margin-top:12px;
    }
    .flexbx10{
       display: flex;
       height:100%;
       flex-direction:column;

    }
    .flexbx10a{
       height:100%

    }
    .bg99{
        margin-top:-4px;
        background:#2f6f92;
        color:#fff;
        padding: 12px;
        font-size:0.9em;
        border-radius:0px 0px 5px 5px;
        letter-spacing: 0.05em;
        font-family:'Roboto';
        line-height:1.1em;
        font-weight:400;
         border:1px solid #666666;
    }

    .bot10{
        text-align:right;
        padding-right:12px;
        color:#00aeef;
        height:24px;
        font-size:1.68em;
    }
    .bot11{
        padding-right:7px;

    }

    .sm8{
    font-size:0.68em;
     font-weight:700;
     color:#fff;
    }
    .tlt8{
     font-size:1.3em;
     font-weight:700;
     color:#fff;
      font-family: 'Open Sans Condensed', sans-serif;
    }



    .wpmd4{
        width:76.3%;
        margin-top:8%;
        margin:8% 0 0 -8.3%;
        padding:0 0 1% 1%;
    }
    .ul8{
        margin:0;
        padding:0;
        margin: 12px 0 12px 13px;
        list-style: none; /* Remove default bullets */
    }
    .ul8 li{
        line-height:2em;
      }
    .ul8 li:before{
      content: "\2022";
      color:#00aeef;
      font-weight: bold;
      display: inline-block;
      width: 1em;
      margin-left: -1em;
  }

    /**********************/
    /* Content Container */
    /*********************/
    .ctbx{
        display:flex;
        width:100%;
        margin:0 0 4% 0;
        padding:12px 12px 12px 12px;
        margin-left:-12px;
        line-height:1.5em;
        font-size:1em;
        background:#f5f5f5;
        border-radius:5px;
        opacity:0.9;

    }
      .ctbx:nth-of-type(even){
        flex-direction: row-reverse;
    }
    .glu7{
        margin:0;
        margin-left:-12px;
    }

    .ctflx{
       display:flex;
       width:60%;

    }
    .ctflx:nth-of-type(even){
       width:2px;
        background-color:#2f6f92;
       margin:0 1% 0 1%;
       }
    .ctflx:nth-child(3){
      max-width:391px;


    }

    /*Layout 10*/
    .pad5{
        width:100%;

    }

    .pad5 img{
        width:100%;
        height:auto;
        border-radius:5px;
    }
    .pad5 h1, .pad5 h2{

        color:#2f6f92;
        margin:0;
        padding:0;
        font-size:1.7em;
        font-stretch:semi-condensed;
        font-family:'Roboto';
        margin-bottom:19px;
        font-weight:700;
    }
    .pad5 h2{

    }


     .pad5 p{
        font-weight:700;
        font-family: 'Open Sans', sans-serif;
     }
     b{
         color:#2f6f92;
     }
     .c15{
         float:right;
         font-size:3em;
         margin-right:32px;
     }
     .c15 a{
         color:#2f6f92;
     }
     .sup { vertical-align: super; }

    /*Link sektion Layouts*/
     .flxplnk2{
        display:flex;
        justify-content:flex-end;
        width:100%;
        margin:12px 0 18px 0;

     }
     .flxbxplnk2 a:link{
         color:#2f6f92;
         font-stretch:semi-condensed;
        font-family:'Roboto';
        font-size:1em;
        font-weight:300;
     }

     .flxbxplnk2 a:visited{
        color:#2f6f92;
     }

    .plnk2tx{
        display:flex;
        align-items:center;
        margin-top:8px;
            }

     .dg8{
         font-size:1.8em;
         margin-left:12px;
     }
     .plnk2tx:hover, .dg8:hover {
         color:#000;
         opacity:0.7;
     }

     /*layout 12*/
     .ctflx12{
       width:100%;
       font-size: 0.95em;
    }
    .pad5bx12{
        color:#fff;
        background:#447e9d;
        padding:24px 6px 22px 20px;
        border-radius:5px;
    }
     .pad5bx12 h2{
        color:#fff;
        margin:0;
        padding:0;
    }
    .pad5bx12 h1{
        color:#fff;
    }

    /*Tabelle flex*/
    .flxtb12{
        display:flex;
        width:100%;
        margin-top:46px;
    }
    .flbx12{
        width:60%;
        border-right: 2px solid #447e9d;
        padding: 0 36px 8px 8px;
    }
    .flbx12 h2{
         font-size:1.1em;
         margin:0;
         padding-bottom:14px;
        }
    .flbx12:first-child{
        padding-left:0;
        }
    .flbx12:last-child{
        border-right:0;

    }
    .flbx12  ul{
        margin:0 0 32px 24px;
        padding:0;
        width:100%;

    }
    .flbx12  li a:link{
        color:#000;
        font-weight:400;
        font-size:0.95em;
        line-height:1.9em;
    }
    .flbx12  li a:visited{
        color:#000;
    }
    .flbx12  li a:hover{
        color:#447e9d;
        opacity:0.7;
    }

    .dg9 {
        color:#447e9d;
        font-size:0.8em;
    }









/*************/
/* impress-galerie */
/*************/
.flxit93{
    display:flex;
    margin-left:24px;

}
.flxit94{
    width:50%;
    padding:0 12px 12px 0;
}

.flxit94 img {
    width:100%;
    height:auto;
}
/*************/
/* template-galerie */
/*************/

  #stage  img {
      position:absolute;
    background: #fff;
    width: 64%;
    max-width:891px;
    height:auto;
  }

  #stage img:nth-of-type(1) {
    animation-name: fader;
    animation-delay: 4s;
    animation-duration: 1s;
    z-index: 20;
  }
  #stage img:nth-of-type(2) {
    z-index: 10;
  }
  #stage img:nth-of-type(n+3) {
    display: none;
  }

  @keyframes fader {
    from { opacity: 1.0; }
    to   { opacity: 0.0; }
  }






/*************/
/* Screen bis 1375px)*/
/*************/
@media screen and (max-width: 1375px) {
 html, body {
	font-size: 0.87em;
	line-height: 1.5em;
}
.footer, #halign{
         margin:auto;
         max-width:1064px;
}
#halign{
   /* background:lime; */
    margin-top:3%;
}
.header .menu {
   left:85%;
}
#stage  img {
    max-width:748px;
  }
}/*end*/
/*************/
/* Screen bis 1198px)*/
/*************/
@media screen and (max-width: 1198px) {
 html, body {
	font-size: 0.77em;
	line-height: 1.6em;
}
.footer, #halign{
         max-width:800px;
}

#halign{
  /* background:cyan; */
    min-height:78%;

}
#stage  img {
    max-width:563px;
  }
.header .menu {
   left:80%;
}
}/*end*/
/*************/
/* Screen bis 859px)*/
/*************/
@media screen and (max-width: 859px) {
 html, body {
	font-size: 0.97em;
	line-height: 1.6em;
}
#halign{
    /*background:fuchsia; */
    margin-top:6%;
}
.header .menu {
   left:80%;
   margin-top:75%;
}
.template{
    flex-wrap:wrap;
}
.flx1 {
    width:100%;
}
.flx1:first-child{
    padding-left:36px;
    margin-bottom:-12px;
}
    .footer img{
        position:absolute;
        margin-top:0;
        margin-left:0;
        bottom:5%;
        width:14.7%;
        max-width:180px;
    }
    .lang{
        position:absolute;
        margin-top:36px;
        top:4%;
        right:48px;
        font-size:1.6em;
    }
.tx1{
    margin-top:40%;
    margin-left:-98%;
}

.template .flx1:nth-child(2){
    width:100%;
    margin-bottom:18%;

}
  #stage  img {
    width:100%;
    max-width:788px;
    margin:0;
    padding:0;
  }
}/*end*/
/*************/
/* Screen bis 730px)*/
/*************/
@media screen and (max-width: 730px) {
 html, body {
	font-size: 0.97em;
	line-height: 1.6em;
}
#halign{
   /*background:yellow;*/
    min-height:90%;
    margin-top:6%;
}
.content{
    flex-wrap:wrap;
    flex-direction:column-reverse;
}

.flx1{

    background: white;
    width:100%;
}
.flx1:first-child{
    padding-left:12px;
    margin-bottom:12px;
}

.tx1{
    margin:36px 0 0 12px;
    }
.header .menu {
   left:-48px;
   max-height:auto;
   top:0;
   margin-top:-125%;
}
.template .flx1:first-child{
    width:217px;
}
.footer img{
    display:none;
}


 .lgo9 {
    position:absolute;
    display:block;
    right:36px;
    padding-bottom:48px;
    max-width:140px;
}
.lang{
    margin-top:0px;
    top:4%;
    right:48px;
    font-size:1.6em;
    }
  .template, #stage, #stage  img {
    width:100%;
    max-width:891px;
    margin:0;
    padding:0;
  }
  .tx1{
    margin-top:40%;
    margin-left:12px;
}



}/*end*/

@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
/* IE bis 11 Bug Fix kein Flexbox rechte boxen*/


}/*end*/


