/*
Theme Name: Siemens Depot Network
Author: MOLOTOW Web Development
Author URI: https://www.molotow-web.com/
Description: Theme for Siemens Depot Network Touchscreen Web App
Version: 1.1
Text Domain: siemens-depot-network
*/

/* TEMP start */
/*
#main:after {
    content: "";
    display: block;
    width: 3840px;
    height: 2160px;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url("img/standorte-overlay.png");
    z-index: 1;
    opacity: 0.3;
}
#location-screensaver-wrapper {
    display: none !important;
}
*/

/* TEMP end */

* {
    margin: 0;
    padding: 0;
    user-select: none;
}

html {
    background-color: black !important;
}

body {
    font-family: 'siemens_sansroman';
    font-size: 33px;
    position: relative;
    /*overflow: hidden !important;*/
    width: 3840px;
    height: 2160px;
    background-color: black !important;
}

/* Preloader‐Hintergrund, voller Bildschirm */
#preloader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;     /* Zentrierung in beide Achsen */
    justify-content: center;
    background: black;        /* Hintergrundfarbe deiner Wahl */
    z-index: 9999;
}

/* Kleiner Kreis, der sich dreht */
.loader {
    width: 50px;
    height: 50px;
    border: 6px solid #00FFB9;      /* Äußerer Kreis */
    border-top: 6px solid black;  /* Farbiger Teil */
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0%   { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Anfangs sieht man #app nicht */
#app {
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
    /* plus deine bestehenden Settings für #app (Breite, Höhe, Positionierung, etc.) */
}

body.logged-in {
    overflow: unset;
}

#main {
    height: 2160px;
    left: 0;
    position: relative;
    top: 0;
    width: 3840px;
    transition: all 0.6s ease-in-out;
}

.sdn-version {
    display: block;
    position: absolute;
    bottom: 30px;
    right: 30px;
    z-index: 99;
    color: white;
    font-size: 12px;
}

body:before {
    content: "";
    display: block;
    width: 395px;
    height: 80px;
    position: absolute;
    top: 1973px;
    left: 3288px;
    background-image: url("img/siemens-logo-white.png ");
    background-size: 100% auto;
    z-index: 99;
}

#official-corridors-overlay {
    display: none;
    width: 3056px;
    height: 2160px;
    position: absolute;
    top: 0;
    right: -3056px;
    transition: all 0.6s ease-in-out;
    background-color: #000228;
}
.overlay-open #official-corridors-overlay {
    right: 0;
}

.overlay-open #main {
    left: -3056px;
}
#official-corridors-1 {
    position: absolute;
    left: -83px;
    top: 50%;
    margin-top: -150px;
}
#official-corridors-2 {
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -150px;
    z-index: 2;
    opacity: 0;
    border-left: 4px solid #00E6DC;
}
.overlay-open #official-corridors-1 {
    opacity: 0;
}
.overlay-open #official-corridors-2 {
    opacity: 1;
}
#official-corridors-overlay-img {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    border-left: 4px solid #00E6DC;
}

#location-screensaver-wrapper {
    height: 2160px;
    left: 0;
    position: absolute;
    top: 0;
    width: 3840px;
    z-index: 11;
}

#location-screensaver-wrapper #start-app {
    background: linear-gradient(to right, #00FFB9, #00E6DC);
    border: none;
    bottom: 208px;
    display: block;
    font-family: 'siemens_sansblack';
    font-size: 46px;
    height: 100px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    width: 550px;
}

#location-screensaver-wrapper.loc-hide {
    display: none;
}

#location-screensaver-wrapper.loc-show {
    display: block;
}

#start-screensaver {
    display: block;
    width: 400px;
    height: 200px;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 9;
    opacity: 0;
}

#background-video,
#loc-single-background-video,
#loc-switch-animation-video,
#loc-switch-return-animation-video {
    left: 0;
    position: absolute;
    top: 0;
}
/*
.temp-bg-positions {
    left: 0;
    right: 0;
    position: absolute;
    top: 0;
    bottom: 0;
    background-image: url("img/temp-bg-positions.png");
    background-size: 100% auto;
    opacity: 0.3;
}*/

#loc-switch-animation-video {
    z-index: 9;
}

#loc-single-background-video,
#loc-switch-animation-video,
#loc-switch-return-animation-video {
    opacity: 0;
    visibility: hidden;
}

#loc-switch-animation-video.fade-in {
    visibility: visible;
}

#loc-single-background-video {
    z-index: 10;
}

#loc-single-background-video.fade-in {
    visibility: visible;
}

#loc-switch-return-animation-video {
    z-index: 11;
}

#loc-switch-return-animation-video.fade-in {
    visibility: visible;
}

#main-sidebar {
    color: white;
    left: 0;
    position: absolute;
    top: 0;
}

.location-label,
.location-title,
.location-symbols,
.location-pin {
    position: absolute;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.location-pin {
    transform:translate(6px,6px);
    -moz-transform:translate(6px,6px);
    -ms-transform:translate(6px,6px);
    -webkit-transform:translate(6px,6px);
    -o-transform:translate(6px,6px);
}

.location-title {
    display: none;
}

.location-label {
    font-family: 'siemens_sansblack';
    background: #000028 0% 0% no-repeat padding-box;
    border-radius: 5rem;
    box-sizing: border-box;
    color: white;
    display: inline-block;
    filter: blur(0px);
    padding: 3px 10px 3px 10px;
    text-align: center;
    font-size: 24.5px;
    z-index: 1;
}

.id-2225 .location-label,
.id-2655 .location-label {
    padding: 5px 15px 5px 15px;
}

.loc-filter-coming-soon .location-label,
.loc-filter-coming-soon .location-pin,
.loc-filter-coming-soon .location-line,
.mw-sdn-show-all-labels-on-start .loc-filter-coming-soon .location-label,
.mw-sdn-show-all-labels-on-start .loc-filter-coming-soon .location-pin,
.mw-sdn-show-all-labels-on-start .loc-filter-coming-soon .location-line,
.mw-sdn-show-all-labels-on-start .id-2647 .location-line,
.location-label,
.location-line {
    opacity: 0;
    visibility: hidden;
}

.mw-sdn-show-all-labels-on-start .location-label,
.mw-sdn-show-all-labels-on-start .location-line,
.mw-sdn-show-all-labels-on-start .id-2647.active .location-line {
    opacity: 1;
    visibility: visible;
}

.loc-show .location-label,
.loc-show .location-line,
.loc-filter-coming-soon.loc-show .location-pin,
.mw-sdn-show-all-labels-on-start .loc-filter-coming-soon.loc-show .location-pin,
.mw-sdn-show-all-labels-on-start .loc-filter-coming-soon.loc-show .location-label,
.mw-sdn-show-all-labels-on-start .loc-filter-coming-soon.loc-show .location-pin,
.mw-sdn-show-all-labels-on-start .loc-filter-coming-soon.loc-show .location-line {
    opacity: 1;
    visibility: visible;
}

.loc-hide .location-pin,
.mw-sdn-show-all-labels-on-start .loc-hide .location-label,
.mw-sdn-show-all-labels-on-start .loc-hide .location-line {
    opacity: 0;
    visibility: hidden;
}

.location-symbols {
    background: #000028 0% 0% no-repeat padding-box;
    border-radius: 19px;
    display: inline-block;
    filter: blur(0px);
    height: 38px;
    opacity: 1;
    position: absolute;
    top: -42px;
    left: 50%;
    transform:translate(-50%,0);
    -moz-transform:translate(-50%,0);
    -ms-transform:translate(-50%,0);
    -webkit-transform:translate(-50%,0);
    -o-transform:translate(-50%,0);
    white-space: nowrap;
    padding: 0 6px 0 6px;
}

.location-symbols.placement-none {
    display: none;
}

.location-symbols.placement-bottom {
    top: 36px;
}

.id-2225 .location-symbols.placement-bottom,
.id-2655 .location-symbols.placement-bottom {
    top: 62px;
}

.location-symbols.placement-left {
    top: -3.75px;
    left: auto;
    right: 100%;
    transform:translate(0,0);
    -moz-transform:translate(0,0);
    -ms-transform:translate(0,0);
    -webkit-transform:translate(0,0);
    -o-transform:translate(0,0);
    margin-right: 4px;
}

.location-symbols.placement-right {
    top: -3.75px;
    left: 100%;
    right: auto;
    transform:translate(0,0);
    -moz-transform:translate(0,0);
    -ms-transform:translate(0,0);
    -webkit-transform:translate(0,0);
    -o-transform:translate(0,0);
    margin-left: 4px;
}

.location-symbols .loc-train-symbol {
    display: inline-block;
    height: 29.5px;
    width: auto;
    margin: 4px 6px;
}

.location-pin {
    box-sizing: border-box;
    display: inline-block;
    height: 38px;
    width: 38px;
    z-index: 1;
    border: 2px solid #000028;
    border-radius: 50%;
}

.location-pin .location-pin-inner {
    background: white;
    border: 2px solid white;
    border-radius: 50%;
    display: inline-block;
    height: 30px;
    width: 30px;
    background-size: cover;
}

.loc-filter-network-facilities .location-pin .location-pin-inner {
    background-color: #0087BE;
}

.loc-filter-rail-service-centers .location-pin .location-pin-inner {
    background-color: #5BE5DC;
}

.loc-filter-component-workshops .location-pin .location-pin-inner {
    background-color: #C5C5B8;
}

.loc-filter-additive-manufacturing-centers .location-pin .location-pin-inner {
    background-color: #FFE270;
}

.loc-filter-component-workshops.loc-filter-network-facilities .location-pin .location-pin-inner {
    background-image: url("img/component-workshops_network-facilities.png");
}

.loc-filter-component-workshops.loc-filter-support-centers .location-pin .location-pin-inner {
    background-image: url("img/component-workshops_support-centers.png");
}

.loc-filter-additive-manufacturing-centers.loc-filter-support-centers .location-pin .location-pin-inner {
    background-image: url("img/additive-manufacturing-centers_support-centers.png");
}

.loc-filter-rail-service-centers.loc-filter-additive-manufacturing-centers .location-pin .location-pin-inner {
    background-image: url("img/rail-service-centers_additive-manufacturing-centers.png");
}

.loc-filter-rail-service-centers.loc-filter-additive-manufacturing-centers.loc-filter-test-and-validation-center .location-pin .location-pin-inner {
    background-image: url("img/rail-service-centers_additive-manufacturing-centers_test-and-validation-center.png");
}

.loc-filter-rail-service-centers.loc-filter-component-workshops.loc-filter-support-centers .location-pin .location-pin-inner {
    background-image: url("img/rail-service-centers_component-workshops_support-centers.png");
}

.loc-filter-rail-service-centers.loc-filter-component-workshops .location-pin .location-pin-inner {
    background-image: url("img/rail-service-centers_component-workshops.png");
}

.loc-filter-rail-service-centers.loc-filter-component-workshops.loc-filter-additive-manufacturing-centers .location-pin .location-pin-inner {
    background-image: url("img/rail-service-centers_additive-manufacturing-centers_support-centers.png");
}

.loc-filter-additive-manufacturing-centers.loc-filter-test-and-validation-center .location-pin .location-pin-inner {
    background-image: url("img/additive-manufacturing-centers_test-and-validation-center.png");
}

.loc-filter-component-workshops.loc-filter-additive-manufacturing-centers .location-pin .location-pin-inner {
    background-image: url("img/component-workshops_additive-manufacturing-centers.png");
}

.loc-filter-component-workshops.loc-filter-additive-manufacturing-centers.loc-filter-support-centers .location-pin .location-pin-inner {
    background-image: url("img/component-workshops_additive-manufacturing-centers_support-centers.png");
}
.loc-filter-rail-service-centers.loc-filter-additive-manufacturing-centers.loc-filter-support-centers .location-pin .location-pin-inner {
    background-image: url("img/rail-service-centers_additive-manufacturing-centers_support-centers2.png");
}

.id-2243 .location-pin .location-pin-inner {
    background-image: url("img/icon-sopron.png") !important;
}

/* France START */

.id-2645 .location-label {
    background: transparent;
    color: transparent;
}
.id-2645 .location-pin {
    width: 115px;
    height: 35px;
    border-radius: 0;
    opacity: 0 !important;
}

/* France END */

.location-line {
    position: absolute;
    display: inline-block;
    z-index: 0;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.location-line:after {
    background: #ffffff;
    content: "";
    display: inline-block;
    left: 2px;
    position: absolute;
    top: 2px;
}

.location-line.horizontal:after {
    height: 3px;
    width: calc(100% - 4px);
}

.location-line.vertical:after {
    height: calc(100% - 4px);
    width: 3px;
}

.location-single-element {
    color: white;
    display: none;
    width: 3840px;
    height: 2160px;
    left: 0;
    position: absolute;
    top: 0;
    z-index: 11;
    padding-left: 265px;
    padding-top: 204px;
    box-sizing: border-box;
}
.location-single-title {
    font-family: 'siemens_sansblack';
    font-size: 120px;
    line-height: 86px;
}
.location-single-train-symbols {
    position: absolute;
    left: 265px;
    top: 534px;
}
.location-single-train-symbols ul li {
    display: inline-block;
    font-family: 'siemens_sansblack';
    font-size: 38px;
    line-height: 75px;
    margin-right: 92px;
}
.location-single-train-symbols ul li img {
    height: 75px;
    width: auto;
    max-width: 84px;
    margin-right: 22px;
    margin-bottom: -28px;
}
.location-single-quick-facts {
    position: absolute;
    left: 265px;
    top: 450px;
    font-size: 38px;
    display: none;
}
.location-single-quick-facts strong {
    font-family: 'siemens_sansblack';
    font-size: 50px;
    margin-bottom: 22px;
    display: inline-block;
}
.location-single-quick-facts li {
    position: relative;
    padding-left: 40px;
    margin-bottom: 5px;
}
.location-single-quick-facts li:before {
    content: "";
    display: block;
    width: 11px;
    height: 11px;
    background-color: #00E6DC;
    border-radius: 50%;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -6px;
}
.location-single-content-bottom {
    display: block;
    width: 2416px;
    position: absolute;
    left: 265px;
    top: 661px;
}
.location-single-content-bottom .trennlinie {
    margin-top: 0;
    margin-bottom: 110px;
}
.location-single-content-bottom .legende {
    position: fixed;
    left: 276px;
    top: 2024px;
    font-size: 30px;
    line-height: 38px;
}

.location-single-content sup {
    font-size: 70%;
    vertical-align: top;
    top: -6px;
    position: relative;
}

.location-single-content li sup {
    top: -2px;
}

.location-single-id-2635 .location-single-content-bottom .legende {
    top: 1970px;
}
.location-single-content-bottom .fake-list {
    font-family: 'siemens_sansblack';
    position: fixed;
    left: 265px;
    top: 554px;
    font-size: 38px;
}
.location-single-images {
    display: block;
    width: 960px;
    float: left;
}
.location-single-images img {
    width: 960px;
    height: 506px;
    margin-bottom: 60px;
    object-fit: cover;
}
.location-single-id-2645 .location-single-images img {
    height: auto;
}
.location-single-wrapper {
    position: relative;
    max-height: 1080px;
    overflow: hidden;
}

.location-single-content {
    padding-left: 107px;
    float: left;
    font-size: 30px;
    max-width: 1320px;
    max-height: 1080px;
    overflow-y: auto; /* Ermöglicht das Scrollen */
    -webkit-overflow-scrolling: touch; /* Ermöglicht das sanfte Scrollen auf iOS */
    position: relative;
    mask-image: none;
    -webkit-mask-image: none;
    transition: mask-image 0.3s ease, -webkit-mask-image 0.3s ease;
}

.location-single-content {
    /* Versteckt die Scrollbars in Webkit-basierten Browsern (Chrome, Safari) */
    ::-webkit-scrollbar {
        display: none;
    }

    /* Versteckt die Scrollbars in Internet Explorer und Edge (Legacy) */
    -ms-overflow-style: none;

    /* Versteckt die Scrollbars in Firefox */
    scrollbar-width: none;
}
.location-single-content::-webkit-scrollbar {
    display: none;
}

/* Grundzustand: Masken sind unsichtbar */
.location-single-wrapper.scrollable .location-single-content {
    mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
    -webkit-mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
}

/* Maske erscheint oben beim Scrollen */
.location-single-wrapper.scrollable.scrolled .location-single-content {
    mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
    -webkit-mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
}

/* Maske erscheint unten, verschwindet beim Erreichen des Endes */
.location-single-wrapper.scrollable.at-bottom .location-single-content {
    mask-image: none;
    -webkit-mask-image: none;
}

.location-single-wrapper.scrollable.scrolled,
.location-single-wrapper.scrollable.scrolled.at-bottom {
    mask-image: linear-gradient(to bottom, transparent 0%, black 20%);
    -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 20%);
}


.location-single-content ul li {
    font-size: 38px;
}
.location-single-content-top {
    margin-bottom: 30px;
    line-height: 38px;
}
.location-single-content h2 {
    font-family: 'siemens_sansblack';
    font-size: 50px;
    margin-bottom: 20px;
    line-height: 1.2;
}
.location-single-content h3 {
    font-family: 'siemens_sansblack';
    font-size: 38px;
    margin-bottom: 15px;
}
.location-single-content-main h2 {
    margin-top: 40px;
}
.location-single-content p {
    margin-bottom: 30px;
    line-height: 38px;
    white-space: nowrap;
}
.location-single-content-main ul {
    margin-bottom: 30px;
}
.location-single-content-main li {
    position: relative;
    padding-left: 40px;
    margin-bottom: 15px;
    line-height: 1.2;
}
.location-single-content-main li:before {
    content: "";
    display: block;
    width: 11px;
    height: 11px;
    background-color: #00E6DC;
    border-radius: 50%;
    position: absolute;
    left: 0;
    top: 16px;
}

.location-single-map-pin {
    position: absolute;
    left: 2928px;
    top: 315px;
}
.location-single-map-pin .label {
    font-family: 'siemens_sansblack';
    font-size: 55px;
    text-shadow: 5px 5px 5px rgba(0,0,40,0.45);
    white-space: nowrap;
}
.location-single-map-pin .label > br {
    display: none;
}
.location-single-map-pin .line {
    display: block;
    width: 0;
    height: 174px;
    border-left: 4px solid #00E6DC;
    position: absolute;
    top: 63px;
    right: 0;
}
.location-single-map-pin .pin {
    display: block;
    width: 12px;
    height: 12px;
    border: 12px solid #00E6DC;
    position: absolute;
    top: 220px;
    right: -16px;
    background-color: white;
    border-radius: 50%;
    z-index: 1;
}

.location-single-back-to-overview {
    font-family: 'siemens_sansblack';
    background: #00CCCC;
    color: #000028;
    font-size: 31px;
    height: 100px;
    width: 418px;
    position: absolute;
    top: 1952px;
    left: 1711px;
    border: none;
}

.location-single-back-to-overview span {
    display: inline-block;
}

.location-single-back-to-overview span:before {
    content: "";
    display: inline-block;
    width: 28px;
    height: 28px;
    background-image: url("img/close_X2.png");
    background-size: 28px auto;
    background-repeat: no-repeat;
    bottom: -4px;
    position: relative;
    margin-left: 10px;
}

/* Startseite */

#main-sidebar {
    position: absolute;
    top: 145px;
    left: 145px;
}

#main-sidebar h1 {
    font-size: 90px;
    line-height: 108px;
}
#main-sidebar h1 span {
    font-family: 'siemens_sansblack';
    font-weight: bold;
    color: #00FFB9;
}
#main-sidebar .txt-start {
    font-size: 33px;
    display: block;
    color: white;
}
#main-sidebar .txt-start.txt01 {
    margin-top: 62px;
    max-width: 872px;
    line-height: 48px;
}
#main-sidebar .txt-start.txt02 {
    font-size: 33px;
    margin-top: 40px;
    max-width: 925px;
    line-height: 54px;
    font-weight: bold;
}

#filter-wrap {
    position: relative;
    display: block;
    width: 866px;
    margin-top: 60px;
}
.trennlinie {
    display: block;
    width: calc(100% - 20px);
    height: 2px;
    background-color: #00E6DC;
    margin-top: 40px;
    margin-bottom: 40px;
    position: relative;
}
.trennlinie:after {
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    border: 2px solid #00E6DC;
    border-radius: 20px;
    position: absolute;
    right: -20px;
    top: -9px;
    box-sizing: border-box;
}
.filter-headline {
    font-family: 'siemens_sansblack';
    font-size: 33px;
    color: white;
    margin-bottom: 17px;
}
.filter-headline2 {
    margin-top: 50px;
    margin-bottom: 17px;
}
.filter-button {
    font-family: 'siemens_sansblack';
    font-size: 18px;
    text-align: center;
    line-height: 60px;
    display: inline-block;
    position: relative;
    box-sizing: border-box;
    width: 408px;
    height: 60px;
    border: 2px solid transparent;
    margin-right: 46px;
    margin-bottom: 20px;
    cursor: pointer;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    background-color: transparent;
    color: #00FFB9;
}
.filter-button .btn-border {
    position: absolute;
    top: 0;
    right: 0;
}
.filter-button .btn-bg {
    position: absolute;
    top: 1px;
    right: 388px;
    display: block;
    width: 0;
    height: 60px;
    overflow: hidden;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.filter-button.pressed .btn-bg {
    right: -21px;
    width: 408px;
}
.filter-button .btn-bg svg {
    position: absolute;
    top: 0;
    left: 0;
    width: 408px;

}
.filter-button .btn-txt {
    display: block;
    width: 347px;
    height: 60px;
    position: absolute;
    top: 1px;
    right: 1px;
    z-index: 2;
}
.filter-button .symbol {
    display: block;
    width: 18px;
    height: 29px;
    position: absolute;
    left: 13px;
    top: 50%;
    margin-top: 3px;
    transform:translate(0,-50%);
    -moz-transform:translate(0,-50%);
    -ms-transform:translate(0,-50%);
    -webkit-transform:translate(0,-50%);
    -o-transform:translate(0,-50%);
}
.filter-button-coming-soon .symbol {
    width: 40px;
    left: 2px;
    margin-top: 10px;
}
.filter-button-coming-soon:after {
    background-color: transparent !important;
}
.filter-button .symbol img {
    width: 100%;
    height: auto;
    position: absolute;
    left: 0;
}
.filter-button:after {
    content: "";
    display: block;
    position: absolute;
    left: -8px;
    top: 2px;
    width: 55px;
    height: 55px;
    background-color: #00E6DC;
    border: 2px solid white;
    border-radius: 30px;
}
.filter-button-train:after {
    background-color: transparent;
}
.filter-button:nth-of-type(2n) {
    margin-right: 0;
}
.filter-button.pressed {
    color: black;
}

.locomotives-additional-content {
    font-family: 'siemens_sansroman';
    font-size: 16px;
    line-height: 18px;
    color: white;
    text-align: left;
    display: block;
    width: 363px;
    height: 0;
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    padding: 30px 15px;
    background-color: #000128;
    border-bottom: 0 solid #00FFB9;
    font-weight: 300;
    transition: all 0.3s ease-in-out;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    box-sizing: border-box;
}

.filter-button-locomotives.pressed .locomotives-additional-content {
    height: 255px;
    border-bottom: 2px solid #00FFB9;
    opacity: 1;
    visibility: visible;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.filter-button-locomotives.pressed {
    margin-bottom: 295px;
}

.locomotives-additional-content .locomotives-btn-content {
    display: block;
    height: 0;
    overflow: hidden;
    transition: all 0.3s ease-in-out;
}
.locomotives-additional-content .active .locomotives-btn-content {
    height: 70px;
}
.locomotives-additional-content .locomotives-btn-1.active .locomotives-btn-content {
    height: 100px;
}

.locomotives-btn-headline {
    color: #00FEB9;
    position: relative;
    margin-bottom: 20px;
}

.locomotives-btn-headline:after {
    content: "";
    display: block;
    width: 8px;
    height: 12px;
    position: absolute;
    right: 0;
    bottom: 0;
    background-image: url("/wp-content/uploads/2024/07/arrow_right.png");
    background-repeat: no-repeat;
    background-position: right bottom;
}

.active .locomotives-btn-headline {
    font-family: 'siemens_sansblack';
    margin-bottom: 15px;
}

.active .locomotives-btn-headline:after {
    display: none;
}

.locomotives-partner-workshops {
    position: relative;
    padding-left: 32px;
    padding-top: 13px;
    display: inline-block;
    margin-bottom: 40px;
    margin-top: 0;
}

.locomotives-partner-workshops:before {
    content: "";
    display: inline-block;
    width: 23px;
    height: 23px;
    border-radius: 23px;
    border: 2px solid white;
    background-color: #FF9000;
    position: absolute;
    left: 0;
    top: 7px;
}



.filter-button-rail-service-centers:after {
    background-color: #00E6DC;
}
.filter-button-component-workshops:after {
    background-color: #C5C5B8;
}
.filter-button-network-facilities:after {
    background-color: #0087BE;
}
.filter-button-additive-manufacturing-centers:after {
    background-color: #FFE270;
}
.filter-button-support-centers:after {
    background-color: #FCFEFF;
}
.filter-button-test-and-validation-center:after {
    background-color: #805CFF;
}

#filter-reset {
    font-family: 'siemens_sansblack';
    font-size: 21px;
    color: #00E6DC;
    padding: 18px;
    padding-left: 25px;
    padding-right: 65px;
    border: 2px solid #00E6DC;
    border-radius: 5rem;
    background-color: #000028;
    background-image: url("img/close_X.png");
    background-repeat: no-repeat;
    background-position: right 24px top 18px;
    background-size: 24px;
    position: absolute;
    top: -33px;
    right: 0;
}

.slide-out-left {
	-webkit-animation: slide-out-left 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
	        animation: slide-out-left 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}

.slide-in-left {
	-webkit-animation: slide-in-left 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
	        animation: slide-in-left 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}

.set-visibile
{
    opacity: 1 !important;
    visibility: visible !important;
}

.set-invisibile
{
    opacity: 0 !important;
    visibility: hidden !important;
}

.location-single-id-2151 .location-single-train-symbols {
    display: none;
}

.location-single-id-2241 h2 {
    white-space: nowrap;
}

.location-single-id-2359 .location-single-title,
.location-single-id-2261 .location-single-title {
    font-size: 84px;
}

.location-single-id-2359 .location-single-map-pin .label,
.location-single-id-2261 .location-single-map-pin .label {
    font-size: 0;
}
.location-single-id-2359 .location-single-map-pin .label:before,
.location-single-id-2261 .location-single-map-pin .label:before {
    content: "Wegberg-Wildenrath";
    font-size: 55px;
}

.location-single-id-2150 .location-single-train-symbols li:nth-of-type(2),
.location-single-id-2237 .location-single-train-symbols li:nth-of-type(2),
.location-single-id-2261 .location-single-train-symbols li:nth-of-type(2),
.location-single-id-2261 .location-single-train-symbols li:nth-of-type(4),
.location-single-id-2359 .location-single-train-symbols li:nth-of-type(2),
.location-single-id-2359 .location-single-train-symbols li:nth-of-type(4) {
    display: none;
}

@-webkit-keyframes slide-in-left {
    0% {
        -webkit-transform: translateX(-1000px);
                transform: translateX(-1000px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateX(0);
                transform: translateX(0);
        opacity: 1;
    }
}

@-webkit-keyframes slide-out-left {
    0% {
        -webkit-transform: translateX(0);
                transform: translateX(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateX(-1000px);
                transform: translateX(-1000px);
        opacity: 0;
    }
}

@keyframes slide-out-left {
    0% {
        -webkit-transform: translateX(0);
                transform: translateX(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateX(-1000px);
                transform: translateX(-1000px);
        opacity: 0;
    }
}

.fade-out {
	-webkit-animation: fade-out 1s ease-out both;
    animation: fade-out 1s ease-out both;
}

@-webkit-keyframes fade-out {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@keyframes fade-out {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

.fade-in {
	-webkit-animation: fade-in 1s ease-out both;
    animation: fade-in 1s ease-out both;
}

@-webkit-keyframes fade-in {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes fade-in {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
  
html {
    background-color: black;
}

body {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -1080px !important;
    margin-left: -1920px !important;
    transform-origin: 50% 50%;
}