/* Damit die Elemente unten nicht abgeschnitten werden! */

/* #edittriproute{ */
	/* width: 100%; */
	/* height: 100%; */
/* } */
.contactStatusExplain{
	margin-top: 10px;
	margin-bottom: 10px;
	font-size: small;
}
.contactStatus{
	font-size: small;
}
.stepDone{
	color:gray;
}
.stepDone .stepNumber{
	background: #dbd7d7;
}
.stepHighlight{
	border: 2px solid;
}
.stepNumber{
	font-weight: bolder;
    color: white;
    background: darkgray;
    width: 25px;
    text-align: center;
    height: 25px;
    border-radius: 50%;
    vertical-align: middle;
    line-height: 25px;
}	
.roiInnerDiv{
	max-width: 300px;
	margin-left: auto;
	margin-right: auto;
}
.explainOnBackground{
	font-size:small;
}

.planningOverviewRouteName{
	font-size: small;
}
.planningOverviewLeftDiv{
	width: 80px;
}
.hintMore{
	display:none;
}
.hintMoreButton{
	cursor:pointer;
	text-align:center;
	margin-top: 5px!important;
    margin-bottom: 5px!important;
    margin-left: auto !important;
    margin-right: auto !important;	
}
.hintMoreButtonContainer{
	text-align:center;
}

.unconfirmedDiv{
    padding: 4px!important;
    border-radius: 4px;
}

.tableFilterElementList{
	max-height: 70vh; 
	overflow-y : auto;
}
#instructNoMail{
	text-align:left;
	padding: 10px;
	line-height: 1.6;
}

/* Extra-Platz für den Aktualisieren-Button: */
#lastupdatechatsextraspace{
	height:50px;
}
.requsersel{
	cursor:pointer;
}

.moreOptionsInRequest{
	margin-left: 4px;
    margin-right: 4px;
}	

.driverOrderItem{
	min-width: 100px;
    text-align: center;
    padding: 10px;
    border-radius: 8px;
    margin: 10px;
	font-weight: 600;
}

.payCash4AllOKButton{
	margin-top:15px;
}

.paymentDiv{
	text-align: center;
    padding: 20px;
}
.paymentOwesDiv{
    padding-top: 20px;
    padding-bottom: 20px;
}
.paymentOwesAmount{
	font-size: large;
    margin: 10px;
}

.payButton{
	padding: 4px;
    border-radius: 6px;
    font-size: 10px;
    margin-left: 8px;
}
.payButtonInvisible{
    border: transparent solid 1px;	
	color: transparent;
}
.isHidden{
	display:none;
}

.tabbar__icon{
	cursor: pointer;	
}

.carExceptionInStatus{
	margin-top: 3px;
	font-style: italic;
}

.alertScrollableDiv {
    max-height: 60vh;
    overflow-y: scroll;
}

.alertIcon{
	text-align: center;
	font-size: large;
	color: red;
}

@media screen and (min-width:900px) {
	ons-splitter-side{
		width: 25%!important;
		left: 0px!important;
	}
	ons-splitter-content{
		width: 75%;
		left: 25%;
	}
	#oprbutton{
		display: none;
	}
}

@media screen and (max-width:899px) {
	ons-splitter-side{
		width: 280px!important;
		max-width: 95%!important;
	}
	ons-splitter-content{
		width: 100%;
		left: 0%;
	}
}

.pmFixedWidth{
	width:186px;
}

.homecontextbutton{
	/* display:none; */
}

.chatreplybutt{
	width: 60px;
	border-radius: 8px;
    margin: 5px;
    padding: 5px;
}

.chatreplylabel{
	font-size: smaller;
}

.pastTripTableRow{
	cursor: pointer;
}

.NCPPublic{
    color: #4CAF50;
}
.NCPPrivate{
    color: gray;
}	
.NCPScope{
	font-weight: 600;
    margin-bottom: 7px;
}	
.NCPExpiryDate{
	margin-top: 5px;
}

.moreButtExplain{
	font-size: x-small;
}

#forceClearPastUsageButton{
	white-space: normal;
	max-width: 90%;
}

@media screen and (min-width:451px) {
	.genericTitleOnPage{
		display:none;
	}
	.genericTitleOnHeader{
		
	}
}
@media screen and (max-width:450px) {
	.genericTitleOnPage{
		padding: 20px 10px 10px 10px;
		font-weight: 600;
		font-size: x-large;
	}
	.genericTitleOnHeader{
		display:none;
	}
}

.requestsegment{
	text-align: center;
	margin-top: 15px;
	margin-bottom: 12px;
	max-width: 95%;
}

.contactStatusDiv{
	text-align: center;
	margin-top: 15px;
	margin-bottom: 12px;
}

.contactRequestData{
	width: 70%;	
	margin-right: auto;
	margin-left: auto;
}
.requestResultInChat{
	text-align: center;
	font-weight: 600;
	
}
.resultNegative{
	color: #b56767;
}
.resultNeutral{
	color: #5e5e5e;;
}

.fabdiv{
	display: inline-block;
}
.smallbuttondiv{
	display: inline-block;
	font-size: 12px;
	margin-bottom: 4px;
}

.dialog-container{
	overflow-y:auto;
}
.timeOfPayment{
	font-size: small;
}
.invisibleFont{
	color: transparent;
}

.carddateseparator{
	display: inline;
}


.guest_panel{
	font-size: 8px;
    font-weight: 700;
    color: white;
    text-align: center;
}

.contactDate{
	text-align: right;
    font-size: small;
}

.contactRequestResult{
	font-size: large;
    font-weight: bold;
    padding: 10px 0px 0px 0px;
}
.contactRequestResultGeneral{
	font-size: large;
    font-weight: bold;
    padding: 20px 20px 20px 20px;
}
.planrouteeditable{
	cursor: pointer;
}
.action-sheet{
	max-width:600px;
	margin-left: auto;
    margin-right: auto;
}
.centered{
	text-align: center;
}
.centeredDiv{
	margin-left: auto;
    margin-right: auto;	
}

.obButtonsBottom{
	bottom: 2px;
    /* position: absolute; */
    width: 100%;
    text-align: center;
    height: 60px;
    left: 0px;
	margin-top: 50px;
}

.copytext{
	background: #bbe1ff;
	/* #122f46; */
    padding: 15px;
    color: #646464;
    border-radius: 8px;
	font-style: italic;
}

.obPicture{
	min-height: 300px;
    height: 80%!important;
    max-height: 800px;
}

.carpoolpicgirls{
  /* background-image: linear-gradient(rgba(0,119,182, 0.5), rgba(9,9,121, 0.9)),  */
  background-image: linear-gradient( 86.3deg,  rgba(0,119,182,0.7) 3.6%, rgba(8,24,68,0.7) 87.6% ), url("../img/ob/bg-1.jpg")!important;
  /* background-color: #cccccc; */
  /* height: 500px; */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}
.carpoolpictext{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.obPage_heftig{
	color: white;
	padding-top: 50px;
	background: rgb(11,9,42);
	background: -moz-linear-gradient(0deg, rgba(11,9,42,1) 0%, rgba(9,9,121,1) 41%, rgba(51,136,204,1) 100%);
	background: -webkit-linear-gradient(0deg, rgba(11,9,42,1) 0%, rgba(9,9,121,1) 41%, rgba(51,136,204,1) 100%);
	background: linear-gradient(0deg, rgba(11,9,42,1) 0%, rgba(9,9,121,1) 41%, rgba(51,136,204,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0b092a",endColorstr="#3388cc",GradientType=1);
}

.bluebackcardlogin{
	background-image: linear-gradient( 86.3deg,  rgba(0,119,182,1) 3.6%, rgba(8,24,68,1) 87.6% )!important;	
}
.obPage{
	overflow-y: auto;
	background-image: linear-gradient( 86.3deg,  rgba(0,119,182,1) 3.6%, rgba(8,24,68,1) 87.6% );	
}
.obPage{
	color: white;
	padding-top: 50px;
	
}
.obPage_boring{	
	background: rgb(73,69,128);
	background: -moz-linear-gradient(345deg, rgba(73,69,128,1) 0%, rgba(132,132,185,1) 49%, rgba(95,158,171,1) 100%);
	background: -webkit-linear-gradient(345deg, rgba(73,69,128,1) 0%, rgba(132,132,185,1) 49%, rgba(95,158,171,1) 100%);
	background: linear-gradient(345deg, rgba(73,69,128,1) 0%, rgba(132,132,185,1) 49%, rgba(95,158,171,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#494580",endColorstr="#5f9eab",GradientType=1);
}
.carouselTools{
	display: table;
    position: fixed;
    width: 100%;
	z-index: 1000;
	top: 0px;
    height: 45px;
	background: #0606069c;
}

.carouselTools .left{
	display: table-cell;
	position: fixed;
	left: 15px;
	top: 5px;
	width: 60px;
}
.carouselTools .right{
	display: table-cell;
	position: fixed;
	right: 15px;
	top: 5px;
	text-align: right;
}
.carouselTools .center{
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}
.activedot{
	background: #38c!important;
}

.obPageDiv{
	height: 100vh;
}	
.obPageInner{
	/* height: 100vh; */
	max-width: 600px;
	margin:auto;
	padding: 30px;
}
.obText{
	text-align: center;
	font-size: large;
	margin-top: 10px;
	margin-bottom: 20px;
	line-height: 30px;
}
.obText.note{
	font-size: medium;
	color: #bfbfbf;
	margin-top: -10px;
	margin-bottom: 20px;
}

.obText.large{
	font-size: x-large;
	line-height: 35px;
}

@media screen and (min-width:501px) {
	.obText.large{
		/* background: red!important; */
		font-size:5vh!important;
		line-height:7vh!important;
	}
}

.homecontextbutton{
	font-size: 26px;
    /* line-height: 24px; */
    vertical-align: middle;
}
#oprbutton{
	font-size: 26px;
    /* line-height: 24px; */
    vertical-align: middle;	
}
.toolBarBigSymbol{
	font-size: 26px;
    line-height: 24px;
    vertical-align: middle;
}
.toolBarBoldLabel{
	font-weight: bold;
}

.toolBarRoundedCorners{
	border-top-left-radius:8px;
	border-top-right-radius:8px;
	/* background:transparent; */
}

.maxHeightPopup{
	max-height: 80vh;
}

.childSeatsNeededInfoAlarm{
	
}
.childSeatsNeededInfo{
	font-size: small;
	display: table-cell;
	cursor: pointer;
}
.childSeatsNeededInfoContainer{
	margin-top: 15px;
}
.okCheck{
	color: green;
    font-size: xxx-large;
}
.failureClose{
	color: red;
    font-size: xxx-large;
}


.forceRelativePos{
	position: relative!important;
	right: unset!important;
	top: unset!important;
}
.ons-ios-scroll .alert-dialog-button{
	position: absolute;
	top: 0px;
	right: 11px;
	width: unset;
	border-top: none;
	padding: 10px;
    margin-top: 10px;
    line-height: 20px;
}
.ons-ios-scroll .popupokbuttondiv{
	border-top: none;
}



.suggestOptimPlanning{
    cursor: pointer;
    font-size: small;
	font-weight: bold;
    margin-top: 10px;
    margin-bottom: 10px;
    text-align: center;
	padding: 5px;
    border-radius: 8px;
}

.pseudoHiddenElement{
	position:absolute;
	top:0;
	opacity:0;
	height:0;
}
.planButton{
	padding: 5px!important;
    border-radius: 8px;
	cursor: pointer;
}
.planroute{
	padding: 5px!important;
}
.chevronCompensate{
	margin-right: 16px;
}

.welcomePicture{
	padding-top: 20px;
    padding-bottom: 20px;
}
.h2boring{
	font-weight: unset!important;
    color: unset!important;
}

.alert-dialog-button--material{
	/* float:unset!important; */
}
.alert-dialog-footer--material{
	text-align:right!important;
}


.alert-dialog-button{
	cursor: pointer;
}

/* .myTimePickerDialogfake .dwc{ */
	/* display: none; */
/* }  */

.driverFractionCircleContainer{
	position: relative;
	width: 45px;
    height: 45px;
}
.driverFractionCircleLabel{
	position: absolute;
    font-size: x-small;
    text-align: center;
    width: 45px;
    height: 25px;
    vertical-align: middle;
    top: 17px;
	line-height: normal;
}
.driverFractionCircle{
	position: absolute;
	width: 45px;
    height: 45px;
	
}
.driverFractionCircle .progress-circular__primary{
	stroke-width: 4px!important;
}	
.driverFractionCircle .progress-circular__secondary{
	stroke-width: 4px!important;
}
.du-bestcar .driverFractionCircleLabel{
    font-weight: bold;
}
.planningIcon{
	font-size: 25px;
	padding: 5px;
}

.ons-swiper{
   /* -webkit-transform: translateZ(0); */
}
/* Vermeidung der Flicker/Glitches-Effekte auf iOS 
.ons-swiper-target{*/
.no-flicker-swiper-ios{	
	-webkit-transition-duration: 0ms!important;
}
.iPadInBrowser{
	height: 60px;
}
.pull-to-refresh-material__control{
	z-index: 2000;
}
.newsTitle{
	
}
.newsContents{
	text-align: left;
	
}
.newsPicContainer{
	text-align: center;
}
.newsPic{
	max-width: 90%;
}
.newsWindow{
	min-width:270px;
	width:unset;
	max-height: 90%;
    overflow-y: auto;
	
}
.lastUpdateContainerFixed{
	position: fixed;
    width: 100%;
	z-index: 10;
}
.lastUpdateContainerSpace{
	display:none;
	height:100px;
}
.lastupdateinfoimportant .refreshLastUpdateButton{
    height: 30px!important;
    width: 30px!important;
}

.refreshLastUpdateButton{
	margin-right:8px!important;
}
.refreshLastUpdateButton .licon{
	padding: 0px!important;
}

.lastupdateinfoimportant .timeagotooold{
    font-weight: 600;
}
.lastupdateinfoimportant .licon{
	font-size: 30px!important;
}
.forcedOverwritten{
	border-radius: 8px;
    padding: 4px;
}
.absenceBox{
	/* cursor: pointer;	 */
} 
.planDayAbsent{
	padding: 5px;
    text-align: center;
	border-bottom-right-radius: inherit;
    border-bottom-left-radius: inherit;
}
.reqLabelDailyAbsence{
    font-weight: 600;
    border-radius: 5px;
	/* padding-left: 10px; */
    /* padding-right: 10px; */
}
.dailyAbsenceDiv{
	border-bottom: 1px solid;
	padding-bottom: 4px;
}
.newCarAssignmentButton{
	margin-top: 15px;
	cursor: pointer;
    color: #38c;
    text-align: center;
}
.forceMargin15px{
	margin-right: 15px;
    margin-left: 15px;
}
.percentDriverInTable{
	font-size: smaller;
    font-style: italic;
}
.timePUBinMbox{
	font-size: small;
}
.rq-absencebutton{
	font-size: small;
    word-break: break-all;
	/* padding-top: 6px!important; */
    /* padding-bottom: 6px!important; */
}
.absenceCheckboxName{
	text-decoration: line-through;
}	
.absenceInPlanning{
	margin-bottom: 5px;
	position: relative;
	max-width: 600px;
}
.absenceInRequest{
	position: relative;
	cursor: pointer;	
}
.absenceInRequestReason{
	margin-bottom: 5px;
    font-weight: 600;	
}
.absenceInRequestInnerRight{
	display: table-cell;
	text-align: right;
    vertical-align: middle;
    width: 20px;
	/* position: absolute; */
}
.absenceInRequestInner{
	padding: 12px 30px 12px 25px;
	text-align: center;
	/* display: table-cell; */
;
}
.topOfAllWindows{
	z-index: 20002!important;
}

#StatsTablesAndChartsDIV{
	margin-bottom: 30px;
}
#SaldosTableGeneral td{
	min-height:30px;
}
#SaldosTableGeneral {
	min-width:220px;
}
.statsInnerTitle{
	padding-right: 10px!important;
	padding-left: 10px!important;
	margin-top: 30px!important;
}
.allowWordBreak{
	word-break: break-all;
}
.saldosTableRow{
	cursor:pointer;
}
.spaceBelow{
	margin-bottom:10px;
	max-width:700px;
}
.planVarDiv{
	display:block;
	/* width:50%; */
}
@media ( min-width: 551px ) {
	.planVarDiv{
		display:inline-block;
		width:50%;
	}
}

.imgIcon{
	width:37px;
	height:auto;
}

@media ( max-width: 550px ) {
	.planVarDiv{
		margin-top: 4px;
		margin-bottom: 4px;
		min-height: 26px;
		padding-top: 7px;
		padding-bottom: 7px;
	}
	.planVarDiv .mylinebreak{
		display:none!important;
	}
	.planVarDiv .mybox{
		display:table-cell!important;
	}
	.imgIcon{
		width:25px;
		margin-right: 5px;
	}
}


.datePickerWindow{
	min-width:280px;
}

#planningpastcontainer{
	height:54px;
}
.forcepointer{
	cursor:pointer;
}
.popupTitle{
	padding: 10px;
    text-align: center;
    font-weight: 600;
	border-radius: 5px;
	margin-bottom: 5px;	
}
.errorMessageTextDiv{
	overflow-y: auto;
    max-height: 60vh;
}
.warningBlock{
	text-align: center;
    padding: 20px;
    border-radius: 8px;
	font-weight: 500;
}
.notificationWindowScrollDiv{
	max-height: 70vh;
    overflow-y: auto;
}	
.matzestats{
	margin-top: 10px;
    margin-bottom: 10px;
}
.matzestats td{
	text-align: center;
}
.matzestats .clickable{
	cursor: pointer;
}
.infowindowhint{
	font-size: smaller;
	margin-top: 10px;
    margin-bottom: 10px;
}
.centeralign{
	text-align: center;
}
.datepickerclass{
	display: inline-block;
    font-weight: 600;
    cursor: pointer;
}
.driverStatusSymbolsOnly{
	display: inline-block;
	margin-left: 2px;
}

.driverStatus{
	font-size: x-small;
	margin-left: 5px;
    line-height: 12px;
	font-weight: normal;
}
.iamtheuser {
   pointer-events: none;
   font-weight:700;
}

#SaldosTableSpot{
	padding: 10px;
}

.widgethr{
	width: 100%;
    height: 1px;
    border-top: 1px solid;
    margin: 8px 0px 8px 0px;
}
.widgetSelected{
	display:none;
	margin: auto;
    background: white;
    width: 30px;
    height: 30px;
    color: green;
    padding: 5px;
    border-radius: 50%;
    text-align: center;
}
.widgetStyleSelection{
    text-align: center;
}
.widgetUpdate{
	text-align: center;
}	
.widgetTextLine{
	margin-top:3px;
	margin-bottom:3px;
}
.widget{
	height: 140px;
	width: 140px;
    vertical-align: middle;
    margin: 13px;
    border-radius: 8px;	
	cursor: pointer;
	padding: 10px;
	display: inline-block;
	text-align: left;	
}
.widgetdate0{
	color: white!important;
}
.widgetdate1{
	color: red!important;
}
.widgetdate2{
	color: red!important;
}
.widgetdate3{
	color: yellow!important;
}
.widgetstyle0{
	background-image: linear-gradient(180deg, #38c, #b2ddff);
	color: white;
}
.widgetstyle1{
	background-image: linear-gradient(180deg, red, yellow);
	background: white;
	color: black;
}
.widgetstyle2{
	background: black;
	color: white;
}
.widgetstyle3{
	background-image: linear-gradient(180deg, #005192, #4b9ada);
	color: white;
}
.bighint{
	margin-top: 100px;
    padding: 50px;
}
.nopadding > .list-item{
	padding: 0px!important;
}

.routeList{
	text-align: left;
    margin: 15px auto 15px auto;
    width: 240px;
}
.hNContainer{
	position: relative;
	height: 50px;
	width: 130px;
	margin: auto;
}
.hNOuterContainer{
	position: fixed;
	z-index: 999;
	height: 0px;
	width: 100%;
	/* overflow: show; */
	bottom: 70px;
}
.hNContainerOnPage{
	height: 80px;
	width: 100%;
}
.hNButton{
	border-radius: 50% !important;
	height: 36px;
    width: 36px;
    padding: 0px;
    margin: 10px;
	border-width: 0px !important;
	box-shadow: 0 2px 5px 0 rgba(0,0,0,.26);	
}
.bigOK{
	font-size:50px;
	margin:25px;
	color:green;
	display: table-cell;
	vertical-align: middle;
}
.userPicInSettings{
	max-width:300px;
	margin:auto;
	text-align: center;
}
.userPicInSettings > img{
	max-width:300px;
}
.userPicInList{
	max-width:100px;
	margin:auto;
	text-align: center;
}
.userPicInList > img{
	max-width:100px;
}

.busiconselect{
	display: inline-block;
	cursor: pointer;
	margin: 10px;
}

#firstTSDatePicker{
	text-align: right;
}
.numberOfPassengers{
    /* width: 1.2em; */
    text-align: center;
    height: 1.2em;
	border-radius: 8px;
    /* border-radius: 50%; */
    font-size: small;
    display: inline-block;
    padding: 2px 6px 2px 6px;
	margin-top: 5px;
}
.driverNameInPopop{
	word-break: break-word;
	min-width: 80px;
	cursor:pointer;
}

.minHeightDiv{
	min-height: 40px;
    display: inline-block;
    vertical-align: middle;
}

.datetimeedit{
	font-weight: 600;
    cursor: pointer;
}

.leftAlign{
	text-align: left;	
}
.signInWithOAuth{
	margin-top: 8px;
	height: 39px;
    vertical-align: middle;
    background: white;
    width: 250px;
    margin: 8px auto;
    border-radius: 8px;	
	cursor: pointer;
	
}
.labelSignInWithOAuth{
	display: inline-block;
	vertical-align: middle;
	color: #2d2d2d;
	line-height: 39px;
	height: 39px;
}
.logoSignInWithOAuth{
	display: inline-block;
	vertical-align: middle;
	color: #2d2d2d;
	line-height: 39px;
	height: 39px;
	margin-left: 10px;
	margin-right: 15px;
	width: 27px;
    text-align: center;
}


.messReceiversTitle{
	display: inline-block;
	margin:8px;
}

.refreshLastUpdateButton{
	display:inline-block!important;
	vertical-align:middle;
	text-align:center;
}
#messagetextinput{
	width:100%;
}
.fabElevatedFAB{
	bottom: 110px!important;
}
.fabInline{
	/* color: rgba(255,255,255,0.85); */
    padding: 5px;
    height: 20px;
    border-radius: 20px;
    /* color: white; */
    font-size: 13px;
	display: inline-block;
}
.fabInlineCircle{
	width: 20px;
    height: 20px;
    text-align: center;
}
.demoOKButton{
	bottom: 0px!important;
    right: 0px!important;
}
.verticallyCentered{
	vertical-align: middle;
}
.wideFAB{
	min-width: 130px;
    border-radius: 30px!important;
	height: 56px;
	line-height: 50px!important;
}
.wideFAB ons-fab{
	vertical-align: middle;
}
.wideFAB .fab__icon{
	line-height: unset;
}
.hintWithIcon .wideFAB{
	max-width:90px;
}
.wideFAB .label{
	display: inline-block;
    /* width: 70px; */
    font-size: 15px;
    font-weight: bold;
    margin-left: 5px;
}
.schedtime{
	max-width: 7em;
}
.editableText{
	cursor: pointer;
	background: #38c;
	color: white;
	padding: 3px;
	border-radius: 5px;
	text-align: center;
}

.myTimePickerConfigButtonFAB{
right: 10px;
    top: 36px;
    position: absolute;
    width: 30px;
    height: 30px;
    cursor: pointer;
	z-index: 10;
}

.lispaced{
	margin-top: 5px;	
	margin-bottom: 15px;	
}

.liconons {
    font-size: 20px;
}
/*
#collapsibleset{
    max-width: 900px;
    margin: auto;
}
*/

.planTripList .plantimepicker{
	font-weight: bold;
}

#collapsibleset{
    padding-left:  8px;
	padding-right: 8px;
}
.planningListCard{	
	padding-bottom: 10px;
	max-width: 400px;
	margin-right: auto !important;
    margin-left: auto !important;
}
.planningTableCard{
    max-width: 900px;
    margin-right: auto !important;
    margin-left: auto !important;
}	

.cutlongdiv{
	max-height: 50px;
    overflow: hidden;
	position:relative;
}

#driverhintdivbutt{
	width: 26px;
	margin: auto;
}

.pac-item {
    cursor:pointer!important;
}	
.uppercase{
	text-transform: uppercase; 
}
.fullwidth{
	width:100%
}
.premium_panel{
	font-size: 8px;
    font-weight: 700;
    color: orange;
    text-align: center;
    margin-top: -8px;
}

.mcplogo_my{
	display: inline-block;
    border-radius: 50%;
    background: #38c;
    color: white;
    padding: 5px;
	font-weight: 800;
}
.mcplogo_cp{
	display: inline-block;
	font-weight: 500;
}
.mcplogo_app{
	display: inline-block;
	font-weight: 800;
}
.premiuminfocard{
	padding: 20px;
}
.p_info_title{
	padding-top:10px;
}
.abo_price_unit{
	font-size: 12px;
}
.abo_benefitlist{
	border-top: 1px solid #38c;
	border-bottom: 1px solid #38c;
    padding: 10px;
}
.abo_benefitlist li{
	margin: 0 0 5px 0;
}
.thisispremium{
    padding: 20px;
    text-align: center;
    font-size: 28px;
    font-weight: 800;
    color: #38c;
}


.dialogMaxHeight{
	/* max-height: 95vh; */
    overflow-y: auto;
}
.tripstatustitle{
	font-size: 18px;
	margin-bottom: 10px;
}
#lastupdateusermap{
	margin-top: 1px!important;
}

/* wenn niedriger als  */
#usermap-dialogtext{
	overflow-y: auto;
    max-height: 85vh;
}
#calendar-dialogtext{
	overflow-y: auto;
	overflow-x: auto;
    max-height: 90vh;
	/* max-width: 85vw; */
}
.cal-container{
	max-height: 98vh;
}
@media screen and (max-width:450px) {
	#usermap-dialogtext{
		min-width: 90vw;
	}	
}
@media screen and (min-width:400px) {
	.cal-out{
		padding: 10px;
		/* overflow-x: auto; */
	}
	.cal-popovertext{
		padding:15px;	
	}
}
@media screen and (max-width:400px) {
	.cal-popovertext{
		padding:5px;	
	}
}

/* Calendar von mir am 16.12.2019 */
.cal-popovertext{
	max-width:400px;
	/* padding:15px; */
	margin-top:10px	
}

.cal-daynames{
	width:280px;
}
.cal-dayname{
	width: 40px;
    height: 30px;
    display: inline-block;
    text-align: center;
}
.cal-headerline{
	display:table;
	width:100%;
	height:40px;
}
.cal-navibutts{
	display:table-cell;
	width:30px;
}
.cal-navibutt{
	display: inline-block;
}
.cal-monthname{
	font-weight: 600;
    padding: 7px;
    margin-bottom: 4px;
	display: table-cell;
}

.cal-days{
	width:280px;
	height:200px;
}
.cal-daysofmonth{
	width:280px;
	height:165px;
	/* overflow-y: scroll; */
	cursor:pointer
}
.cal-daydiv{
	width: 40px;
    display: inline-block;
    text-align: center;
}
.cal-dayinner{
	border-radius: 50%;
	width: 30px;
	height: 30px;
	margin: auto;
}
.cal-daytext{
	margin:auto;
	margin-top: 3px;
    padding-top: 5px;
}
.cal-timediv{
	width:200px;
	margin:auto;
}
.cal-timediv .dw-li{
	font-size:16px!important;
}
.cal-ok{
	margin:auto;
}


#statstable01{
	padding: 10px;
}
.signInInputDiv{
	position: relative;
	max-width: 300px;
    margin: auto;
}
.passwordeye{
	position: absolute;
    right: 15px;
    top: -10px;
	line-height: 32px!important;
	cursor:pointer;
}
.inputOverlayButton{
	position: absolute;
    right: 15px;
    top: -10px;
	line-height: 32px!important;
	cursor:pointer;
}
.inputStandardWidth{
	width: 280px;
}
.autowidthselect{
	width: auto;	
}
.cancelPushTestButton{
	cursor:pointer;
} 
.prevnextbutton{
	width: 40px;
	height: 38px;
	font-size: 25px!important;
}

.button{
	cursor: pointer; 
}
button{
	cursor: pointer; 
}
.plantimepicker{
	cursor: pointer; 
}

ons-list-item{
	cursor: pointer;
}

#myspinner{
	display: none;	
	position: fixed;
	z-index: 999;
	height: 2em;
	width: 2em;
	overflow: show;
	margin: auto;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
}

#usernameheader{
	font-size:14px; 
}
.unhcontainer{
	display: inline-block;
    vertical-align: middle;
}
.unhname{
	line-height: 15px;
    font-size: 13px;
}
.unhguest{
	line-height: 15px;
    font-size: 10px;
	color: gray;
}

.zeitgruppe{
	border: none;
}

/* temporär, bis ich schönere Lösungen gefunden habe */
.MyPopupMenuUL{
	list-style-type:none;
}
.MyPopupMenuUL li{
	display: block;
	padding: 10px;
	padding-right: 20px;
	cursor: pointer;
}
.panellistview{
	list-style-type:none;
	padding-inline-start: unset;
}
.panellistview li{
	display: block;
	padding: 10px;
	padding-right: 20px;
	cursor: pointer;
}
.langli{
	list-style-type:none;
	padding-inline-start: unset;
}
.langli li{
	display: block;
	padding: 10px;
	padding-right: 20px;
	cursor: pointer;
}

.chatmyanswerdivcontainer{
	width:100%;
	bottom:1px;
	/* padding-left:10px; */
	/* padding-right:10px; */
	position: fixed;
	-webkit-transform: translateZ(0); /* für iOS nötig! */
}
.chatmyanswerdivpadder{
	margin: auto;
    padding-left: 5px;
    padding-right: 5px;
}
#chatmyanswerdiv{
	max-width:700px;
	margin: auto;
}
#mychatstable{
	margin-bottom: 130px; 
}
.chatmyanswer{
	position: relative;
	margin-top: 30px;
	text-shadow:none;
	padding: 7px;
	-moz-border-radius: 6px !important;	;
	-webkit-border-radius: 6px !important;	
	border-radius: 6px !important;	
	box-shadow: 0 2px 5px 0 rgba(0,0,0,.26);
	/* Damit beim Hochspringen der Eingabe das fixe Aktualisiert-Fenster hinter der Eingabe liegt, muss das größer sein als .lastupdateinfo : */
	/* z-index: 5001; */
	/* geht aber nicht, daher in Javascript und hide() */
	/* lastupdateinfofixedpos hat einen Wert von 799;	 */
}
.chatmyansweraddressees{
	cursor: pointer;
    display: inline-block;
	margin-bottom: -16px;
}

.chatmyanswertextbox{
	width:100%;
	margin-top: 0px;
    margin-bottom: 0px;
}	
.chatmyanswersendbutton{
	margin-bottom: 0px;
}	
.paddingcard{
	padding: 15px;
	/* max-width: 90%; */
}
.outerpaddingdiv{
	padding: 15px;
}
.mycard{
	border-radius: 6px !important;
	margin: 5px;
}
.mycard .header{
	/* height: 40px; */
	padding: 10px; /*temporär, noch verbessern!*/
	vertical-align:middle;
    /* margin:auto; */
	text-align:center;
    font-weight: 700;
	font-size:16px;
	font-family: Roboto,Noto,sans-serif;
	display:block;
	border-radius: inherit;
	border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;	
}

#loginformcontent{
	padding-top:0px;
	padding-bottom:25px;
	
}

@media screen and (max-height:400px) {
	.bigiconcardlogin{
		display:none;
	}
	.panelpicturehead{
		display:none;
	}
}

.menupopover{
	/* width:220px; */
	max-height:calc(100vh - 60px);
	height:auto;
	padding:0px;
}

#panelright .popover{
	max-width:85%;
}
	
#panelright .popover__content{
	min-height:unset!important;
	width:unset!important;
	/* max-width:85%; */
}

.popoverMinWidth{
	min-width:200px;
}

.popoverleftright .popover__content{
	width:unset;
	max-width:260px;
	min-height:40px;
}

/* allgemein mittig auf Seite, wobei die maximale Breite nicht angegeben sein muss */
.centeredmain{
	max-width:unset; 
	/* 96%; */
    /* display: table; */
    margin-left: auto !important;
    margin-right: auto !important;
	/* margin:auto;  */
	/* max-width:400px; */
}

.roundbutt{
	border-radius: 50% !important;
	width: 26px;
    height: 26px;
	line-height: 26px;
    text-align: center;
	margin:0px;
	vertical-align: middle;
}
	
.reducewidth{
	display: table;
}

#requestdiv{
	/* Problem: beim Auffrischen "zappeln" die Elemente, daher table ausgeschaltet! */
	/* Sonst sind die Elemente aber entweder zu schmal, zu breit oder unterschiedlich breit! */
	display: table; 
    margin: auto;
	
}

.mainpageinner{
	padding-left:   10px;
	padding-right:  10px;
	padding-top:    12px;
	padding-bottom: 80px;
}

.pagewidthwide{max-width:900px;}
.pagewidthfull{}
.pagewidthstandard{
	max-width: 700px;
	margin-left: auto;
    margin-right: auto;
}	
.pagewidthnarrow{
	/* Volle Breite für viele iPhones und die meisten Android-Phones */
	max-width: 440px;
	margin-left: auto;
    margin-right: auto;
	padding-bottom: 40px;
}	


@media screen and (max-width:440px) {
	.ifsmallhide{
		display:none!important;
	}
	.ifsmallshow{
		display:block;
	}
	/* #PastTripsTable */
	.smallable{ font-size: small; }
	.smallable td{ padding:3px 5px 3px 5px; }
	
	.popoverleftright .popover__content{
		max-width:185px;
	}
	.centeredmain{
		max-width: 100%;
		display: block;
	}
}

/* forciere farbliches Überschreiben */
.NewDatasetinTable td {
	background: transparent!important;
	font-weight: 600;
}
	
@media screen and (min-width:441px) {
	.ifsmallhide{
		/* display:block; */
	}
	.ifsmallshow{
		display:none;
	}

	.mytable th {
		padding-left: 12px;
		padding-right: 12px;
	}
}
@media screen and (min-width:451px) {	
	.rq-button {
		margin-left: 2px!important;
		margin-right: 2px!important;
	}
}	
@media screen and (max-width:450px) {	
	.rq-button {
		/* width: 36px!important; */
		min-width:36px!important;
		font-size: 12px!important;
		margin-top: 2px;
		margin-bottom: 2px;
	}	
	.rq-td {
		width: 40px!important;
		padding: 2px 1px 2px 1px!important;
	}
	.rq-td-pastday{
		width:40px!important;
		padding: 2px 1px 2px 1px!important;
	}
	.rq-table {
		font-size: 12px!important;
	}
	.rq-dayfield {
		width: 40px!important;
	}
}

@media screen and (max-width:500px) {
	.ifsmallhideinline{
		display:none;
	}
	.ifsmallshowinline{
		display: inline;
	}	
}	
@media screen and (min-width:501px) {
	.ifsmallhideinline{
		display:inline;
	}
	.ifsmallshowinline{
		display:none;
	}		
}	

.mytable.ui-table-reflow td {
	border:inherit!important;
}
.longtext{
	padding:15px;
}

.refreshlastupdate{
	text-align: center;
}

.lastupdateinfo {
    /* margin-top: unset; */
	width: unset;
	max-width:95%;
	margin:auto;
	margin-top:15px
}	

.colldatadisclaimer {
	border-radius: 6px !important;
}	

.zeitgruppe {
    border: none;
    padding: 0px;
    margin: 0px;
}

.scrollable{
	top:0px;
	overflow-y:auto;	
	-webkit-overflow-scrolling: touch;	
	display: block; /* !important; */
	/* max-height: calc(100vh - 96px); */
}

/* unter dem Scroll-Bereich ist noch ein OK-Button! */
.maxScreenHeightMinusOneButton{
	/* max-height: calc(100vh - 90px); */
	/* max-height: calc(100% - 50px); */
}

.maxScreenHeight{
	max-height: calc(100vh - 40px);
}

/* No comment about Safari here; doesn't work anyway */
.maxScreenHeightSafari{
	/* max-height: calc(100% - 30px); */
	max-height:calc(95% - 300px); 
	background:yellow!important;
}

.generaldialog{
	padding: 10px;
}


.chartdiv {
    margin-right: auto;
    margin-left: auto;
	border-radius: 6px;
	padding: 10px;
}

.back-to-top {
	right: 10px !important;
	z-index: 850;
	width: 26px!important;
    height: 26px!important;
	padding: 5px!important;
	position: fixed!important;
	top: calc(50% - 20px)!important;
}
.back-to-bot{
	width: 26px!important;
    height: 26px!important;
	padding: 5px!important;
	position: fixed!important;	
	top: calc(50% + 20px)!important;
	right: 10px !important;
	z-index: 850;
}
.back-to-button{
	display: block !important;
    text-align: center;
    padding: 2px;
    margin: 0px;
    margin-top: -2px;
    font-size: 17px!important;
    vertical-align: middle;
}
.cost-trip{
	border-radius: 6px !important;
	padding-top: 6px;
    padding-bottom: 5px;
	text-shadow:none !important;
}
.ct-detail{
	padding: 3px;
}

.ct-people{
	font-size: small;
    padding: 10px 15px 10px 15px;
	line-height: 20px;
}

.ct-waysection{
	font-size: medium;
	font-weight: normal;
}

.ct-datetime {
    padding: 10px;
    font-weight: 600;
    border-top-left-radius: 6px !important;
    border-top-right-radius: 6px !important;
}
.ct-receive{
	padding: 10px;
}	
.ct-pay{
	padding: 10px;
	border-bottom-left-radius: 6px !important;
    border-bottom-right-radius: 6px !important;
}	

#lastupdatechats{
	position:fixed;
	margin-top: 5px;
	margin-left: 5px;
	z-index:800;
	border-radius: 6px !important;
	transform: translateZ(0);	/* Problem in iOS, dass Element mit verschoben wird */
	-webkit-transform: translateZ(0);
	min-width: 200px;
}

/* #panelright{ */
	/* z-index:851; */
/* } */

.onslistWithoutHiddenOverflow{
	overflow:inherit;
}

.pmButt{
	display: inline-block;
	height: 22px;
    width: 32px;
    line-height: 22px;
    padding: 5px;
    padding-bottom: 14px;	
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
}
.leftButt{
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
}
.rightButt{
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
}

.listicon{
	/* padding-right: 10px;  */
	/* width:2em; */
	/* display: table-cell; */
	font-size: 20px;
}

.cardheader{
	padding-right:5px;
	padding-left:5px;
}
.carDetails {
	font-size: 12px;
	word-break: break-word;
}
.usebardriver{
	width: 5px;
    height: 10px;
}
.usebarpassenger{
	display:inline-block;
	vertical-align: middle;
	width: 5px;
    height: 20px;
	margin-left:5px;	
}
.usefracdriver{
	font-size: 12px;
	display: inline-block;
    vertical-align: middle;
    /* position: relative; */
    /* top: -4px; */
}
.usefracpassenger{
	display:block;
	font-size: 12px;
}
.usefrac{
	display: inline-block;
	vertical-align: middle;
}
.ui-btn{
	padding: 10px;
	display: block;
	cursor: pointer;	
}
.ui-btn.ui-btn-fab{
	border-radius: 50% !important;
    height: 32px;
    width: 32px;
    text-align: center;
}
.ui-btn.ui-btn-fab.mini{
	border-radius: 50% !important;
    height: 19px;
    width: 19px;
    text-align: center;
}

.closedialogbutton{
	position: absolute;
	top: 2px;
    right: 2px;
    width: 20px;
	height: 20px;
	padding: 4px;
}
.closedialogbuttonlabel{
	line-height:20px;
}
.copyrightfootertextinmenu{
	/* 6.11.2018, da Lösung mit Tabelle ausgeklammert! */
	/* position: absolute; */
    /* bottom: 10px; */
    text-align: center;
    width: 100%;
	margin-bottom:15px;
}	

#panelleftcontent{
	/* für lange Menüs muss es scrollbar sein!*/
	overflow-y: auto;
	max-height: 100vh;
}

.panelpicturehead{
	padding:17px 10px 13px 10px;
	margin:0px;
	/* height:50px; */
}

.PlanningTable{
	padding: 10px 5px 10px 5px;
}
.vertcentredtd {
    padding-top: 10px;
    padding-bottom: 10px;
}

/* Ersatz für collapsibles von JQuery Mobile */
.mycollaps{
	display:none;
	margin:auto;
	margin-bottom:30px;
}
.mycollapstitle{
	font-weight: 600;
	font-size: 17px;
	cursor:pointer;
	margin-bottom: 20px!important;
	background: white;
    padding: 10px!important;
	border-radius: 6px;
}
.collapseopen{
	font-size: x-large!important;
}
.mycollapstitleleft{
	display: inline-block;
    padding-right: 10px;
}
/* .mycollapsarrow.opened:after{ */
.mycollapsarrow.opened{	
	margin-left: 15px;
	-webkit-transform: rotate(-180deg);
	-moz-transform: rotate(-180deg);
	-ms-transform: rotate(-180deg);
	-o-transform: rotate(-180deg);
	transform: rotate(-180deg);

	-webkit-transition: -webkit-transform 0.4s;
	-moz-transition: -moz-transform 0.4s;
	-ms-transition: -ms-transform 0.4s;
	-o-transition: -o-transform 0.4s;
	transition: transform 0.4s; 
}
.mycollapsarrow{
	display: inline-block;
    float: right;
	/* padding-left: 15px; */
	
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg); 
}

.planningmorebuttcontainer{
	/* width:100%; */
	text-align:center;
	/* height:25px; */
	margin-left: auto!important;
	margin-right: auto!important;
	margin-top: 9px;
	margin-bottom: 5px;
    width: 70px!important;
	display:block;
}

.planningmorebutt {
    cursor: pointer;
    display:none; 
	width: 32px;
    text-align: center;
    margin: auto;
	height: 32px;
    /* margin: 20px auto 20px auto;	 */
	margin: 5px auto 5px auto;
	background: #b2b2b21a;
}



.driverDetails{
	min-width:45px;
    margin-right: 2px;
	cursor:pointer;
	/* margin-left:10px; */
	padding: 4px 4px 4px 10px;
	margin-top: 4px;
	margin-bottom: 4px;
    padding: 4px;
    border-radius: 6px;	
}

.driverusageright{
	padding:0px 0px 0px 10px;
    /* padding-left: 10px; */
}

.driverusageexplaindiv{
	font-size: 10px;
	display:none;
	cursor:pointer;
	word-break: break-word;
	line-height: 1.4em;
}

#selectmylocationsTable th{padding:5px 10px 5px 10px}
#selectmylocationsTable td{padding:15px}

.schedtime{text-align: center;}

.locaselect{
	cursor:pointer;
	padding:3px;
}

/* Der Zeiger in iOS sitzt zu weit rechts und überragt das Fenster! */

#panelright .popover__arrow {
	margin-right: -5px;
}

.meinplus{
	cursor: pointer;
}

.okbutt{
	bottom: 20px;
    right: 20px;
	/* background-color: #F44336!important; */
	color: rgba(255,255,255,0.85);
	cursor: pointer;
}

.meinplusdiv{
	text-align:center;
	margin-top:6px;
	margin-bottom:6px;
	
}
.requesttimelabel{
	font-weight: 600;
}
.loginform{
	margin:0px;
	padding:15px;
}
.logincard{
	padding:0px;
	/* margin:8px; */
}
@media screen and (max-width:400px) {
	.logincard{
		min-height: 100%;
		/* height: 100%; */
		width: 100%;
		margin: 0px;
	}
}
@media screen and (min-width:401px) {
	.logincard{
		border-radius: 8px;
		margin: 8px;
		max-width: 869px;
		/* max-height: 620px; */
		/* margin-top: 20px; */
		/* margin-bottom: 20px; */
	}
	.bluebackcardlogin {
		border-top-left-radius: 8px;
		border-top-right-radius: 8px;
	}
	.cardonbigscreen{
		border-radius: 8px;
		margin: auto;
		margin-top: 15px;
		margin-bottom: 15px;
		max-width: 700px;
		padding:15px;
	}
}	
@media screen and (min-width:886px) {
	.logincard{
		margin-left: auto;
		margin-right: auto;
	}
}
/* .myfixed{ */
	/* position:fixed; */
/* } */

/* oooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo */
/* Potentiell farbabhängig, je nach Geschmack noch ändern */
/* oooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo */

.locaselect{
	border: 1px solid darkgray;
	background: #efefff;
}
.inlineblock{
	display:inline-block;
}
.otheruserwarning{
	font-weight: 700;
	display:inline-block;
    padding: 4px 8px;
    height: 20px;
    line-height: 20px;
    border-radius: 5px;
	cursor: pointer;
}
.zeitfeld{
	/* padding-bottom: 0.7em !important; */
	/* padding-top: 0.7em !important; */
	font-weight: 700 !important;
	text-shadow: none;
	/* border: 0px  !important; */
	min-width: unset;
}
.requestplusdataset{
	padding: 0 0 0 14px!important;
}
.scheduledtrip{
	cursor:pointer;
	/* display:inline-block; */
}


/* oooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo */
/* Farbabhängig, für helles Design, siehe mcp_onsen_light.css, sonst mcp_onsen_dark.css */
/* oooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo */

/* Autocomplete am 01.12.2018 */

.autocomplete {
  /*the container must be positioned relative:*/
  position: relative;
  display: inline-block;
}
/* input { */
  /* border: 1px solid transparent; */
  /* background-color: #f1f1f1; */
  /* padding: 10px; */
  /* font-size: 16px; */
/* } */
/* input[type=text] { */
  /* background-color: #f1f1f1; */
  /* width: 100%; */
/* } */
/* input[type=submit] { */
  /* background-color: DodgerBlue; */
  /* color: #fff; */
/* } */
.autocomplete-items {
  position: absolute;
  border: 1px solid #d4d4d4;
  border-bottom: none;
  border-top: none;
  z-index: 99;
  /*position the autocomplete items to be the same width as the container:*/
  top: 100%;
  left: 0;
  right: 0;
}
.autocomplete-items div {
  padding: 10px;
  cursor: pointer;
  background-color: #fff; 
  border-bottom: 1px solid #d4d4d4; 
}
.autocomplete-items div:hover {
  /*when hovering an item:*/
  background-color: #e9e9e9; 
}
.autocomplete-active {
  /*when navigating through the items using the arrow keys:*/
  background-color: DodgerBlue !important; 
  color: #ffffff; 
}

#tmproutediv{
	height:50px;
	text-align: center;
	vertical-align: middle;
}

.wizleavebutton{
	z-index: 90;
	text-align: center;
	position: fixed;
	bottom: 2px;
	left: 0;
	right: 0;
	cursor: pointer;
}

/* Dots in Carousel */

.dotsbackground{
	width: 100%;
    height: 70px;
    bottom: 0px;
    right: 0px;
    /* background: #d0dae2de; */
    display: block;
    position: fixed;
	z-index: 85;
}

.dots {
	text-align: center;
	font-size: 30px;
	/* position: absolute; */
	position: fixed;
	bottom: 40px;
	left: 0;
	right: 0;
}

.dotnew{
	width: 15px;
    height: 15px;
    display: inline-block;
    border-radius: 50%;
	cursor: pointer;
	margin-left: 4px;
	margin-right: 4px;
}

.dots > span {
	cursor: pointer;
}
/* Platz für dots, wenn die Seite voll ist */
#wizard-carousel{
	/* Das ist jetzt im carouselitem */
	/* margin-top: 25px; */
	/* margin-bottom: 60px; */
	
    /* overflow-x: hidden; */
	
}
.wizard-carousel-father{
	overflow-y: hidden!important;
}

.mycarouselitem{
	/* padding:10px; */
	max-width: 100vw!important;
	overflow-y: auto!important;
	padding-bottom: 70px;
}
/* Google Autocomplete anpassen, damit es nicht verdeckt wird! */
.pac-container{
	z-index: 20000;
}
.toolbar-button{
	cursor: pointer;
}
.fab{
	cursor: pointer!important;
}
/* .legendpopup{ */
	/* padding: 15px; */
/* } */
#legendpopup-dialog-text{
	overflow-y: auto;
	max-height: calc(100vh - 40px);
}	
a{
	cursor: pointer;
    font-weight: 600;
}

.editbutton{
	font-size:22px;
	cursor: pointer;
}
.mycarouseltitle{
	text-align:center;
}
.scheduledinfo{
	padding-left: 10px;
}
.reqlabel{
	cursor: pointer;
	padding-right: 15px;
}
.reqlabelspan{
	pointer-events: none;
	/* background: aquamarine;  */
}
.toolbaricon{
	font-size: 36px!important;
}
.inputnumber1000 .text-input{
	text-align: center!important;
}
.triplabelsign{
	display: inline-block;
	cursor: pointer;
	position: relative;
}
.triplabelsignnumber{
	font-size: 12px;
    color: white;
    position: absolute;
    left: 8px;
    top: 8px;
}
.triplabel{
	border-top: none!important;
	/* 0.1px solid #DADADA; */
}

.triplabeltd{
	padding:4px 18px 12px 15px;
}
.tablefilterbutton{
	cursor: pointer;
	/* position:relative; */
}
.tablefilterbuttonlabel{
	padding-right:8px;
	display: inline-block;
}


.tablefilterbuttonmarked{
	color:#ffb658;
	background-color: #3694e0;
}
.tablefilterdialog{
	max-width:400px;
	margin:auto;
	display: table;
    padding: 12px;
	border-radius: 6px !important;
	margin-bottom: 10px;
}
.tablefiltersymbol{
	/* display: block; */
    /* position: absolute; */
	/* right:1px; */
	/* top:2px; */
	display: inline-block;
}
.totalamountdiv{
	text-align:center;
	padding: 20px;
    max-width: 400px;
    margin: auto;
	margin-bottom:15px;
	border-radius: 6px !important;
}
.totalamountdivhint{
	font-size: small;
	margin-top: 8px;
}	
.multipaycontainer{
	padding: 8px;
	border-radius: 6px !important;
}
	
.pasttriprowheightforce{
	height:46px;
	width:0px;
	display:inline-block;
}
.notscheduledtrip{
	cursor:pointer;
}
.multipay{
	padding-top: 10px;
    padding-bottom: 10px;
}
.paydetails{
	font-size: smaller;
	padding-left: 7px;
}
.payamountinput{
	width:80px;
}
.compactcard{
	display: table;
    margin: auto;
	padding: 12px;
	border-radius: 6px !important;
}
.tablefiltertd{
	display: inline-block;
	vertical-align: middle;
	padding: 1px 5px 1px 5px;
}
.updatedPlanningOnServer{
	font-weight: 600;
	padding:5px;
	border-radius: 6px !important;
	margin-bottom: 5px;
}
.gpsbuttonlabel{
	display: inline-block;
    font-size: small;
    color: #8c8c8c;
	vertical-align: middle;
}	
.onsgpsbutton{
	display: inline-block!important;
	vertical-align: middle;
}
.gpsbutton{
	background: #38C;!important;
	bottom: 112px; /* !important;*/ 
    left: 8px !important;
	color: white;
	margin-left:10px;
}
#gpsbutton{
	cursor: pointer; 	
}

.multipaylabel{
	margin-top:10px;
}
.multipayreceive{
	height: 30px;
    position: absolute;
    width: 50%;
    text-align: center;
    font-size: 9px;
	border-top-left-radius: 12px;
    border-bottom-left-radius: 12px;
}
.multipaypay{
	height: 30px;
    position: absolute;
    width: 50%;
	left:50%;
    text-align: center;
    font-size: 9px;
	border-top-right-radius: 12px;
    border-bottom-right-radius: 12px;
}
.multipayline{
	width: 100%;
    /* height: 2px; */
	height: 0px;
    position: absolute;
    top: 15px;
    background-position-y: center;
    vertical-align: middle;
}	
.chatsendbuttspecial{
	padding: 2px 2px 2px 7px!important;
}
.chatsendbutton{
	margin:auto;
}
.chatsendbuttondiv{
	padding: 6px;
    width: 40px;
    display: table-cell;
    vertical-align: middle;
}
.messagesendbuttondiv{
	text-align: center;
	padding-top: 8px;
    padding-bottom: 8px;
}
.tabsortbutt{
	cursor: pointer;
} 
.currencyalign {
	text-align:right!important;
}
.formhintonbackground{
    /* max-width: 400px; */
    font-size: small;
    /* padding-bottom: 15px; */
	padding:5px 10px 5px 10px;
    color: darkgray;
}	
.fullwidth{
	width: 100%;
}
.lastupdateinfoimportant{
	border-radius: 6px !important;
	max-width: 900px;
    margin-right: auto;
    margin-left: auto;
}
.oli_hint{
	font-size: small;
    margin-top: 4px;
    color: #8c8c8c;
}
.wizlabel{
	display: inline-block;
    margin-left: 15px;
    margin-right: 15px;
}
.messreceiverdiv {
    margin-bottom: 5px;
}
.chatmyanswer{
	padding:8px;
}
.chataddresseeicon{
	margin-bottom: -9px;	
}

.fullheight{
	min-height: 100%;
}
#panelusernamediv{
    text-align: center;
    font-weight: 600;
    padding: 10px 10px 3px 10px;
}
.thwithrowdeletebutton{
	display:unset;
}
.checkbox-loggedin{
	margin-bottom:15px;
	margin-top:15px;
}

#gpsmapdiv{
	width:98%;
	/* 100vw; */
	/*  */
	height:400px;
	/* 100vh; */
	/*  */
	margin:auto;
}
.setting-addbutt{
	margin-top: 0px;
	text-align:center;
}
.editrouteresult{
	text-align:center;
	font-weight: 600;
}	
#routespopuptext{
	max-width: 320px;
	max-height: calc(100vh - 30px);
	overflow-y: auto;
}



.dialog-container {
    min-height: 20px;
}
.dialog {
    min-height: 20px;
}	

.pasttriplabelsign{
	cursor: pointer;
}

.slistinset{
	/* margin-top: 10px; */
	/* margin-bottom: 10px; */
}
.slistinsetspace{
	margin-top: 20px;
	/* margin-bottom: 10px; */
}
.slistattention{
	background: orange;
	width: 10px;
    height: 10px;
    display: inline-block;
    border-radius: 50%;
	/* cursor: pointer; */
	margin-left: 6px;
	margin-right: 3px;	
}
.dateinputfield{
	width:100px;
}
.fb {width: 100%!important;
}/* diese Zeile ist von mir, damit der Icon die volle Breite bekommt! */ 
/*.entry-social .fb a {padding: 7px 10px 7px 26px;background: #3B5999 url('../img/fb14.png') no-repeat 10px center;} */
.entry-social .fb a {
	padding: 11.2px 10px 11.2px 26px;
	background: rgba(50, 75, 129,1) /* url('../img/fb14.png') */ url('../img/fbinv.svg') no-repeat 10px center;
	background-color: rgba(50, 75, 129,1) !important;
	background-size: 29px 29px;
	}
.entry-social .fb a:hover {background-color: rgb(57, 105, 210);
}
.entry-social a {
	text-decoration:none;display: block;padding-left: 20px;
	color: #FFFFFF !important;
	font-weight: bold;
	transition:background-color .3s;    
	}
.entry-social {
	color: rgb(126, 126, 126);
	display: block;
	font-family: 'Open Sans',Tahoma, Verdana, Arial, sans-serif, Faruma, Faseyha;
	font-size: 14px;
	font-weight: normal;
	width: 100%;
	float:left;
	border: solid 0px #aaa;
	text-align: center;
}
.entry-social div {display: block;
	display: inline-block;  
    vertical-align: middle;
} 
.varroutesign{
	font-size: 22px;
    top: 3px;
    position: relative;
} 
.chartdiv{
	max-width: 400px;
    margin-top: 30px;
}
.planningmorebutt{
	text-align: center;
	cursor: pointer;
}
#planningmorebuttup{
	margin-bottom: -10px;
}
.iamreplysendblock{
	margin-top: 25px;
	display: block;
}
.alerttest{
	background: red;
    text-shadow: none;
    color: white;
    padding: 10px;
    font-weight: 600;
    text-align: center;
	display: block;
	border-radius: 4px;
	
}
.adverthint{
	color:darkgray;
	font-size: small;
	border-bottom: darkgray 1px solid;
    margin: 2px;
}
.aboexist{
	background: #e5ffbe;
	color: darkgray;
}	
.iamemoji{
	cursor: pointer;
	margin:5px;
	width:50px;
	display:inline-block;
}
.abo_group{
    margin-top: 10px;
    padding: 10px;
    border-radius: 4px;
	box-shadow: 0 2px 5px 0 rgba(0,0,0,.26);
}
.aboseloption{
    text-align: center;
}
.tripmessagebutton{
	font-size: 22px;
	cursor: pointer;
	margin: auto;
} 
#mytooltipbox{
	z-index: 10000;
	display: block;
	max-width: 120px;
	border-radius: 4px;
	box-shadow: 0 2px 5px 0 rgba(0,0,0,.1);
	padding: 12px 12px 12px 12px;
	font-size: small;
}
.abo_title{
	margin-bottom: 15px;
	text-align: center;
    font-size: 25px;
    font-weight: bold;
    color: #777777;
}
.abo_em{
	color: #ffa41d;
	font-weight: 600;
}
.abo_small{
    font-size: 10px;
    color: #777777;
}

.abo_descrdetail{
	font-weight: 400;
}
.abo_descr{
	display: table-cell;
	vertical-align: middle;
}

@media ( max-width: 350px ) {
	.abo_descr{
		display: block;
		vertical-align: middle;
	}
}
.abo_price3{
	padding: 10px;
    font-size: 25px;
	font-weight:700;
    color: #3388cc;
	vertical-align: middle;
}
.abo_price2{
	padding: 10px;
    /* float: right; */
	display: table-cell;
    font-size: 25px;
    color: #3388cc;
	vertical-align: middle;
}
.abo_obtain_option{
	/* background: whitesmoke; */
	background: #676767;
    color: white;
    text-shadow: none;
    margin: 3px;
    padding: 12px;
    border-radius: 4px;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.26);	
}
.requserwarning{
	box-shadow: 0 2px 5px 0 rgba(0,0,0,.1);
	color: white;
	font-size: 21px;
	transform: translate(-50%, -50%);
    top: 60px; /*50%;*/
    left: 50%;
    max-height: 50px; 
	display:block; 
	background:#ffc672;
	border-radius: 4px;
	opacity:0.95; 
	position:fixed;
	padding:12px;
	text-align:center;
	/* width:270px; */
	z-index: 5000;
	text-shadow:none;
	overflow-y: auto;
}
.abo_benefit{
    font-size: 15px;
	text-align: left;
	margin: 5px 0px 5px 0px;
}
.abo_button{}
.abo_period{
	text-align: center;
}
.abo_message{
	text-align: center;	
	margin: 19px;
	color: #c8e7ff;
    font-weight: 500;
}
.abo_price{
	text-align: center;
    font-size: 36px;
    margin: 15px;
    font-weight: 900;
    color: #02daff;
}
.abo_text{
	text-align: center;	
	color: #777777;
	text-shadow: none;
}
/* URLs in Chats müssen umgebrochen werden, sonst sind u. U. alle Chat-Messages zu breit für 300 px-Schirme! */
.ui-link{
	white-space: normal;
    word-wrap: break-word;
}
.googlemapsicon{
	/* width:26px; */
	/* line-height:16px; */
	height: 22px;
    padding-top: 6px;
	padding-bottom: 6px;
	cursor: pointer;
}
.chatitemdeleteactive{
	display: inline-block;
    vertical-align: middle;
}
.chatdeletebutton{
	margin-left: 5px;
    display: none;
}
.planroute{
	word-break: break-word;
    font-size: 12px;
    font-weight:300;
}	
.plantime{
    font-size: 26px;
	font-weight: 600;
}	
.plantime .plantime12h{
	font-weight:400;
	font-size: 20px; 
}
#chatcancelbutton{
	color:darkgray;
}
.wordwrap{
	word-wrap:break-word;
}
.breaklonglink{
	/* bricht jedes Wort, was unschön ist, wenn es kein langer URL ist, aber sonst notwendig ist! */
	word-break: break-all!important;
}
.longurl{
	/* vw: Breite des Viewports */
	width:80vw;
	padding:10px;
	background:white;
	overflow-x:auto;
}
#invite_users_div{
	display:none;
}

@media ( min-width: 651px ) {
	.planninnertd .passengerdiv{
		font-weight:normal;
		word-wrap: break-word;
		width:calc(100% - 65px);
	}
}
 /* die 650px stimmen mit einer Regel für .mylinebreak überein! */
@media ( max-width: 650px ) {
	.passengerdiv{
		width:100%;
		word-wrap: break-word;
		word-break: break-word;
	}
}
#minuteselect{
	/* width:3em!important; */
	text-align: center;
	display: inline-block!important;
	width: auto!important;
}
.minuteselect{
    width: auto!important;
}
.dropDownExtraHeightDiv{
	height:800px;
	display:none;
}
.selecteddropdown{
	color:#38c;
	font-weight: 600;
}
.multipay:last-child {
	border-bottom:none;
}
.multipay {
	display:block;
	width:100%;
	border-bottom: 1px solid #ddd;
}
.multipay .firstcolumn{
	display: table-cell;
    vertical-align: middle;
}	
.multipay .username{
	display:inline-block;
	width:10em;
	padding:7px;
}

.inputNumberSliderAmount{
	width:60px;
	text-align: left; 
	line-height: 31px;
	display: table-cell;
}
.amountsliderInner{
	display: table;
	width: 100%;
	margin-left: 10px;
	margin-right: 10px;
}
.inputNumberSlider{
	display: table-cell;
	/* width: 100%; */
	min-width: 200px;
}
.slidervalueslider{
	width: 100%;
}
.multipay .amountslider{
	/* background: blanchedalmond; */
    display: table-cell;
    width: 100%;
	/* height: 3em; */
    /* line-height: 3em; */
    vertical-align: middle;
	padding-left: 10px;
	padding-right: 10px;
	
}
@media screen and (max-width:500px) { 
	.multipay .amountslider{
		display:block!important;
		width: unset;
	}
} 
/* 2.1.2017 Original-Studie für Signalstärke, hier GPS */
.ssbox{
	height:16px;
	width:16px;
	position:relative;
	margin:0px;
	padding:0px;
	display:inline-block;
}
.ssbar{
	width:4px;
	margin-right:1px;
	background:#d8d5d5;
	display:inline-block;
}
.ssleft{
	padding-top:5px;
	/* background:red; */
}
.sscenter{
	padding-top:10px;
	/* background:yellow; */
}
.ssright{
	height:100%;
	padding-top:0px;
	/* background:green; */
}
.ss0{
	background:red!important;
}
.ss1{
	background:#ffd65b!important;
}
.ss2{
	background:#a6dc67!important;
}
.hintsoffbutton{
	position: absolute;
	bottom: 2px;
    right: 5px;
    width: 1em;
	text-align: center;	
}
.dropdownwithcaret{
	/* width:100%; */
	font-weight: 400;
}
.moresimplepay{
	display:none;
}
.showmoresimplepay{
	text-align:center;
	width:100%;
	color:#38c;
	cursor: pointer;
}
.saldoserror{
	margin-top:30px;
	padding:8px;	
}
.trackremove{
	text-align:right;
}
.NewDatasetinTable td{
	padding:8px;
}
.withpointer{
	cursor: pointer;
}
.planpassdiv{
	cursor: pointer;
}
.plandriverdiv{
	cursor: pointer;
}

.preformattedpage{
	overflow-x: auto;
}

/* Extra-Platz, um beim Scrollen der Popuppassengers nicht auf den Checkboxen zu tippen */
.extrascrollspace{
	padding-right:60px;
}

.chatsendbuttondiv{
	text-align:center;
}
.chatsendbutton{
	border:none!important;
    color: whitesmoke!important;
    font-size: small;
    padding-left: 8px;
    padding-right: 8px;
    width: 27px;
    padding-bottom: 8px;
    padding-top: 8px;
	margin-bottom: 0px;
}
#SaldosTableGeneral td:nth-child(1) { padding-left: 30px; }
#SaldosTableGeneral td:nth-child(2) { padding-right: 30px; }
.requestplusdataset {
    width: 100%;
    margin-top: 3px;
}
.requestplusdataset tr{
	border-bottom: none!important;
}

.carddayname{
	display:inline-block;
	font-weight:700;
	font-size: larger;
}	
.carddate{
	display:inline-block;
	font-weight:300;
}
.updatedPlanningOnServer{
    background-color: orangered;
    color: whitesmoke;
    padding: 4px;
	display:block;
}
.tripstatus{
	max-width:400px; 
	margin:auto;
	padding:10px;
}
.usermap{
	height:300px;
	width:95%
	max-width:500px; 
	margin:auto;
}
.leaflet-popup-content {
    margin: 8px 10px;
	text-align: center;
    line-height: 1.4;
}
.copyrightfootertextinmenu{
	font-size: 9px;
	padding-top:20px;
	text-align: center;
	color:darkgray;	
}

@media screen and (max-height:450px) {
	.bigscreenonly{
		display:none;
	}
	.fabbutt{
		bottom: 60px;
	}
	.fabfooterauxspace{
	bottom:180px;
	}
}
@media screen and (min-height:450px) {
	.smallscreenonly{
		display:none;
	}
	.fabfooterauxspace{
	bottom:232px;
	}
}
.footerauxspace{
	height:120px;
}
.pageGuideMessage{
	overflow-y:auto;
}

.tdwithrowdeletebutton{
	display:none;
}

.planningButtonInList{
	vertical-align: middle!important;
	display: inline-block;
}

.planningmessagebuttontd{
	display: inline-block;
	vertical-align: middle!important;
}
@media screen and (max-width:350px) {
	.planningmessagebuttontd{
		width:30px;
		vertical-align: middle!important;
	}
}
.messreceiverdiv{
	font-size: small;
}
@media screen and (max-width:550px) {
	.messreceiverdiv{
		max-width: 400px;
		max-height:150px;
		overflow-y:auto;	
	}
}
@media screen and (min-width:550px) {
	.messreceiverdiv{
			max-width: 400px;
			max-height:150px;
			overflow-y:auto;	
	}
}
.selecteddropdown{
	display:none!important;
}
.dropdownoption{
	/* nur zum Überschreiben von inline-block von waves, der die Breite nach rechts auf bis zum Rand setzt! */
	/* display:block!important;	 */
	display:block;
	
	padding-top: 8px;
	padding-bottom: 8px;
	padding-left: 1em;
	padding-right: 1em;
	min-width:40px;
	cursor: pointer;
	text-decoration:none;
	touch-action: none;
}
.dropdownoption:hover{
	background: #d6d6d6;
}

.dropdownparent{
	overflow:unset!important;
	z-index: 8!important;
	cursor: pointer;
}
/* Links inside the dropdown */
.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #f1f1f1}

/* Show the dropdown menu (use JS to add this class to the .dropdown-content container when the user clicks on the dropdown button) */
.show {display:block;}

/* Dropdown button on hover & focus */
.dropdownbutton:hover, .dropdownbutton:focus {
    background-color: #3e8e41;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
    /* position: relative; */
    display: inline-block;
	z-index: 7;
	width: 100%
}
/* Dropdown Content (Hidden by Default) */
.dropdown-content {
    display: none;
    /* position: fixed; */
	position: absolute;
    
    min-width: 30px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 7;
	overflow-y: auto;
	/* muss über dem Footer sein!	*/
	z-index: 1001;
    /* max-height: 800px; */
	/* diese 800px tauchen unten nochmals auf!!! */
}
.dropdownbutton {
    font-size: 16px;
    cursor: pointer;
	font-weight: bold;
}
.licon{
	padding-right: 10px; 
	width:2em;
	display: table-cell;
	font-size: 20px;
} 
.pageguidefixedposition{
	position:fixed!important;
	z-index: 9999;
}
.inputtime{
	width:3.8em;
}
.inputtime12h{
	width:6em;
}
.inputnumber1000{
	width:4em;
}
.centernumber{
	text-align: center!important;
}
.myheader{
	box-shadow: 0 2px 5px 0 rgba(0,0,0,.26)!important;
	/*border-bottom-width: 0px !important;*/
}	
.headertable{
	box-shadow: 0 2px 5px 0 rgba(0,0,0,.26)!important;
	border-bottom-width: 0px !important;
}	
.fabbutt{
    position: fixed !important;
	border-width: 0px !important;
	box-shadow: 0 2px 5px 0 rgba(0,0,0,.26);
	z-index: 850;	
    right: 8px;
	bottom: 112px; /* !important;*/ 
	background-color: #F44336;
	width:56px!important; 
}
.fabspace{
	height:60px;
}

.headerbutton{
	color:white;
	text-shadow: none;
	text-align: left;
	vertical-align: middle;
	margin: 0px 0px;
	padding: 3px 7px 3px 7px;  /* oben, rechts, unten, links */ 
	font-size: 20px !important;
	font-weight: 400;
    background-color: transparent !important;
    border: 0 !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;	
}
.whitebutton{
	color:white !important;
	text-decoration: none; 
	text-shadow: none;
}	
.transparentButton:after {
    background-color: transparent !important;
    border: 0 !important;
    -webkit-box-shadow: none;
    box-shadow: none;
}
.headerfont{
	line-height: 1.3em;
	color:white;
	text-shadow: none;
	text-align: left;
	font-size: 20px !important;
	font-weight: 400;
	letter-spacing: 0.005em;	
}
img.centred {
    display: block;
    margin-left: auto;
    margin-right: auto 
}
/* ================================= */
/* Calendar view für Requests */

.rq-td{
	width:54px;
	padding:2px 3px 2px 3px!important; 
	height:20px;
	font-size: 14px;
	font-weight: normal;
	text-align: center; 
	text-shadow:none;
	vertical-align: top !important;	
}

.rq-td-pastday{
	width:54px;
	padding:2px 3px 2px 3px!important;
	/* background:#FF9D9D;  */
}

.rq-td-12h{
	width:50px !important;
}

.rq-container{
	 /* overflow-x: scroll;  */
	 /* width: 400px; */
}

 @media screen (max-width:400px) { 
	 .rq-container{ 
		 overflow-x: scroll; 
	 } 
 } 



 
.rq-table{

	/* padding:0px; */
	/* border: 1px solid black; */
	/* border-collapse: collapse;	 */
}

.rq-dayfield{
	width:45px;
	margin-left: auto;
	margin-right: auto;
	text-align: center; 
	text-shadow:none; 
	padding-top:7px; 
	padding-bottom:7px; 
	/* font-size:.9em; */
	font-size:14px;
	font-weight: 700; 
	vertical-align: middle;
}

.rq-table th {
	min-width: 45px;
	font-size: 16px;
}
	
.rq-button{
	/* width:50px; */
	min-width:40px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	cursor: pointer; /* damit iOS den click feuert!	 */
	margin-left: auto;
	margin-right: auto;
	text-align: center; 
	text-shadow:none; 
	padding:2px; 

	font-size:16px;
	padding-top: 12px;
    padding-bottom: 12px;
	margin-top: 5px;
    margin-bottom: 5px;
}




.rq-plusbutton{
	font-size: 25px;
    padding-top: 6px;
    padding-bottom: 6px;
}
.rqmonthname{
	text-shadow:none; 
	padding:7px; 
	font-size:21px;
	font-weight: 700;
	margin-top: 20px;
    margin-bottom: 12px;
}

.bubbleundperson{
	background-color: blue; 
	display:block; 
	background:transparent;
	opacity:1; 
	position:fixed;
	padding:7px;
	text-align:center;
	width:270px;
	z-index: 9999;
	text-shadow:none;
}
.bubble{
    width: 176px;
	height: 154px;
	line-height: 154px;
	top: 5px;
	position: absolute;
    right: 0px;
	display: block; 
	z-index: 9999;
}
.bubbletext{
	line-height: normal;
	display: inline-block;
	vertical-align: middle;
	margin: auto;
	padding:7px;
	text-align:center;
	z-index: 9999;
	text-shadow:none;
	font-size: 13px;
}
.planncoll{
	/* bottom ist 5px, damit die Tabelle unten "abgerundete Ecken" haben kann! */
	padding:0px 0px 5px 0px;
}
.plannlefttd{
	padding-left: 16px;
}
.planninnertd{
	/* oben, rechts, unten, optional links, sonst wie rechts */
	padding:2px 8px 2px;
}



.vertcentredtd {
	vertical-align:middle;
}	
@media (max-width: 380px) {
	.planninnertd{
		/* oben, rechts, unten, optional links, sonst wie rechts */
		padding:2px 2px 2px;
		/* vertical-align:top; */
	}
	.plannlefttd{
		padding-left: 6px;
	}	
}
/* Snackbar */
.paper-snackbar {
	position: fixed;
	transition-property: opacity, bottom, left, right, width, margin, border-radius;
	transition-duration: 0.5s;
	text-shadow:none;
	transition-timing-function: ease;
	font-family: "RobotoDraft","Roboto","Helvetica Neue",sans-serif;
	font-size: 14px;
	min-height: 14px;
	background-color: #323232;
	display: flex;
	justify-content: space-between;
	align-items: center;
	color: white;
	line-height: 22px;
	padding: 18px 24px;
	bottom: 0px;
	opacity: 0;
	z-index: 1002;
	max-height: 200px;
	overflow: auto;
	border-radius: 4px!important;	
}
@media (min-width: 640px) {
  .paper-snackbar {
    min-width: 288px;
    max-width: 568px;
    display: inline-flex;
    border-radius: 2px;
    margin: 24px;
    bottom: -100px;
  }
}
@media (max-width: 640px) {
  .paper-snackbar {
    left: 0px;
    right: 0px;
  }
}
.paper-snackbar .action {
  background: inherit;
  display: inline-block;
  border: none;
  font-size: inherit;
  text-transform: uppercase;
  color: #ffeb3b;
  margin: 0px 0px 0px 24px;
  padding: 0px;
  /* MOSTRAR muss reinpassen*/
  min-width: 7em;
}
.chatuser{
	color: #E076C4;
	font-weight:bold;
	display: inline-block;
    max-width: 120px;
}
.chatsenttime{
	font-size: small;
	float:right;
	max-width: 180px;
	text-align: right;
	display: inline-block;
}
.chatdetails{
	font-size: small;
}
.chatmessage{
	display:block;
	padding-top: 5px;
    padding-bottom: 5px;
    vertical-align: top;
}
.chat100{
	display:block;
	width: 100%;
}
.chat90{
	display:table-cell;
	vertical-align: top;
	width: 95%; 
}
.chatshowmore{
	display:table-cell;
	width:40px;
	cursor: pointer;
}
.chatclearfloat{
	clear:both;
}
.chatreplybuttons{
	display: inline-block;
    text-align: right;
    width: 10%;
}
.chatreply{
	cursor: pointer;
}
.chataddresseeicon{
	width:10%;
	color: gray;
	/* display:inline-block; */
	display: table-cell;
	/* margin-right:20px; */
	vertical-align: middle;
	cursor:pointer;
}
.chataddressees{
	vertical-align: middle;
	/* display:inline-block; */
	display: table-cell;
	font-size: small;
    color: gray;
	padding-right:15px;
	padding-left:15px;
}
@media screen (min-width:340px) { 
	.chatitem{
		min-width: 250px;
		width: 90% !important;
	} 
} 
.chatitem{
	margin-top: 6px;
	text-shadow:none;
	padding: 12px;
	-moz-border-radius: 6px !important;	;
	-webkit-border-radius: 6px !important;	
	border-radius: 6px !important;	
	box-shadow: 0 2px 5px 0 rgba(0,0,0,.26);
}
.newchatitem{
	font-weight:bold;
	text-shadow:none;
	padding: 12px;
	-moz-border-radius: 6px !important;	;
	-webkit-border-radius: 6px !important;	
	border-radius: 6px !important;	
	box-shadow: 0 4px 8px 0 rgba(0,0,0,.26);
}
.chatleft{
	position: relative;
	margin-left:10px;
}
.chatright {
	margin-right:10px!important;
}

.chatfromother{
	display:block;
	left:0px;
	width: fit-content;
	max-width:90%;
}	
.chatfromme{
	display:block;
	right:0px;
	width: fit-content;
	max-width:90%;
}
.chatmychatmessage{
	/* margin-right: 0px !important; */
    margin-left: auto !important;
	color:#f1f1f1;
	position: relative;
}
.chatcontainer{
	max-width:40em; /*600px;*/	
	display:block;
	position:relative;
}	

.requestplusdataset{
	border-collapse: collapse;
	padding: 10px !important;	
	-moz-border-radius: 6px !important;	;
	-webkit-border-radius: 6px !important;	
	border-radius: 6px !important;	
}
/* Überschreibe die Höhe der Fußzeile mit important, da sie sonst in Android zu hoch ist */ 
#pageGuideMessage{
	height:100px !important;
}	
*{
    -webkit-tap-highlight-color: rgba(0,0,0,0); /* make transparent link selection, adjust last value opacity 0 to 1.0 */
}
/* Tabellenüberschriften vertikal zentrieren */
th{
	vertical-align: middle !important;
}	
.badge1 {
   position:relative;
}
.badge1[data-badge]:after {
   content:attr(data-badge);
   position:absolute;
   top:0px;
   right:-13px;
   font-size:.9em;
   font-weight: 700;
   background:#FF9800; /*#C8C8FF; #DF0101;*/
   color:white;
   width:12px;
   height:12px;
   text-align:center;
   line-height:12px;
   border-radius:50%;
   /*box-shadow:0 0 1px #333;*/
}
body {
    -webkit-touch-callout: none;                /* prevent callout to copy image, etc when tap to hold */
    -webkit-text-size-adjust: none;             /* prevent webkit from resizing text to fit */
    -webkit-user-select: none;                  /* prevent copy paste, to allow, change 'none' to 'text' */
    font-family:'HelveticaNeue-Light', 'HelveticaNeue', Helvetica, Arial, sans-serif;
    height:100%;
    width:100%;
	text-shadow: none !important;	
}
body, input, select, textarea, button, .ui-btn,h1,h2,h3,h4,h5,h6 {
	font-weight: 400;
}
a:link  {
text-decoration: none; 
text-underline: none;	
}	
h1 {
    font-size:24px;
    font-weight:normal;
    margin:0px;
    overflow:visible;
    padding:0px;
    text-align:center;
}
.centertablewithpagecontent{
	margin-left:  auto !important;	
    margin-right: auto !important;		
}
.noborder{
	border: none!important;
	box-shadow: none!important;
}
.myspinner{
	color:#38c !important;
	background-color: transparent !important;
	/* für einen schwarzen Hintergrund alle Schatten u.a. unterdrücken */
	text-shadow:none !important;
	box-shadow: none;
}	
/* -------------------------- irresponsivetable ------------------------- */

.irresponsivetable {
    /* box-shadow: 0 2px 5px 0 rgba(0,0,0,.1); */
	/* damit man farbigen Hintergrund der TH haben kann, ohne dass die Ecken überstehen, folgende zwei Zeilen */
	overflow: hidden;
	text-shadow: none;	
	/* horizontal zentrieren mit dem folgenden */
	margin-left:  auto !important;	
    margin-right: auto !important;		
	/* Umschalten mit Option 1/2 zwischen zwei Problemen: entweder runde Ecken der Tabelle oder Zeilen tr mit horizontalen Strichen */
	border-collapse: inherit !important;    /* Option 1, wenn aktiv, dann ist border-bottom nutzlos!*/
	/* -moz-border-radius: 6px !important;	; */
	/* -webkit-border-radius: 6px !important;	 */
	/* border-radius: 6px !important;	 */
	border-spacing: 0; 
	min-width: 260px;
	/* border: 1px solid #D6D6D6; */
}	
.irresponsivetable tr {
	padding:2px;
	border-bottom: 1px solid #ddd !important;	
	border-collapse: collapse;
}
.irresponsivetable th {
    height: 40px;
	background-color: inherit; /*#38c !important;*/
}

/* 4.8.2016: keine gestreiften Tabellen und Tabellen mit Linien; sonst weiß man nicht, warum manche Zeilen dunkel sind */
.irresponsivetable td {
	background-color: transparent !important; /* überschreibt table-stripe! */
	border: #e4e4e4;
    border-bottom-style: solid;
    border-bottom-width: thin;
	padding: 5px 9px 5px 9px;
	/* !important;	 */
	text-shadow:none !important;
	vertical-align: middle;
}
.irresponsivetable tr:last-child td {
    border-bottom: none;
}
/* ---------------------- .mytable ----------------------------- */
.mytable {
	/* damit man farbigen Hintergrund der TH haben kann, ohne dass die Ecken überstehen, folgende zwei Zeilen */
	/*display: inline-block;*/
	overflow: hidden;
	text-shadow: none;	
	/* horizontal zentrieren mit dem folgenden */
	margin-left:  auto !important;	
    margin-right: auto !important;		
	/*padding: 5px;*/
	/* Umschalten mit Option 1/2 zwischen zwei Problemen: entweder runde Ecken der Tabelle oder Zeilen tr mit horizontalen Strichen */
	border-collapse: inherit !important;    /* Option 1, wenn aktiv, dann ist border-bottom nutzlos!*/
	border-spacing: 0; 
	min-width: 260px;
}	
.mytable th {
    height: 40px;
	background-color: inherit; 
}
.mytable td {
    border-bottom-style: solid;
    border-bottom-width: thin;
    border-bottom-style: solid;
    border-bottom-width: thin;
	border-bottom-color: #e4e4e4!important;
	padding: 5px 9px 5px 9px;
	text-shadow:none !important;
	vertical-align: middle;
}	
.mytable tr:last-child td {
    border-bottom: none;
}
.mytable tr {
	padding:2px;
	border-collapse: collapse;
}
.thwithrowdeletebutton{
	display:none;
}	
.rowdeletebutton{
	color: rgba(255,255,255,0.85)!important;
	font-weight:bold;
	background-color:rgb(255, 77, 77) !important;
}	
.numberboxcss{
	text-align:right
}
.tr-valignmiddle td{
	vertical-align: middle;
}	
@media (max-width: 559px) {
	.numberboxcss{
		display:inline!important;
	}	
	.showifwideenough{
		display: none !important; 
	}
	.mytable.ui-table-reflow tr:first-child td {
		border-top: none;
	}
	/* nur die td in mytable UND reflow, nicht für normale Tabellen in schmalen Seiten! */
	.mytable.ui-table-reflow tr td:first-child {	
		border: #e4e4e4;
		border-top-style: solid;
		border-top-width: thin;
	}
	.mytable.ui-table-reflow td {
	border: none;
	}
	.tdeditbutton{
		text-align: left !important;		
	}
}
.PlanningTable tr:first-child{
   border-top: none;
}
.PlanningTable td:forcenoborder{
	border: 1px solid transparent; /* none geht nicht, es muss transparent sein! */
}
.PlanningTable {
	border-collapse: collapse;
}
.ValueNegative {
	color:#D87A7D;
	font-weight:700;
}
.ValuePositive {
	color:#38C;
	font-weight:700;
}
.ValueZero {
	color:#9d9d9d;
	font-weight:700;
}

.lastupdateinfo {
	font-size:12px;
	text-shadow:none !important;
	padding:6px !important;
	/* margin-top: -1em;    */
	/* damit die Seite nicht so weit nach unten rutscht! */
}	
.lastupdateinfofixedpos {
	position: fixed !important;
	top: 70px !important; */
	/*bottom: 112px !important; */
	left: 30px !important;;
	z-index: 799;
	/*background-color: white;*/
	/*background-color: inherit;*/
}
.newpassenger{
	font-weight:bold;
}
.passengerpopup{
	max-height: calc(100vh - 60px);
}
.panelimage{
	margin:0px 0px !important;
	background-color: #38c !important;
	box-shadow: 0 2px 5px 0 rgba(0,0,0,.26);
}	
.zeitfeld{
	padding-bottom: 0.7em !important;
	padding-top: 0.7em !important;
	font-weight: 700 !important;
	text-shadow: none;
	border: 0px  !important;
	min-width: 4em;
}	

.ongoingtriptrclass{
	background-color:#ffeac5;
}
	/* kein Blink wegen Barrierefreiheit, epilleptischer Anfälle und mangelnder Browserunterstützung!
	text-decoration: blink !important;*/
.ongoingtimestringclass{
	color:#cc0000;
}
.goodfit{
	color: #8bc34a;
	font-weight: bold;
}
.badfit{
	color: indianred;
	font-weight: bold;
}
.contactmessage{
	padding: 1px 10px 1px 10px;
	font-style: italic;
}
.newcontactbuttonsDiv{
	margin-top: 10px;
}
.newcontactbutton{
	cursor:pointer;
}	
.newcandidatesintro{
	padding:10px;
}
.candidatecard{
	box-shadow: 0 2px 5px 0 rgba(0,0,0,.1);
}
.candidatetitle{
	/* background:blanchedalmond; */
	font-weight: bold;
	font-size: larger;
	margin-top: 15px; 
	margin-bottom: 12px; 
	/* padding:5px; */
}
.requestnewuser{
	border: 1px solid #D6D6D6;
	-moz-border-radius: 6px !important;	;
	-webkit-border-radius: 6px !important;	
	border-radius: 6px !important;	
	border-spacing: 0; 
	padding: 12px;
	margin: 5px;
}
.mytable thead {
    /* background: #676767; */
    /* color: white; */
	font-weight:700;
}
/* nur für Planning:  */
.mycardheader .ui-collapsible-heading-toggle{
    background: #676767!important;
    color: white!important;
	font-weight:700;
}
.requestcard {
    width: 90%;
    margin: 20px;
}



.planningcard{
	margin-top: 20px;
} 
.meinplus{
	/* padding:0px; */
} 
/* Portrait layout (default) */
.app {
    background:url(../img/logo.png) no-repeat center top; /* 170px x 200px */
    position:absolute;             /* position in the center of the screen */
    left:50%;
    top:50%;
    height:50px;                   /* text area height */
    width:225px;                   /* text area width */
    text-align:center;
    padding:180px 0px 0px 0px;     /* image height is 200px (bottom 20px are overlapped with text) */
    margin:-115px 0px 0px -112px;  /* offset vertical: half of image height and text area height */
                                   /* offset horizontal: half of text area width */
}
@media screen and (min-width:380px) {
	.requestcard {
		width: 100%!important;
	}
}
@media screen and (min-aspect-ratio: 1/1) and (min-width:400px) {
    .app {
        background-position:left center;
        padding:75px 0px 75px 170px;  /* padding-top + padding-bottom + text area = image height */
        margin:-90px 0px 0px -198px;  /* offset vertical: half of image height */
                                      /* offset horizontal: half of image width and text area width */
    }
}
.MessageReceiver{
	display: inline-block;
	padding:8px;
	-moz-border-radius: 5px;
	border-radius: 8px;
	cursor: pointer; /* damit iOS den click feuert!	 */
	margin-top:3px;
	margin-bottom:3px;
}	
#messreceiverlist{
	line-height: 190%;
	margin: 0px 8px 8px 8px;
}
#minuteselect-button{
	width:30px!important;
}
#messageDialogOnPage{
	padding: 15px;
}

.clickInfoMessage{
	background:#d9ffac!important;
}	
.MyPopupMenuUL{
	margin:0px !important;
}	
.mytimepicker{
}	
.mytimepickerextrawide{
	width:7em !important;   /* im 12-Stunden-Zeitformat, sonst schmaler */
}
.closedialogbutton{
	position: absolute;
	top: 2px;
    right: 5px;
    width: 1em;
	text-align: center;
	cursor: pointer;
    text-decoration: none;
    text-shadow: none;
}
.closedialogbutton:hover {
 	color: red;
}
.okbutton{
	background: #eeffee!important;
	
}
.rejectbutton{
	background: #ffedeb!important;
	
}
.whitespacebottom{
	height:50px;
}
.popupokbuttondiv{
	height:36px;
	bottom:0px;
	left:0px;
	width:100%;
	display: block !important; 
	text-align: center;
	color:#38c;
	cursor: pointer;
}
.popupscrolllist{
	top:0px;
	overflow-y:auto;	
	-webkit-overflow-scrolling: touch;	
	display: block !important; 
	max-height: calc(100vh - 96px); /* 96 = 36 für popupokbuttondiv + 60 für passengerpopup; */
}	
/* Keine erzwungenen Zeilenumbrüche in Planning für sehr breite und (!!!) sehr schmale Geräte */
@media ( max-width: 500px ) {
	.mylinebreak{
		/* display: none; */
	}	
}	
@media ( min-width: 650px ) {
	.mylinebreak{
		display: none;
	}
}	
@media ( min-width: 700px ) {
	.planroute{
		font-size: 16px;
	}		
}
.currencyalignalwaysright {
	text-align:right !important;
}
.candidatetextarea{
	min-height: 10em;
	width: 100%;
}
.menuitemlabel{
	display: table-cell;
	font-weight: 500;
	text-align: left;
    white-space: normal;
	color: initial; 
}
.menuitem{
	display: block;
    padding: 12px;
    /* color: red; */
	cursor: pointer;
    /* font-style: normal; */
}
.colldatadisclaimer{
	text-shadow: none;
	padding: 12px;
}
@media (min-width: 660px) {
	.showifwideenough{
		display: table-cell !important;
	}
}
/* Planning */
.MyPopupMenuText {
	vertical-align: middle;
	display: inline-block;
	line-height: normal;
	word-break: break-word;	
 }
.MyPopupMenuSelect {
}
.visiblepopup{
	padding:5px !important;
	min-width: 120px;
}	
.MyIconButton {
	padding:1px !important;
}
/* .copyrightfootertext{ */
	/* text-align: center; */
	/* font-weight:normal; */
	/* text-shadow: none; */
	/* color:#FFFFFF; */
	/* font-size:11px; */
	/* vertical-align:middle; */
/* }	 */

.legalfootertext a{
	text-align: right;
	font-weight:normal;
	text-shadow: none;
	color:#FFFFFF !important; 
	font-size:11px;
	vertical-align:middle;
}	
.mybox {
  display: inline-block;
  padding: 0px;
  margin: 1px;
  vertical-align: middle;
}
/* Dialog-Fenster von Mobiscroll */
.mbsc-ios .dwwr {
	border-radius: 4px;
}
/* Dialog-Fenster von Mobiscroll für Material Design !!!*/
.page--material .mbsc-ios .dwwr {
	border-radius: 2px;
}

.hintcontainer{
	margin-top:10px;
	margin-bottom:10px;
}
.hinttext{
	display: table-cell;
	
}
.hintok{
	text-align:center;
	display: table-cell;
	width:32px;
	vertical-align:middle;
	cursor:pointer;	
}
.hintokbutton{
	background: #b2b2b273;
	border-radius: 50%;
	height: 32px;
	width:32px;
	vertical-align:middle;
	line-height: 32px;
}
.hintokbutton .zmdi{
	line-height: 32px;
}

.errordivwithpadding{
	padding:5px !important;
	border-radius: 6px !important;
}
/* #requestmorebuttdown{ */
	/* margin-top: 18px; */
	/* margin-bottom: 20px; */
/* } */
.planningfuturebutt{
	margin-top: 2px!important;
}
.planningpastbutt{
	margin-bottom: 2px!important;
}
#PastTripsTable{
	margin-top:18px;
}

.sr-group-info{
	margin-top: 2px;
	margin-bottom: 5px;
	margin-left: 5px;
}
.sr-group-title{
	margin-top: 5px;
	margin-bottom: 5px;
	margin-left: 5px;
	font-size: larger;
}
.sr-group{
	margin-top: 15px;
}
.sr-hit{
    padding: 10px;
	margin: 5px;
    border-radius: 5px;	
}
.sr-contactbutton{
}
.sr-time{
	font-weight: 600;
}
.sr-datetime{
	display: inline-block;
    width: 50%;
    text-align: left;
    /* font-weight: 600; */
}	
.sr-timediff{
	display: inline-block;
    width: 50%;
    text-align: right;
    font-weight: 500;
}
.sr-placediff{
	display: block;
    width: 100%;
    text-align: left;
    font-size: smaller;
    margin-top: 8px;
}