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

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

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



* {     -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
         box-sizing: border-box;
         }




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: 1200px;
        padding: 0 0px 1em 0px;
        margin: 0 auto;
         }

@media all and (max-width: 1159px) {
        .wrapper {
        padding: 0 15px 1em 15px;
         }
}



.wrapper960 {
        max-width: 960px;
        padding: 0 0px 1em 0px;
        margin: 0 auto;
         }



@media all and (max-width: 1159px) {
        .wrapper {
        padding: 0 15px 1em 15px;
         }
}


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


.backgroundvideo {
        background-color: #000;

         }


/* --- menuebalken unten --- */
.menubar {
        width: 100%;
        position: fixed;
        bottom: -80px;
        border-top: 0px solid #CEAD16;
        background: #DFDFDF;
        opacity:0.9;
        z-index: 50
}

.menubar:hover {
        width: 100%;
        position: fixed;
        bottom:-10px;
        border-top: 0px solid #DFDFDF;
        padding-top: 0px;
        background: #FFFFFF;
        opacity:1;
        transition: all .2s ease-in-out;
}



.menuboxhome {
        max-width: 960px;
        margin: 0 auto;
        padding-top: 10px;
        padding-bottom: 10px;
}


.menubox {
        max-width: 960px;
        margin: 0 auto;
        padding-bottom: 10px;
        padding-top: 12px;
        margin-bottom: 100px;
}



.lastelement {
    /*    background-color: #EFEFEF;    */
        background: linear-gradient(0deg, #FFFFFF, #FFFFFF, #CFCFCF);
        height:200px;
         }



/* Mid screens */
@media all and (max-width: 810px) {

        .menubar {
        width: 100%;
        position: fixed;
        bottom: 0px;
        background-color: #EFEFEF;
         }
        .menubar:hover {
        width: 100%;
        position: fixed;
        bottom: 0px;
        padding-top: 0px;
        background-color: #EFEFEF;
         }
         .menubox {
        padding-bottom: 0px;
        padding-top: 12px;
        margin-bottom: 0px;
         }
         .lastelement {
        height:150px;
         }
}




.menucell_1 {
        width: 10%;
        float:left;
        display: block;
}


.menucell_2 {
        width: 20%;
        float:left;
        display: block;
}

.menucell_3 {
        width: 20%;
        float:left;
        display: block;
}

.menucell_4 {
        width: 20%;
        float:left;
        display: block;
}

.menucell_5 {
        width: 20%;
        float:left;
        display: block;

}

.menucell_6 {
        width: 10%;
        float:left;
        display: block;
}


.menucell_30 {
        width: 30%;
        float:left;
        display: block;
}


/* Small screens    7er          */
@media all and (max-width: 560px) {
        .menubox {
        width:100%;
        margin-bottom:62px;
         }


         .lastelement {
        height:135px;
         }

        .menucell_1 {
        width: 14.28%;
         }
        .menucell_2 {
        display: none;
         }
         .menucell_3 {
        width: 28.56%;
         }
         .menucell_4 {
        width: 28.56%;
         }
         .menucell_5 {
        width: 28.56%;
         }
         .menucell_6 {
        display: none;
         }
}





.preloads {
  width:1px;
  height:1px;
  visibility:hidden;
}


/* --- hintergrundfarben --- */

.bgcolor_blue {background-color: #68d0e7; }

.bgcolor_darkblue {background-color: #0f1c3a; }

.bgcolor_red {background-color: #A51C8C; }

.bgcolor_violet {background-color: #631B85; }

.bgcolor_green {background-color: #afd510; }

.bgcolor_petrol {background-color: #16CECB; }

.bgcolor_yellow {background-color: #FEE803; }

.bgcolor_waldmeistereis {background-color: #e6feef; }

.bgcolor_creme {background-color: #F9F7EB; }


.bgcolor_black {background-color: #000000; }

.bgcolor_darkgrey {background-color: #5F5F5F; }

.bgcolor_lightgrey {background-color: #EFEFEF; }

.bgcolor_shinygrey {background-color: #f4f4f5; }

.bgcolor_midgrey {background-color: #DFDFDF; }

.bgcolor_show {background-color: #CFCFCF; }

.bgcolor_kartongrau {background-color: #cbd1cb; }
.bgcolor_kartonhell {background-color: #e9ece9; }
.bgcolor_showhide {background-color: #f2f4f2; }

.bgcolor_nightblue {background-color: #0f1c3a; }

.bgcolor_nightblue_ergo {background-color: #2f124f; }

.bgcolor_ergo_1 {background-color: #e2d4f9; }





.wide {
        padding: 0 0 0 0;
        margin: 0 auto;
         }



.widegrey {
        padding: 0 1% 0em 1%;
        margin: 0;
        font-family: 'Noto Sans', sans-serif;
        background-color: #EFEFEF;
}


.wrapgrey {
        max-width: 960px;
        padding: 0 1em 2em 1em;
        margin: 0 auto;
        background-color: #EFEFEF;
}



/* NAVI NEU nur Up-Bottom unten */
nav {
        position: fixed;
        width: 42px;
        height: auto;
        bottom: 70px;
        right: 20px;
        background-color: none;
        z-index: 60;
}



@media all and (max-width: 810px) {
         nav {
        width: 32px;
        height: auto;
        bottom: 85px;
        right: 10px;
         }
}


@media all and (max-width: 560px) {
         nav {
        width: 32px;
        height: auto;
        bottom: 75px;
        right: 5px;
         }
}



nav ul {
        font-family: 'Noto Sans', sans-serif;
        padding: 0em;
        margin: 0;
        }


nav ul li {
        font-family: 'Noto Sans', sans-serif;
        list-style-type: none;
}


nav ul li a:link {
        font-family: 'Noto Sans', sans-serif;
        color: white;
}






img {
        width: 100%;
}



.ms_logo {
        width: 20px;
        float:left;
        margin-right:10px;;
}


/* Small screens */
@media all and (max-width: 560px) {
        .ms_logo {
                width: 25px;
                }
}



.topright {
        float: right;
        width: auto;
        margin: 0 0 1.6em 1.6em;
}


.topleft {
        float: left;
        width: auto;
        margin: 0 1.6em 1.6em 0;
}







/* ===================== LISTEN ========================= */
#menuethemen {
        padding-left: 20px;
        list-style-image: url(images/themen_bullet_gold.svg);
        font-family: 'Noto Sans', sans-serif;
        font-size: 150%;
        font-weight: normal;
        line-height: 1.2em;
        letter-spacing: 0.1em;
        text-transform: uppercase;
}

.menuethemen_li_abstand {
        padding-bottom:10px;
}



/* Mid screens */
@media all and (max-width: 810px) {
        #menuethemen {
                font-size: 120%;
                }
}


/* Small screens */
@media all and (max-width: 560px) {
        #menuethemen {
                font-size: 100%;
                line-height: 1.1em;
                }
        .menuethemen_li_abstand {
                 padding-bottom:12px;
         }
}


.listeh2  {
        padding-left: 10px;
        list-style-image: url(images/themen_bullet_gold.svg);
        font-family: 'Noto Sans', sans-serif;
        font-size: 160%;
        line-height: 1.7em;
        font-weight: normal;
        letter-spacing: 0.05em;
        text-transform: uppercase;
}


#details {
        padding-left: 102px;
        list-style-image: url(images/themen_bulletarrow_black.svg);
        font-family: 'Noto Sans', sans-serif;
        font-size: 100%;
        line-height: 2em;
        font-weight: normal;
        letter-spacing: 0.1em;
        text-transform: uppercase;
}




#listegross {
        padding-left: 20px;
        list-style-image: url(images/themen_bullet.png);
        font-family: 'Noto Sans', sans-serif;
        color: #1C83A5;
        font-size: 160%;
        line-height: 1.4em;
        font-weight: normal;
        letter-spacing: 0.05em;
}




.listeklein {
        padding-left: 10px;
        list-style-image: url(images/liste_bullet_rund.svg);
        font-family: 'Noto Sans', sans-serif;
        color: #1C83A5;
        font-size: 120%;
        line-height: 1.4em;
        letter-spacing: 0.05em;
        text-transform: uppercase;
}



.listecase {
        padding-left: 10px;
        list-style-image: url(images/liste_bullet_rund_case.svg);
        font-family: 'Noto Sans', sans-serif;
        color: #333;
        font-size: 95%;
        line-height: 1.7em;
}


.listemodule {
        padding-left: 10px;

        font-family: 'Noto Sans', sans-serif;
        color: #1C83A5;
        font-size: 120%;
        line-height: 1.4em;
        letter-spacing: 0.05em;

}


#diskurs    { background-color: #EFEFEF; }
#spalte_A01 { float: left; width: 20%;  }
#spalte_A02 { float: left; width: 60%; padding: 0% 8% 0% 2%;
              font-family: 'Noto Sans', sans-serif; font-size: 1.3em; letter-spacing: 0.05em; text-transform: uppercase; }
#spalte_A03 { float: left; width: 10%; }




.download    { background-color: #e9ece9; }
.spalte_DL01 { float: left; width: 20%;  }
.spalte_DL02 { float: left; width: 60%; padding: 0% 8% 0% 2%;
              font-family: 'Noto Sans', sans-serif; font-size: 1.1em; letter-spacing: 0.05em; text-transform: uppercase; }
.spalte_DL03 { float: left; width: 10%; }



.tab_nav_oben       {
         width: 100%;
         margin-bottom: -2em;
         border: 0px;
         cellpadding: 0;
         cellspacing: 0;
         }



span.mehr {
         display: block;
         margin-top: 30px;
         height: 30px;
         background-color: #CFCFCF;
         padding: 3px 10px 1px 2%;
         color: #FFFFFF;
         font-size: 1.7em;
         font-weight: normal;
         letter-spacing: 0.08em;
         cursor: Pointer;
}
span.mehr:hover {
         color: #5F5F5F;
}


span.aufklapp {
         color: #9F9F9F;
         cursor: Pointer;
}
span.aufklapp:hover {
         color: #FFFFFF;
}




/*  SHOW HIDE neu 03  */
.show_container {
  text-align: left;
  background-color: #f2f4f2;
  border: none;
  padding:0.1em 1em 0.1em 0.5em;
  cursor: pointer
}

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



form,
.subscribe:hover>div,
.hidden>div {
  display: none
}











#2spaltig {
         z-index:1;
         margin: auto;
         overflow: visible;
}
         .zweierSpalte {
         float: left;
         width: 46%;
         padding-right: 4%;
         padding-left: 0%;
}


#4spaltig {
         z-index:1;
         margin: auto;
         overflow: visible;
}
.viererSpalte {
         float: left;
         width: 22%;
         padding-right: 3%;
         padding-left: 0%;
}








h1 {
        font-family: 'Yantramanav', sans-serif;
        font-size: 400%;
        line-height: 1.0em;
        font-weight: 100;

}

.h1_gold {
        color: #CEAD16;
}

.h1ms {
        font-family: 'Rubik One', sans-serif;
        font-size: 120%;
        line-height: 1.5em;
        font-weight: normal;
        text-transform: uppercase;
}



.h1_eng,
.h1_eng_2 {
        line-height: 1.0em;
}



@media all and (min-width: 560px) {
        h1,
        .h1_eng,
        .h1ms {
                font-size:260%;
                line-height: 0.8em;
                margin-top:40px;
                }
}


@media all and (min-width: 640px) {
        h1,
        .h1_eng,
        .h1ms {
                font-size:400%;
                line-height: 1.0em;
                margin-top:40px;
                }
}

/* Small screens */
@media all and (min-width: 560px) {
        .h1_eng_2,
        .h1ms {
                font-size:240%;
                line-height: 1.0em;
                margin-top:40px;
                }
}



h2 {
        font-family: 'Yantramanav', sans-serif;
        font-size: 240%;
        font-weight: 100;
        line-height: 1.2em;
        color: #3F3F3F;

}




/* Small screens */
@media all and (min-width: 560px) {
        h2 {
                font-size:300%;
                line-height: 1.0em;
                margin-top:40px;
                }
}


/* big screens */
@media all and (min-width: 960px) {
        h2 {
                font-size:400%;
                line-height: 1.0em;
                margin-top:40px;
                }
}

.h2ms {
        font-family: 'Noto Sans', sans-serif;
        font-size: 160%;
        font-weight: normal;
        word-spacing: 0.05em;
        line-height: 1.4em;
        color: #3F3F3F;
        text-transform: uppercase;
}
/* Small screens */
@media all and (min-width: 560px) {
        .h2ms {
                font-size:200%;
                }
}

.gold {
        font-family: 'Noto Sans', sans-serif;
        font-size: 200%;
        font-weight: normal;
        line-height: 1.4em;
        color: #CEAD16;
        text-transform: uppercase;
}

.h2_white {
        font-family: 'Noto Sans', sans-serif;
        font-size: 200%;
        font-weight: normal;
        line-height: 1.4em;
        color: #FFFFFF;
        text-transform: uppercase;
}






/* Small screens */
@media all and (max-width: 560px) {
        .gold,
        .h2_white {
                font-size:130%;
                line-height: 1.3em;
                }
}


h3 {
        font-family: 'Noto Sans', sans-serif;
        font-size: 80%;
        letter-spacing: 0.1em;
        font-weight: bold;
        line-height: 1.7em;
        color: #C6B619;
}


.h3bu {
        font-family: 'Noto Sans', sans-serif;
        font-size: 75%;
        letter-spacing: 0.1em;
        font-weight: normal;
        line-height: 1.4em;
        color: #AFAFAF;
        max-width: 70%;
        padding: 0 0 0 30%;
}

.h3bu2 {
        font-family: 'Noto Sans', sans-serif;
        font-size: 75%;
        letter-spacing: 0.1em;
        font-weight: normal;
        line-height: 1.4em;
        color: #D0EDA5;
        max-width: 70%;
        padding: 0 0 0 30%;
}

h4 {
        font-family: 'Rubik One', sans-serif;
        font-size:6em;
        font-weight: normal;
        line-height:0.1em;
        color: #000;
}





h5 {
        font-family: 'Rubik', sans-serif;
        font-size:210%;
        color: #000;
        margin-top:40px;
        margin-bottom:20px;
}

.h5_gold {
        color: #CEAD16;
        text-transform: uppercase;
}

/* Small screens */
@media all and (max-width: 560px) {
        h5 {
                font-size: 150%;
                margin-top:30px;
                margin-bottom:10px;
                }
}








.h5versal {
        font-family: 'Rubik', sans-serif;
        font-size:2.1em;

        color: #000;
        text-transform: uppercase;
}
/* Small screens */
@media all and (max-width: 560px) {
        .h5versal {
                font-size: 130%;
                }
}

.h5versalcolor {
        font-family: 'Rubik', sans-serif;
        font-size:2.5em;
        letter-spacing: .1em;

        line-height:0.1em;
        color: #C6B619;
        text-transform: uppercase;
}


.h5Vsmall {
        font-family: 'Rubik', sans-serif;
        font-size:1.8em;

        line-height:1.2em;
        color: #000;
        text-transform: uppercase;
}




h6 {
        font-family: 'Noto Sans', sans-serif;
        font-size: 100%;
        letter-spacing: .4em;
        font-weight: normal;
        line-height:1.9em;
        text-transform: uppercase;
        color: #C9B319;          <!-- gold -->
}


p {
        font-family: 'Noto Sans', sans-serif;
        font-size: 95%;
        color: #333;
        word-spacing: 0.1em;
        line-height:1.7em;
}


.p_white {
        font-family: 'Noto Sans', sans-serif;
        font-size: 95;
        color: #FFFFFF;
        word-spacing: 0.1em;
        line-height:1.7em;
}


.p_white_wide {
        font-family: 'Noto Sans', sans-serif;
        font-size: 95%;
        color: #DFDFDF;
        letter-spacing: 0.05em;
        line-height:2.0em;
}



.p_gold {
        font-family: 'Noto Sans', sans-serif;
        font-size: 95;
        color: #C6B619;
        word-spacing: 0.1em;
        line-height:1.7em;
}




.p_padding {
        font-family: 'Noto Sans', sans-serif;
        font-size: 95%;
        color: #333;
        word-spacing: 0.1em;
        line-height:1.7em;
        padding:0.5em 1em 0.5em 1.5em
}

.anlauf {
        font-family: 'Noto Sans', sans-serif;
        font-size: 130%;
        font-weight: normal;
        letter-spacing: .05em;
        color: #6F6F6F;
        word-spacing: 0.1em;
        line-height:1.5em;
}

.font_4 {
        font-family: 'Noto Sans', sans-serif;
        font-size: 70%;
        color: #7F7F7F;
        line-height:1.4em;
}

.font_5 {
        font-family: 'Noto Sans', sans-serif;
        font-size: 70%;
        font-weight: normal;
        letter-spacing: .1em;
        color: #3F3F3F;
        word-spacing: 0.1em;
        line-height:1.3em;
}


.font_6 {
        font-family: 'Noto Sans', sans-serif;
        font-size: 80%;
        font-weight: normal;
        color: #333;
        word-spacing: 0.1em;
        line-height:2em;
}


.font_7 {
        font-family: 'Noto Sans', sans-serif;
        font-size: 80%;
        font-weight: bold;
        color: #333;
        word-spacing: 0.1em;
        line-height:1.5em;
}


.font_8 {
        font-family: 'Noto Sans', sans-serif;
        font-size: 80%;
        color: #333;
        word-spacing: 0.1em;
        line-height:1.5em;
}


.font_credits {
        font-family: 'Noto Sans', sans-serif;
        font-size: 55%;
        color: #5F5F5F;
        line-height:1.5em;
}



.fliesshead {
        font-family: 'Noto Sans', sans-serif;
        font-size: 95%;
        font-weight: bold;
        letter-spacing: .1em;
        padding-top: 1.5em;
        color: #C9B319;
        line-height:1em;
        text-transform: uppercase;
}


.fliesshead_weiss {
        font-family: 'Noto Sans', sans-serif;
        font-size: 95%;
        font-weight: bold;
        letter-spacing: .1em;
        padding-top: 1.5em;
        color: #FFFFFF;
        line-height:1em;
        text-transform: uppercase;
}




#adresshead {
        font-family: 'Noto Sans', sans-serif;
        font-size:70%;
        font-weight: normal;
        letter-spacing: 0.1em;
        line-height:1.4em;
        color: #6F6F6F;
        margin-top:15px;
        margin-bottom:0px;
}


/* Small screens */
@media all and (max-width: 560px) {
        #adresshead {
               font-size:50%;
                }
}


#adresshead_bottom {
        font-family: 'Noto Sans', sans-serif;
        font-size:65%;
        font-weight: normal;
        letter-spacing: 0.1em;
        line-height:1.0em;
        color: #5F5F5F;
        margin-top:0px;
        margin-bottom:10px;
        text-align:center;
}


/* Mid screens */
@media all and (max-width: 810px) {
        #adresshead_bottom {
               display:none;
                }
}







ul, ol {
        font-family: 'Noto Sans', sans-serif;
        font-size: 100%;
        color: #333;
        word-spacing: 0.1em;
        line-height:1.8em;
        padding-left: 0.6em;
        margin-left: 0.6em;
}


ul.overview {
        font-family: 'Noto Sans', sans-serif;
        font-size: 100%;
        color: #1C86A0;
        word-spacing: 0.1em;
        line-height:1.7em;
        letter-spacing: 0.1em;
        text-transform: uppercase;
}


ul.overviewcolor {
        font-family: 'Noto Sans', sans-serif;
        font-size: 100%;
        color: #B6DDEF;
        word-spacing: 0.1em;
        line-height:1.7em;
        letter-spacing: 0.1em;
        text-transform: uppercase;
}


#goodies {
        font-family: 'Noto Sans', sans-serif;
        font-size: 85%;
        letter-spacing: 0em;
        font-weight: normal;
        line-height:1.6em;
        color: #666;
}


d1 {
        font-family: 'Noto Sans', sans-serif;
        font-size: 85%;
        letter-spacing: 0em;
        font-weight: normal;
        line-height:1em;
        color: #fff;
        background-color:#7A7A7A;
}



a {
        text-decoration: none;
}



a:link {
        color: #AFAFAF;     <!-- grau -->
}


a:visited
        {
        color: #AFAFAF;     <!-- grau -->
}


a:link:hover
        {
        color: #E1C513;     <!-- gold -->
}

a:visited:hover
        {
        color: #87BE1A;     <!-- gruen -->
}



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


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




/* ===================== 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%;
}



hr {
        background-color: #666;
        color: #666;
        border: #666;
        height: 1px;
        align: center;
        width: 100%;
}

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


.dottedline_neg
        {
        border :none;
        border-top: 1px dotted  #DFDFDF;
        background-color: #8F8F8F;
        height: 1px;
        width: 100%;
}


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


.solidline_none
        {
        border :none;
        border-top: 1px solid  #FFFFFF;
        background-color: #FFFFFF;
        height: 1px;
        width: 100%;
}




.icon1 {
        height: 25px;
        width: auto;
}


.icon2 {
        height: 35px;
        width: auto;
}





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


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

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




.arrowdown_docked {
  border-right: 1px solid #133645;
  border-bottom: 1px solid #133645;
  margin-left: auto;
  margin-right: auto;
  margin-top: -58px;
  margin-bottom: 10px;
  width: 50px;
  height:50px;
  transform: rotate(45deg);
}



.arrowdown {
  border-right: 1px solid #133645;
  border-bottom: 1px solid #133645;
  margin-left: auto;
  margin-right: auto;
  width: 50px;
  height:50px;
  transform: rotate(45deg);
}






.verticalLineShort
         {
         border-left: 1px solid #133645;
         margin-left: auto;
         margin-right: auto;
         margin-top: 20px;
         margin-bottom: 20px;
         width: 0.1em;
         height:50px;
         }




/*  ------------------ 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;}




.white {
        color: #FFFFFF;

}


/* 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;
                }
}



@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;}}