/* ********************************************** */
/*   Benutzerdefinierte Anpassung von Styles      */
/*   für eigene Layouts diese Datei kopieren und  */
/*   in den gewünschten Bereichen anpassen        */
/* ********************************************** */

/* ********************************************** */
/*  Farbdefinitionen, Farben hier umsetzen		  */
/* ********************************************** */
:root {
	--nav_schrift_farbe: #EBECEE;		/* Schriftfarbe Navigation */
	--nav_bg_farbe: #00445B;			/* Hintergrundfarbe Navigation */
	--nav_schrift_inaktiv: #CCCCCC;		/* Schriftfarbe Naviagtion inaktiv */
	--nav_schrift_hover: #00445B;		/* Schriftfarbe Navigation bei hover*/
	--nav_bg_hover: #EBECEE;			/* Hintergrundfarbe Navigation bei hover */
	
	--frame_std_farbe: #00445B;			/* Standard für Rahmen */
	
	--table_odd: #FFFFFF;				/* Hintergrundfarbe Tabellenzeile ungerade */
	--table_even: #EBECEE;				/* Hintergrundfarbe Tabellenzeile gerade */
	--table_hover: #F2DEDE;				/* Hintergrundfarbe Tabellenzeile bei hover */
	--table_head: #FFFFFF;				/* Hintergrundfarbe Tabelle Kopfzeile */
}

/* ********************************************** */
/*  Produktseite "Kurs"			  	  */
/* ********************************************** */
#kurspreis {
	font-size: xx-large;
	font-style: bold;
}
#kursmwst {
	font-size: smaller;
	font-style: italic;
}
#kursort, #kursleiter, #kursmaxteil, #kursaktteil {
	font-size: bigger;
}
#kursdescript {
	font-size: bigger;
	padding: 30px 10px 10px 10px;
}


/* ********************************************** */
/*  Listen (Kategorie und Produkte)			  	  */
/* ********************************************** */
.listview {
}
.listview .item {
	border: 1px solid var(--frame_std_farbe);
	border-radius: 5px;
}
.listview .item img {
	max-height: 300px;
}
.listview .title {
	font-weight: bold;
	background-color: rgba(127,127,127,0.5);
	color: white;
}
.listview .title-top {
	border-radius: 5px 5px 0 0;
}
.listview .title-bottom {
	border-radius: 0 0 5px 5px;
}
.listview .navi {
	font-weight: bold;
	color: black;
}
.listview .navi-disabled  {
	color: #cccccc !important;
	cursor: not-allowed;
}

/* ********************************************** */
/*  Brotkrumen Navigation			  	  */
/* ********************************************** */
.bc li a {
	color: black;
	background: #cccccc; 
}
.bc li a::after {
	border-left-color: #cccccc;
}
.bc li a::before { 
	border-left-color: 30px solid white;
}
.bc li.active a { 
	background: lightblue; 
	color: white;
}
.bc li.active a:after { 
	border-left-color: lightblue !important; 
}
.bc li a:hover { 
	background: coral; 
}
.bc li a:hover:after { 
	border-left-color: coral !important; 
}

/* ********************************************** */
/*  Markierung notwendiger Eingabefelder		  */
/* ********************************************** */
input:required {
	background-image: url('https://cdn.webkurs.app/image/ico16/star.png');
	background-position: right 10px center;
	background-repeat: no-repeat;
	padding-right: 30px;
}
select:required {
	background-image: url('https://cdn.webkurs.app/image/ico16/star.png');
	background-position: right 30px center;
	background-repeat: no-repeat;
	padding-right: 30px;
}


/* ********************************************** */
/*  Spezielle Definitionen für elemente			  */
/* ********************************************** */
header {
	border: 1px var(--frame_std_farbe) dotted;
	background-image: url('https://cdn.webkurs.app/image/elements/logohead.png');
	color: white;
	text-shadow: 0 0 10px black;
}
section, nav {
	border-left: 1px var(--frame_std_farbe) dotted;
	border-right: 1px var(--frame_std_farbe) dotted;
}
footer {
	border: 1px var(--frame_std_farbe) dotted;
	color: #FFFFFF;
	background-color: #00445B;
}
footer a {
	color: white !important;
}
button {
	margin-top: 5px;
}
table > thead > tr {
	border-top: 1px #000000 solid;
	border-bottom: 1px #000000 solid;
}
.stdform {
	border: 1px #EBECEE solid;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	padding: 5px;
	margin-bottom: 10px;
	margin-top: 10px;
}
.note {
	color: #CCCCCC;
	font-size: smaller;
	font-weight: normal;
}

/* ********************************************** */
/*  REINE UMSETZUNGEN AB HIER KEINE ÄNDERUNGEN    */
/*  MEHR NOTWENDIG !!!!!!						  */
/* ********************************************** */

.navbar-default {
	background-color: var(--nav_bg_farbe);
	color: var(--nav_schrift_farbe);
}
.navbar-default .navbar-brand,
.navbar-default .navbar-text,
.navbar-default .navbar-nav > li > a {
	color: var(--nav_schrift_farbe);
}
.navbar-default .navbar-brand:hover,
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover {
	color: var(--nav_schrift_hover);
	background-color: var(--nav_bg_hover);
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
	color: var(--nav_schrift_farbe);
	background-color: var(--nav_bg_farbe);
}
.navbar-default .navbar-nav > .disabled > a,
.navbar-default .navbar-nav > .disabled > a:hover,
.navbar-default .navbar-nav > .disabled > a:focus {
	color: var(--nav_schrift_inaktiv);
	background-color: var(--nav_bg_farbe);
}
@media (max-width: 767px) {
	.navbar-default .navbar-nav .open .dropdown-menu > li > a {
		color: var(--nav_schrift_farbe);
	}
	.navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
	.navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
		color: var(--nav_schrift_hover);
		background-color: var(--nav_bg_hover);
	}
	.navbar-default .navbar-nav .open .dropdown-menu > .active > a,
	.navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
	.navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
		color: var(--nav_schrift_farbe);
		background-color: var(--nav_bg_farbe);
	}
	.navbar-default .navbar-nav .open .dropdown-menu > .disabled > a,
	.navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover,
	.navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus {
		color: var(--nav_schrift_inaktiv);
		background-color: var(--nav_bg_farbe);
	}
}
.table-striped > tbody > tr:nth-of-type(odd) {
	background-color: var(--table_odd);
}
.table-striped > tbody > tr:nth-of-type(even) {
	background-color: var(--table_even);
}
.table-hover > tbody > tr:hover {
	background-color: var(--table_hover);
}
table > thead > tr {
	background-color: var(--table_head);
}