/* Templates für die Tramino GUI */

#TraminoSpinner { display: none }
#TraminoSpinner.active { display: block }

#TraminoSpinner.active:before {
	z-index: 100000;
	position: absolute;
	top: 0px; right: 0px; bottom: 0px; left: 0px;
	background-color: #000A;
	content: "";
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
}	

@keyframes TraminoOverlaySpinner {
  to {transform: rotate(360deg);}
}
 
#TraminoSpinner.active:after {
  content: '';
  box-sizing: border-box;
  position: absolute;
  z-index: 10000000;
  top: 50%;
  left: 50%;
  width: 30px;
  height: 30px;
  margin-top: -15px;
  margin-left: -15px;
  border-radius: 50%;
  border: 1px solid #ccc;
  border-top-color: #07d;
  animation: TraminoOverlaySpinner .6s linear infinite;
}


#TraminoSpinner.active .content {
	z-index: 100001;
	position: absolute;
	top: 55%; left: 50%;
	transform: translate(-50%, -50%);
	color: #fff;
}



/* --- */



#TraminoHeader {
	position: fixed;
	width: 100%;
	min-width: 1260px;
	height: 65px;
	background: #ddd;
	font-family: Arial, sans-serif;
	font-weight: normal;
	margin: 0px;
	z-index: 15090;
}

@media all and ( max-height: 700px ) {
	#TraminoHeader { position: relative !important; }
	#TraminoContent { padding-top: 20px !important; }
}

@media all and ( max-width: 1260px ) {
	#TraminoHeader { position: relative !important; }
	#TraminoContent { padding-top: 20px !important; }
}

	#TraminoHeader #top {
		padding-top: 40px;
	}


#TraminoSearch  {
	position: absolute;
	top: 7px;
	right: 380px;
	margin: 0px;
	color: #ddd;
	max-width: 100px;
}

#TraminoSearch input { width: 70px; }

body.hideTraminoButtons #TraminoHeaderTiny, body.hideTraminoButtons .inlineeditors { display: none; }








.TraminoHelpButton  {
	position: absolute;
	top: 7px;
	right: 10px;
	background-color: #e90;
	border-radius: 10px;
	padding: 3px 6px;
	font-size: 11px;
	font-weight: bold;
	color: #fff;
	cursor: pointer;
	text-decoration: none;
}

.TraminoHelpButton:hover {
	background-color: #C80;
}








#TrHelp {
	display: none;
	position: fixed;
	top: 0px;
	right: 0px; 
	bottom: 0px; 
	width: 100%;
	z-index: 1000000;
	background-color: rgba(0,0,0,0.5);
}

#TrHelp.on {
	display: block;
}

#TrHelp .close {
	position: fixed;
	right: 10px;
	top: 8px;
	background-color: #000;
	color: #fff;
	font-size: 19px;
	line-height: 19px;
	font-weight: 100;
	border-radius: 50px;
	padding: 0px 4px 0px 4px;
	text-align: center;
	z-index: 2000002;
	cursor: pointer;
}

#TrHelp .close:hover { background-color: #000; }

#TrHelp .area {
	position: fixed;
	top: 0px;
	right: -550px; 
	bottom: 0px; 
	width: 550px;
	background-color: #fff;
	z-index: 1000000;
	transition: all 500ms ease-in;
	overflow: scroll;
}

#TrHelp.on .area {
	display: block;
	right: 0px;
	transition: all 500ms ease-in;
}

#TrHelp .content {
	padding: 20px;
	font-size: 13px;
	line-height: 16px;
	color: #666;
}

#TrHelp .content ul { margin: 10px 0px 15px 0px;  }
#TrHelp .content ul li { margin-bottom: 5px;  }
#TrHelp .content ol { margin: 10px 0px 15px 0px;  }
#TrHelp .content ol li { margin-bottom: 5px;  }

#TrHelp .content img { max-width: 100%; margin: 0 auto; border: 1px solid #ccc; margin-bottom: 10px; display: block; }
#TrHelp .content em { color: #444;  }
#TrHelp .content code { color: #444; border: 1px solid #ccc; padding: 0px 4px; border-radius: 3px; }
#TrHelp .content a { color: #C80; text-decoration: none; }













#TraminoUserMenu  {
	display: inline-block;
	position: absolute;
	top: 8px;
	right: 40px;
	margin: 0px;
	color: #ddd;
	padding: 3px 10px;
	max-width: 120px;
}
	#TraminoUserMenu a {
		display: block;
		color:#666;
		text-decoration:none;
		font-size:12px;
		line-height:12px;
	}

	#TraminoUserMenu:hover a {
		color:#666 !important;
	}

	#TraminoUserMenu .submenu  {
		display: none;
		position: absolute;
		top: 18px;
		right: 0px;
		background-color: #fff;
		padding: 8px 0px;
		-webkit-box-shadow: 1px 2px 3px #bbb;
		-moz-box-shadow: 1px 2px 3px #bbb;
		box-shadow: 1px 2px 3px #bbb;
	}
	
	#TraminoUserMenu .submenu a {
		padding: 3px 8px;
		white-space: nowrap;
		text-align: right;
	}
	
	#TraminoUserMenu .submenu a:hover {
		background-color: #ccc;
	}

	#TraminoUserMenu:hover {
		background-color: #fff;
	}
	
	#TraminoUserMenu:hover .submenu {
		display: block;
	}

#TraminoClusterMenu{
	position: absolute;
	top: 7px;
	right: 170px;
	margin: 0px;
	width: 200px;
}
	#TraminoClusterMenu select {
		width:195px;
	}



#TraminoHeaderHelp {
	font-size: 13px;
	line-height: 16px;
	color: #333;
	padding:0 0 15px 100px;
}
	#TraminoHeaderHelp a {
		color: #000;
	}



#TraminoMenu {
	font-size: 13px;
	overflow: hidden;
	height: 25px;
}
	#TraminoMenu .menu {
		padding: 0 25px 0 100px;
		z-index: 50;
		overflow: hidden;
	}
	#TraminoMenu A {
		display: block;
		float: left;
		color: #666;
		font-weight: normal;
		padding: 5px 11px 5px 11px;
		text-decoration: none;
	}
	#TraminoMenuDropdown a {
		display: block;
		color: #999;
		font-weight: normal;
		padding: 5px 11px 5px 11px;
		text-decoration: none;
	}
	#TraminoMenuDropdown a.right {
		float: none;
	}
	#TraminoMenuDropdown a:hover {
		background-color: #666;
		color: #fff;
	}

	#TraminoMenu A.spacebefore {
		margin-left: 15px;
	}
	
	#TraminoMenu A.spaceafter {
		margin-right: 15px;
	}
	
	
	#TraminoMenu .menu A {
		color: #fff;
		border-right: 1px solid #ddd;
		background:#888;
	}
	#TraminoMenu .menu A.aktiv {
		color: #111;
		background-color: #fff;
		border-right: 1px solid #fff;
	}
	#TraminoMenu .menu A.aktiv2 {
		background-color: #ddd;
		color:#444;
	}
	#TraminoMenu .menu A.aktiv2.second {
		margin-left: 0px;
		padding-left: 0px;
	}
	
	#TraminoMenu .menu A span.info{
		color:#fff;
		background:#393;
		border-radius: 8px;
		-webkit-border-radius: 8px;
		-moz-border-radius: 8px;
		padding:1px 4px;
		font-size:11px;
		border:1px solid #fff;
	}
	#TraminoMenu A.abstand {
		margin-left: 20px;
	}
	
	

	#TraminoMenu .menu A.aktiv2:hover {
		background-color: #ddd;
		color:#000;
	}
	#TraminoMenu A:hover { background-color: #555; color: #fff; }
	#TraminoMenu A.aktiv:hover { background-color: #fff; color: #333; }
	
	#TraminoMenu A.right {
		float: right;
		margin-top: 5px;
		background-color: #999;
		font-size: 11px;
		padding: 4px 12px 4px 12px;
		color: #fff;
	}
	#TraminoMenu A.right:hover {
		background-color: #363;
		color: #cfc;
	}
	#TraminoMenu ul.mainmenu {
		z-index: 100;
		position:absolute;
		left: 100px;
		top: 8px;
		margin:0;
		padding:0;
	}

	#TraminoMenu ul.mainmenu li {
		display: block;
		position: relative;
		float:left;
	}
	
	
	#TraminoMenu ul li.seperator {
		margin-top: 5px;
		padding: 5px 5px 3px 10px;
		font-size: 10px;
		border-top: 1px solid #ddd;
		color: #aaa;
		cursor: default;
	}
	
	#TraminoMenu ul li.seperator:first-child {
	}




	#TraminoMenu ul.mainmenu li a.icon {
		display: block;
		padding: 4px 8px 4px 9px;
		color: #222;
		font-size: 14px;
		text-align:center;
		margin-right: -4px;
	}

	#TraminoMenu ul.mainmenu li.disabled a {
		color: #aaa;
	}

	


	#TraminoMenu ul.mainmenu li:hover {
		background-color: #fff;
	}
	#TraminoMenu ul.mainmenu li a.icon:hover {
		background-color: #fff;
	}

	#TraminoMenu ul.mainmenu li.disabled:hover {
		background-color: inherit !important;
	}
	#TraminoMenu ul.mainmenu li.disabled a.icon:hover {
		background-color: inherit !important;
	}
	
	
		#TraminoMenu ul.mainmenu div.submenu {
			z-index: 90;
			position: absolute; 
			top: 23px; 
			left: 0px;
			display: none;
			min-width: 120px;
		}

		#TraminoMenu ul.mainmenu li a.icon.aktiv {
			font-weight: bold;
		}

		#TraminoMenu ul.mainmenu li:hover .icon  { 
			position: relative;
			z-index: 90001;
			background-color: #fff !important;
		}

		#TraminoMenu ul.mainmenu li:hover div { 
			display: block;
			z-index: 90000;
		}
		
		
		#TraminoMenu ul.mainmenu ul {
			margin: 0px;
			background-color: #fff;
			color: #444;
			font-size: 12px;
			padding: 8px 0px;
			box-shadow: 1px 3px 15px rgba(0,0,0,0.3);
		}
		
		#TraminoMenu ul.mainmenu ul li { 
			float: none;
		}

		#TraminoMenu ul.mainmenu ul li a {
			display: block;
			float: none;
			
			padding: 2px 10px 2px 10px;
		}

		#TraminoMenu ul.mainmenu ul li.first a {
			border-top: 0px;
		}
		
		

#TraminoContent {
	min-width: 900px;
	min-height: 300px;
	padding: 15px 25px;
	padding-top: 110px;
}

.TraminoContent a {
	color: #393; text-decoration: none;
}


	@media print {
		#TraminoContent {
			padding: 0;
			min-height: auto;
		}
	}


#TraminoHeaderInfo {
	position: absolute;
	background-color: #777;
	left: 0px;
	top: 200px;
	color: #ddd;
	font-size: 10px;
	overflow: hidden;
	width: 3px;
	padding: 3px;
}
	#TraminoHeaderInfo:hover {
		background-color: #777;
		z-index: 15099;
		width: 450px;
		overflow: scroll;
		padding: 3px 3px 3px 13px;
	}



#TraminoContent a.button {
	background-color: #777;
	color: #fff;
	text-decoration: none;
	padding: 2px 8px;
	line-height: 125%;
}

#TraminoContent a:hover.button {
	background-color: #333;
	color: #fff;
}



.yui-tabview {
	background-color: #f00;
}



.TraminoAlphabet {
	margin-top: 1em;
	padding-left: 20px;
	padding-top: 0.3em;
	overflow: hidden;
}
.TraminoAlphabet a {
	vertical-align: baseline;
	margin-right: 1px;
	font-weight: bold;
	font-size: 10px;
	line-height: 15px !important;
	text-align: center;
	padding: 0.2em 0.42em 2em 0.42em;
	color: #333;
	background-color: #ddd;
	text-decoration: none;
}


.TraminoAlphabet a:hover {
	background-color: #fff;
	color: #000;
}
.TraminoAlphabet a.aktiv {
	background-color: rgb(255, 102, 0);
	color: #fff;
}
.TraminoAlphabet a.off {
	background-color: #ddd;
	color: #999;
}
.TraminoAlphabet a.off:hover {
	background-color: #ccc;
	color: #999;
}
.TraminoAlphabet .AlphaSize1 { font-size: 12px; line-height: 12px !important; }
.TraminoAlphabet .AlphaSize2 { font-size: 14px; line-height: 14px !important; }
.TraminoAlphabet .AlphaSize3 { font-size: 16px; line-height: 16px !important; }
.TraminoAlphabet .AlphaSize4 { font-size: 18px; line-height: 18px !important; }
.TraminoAlphabet .AlphaSize5 { font-size: 20px; line-height: 20px !important; }
.TraminoAlphabet .AlphaSize6 { font-size: 22px; line-height: 22px !important; }



	table.year2 {
		border: 1px solid #999;
		margin: 0px 15px 25px 0px;
		padding: 0px;
		table-layout: auto;
		border-collapse: collapse;
		font-size: 11px;
	}
	
	table.year2 td {
		border: 1px solid #666;
		background-color: #fff;
		width: 18px;
		height: 20px;
		padding: 0px;
		font-size: 11px;
		text-align: center;
	}
	
	table.year2 td.belegt {
		background-color: #aaa;
		border: 1px solid #fff;
		color: #fff;
	}
	
	table.year2 td.head {
		color: #fff;
		background-color: #444;
		border: 1px solid #fff;
		height: 18px;
	}
	
	table.year2 td.head2 {
		color: #fff;
		width: auto;
		font-size: 16px;
		padding: 7px 0px 3px 10px;
		background-color: #777;
		border: 1px solid #fff;
	}
	
	table.year2 td.mon {
		width: 80px;
		text-align: left;
		padding-left: 10px;
	}
	
	table.year {
		border: 1px solid #999;
		margin: 0px 10px 10px 0px;
		padding: 0px;
		table-layout: auto;
		border-collapse: collapse;
		font-size: 11px;
	}
	
	table.year th {
		border: 1px solid #999;
		width: 13px;
		text-align: center;
		background-color: #ddd;
		font-weight: normal;
	}
	
	table.year td {
		border: 1px solid #999;
		width: 13px;
		height: 13px;
		padding: 0px;
		text-align: center;
	}
	
	table.year td input {
		margin: 0px;
		padding: 0px;
		text-align: center;
	}
	
	table.year td.mon {
		width: 10em;
		text-align: left;
		padding-left: 1em;
		background-color: #ccc;
	}
	
	table.year td.frei input {
		background-color: #494;
		border: 1px solid #494;
		color: #fff;
	}
	
	table.year td.off {
		background-color: #ccc;
	}
	
	.TraminoKalenderMonat {
		height: 8em;
		width: 7.5em;
		margin: 0em 1em 1em 0em;
	}
	
	.TraminoKalenderMonat h3 {
		margin: 0px 0px 2px 0px;
		float: right;
		font-size: 13px;
		color: #999;
	}
	
	.TraminoKalenderMonat h4 {
		margin: 0px 0px 2px 0px;
		text-align: left;
		font-size: 13px;
		color: #bbb;
	}
	
	table.monat {
		border: 1px solid #999;
		margin: 0px;
		padding: 0px;
		table-layout: auto;
		border-collapse: collapse;
		font-size: 11px;
	}
	
	table.monat th {
		border: 1px solid #999;
		width: 1.2em;
		text-align: center;
		background-color: #eee;
	}
	
	table.monat td {
		border: 1px solid #999;
		width: 1.2em;
		height: 1.2em;
		text-align: center;
		color: #ccc;
	}
	
	table.monat td.mon {
		width: 10em;
		text-align: left;
		padding-left: 1em;
		background-color: #ccc;
	}
	
	table.monat td.frei {
		background-color: #494;
		color: #fff;
	}
	
	table.monat td.off {
		background-color: #ccc;
	}
	
	
	
	/* EventLine */
	
	table.EventLine {
		border: 1px solid #bbb;
		padding: 0px;
		table-layout: auto;
		border-collapse: collapse;
		font-size: 11px;
	}
	
	table.EventLine td {
		border: 1px solid #bbb;
		width: 1.1em;
		height: 1.2em;
		text-align: center;
		color: #ccc;
		background-color: #fff;
		font-size: 0.9em;
	}
	
	table.EventLine td.jahr {
		font-size: 1.6em;
		color: #666;
		text-align: left;
		vertical-align: top;
		padding: 0.2em 0em 0.2em 0.5em;
	}
	
	table.EventLine td.wochentag {
		color: #666;
		vertical-align: bottom;
		text-align: center;
		font-size: 0.8em;
		padding: 0.2em 0em 0.6em 0.2em;
	}
	
	table.EventLine td.monat {
		width: 7em;
		text-align: left;
		padding-left: 1em;
		color: #666;
	}
	
	table.EventLine td.d1 {
		background-color: #ddd;
	}
	
	table.EventLine td.c1 { background-color: #66C; }
	table.EventLine td.c2 { background-color: #339; }
	table.EventLine td.c3 { background-color: #669; }
	table.EventLine td.c4 { background-color: #996; }
	table.EventLine td.c5 { background-color: #f63; }
	table.EventLine td.c6 { background-color: #f63; }
	
	table.EventLine td.frei {
		background-color: #494;
		color: #fff;
	}
	
	table.EventLine td.off {
		background-color: #ccc;
	}



#TraminoContent .TraminoForm {
	background-color: transparent;
}





#TraminoContent .TraminoForm.randlos {
	background-color: transparent;
}

#TraminoContent .TraminoForm .intro h5 {
	font-size: 12px;
	margin: -5px 0 7px 0;
	color: #aaa;
	font-family: "Arial", sans-serif;
	font-weight:normal;
}

#TraminoContent .TraminoForm .intro h3 {
	font-size: 23px;
	font-family: "Arial", sans-serif;
	font-weight:normal;
}

#TraminoContent .TraminoForm .intro h3 b {
	padding: 0px;
	font-weight:normal;
}

#TraminoContent .TraminoForm .intro p {
/*	display:none; */
}

#TraminoContent .TraminoForm .intro {
	background-color: #fff;
	border-bottom: 0px solid #bbb;
}

#TraminoContent .TraminoForm .intro h3 b {
	border: 0px solid #aaa;
	color: #393;
}

#TraminoContent .TraminoForm .footer {
	background-color: transparent;
	border-top: 0px solid #bbb;
}

#tr_modalbox, #tr_modalbox #tr_overlay {
  position: fixed;
  top: 0px;
  left: 0px;
  height:100%;
  width:100%;
}

#tr_modalbox.modalbox_hide #tr_overlay  {
  z-index:-100;
}

#tr_modalbox.modalbox_BG #tr_overlay {
  background-color: #000;
  z-index: 19999;
}

#tr_modalbox #tr_info {
	position: relative;
	margin: 100px auto;
	padding:50px 0 0 0;
	text-align:center;
	height:125px;
	width:300px;
	background:#000;
	color:#fff;
	z-index: 19999;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
	border:2px solid #fff;
}

#tr_modalbox #tr_info a {
	color:#FACF3F;
}

/*  Hovertip */

	.traminoHovertip {
		position: absolute;
		top: 0px;
		left: 0px;
		z-index: 10000;
		background-color: #fff;
		padding: 6px 10px;
		border: 1px solid #bbb;
		max-width: 300px;
	
		font-size: 11px;
		color: #777;
		text-align:left;

		border-radius: 7px;
		-webkit-border-radius: 7px;
		-moz-border-radius: 7px;

		-webkit-box-shadow: 1px 1px 3px #999;
		-moz-box-shadow: 1px 1px 3px #999;
		box-shadow: 1px 1px 3px #999;

	}


	#TraminoContent { padding-top: 85px;  }
	#TraminoContent .TraminoForm { border-bottom: 1px solid #ddd; padding-bottom: 10px; }
	#TraminoContent .TraminoForm .TraminoForm { border-bottom: 0px solid #ddd; padding: 0px; }
	#TraminoContent .TraminoForm .TraminoForm.panel { border-bottom: 1px solid #ddd; border-top: 1px solid #ddd; padding: 0px 0px 0px 0px; margin-bottom: 10px; min-height: 60px; }
	#TraminoContent .TraminoForm.panel { padding-bottom: 0px; margin-bottom: 0px; }
	
	#TraminoContent .TraminoForm.insert {
		background-color: #f8f8f8 !important;
		border: 0px solid #ddd !important;
		border-bottom: 1px solid #ddd !important;
		padding: 8px 0px 0px 0px !important;
		margin-bottom: 15px !important;		
		
		border-radius: 0px;
		-webkit-border-radius: 0px;
		-moz-border-radius: 0px;

		-webkit-box-shadow: 0px 0px 0px #fff;
		-moz-box-shadow: 0px 0px 0px #fff;
		box-shadow: 0px 0px 0px #fff;
	}

	#TraminoContent .TraminoForm.insert .group { margin: 0px 5px 5px 15px !important;  }
	#TraminoContent .TraminoForm.insert .Widget .info { margin: 3px 0px 0px 0px !important; color: #bbb !important; }

	
	#TraminoContent div.listeData { padding: 0px 0px 10px 0px; margin-top: 0px; border: 0px solid #fff;  overflow-x: auto;}
	#TraminoContent div.listeData td {  border-color: #eee; padding-left: 7px; padding-right: 7px; }
	#TraminoContent div.listeData td.edit { padding:  2px 8px 2px 8px; }
	#TraminoContent div.listeData th {  font-weight: normal; border-bottom: 1px solid #ddd; color: #999; padding-top: 15px; padding-left: 7px; padding-right: 7px; }
	#TraminoContent div.listeData td.gruppe { font-weight: bold; color: #333; font-size: 12px; padding-top: 15px; border-bottom: 1px solid #aaa; }
	#TraminoContent div.listeData.gruppe-big td.gruppe:not(.hidden) { font-weight: bold; color: #000; font-size: 16px; padding-top: 35px; padding-bottom: 7px; }

	#TraminoContent table.listeData td.hidden { color: #aaa; }
	#TraminoContent table.listeData td.italics { font-style: oblique; }
	#TraminoContent table.listeData td.disabled { text-decoration: line-through; }
	
	#TraminoContent .listeData .empty { margin: 5px 0px 0px 0px; }
	
	#TraminoContent .TraminoAlphabet { border-bottom: 1px solid #ddd;}
	
	#TraminoContent .TraminoForm .Widgets { background-color: #fff; border: 0px solid #fff; }
	#TraminoContent .TraminoForm .headerbuttons { position: relative; top: 0px; }
	
	
.TraminoGeomatch { color: #000; }


/* Queue Job Status */
.status-dialog {
	width: 600px;
	border: 1px solid #D4D4D4;
	padding: 15px 20px;
	border-radius: 8px;
	box-shadow: 1px 1px 1px #D4D4D4;
	margin: auto;
	margin-bottom: 4em;
}
.status-dialog h6 { 
	margin: 0 0 .1em 0;
	font-size: 20pt;
}

.progress-bar {
	width: 100%;
	height: 30px;
	box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
	background-color: #f5f5f5;
	border-radius: 4px;
	overflow: hidden;
}
.progress-bar .progress-bar-inner {
	float: left;
	height: 100%;
	background: #7DB1D2;
	transition: width .4s ease;

	background-color: #5cb85c;
	background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
	background-size: 40px 40px;
}
.progress-bar .progress-bar-error {
	background-color: #a00;
}

.status-dialog .progress-percent {
	float: right;
	margin-top: 5px;
}
.status-dialog .progress-text {
	margin-top: 5px;
}
.status-dialog .progress-info {
	color: #555;
	font-size: 10pt;
	margin-top: 10px;
}
.status-dialog .progress-info span {
	display: block;
}
.status-dialog .progress-log {
	height: 200px;
	overflow: auto;
	border: 1px solid #ccc;
	background: #fafafa;
	margin-top: 10px;
}

.status-row {
	padding: 3px;
	border-bottom: 1px dotted #ccc;
}
.status-row .date {
	margin-right: 10px;
}
.status-row.progress {

}
.status-row.error {
	background: #ff7d00;
}


/**
 * Reserva Search Widgets
 */
.reserva-backend-search {
	position: relative;
}

.reserva-backend-search .button {
	display: inline-block;
	background-color: #fff;
	border: 1px solid #aaa;
	border-radius: 4px;
	padding: 3px 15px 3px 15px;
	margin-right: 8px;
	cursor: pointer;
	text-align: center;
	font-size: 13px;
	font-weight: 400;
	color: #444;
	float: left;
}

.reserva-backend-search .button.pulldown {
	padding-right: 30px;
	background-image: url(//tramino.s3.amazonaws.com/s/oberstdorf/683883/arrowdown.png);
	background-repeat: no-repeat;
	background-position: right 4px top -44px;
}

.reserva-backend-search .button.pulldown.on {
	background-position: right 8px top 3px;
	border-width: 0px;
	padding: 5px 31px 4px 16px;
	border-radius: 0px;
	z-index: 1000;
	position: relative
}

.reserva-backend-search input[type="submit"] {
	display: inline-block;
	background-color: transparent;
	border: 0px;
	margin: 0px;
	background-color: #BF2A00;
	padding: 6px 20px 4px 20px;
	cursor: pointer;
	text-align: center;
	font-size: 12px;
	line-height: 17px;	font-weight: bold;
	color: #fff;
	text-transform: uppercase;
}


.reserva-backend-search input[type="button"] {

	display: inline-block;
	background-color: transparent;
	border: 0px;
	margin: 0px;
	margin-left: 3px;
	background-color: #BF2A00;
	padding: 6px 20px 4px 20px;
	cursor: pointer;
	text-align: center;
	font-size: 12px;
	line-height: 17px;	font-weight: bold;
	color: #fff;
	text-transform: uppercase;
}

.reserva-datepicker .ui-datepicker td.selected { background-color: #B1CBA9;  }
.reserva-datepicker.selecting .ui-datepicker td.selected { background-color: #238C00;  }
.reserva-datepicker.selecting .ui-datepicker td.selected a { color: #fff; }


body .reserva-datepicker { box-shadow: 3px 3px 73px rgba(0, 0, 0, 0.5); }

body #backend_people_container { box-shadow: none; }
body .people-panel { box-shadow: 3px 3px 73px rgba(0, 0, 0, 0.5); }


/* ----------------[ Dashboard ]---------------- */

.element:hover .widget-reload, .widget-reload.active {
	opacity: 1;
}
.widget-reload {
	opacity: 0;
	transition: opacity .2s ease;
}
svg.rotating {
	transform: rotate(360deg);
	transition: transform .5s linear;
}


/* ----------------[ Dashboard Editor ]---------------- */
.widget-container * {
	box-sizing: border-box;
}
.widget-container {
	width: 100%;
}
.widget-editor {
	display: flex;
	min-height: 300px;
	justify-content: space-between;
}
.widget-editor .widgetbox {
	width: 24.5%;
}
.widgetbox {
	width: 100%;
	border: 1px solid #ccc;
	margin-bottom: 10px;
	padding: 5px;
	min-height: 100px;
	display: flex;
	flex-direction: column;
}
.___widgets {
	height: 100%;
}
.widgetbox h3 {
	margin: 0 0 5px 0;
	border-bottom: 1px solid #ccc;
	font-size: 14px;
	color: #999;
}
.widgetbox.center h3 { text-align: center; }
.widgetbox.right h3 { text-align: right; }
.widget-item {
	margin: 10px;
	border: 1px solid #ccc;
	padding: 4px 8px;
	background: #fafafa;
	width: 200px;
	box-sizing: content-box; /* Fixed a jquery UI bug while moving */
	cursor: move;
}
.widget-item.disabled {
	cursor: not-allowed;
	background: #fefefe;
}


.select2-container--default {
	font-size: 12px;	
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 21px !important;
}

.select2-selection__rendered {
	line-height: 22px !important;
}

.select2-container .select2-selection--single {
	height: 23px !important;
}





/* Hinweis: Existiert zusätzlich im Editor unter anderem Selector für die Vorschau. */
.TraminoManual h1 { font-size: 32px; margin: 10px 0px 25px 0px; color: #000; font-weight: bold; line-height: 1; }
.TraminoManual h2 { font-size: 20px; margin: 25px 0px 25px 0px; color: #333; font-weight: bold; line-height: 1; padding-top: 1.1em; border-top: 1px solid #ccc; }
.TraminoManual h3 { font-size: 15px; margin: 15px 0px 7px 0px; color: #444; line-height: 1;  }
.TraminoManual ul { margin: 10px 0px 15px 0px;  }
.TraminoManual ul li { margin-bottom: 4px;  }

/* h2 folding */
.TraminoManual h2 { position: relative; }
.TraminoManual h2 label { cursor: pointer; position: absolute; left: 0px; right: 0em; top: 0; bottom: 0px; font-size: 1.1em; line-height: 2.7em; text-align: right; }
.TraminoManual h2 + .manual_fold { display: none; margin-bottom: 3em; }
.TraminoManual input[type=checkbox] { display: none; }
.TraminoManual input:checked + h2 label span { display: inline-block; transform: rotate(45deg); font-size: 1.3em;}
.TraminoManual input:checked + h2 + .manual_fold { display: block; animation: slideaway 300ms; }

@keyframes slideaway {
  from { transform: translateY(-1em); opacity: 0;}
  to { display: block; }
 }



 /* Quill */

li[data-list=bullet] { list-style-type: disc; margin-bottom: 0.1em; }
li.ql-indent-1 { margin-left: 2em; }
li.ql-indent-2 { margin-left: 4em; }