body
{
	margin-top  : 0;
	font-family : 'Open Sans', sans-serif;
	font-size   : 12pt;
	color       : #555555;
}

*
{
	font-family : 'Open Sans', sans-serif;
}

.fade
{
	opacity : 1 !important;
}

.mymodal
{
	position          : fixed;
	xtop              : 10%;
	xbottom           : 10%;
	xleft             : 10%;
	xright            : 10%;
	xwidth            : 400px;
	xheight           : 400px;
	border            : 1px solid gray;
	xbackground-color : #e0e0e0;
	xleft             : 50%;
	xtop              : 50%;
	xmargin-left      : -200px;
	xmargin-top       : -200px;
	box-shadow        : 6px 6px 16px 0px rgba(0, 0, 0, 0.75);
	xpadding          : 4px;
}

.mymodal.panel .footer > button
{
	margin : 0 10px;
}

/*.mymodal > .caption*/
/*{*/
/*border-bottom    : 1px solid #bbbbbb;*/
/*font-size        : 14px;*/
/*background-color : #ebebeb;*/
/*padding          : 4px;*/
/*text-align       : center;*/
/*}*/

/*.mymodal > .footer*/
/*{*/
/*position         : absolute;*/
/*bottom           : 0px;*/
/*height           : 30px;*/
/*left             : 0px;*/
/*right            : 0px;*/
/*border-top       : 1px solid #bbbbbb;*/
/*font-size        : 150%;*/
/*text-align       : right;*/
/*padding-right    : 10px;*/
/*padding-top      : 5px;*/
/*background-color : #ebebeb;*/
/*}*/


table.nowrap td
{
	white-space : nowrap;
}

.filter_table
{
	width           : 100%;
	border-collapse : collapse;

}

.filter_table td
{
	padding        : 2px 6px;
	vertical-align : middle;
	line-height    : 18px;
}

.filter_table td label
{
	margin-bottom : 0;

	position      : relative;
	bottom        : -2px;

}

.filter_table tr:nth-child(odd) td
{
	vertical-align : bottom;
	padding        : 0px 6px;
}

.ausstattung_table
{
	width           : 100%;
	border-collapse : collapse;
	xorder          : 1px solid #ececec;
	table-layout    : fixed;

}

.nowrap
{
	white-space : nowrap;
}

.wheel
{
	background : url('/img/icon_scroll.svg') no-repeat 100% 50%/auto 80%;
}

.smallwheel
{
	background    : url('/img/icon_scroll.svg') no-repeat 100% 50%/auto 60%;
	padding-right : 0px;
}

.bootbox.modal > .modal-dialog
{
	z-index : 999999 !important;
}

.mytable
{
	width           : 100%;
	border-collapse : collapse;
}

.mytable th
{
	background-color : #eaedf7;
	padding          : 2px 10px;
	text-align       : left;
}

.mytable td
{
	padding     : 4px 10px;
	line-height : 12pt;
	xborder-top : 1px solid white;
	height      : 20px;
}

.mytable tr:nth-child(even)
{
	background-color : #f7f7f7;
}

.mytable tr:nth-child(odd)
{

}

.mytable tr:hover td
{
	background-color : #e6e6e6;
	/*border-top       : 1px solid #b4ffc3;*/
}

.mytable tr:not(:first-child).p1 td
{
	border-top   : 1px solid #a1b2ce;
	xborder-left : 4px solid #b0a0f8;
}

.gridfooter
{
	display : flex;
	xborder : 1px solid green;
}

.gridfooter > *
{
	xborder     : 1px solid red;
	margin-left : 5px;
}

.gridfooter #divErgebnisse
{
	margin-right : auto;
	padding-top  : 4px;
}

.gridfooter #divSeite
{
	width          : 200px;
	text-align     : center;
	vertical-align : middle;
	padding-top    : 4px;
}

.link
{
	cursor : pointer;
}

.filter_div
{
	display : flex;
}

.filter_div > .left
{
	flex-grow : 1;
	display   : flex;
	flex-wrap : wrap;
}

.filter_div > .left > *
{
	align-self : flex-start;
}

.filter_div > .left > button
{
	margin-right : 4px;
	margin-top   : 4px;
}

.filter_div > .right
{
	border-left     : 1px solid #d9d9d9;
	width           : 200px;
	flex-grow       : 0;
	flex-shrink     : 0;
	flex-basis      : 200px;
	flex-wrap       : wrap;
	display         : flex;
	justify-content : space-between;
	padding-left    : 4px;
	padding-right   : 4px;
}

.filter_div > .right > *
{
	xflex-grow   : 0;
	xflex-shrink : 0;
	xalign-self  : flex-end;
	xmargin      : 4px;
}

.myinputblock
{
	padding : 2px;
	width   : 200px;
	xborder : 1px solid red;
	margin  : 2px;

}

.myinputblock > label
{
	width   : 100px;
	xborder : 1px solid blue;
}

.myinputblock > *
{
	width      : 100% !important;
	xborder    : 1px solid yellow;
	box-sizing : border-box;
}

.checkbox
{
	width      : 20px;
	height     : 20px;
	/*border     : 1px solid red;*/
	margin-top : 5px !important;
}

.navbar
{
	display          : flex;
	width            : 100%;
	flex-wrap        : wrap;
	background-color : #f5f5f5;

	border-bottom    : 1px solid #d4d4d4;
	border-left      : 1px solid #d4d4d4;
	border-right     : 1px solid #d4d4d4;
	margin-bottom    : 20px;
	align-items      : center;
}

.navbar > *
{
	xborder         : 1px solid red;
	xalign-self     : center;
	display         : block;
	padding         : 5px 10px;
	color           : #777777;
	text-decoration : none;
}

.navbar *
{
	xcolor          : #777777 !important;
	text-decoration : none;
	white-space     : nowrap;

}

.navbar a, .link
{
	color           : #777777 !important;
	text-decoration : none;
	white-space     : nowrap;

}

.navbar a:hover, .link:hover
{
	text-decoration : underline;
}

.navbar > *.active
{
	/*color            : #555555;*/
	/*background-color : #e7e7e7;*/
	/*border-bottom: 2px solid #333333;*/

	background : rgb(231, 231, 231);
	background : linear-gradient(to bottom, rgba(231, 231, 231, 1) 0%, rgba(231, 231, 231, 1) 96%, rgba(117, 117, 117, 1) 100%);
	filter     : progid:DXImageTransform.Microsoft.gradient(startColorstr='#e7e7e7', endColorstr='#757575', GradientType=0);

}

.hint
{
	font-size : 85%;
	color     : #1a802c;
}

.panel
{
	border         : 1px solid #c9c9c9;
	border-radius  : 6px;
	overflow       : hidden;
	display        : flex;
	flex-direction : column;
}

.panel > .header
{
	padding          : 8px;
	background-color : #ebebeb;
	xtext-shadow     : 1px 1px 1px rgba(0, 0, 0, 0.2);
	border-bottom    : 1px solid #c9c9c9;
	font-size        : 14pt;
	flex-grow        : 0;
	display          : flex;
}

.panel > .body
{
	padding          : 10px;
	xoverflow-x      : auto;
	background-color : #ffffff;
	flex-grow        : 1;
	xborder          : 1px solid red;
	xmargin          : 10px;
}

.panel > .footer
{
	padding          : 8pt;
	background-color : #ebebeb;
	text-shadow      : 1px 1px 1px rgba(0, 0, 0, 0.1);
	border-top       : 1px solid #c9c9c9;
	display          : flex;
	color            : #777777 !important;
	flex-grow        : 0;
	align-items      : center;
}

.panel > .footer > span, .panel > .footer > a
{
	color : #777777;
}

.red_caption
{
	font-size   : 20pt;

	color       : #6b6b6b;
	font-weight : 300;
}

.center
{
	text-align : center;
}

input[type="text"], input[type="password"]
{
	padding   : 4px;
	font-size : 12pt;
	border    : 1px solid #d1d1d1;
}

input[type="text"][readonly]
{
	background-color : #e8e8e8;
	color            : #808080;
}

select
{
	padding   : 4px;
	font-size : 12pt;
	border    : 1px solid #d1d1d1;
}

select[disabled]
{
	background-color : #e8e8e8;
	color            : #808080;
}

input[type="button"], button
{
	padding          : 6px 12px;
	font-size        : 12pt;
	xborder          : 1px solid #d1d1d1;
	border           : none;
	color            : #505050;
	xline-height     : 0pt;
	xheight          : 50px !important;
	transition       : all 0.3s ease;
	background-color : #cecece;
}

input[type="button"].blue, button.blue
{
	background-color : #5c98ff;
	color            : white;
}

input[type="button"].yellow, button.yellow
{
	background-color : #e2c43d;
	color            : white;
}

input[type="button"].red, button.red
{
	background-color : #ff5b5b;
	color            : white;
}

input[type="button"].green, button.green
{
	background-color : #27a724;
	color            : white;
}

input[type="button"]:hover, button:hover
{
	xbox-shadow   : 1px 1px 1px #223322;
	xborder-color : black;
	opacity       : 0.8;
	transition    : all 0.1s ease;
}

input[type="button"][disabled], button[disabled]
{
	opacity : 0.5 !important;
	cursor  : not-allowed;
}

#infobox
{
	z-index         : 9999;
	text-align      : center;
	box-shadow      : rgba(0, 0, 0, 0.2) 3px 3px 3px 0;
	bottom          : 20px;
	position        : fixed;
	padding         : 4px;
	border-radius   : 2px;
	left            : 30%;
	right           : 30%;
	font-weight     : 300;
	min-height      : 30px;
	line-height     : 2;
	font-size       : 16pt;
	display         : block;
	cursor          : pointer;
	xpointer-events : none;
	animation       : fadeout 1200ms ease-in-out both;
}

@keyframes fadein
{
	from
	{
		opacity    : 0;
		visibility : hidden;
	}
	to
	{
		opacity    : 1;
		visibility : visible;
	}
}

@keyframes fadeout
{
	from
	{
		opacity    : 1;
		visibility : visible;
	}
	to
	{
		opacity    : 0;
		visibility : hidden;
	}
}

#infobox.visible
{
	animation : fadein 200ms ease-in-out both;
}

#infobox.good
{
	color            : #ffffff;
	background-color : #4ba04b;
	border           : 1px solid #86a57b;
}

#infobox.bad
{
	background-color : #d64949;
	border           : 1px solid #daa6a6;
	color            : #ffffff;
}

#infobox.bad
{
	background-color : #d64949;
	border           : 1px solid #daa6a6;
	color            : #ffffff;
}

.detail_table
{
	xborder         : 1px solid red;
	border-collapse : collapse;
	width           : 100%;
}

.detail_table td
{
	padding : 4px;
}

.detail_table > tbody > tr > td:first-child
{
	min-width : 200px;
	width     : 200px;
}

.detail_table input[type="text"], .detail_table select
{
	width      : 300px;
	box-sizing : border-box;
}

.ajax_loader
{
	background-image : url('/img/ajax_loader.svg');
	width            : 24px;
	height           : 24px;
	background-size  : contain;
}

#div_search
{
	margin-bottom : 20px;
}

.right
{
	text-align : right;
}

.left
{
	text-align : left;
}

.center
{
	text-align : center;
}

.blinking
{
	animation : blink 2s linear 0s infinite normal;
}

@keyframes blink
{
	0%
	{
		opacity : 1;
	}
	25%
	{
		opacity : 0;
	}
	50%
	{
		opacity : 1;
	}
	75%
	{
		opacity : 0;
	}
	100%
	{
		opacity : 1;
	}
}