
/* Allgemeine Menüstile */
ul.vertical.menu {
    padding-left: 0 !important;
}
ul.service-menu.menu.left li,
ul.service-menu.left li,
ul.service-menu.vertical li,
ul.service-menu li {
    list-style-type: none;
    /*padding-right: 15px;*/
    /*padding: 5px;*/
}
ul.service-menu.menu.vertical.right li {
    text-align: right;
}
ul.service-menu.menu.vertical.center li {
    text-align: center;
}
ul.service-menu.menu,
ul.service-menu {
    margin: 0 !important;
    padding: 0 !important;
    list-style-type: none;
}

ul.service-menu.menu li a,
ul.service-menu.menu li a {
    margin: 5px 0;
    padding: 5px;
    /*font-size: inherit;*/
}
ul.service-menu.menu.pipe li a,
ul.service-menu.right.pipe li a {
    margin: 5px 0;
    padding: 5px 0;
    /*font-size: inherit !important;*/
}
ul.service-menu.menu.vertical li a,
ul.service-menu.vertical li a {
    margin: 0 0 5px 0;
}
ul.service-menu.menu.pipe li > a:after,
ul.service-menu.pipe li > a:after {
    /*font-family: "foundation-icons";*/
    content: "\2223";
    padding: 0 15px !important;
}

ul.service-menu.menu.pipe li:last-child > a:after,
ul.service-menu.pipe li:last-child > a:after {
    content: inherit;
    display: none;
    visibility: hidden;
}
/* Responsives Layout für Menüs */
@media only screen and (min-width: 640px) {
    ul.service-menu.menu.align-right.pipe {
        text-align: right;
        display: block;
    }
}

ul.service-menu.menu.align-right.pipe li {
    float: none;
    display: inline-block;
}
/* Spezielle Menüstile */
.service .service-menu.menu>li>a {
    margin: 0;
    padding: 0
}

/* Zentrierte Menü-Linien */
.center-pipe-menu {
    text-align: center;
}
.center-pipe-menu ul.service-menu.menu.pipe.centered,
.center-pipe-menu ul.service-menu.pipe.centered {
    margin: 0 auto !important;
}
.center-pipe-menu ul.service-menu.menu.pipe.centered li,
.center-pipe-menu ul.service-menu.pipe.centered li {
    display: inline-block;
    text-align: center;
}

/* Menü mit Pfeilen und Unterstrichen */
.service-menu.bottomborder.arrow-right li a {
    border-bottom: 1px solid #fff;
    padding: 10px 15px 8px 0 !important
}
.service-menu.bottomborder.arrow-right li a:after {
    font-family: "Font Awesome 6 Pro";
    content:"\f105";
    float: right;
}


.service-menu.bottomborder.arrow-right-inline li a {
    border-bottom: 1px solid #fff;
    padding: 10px 15px 8px 0 !important;
    text-decoration: none;
}
.service-menu.bottomborder.arrow-right-inline li a:after {
    font-family: "Font Awesome 6 Pro";
    content:"\f107";
    text-align: center;
    width: 1.25em;
    padding-left: 5px;
}

/* Menü mit großem Padding und Pfeil links */
.service-menu.bigpadding.arrow-left li a {
    padding: 10px 0 8px 0 !important
}
.service-menu.bigpadding.arrow-left li a:after {
    font-family: "Font Awesome 6 Pro";
    content:"\f105";
    float: left;
}


/* Alternative Pfeil-Menüs (Typ V2) */
.service-menu.arrow-left-v2 li a {
    padding: 2px 0 2px 0 !important
}
.service-menu.arrow-left-v2 li a:before {
    font-family: "Font Awesome 6 Pro";
    content:"\f0da";
    /*float: left;*/
    padding-right: 5px;
    text-align: center;
    width: 1.25em;
    font-weight: 900;
}

ul.service-menu.menu a {
    white-space: normal !important;
}

.service-menu.menu.inline.sep-line li a:after {
    font-family: "Font Awesome 6 Pro";
    font-size: 20px;
    padding: 0 0 0 10px;
    content: "\f068";
}

/* Abschnitts-Grenzen (Section Borders) */

.section-borders {
    border-top: 1px solid #222;
    border-bottom: 1px solid #222;
    background: #fff;

}
.section-borders ul.menu {
    padding: 20px 0 !important;
}
.section-borders li.section-menu-item a {
    text-decoration: none;
    text-transform: uppercase;
}
.section-borders li.section-menu-item a.is-active {
    transform: scale(1);
    color: red;
}
.section-borders li.section-menu-item span {
    position: relative;
    transition: all 0.285s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0s;
}
.section-borders li.section-menu-item a.is-active span:after {
    font-family: "Font Awesome 6 Pro";
    position: absolute;
    bottom: -37px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    font-size: 20px;
    font-weight: 900;
    content: "\f111";
    color: red;
    transition: all 0.285s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0s;
}
/* Klassen zur Logo-Anzeige */
.show-logo-img1 .logoclaim .is-tmg-1,
.show-logo-img1 .logoclaim .ce-bodytext {
    display: none;
}
.show-logo-img2 .logoclaim .is-tmg-0,
.show-logo-img2 .logoclaim .ce-bodytext {
    display: none;
}
.show-logo-text .logoclaim .is-tmg-0,
.show-logo-text .logoclaim .is-tmg-1 {
    display: none;
}

/* Abschnitts-Menüs */
ul.section-menu .section-menu-page-title {
    display: none;
}

ul.section-menu li.section-menu-item a {
    transform: scale(1);
    transition: all 0.285s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0s;
}
ul.section-menu li.section-menu-item a.is-active {
    transform: scale(1.1);
}
ul.section-menu,
ul.section-menu ul  {
    margin: 0 !important;
    padding: 0 !important;
}
ul.section-menu li {
    list-style-type: none;
}

.section-menu.small a {
    font-size:  var(--font-small);
    margin: .3em 0 !important;
    padding:  0 !important;
    color: #666
}
.section-menu.prefix a:before {
    font-family: "Font Awesome 6 Pro";
    content: "\f054";
    padding-right: .5em;
    font-size: .9rem;
}

/* Abstandshalter in Menüs */
li.spacer {
    min-height: 20px
}
.spacer span {
    font-size: 0;
}
/* Scroll-Navigationspunkte (Section Dots) */
.section-dots {
    position: fixed;
    z-index: 2;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    /*background: white;*/
}
.section-dots ul  a span {
    display: none;
}
.section-dots ul a:after {
    font-family: "Font Awesome 6 Pro";
    font-weight: 900;
    font-size: 15px;
    content: "\f192";
    margin: 0 !important;
    padding: 15px !important;
    transition: all 0.285s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0s;
}
.section-dots ul a:hover:after {
    font-size: 20px !important;
    padding: 0 !important;
}
.section-dots ul a.is-active:after {
    transition: all 0.285s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0s;
    color: red;
}
/* # ~~~~~ section-dots ~~~~~ # */
/* Scroll-Hinweise mit Pfeilen */
.section-arrow-down {
    position: relative;
}
.section-arrow-down ul  a span {
    display: none;
}
.section-arrow-down {
    position: absolute;
    z-index: 1;
    right: 50%;
    transform: translateX(-50%) translateY(-50%);
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    min-height: 90vh;
    width: 100vw;
}
.section-arrow-down ul a:after {
    font-family: "Font Awesome 6 Pro";
    font-size: 50px;
    content: "\f107";
    margin: 0 !important;
    padding: 0 !important;
    transition: all 0.885s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0s;
}
.section-arrow-down ul a:hover:after {
    transition: all 0.885s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0s;
    color: red;
}
.section-arrow-down li.section-menu-item  {
    display: none;
}
.section-arrow-down li.section-menu-item:first-child  {
    display: block;
}
.section-arrow-down ul a:after {
    position: absolute;
    font-family: "Font Awesome 6 Pro";
    font-size: 50px;
    content: "\f107";
    margin: 0 !important;
    padding: 0 !important;
    transition: all 0.885s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0s;
}
/* Animation für Scroll-Pfeile */
.section-arrow-down {
    -webkit-animation-name: rocket;
    -webkit-animation-duration: 2s;
    animation-name: rocket;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
}
#outerspace:hover div.rocket {
    -webkit-transform: translate(0px, -30px);
    -moz-transform: translate(0px, -30px);
    -o-transform: translate(0px, -30px);
    -ms-transform: translate(0px, -30px);
    transform: translate(0px, -30px);
}

/* Raketeneffekt-Animation */
@-webkit-keyframes rocket {
    from {
        -webkit-transform: translate(0px, 0);
        -moz-transform: translate(0px, 0);
        -o-transform: translate(0px, 0);
        -ms-transform: translate(0px, 0);
        transform: translate(0px, 0);
    }
    to {
        -webkit-transform: translate(0px, -30px);
        -moz-transform: translate(0px, -30px);
        -o-transform: translate(0px, -30px);
        -ms-transform: translate(0px, -30px);
        transform: translate(0px, -30px);
    }
}

@keyframes rocket {
    from {
        -webkit-transform: translate(0px, 0);
        -moz-transform: translate(0px, 0);
        -o-transform: translate(0px, 0);
        -ms-transform: translate(0px, 0);
        transform: translate(0px, 0);
    }
    to {
        -webkit-transform: translate(0px, -30px);
        -moz-transform: translate(0px, -30px);
        -o-transform: translate(0px, -30px);
        -ms-transform: translate(0px, -30px);
        transform: translate(0px, -30px);
    }
}
/* Farbänderungsanimation */
@-o-keyframes fadeIt {
    0%   { color: #FFFFFF; }
    50%  { color: #AD301B; }
    100% { color: #FFFFFF; }
}
@keyframes fadeIt {
    0%   { color: #FFFFFF; }
    50%  { color: #AD301B; }
    100% { color: #FFFFFF; }
}
