/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
	font-size: 20px;
	width: 100%;
	font-family: sans-serif;
	display: none;
	user-select: none;
	-webkit-user-select: none;
}

/* Make content area fill the entire browser window */
html,
.fullscreen {
  display: flex;
  height: 100%;
  margin: 0;
  padding: 0;
  width: 100%;
}

ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

*{
	font-family: sans-serif;
	margin: 0px;
	padding: 0px;
}
@media (prefers-color-scheme: dark) {
  html{
	  background: #000000;
  }
}

@media (prefers-color-scheme: light) {
  html{
	  background: #fff;
  }
}

/* Anfang CSS Mod *** Anfang CSS Mod *** Anfang CSS Mod *** Anfang CSS Mod *** Anfang CSS Mod *** Anfang CSS Mod ***  */
.base.menu{
	padding-bottom: 36vmax;
	padding-top:6vmax;
}
.base.dienst{
	padding-bottom: 12vmax;
	padding-top:6vmax;
}
.base.dienst.aos_active, .base.dienst.approve_active{
	padding-top: 15vmax;
}
.base.dienst.aos_active.approve_active{
	padding-top: 24vmax;
}
.base.approve{
	padding-top:15vmax;
}
.spinner{
	height: 100vh;
	width: 100vw;
	position: fixed;
	top:0px;
	left: 0px;
	z-index: 100;
}
.spinner img{
	position: absolute;
	top:50vh;
	left:50vw;
	margin-left: -50px;
	margin-top: -50px;
	width: 100px;
}
.bottombar.menu{
	/* height: 30vmax; */
	display: block;

}
.bottombar.dienst{
	/* height: 12vmax; */
	display: block;
}
.topbar{
	display: none;
	white-space: nowrap;
	overflow-x: auto;
	overflow-y: hidden;
}
.dienst .topbar{
	height: 6vmax;
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	width: calc(100vw - 9vmax);
	display: block;
	padding-left: 9vmax;
	line-height: 6vmax;
	font-size: 1.2em;
	z-index: 21;
	text-align: center;
}
.menu .topbar{
	height: 6vmax;
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	display: block;
	text-align: center;
	line-height: 6vmax;
	font-size: 1.2em;
	z-index: 21;
}
.nocrewapp.topbar{
	display: block;
	height: 6vmax;
	font-weight: bold;
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	display: block;
	text-align: center;
	line-height: 6vmax;
	font-size: 1.2em;
	z-index: 21;
}
.dienst .approvebar{
	height: 9vmax;
	position: fixed;
	top: 6vmax;
	left: 0;
	width: 100vw;
	display: block;
	font-size: 1.2em;
	z-index: 21;
	border-top-width: 2px;
	border-top-style: solid;
	text-align: center;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	/* cursor: pointer; */
}
.dienst.aos_active .approvebar{
	top: 15vmax;
}
.dienst .anordnungbar{
	height: 9vmax;
	position: fixed;
	top: 6vmax;
	left: 0;
	width: 100vw;
	font-size: 1.2em;
	z-index: 21;
	border-top-width: 2px;
	border-top-style: solid;
	text-align: center;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	/* cursor: pointer; */
	border-bottom: 1px solid;
}
.btn_settings{
	width: 5vmax;
	height: 5vmax;
	padding: 0.5vmax;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	line-height: 4vmax;
	background-image: none;
	background-size: auto;
	text-align: center;
	position: absolute;
	bottom: 0;
	left: calc(100vw - 7vmax);
	background-size: contain;
	user-select: none;
	-webkit-user-select: none;
}
.btn_friends{
	width: 6vmax;
	height: 5vmax;
	padding: 0.5vmax;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	line-height: 4vmax;
	text-align: center;
	position: absolute;
	bottom: 0;
	left: 1vmax;
	background-size: contain;
	background-repeat: no-repeat;
	user-select: none;
	-webkit-user-select: none;
}

.btn_report{
	width: 10vmax;
	height: 5vmax;
	padding: 0.5vmax;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	line-height: 4vmax;
	background-image: none;
	background-size: auto;
	text-align: center;
	position: absolute;
	bottom: 0;
	left: calc(100vmin - 11vmax);
	background-size: contain;
	user-select: none;
	-webkit-user-select: none;
}
.bottombar{
	position: fixed;
	/* bottom: 0px; */
	top:100vh;
	left: 0px;
	width: 100vw;
	/* height: 40vmax; */
	border-top-width: 2px;
	border-top-style: solid;
	z-index: 2;
	display: none;
}
.bottombar.nocrewapp{
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100vw;
	height: 100vh;
	z-index: 2;
	display: block;
}
.btn_buttomleft{
	width: 12vmax;
	height: 12vmax;
	border-top-width: 0.5vmax;
	border-top-style: solid;
	margin-top: -0.25vmax;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	line-height: 4vmax;
	text-align: center;
	position: absolute;
	bottom: 0;
	left: 0vmin;
	user-select: none;
	-webkit-user-select: none;
}
/* .calsync .btn_buttomleft{
	bottom: 0;
	height: 17vmax;
	z-index: 1;
	background-repeat: no-repeat;
	background-position: center;
} */

.refreshdata{
	width: calc(100vw - 12vmax);
	height: 12vmax;
	border-top-width: 0.5vmax;
	border-top-style: solid;
	margin-top: -0.25vmax;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	line-height: 4vmax;
	text-align: left;
	position: absolute;
	bottom: 0;
	left: 12vmax;
	padding-left: 2vmin;
}
.calsync_txt{
	display: none;
}
.calsync .calsync_txt{
	display: contents;
}
.calsync_status{
	display: none;
}
.calsync .calsync_status{
	display: contents;
}
.calsync .refreshdata{	
	line-height: 3vmax;
}
.refreshdata span{
	position: absolute;
	right: 4vmin;
	text-align: right
}

.dienst .search{
	display: none;
}
/*@media only screen and (min-height: 500px) {
  .menu .search{
	  display: flex;
  }
}
@media only screen and (max-height: 499px) {
  .menu .search{
	  display: none;
  }
}*/
.menu .search{
  display: flex;
}
@media only screen and (orientation: landscape) and (max-height:500px) {
  .menu .search{
	  display: none;
  }
}

.nocrewapp .search{
	display: flex;
	height: 20vh;
}
.nocrewapp .search.title{
	display: flex;
	top:6vh;
	height: 14vh;
}
.nocrewapp .searchday{
	display: flex;
	height: 15vh;
	top:20vh;
}
.nocrewapp .search_fzgnr{
	display: flex;
	height: 15vh;
	top:35vh;
}
.nocrewapp .search_zugnr{
	display: flex;
	height: 15vh;
	top:50vh;
}
div.search.title{
	position: absolute;
	bottom:30vmax;
	height: 5vmax;
	width: 100%;
/* 	display: flex; */
	justify-content: center;
	align-content: center;
	flex-direction: column;
	text-align: center;
	border-top-style: solid;
	border-top-width: 2px;
	border-bottom: dotted 1px;
}
/* .calsync div.search.title{
	bottom:35vmax;
} */
div.searchday{
	position: absolute;
	bottom:24vmax;
	height: 6vmax;
	width: 50%;
/* 	display: flex; */
	justify-content: center;
	align-content: center;
	flex-direction: column;
	text-align: center
}

/* .calsync div.searchday{
	bottom:29vmax;
} */
div.searchday.today{
	left: 0;
}
div.searchday.tomorrow{
	right: 0;	
}
div.search_fzgnr{
	position: absolute;
	bottom:18vmax;
	left: 0;
	height: 6vmax;
	width: 60%;
	padding-left: 2vmin;
	border-top-width: 1px;
	border-top-style: dotted;
	justify-content: center;
	align-content: center;
	flex-direction: column;
}
/* .calsync div.search_fzgnr{
	bottom:23vmax;
} */
input.search_fzgnr{
	position: absolute;
	bottom:18vmax;
	left: 60%;
	height: 6vmax;
	width: 40%;
	font-size: 1.5em;
	border-width: 1px;
	border-style: solid;
	border: none;
	border-top-width: 1px;
	border-top-style: dotted;
	margin:0;
	text-align: center;
}
/* .calsync input.search_fzgnr{
	bottom:23vmax;
} */

div.search_zugnr{
	position: absolute;
	bottom:12vmax;
	left: 0;
	height: 6vmax;
	width: 60%;
	padding-left: 2vmin;
	border-top-width: 1px;
	border-top-style: dotted;
	justify-content: center;
	align-content: center;
	flex-direction: column;
}
/* .calsync div.search_zugnr{
	bottom:17vmax;
} */
input.search_zugnr{
	position: absolute;
	bottom: 12vmax;
	left: 60%;
	height: 6vmax;
	width: 40%;
	font-size: 1.5em;
	border: none;
	border-top-width: 1px;
	border-top-style: dotted;
	margin:0;
	text-align: center;
}
.friendview .menu .search{ 
	display: none;
}
.friendview .calsync, .friendview .refreshdata{
	color: #00000055;
}

.fzg_el{
	position: relative;
	width: 100%;
	height: 15vmax;
	display: block;
	/* cursor: pointer; */
	font-size: 1em;
	border-bottom-width: 0.4vmax;
	border-block-style: solid;
	margin-bottom: -0.4vmax;
}
.popup_zugnr .fzg_el{
	margin-top: 5vmax;
	border-bottom: none;
}
.fzg_el.el_durchbindung{
	height: calc(10vmax - 0.4vmax);
}










.shift{
	width: 100vw;
	height: 15vmax;
	display: block;
	/* cursor: pointer; */
/* 	font-size: 1.2em; */
	font-size: 1em;
	padding-bottom: 0.4vmax;
	position: relative;
}


.shift_date{
	border-width: 2px;
	border-style: solid;
	position: fixed;
	top: 0.5vmax;
	left: 1vmin;
	width: 7vmax;
	height: 5vmax;
	line-height: 8vmax;
	text-align: center;
	margin: -2px;
}
.shift .shift_date{
	position: absolute;
}
.shift_dow{
	position: absolute;
	line-height: 2vmax;
	font-size: 0.5em;
	text-align: center;
	width: 100%;
	letter-spacing: initial;
}
.shift_name{
	width: calc(100% - 8vmax);
	padding-left: 8vmax;
	height: 40%;
	display: block;
	line-height: 6vmax;
	text-align: center;
	white-space: nowrap;
	overflow-x: auto;
	overflow-y: hidden;
}
.shift_time{
	width: 50%;
	height: 30%;
	text-align: center;
	line-height: 6vmax;
	display: inline-block;
}
.shift_location{
	width: 50%;
	height: 30%;
	line-height: 6vmax;
	text-align: center;
	display: inline-block;
}


.shift_el{
	position: relative;
	width: 100%;
	min-height: calc(15vmax - 0.4vmax);
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;	
	font-size: 1em;
	border-bottom-width: 0.3vmax;
	border-bottom-style: solid;
	user-select: none;
	-webkit-user-select: none;
}
.shift_el.el_durchbindung{
	min-height: calc(10vmax - 0.4vmax);
}
.shift_el.el_durchbindung_big{
	min-height: calc(15vmax - 0.4vmax);
}
.shift_el_ort{
	position: absolute;
	width: 20%;
	display: block;
	line-height: 5vmax;
	text-align: center;
}
.shift_el_ort.start{
	top:3vmax;
	left: 0vmin;
}
.shift_el_ort.end{
	bottom:3vmax;
	left: 0vmin;
}
.el_zugfahrt .shift_el_ort.start{
	top:11.5vmax;
	left: 0vmin;
}
.el_zugfahrt .shift_el_ort.end{
	bottom:11.5vmax;
	left: 0vmin;
}
.shift_el_time{
	position: absolute;
	width: 20%;
	display: block;
	line-height: 5vmax;
	text-align: center;
}
.el_zugfahrt .shift_el_time.start{
	top:14vmax;
	left: 0vmin;
}
.el_zugfahrt .shift_el_time.end{
	bottom:14vmax;
	left: 0vmin;
}

.el_zugfahrt .el_symbol{
	display: none;
	position: absolute;
	height: 14%;
	width: 20%;
	background-position: center; 
	background-repeat: no-repeat;
	background-size: contain;
}
.el_vm-mc{
	display: block !important;
	top:3vmax;
}
.el_trennen.el_upper{
	top:3vmax;
}
.el_vereinigen.el_upper{
	top:3vmax;
}
.el_vereinigen_trennen.el_upper{
	top:3vmax;
}
.el_trennen.el_lower{
	bottom:3vmax;
}
.el_vereinigen.el_lower{
	bottom:3vmax;
}
.el_vereinigen.el_lower div{
	justify-content: center;
  align-content: center;
  flex-direction: column;
  text-align: center;
  font-size: 1.5em;
  background-position: 50%;
  height: 100%;
  left: 50%;
  position: relative;
  display: flex;
  width: min(10vmax,25vw);
}
.el_vereinigen_trennen.el_lower{
	bottom:3vmax;
}

.shift_el_time.start{
	top:0.5vmax;
	left: 0;
}
.shift_el_time.end{
	bottom:0.5vmax;
	left: 0;
}
.shift_el_work{
	position: relative;
	top:0vmax;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	line-height: 2vmax;
	left: 30%;
	width: 70%;
	height: 100%;
	/*min-height: calc(15vmax - 0.4vmax);*/

}
.shift_el_work span{
	padding: 5px 0;
}
.shift_el_work.small{
	height: 40%;
	text-align: center;
}
.shift_el_work a{
	display: inline-block;
	text-decoration: underline;
}
.shift_el_datum{
	position: absolute;
	top:0vmax;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	line-height: 4vmax;
	left: 50%;
	width: 50%;
	height: 10vmax;
	text-align: center;
	z-index: 2;
}
.shift_el_zugnr{
	position: absolute;
	top:20vmax;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	/* line-height: 4vmax; */
	left: 0;
	width: 20%;
	height: 10vmax;
	text-align: center;
	z-index: 2;
	font-weight: bold;
}
.datelight{
	letter-spacing: -0.07em;
}
.nocrewweb{
	border-width: 1px;
	border-style: solid;
	border-radius: 10px;
	padding: 10px;
	/* cursor: pointer; */
}
.shift_el_zugborder{
	position: absolute;
	top:20vmax;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	line-height: 4vmax;
	left: 1%;
	width: 48%;
	height: 10vmax;
	text-align: center;
	z-index: 1;
	/* border-width: 2px; */
	border-width: 4px;
	border-style: solid;
	border-radius: 1.5vmax;
	margin: -4px -4px;
	border-top-left-radius: 7vmax;
}
.shift_el_zugborder.passagier{
	border-style: dashed;
}
.shift_el_zugborder.begleiter{
/* 	border-style: dashed; */
}
.el_zugfahrt .shift_el_work{
	/*position: absolute;*/
	top:0vmax;
	left: 50%;
	width: 50%;
	line-height: 1;	
/* 	text-align: center; */
}
.el_durchbindung .shift_el_work{
	/*position: absolute;*/
	top:0vmax;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	line-height: 1;	
	left: 50%;
	width: 50% !important;
/* 	text-align: center */
	
}
.el_durchbindung_big .shift_el_work{
	/*position: absolute;*/
	top:0vmax;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	line-height: 1;	
	left: 50%;
	width: 50% !important;
/* 	text-align: center */
	
}
.el_klein .shift_el_work{
	/*position: absolute;*/
	top:0vmax;
	width: 70%;
	line-height: 1;	
}
.shift_el_canvas{
	position: absolute;
	left: 20%;
	top: 0;
	/* height: 15vmax; */
	height: calc(15vmax - 0.4vmax);
	width: 30%;
}
.el_zugfahrt .shift_el_canvas{
	/* height: 50vmax; */
	height: calc(50vmax - 0.4vmax);
}
.el_durchbindung .shift_el_canvas{
	/* height: 10vmax; */
	height: calc(10vmax - 0.4vmax);
}

.el_durchbindung_big .shift_el_canvas{
	/* height: 15vmax; */
	height: calc(15vmax - 0.4vmax);
}


.el_klein{
	/* height: 10vmax; */
	min-height: calc(10vmax - 0.4vmax);
}

.el_big{
	/* height: 10vmax; */
	height: calc(20vmax - 0.4vmax);
}
.el_pause{
	/* height: 10vmax; */
	height: calc(10vmax - 0.4vmax);
}

.el_zugfahrt{
	/* height: 50vmax; */
	height: calc(50vmax - 0.4vmax);
}

.shift_el_fzg{
	position: absolute;
	top:25vmax;
	left: 20%;
	text-align: center;
	transform: rotate(-90deg);
	z-index: 1;
	width: 8vmax;
	margin: -2.5vmin -4vmax;
	height: 5vmin;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
}
.shift_el_vonzug{
	position: absolute;
	top:5vmax;
	left: 20%;
	text-align: center;
	transform: rotate(-90deg);
	z-index: 1;
	width: 12vmax;
	margin: 0 -6vmax;
	height: 6%;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	}
.shift_el_nachzug{
	position: absolute;
	bottom:5vmax;
	left: 20%;
	text-align: center;
	transform: rotate(-90deg);
	z-index: 1;
	width: 12vmax;
	margin: 0 -6vmax;
	/* margin: -3% -6vmax; */
	height: 6%;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	}
.shift_el_nachzug.fromto, .shift_el_vonzug.fromto{
	font-size: 0.9em;
}
.fzg1v1{
	left: 35%;
}
.fzg1v2{
	left: 30%;
}
.fzg2v2{
	left: 40%;
}

.fzg1v3{
	left: 27.5%;
}
.fzg2v3{
	left: 35%;
}
.fzg3v3{
	left: 42.7%;
}

.fzg1v4{
	left: 26%;
}
.fzg2v4{
	left: 32%;
}
.fzg3v4{
	left: 38%;
}
.fzg4v4{
	left: 44%;
}
.shift_el_personalscroll{
	position: absolute;
	top:0vmax;
	width: 50%;
	left: 50%;
	height: 50vmax;
	z-index: 1;
	overflow-y: auto;
}
.shift_el_personalscroll.small{
	position: absolute;
	top:40%;
	width: 50%;
	left: 50%;
	height: 60%;
	z-index: 1;
}
.shift_el_personal{
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	line-height: 3vmax;
	text-align: center;
	font-size: 0.8em;
	min-height: 100%;

}
.shift_el_personal .popup_close{
	display: none
}
.shift_el_personal a{
	text-decoration: none;
	padding-bottom: 0.2em;
	line-height: 0.95em;
}
.shift_el_personal b{
	padding-top: 0.4em;
}
.shift_el_personal .vonbis{
	font-style: italic;
}
.popup_master{
	display: none;
	position: fixed;
	top:0;
	left: 0;
	width: 100vw;
	height: 100vh;
	z-index: 90;
}
.popup_map{
	position: relative;
	top:0;
	margin-top: 7vmax;
	padding-top: 10vmax;
	width: 94vw;
	height: calc(100% - 18vmax - 2vmax);
	overflow-y: auto;
	z-index: 5;
	-webkit-overflow-scrolling: touch;
	/* margin: -1em; */
	border-style: solid;
	border-width: 1px;
	border-radius: 1em;
	left: 3vw;
	overflow: hidden;
}
.popup_map .popup_title{
	position: fixed;
	top:7vmax;
	left: 3vw;
	border-bottom-width: 0.5vmax;
	border-bottom-style: solid;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	text-align: center;
	width: 94vw;
	border-left-width: 1px;
	border-left-style: solid;
	border-right-width: 1px;
	border-right-style: solid;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-left-radius: 1em;
	border-top-right-radius: 1em;
	height: 5.6vmax;
	z-index: 5;
}
.popup_map .status{
	position: fixed;
	top:13vmax;
	left: 3vw;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	text-align: center;
	width: 94vw;
	height: 4.3vmax;
	z-index: 5;
	border-color:#000;
}

.popup_map .popup_close{
	position: fixed;
	top: 7.5vmax;
	left: calc(95vw - 5vmax);
	width: 5vmax;
	height: 5vmax;
	z-index: 6;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}
.popup_map .location{
	position: fixed;
	top: 13vmax;
	left: 2vmax;
	width: 5vmax;
	height: 4vmax;
	z-index: 6;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}

.popup_vm{
	position: relative;
	top:0;
	margin-top: 7vmax;
	padding-top: 5vmax;
	width: 94vw;
	height: calc(100% - 12vmax - 2vmax);
	overflow-y: auto;
	z-index: 5;
	-webkit-overflow-scrolling: touch;
	/* margin: -1em; */
	border-style: solid;
	border-width: 1px;
	border-radius: 1em;
	left: 3vw;
}
.popup_vm .popup_title{
	position: fixed;
	top:7vmax;
	left: 3vw;
	border-bottom-width: 0.5vmax;
	border-bottom-style: solid;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	text-align: center;
	width: 94vw;
	border-left-width: 1px;
	border-left-style: solid;
	border-right-width: 1px;
	border-right-style: solid;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-left-radius: 1em;
	border-top-right-radius: 1em;
	height: 5.6vmax;
	z-index: 5;
}
.popup_vm .popup_close{
	position: fixed;
	top: 7.5vmax;
	left: calc(95vw - 5vmax);
	width: 5vmax;
	height: 5vmax;
	z-index: 6;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}
.popup_vm .location{
	position: fixed;
	top: 7.5vmax;
	left: 3vmax;
	width: 5vmax;
	height: 5vmax;
	z-index: 6;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}
.location.unavailable{
	background-image: url('../images/location2_unavailable.png');
}
.location.green{
	background-image: url('../images/location2_green.png');
}
.location.yellow{
	background-image: url('../images/location2_yellow.png');
}
.location.red{
	background-image: url('../images/location2_red.png');
}

.popup{
	display: none;
	position: fixed;
	top:0;
	width: 100vw;
	/* height: 100vh; */
	height: calc( 100vh - 6vmax );
	overflow-y: auto;
	z-index: 25;
	padding-top: 6vmax;
	-webkit-overflow-scrolling: touch;
	text-align: center;
}
.popup .title{
	position: fixed;
	top:0;
	left: 0;
	border-bottom-width: 0.5vh;
	border-bottom-style: solid;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	text-align: center;
	width: 100vw;
	height: 6vmax;
	z-index: 5;
}
.popup .close{
	position: fixed;
	top: 0.4vmax;
	right: 0.4vw;
	width: 5vmax;
	height: 5vmax;
	z-index: 6;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}

.popup .submenu{
	width: 100%;
	height: 10vmax;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	text-align: center;
	border-top-width: 1px;
	border-top-style: solid;	
	border-bottom-width: 1px;
	border-bottom-style: solid;	
}
.submenu.text{
	height: 25%;
	padding: 0 2%;
	width: 96%;
}
.submenu.longtext{
	height: 40%;
	padding: 0 2%;
	width: 96%;
}
.submenu input{
	height:3em;
	font-size: 1em;
}

.submenu.friend_el{
	justify-content: inherit;
	align-content: inherit;
	flex-direction: inherit;

}
.popup .select_friend{
	width: 90vw;
	height: 100%;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	text-align: center;
}
.popup .delete_friend{
	background-size: calc(min(8vmax,8vw));
	background-position: right;
	background-repeat: no-repeat;
	width: 10vw;
	height: 100%;
}


.popup.calendar{
	width: 90%;
	padding: 5vh 5%;
}
.cal_settings{
	display: none;
}
.bg_alert{
	z-index: 1000;
	position: fixed;
	top:0;
	left: 0;
	height: 100vh;
	width: 100vw;
}
.bg_alert .button_ok{
	border-width:3px;
	border-style: solid;
	border-radius: 5px;
	padding: 4px;
	display: inline-block;
}
.bg_alert .button_approve{
	border-width:3px;
	border-style: solid;
	border-radius: 5px;
	padding: 4px;
	display: inline-block;
	margin: 4px;
	margin-top: 20px;
}
.bg_alert .button_deny{
	border-width:3px;
	border-style: solid;
	border-radius: 5px;
	padding: 4px;
	display: inline-block;
	margin: 4px;
}
.mod_alert{
	position: absolute;
	top:35%;
	left: 10%;
	min-height: 20%;
	width: 70%;
	padding: 5%;
	border-radius: 10px;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	text-align: center;
}
.mod_confirm{
	position: absolute;
	top:25%;
	left: 10%;
	min-height: 40%;
	width: 70%;
	padding: 5%;
	border-radius: 10px;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	text-align: center;
}
#initcal{
	border-radius: 5px;
	border-width: 1px;
	border-style: solid;
	margin: 2vmin;
	padding: 1vmin;
}
#callink{
	border-radius: 5px;
	border-width: 1px;
	border-style: solid;
	margin: 2vmin;
	padding: 1vmin;
	/* cursor: pointer; */
}
#callinkopen{
	border-radius: 5px;
	border-width: 1px;
	border-style: solid;
	margin: 2vmin;
	padding: 1vmin;
	/* cursor: pointer; */
}
#calreset{
	border-radius: 5px;
	border-width: 1px;
	border-style: solid;
	margin: 2vmin;
	padding: 1vmin;
	margin-top: 10vmax;
	/* cursor: pointer; */
}
#calserver_desc{
	border-radius: 5px;
	border-width: 1px;
	border-style: solid;
	margin: 2vmin;
	padding: 1vmin;
	font-size: 0.8em;
}
#calserver_url{
	width: 95%;
	/* cursor: pointer; */
}
.fzg{
	width: 100%;
	height: 30vmax;
	display: block;
	font-size: 1.5em;
	border-bottom-width: 0.4vmax;
	border-bottom-style: solid;
	margin-bottom: -0.4vmax;
	overflow-x: auto;
	overflow-y: hidden;
}
.fz_nr{
	/* width: ; */
	display: inline-block;
	line-height: 5vmax;
	font-weight: bold;
	font-size: 1.3em;
}
.fz_comment{
	/* width: ; */
	display: inline-block;
	line-height: 5vmax;
	font-size: 1.3em;
	padding-left: 10px;
}

.fahrten{
	width: 245vmin;
	height: 100%;
	display: inline-block;
	font-size: 1.1em;
}
.fahrt{
	width: 80vmin;
	height: 100%;
	display: inline-block;
	border-width: 0.4vmax;
	border-style: solid;
	position: relative;
	font-size: 0.9em;
}
.zug_nr{
	height: 15%;
	width: 50%;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	line-height: 15%;
	position: absolute;
	top:0;
	left: 0;
}
.zug_traktion{
	height: 15%;
	width: 50%;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	line-height: 15%;
	position: absolute;
	top:0;
	left: 50%;
}
.zug_von{
	height: 15%;
	width: 50%;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	line-height: 15%;
	position: absolute;
	top:15%;
	left: 0;
}
.zug_nach{
	height: 15%;
	width: 50%;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	line-height: 15%;
	position: absolute;
	top:15%;
	left: 50%;
}
.zug_abzeit{
	height: 15%;
	width: 50%;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	line-height: 15%;
	position: absolute;
	top:30%;
	left: 0;
}
.zug_anzeit{
	height: 15%;
	width: 50%;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	line-height: 15%;
	position: absolute;
	top:30%;
	left: 50%;
}
.zug_personal{
	height: 55%;
	width: 100%;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	position: absolute;
	top:45%;
	overflow-y: auto;
	font-size: 0.7em;
}
.zug_personal a{
	text-decoration: none;
}

#debug_log{
	text-align: center;
	padding: 0;
	z-index: 200;
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	height: calc(100vh);
	width: calc(100vw);
	background: #ffffff;
}
#debug_log .close{
	position: fixed;
	top:4vmax;
	right: 1vmin;
	width: 5vmax;
	height: 5vmax;
	z-index: 6;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	background-image: url('../images/close.png');
}

.login{
	text-align: center;
	padding: 2em;
	z-index: 200;
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	height: calc(100vh - 4em);
	width: calc(100vw - 4em);
	
}
.login .close{
	position: fixed;
	top:4vmax;
	right: 1vmin;
	width: 5vmax;
	height: 5vmax;
	z-index: 6;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}

.login td{
	text-align: left;
}
.login .btn_login{
	text-align: center;
	font-size: 0.8em;
	padding: 0.5em;
}
.login #errormsg_pds{
	border-width: 2px;
	border-style: solid;
	border-radius: 10px;
	padding: 0.5em;
	display: none;
}
#pds-username{
	font-size: 1.1em;
	width: 50vmin;
}
#pds-password{
	font-size: 1.1em;
	width: 50vmin;
}
.login .sender{
	font-size: 1.1em;
}
.login table{
	margin: 0 auto;
	margin-top: 5vmax;
}
.login tr{
	height: 1.5em;
}
.hidden{
	display:none !important;
}
