@CHARSET "UTF-8";

/*
	@brief  CSS für COMA-Applikationen
	
	Findet nur innerhalb eines HTML-Elements mit der CSS-Klasse "appstyle" Anwendung 
	
	@version
		- 24.03.2014 / spet / angelegt
		- 07.04.2014 / spet / RC + Placeholder-Farb-Hacks + Watermark-Hack
		- 20.06.2014 / spet / Anpassung von jQuery-Tabs + hover-Attribut für button-default
		- 18.07.2014 / spet / Verhindert, dass in Span-Buttons Text selektiert wird
		                      Passwort-Felder formatiert
		- 18.08.2014 7 spet / Formatierungen für Leaflet-Karten
		
*/



/*
	##########################################
	########## Anpassungen am Style ##########
	##########################################
*/

/*
	Farbe in dezenterem grau-schwarz
*/
.appstyle *:not(.noticeMsg):not(.errorMsg):not(.successMsg):not(a):not(a *):not(th):not(.ib-color-default):not(.iconbutton-default):not(.button-default),
.ui-tooltip 
{
	color: #464646;
}

/*
	Links anpassen
*/
.appstyle a:not(.button-default):not(.ib-default):not(.iconbutton-default):not(.ui-tabs-anchor),
.appstyle a:hover:not(.button-default):not(.ib-default):not(.iconbutton-default):not(.ui-tabs-anchor)
{
	color: rgb(0, 88, 156) !important;
	background-color: rgba(0,0,0,0);	
}
.appstyle a:hover {	
	text-decoration: underline;
}


/*
	Bestimmte Elemente werden durch den zentralen Style kleiner gemacht ... das wollen wir aber nicht
*/
.appstyle label,
.appstyle td,
.appstyle th,
.appstyle a,
.appstyle p,
.appstyle li,
.appstyle ul
{
	font-size: inherit;	
}

/*
	Padding und margin fixen
*/
.appstyle ul {
	padding: 0em;
}
.appstyle p {
	padding: 0;
	margin: 0;	
	margin-top:0.2em;
}

/*
	Überschriften
*/
.appstyle h1 {
	font-weight: bold !important;
	padding: 0 !important;
	margin: 0 !important;	
	margin-bottom: 0.8em !important;
	color: #464646 !important;
	font-size: 1.4em !important;
}

.appstyle h2 {
	font-weight: bold;
	padding: 0;
	margin: 0;	
	margin-bottom: 0.8em;
	color: #464646;
	font-size: 1.2em;
}
.appstyle h3 {
	font-weight: bold;
	padding: 0;
	margin: 0;
	margin-top: 25px;
	margin-bottom: 10px;
	color: #464646;
	font-size: 1em;
}



/*
	Tabellen
*/
.appstyle td
{
	border: 1px solid lightgray;
	background: none;	
	color: inherit;
	text-align: left;
	vertical-align: top;
}
.appstyle th
{
	border: 1px solid lightgray;
	background-color: #EEEEEE;
	color: inherit;
	text-align: left;
	vertical-align: top;
}




/*
	Einzeilige Textfelder + Auswahllisten
*/
.appstyle input[type=text],
.appstyle input[type=password], 
.appstyle input[type=file],
.appstyle select,
.appstyle textarea
{
	font-size: inherit;
	border: 1px solid lightgray;
	background-color: white;
	padding: 3px 5px;
}
.appstyle input[readonly],
.appstyle select[readonly],
.appstyle textarea[readonly]
{
	background-color: #EEEEEE;
	font-style: italic;	
}

/*
	Formular-Buttons
*/
.appstyle button,
.appstyle input[type=button] {
	font-size: inherit;
	font-weight: bold;
	border: 1px solid lightgray;
	border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;
	background-color: #EEEEEE;
	padding: 3px 5px;
	font-size: 0.85em;
}


/*
	Placeholder - Hacks
*/
::-webkit-input-placeholder {
	color: gray !important;
	font-style: italic !important;
}
:-moz-placeholder {
	color: gray !important;
	font-style: italic !important;
}
::-moz-placeholder {
	color: gray !important;
	font-style: italic !important;
}
:-ms-input-placeholder {
	color: gray !important;
	font-style: italic !important;
}
.appstyle .watermark {
	color: gray !important;
	font-style: italic !important;
	font-size: inherit !important;	
}



/*
	Autocompletes
*/
/* Ergebnisliste in der Höhe beschränken */
.ui-autocomplete {
	max-height: 300px;
	overflow-y: auto;	
	overflow-x: hidden;
}
/* Schriftgröße und -Farbe der Ergebnisliste anpassen */
.ui-autocomplete .ui-menu-item a {
	color: #464646;	
	font-size: 0.85em;
}

/*
	Tooltips
*/
.ui-tooltip {	
	max-width: 900px;	
}
.ui-tooltip * {
	font-size: 13px;
}
.ui-tooltip-content {
	
}

/*
	jQuery-Dialoge
*/
.ui-dialog {
	font-size: 15.2px;
}

/*
	jQuery Tabs
*/
.appstyle .ui-tabs {
	font-size: 0.85em;
	border: none;
}
.appstyle .ui-tabs-nav {
	background: none;
	border: none;
}
.appstyle .ui-state-default {
	background: none
}
.appstyle .ui-state-active {
	background: #BBBBBB;		
}
.appstyle .ui-tabs-anchor {
	font-weight: bold;	
}

.appstyle .ui-tabs-anchor,
.appstyle a.ui-tabs-anchor:not(.color-alert),
.appstyle a.ui-tabs-anchor * 
{
	color: #464646 !important; /* Das basis-CSS lässt einem bei der Verwendung von !inherit an dieser Stelle keine Wahl */
}
.appstyle a.ui-tabs-anchor:hover
{
	cursor: pointer !important;
	background-color: #BBBBBB;
}
.appstyle a.ui-tabs-anchor:hover:not(.color-alert)
{
	color: #464646 !important; /* Das basis-CSS lässt einem bei der Verwendung von !inherit an dieser Stelle keine Wahl */
}
.appstyle a.ui-tabs-active:hover {	
	background: none;
}
.appstyle .ui-tabs-panel {
	border: 1px solid rgb(170,170,170); border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;
}

/*
	jQuery Accordion
*/
.appstyle .ui-accordion {
	font-size: inherit;
	color: inherit;
}
.appstyle .ui-accordion-header,
.appstyle .ui-accordion-header .ui-accordion-header-active,
.appstyle .ui-accordion-header .ui-state-hover
{
	background: none;
	border-color: rgb(170,170,170);
	color: inherit;
}
.appstyle .ui-accordion-content {
	padding-left: 5px; padding-right: 5px; padding-top: 3px; padding-bottom: 3px;	
}



/*
	DBAF Fileupload
	-> Eckige Klammern ausblenden
*/
.appstyle .dbaf_fileupload_bracket {
	display: none;
}


/*
	Leaflet.js Maps 
*/
.appstyle div.leaflet-bar > a {
	background-color: #FFFFFF !important;
}
.appstyle div.leaflet-bar > a:hover {
	background-color: #F4F4F4 !important;
}


/*
	##########################################
	########## Nutzbare CSS-Klassen ##########
	##########################################
*/

/*
	Rahmen
*/
.appstyle .border-default { border: 1px solid lightgray; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
.appstyle .border-off { border: none; }
.appstyle .border-alert { border: 1px solid #cd0a0a; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
.appstyle .border-notice { border: 1px solid #B57B00; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
.appstyle .border-success { border: 1px solid #0d4f0e; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }



/*
	Schriftgröße
*/
.appstyle .font-smaller { font-size: 0.85em; }



/*
	Schriftformatierung
*/
.appstyle .font-weighted { font-weight: bold; }
.appstyle .font-italic { font-style: italic; }



/*
	Innenabstand
*/
.appstyle .padding-default { padding-left: 5px; padding-right: 5px; padding-top: 3px; padding-bottom: 3px; }



/*
	Breiten
*/
.appstyle .width-content { display: inline-block; }
.appstyle .width-1x-fix  { width: 50px;  display: inline-block; }
.appstyle .width-2x-fix  { width: 100px; display: inline-block; }
.appstyle .width-3x-fix  { width: 150px; display: inline-block; }
.appstyle .width-4x-fix  { width: 200px; display: inline-block; }
.appstyle .width-5x-fix  { width: 250px; display: inline-block; }
.appstyle .width-6x-fix  { width: 300px; display: inline-block; }
.appstyle .width-7x-fix  { width: 350px; display: inline-block; }
.appstyle .width-8x-fix  { width: 400px; display: inline-block; }
.appstyle .width-9x-fix  { width: 450px; display: inline-block; }
.appstyle .width-10x-fix { width: 500px; display: inline-block; }
.appstyle .width-11x-fix { width: 550px; display: inline-block; }
.appstyle .width-12x-fix { width: 600px; display: inline-block; }
.appstyle .width-13x-fix { width: 650px; display: inline-block; }
.appstyle .width-14x-fix { width: 700px; display: inline-block; }
.appstyle .width-15x-fix { width: 750px; display: inline-block; }
.appstyle .width-16x-fix { width: 800px; display: inline-block; }
.appstyle .width-17x-fix { width: 850px; display: inline-block; }
.appstyle .width-18x-fix { width: 900px; display: inline-block; }
.appstyle .width-19x-fix { width: 950px; display: inline-block; }
.appstyle .width-20x-fix { width: 1000px; display: inline-block; }
.appstyle .width-100-p   { width: 100%; }
.appstyle .width-99-p    { width: 99%; }
.appstyle .width-95-p    { width: 95%; }
.appstyle .width-90-p    { width: 90%; }
.appstyle .width-85-p    { width: 85%; }
.appstyle .width-80-p    { width: 80%; }
.appstyle .width-75-p    { width: 75%; }
.appstyle .width-70-p    { width: 70%; }
.appstyle .width-66-p    { width: 66%; }
.appstyle .width-65-p    { width: 65%; }
.appstyle .width-60-p    { width: 60%; }
.appstyle .width-55-p    { width: 55%; }
.appstyle .width-50-p    { width: 50%; }
.appstyle .width-45-p    { width: 45%; }
.appstyle .width-40-p    { width: 40%; }
.appstyle .width-35-p    { width: 35%; }
.appstyle .width-33-p    { width: 33%; }
.appstyle .width-30-p    { width: 30%; }
.appstyle .width-25-p    { width: 25%; }
.appstyle .width-20-p    { width: 20%; }
.appstyle .width-15-p    { width: 15%; }
.appstyle .width-10-p    { width: 10%; }
.appstyle .width-5-p     { width: 5%; }
/* Enthaltenen Elementen auf Block-Darstellung mit maximaler Breite aufzwingen */
.appstyle .width-max-recursive-force * {	
	width: 99% !important;
	display: block !important;
}


/*
	Höhen
*/
.appstyle .height-1x-fix  { height: 50px; }
.appstyle .height-2x-fix  { height: 100px; }
.appstyle .height-3x-fix  { height: 150px; }
.appstyle .height-4x-fix  { height: 200px; }
.appstyle .height-5x-fix  { height: 250px; }
.appstyle .height-6x-fix  { height: 300px; }
.appstyle .height-7x-fix  { height: 350px; }
.appstyle .height-8x-fix  { height: 400px; }
.appstyle .height-9x-fix  { height: 450px; }
.appstyle .height-10x-fix { height: 500px; }
.appstyle .height-11x-fix { height: 550px; }
.appstyle .height-12x-fix { height: 600px; }
.appstyle .height-13x-fix { height: 650px; }
.appstyle .height-14x-fix { height: 700px; }
.appstyle .height-15x-fix { height: 750px; }
.appstyle .height-16x-fix { height: 800px; }
.appstyle .height-17x-fix { height: 850px; }
.appstyle .height-18x-fix { height: 900px; }
.appstyle .height-19x-fix { height: 950px; }
.appstyle .height-20x-fix { height: 1000px; }



/*
	Vordergrundfarben
*/
.appstyle .color-default     { color: #464646 !important; }
.appstyle .color-alert       { color: #cd0a0a !important; }
.appstyle .color-notice      { color: #B57B00 !important; }
.appstyle .color-success     { color: #0d4f0e !important; }
.appstyle .color-disabled    { color: #B0B0B0 !important; }
.appstyle .color-link        { color: #00589C !important; }


/*
	Hintergrundfarben
*/
.appstyle .background-alert       { background-color: #f3c9b9; }
.appstyle .background-notice      { background-color: #FFEEBF; }
.appstyle .background-success     { background-color: #c2f0c1; }
.appstyle .background-highlight   { background-color: #EEEEEE; }



/*
	Abstand nach oben
*/
.appstyle .top-1x-fix { margin-top:  5px; }
.appstyle .top-2x-fix { margin-top: 10px; }
.appstyle .top-3x-fix { margin-top: 15px; }
.appstyle .top-4x-fix { margin-top: 20px; }
.appstyle .top-5x-fix { margin-top: 25px; }
.appstyle .top-6x-fix { margin-top: 30px; }
.appstyle .top-7x-fix { margin-top: 35px; }
.appstyle .top-8x-fix { margin-top: 40px; }
.appstyle .top-9x-fix { margin-top: 45px; }



/*
	Abstand nach unten
*/
.appstyle .bottom-1x-fix { margin-bottom:  5px; }
.appstyle .bottom-2x-fix { margin-bottom: 10px; }
.appstyle .bottom-3x-fix { margin-bottom: 15px; }
.appstyle .bottom-4x-fix { margin-bottom: 20px; }
.appstyle .bottom-5x-fix { margin-bottom: 25px; }
.appstyle .bottom-6x-fix { margin-bottom: 30px; }
.appstyle .bottom-7x-fix { margin-bottom: 35px; }
.appstyle .bottom-8x-fix { margin-bottom: 40px; }
.appstyle .bottom-9x-fix { margin-bottom: 45px; }



/*
	Abstand nach links
*/
.appstyle .left-smallspace-fix { margin-left: 5px; }
.appstyle .left-05x-fix  { margin-left: 25px; }
.appstyle .left-1x-fix  { margin-left: 50px; }
.appstyle .left-2x-fix  { margin-left: 100px; }
.appstyle .left-3x-fix  { margin-left: 150px; }
.appstyle .left-4x-fix  { margin-left: 200px; }
.appstyle .left-5x-fix  { margin-left: 250px; }
.appstyle .left-6x-fix  { margin-left: 300px; }
.appstyle .left-7x-fix  { margin-left: 350px; }
.appstyle .left-8x-fix  { margin-left: 400px; }
.appstyle .left-9x-fix  { margin-left: 450px; }
.appstyle .left-10x-fix { margin-left: 500px; }
.appstyle .left-11x-fix { margin-left: 550px; }
.appstyle .left-12x-fix { margin-left: 600px; }
.appstyle .left-13x-fix { margin-left: 650px; }



/*
	Abstand nach rechts 
*/
.appstyle .right-smallspace-fix { margin-right: 5px; }
.appstyle .right-05x-fix  { margin-right: 25px; }
.appstyle .right-1x-fix  { margin-right: 50px; }
.appstyle .right-2x-fix  { margin-right: 100px; }
.appstyle .right-3x-fix  { margin-right: 150px; }
.appstyle .right-4x-fix  { margin-right: 200px; }
.appstyle .right-5x-fix  { margin-right: 250px; }
.appstyle .right-6x-fix  { margin-right: 300px; }
.appstyle .right-7x-fix  { margin-right: 350px; }
.appstyle .right-8x-fix  { margin-right: 400px; }
.appstyle .right-9x-fix  { margin-right: 450px; }
.appstyle .right-10x-fix { margin-right: 500px; }
.appstyle .right-11x-fix { margin-right: 550px; }
.appstyle .right-12x-fix { margin-right: 600px; }
.appstyle .right-13x-fix { margin-right: 650px; }



/*
	Horizontale Ausrichtung
*/
.appstyle .h-center {text-align: center !important; }
.appstyle .h-left   {text-align: left !important; }
.appstyle .h-right  {text-align: right !important; }



/*
	Vertikale Ausrichtung
*/
.appstyle .v-middle {vertical-align: middle !important; }
.appstyle .v-top    {vertical-align: top !important; }
.appstyle .v-bottom {vertical-align: bottom !important; }

/*
	Elementfluss 
*/
.appstyle .float-left { float: left; }
.appstyle .float-right { float: right; }
.appstyle .float-off { clear: both; }



/*
	Mauszeiger
*/
.appstyle .cursor-default { cursor: default; }
.appstyle .cursor-pointer { cursor: pointer; }




/*
	Anzeige
*/
.appstyle .display-off         { display: none; }
.appstyle .display-transparent { visibility: hidden; }
.appstyle .display-inlineblock { display: inline-block; }


/*
	Buttons
*/
.appstyle button,
.appstyle .button-default {
	color: #464646;
	cursor: pointer;
	border: 1px solid #b1b7b9;
	margin: 0;
	padding: 0.2em;
	padding-left: 0.5em;
	padding-right: 0.5em;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	display: inline-block;
	background-color: #EEEEEE;
	font-weight: bold;
	
	-webkit-touch-callout: none; /* Verhindern, dass in Span-Buttons Text selektiert wird */
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.appstyle button:HOVER,
.appstyle .button-default:HOVER, 
.appstyle .button-default:HOVER *,
.appstyle .button-default[hovered],
.appstyle .button-default[hovered] .fa,
.appstyle .iconbutton-default[hovered]
{	
	background-color: #BBBBBB;
	color: #464646 !important; /* Das basis-CSS lässt einem bei der Verwendung von !inherit an dieser Stele keine Wahl */
	text-decoration: none;
}
.appstyle button[disabled],
.appstyle button[disabled] .fa,
.appstyle button[disabled]:HOVER,
.appstyle button[disabled]:HOVER *,
.appstyle .button-default[disabled],
.appstyle .button-default[disabled] .fa,
.appstyle .button-default[disabled]:HOVER,
.appstyle .button-default[disabled]:HOVER *,
.appstyle .iconbutton-default[disabled],
.appstyle .iconbutton-default[disabled] .fa,
.appstyle .iconbutton-default[disabled]:HOVER,
.appstyle .iconbutton-default[disabled]:HOVER *,
.appstyle input[disabled],
.appstyle textarea[disabled]
{
	font-style: italic;
	cursor: default;
	color: #BBBBBB !important;
	background-color: #EEEEEE;
}
.appstyle .button[disabled] .fa,
.appstyle .button-default[disabled] .fa ,
.appstyle .iconbutton-default[disabled], .appstyle .iconbutton-default[disabled]:HOVER
{
	font-style: normal;
}



/*
	Icon-Buttons
	- Macht im Prinzip das, was auch die separate iconbutton.css mach 
	  --> definiert aber neue Bezeichnungen, die besser in das aktuelle Schema passen
	- Passt gleichzeitig das Layout ggf. separat eingebundener Icon-Buttons an 
*/
.appstyle .iconbutton-default,
.appstyle .ib-color-default
{
	display: inline-block;
	width: 22px;
	height: 22px;
	text-align: center;
	color: #464646;
	background-color: #EEEEEE;
	border: 1px solid #b1b7b9;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	overflow: hidden;
	font-size: 18px;
	line-height: 23px;
	padding: 0;
	margin: 0;      
	cursor: pointer;     
	font-weight: normal;
	text-decoration: none;
}
.appstyle .ib-color-default:hover,
.appstyle .iconbutton-default:hover
{	
	background-color: #BBBBBB;
	color: #464646; 
}