body {
  margin: 0;
  padding: 0;
  overflow: hidden;
  cursor: none;
  user-select: none;
  background-color: #474747;
  width: 100vw;
  height: 100vh;
}

iframe {
  border: 0;
  overflow: hidden;
}

video.vxt {
  object-fit: cover;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}

.stage {
  position: absolute;
  overflow: hidden;
  width: 100%;
  height: 100%;
}

.preload {
  visibility: hidden;
}

.pixel {
  width: 1px;
  height: 1px;
  opacity: 0.01;
  position: absolute;
  top: 0;
  left: 0;
}

.component.abs {
  position: absolute;
}
.component.rel {
  position: relative;
}
.component.cell {
  display: table-cell;
}
.component.row {
  display: table-row;
}
.component.layer {
  transform: translate3d(0px, 0px, 0px);
  -webkit-transform: translate3d(0px, 0px, 0px);
}

.component.wrap {
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}

.component.bbox {
  overflow: hidden;
}

.component.pixel {
  width: 1px;
  height: 1px;
  left: 0;
  top: 0;
  position: absolute;
}

.component.blur {
  -webkit-filter: blur(30px) brightness(0.8) contrast(120%);
  -moz-filter: blur(30px) brightness(0.8) contrast(120%);
  -o-filter: blur(30px) brightness(0.8) contrast(120%);
  -ms-filter: blur(30px) brightness(0.8) contrast(120%);
  filter: blur(30px) brightness(0.8) contrast(120%);
}

.component.blur-light {
  -webkit-filter: blur(11px) brightness(0.8) contrast(120%);
  -moz-filter: blur(11px) brightness(0.8) contrast(120%);
  -o-filter: blur(11px) brightness(0.8) contrast(120%);
  -ms-filter: blur(11px) brightness(0.8) contrast(120%);
  filter: blur(11px) brightness(0.8) contrast(120%);
}

.component span {
  display: inline-block;
}
.component.inl span {
  display: inline;
}
.component.inline {
  display: inline-block;
}

.component.gradient-top {
  left: -1px !important;
  background: -moz-linear-gradient(bottom, rgba(0,0,0,0.0) 0%, rgba(0,0,0,0.0) 50%, rgba(0,0,0,0.3) 100%);
  background: -webkit-linear-gradient(bottom, rgba(0,0,0,0.0) 0%, rgba(0,0,0,0.0) 50%, rgba(0,0,0,0.3) 100%);
  background: linear-gradient(to top, rgba(0,0,0,0.0) 0%, rgba(0,0,0,0.0) 50%, rgba(0,0,0,0.3) 100%);
}
.component.gradient-bottom {
  left: -1px !important;
  background: -moz-linear-gradient(top, rgba(0,0,0,0.0) 0%, rgba(0,0,0,0.0) 50%, rgba(0,0,0,0.3) 100%);
  background: -webkit-linear-gradient(top, rgba(0,0,0,0.0) 0%, rgba(0,0,0,0.0) 50%, rgba(0,0,0,0.3) 100%);
  background: linear-gradient(to bottom, rgba(0,0,0,0.0) 0%, rgba(0,0,0,0.0) 50%, rgba(0,0,0,0.3) 100%);
}
.component.gradient-dark-bottom {
  background: -moz-linear-gradient(top, rgba(0,0,0,0.0) 0%, rgba(0,0,0,0.8) 100%);
  background: -webkit-linear-gradient(top, rgba(0,0,0,0.0) 0%, rgba(0,0,0,0.8) 100%);
  background: linear-gradient(to bottom, rgba(0,0,0,0.0) 0%, rgba(0,0,0,0.8) 100%);
}

.component ul, .component ol {
  margin-block-end: 0;
  margin-block-start: 0;
  margin-inline-start: 0;
  margin-inline-end: 0;
  padding-inline-start: 0.75em;
  margin: 0;
  padding: 0 0 0 0.75em;
  text-align: left;
}

.component img.emoji {
  height: 0.9em;
  width: 0.8em;
  margin: 0 .01em 0 .01em;
  vertical-align: -0.1em;
}

.component img.emoji-medium {
  height: 1em;
  width: 1em;
  margin: 0 .05em 0 .1em;
  vertical-align: -0.1em;
}

.component img.emoji-slack {
  height: 0.9em;
  width: 0.9em;
  margin: 0 -.05em 0 -.05em;
  vertical-align: -0.1em;
}

.component span.hashtag {
  color: #1891ff;
}

.component span.hashtag.hashtag-bold {
  font-weight: 700;
  color: #ffffff;
}

.component .twitter span.hashtag {
  color: #1D9BF0;
}
.component .instagram span.hashtag {
  color: #ba3554;
}
.component .facebook span.hashtag {
  color: #3b5998
}
.component .linkedin span.hashtag {
  color: #0084bf;
}
.component .ciscospark span.hashtag {
  color: #005073
}
.component .facebookwork span.hashtag {
  color: #373E4C;
}

.component.transport {
  color:#262c48;
}
.component.transport-top {
  position:absolute;top:0;left:0;width:100%;height:12%;display:table;
}
.portrait .component.transport-top {
  background-color:transparent!important;color:#262c48!important;width:26%;height:70%;display:block;
}
.component.transport-agency {
  position:absolute;top:80%;left:0;width:100%;height:20%;overflow:hidden;display:table;
}
.portrait .component.transport-agency {
  top:0;width:26%;height:41%;
}
.component.transport-agency-logo {
  font-size:0.6em;display:table-cell;vertical-align:middle;text-align:right;padding-right:14px;padding-left:40%;text-overflow:ellipsis;overflow:hidden;white-space:wrap;
}
.portrait .component.transport-agency-logo {
  display:table-cell;font-size:1.5em;width:100%;padding:0 2.1vw;text-align:left;
}
.component.transport-station {
  display:inline-block;font-size:0.88em;font-weight:700;letter-spacing:-0.8px;line-height:1.1;margin:1.1vh 1.2vw 0;
}
.portrait .component.transport-station {
  margin:1.1vh 2.1vw 0;
}
.component.transport-station span {
  display:inline;font-weight:400;
}
.component.transport-type {
  bottom:0;font-size:0.6em;font-weight:700;letter-spacing:-0.8px;line-height:1.1;padding:0 1.4vw;display:table-cell;vertical-align:middle;
}
.portrait .component.transport-type {
  position:absolute;display:block;margin:0 2.1vw;font-size:1.21em;
}
.component.transport-distance {
  font-weight:400;position:absolute;bottom:0;right:0;font-size:0.55em;letter-spacing:-0.1px;line-height:1.1;margin:0 1.4vw 2.5vh;
}
.portrait .component.transport-distance {
  position:relative;font-size:1.1em;margin:1.2vh 2.1vw 0px;
}
.metro .component.transport-distance {
  color:#ffffff;
}
.portrait.metro .component.transport-distance {
  color:#262c48;
}
.component.transport-badge {
  position:absolute;top:12%;left:-5%;width:110%;height:33%;text-align:center;
}
.portrait .component.transport-badge {
  left:26.2%;top:-6.3%;width:76%;height:47.6%;display:table;
}
.component.transport-shadow-wrap {
  position:absolute;top:7%;width:100%;height:43%;overflow:hidden;
}
.component.transport-shadow {
  position:absolute;top:12%;width:100%;height:76%;box-shadow: 0px 0px 1.4vh 0.9vh rgba(91,123,134,0.5);
}
.portrait .component.transport-shadow-wrap {
  top:0;left:22%;height:52%;width:78%;
}
.portrait .component.transport-shadow {
  left:6%;height:65%;width:94%;
}
.component.transport-route {
  font-size:2.4em;font-weight:700;margin:2.2% 0 1.3%;line-height:1;letter-spacing:-1.5px;position:absolute;width:100%;bottom:67%;transform:translateY(50%);-webkit-transform:translateY(50%);
}
.portrait .component.transport-route {
  padding-top:2%;font-size:4.9em;width:42%;display:table-cell;vertical-align:middle;position:relative;transform:none;-webkit-transform:none;bottom:auto;top:0;
}
.component.transport-destination {
  font-size:0.96em;font-weight:700;text-transform:uppercase;letter-spacing:-1.5px;position:absolute;width:92%;top:73%;transform:translateY(-50%);-webkit-transform:translateY(-50%);margin:0 4%;
}
.portrait .component.transport-destination {
  font-size:2.1em;width:55%;padding:2% 6% 0 3%;display:table-cell;vertical-align:middle;position:relative;transform:none;-webkit-transform:none;top:0;
}
.component.transport-middle {
  position:absolute;top:46%;left:0;width:100%;height:23%;text-align:center;
}
.portrait .component.transport-middle {
  width:73.8%;left:26.2%;top:41.3%;height:58.7%;
}
.component.transport-departure {
  font-size:0.52em;font-weight:700;margin:6% 6%;text-align:center;
}
.portrait .component.transport-departure {
  font-size:1em;margin:3% 0 3.5%;
}
.portrait.transport-group .component.transport-departure {
  font-size:1em;margin:3% 0 3.1%;
}
.component.transport-departure-time {
  display:inline-block;font-weight:700;text-align:center;font-size:2em;text-align:center;padding:0 6%;line-height:1;vertical-align:top;
}
.component.transport-departure-time.short {
  padding:0 5px;
}
.transport-group .component.transport-departure-time {
  display:inline-block;font-weight:700;text-align:center;font-size:1em;text-align:center;padding:0 6%;line-height:1;vertical-align:top;
}
.portrait .component.transport-departure-time {
  font-size:3em;padding:0 5%;
}
.portrait.transport-group .component.transport-departure-time {
  font-size:2.1em;padding:0 5%;
}
.component.transport-departure-time span:nth-child(1) {
  display:block;font-weight:400;font-size:0.4em;
}
.portrait .component.transport-departure-time span:nth-child(1) {
  display:inline;margin:0 0 0 1em;font-weight:400;font-size:0.4em;
}
.portrait.transport-group .component.transport-departure-time span:nth-child(1) {
  display:inline;margin:0;font-size:0.7em;padding:0 0.2em;font-weight:700;
}
.component.transport-departure-time span:nth-child(2) {
  display:block;font-size:0.7em;padding:0.24em 0;
}
.portrait .component.transport-departure-time span:nth-child(2) {
  display:block;font-size:0.4em;font-weight:400;
}
.component.transport-bottom {
  position:absolute;top:80%;left:0;width:100%;height:20%;overflow:hidden;
}
.portrait .component.transport-bottom {
  top:60%;height:40%;
}
.component.transport-departure-icon {
  position:absolute;top:0;bottom:0;width:50%;background-size:auto 100%;background-repeat:no-repeat;background-position:0% 50%;
}
.tram .component.transport-departure-icon {
  background-image:url(../assets/neos/here_transport/tram.png);left:-10px;top:12%;bottom:9%;
}
.tram.portrait .component.transport-departure-icon {
  bottom:2%;top:25%;
}
.bus .component.transport-departure-icon {
  background-image:url(../assets/neos/here_transport/bus.png);left:-10px;top:24.4%;bottom:5.5%;
}
.bus.portrait .component.transport-departure-icon {
  top:35%;bottom:0;
}
.train .component.transport-departure-icon {
  background-image:url(../assets/neos/here_transport/train.png);left:-20px;top:34.4%;bottom:15.5%;
}
.train.portrait .component.transport-departure-icon {
  bottom:8%;top:43%;
}
.metro .component.transport-departure-icon {
  background-image:url(../assets/neos/here_transport/metro.png);left:-10px;top:20%;bottom:15%;
}
.metro.portrait .component.transport-departure-icon {
  top:30%;bottom:10%;
}
.alert .component.transport-top {
  display:none;
}
.alert .component.transport-middle {
  display:none;
}
.alert .component.transport-badge {
  top:-3%;
}
.component.transport-alert {
  display:none;position:absolute;width:100%;top:30%;height:50%;text-align:left;color:#ff0000;
}
.portrait .component.transport-alert {
  width:60%;left:26.3%;top:42%;
}
.alert .component.transport-alert {
  display:block;
}
.component.transport-alert-time {
  margin:1.4vw 2.5vh;font-size:0.5em;font-weight:400;
}
.portrait .component.transport-alert-time {
  margin:1vh 0;font-size:1em;
}
.component.transport-alert-text {
  margin:1.4vw 2.5vh;font-size:0.8em;font-weight:700;
}
.portrait .component.transport-alert-text {
  margin:0;font-size:1.2em;
}