/* ===================== general ======================================= */

* {     -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
         box-sizing: border-box;
         scroll-behavior: smooth;
         }




@media all and (max-width: 960px) {
        .desktop .fade_in {
                 opacity: 1;
                 visibility: visible;
                 -webkit-transform: translate(0, 0px);
                 -moz-transform: translate(0, 0px);
                 transform: translate(0, 0px)
                 }
        .desktop .fade_in.animated {
                 transform: translate(0, 0px);
                 -webkit-transition: all 0ms ease-out 0ms;
                 -moz-transition: all 00ms ease-out 0ms;
                 transition: all 0ms ease-out 0ms
                 }
}





.hidden {display: none;}
.visible {display: block;}


body {
         animation:fadein 0.9s;
         -moz-animation:fadein 0.9s;
         -webkit-animation:fadein 0.9s;
         scroll-behavior: smooth;

         /*
         -ms-user-select: none;
         -webkit-user-select: none;
         -moz-user-select: none;
         user-select: none;
         */
         margin: 0 auto;
}



.wrapper {
        max-width: 1400px;
        padding: 0 0% 0em 0%;
        margin: 0 auto;
        border: 0px solid;
        border-color:#FF0000;
         }


@media all and (max-width: 1450px) {
        .wrapper { padding: 0 8% 0em 8%; }
}


@media all and (max-width: 560px) {
        .wrapper { padding: 0 4% 0em 4%;  }
}



/* ====== fonts ============ */


/* prata-regular - latin */
@font-face {
  font-family: 'Prata';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/prata-v18-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/prata-v18-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/prata-v18-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/prata-v18-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('fonts/prata-v18-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/prata-v18-latin-regular.svg#Prata') format('svg'); /* Legacy iOS */
}


/* prata-regular - latin */
@font-face {
  font-family: 'Prata';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/prata-v18-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/prata-v18-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/prata-v18-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/prata-v18-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/prata-v18-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/prata-v18-latin-regular.svg#Prata') format('svg'); /* Legacy iOS */
}





/* roboto-300 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/roboto-v30-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/roboto-v30-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/roboto-v30-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/roboto-v30-latin-300.woff') format('woff'), /* Modern Browsers */
       url('fonts/roboto-v30-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/roboto-v30-latin-300.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* roboto-300italic - latin */
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 300;
  src: url('fonts/roboto-v30-latin-300italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/roboto-v30-latin-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/roboto-v30-latin-300italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/roboto-v30-latin-300italic.woff') format('woff'), /* Modern Browsers */
       url('fonts/roboto-v30-latin-300italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/roboto-v30-latin-300italic.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* roboto-regular - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/roboto-v30-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/roboto-v30-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/roboto-v30-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/roboto-v30-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('fonts/roboto-v30-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/roboto-v30-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* roboto-italic - latin */
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 400;
  src: url('fonts/roboto-v30-latin-italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/roboto-v30-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/roboto-v30-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/roboto-v30-latin-italic.woff') format('woff'), /* Modern Browsers */
       url('fonts/roboto-v30-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/roboto-v30-latin-italic.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* roboto-500 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: url('fonts/roboto-v30-latin-500.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/roboto-v30-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/roboto-v30-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/roboto-v30-latin-500.woff') format('woff'), /* Modern Browsers */
       url('fonts/roboto-v30-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/roboto-v30-latin-500.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* roboto-500italic - latin */
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 500;
  src: url('fonts/roboto-v30-latin-500italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/roboto-v30-latin-500italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/roboto-v30-latin-500italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/roboto-v30-latin-500italic.woff') format('woff'), /* Modern Browsers */
       url('fonts/roboto-v30-latin-500italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/roboto-v30-latin-500italic.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* roboto-700 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/roboto-v30-latin-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/roboto-v30-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/roboto-v30-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/roboto-v30-latin-700.woff') format('woff'), /* Modern Browsers */
       url('fonts/roboto-v30-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/roboto-v30-latin-700.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* roboto-700italic - latin */
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 700;
  src: url('fonts/roboto-v30-latin-700italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/roboto-v30-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/roboto-v30-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/roboto-v30-latin-700italic.woff') format('woff'), /* Modern Browsers */
       url('fonts/roboto-v30-latin-700italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/roboto-v30-latin-700italic.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* roboto-900 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 900;
  src: url('fonts/roboto-v30-latin-900.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/roboto-v30-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/roboto-v30-latin-900.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/roboto-v30-latin-900.woff') format('woff'), /* Modern Browsers */
       url('fonts/roboto-v30-latin-900.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/roboto-v30-latin-900.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* roboto-900italic - latin */
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 900;
  src: url('fonts/roboto-v30-latin-900italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/roboto-v30-latin-900italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/roboto-v30-latin-900italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/roboto-v30-latin-900italic.woff') format('woff'), /* Modern Browsers */
       url('fonts/roboto-v30-latin-900italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/roboto-v30-latin-900italic.svg#Roboto') format('svg'); /* Legacy iOS */
}




/* ============ bg-colors ============= */

.bgcolor_softwhite { background: linear-gradient(180deg, #FFFFFF, #f3ffee, #FFFFFF);}

.bgcolor_black { background: linear-gradient(180deg, #5F5F5F, #000000);}
.bgcolor_fadegreen {background: linear-gradient(180deg, #91c214, #f3ffee);}

.bgcolor_blacksolid {background-color: #000000; }
.bgcolor_darkgrey {background-color: #5F5F5F; }
.bgcolor_lightgrey {background-color: #EFEFEF; }
.bgcolor_shinygrey {background-color: #f4f4f5; }
.bgcolor_midgrey {background-color: #DFDFDF; }
.bgcolor_details {background-color: #eefaff; }
.bgcolor_smart {background-color: #F3F9E7; }


.bgcolor_businessblue {background-color: #2c5188;}
.bgcolor_lightrosa {background-color: #fceffa; }
.bgcolor_lightgreen {background-color: #f3ffee; }
.bgcolor_green {background-color: #91c214; }


.bgcolor_fade_01      { background: linear-gradient(180deg, #f3ffee, #FFFFFF, #FFFFFF);}
.bgcolor_base { background: linear-gradient(180deg, #EFEFEF, #f3ffee, #F0F0F0);}





/* ===================== pics ======================================= */




img {
}


.img100 {
        width: 100%;
        display: block;
        margin-left: auto;
        margin-right: auto;

        color:#0060FF;
        text-align:center;
        font-size: 80%;
        font-family: 'Roboto', sans-serif;
        font-weight: 600;
}

@media all and (max-width: 1000px) {
        .img100 { width: 100%; }
}








.imgfull {
        width: 100%;
}


.imgauto {
        width: auto;
}


.imgcenter {
        width: auto;
        display: block;
        margin-left: auto;
        margin-right: auto;
}


@media all and (max-width: 560px) {
        .imgcenter {  width: 100%; }
}



.imglogo {
        width: 220px;
        display: block;
        margin-left: auto;
        margin-right: auto;
        margin-top:0px;
  color:#fff;
  text-align:center;
  font-size: 80%;
  font-family: 'Roboto', sans-serif;
  font-weight: 300;
}


@media all and (max-width: 560px) {
        .imglogo {  width: 50%; }
}



.imgcentersmall {
        width: 25%;
        display: block;
        margin-left: auto;
        margin-right: auto
}


@media all and (max-width: 560px) {
        .imgcentersmall { width: 50%; }
}



.imgcenter2 {
        width: 80%;
        display: block;
        margin-left: auto;
        margin-right: auto
}


@media all and (max-width: 740px) {
        .imgcenter2 {  width: 100%; }
}






.imgcentersymbol {
        width: 35%;
        display: block;
        margin-left: auto;
        margin-right: auto;
        margin-top:30px;
}


@media all and (max-width: 560px) {
        .imgcentersymbol { width: 50%; }
}




.imgtwin { width: 50%; float:left;  }

@media all and (max-width: 560px) {
        .imgtwin { width: 100%; }
}


.img33 { width: 33.3333%; }


@media all and (max-width: 560px) {
        .img33 { width: 50%; }
}



.img_mobfocus_01,
.img_mobfocus_02,
.img_mobfocus_03,
.img_mobfocus_04 {width: 100%; height:auto; overflow:hidden;}

.img_mobfocus_01 img,
.img_mobfocus_02 img,
.img_mobfocus_03 img,
.img_mobfocus_04 img
                 {width:100%; margin-left:0%;}

@media all and (max-width: 1200px)  {
         .img_mobfocus_01 img {width:140%; margin-left:-20%;}
         .img_mobfocus_02 img {width:150%; margin-left:-20%;}
         .img_mobfocus_03 img {width:150%; margin-left:-50%;}
         .img_mobfocus_04 img {width:220%; margin-left:-60%;}
         }


@media all and (max-width: 800px)  {
         .img_mobfocus_01 img {width:160%; margin-left:-30%;}
         .img_mobfocus_02 img {width:160%; margin-left:-20%;}
         .img_mobfocus_03 img {width:150%; margin-left:-50%;}
         .img_mobfocus_04 img {width:220%; margin-left:-60%;}
         }

@media all and (max-width: 560px)  {
         .img_mobfocus_01 img {width:240%; margin-left:-70%;}
         .img_mobfocus_02 img {width:260%; margin-left:-57%;}
         .img_mobfocus_03 img {width:200%; margin-left:-50%;}
         .img_mobfocus_04 img {width:320%; margin-left:-120%;}
         }



.grafik {width:70%; margin-left:15% }

@media all and (max-width: 960px) {
        .grafik {width:100%; margin-left:0% }
}








/* --- VIDEOS --- */
.wrappervideo {
        max-width: 1400px;
        padding: 0 0px 0em 0px;
        margin: 0 auto;
         }


.backgroundvideo {
        background-color: #101010;
         }


.backgroundvideo_fadegreen { background: linear-gradient(0deg, #91c214, #FFFFFF, #EFEFEF, #EFEFEF);}


/* ===================== elastic video ========================= */
.elastic-video {
         position: relative;
         padding-bottom: 55%;
         padding-top: 15px;
         height: 0;
         overflow: hidden;
}

.elastic-video iframe {
         position: absolute;
         top: 0;
         left: 0;
         width: 100%;
         height: 100%;
}







}



/* ----------------- Buttons --------------------------------------------------------------- */



/* ----------- menuebox ----------- */


.menuebutton_room {
  border-top: 0px dotted ;
  border-bottom: 0px dotted ;
  border-color:#133645;
  height: auto;
  width:100%;
  margin:0 auto;
  padding:30px 0 30px 0;
}

.menuebutton_box {
  height: 120px;
  border: 0px solid ;
  border-color:#FF007F;
  width:50%;
  margin-bottom:10px;
  float:left;
  display: -webkit-flex;
  display:         flex;
  -webkit-align-items: center;
          align-items: center;
  -webkit-justify-content: center;
          justify-content: center;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}


.menuebutton,
.menuebutton_on {
  height: 120px;
  width: 120px;
  border: 1px solid;
  border-radius: 60px;
  border-color:#BFBFBF;
  background-color:#FFFFFF;
  margin:0 auto;
  display: -webkit-flex;
  display:         flex;
  -webkit-align-items: center;
          align-items: center;
  -webkit-justify-content: center;
          justify-content: center;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}


.menuebutton:hover {
  background-color: #FFFFFF;
  border: 1px solid;
  border-color: #a7f400;
  transform: scale(1.3);
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

.menuebutton_tx {
  font-family: 'Roboto', sans-serif;
        font-size: 80%;
        font-weight:600;
        color: #6F6F6F;
        line-height:1.3em;
        letter-spacing: 0.0em;
        text-align:center;
        text-transform: uppercase;
        hyphens: none;
}

@media all and (min-width: 560px) {
        .menuebutton_room {width:100%;}
        .menuebutton_box {width:33.33%; height: 125px; margin-bottom:30px; float:left;}
        .menuebutton     {width:125px; height: 125px; border-radius:62px;}
        .menuebutton_tx  {font-size: 80%; letter-spacing: 0.2em;}

}

@media all and (min-width: 800px) {
        .menuebutton_room {width:100%;}
        .menuebutton_box {width:33.33%; height: 155px; margin-bottom:10px; float:left;}
        .menuebutton     {width:150px; height: 150px; border-radius:75px; }
        .menuebutton_tx  {font-size: 80%; letter-spacing: 0.2em;}
}

@media all and (min-width: 1200px) {
        .menuebutton_room {width:100%;}
        .menuebutton_box {width:20%; height: 155px; margin-bottom:10px; float:left;}
        .menuebutton     {width:150px; height: 150px; border-radius:75px; }
        .menuebutton_tx  {font-size: 80%; letter-spacing: 0.2em;}
}

@media all and (min-width: 1450px) {
        .menuebutton_room {width:100%;}
        .menuebutton_box {width:20%; height: 155px; margin-bottom:10px; float:left;}
        .menuebutton     {width:150px; height: 150px; border-radius:75px; }
        .menuebutton_tx  {font-size: 80%; letter-spacing: 0.2em;}
}



/* ==== themabuttons / normal und color ============================================= */

.themabutton {
  height: 100px;
  width: 100px;
  border: 1px solid;
  border-radius: 50px;
  border-color:#FFFFFF;
  background-color:none;
  margin:0 auto;
  display: -webkit-flex;
  display:         flex;
  -webkit-align-items: center;
          align-items: center;
  -webkit-justify-content: center;
          justify-content: center;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}


.themabuttoncolor {
  height: 100px;
  width: 100px;
  border: 1px solid;
  border-radius: 50px;
  border-color:#7F7F7F;
  background-color:none;
  margin:0 auto;
  display: -webkit-flex;
  display:         flex;
  -webkit-align-items: center;
          align-items: center;
  -webkit-justify-content: center;
          justify-content: center;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}


.themabutton:hover {
  margin-bottom:0px;
  background-color: none;
  border: 1px solid;
  border-color: #8de700;
  transform: scale(1.2);
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}



.themabuttoncolor:hover {
  background-color: none;
  border: 1px solid;
  border-color: #91c214;
  transform: scale(1.2);
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}


@media all and (min-width: 560px) {
        .themabutton, .themabuttoncolor     {width:100px; height: 100px; border-radius:50px;}
}

@media all and (min-width: 800px) {
        .themabutton, .themabuttoncolor     {width:110px; height: 110px; border-radius:55px; }
}

@media all and (min-width: 1200px) {
        .themabutton, .themabuttoncolor     {width:120px; height: 120px; border-radius:60px; }
}

@media all and (min-width: 1450px) {
        .themabutton, .themabuttoncolor     {width:120px; height: 120px; border-radius:60px; }
}




/* ==== Textmenue mit Ergänzungstexten darunter / 5er-Buttonreihe ======================================= */

.textmenuebutton_room {
  border-top: 0px dotted ;
  border-bottom: 0px dotted ;
  border-color:#133645;
  height: auto;
  width:100%;
  margin:0 auto;
  padding:30px 0 30px 0;
}

.textmenuebutton_box {
  height: 250px;
  border: 1px solid ;
  border-color:#FFFFFF;
  border-radius: 20px;
  width:50%;
  margin-bottom:10px;
  float:left;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}


.textmenuebutton_box_empty {
  display:none;
  height: 250px;
  border: 1px solid ;
  border-color:#FFFFFF;
  border-radius: 20px;
  width:50%;
  margin-bottom:10px;
  float:left;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}



.textmenuebutton_box:hover {
  background-color: #FFFFFF;
  border: 1px solid;
  border-color: #8de700;
  transform: scale(1.0);
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

.textmenue_tx {
  font-family: 'Roboto', sans-serif;
  font-size: 80%;
  font-weight: 300;
  letter-spacing: .02em;
  color: #5F5F5F;
  line-height:1.3em;
  text-align:center;
  margin-top:15px;
  padding:0 10px 0 10px;
}

.img_textmenue {
        width: 40%;
        display: block;
        margin-left: auto;
        margin-right: auto;
        margin-top:15px;
        border: 0px solid #FF5F00;
}


@media all and (min-width: 560px) {
        .textmenuebutton_room {width:100%;}
        .textmenuebutton_box {width:33.33%; height: 300px; margin-bottom:30px; float:left;}
        .textmenuebutton_box_empty {width:33.33%; height: 300px; margin-bottom:30px; float:left; display:none; }
        .textmenue_tx  {font-size: 80%;}
        .img_textmenue                     { width: 30%; }

}

@media all and (min-width: 800px) {
        .textmenuebutton_room {width:100%;}
        .textmenuebutton_box {width:33.33%; height: 300px; margin-bottom:10px; float:left;}
        .textmenuebutton_box_empty {width:33.33%; height: 300px; margin-bottom:10px; float:left; display:none; }
        .textmenue_tx  {font-size: 105%; margin-top:20px; padding:0 20px 0 20px;}
        .img_textmenue                     { width: 30%; }
}

@media all and (min-width: 1200px) {
        .textmenuebutton_room {width:100%;}
        .textmenuebutton_box {width:20%; height: 300px; margin-bottom:10px; float:left;}
        .textmenuebutton_box_empty {width:20%; height: 300px; margin-bottom:10px; float:left; display:block;}
        .textmenue_tx  {font-size: 80%; margin-top:25px; padding:0 20px 0 20px;}
        .img_textmenue                     { width: 30%; }
}

@media all and (min-width: 1450px) {
        .textmenuebutton_room {width:100%;}
        .textmenuebutton_box {width:20%; height: 300px; margin-bottom:10px; float:left;}
        .textmenuebutton_box_empty {width:20%; height: 300px; margin-bottom:10px; float:left; display:block;}
        .textmenue_tx  {font-size: 105%; margin-top:30px; padding:0 20px 0 20px;}
        .img_textmenue                     { width: 30%; }
}








/* ==== Textmenue mit Ergänzungstexten darunter / 1er-Singlebutton innerhalb 2-spaltiger Flex ==== */


.textmenuebuttonsingle_box {
  height: 250px;
  border: 1px solid ;
  border-color:#FFFFFF;
  border-radius: 20px;
  width:50%;
  margin-bottom:10px;
  margin-left:auto;
  margin-right:auto;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}


.textmenuebuttonsingle_box:hover {
  background-color: #FFFFFF;
  border: 1px solid;
  border-color: #8de700;
  transform: scale(1.0);
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}




@media all and (min-width: 560px) {
        .textmenuebuttonsingle_box {width:33.33%; height: 300px; margin-bottom:30px;}


}

@media all and (min-width: 800px) {
        .textmenuebuttonsingle_box {width:33.33%; height: 300px; margin-bottom:10px;}

}

@media all and (min-width: 1200px) {
        .textmenuebuttonsingle_box {width:40%; height: 300px; margin-bottom:10px;}

}

@media all and (min-width: 1450px) {
        .textmenuebuttonsingle_box {width:40%; height: 300px; margin-bottom:10px;}

}









/* ==== angebotsmenue ====================================================================== */

.angebotsmenuebutton_room {
  border-top: 0px dotted ;
  border-bottom: 0px dotted ;
  border-color:#133645;
  height: auto;

  margin:0 auto;
  padding:30px 0 30px 0;
}

.angebotsmenuebutton_box {
  width:100%;
  height: 140px;
  border: 1px solid ;
  border-color:#FFFFFF;
  border-radius: 20px;
  padding:0px 5px 0 5px;
  margin-bottom:10px;

  float:left;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}


.angebotsmenuebutton_box:hover {
  background-color: none;
  border: 1px solid;
  border-color: #2c5188;
  border-radius: 20px;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}


.angebotsbutton {
  width:80%;
  height:140px;
  border: 1px solid;
  border-radius: 20px;
  border-color:#FFFFFF; /*#eaf4fe;*/
  background-color:none; /*#eaf4fe;*/

  display: -webkit-flex;
  display:         flex;
  -webkit-align-items: center; align-items: center;
  -webkit-justify-content: flex-start; justify-content: flex-start;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}





.angebotsmenue_tx {
  font-size: 80%;
  font-family: 'Roboto', sans-serif;
  font-weight: 300;
  letter-spacing: .03em;
  color: #2F2F2F;
  line-height:150%;
  text-align:left;
  margin-top:0px;
  padding:0 0px 0 10px;

}


.img_angebot {
        width: 20%;
        display: block;
        margin-left: auto;
        margin-right: auto;
        margin-top:15px;
        border: 0px solid #FF5F00;
        float:left;
}

.kurs { color: #3a547a; font-weight: 500;}

.kurszeit {
  font-size: 80%;
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  letter-spacing: .03em;
  color: #8F8F8F;
  margin-top:0px;
}





@media all and (min-width: 560px)  {
        .angebotsmenuebutton_room  {width:100%;}
        .angebotsmenuebutton_box   {width:50%; height: 210px; margin-bottom:10px; float:left;}
        .angebotsbutton            {width:100%; height:210px; -webkit-justify-content: center; justify-content: center; -webkit-align-items: flex-start; align-items: flex-start;}
        .angebotsmenue_tx          {font-size: 80%; margin-top:10px; text-align:center; padding:0 10px 0 10px;}
        .img_angebot                     { width: 20%; float:none;}

}

@media all and (min-width: 800px)  {
        .angebotsmenuebutton_room  {width:100%;}
        .angebotsmenuebutton_box   {width:50%; height: 230px; margin-bottom:10px; float:left; }
        .angebotsbutton            {width:100%; height:230px;}
        .angebotsmenue_tx          {font-size: 90%;}
        .img_angebot                     { width: 20%; }
}


@media all and (min-width: 1000px) {
        .angebotsmenuebutton_room  {width:100%;}
        .angebotsmenuebutton_box   {width:50%; height: 320px; margin-bottom:10px; float:left; }
        .angebotsbutton            {width:100%; height:320px;}
        .angebotsmenue_tx          {font-size: 90%; padding:0 30px 0 30px;}
        .img_angebot                     { width: 30%; }
}

@media all and (min-width: 1200px) {
        .angebotsmenuebutton_room  {width:100%;}
        .angebotsmenuebutton_box   {width:50%; height: 340px; margin-bottom:10px; float:left;}
        .angebotsbutton            {width:100%; height:340px;}
        .angebotsmenue_tx          {font-size: 100%; padding:0 30px 0 30px;}
        .img_angebot                     { width: 30%; }
}

@media all and (min-width: 1450px) {
        .angebotsmenuebutton_room  {width:100%;}
        .angebotsmenuebutton_box   {width:50%; height: 320px; margin-bottom:15px; float:left; }
        .angebotsbutton            {width:98%; height:320px;}
        .angebotsmenue_tx          {font-size: 105%; padding:0 30px 0 30px; }
        .img_angebot                     { width: 25%; }
}






/* ==== Flyoutmenue ==== */

.flyoutmenuebutton_room {
  border-top: 0px dotted ;
  border-bottom: 0px dotted ;
  border-color:#133645;
  height: auto;
  width:100%;
  margin:0 auto;
  padding:30px 0 30px 0;

}

.flyoutmenuebutton_box {
  height: 150px;
  border: 0px solid ;
  border-color:#00FFFF;
  width:50%;
  float:left;
  margin-bottom:10px;
  -webkit-transition: .2s ease-in-out;
  transition: .2s ease-in-out;
}


.flyoutmenuebutton_boxempty {
         display:none;
  height: 150px;
  border: 0px solid ;
  border-color:#00FFFF;
  width:50%;
  float:left;
  margin-bottom:10px;
  -webkit-transition: .2s ease-in-out;
  transition: .2s ease-in-out;
}




.flyoutmenuebutton {
  height: 100px;
  width: 100px;
  border: 1px solid;
  border-radius: 50px;
  border-color:#FFFFFF;
  background-color:none;
  margin:0 auto;
  display: -webkit-flex;
  display:         flex;
  -webkit-align-items: center;
          align-items: center;
  -webkit-justify-content: center;
          justify-content: center;
  -webkit-transition: .3s ease-in-out;
  transition: .2s ease-in-out;
}



.flyoutmenuebutton_on {
  height: 100px;
  width: 100px;
  border: 1px solid;
  border-radius: 50px;
  border-color:#8de700;
  background-color:none;
  margin:0 auto;
  display: -webkit-flex;
  display:         flex;
  -webkit-align-items: center;
          align-items: center;
  -webkit-justify-content: center;
          justify-content: center;
  -webkit-transition: .3s ease-in-out;
  transition: .2s ease-in-out;
}


.flyoutmenuebutton:hover,
.flyoutmenuebutton_on:hover {
  background-color: none;
  border: 1px solid;
  border-color: #91c214;
  transform: scale(1.2);
  -webkit-transition: .3s ease-in-out;
  transition: .2s ease-in-out;
}





.flyoutmenue_txalt {
         display:block;
  font-family: 'Roboto', sans-serif;
  font-size: 80%;
  font-weight: 600;
  letter-spacing: .05em;
  color: #1F1F1F;
  line-height:1.4em;
  text-align:center;
  padding:10px 10px 0 10px;
  text-transform: uppercase;
}


.flyoutmenue_tx {
         display:none;
  font-family: 'Roboto', sans-serif;
  font-size: 80%;
  font-weight: 400;
  letter-spacing: .02em;
  color: #5F5F5F;
  line-height:1.4em;
  margin-top:0px;
  text-align:center;
  padding:0 10px 0 10px;

}


@media all and (min-width: 560px) {
        .flyoutmenuebutton_room {width:100%;}
        .flyoutmenuebutton_box, .flyoutmenuebutton_boxempty      {width:33.33%; height: 250px; margin-bottom:10px; float:left;}
        .flyoutmenuebutton, .flyoutmenuebutton_on                {width:100px; height: 100px; border-radius:50px; float:none; margin:0 auto; }
        .flyoutmenue_tx          {display:block; }
        .flyoutmenue_txalt       {display:block;}

}

@media all and (min-width: 800px) {
        .flyoutmenuebutton_room {width:100%;}
        .flyoutmenuebutton_box, .flyoutmenuebutton_boxempty      {width:33.33%; height: 250px; margin-bottom:10px; float:left; }
        .flyoutmenuebutton, .flyoutmenuebutton_on                {width:110px; height: 110px; border-radius:55px; margin:0 auto;}
        .flyoutmenue_tx          {font-size: 80%;}

}

@media all and (min-width: 1200px) {
        .flyoutmenuebutton_room {width:100%;}
        .flyoutmenuebutton_box, .flyoutmenuebutton_boxempty      {width:20%; height: 300px; margin-bottom:10px; float:left; display:block;}
        .flyoutmenuebutton, .flyoutmenuebutton_on                {width:120px; height: 120px; border-radius:60px; }
        .flyoutmenue_tx          {font-size: 80%;}
}

@media all and (min-width: 1450px) {
        .flyoutmenuebutton_room {width:80%;}
        .flyoutmenuebutton_box, .flyoutmenuebutton_boxempty      {width:20%; height: 300px; margin-bottom:10px; float:left;}
        .flyoutmenuebutton, .flyoutmenuebutton_on                {width:120px; height: 120px; border-radius:60px; clear:both; }
        .flyoutmenue_tx          {font-size: 95%;}
        .flyoutmenue_txalt       {font-size: 95%;}
}



/*  ======================= SHOW HIDE ============================  */
.show_container {
  background-color: none;
  border: none;
  padding:0% 0% 0% 0%;
  cursor: pointer
}


.show_container div p {
  cursor: default !important;
  margin-bottom: 10px
}


.hidden>div {
  display: none
}


/* ========= button Show hide =========  */
.appear * {
         -webkit-animation: scale 0.7s ease-in-out;
         -moz-animation: scale 0.7s ease-in-out;
         animation: scale 0.7s ease-in-out;
         }

@keyframes scale {
                 0% {
                 transform: scale(0.9);
                 opacity: 0;
                 }
                 50% {
                 transform: scale(1);
                 opacity: 0.8;
                 }
                 100% {
                 transform: scale(1);
                 opacity: 1;
                 }
         }


.show_container {
padding:7px 0 14px 0;

}

.show_container:hover {
background-color:none;
transition: ease-in 0.3s;
}










/* ========= button more (nicht verwendet ?)  =========  */
.more {
  height: 30px;
  width: 30px;
  border: 0px solid;
  border-radius: 15px;
  border-color:none;
  background-color:#91c214;
  margin:5px auto 10px auto;
  display: -webkit-flex;
  display:         flex;
  -webkit-align-items: center;
          align-items: center;
  -webkit-justify-content: center;
          justify-content: center;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;

  font-family: 'Roboto', sans-serif;
  font-size:220%;
  font-weight:500;
  color:#FFFFFF;


}


.more:hover {
  background-color: #9BEA5E;
  transform: scale(1.2);
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}






/* Javascript-buttons für open/close window */
.close {
        font-family: 'Roboto', sans-serif;
        font-size: 130%;
        font-weight: 300;
        color: #FFFFFF;

        height: 46px;
        width: 46px;
        border: 0px solid;
        border-radius: 23px;
        border-color:#000000;
        background-color:#000000;


        position: fixed;
        top: 6px;
        right: 6px;
        z-index: 50; opacity: 0.8;
}


.close:hover {
        background-color:#FF0000;
}


/* ===================== fonts ======================================= */


h1 {
        font-family: 'Prata', serif;
        font-size: 450%;
        line-height: 110%;
        color: #000000;
        text-align:center;
}



@media all and (max-width: 1060px) {
        h1 { font-size: 380%; }
}


@media all and (max-width: 560px) {
        h1 { font-size: 230%; }
}



h2 {
        font-family: 'Prata', serif;
        font-size: 300%;
        line-height: 130%;
        color: #4F4F4F;

}

@media all and (max-width: 1000px) {
        h2 { font-size: 250%; }
}


@media all and (max-width: 560px) {
        h2 { font-size: 200%; }
}



h3 {
        margin-bottom:0;
        font-family: 'Lora', serif;
        font-weight: 400;
}




<!-- SEO Headlinealternative zu H1 -->

h4 {
        font-family: 'Prata', serif;
        font-size: 450%;
        line-height: 110%;
        color: #000000;
        text-align:center;
}



@media all and (max-width: 1060px) {
        h4 { font-size: 380%; }
}


@media all and (max-width: 560px) {
        h4 { font-size: 230%; }
}






p {
        font-family: 'Roboto', sans-serif;
        font-size: 1.2em;
        font-weight: 300;
        letter-spacing: .03em;
        color: #333;
        line-height:1.8em;
        hyphens: auto;
}


@media all and (max-width: 1060px) {
        p { font-size: 100%; }
}





.p_prata {
        font-family: 'Prata', serif;
        font-size: 155%;
        line-height: 160%;
        color: #000000;
         }


@media all and (max-width: 1060px) {
        .p_prata { font-size: 110%; }
}






.lauftext {
        font-family: 'Roboto', sans-serif;
        font-size: 110%;
        font-weight: 300;
        letter-spacing: .05em;
        color: #1F1F1F;
        word-spacing: 0.1em;
        line-height:160%;
        margin-top:0;
        margin-bottom:0;
}





@media all and (max-width: 1400px) {
        .lauftext { font-size: 100%; line-height:155%;}
}


@media all and (max-width: 1200px) {
        .lauftext { font-size: 95%; line-height:150%;}
}


.beispiel {
        font-family: 'Roboto', sans-serif;
        font-size: 95%;
        font-weight: 300;
        letter-spacing: .03em;
        color: #6F6F6F;
        word-spacing: 0.1em;
        line-height:160%;
        margin-top:1.0em;
        margin-bottom:1.0em;
        border-left:0px solid #D9EDF5;
        padding-left: 32px;
}

@media all and (max-width: 1060px) {
        .beispiel { font-size: 90%; line-height:130%;}
}




.anlauf {
        font-family: 'Roboto', sans-serif;
        font-size: 150%;
        font-weight: 300;
        letter-spacing: .03em;
        color: #0065df;
        word-spacing: 0.1em;
        line-height:160%;
        margin-top:0;
        margin-bottom:0;
}




@media all and (max-width: 810px) {
        .anlauf { font-size: 115%; line-height:150%;}
}




.description {
        font-family: 'Roboto', sans-serif;
        font-size: 100%;
        font-weight: 300;
        letter-spacing: .02em;
        color: #5F5F5F;
        word-spacing: 0.1em;
        line-height:150%;
        margin-top:20px;
        margin-bottom:0;
        max-width:50%; margin-left:25%;
}

@media all and (max-width: 810px) {
        .description { font-size: 80%; line-height:130%;  max-width:100%; margin-left:0%; }
}





.zitat1 {
        font-family: 'Roboto', sans-serif;
        font-size: 100%;
        font-weight: 300;
        letter-spacing: .02em;
        color: #5F5F5F;
        word-spacing: 0.1em;
        line-height:150%;
        margin-top:20px;
        margin-bottom:0;
        font-style: italic;
}

@media all and (max-width: 810px) {
        .zitat1 { font-size: 80%; line-height:130%;}
}






.kleintext {
        font-family: 'Roboto', sans-serif;
        font-size: 90%;
        font-weight: 400;
        letter-spacing: .03em;
        color: #4F4F4F;
        word-spacing: 0.1em;
        line-height:160%;
        margin-top:2.0em;
        margin-bottom:1.0em;
        padding-right: 5px;
}

@media all and (max-width: 810px) {
        .kleintext { font-size: 80%; }
}



.priceline {
        font-family: 'Roboto', sans-serif;
        font-size: 75%;
        font-weight: 400;
        letter-spacing: .03em;
        color: #4F4F4F;
        word-spacing: 0.1em;
        line-height:160%;
        margin-top:1.0em;
        margin-bottom:1.0em;
        padding-right: 5px;
        text-align:center
}

@media all and (max-width: 810px) {
        .priveline { font-size: 70%; }
}


.stars  { color: #FFBF00; font-size:120%;}

.remark {
        font-family: 'Roboto', sans-serif;
        font-size: 80%;
        font-weight: 400;
        letter-spacing: .03em;
        color: #4F4F4F;
        word-spacing: 0.1em;
        line-height:160%;
        margin-top:2.0em;
        margin-bottom:1.0em;
        border-left:1px solid #8F8F8F;
        padding-left: 20px;
        padding-right: 50px;
        margin-left:20%;

}

@media all and (max-width: 810px) {
        .remark { font-size: 80%; margin-left:25%;  }
}




.columnhead {
        font-family: 'Roboto', sans-serif;
        font-size: 100%;
        font-weight: 300;
        letter-spacing: .2em;
        color: #5F5F5F;
        word-spacing: 0.1em;
        line-height:120%;
        margin-top:20px;
        margin-bottom:0;
        text-align:center;
        text-transform: uppercase;
}

@media all and (max-width: 810px) {
        .columnhead { font-size: 80%; line-height:130%;}
}



.wasistgemeint {
        font-family: 'Roboto', sans-serif;
        font-size: 80%;
        font-weight: 300;
        letter-spacing: .2em;
        color: #000000;
        word-spacing: 0.1em;
        line-height:120%;
        margin-top:40px;
        margin-bottom:30px;
        text-align:left;
        text-transform: uppercase;
}

@media all and (max-width: 810px) {
        .wasistgemeint { font-size: 60%; margin-top:30px; line-height:130%;}
}


.stichwort               { background-color:none; font-weight: 700;}
.stichwortlink,
.stichwortnolink         { color: #3290e9; background-color:none; font-weight: 700; border-bottom:0px solid #FF7F00;}
.stichwortlink:hover     { color: #FFFFFF; background-color:#9BEA5E; font-weight: 700; border-bottom:0px solid #FF7F00;}

.info           {color: #FFFFFF;
                 background-color:#3290e9;
                 font-weight: 700; font-size:110%;
                 border:0px solid #FF7F00; border-radius:20px;
                 padding:1px 10px 1px 10px;
                 margin-right:0px;
                 -webkit-align-items: center;
                 align-items: center;
                 -webkit-justify-content: center;
                 justify-content: center;}


.info:hover     { color: #FFFFFF; background-color:#9BEA5E;}


.fill { color: #FF9F00; font-family: 'Roboto', sans-serif; font-weight:400; font-size:95%;}


.firstword1,
.firstword2      {font-family: 'Roboto', sans-serif; font-weight: 700;  letter-spacing: .08em;  text-transform: uppercase;}

.firstword1      {color: #3a547a;}
.firstword2      {color: #91c214;}

.firstword3      {font-weight:700; letter-spacing: .05em;  }

.semi {font-weight: 400;}
.bold {font-weight: 500;}


/* ==== Kapitelziffer/-bild Portfolio ==== */

.ziffer {
  font-family: 'Prata', serif;
  font-size: 140%;line-height: 100%;
  padding-top:5px;
  color: #91c214;
  text-align:center;

  height: 45px;
  width: 45px;
  border: 1px solid;
  border-radius: 23px;
  border-color:#133645;
  background-color:#FFFFFF;  /* #3a547a;  businessblue  */
  margin:0 auto 20px auto;
  display: -webkit-flex;
  display:         flex;
  -webkit-align-items: center;
          align-items: center;
  -webkit-justify-content: center;
          justify-content: center;

}



.ziffersubline      {font-family: 'Roboto', sans-serif; font-size: 100%; font-weight: 300;  letter-spacing: .1em;  text-transform: uppercase; text-align:center; color: #3a547a;}


.img_angebot_oben { width: 40%;  display: block;  margin-left: auto;  margin-right: auto;
}


@media all and (min-width: 560px) {
        .ziffer     {font-size: 175%; padding-top:5px; width:50px; height: 50px; border-radius:25px;}
        .img_angebot_oben     {width:20%;}
}

@media all and (min-width: 800px) {
        .ziffer     {font-size: 200%; padding-top:6px; width:60px; height: 60px; border-radius:30px; }
        .img_angebot_oben     {width:15%;}
}

@media all and (min-width: 1200px) {
        .ziffer     {font-size: 220%; padding-top:6px; width:70px; height: 70px; border-radius:35px; }
        .img_angebot_oben     {width:12%;}
}

@media all and (min-width: 1450px) {
        .ziffer     {font-size: 250%; padding-top:6px; width:80px; height: 80px; border-radius:65px; }
        .img_angebot_oben     {width:10%;}
}




/* ==== Kapitelziffer 2  ==== */

.ziffer2 {
  font-family: 'Prata', serif;
  font-size: 140%;line-height: 100%;
  padding-top:5px;
  color: #FFFFFF;
  text-align:center;

  height: 45px;
  width: 45px;
  border: 0px solid;
  border-radius: 23px;
  border-color:#CFCFCF;
  background-color:#91c214;
  margin:0 auto 20px auto;
  display: -webkit-flex;
  display:         flex;
  -webkit-align-items: center;
          align-items: center;
  -webkit-justify-content: center;
          justify-content: center;

}


@media all and (min-width: 560px) {
        .ziffer2     {font-size: 175%; padding-top:5px; width:50px; height: 50px; border-radius:25px;}
}

@media all and (min-width: 800px) {
        .ziffer2     {font-size: 200%; padding-top:6px; width:60px; height: 60px; border-radius:30px; }
}

@media all and (min-width: 1200px) {
        .ziffer2     {font-size: 220%; padding-top:6px; width:70px; height: 70px; border-radius:35px; }
}

@media all and (min-width: 1450px) {
        .ziffer2     {font-size: 140%; padding-top:6px; width:45px; height: 45px; border-radius:23px; }
}




/* ==== Typo Positionierungen ==== */


.center {
        text-align:center;
         }


.centermid {text-align:center; max-width:70%; margin:0 auto;}
@media all and (max-width: 1200px) {
         .centermid {text-align:center; max-width:100%; margin:0 auto;}
         }



.centermid50 {text-align:center; max-width:50%; margin:0 auto;}
@media all and (max-width: 1000px) {
         .centermid50 {text-align:center; max-width:100%; margin:0 auto;}
         }


.startsatz {max-width:80%; margin:0 auto;}
@media all and (max-width: 1200px) {
         .startsatz {max-width:100%; margin:0 auto;}
         }



.midrow {max-width:40%; margin:0 auto;}
@media all and (max-width: 1200px) {
         .midrow {max-width:100%; margin:0 auto;}
         }


.midleft {max-width:50%; margin-left:25%;}
@media all and (max-width: 1200px) {
         .midleft {max-width:100%; margin:0 auto;}
         }



.right {
        text-align:right;
         }

/* ==== 4 spalter ==== */
.product_room {
  border-top: 1px solid;
  border-left: 0px solid;
  border-right: 0px solid;
  border-bottom: 1px solid;
  border-color:#000000;
  height: auto;
  width:100%;
  margin:0 auto;
  padding:0px 0 0px 0;
}


.vierspalter_room {
  border: 0px solid;
  border-color:#000000;
  height: auto;
  width:100%;
  margin:0 auto;
  padding:0px 0 0px 0;
}

.vierspalter {
  height: 240px;
  border: 0px solid ;
  border-color:#000000;
  width:50%;
  margin-bottom:10px;
  padding:5px 10px 5px 5px;
  float:left;
}


@media all and (min-width: 560px) {
        .vierspalter_room {width:96%;}
        .vierspalter {width:50%; height: 200px; margin-bottom:30px;}
        .img_textmenue                     { width: 30%; }

}

@media all and (min-width: 800px) {
        .vierspalter_room {width:96%;}
        .vierspalter {width:50%; height: 180px; margin-bottom:10px;}
        .img_textmenue                     { width: 30%; }
}

@media all and (min-width: 1200px) {
        .vierspalter_room {width:96%;}
        .vierspalter {width:25%; height: auto; margin-bottom:10px;}
        .img_textmenue                     { width: 30%; }
}

@media all and (min-width: 1450px) {
        .vierspalter_room {width:96%;}
        .vierspalter {width:25%; height: auto; margin-bottom:10px;}
        .img_textmenue                     { width: 30%; }
}

/* ===================== LISTEN ========================= */


ul {
        padding-left: 15px;
}



.li_doanddont {
        padding-left: 10px;
        list-style: circle;
        font-family: 'Prata', serif;
        font-size: 110%;
        font-weight: 300;
        letter-spacing: .02em;
        color: #5F5F5F;
        line-height:160%;
        margin-top:0;
        margin-bottom:0;
}




/* Mid screens */
@media all and (max-width: 810px) {
        .li_doanddont
                { font-size: 100%; line-height:170%; }

}


/* Small screens */
@media all and (max-width: 560px) {
        ul       {padding-left: 14px; }
        .li_doanddont {font-size: 85%; line-height:170%; padding-left: 8px; }
}





.li_lauftext {
        font-family: 'Roboto', sans-serif;
        padding-left: 10px;
        list-style: disc;
        font-size: 110%;
        font-weight: 300;
        letter-spacing: .02em;
        color: #3F3F3F;
        line-height:160%;
        margin-top:0;
        margin-bottom:0px;
}




@media all and (max-width: 1060px) {
        .li_lauftext { font-size: 95%; line-height:155%; }

}





/* ===================== links ======================================= */

a {
        text-decoration: none;
        color: #91c214;
        outline:0;
}



a:link {
        color: #91c214;
}


a:visited
        {
        color: #91c214;

}


a:link:hover
        {
        color: #91c214;
}

a:visited:hover
        {
        color: #91c214;
}



q::before
        {
        content: '„';
}


q::after
        {
        content: '“';
}







.sublinelinks {
        width:70%;
        margin-left:15%;
        font-family: 'Roboto', sans-serif;
        font-size: 100%;
        font-weight: 500;
        letter-spacing: .1em;
        color: #5F5F5F;
        word-spacing: 0.5em;
        line-height:120%;
        margin-top:-30px;
        margin-bottom:60px;
        text-align:center;
        text-transform: uppercase;
        border-top:1pt dotted #5F5F5F;
        border-bottom:1pt dotted #5F5F5F;
        padding:1em;
}

.sublinelook {
        color: #8F8F8F;
}


.sublinelook:link {
        color: #8F8F8F;
}

.sublinelook:link:hover {
        color: #91c214;
}

.sublinelook:visited
        {
        color: #8F8F8F;
}

.sublinelook:visited:link:hover {
        color: #91c214;
}



@media all and (max-width: 960px) {
        .sublinelinks { width:100%; margin-left:0%; font-size: 80%; line-height:180%;}
}

@media all and (max-width: 560px) {
        .sublinelinks { width:100%; margin-left:0%; font-size: 80%; line-height:180%; margin-top:-10px}
}

/* ===================== lines ======================================= */

hr {
        background-color: none;
        color: #CFCFCF;
        border: none;
        height: 1px;

        width: 100%;
}

.dottedline
        {
        border :none;
        border-top: 1px dotted  #666;
        background-color: #FFFFFF;
        height: 1px;
        width: 100%;
}


.solidline
        {
        border :none;
        border-top: 1px solid  #000000;
        height: 0px;
}

.solidline_none
        {
        border :none;
        border-top: 1px solid  #FFFFFF;
        height: 0px;
}



.verticalLine,
.verticalLine_white
         {
         margin-left: auto;
         margin-right: auto;
         width: 0.0em;
         height:50px;
         background-color:#FFFFFF;
         }

.verticalLine_long
         {
         margin-left: auto;
         margin-right: auto;
         width: 0.0em;
         height:150px;
         background-color:#FFFFFF;
         }

.verticalLine_short,
.verticalLine_short_white
         {
         margin-left: auto;
         margin-right: auto;
         width: 0.0em;
         height:25px;
         background-color:#FFFFFF;
         }

.verticalLine, .verticalLine_long, .verticalLine_short         { border-left: 1px solid #133645;}
.verticalLine_white, .verticalLine_short_white                 { border-left: 1px solid #FFFFFF;}

@media all and (min-width: 1000px) {
        .verticalLine,
        .verticalLine_white
                     {height:100px;}
}


@media all and (min-width: 1000px) {
        .verticalLine_long
                     {height:300px;}
}

@media all and (min-width: 1000px) {
        .verticalLine_short,
        .verticalLine_short_white
                     {height:50px;}
}







.horizontalLine,
.horizontalLine_white,
.horizontalLine_full
         {
         margin-left: auto;
         margin-right: auto;
         width: 0%;
         height:1px;
         background-color:#FFFFFF;
         }


.horizontalLine,
.horizontalLine_full        { border-top: 1px solid #133645;}


@media all and (min-width: 1000px) { .horizontalLine_full  {width:100%;}
}




.horizontalLine_white  { border-top: 1px solid #FFFFFF;}

@media all and (min-width: 1000px) {
        .horizontalLine,
        .horizontalLine_white
                     {width:51.5%;}
}



.horizontalLine_75
         {
         border-top: 1px solid #FFFFFF;
         margin-left: auto;
         margin-right: auto;
         width: 0%;
         height:1px;
         background-color:#FFFFFF;
         }


.horizontalLine_75black
         {
         border-top: 1px solid #133645;
         margin-left: auto;
         margin-right: auto;
         width: 0%;
         height:1px;
         background-color:#FFFFFF;
         }


@media all and (min-width: 560px) { .horizontalLine_75, .horizontalLine_75black   {width:67%; }}

@media all and (min-width: 800px) { .horizontalLine_75, .horizontalLine_75black   {width:67%; }}

@media all and (min-width: 1200px) { .horizontalLine_75, .horizontalLine_75black   {width:80%; }}


.horizontalLine_right,
.horizontalLine_left
         {
         border-top: 1px solid #133645;
         margin-left: auto;
         margin-right: auto;
         width: 0%;
         height:1px;
         background-color:#FFFFFF;
         }

@media all and (min-width: 1000px) { .horizontalLine_right  {margin-left:-3%; width:53%;}
}

@media all and (min-width: 1000px) { .horizontalLine_left  {margin-left:50%; width:53%;}
}








.linedot {
  height: 10px;
  width: 10px;
  border: 0px solid;
  border-radius: 5px;
  border-color:#133645;
  background-color:#133645;
  margin:0 auto;
}





/*  ------------------ distancer  ------------------------------------- */

.zero   {font-family: 'Roboto', sans-serif;  font-size: 0.1%; color: none; line-height:0.1%;}

.gap5    {border-left: 0px solid; height: 5px; width: 0px;}
.gap10   {border-left: 0px solid; height: 10px; width: 0px;}
.gap20   {border-left: 0px solid; height: 20px; width: 0px;}
.gap40   {border-left: 0px solid; height: 40px; width: 0px;}
.gap60   {border-left: 0px solid; height: 60px; width: 0px;}
.gap80   {border-left: 0px solid; height: 80px; width: 0px;}
.gap100  {border-left: 0px solid; height: 100px; width: 0px;}


/* -------------- In und out unterschiedlicher Contents ---------------- */

/* Mid screens - schaltet bei Tablets aus: */
@media all and (max-width: 960px) {
        .displaynone_mid {
                display:none;
                }
}


/* Small screens - schaltet bei kleineren aus - bei größeren an: */
@media all and (max-width: 561px) {
        .displaynone {
                display:none;
                }
}


@keyframes fadein{
        from{opacity:0;}to{opacity:1;}}
        @-moz-keyframes fadein{from{opacity:0;}to{opacity:1;}}
        @-webkit-keyframes fadein{from{opacity:0;}to{opacity:1;}}
        @-o-keyframes fadein{from{opacity:0;}to{opacity:1;}}



/* -------------- In und out unterschiedlicher Contents ---------------- */

/* Mid screens - schaltet bei Tablets aus: */
@media all and (max-width: 960px) {
        .displaynone_mid {
                display:none;
                }
}


/* Small screens - schaltet bei kleineren aus - bei größeren an: */
@media all and (max-width: 561px) {
        .displaynone {
                display:none;
                }
}



/*  ... schaltet bei kleineren ein
                 bei größeren  aus*/
@media all and (min-width: 560px) {
        .displaymob {
                display:none;
                }


/*************** added by Michael Schebesta 03.2019 START **********************/

h5 {
    font-family: 'Prata', serif;
    font-size: 450%;
    line-height: 110%;
    color: #000000;
    text-align:center;
    margin: 40px 0 32px 0;
    }


@media all and (max-width: 1060px) {
        h5 { font-size: 380%; margin: 40px 0 26px 0;}
}


@media all and (max-width: 560px) {
        h5 { font-size: 300%; margin: 20px 0 22px 0;}
}



.h1smaller {
        font-family: 'Prata', serif;
        font-size: 350%;
        line-height: 110%;
        color: #000000;
        text-align:center;
}



@media all and (max-width: 1060px) {
        .h1smaller { font-size: 280%; }
}

@media all and (max-width: 560px) {
        .h1smaller { font-size: 120%; }
}


/* ===================== colors ======================================= */

.green { color: #91c214;}
.brown { color: #3290e9;}

.white   { color: #FFFFFF; }
.grey   { color: #8F8F8F; }
.green2   { color: #297800; }
.red   { color: #FF0000; }
.blue  { color: #1940CA; }
.violet   { color: #9911E6; }
.orange  { color: #FFBF00; }


.gold_PARK   { color: #C1A41A; }

.warnung   { color: #7F7F7F; }


.businessblue      {color: #2c5188;}
.businessbluemid   {color: #8baad7;}
.businessbluehell  {color: #eef9ff;}

.red   { color: #FF0000; }


/*  ----- displaying  --- */


.displaysmart_no {display: block;}
         @media all and (max-width: 960px) {.displaysmart_no {display: none;}
}


.displaysmart_on {display: none;}
         @media all and (max-width: 960px) {.displaysmart_on {display: block;}
}

/*************** added by Michael Schebesta END **********************/