@font-face {
  font-family: 'SansPro-normal';
  src: url("https://seminare.bwnrw.de/customFiles/Fonts/SourceSansPro-Regular.ttf") format('truetype');
}

@font-face {
  font-family:'Font Awesome 5 Free';
  font-style: normal;
  font-weight: 900;
  src: url('https://seminare.bwnrw.de/customFiles/Icons/fa-solid-900.ttf') format('truetype')
}
  
@font-face {
  font-family:'Font Awesome 5 Free';
  font-style: normal;
  font-weight: 400;
  src: url('https://seminare.bwnrw.de/customFiles/Icons/fa-regular-400.ttf') format('truetype')
}


@media (max-width: 1500px) {
	div.headerAreaRight {
		display: none !important;
	}
	
	.extern-header-link {
		pointer-events: none;
	}
}

@media print {
	div.headerArea {
		display: none !important;
	}
	
	div#footer {
		display: none !important;
	}
}

 *:not(.fas):not(.far) {
	font-family: "SansPro-normal" !important;
  }


/* --------------------------------------------------------- */
/* -------------------Teilnehmeranmeldung -------------------*/



/* Anpasung Anmeldeprozess: Die Überschrift "Veransaltung" auf dem ersten und letzten Schritt ausblenden */
section[id^=register-steps] > div.ui-body.ui-body-a.ui-corner-all > h3:first-child,
section[id^=register-steps] > h3:first-child {
	display: none;
}

/* Text für AGB, Datenschutz in Anmeldung auch bold */
label[name=confirmLabel], label[name=confirmLabel] *, label[name=confirmDSGVOLabel], label[name=confirmDSGVOLabel] * {
	font-weight: bold !important;
}

/* Link in den Text rechts neben der Bestätigungs-Checkbox ist rot */
label[name=confirmLabel] a, label[name=confirmDSGVOLabel] a {
	color: rgb(229,78,77) !important;
}

/* Die "Fake-Mandatory"-Felder sind hellrot gefärbt */
.visual-mandatory, .visual-mandatory  * {
	background-color: rgb(249, 231, 231) !important;
}


select:required + span .select2-selection,
.visual-mandatory + span .select2-selection {
	background-color: rgb(249, 231, 231) !important;
}


/* Aktueller Step in rot*/
.wizard > .steps .current a {
	background: rgb(229,78,77) !important;
}

/* Buttons (Zurück/Weiter) in rot*/
.wizard > .actions a {
	background: rgb(229,78,77) !important;
}

/* Buttons unten mittig, nicht rechts */
.wizard > .actions {
	text-align: center !important;
}

/* Besuchte Steps in hellrot + schwarze Schrift*/
.wizard .steps li:not(.current):not(.disabled) a {
	background-color: rgb(249, 231, 231) !important;
	color: black !important;
}

/* Noch nicht besuchte Schritte im BBWNRW grau */
.wizard > .steps .disabled a, .wizard > .steps .disabled a {
	background: #98999b !important;
	color: white !important;
}

/* Pflichtfelder in hellrot */
input:required:not([disabled]), textarea:required:not([disabled]), .requiredInput:not(.select2-container-disabled), .requiredInput:not(.select2-container-disabled) > .select2-choice {
	background-color: rgb(249, 231, 231) !important;
}

/* Überschriften auch in rot */
#register-steps h1, #register-steps h2, #register-steps h3 {
	color: rgb(229,78,77) !important;
}

/* Hintergrund weiß */
.ui-page-theme-a {
	background-color: white !important;
}

/* Erster Schritt die Übersichtstabelle, alles in der linken Spalte in rot + fett */
table.eventHTMLDescription td:first-child {
	font-weight: bold !important;
	color: rgb(229,78,77) !important;
}

/* wir habe in die ShortNames der Meldezusätze Texte geschrieben, diese sind aber auch die Placeholder-Texte der Inputs, diese wollen wir nicht in Mobile*/
div[id="Weitere  Angaben"] input[id^="ReturnValue_"]::placeholder {
    color: transparent;
    opacity: 0;
}


/* --------------------------------------------------------- */
/* ---------------Ende Teilnehmeranmeldung ------------------*/


/* Header in Hellgrau */
div.headerArea {
	background-color: #eeeeee !important;
}

/* ------------------ Katalog ----------------------- */
/* Die Zahl für die Anzahl der Veranstaltungen im Product ausblenden */

button.expandButton {
	border-radius: 1em;
	background-color: rgb(229,78,77) !important;
}

#searchInputAreaHeader a.startSearch {
	background-color: rgb(229,78,77) !important;
	color: white !important;
}

label[for=onlyNewProducts] {
	font-weight: normal !important;
}

span.ui-li-count {
	display: none;
}

span.RankingWidget, .RankingWidgetContainer {
	display: none;
}

h1, h2, h3, h4 {
	color: rgb(229,78,77) !important;
}

div.FolderTitle {
	color: rgb(229,78,77) !important;
}

/* Titel des Productes in Liste rot */
h2 .TrainingProductTitleExplorerTitle {
	color: rgb(229,78,77) !important;
}
/* ID in schwarz*/
h2 .TrainingProductTitleExplorerID {
	color: black !important;
}
/* Die Breadcrums in hellrot */
.ui-page-theme-a .ui-btn.ui-btn-active {
	background-color: rgb(249, 231, 231) !important;
	color: black;
	border-color: black !important;
	
}

/* Abstand in der Liste der Bildungsprodukte, wenn man einen Ordner aufmacht */
#productListAreaExplorer .ui-listview li + li {
	margin-top: 15px;
}

/* Jetzt noch überall eine Border machen, sonst fehlt unten dir Border nämlich, die a-Tags haben die Border, nicht die li */
.ui-listview > li > a.ui-btn {
	border-width: 1px !important;
}

#footer * {
	color: white !important;
	text-decoration: none;
}

.headerArea a.ui-icon-home, .headerArea a[href="#menuPanel"] {
	background-color: rgb(229,78,77) !important;	
}
.headerArea a.ui-icon-home::after, .headerArea a[href="#menuPanel"]::after {
	 filter: invert(100%);
}

/* Die Area mit Filter fürProdukte mit Hintergrund*/
div#searchInputAreaHeader {
	
}

table.eventTable img {
	display: none !important;
}
table.eventTable td, table.eventTable th {
	padding: 5px 10px !important;
}

form#explorerSearchForm {
	max-width: 1250px;
	margin: 0 auto;
	padding: 10px 0 !important;
}

/* Alle Seiten Mobile sind nun mittig angeordnet */
.contentArea {
	padding: 0 !important;
	max-width: 1250px !important;
}

div#explorer {
	max-width: 1250px !important;
}

/* Breadcrumbs formatieren, aus BiWe geklaut */
#explorer > .ui-btn {
	border:0px solid black;
	background-color:transparent !important;
	padding:2em 0em 2em 0em;
	margin:0em;
}
#explorer > .ui-btn + .ui-btn:before {
	content:"/";
	padding-left:0.75em;
	padding-right:0.75em;
}
#explorer > .ui-btn > img {
	display:none;
}

div.FolderCell span.ui-li-count {
	display: none;
}

/* nur den Divs, die kein Bild haben, sonst scneidet das das Bild blöd ab :( */
div.FolderCell.FolderCellNoImage {
	height: 130px !important;
}

/* Sonst ist immer noch eine leere Stelle unten im Div wenn height = 370px wie im Standard */
div.FolderCell.FolderCellImage {
	height: auto !important;
}


/* Das Div, dass im Header hinzukommt */
div.headerAreaRight {
	position: absolute;
	top: 60px;
	left: 50%;
	transform: translate(-50%);
}

div.headerAreaRight a {
	color: white !important;
	text-decoration: none !important;
	line-height:40px;
	vertical-align:middle;
}

@media (min-width: 1200px) {
	div.headerArea {
		height: 60px;
		background-image:  url('https://ecadia.bwnrw.de/action?downloadDocumentKey=901NDo3pnMjr1CLblcKn97ZI22hxMdQ3w4VxDV3A'), url('https://ecadia.bwnrw.de/customFiles/Logos/sw_small.png') !important;
		background-position: 30% 10px, 70% 10px !important;
		background-repeat: no-repeat, no-repeat !important;
	}
}

div.FolderDescription {
	color: black !important;
	font-size: 18px;
}

.FolderCellNoImage div.FolderDescription {
	padding-right: 50px !important;
	padding-top: 10px !important;
}

/* Der TPC-Abstract des TPs soll auch rot sein */
a.explorerTrainingProductListItem p {
	color: rgb(229,78,77) !important;
	font-size: 14px;
}


div.ui-slider-bg.ui-btn-active {
	background-color: rgb(229,78,77) !important;
}

/* Sonst werden Wörter in den Kacheln blöd mitten im Wort getrennt, das sieht blöd aus ... */
.tileLayout .ui-listview p {
	hyphens: none !important;
}

/* Newsletter noch erstmal ausgeschaltet; RS, 21.12.2020 auskommentiert, weil so der letzte Eintrag im Katalog nicht mehr selektierbar war */
li.ui-li-has-count.ui-li-has-icon.ui-last-child > a {
	/* pointer-events: none; */
}

.newTrainingProductText {
	padding: 10px 30px;
    background-color: rgb(229,78,77) !important;
    color: white;
	text-transform: uppercase;
}


/* BWNRW will dass der Text im Katalog selektierbar ist. Anscheinend ist das standardmäßig nicht der Fall, weil dann Swipe auf dem Handy nicht mehr geht...
Ich ändere es trotzdem mal ab.
*/
.ecadiaMobilePage :not(INPUT):not(TEXTAREA):not(a), .unselectable {
    -webkit-user-select: auto !important;
    -moz-user-select: auto !important;
    -ms-user-select: auto !important;
    -o-user-select: auto !important;
    user-select: auto !important;
}

/* --- NEWSLETTER BEGINN--- */
#openSubscribePopup::after {
	display: none;
}

#openSubscribePopup {
	background-color: rgb(229,78,77);
	color: white;
}


#popupLogonNewsletterSubscription div.ui-btn.ui-input-btn.ui-corner-all.ui-shadow.ui-btn-inline.ui-icon-check.ui-btn-icon-left {
	background-color: rgb(229,78,77);
	color: white;
	font-weight: 400;
}
#popupLogonNewsletterSubscription div.ui-btn.ui-input-btn.ui-corner-all.ui-shadow.ui-btn-inline.ui-icon-check.ui-btn-icon-left::after {
	display: none;
}



/* --- NEWSLETTER ENDE--- */


/**
Button zum Abschicken einer Anfrage, wenn keine Termine zu einem Produkt verfügbar sind
*/
#infoRequestButtonContainer [name=infoRequestButtonSend] {
	color: white;
	background-color: rgb(229,78,77);
	font-weight: 100;
}

