﻿/*
	M3Web-Design: Erscheinungsbild von Navigationselementen
	(Links, Buttons, Menü und Notifications)
	
	- wird nach layout.css und style.css geladen
*/

/* ==== Links ==== */

a
{
	cursor: pointer;
	color: #0468B1;
}


/* ==== Bootstrap Fixes ==== */


.nav-stacked > li + li > a
{
	border-top: 0;
}

.level1 > li
{
	z-index: 550;
}

.level1 > li.dropdown
{
	z-index: 551;
}

.level1 + .level1 > li
{
	z-index: 540;
}

.level1 + .level1 > li.dropdown
{
	z-index: 541;
}

.level2 > li
{
	z-index: 560;
}

.level2 > li.dropdown
{
	z-index: 561;
}


/* ==== Hauptmenü ==== */

body.responsive .menu-icon-only .menu-icon
{
	margin-right: 0;
}

.menu-icon,
.nav-collapse.in .menu-icon-only .menu-icon
{
	margin-right: 7px;
}



.menu-caret,
.btn .menu-caret
{
	margin-left: 5px;
}

.menu-icon-only > .menu-name,
.menu-icon-only > .caret
{
	display: none;
}

/*.page-actions .btn
{
	padding: 5px 0px;
}*/


.btn-group
{
	/* notwendig bei "zeilenumbruch" für buttons */
	margin-top: 5px;
	margin-bottom: 5px;
}

.dropdown-menu
{
	z-index: 1001;
}

.dropdown-menu img
{
	max-width: 16px !important;
	max-height: 16px !important;
}

.nav-collapse .dropdown-menu
{
	background: #fff;
}

i.menu-icon,
span.menu-icon
{
	display: inline-block;
	min-width: 15px;
	text-align: center;
}

.dropdown-menu button
{
	width: 100%;
	font-weight: normal;
	white-space: nowrap;
	border: none;
	text-align: left;
}

.dropdown-menu i.menu-icon,
.dropdown-menu button,
.dropdown-menu a
{
	color: #0468B1;
	background: #fff;
}

.dropdown-menu .active i.menu-icon,
.dropdown-menu a:hover i.menu-icon,
.dropdown-menu button:hover i.menu-icon
{
	color: inherit;
	background: inherit;
}

.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus,
.dropdown-menu > .active > button,
.dropdown-menu > .active > button:hover,
.dropdown-menu > .active > button:focus
{
	color: #0468B1;
	background-color: #d1e3f1;
}


#header .navbar,
#header .navbar-inner,
#header .btn-group
{
	margin: 0;
	padding: 0;
	border: 0;
	/*height: 80px;*/
	min-height: 80px;
	border-radius: 0;
	background: none;
	text-shadow: none;
	filter: none;
}

#header-menu i.menu-icon
{
	font-size: 16px;
}


#header .nav,
#header-menu .nav-tabs > li,
#header .nav-tabs
{
	/* bootstrap-unterstrich der tabs zurücksetzen */
	margin-bottom: 0;
}

#header .navbar,
#header .navbar-inner,
#header .btn
{
	box-shadow: none;
}

#header .nav.level1 > li > a
{
	background: transparent;
	padding: 5px 10px;
	line-height: 30px;
	margin: 0;
	font-size: 1.1em;
	color: #ffffff;
	border-radius: 0;
	border: 0;
	/*min-width: 100px;*/
	text-shadow: none;
	max-height: 30px;
	overflow: hidden;
}

#header .nav.level1 > li > a.menu-icon-only
{
	width: auto;
	min-width: 0;
}

#header .nav.pull-right > li > a
{
	/*text-align: right;*/
}

#header .nav > li > a:hover,
#header .nav > li > a:focus
{
	text-decoration: none;
	background-color: #0468B1;
	border: 0;
}

#footer .nav > li > a:hover,
#footer .nav > li > a:focus
{
	text-decoration: none;
	background-color: #D9E8F3;
	color: #0468B1;
	border: 0;
}

@media (min-width: 980px)
{
	body.responsive #header .nav.level1 > li.active,
	body.responsive #header .nav.level1 > li.active > a
	{
		box-shadow: rgba(255, 255, 255, 1.0) 0px 10px 0px 0px;
	}
}

@media (min-height: 480px)
{
	body.scrolled #header .nav.level1 > li.active,
	body.scrolled #header .nav.level1 > li.active > a
	{
		box-shadow: none;
	}
}

@media (max-width: 979px) and (min-height: 480px)
{
	body.responsive #header .nav.level1 > li.active
	{
		box-shadow: none;
	}
}

#header .nav.level1 > li.active > a,
#header .nav.level1 > li.active > a:hover,
#header .nav.level1 > li.active > a:focus
{
	color: #0468B1;
	background: #ffffff;
	font-weight: bold;
}

#header .nav.level1 > li
{
	height: 40px;
	max-height: 40px;
}


#header span.caret
{
	border-top-color: #FFF;
	margin-top: 13px;
	margin-left: 5px;
}

#header li.active span.caret
{
	border-top-color: #0468B1;
}



@media (min-width: 980px) and (max-width: 1199px)
{
	/* Menütext bei kleiner Auflösung verbergen */
	body.responsive #menu-settings.level1 > li > a > .menu-name
	{
		display: none;
	}
}

@media (max-width: 979px)
{
	/* Icon-Only-Menüpunkte bei .nav-bar.collapsed mit text anzeigen */
	body.responsive #header .nav-collapse a.menu-icon-only > .menu-name,
	body.responsive #header .menu-icon-only > .menu-name,
	body.responsive #header .menu-icon-only > .caret
	{
		display: inline-block;
	}

	body.responsive #header-menu
	{
		margin-top: 0;
		margin-left: 0;
	}


	body.responsive #header-menu ul + ul
	{
		border-top: 1px solid rgba(255, 255, 255, 0.2); /*#D9E8F3*/
	}

	body.responsive #header .nav > li > a:hover,
	body.responsive #header .nav > li > a:focus
	{
		background-color: rgba(255, 255, 255, 0.2); /*#D9E8F3;*/
		/*color: #0468B1;*/
	}
}



	/* ==== Menüs ==== */



.page-actions
{
	margin: 0;
}

.page-actions .btn-toolbar
{
	margin-top: 0px;
	margin-bottom: 20px;
	min-height: 30px;
}


.page-actions .btn-group
{
	margin: 0;
}

.page-actions .btn /* .form-actions .btn */
{
	border: none !important;
	background: none !important;
	box-shadow: none !important;
	color: #0468B1 !important;
	text-shadow: none !important;
}

.selection-toggle .btn,
.no-border .btn
{
	border: none !important;
}

.page-actions .btn > .caret
{
	border-top-color: #0468B1;
}

.page-actions .btn,
.form-actions .btn
{
	min-height: 30px;
}

.page-actions .btn:hover /* .form-actions .btn */
{
	background: #D9E8F3 !important;
}


@media (max-width: 979px)
{
	body.responsive .form-actions .menu-name,
	body.responsive .page-actions .menu-name
	{
		display: none;
	}

	body.responsive .form-actions .dropdown-menu .menu-name,
	body.responsive .form-actions .btn-primary .menu-name,
	body.responsive .page-actions .dropdown-menu .menu-name,
	body.responsive .page-actions .btn-primary .menu-name
	{
		display: inline-block;
	}

	body.responsive .form-actions .menu-icon,
	body.responsive .page-actions .menu-icon
	{
		margin-right: 0;
	}

	body.responsive .form-actions .dropdown-menu .menu-icon,
	body.responsive .form-actions .btn-primary .menu-icon,
	body.responsive .page-actions .dropdown-menu .menu-icon,
	body.responsive .page-actions .btn-primary .menu-icon
	{
		margin-right: 7px;
	}
}


	/* ==== Tabs ==== */

.nav-tabs
{
	border-bottom: 2px solid #0468B1;
}

.nav-tabs > li
{
	margin: 0;
}

.nav-tabs > li > a,
.nav-tabs > .active > a,
.nav-tabs > .active > a:hover,
.nav-tabs > .active > a:focus
{
	margin-right: 0;
	border: none;
	border-radius: 0;
	color: #0468B1;
}

.nav-tabs > .active > a,
.nav-tabs > .active > a:hover,
.nav-tabs > .active > a:focus
{
	background: #0468B1;
	color: #fff;
	font-weight: bold;
}

.nav-tabs > a:hover,
.nav-tabs > a:focus
{
	background: #D9E8F3;
}



/* ==== List/Detail-Kombi-Ansicht ==== */



@media (min-width: 768px)
{
	.row-fluid.split-view > .entity-selection
	{
		width: 25%;
	}

	.row-fluid.split-view > .entity-details
	{
		margin-left: 0;
		width: 75%;
	}
}

@media (min-width: 768px) and (max-width: 979px)
{
	.row-fluid.split-view > .entity-selection
	{
		width: 30%;
	}

	.row-fluid.split-view > .entity-details
	{
		margin-left: 0;
		width: 70%;
	}
}


	/* ==== Auswahllisten ==== */


.nav-list.entity-list > .active > a,
.nav-list.entity-list > .active > a:hover,
.nav-list.entity-list > .active > a:focus
{
	background-color: transparent;
}

.entity-selection .nav-list
{
	padding: 0;
}

.entity-list .entity
{
	/* li.entity */
	border-left: 5px solid #0468B1;
	background-color: #F2F2F2;
	color: #7F7F7F;
	margin-bottom: 3px;
	padding: 0 15px;
	margin-right: 10px;
}

.entity-selection h4
{
	color: #0468B1;
}

.entity a span
{
	color: #7F7F7F;
}

.entity-selection .entity
.entity-selection a,
.entity-selection a:hover,
.entity-selection a:focus,
.entity-selection a:active,
.entity-selection .nav-list > li > a,
.entity-selection .nav-list > .active > a,
.entity-selection .nav-list > .active > a:hover,
.entity-selection .nav-list > .active > a:focus,
.entity-selection .nav-list .nav-header
{
	text-shadow: none !important;
	text-decoration: none !important;
	background-color: initial !important;
}

.entity-selection .selection-toggle
{
	padding: 0 0px;
}

.entity-selection .selection-toggle .btn-toolbar
{
	margin: 0;
}


.entity-selection a:hover,
.entity-selection a:focus,
.entity-selection .nav > li > a:hover,
.entity-selection .nav > li > a:focus
{
	background-color: #D9E8F3
}

.entity-selection .selected a:hover,
.entity-selection .selected a:focus,
.entity-selection .nav > li.selected > a:hover,
.entity-selection .nav > li.selected > a:focus
{
	background-color: transparent;
}

/* Darstellung verschiedener Selektionszustände */

.entity-list .entity.selected,
.entity-list .entity.active
{
	border-left-color: #0468B1;
	background-color: #D9E8F3;
	margin-right: 0px;
	padding-right: 25px;
}

.entity-list .entity.disabled
{
	border-left: 5px solid #7F7F7F;
	background-color: #F2F2F2;
}

.entity-list .entity.disabled,
.entity-list .entity.disabled a,
.entity-list .entity.disabled a:focus,
.entity-list .entity.disabled a:hover
{
	color: #7F7F7F;
}

.entity-list .entity.active
{
	border-left-color: #B2B2B2;
	background-color: #D9E8F3;
}

/* Fixes für Accordion */

.entity-selection .accordion-group,
.entity-selection .accordion-toggle,
.entity-selection .accordion-inner
{
	border: none;
	padding: 0;
	margin: 0;
}

.entity-selection .accordion-heading
{
	margin-bottom: 3px;
}

.entity-selection .accordion-heading h4
{
	margin: 0;
}

.entity-selection .accordion-heading a:hover h4,
.entity-selection .accordion-heading a:focus h4
{
	color: #0468B1;
}


.entity-selection .accordion-heading a,
.entity-selection .accordion-heading a.collapsed:hover
{
	padding: 10px 20px 10px 0;
	background: url(/Public/Images/Herbstwest/Icons/Dropdown-pos_18x18px.png) left no-repeat;
	padding-left: 25px;
}

.entity-selection .accordion-heading a.collapsed
/*.entity-selection .accordion-heading a:hover*/
{
	background-image: url(/Public/Images/Herbstwest/Icons/Dropright-pos_18x18px.png);
}

@media (max-width: 979px)
{
	body.responsive .entity-selection[class*="span"]
	{
		margin-bottom: 20px;
	}
}

	/* ==== Kontextmenü ==== */



	/* ==== Buttons ==== */



	/* ==== Notifications ==== */



#toast
{
	border-radius: 5px;

	background-color: rgba(31, 160, 254, 0.9);
	border: 1px solid #fff;
	color: #fff;

	position: fixed;
	top: 20px;
	left: 50%;
	width: 200px;
	margin-left: -100px;
	padding: 5px 0;
	text-align: center;
	opacity: .9;
	z-index: 9999;

	/*The good stuff */
	-webkit-transition: opacity 0.5s ease-out; /* Saf3.2+, Chrome */
	-moz-transition: opacity 0.5s ease-out; /* FF4+ */
	-ms-transition: opacity 0.5s ease-out; /* IE10? */
	-o-transition: opacity 0.5s ease-out; /* Opera 10.5+ */
	transition: opacity 0.5s ease-out;
}

div.notify,
div.validation-summary-errors,
/* Alle Benachtigungen */
div.validation-summary-valid
{
	background: rgba(178, 178, 178, 0.1);
	background-image: url(/Public/Images/Herbstwest/Icons/Hinweis-neg_28x28px.png);
	background-position: 10px 10px;
	background-repeat: no-repeat;
	
	border: 0px solid #fbeed5;
	font-weight: bold;
	color: #C09853;
	
	min-height: 35px;
	padding-left: 50px;
	padding-top: 5px;

	text-shadow: none !important;
	margin: 0;
}

div.validation-summary-errors,
div.validation-summary-valid
{
	margin-top: 20px;
	margin-bottom: 20px;
	border-radius: 5px;
	min-height: 45px;
}

div.notify a
{
	color: #fff;
	text-decoration: underline;
}

.notifications .alert + .alert button
{
	display: none;
}

.alert
{
	/* Einzelne Notifications innerhalb der Seite */
	border-radius: 1;
}

#notifications .alert
{
	/* Notifications innerhalb der globalen Notifications */
	border-radius: 0;
}


div.notify button.close
{
	font-size: 18px;
	opacity: 1;
	text-shadow: none;
	color: #fff;
	padding: 2px;
	margin: 0;
}

div.notify button.close .menu-icon
{
	margin: 0;
}

div.notify
{
	max-height: 100px;
	overflow: auto;
}

div.notifications
{
	max-height: 500px;
	overflow: auto;
}

div.notify span.title,
div.notify h4
{
	font-weight: bold;
	color: inherit;
}

div.notify-debug
{
	background-image: url(/Public/Images/Herbstwest/Icons/Hinweis-neg_28x28px.png);
	background-color: rgba(178, 178, 178, 0.9);
	border-color: #ccc;
	color: #333;
}

div.notify-success
{
	background-image: url(/Public/Images/Herbstwest/Icons/Hinweis-Feedback-neg_28x28px.png);
	background-color: rgba(7, 176, 11, 0.9);
	border-color: #ccc;
	color: #fff;
}

.notifications div.notify-success + div.notify-success
{
	background-image: none;
}

div.notify-info
{
	background-image: url(/Public/Images/Herbstwest/Icons/Hinweis-neg_28x28px.png);
	background-color: rgba(31, 160, 254, 0.9);
	border-color: #ccc;
	color: #fff;
}

div.notify-warning
{
	background-image: url(/Public/Images/Herbstwest/Icons/Hinweis-Warnung-neg_28x28px.png);
	background-color: rgba(255, 213, 16, 0.9);
	border-color: #ccc;
	color: #333;
}

div.notify-error,
div.validation-summary-errors
{
	background-image: url(/Public/Images/Herbstwest/Icons/Hinweis-Fehler-neg_28x28px.png);
	background-color: rgba(227, 20, 24, 0.9);
	border-color: #ccc;
	color: #fff;
}

div.notify-fatal
{
	background-image: url(/Public/Images/Herbstwest/Icons/Hinweis-Fehler-neg_28x28px.png);
	font-weight: bold;
	background-color: rgba(227, 20, 24, 0.9);
	border-color: #ccc;
	color: #fff;
}

div.notify-question
{
	background-color: rgba(4, 104, 177, 0.9);
	background-image: url(/Public/Images/Herbstwest/Icons/Hilfe-neg_28x28px.png);
	color: #fff;
}


/* ==== Dashboard-Menü ==== */

.dash + .dash
{
	margin-top: 40px;
}

.dash ul
{
	width: 100%;
}

.row-dash
{
	display: table;
	width: 100%;
	content: "";
}

@media (max-width: 979px) and (min-width: 768px)
{
	.row-fluid:after
	{
		clear: both;
	}
}
	

.row-dash .tile
{
	/*padding: 10px;*/
	margin: 0;
}


body.not-responsive .row-dash .tile
{
	float: left;
}

body.not-responsive .row-dash .tile1
{
	width: 100%;
}

body.not-responsive .row-dash .tile2
{
	width: 50%;
}

body.not-responsive .row-dash .tile3
{
	width: 33.33%;
}

body.not-responsive .row-dash .tile3:last-child
{
	width: 33.34%;
}

body.not-responsive .row-dash .tile4
{
	width: 25%;
}

body.not-responsive .row-dash .tile5
{
	width: 20%;
}

body.not-responsive .row-dash .tile6
{
	width: 16.66%;
}

body.not-responsive .row-dash .tile6:last-child
{
	width: 16.67%;
}

body.not-responsive .row-dash .tile8
{
	width: 12.5%;
}

body.not-responsive .row-dash .tile10
{
	width: 10%;
}


@media (min-width: 768px)
{
	.row-dash .tile
	{
		float: left;
	}

	.row-dash .tile1
	{
		width: 100%;
	}

	.row-dash .tile2
	{
		width: 50%;
	}

	.row-dash .tile3
	{
		width: 33.33%;
	}

	.row-dash .tile3:last-child
	{
		width: 33.34%;
	}

	.row-dash .tile4
	{
		width: 25%;
	}

	.row-dash .tile5
	{
		width: 20%;
	}

	.row-dash .tile6
	{
		width: 16.66%;
	}

	.row-dash .tile6:last-child
	{
		width: 16.67%;
	}

	.row-dash .tile8
	{
		width: 12.5%;
	}

	.row-dash .tile10
	{
		width: 10%;
	}
}

@media (max-width: 767px)
{
	.dash .row-dash + .row-dash
	{
		margin-top: 10px;
	}
}

.dash ul li
{
	float: left;
}

.dash a
{
	display: block;
	height: 160px;
	vertical-align: middle;

	/* wie fieldset */
	background: #f2f2f2;
		
	border-color: transparent;
	border-style: solid;
	border-width: 1px;
		
	font-weight: bold;
	font-size: 12pt;
	
	color: #0468B1;
	display: block;
	padding: 20px 20px;
	min-height: 100%; /* Mindesthöhe für moderne Browser */
	height: auto !important; /* Important Regel für moderne Browser */
	height: 100%; /* Mindesthöhe für den IE */
	overflow: hidden !important; /* FF Scroll-leiste */

	/*box-shadow: rgba(200, 200, 200, 0.2) 0px 0px 10px 0px;*/
	border: 1px solid rgba(200, 200, 200, 0.1);
	margin: 0px;
}

.dash .row-dash > .tile + .tile
{
	margin-top: 10px;
}

.dash a:hover,
.dash a:active
{
	background: #d9e8f3;
	border: 1px solid rgba(4, 104, 177, 0.1);
	/* box-shadow: rgba(26, 26, 26, 0.2) 0px 0px 10px 0px; */
	text-decoration: none;
	/*margin: 9px;*/
}

body.not-responsive .dash a .menu-icon
{
	margin-right: 20px;
}

body.not-responsive .dash a
{
	text-align: center;
	padding: 20px 10px;
	min-height: 115px;
	margin: 10px;
}

body.not-responsive .dash > .row-dash > .tile + .tile
{
	margin: 0;
}

body.not-responsive .dash > .row-dash:first-child a
{
	margin-top: 0;
}

body.not-responsive .dash a .menu-icon,
body.not-responsive .dash a .menu-name
{
	display: block;
	margin: 0 auto;
	width: 100%;
	text-align: center;
}

body.not-responsive .dash a .menu-icon
{
	margin-bottom: 20px;
}

@media (min-width: 768px)
{
	.dash a
	{
		text-align: center;
		padding: 20px 10px 10px 10px;
		min-height: 115px;
		margin: 3px;
	}

	.dash > .row-dash > .tile + .tile
	{
		margin: 0;
	}

	.dash > .row-dash:first-child a
	{
		margin-top: 0;
	}

	.dash a .menu-icon,
	.dash a .menu-name
	{
		display: block;
		margin: 0 auto;
		width: 100%;
		text-align: center;
		min-height: 40px;
	}

	.dash a .menu-icon
	{
		margin-bottom: 20px;
	}
}

.dash a .menu-icon
{
	vertical-align: middle;
	text-align: center;
	line-height: 70px;
	font-size: 70px;
	height: 70px;
	min-width: 70px;
}

@media (max-width: 767px)
{
	.dash a .menu-icon
	{
		display: inline-block;
		margin-right: 20px;
	}

	.dash a .menu-icon img
	{
		vertical-align: baseline;
	}

	body.responsive .dash .row-fluid > div + div
	{
		margin-top: 10px;
	}
}

	/* ==== Tables ==== */

.table-striped tbody > tr:nth-child(even) > td,
.table-striped tbody > tr:nth-child(even) > th
{
	background-color: #fcfcfc;
}

.table-hover tbody tr:hover > td,
.table-hover tbody tr:hover > th
{
	background-color: #fff;
}

.table td > a
{
	display: block;
}

.table td > a:hover
{
	/*background-color: #eeeeee;*/
}

table.statusborder tbody tr
{
	border-left: 5px solid blue;
}

table.statusborder thead tr
{
	border-left: 5px solid darkgray;
}

table.table-condensed thead tr
{
	background-color: darkgray;
	color: white;
}

table.table-condensed tbody tr
{
	margin-bottom: 2px;
}

table.table-condensed tbody tr a
{
	font-weight: bold;
}