﻿
/* Standard-CSS laden */
@import url('/App_Themes/global/standard.css');

/* Info, feste Farbnamen: https://www.w3.org/TR/css-color-3/#svg-color */

/* loading of fonts */ 
/* Source Sans Pro Regular */
@font-face {
  font-family: 'Source Sans Pro';
  src: url('SourceSansPro-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Source Sans Pro Italic */
@font-face {
  font-family: 'Source Sans Pro';
  src: url('SourceSansPro-Italic.woff2') format('woff2');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

/* Source Sans Pro Bold */
@font-face {
  font-family: 'Source Sans Pro';
  src: url('SourceSansPro-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}


:root {	
/* Basis-Einstellungen */	

	/* Größen */
		--text-size: 16px;  	   /* Textgröße | hierauf beziehen sich alle Größenangaben in rem. Die text-size entspricht 1rem */
		--page-width: 1280px;      /* Breite des iFrames */
		--tile-width: 300px;       /* Kartengröße */
		--tile-height: 300px;      /* Karten-Höhe */
		--tile-img-height: 200px;  /* Karte: Höhe des Bildes | es sollten ca. 50px bis 100px Platz für die Themenbezeichung bleiben */

	/* Farben */
		--primary-color: #017e94;          /* Primärfarbe | Buttons, H1 */
		--secondary-color: #d4d4d4;      /* Sekundärfarbe | Hintergrund Tabellenüberschrift, Button-hover, Button-selected, H2, z.B. dunkelgrau  */
		--primary-text-color: #333333;	   /* Textfarbe primär | Fließtext */
		--secondary-text-color: white;     /* Textfarbe sekundär | alternative Textfarbe z.B. in Buttons z.B. weiß oder hellgrau */	
		--alternating-bgcolor: #f2f2f2;	   /* Hintergrundfarbe alternierend | alternierender Hintergrund in Listen, Hintergrund Eingabefelder, etc.  */
		--border-color: #CCCCCC;		   /* Rahmenfarbe | für Boxen, Tabellen, Eingabefelder, ... */

	/* Eckigkeit */
		--button-border-radius: 7px;		/* Rundung Buttons */
		--inputfield-border-radius: 4px;   	/* Rundung Eingabefelder | in Formularen */ 
		--box-border-radius: 4px;           /* Rundung Rahmen | bei Boxen oder Tabellen, die einen Rahmen haben */ 
		--img-radius: 2px;                  /* Rundung Bilder | bei Bildern ohne Rahmen */


	/* Seiten-Einstellungen */
	--page-bgcolor: transparent;	              /* Hintergrundfarbe | des gesamten iFrames. Standard "transparent" zeigt den Hintergrund der umgebenden Site */
	--mainblock-padding: 1.5rem;                  /* Abstand Seitenblöcke | nach unten zwischen den Haupt-Seitenblöcken, wie z.B. anmeldung_oben, anmeldung_mitte, ...  */
	--navigation-bgcolor: var(--primary-color);	  /* Hintergrundfarbe Navigation */
	--footer-bgcolor: var(--primary-color);       /* Hintergrundfarbe Seitenfuß */
	
	/* Text- Einstellungen */ 	
	--text-lineheight: 1.5em;				/* Zeilenabstand */
	--text-font-family: 'Source Sans Pro';	    /* Standardschrift */
	--text-warning-color: red;				/* Schriftfarbe Fehlermeldungen */
	
	/* Beschriftungen/Feldüberschrift, z.B. der Titel eines Beschreibungsfeldes oder eines Eingabefeldes */
	--outputfield-label-color: var(--primary-text-color);
	--outputfield-label-fontweight: bold;
	--outputfield-label-fontsize: var(--text-size);
	--outputfield-label-lineheight: 2.5rem;	
	
	/* große Überschriften (z.B. Themenbereich, Thema, etc.) */
	--bigheader-fontweight: bold;
	--bigheader-fontsize: 2.5rem;
	--bigheader-color: var(--primary-color);	

	/* kleine Überschriften, z.B. */
	--smallheader-fontweight: bold;
	--smallheader-fontsize: 1.5rem;
	--smallheader-color: var(--primary-text-color);
	
	/* Seminartitel */
	--seminartitle-fontweight: bold;
	--seminartitle-fontsize: 1.8rem;
	--seminartitle-color: var(--primary-color);
	--seminar-subtitle-color: var(--primary-text-color);	

	/* Bilder */
	--thbild-width: 21rem;               /* Themenbild Breite */
	--thbild-display: inline;            /* Themenbild in Th-Details | Kartenbild in den Themendetails anzeigen (inline) oder nicht (none) */
	--thbild-regform-display: inline;    /* Themenbild in Am-Form | Kartenbild im Anmeldeformular anzeigen (inline) oder nicht (none)   */
	--thkopfbild-display: inline-block;  /* Kopfbild Treeview | Kopfbild in der Treeview anzeigen (inline-block) oder nicht (none)  */
	--trbild-width: 4.5rem;              /* Trainerbild Breite */
	--trbild-display: inline;            /* Trainerbild Anzeige | block, um das Bild unterhalb des Namens anzuzeigen, sonst: inline   */
	--trbild-float: left;                /* Trainerbild float | left oder right für display inline, none für display block          */
	--header-logo-left-width: 20rem;	 /* Headerbild links Breite | Breite des linken Logos über der Navigationszeile */
	--header-logo-right-width: 20rem; 	 /* Headerbild rechts Breite |Breite des rechten Logos über der Navigationszeile */
	
	/* Eingabefelder */
	--inputfield-textcolor: var(--primary-text-color);
	--inputfield-fontweight: initial;
	--inputfield-bgcolor: var(--alternating-bgcolor);
	--inputfield-border: 1px solid var(--border-color);
	--inputfield-width: 20rem;		
	--inputlabel-width: 11rem;
	--inputfield-focus-outline: initial;
	--inputfield-focus-border-top: 1px solid var(--primary-color);
	--searchfield-hover-color: var(--secondary-color);
		
	/* tables and boxes */
	--box-indent: 1rem;
	--box-heading-bgcolor: var(--secondary-color);
	--box-heading-color: var(--primary-text-color);	
	--box-border: 1px solid var(--border-color);
	--box-header-border: var(--box-border);		
	--boxcell-padding-right: 1.3rem;
	--boxcell-padding-topbottom: 0.75rem;
	--boxcell-valign: middle; /* für Treeview und Kartenansicht: top, middle, bottom */
	--boxcell-chrono-valign: center; /* dasselbe für chrono-Ansicht: flex-start, center, flex-end */	
	--grid-month-bgcolor: white;
	--grid-month-textsize: 2rem;
	--grid-month-textcolor: var(--primary-text-color);
	--grid-month-height: 5rem; 
	--grid-invisible-columns: 0; /* Verringert die Spaltenzahl im Grid um diesen Wert, z.B. wenn TN-Gebühr und Gebühr intern je nach iFrameName ein-/ausgeblendet sind */
	--regform-gridhead-border-bottom: var(--box-border);  /* Linie unter Rasterzellenüberschrift im Anmeldeformular */
	--history-bgcolor: var(--alternating-bgcolor);
	
	/* Symbole */
	--bulletpoint-color: black;
	--checked-definitive-color: green;
	--regform-open-icon: url(/App_Themes/global/open_icon.png);
	--regform-close-icon: url(/App_Themes/global/close_icon.png); 
	
	/* Buttons und Links */	
	--button-bgcolor: #016d80;
	--button-textcolor: white;
	--button-textsize: 1rem;
	--button-border: 3px solid;
	--hover-button-bgcolor: #017E93;
	--hover-button-textcolor: var(--secondary-text-color);
	--hover-button-border: 3px solid;
	--link-text-color: var(--primary-text-color);

	/* Ampel */
	--trafficlight-red-color: #f63B3B;
	--trafficlight-red-image: none;				/* z.B. url('/App_Themes/academy.evidenz.de/stuhl-gruen.png') */
	--trafficlight-yellow-color: #fFe610;
	--trafficlight-yellow-image: none;
	--trafficlight-green-color: #A2E61B;	
	--trafficlight-green-image: none; 
	--trafficlight-size: 1.26rem;
	--trafficlight-radius: 0.66rem;  
	
	/* Kartenansicht */		
	--tile-bgcolor: transparent;
	--tile-title-fontweight: normal;
	--tile-title-fontsize: var(--smallheader-fontsize);
	--tile-title-color: var(--primary-text-color);
	--tile-transform: scale(1.02, 1.02);
	--description-indent: var(--box-indent);     			
	--description-border: var(--box-border);    /* wenn der Beschreibungsblock ohne Rahmen sein soll: none. Indent dann auf 0 setzen */
	
	/* Treeview */
	--treeview-transform: scale(1.002, 1.002);
}


/* ############################### */
/* # kundenspezifische Styles    # */
/* ############################### */

/* Anmeldeformular und Bildungsbedarf/Wartelistenformular */

/* Wenn einzelne Rasterzellen beim Öffnen zugeklappt sein sollen ### kann raus, wenn die einstellbarkeit in der Adminseite funktioniert ### */
.am_inhalt_rasterzelle1_rahmen {
	/* display: none; */
}
.bm_inhalt_rasterzelle1_rahmen {
	/* display: none; */
}
.am_inhalt_rasterzelle7_rahmen {
	display: none; 
}
.bm_inhalt_rasterzelle7_rahmen {
	display: none; 
}
.am_inhalt_rasterzelle8_rahmen {
	display: none; 
}
.bm_inhalt_rasterzelle8_rahmen {
	display: none; 
}


/* Loginbereich, Bildungshistorie*/
/* Filter ausblenden */
#Filterbildungshistorie_Ve_Bezeichnung, #Filterbildungshistorie_Ve_OrtOrt, #Filterbildungshistorie_Am_Status {
    display: none; 
}
/* Text zu bestimmten Filterbeschriftungen hinzufügen */
#cph_body_mitte_lblFilterbildungshistorie_Ve_ersterTermin::after, #cph_body_mitte_lblFilterbildungshistorie_Am_Status::after {
    /* content:" filtern:"; */
}

/* Loginbereich, Stammdatenpflege */
/* Missbrauch eines Eingabefeldes, um nur text anzuzeigen, da "nur Anzeigen" wie im Anmeldeformular hier nicht möglich ist */
/* 
#cph_body_mitte_Pe_Selekt6 {
    display: none;
}
#cph_body_mitte_lblPe_Selekt6 {
    display: block;
    width: 420px!important;
}  */
/* "neu"-Button ausblenden */
#cph_body_oben_btnNeuePersonAnlegen {
    display: none;
}
/* Checkbox "inaktive Personen anzeigen" ausblenden */
#cph_body_oben_chkFilterInaktivePersonenAnzeigen, #cph_body_oben_lblFilterInaktivePersonenAnzeigen {
    display: none;
}


.details_link {
	background-color: white;
	color: #016d7f;
	letter-spacing: 0.025em;
	text-transform: uppercase;
}


.anmelden_link, .button, .Button {
	text-transform: uppercase;
    letter-spacing: 0.025em;
}

input:not(.button), select {
    height: calc(1.7 * var(--text-lineheight));
}

.kartenansicht_kopf_freitext{
	font-weight:bold;
}