
/*****************************************************************************/
/*               NAMENSKONVENTIONEN FÜR NEUE CSS STYLES                      */
/*****************************************************************************/
/*
1. Sprechenden Namen in Englisch vergeben 
2. Namenskombinationen:
	- mit Unterstrich (z.B. "wizard_navi")
*/
/*****************************************************************************/
/*               INHALTSVERZEICHNIS                                          */
/*****************************************************************************/
/*****************************************************************************/
/*               Überschriften                                               */
/*****************************************************************************/
/*****************************************************************************/
/*               Absätze                                                     */
/*****************************************************************************/
/*****************************************************************************/
/*               Abstandhalter                                               */
/*****************************************************************************/
/*****************************************************************************/
/*               Ausrichtungen                                               */
/*****************************************************************************/
/*****************************************************************************/
/*               Allgemeine Container  										 */
/*****************************************************************************/
/*****************************************************************************/
/*               Container Buttons und Icons ueber Karteikarten     		 */
/*****************************************************************************/
/*****************************************************************************/
/*               Bilder                                                      */
/*****************************************************************************/
/*****************************************************************************/
/*   	    	 SVG, Iconfonts                                        */
/*****************************************************************************/
/*****************************************************************************/
/*               Textformatierung                                            */
/*****************************************************************************/
/*****************************************************************************/
/*               Styles für Java Script/Ajax Funktionen                      */
/*****************************************************************************/
/*****************************************************************************/
/*               Styles für individuelle Konfiguration                       */
/*****************************************************************************/
/*****************************************************************************/
/*               UI im IE11 unsichtbar machen                                */
/*****************************************************************************/


/*****************************************************************************/
/*               ANFANG CSS                                                  */
/*****************************************************************************/
/*****************************************************************************/
/*               Überschriften                                               */
/*****************************************************************************/
h1 {
	margin: 0 0 3px 0;
	padding: 0;
  	color: var(--accentFontColor); 
	font-size: var(--fontSize1);
	line-height:1.5em;
}

.hisinoneTitleStyle{
	display:inline-block;
}

h2 {
	margin: 0.1em 0 0.3em 0;
  	color: var(--accentFontColor); 
	font-size: var(--fontSize2);
}

h2:empty{
	display:none;
}

.titleWithLineBelow {
	margin: 0.5em 0.2em 0.8em 0.4em;
	border: none;
	padding: 0;
	border-bottom: var(--basicButtonBorder);
}

.titleWithLineBelow.addMargin {
	margin: 1em 0.2em 0.8em 0.4em;
}

h3 {	
  	color: var(--accentFontColor); 
	font-size: var(--fontSize4);
	margin: 0.1em 0 0.3em 0;
}

h4 {
	text-decoration: none;
	list-style-type: "";
	list-style-image: none;
	margin: 0.1em 0 0.3em 0;
	padding: 0;
	font-size: var(--fontSize4);
}

h5 {
	font-weight: bold;
	margin: 0.1em 0 0.3em 0;
	font-size: var(--fontSize5);
}


.pathHeader {
	font-weight: normal;
	display: inline-block;
}

.headline_marked {
	margin: 1em 0.5em 0 0;
	font-weight: bold;
	border: 1px dotted var(--basicButtonBorderColor);
	padding: 0.2em 3px 0.2em 3px;
	background-color:var(--backgroundColor2) !important;
}

.overflowHidden{
	overflow:hidden;	
}

.serverError {
	color:var(--errorColor);
	margin: 1em 0 1em 0;
}

/*****************************************************************************/
/*  Absätze */
/*****************************************************************************/
p {
	margin-top: 0.5em;
	margin-bottom: 0.4em;
	line-height: 1.3em;
}

.fieldsetMessageImage ~ .fieldsetMessageText > p, .fieldsetMessageImage ~ p {
	margin-top: 0.1em;
}

code{
	vertical-align:middle;
	background-color: var(--backgroundColor2);
}

/**Überschreiben weißer Hintergrund bei Example Value in Ausgabe der REST-Schnittstelle**/
 .highlight-code code {
	background-color: rgb(51, 51, 51);
}

.first {
	margin-top: 0;
}

.last {
	margin-bottom: 0;
}

.nospace {
	margin-top: 0;
	margin-bottom: 0;
}

.treePath {
	margin: 4px 0 0 0;
	padding: 0;
	padding-bottom: 0;
	display: inline-block;
}

/*****************************************************************************/
/*               Abstandhalter                                               */
/*****************************************************************************/
.clearer,.clearerSpaceAboveHalfEm,.clearerSpaceAbove0_1, .clearerSpaceAbove1Em{
	clear: both;
	line-height: 0;
	height: 0;
	overflow: hidden;
	display: block;
	margin: 0;
	padding: 0;
}

.clearerSpaceAboveHalfEm {
	padding-top: 0.5em;
}

.clearerSpaceAbove1Em {
	padding-top: 1em;
}

.clearerSpaceAbove0_1 {
	padding-top: 0.1em;
}

@media screen and (max-width: 1024px){		
	.clearerSpaceAbove0_1{
	padding:0;
    }
}

@media screen and (max-width: 768px){		
	.clearerSpaceAbove0_1{
	padding:0;
    }
}

.spacerImageTable {
	margin: 1px 7px 1px 7.5px;
}

.imagePathSeparator {
	margin-right: 7px;
	margin-left: 3px;
}

.indent_left_04, .indent_left_04:hover {
	margin-left: 0.4em;
}

.clearerDottedLine {
	border-bottom: 1px dotted var(--basicButtonBorderColor);
	height: 1px;
	clear: both;
	line-height: 1px;
	overflow: hidden;
	display: block;
	margin: 0;
	padding: 0;
}

.spaceAboveHalfEm {
	padding-top: 0.5em;
}

.spacerHyphenTable {
	width: 16px;
	height: 16px;
	margin: 1px;
	padding:0;
}

img[src$="hyphen.svg"]{
	width: 14px;
}

.marginTopMinus_3 {
	margin-top: -3px;
}

.position_top_plus3{
	position:relative;
	top:3px;
}

.dateInputCalendar{
	white-space:nowrap;
}

.marginTop3px {
	margin-top: 3px;
}

.marginTop8px {
	margin-top: 8px;
}

.marginRight20px {
	margin-right: 20px;
}

button.marginRight22px {
	margin-right: 22px;
}

.spacer_1 {
	margin-left: -25px;
	margin-right: 6px;
}

.lineHeight {
	line-height: 20px;
}

.uiText {
	display: inline;
	white-space: nowrap;
}

.uiText .submit_image {
	vertical-align: middle;
	margin-top: -2px;
	margin-left:15px;
}

.uiText label {
	top: 0;
}

.uiText .checkboxMarginTop {
	vertical-align: middle;
	margin-top: -1px;
}

.whiteSpaceNormal input.submit_arrow_right_fat{
	white-space:normal;
}

.secCodeContainer .secCode{
	font-size: var(--fontSize3);
}

/*Ort der Verwendung: (RES) Übersichtsseite beim Stellen einer Drittmittelanzeige
Verwendungszweck: Neuer Abstandshalter für 'detailPresentationList' innerhalb eines Grids 'ui-g'
Grund für Neuanlage: ui-g in einer detailPresentationList ohne die CSS-Klasse columnDetailContent*/
.padding05 {
	padding: 0.5em;
}

/** * Zweck: Text Umbruch  */
.wortumbruch {
	word-wrap: break-word;
}

/*Funktioniert besser als .wortumbruch*/
.breakAll {
	word-break: break-all;
}

/*Ort der Verwendung: Community, Auswahl von Empfängern einer Nachricht 
Verwendungszweck: Image eines ausgewählten Radiobuttons soll in gleicher Höhe mit den anderen angezeigt werden*/
.radioImgHorizontal {
	margin-top:6px;
}

/* Styles for the online-application */
img.requestStatus {
	padding-left: 15px;
	padding-right: 5px;
}

/* Zweck: Kleine und kursive Beschreibungstexte */
.description {
	line-height: 1.1em;
}

/*In der Komponente onreadyReload eine Größe vorgeben, damit ein Warte-Icon angezeigt werden kann */
.onreadyReloadContent {
	height: 120px;
}

.displayInline{
	display:inline;	
}

.displayBlock{
	display:block;	
}

.displayInlineBlock{
	display:inline-block;	
}

/*Verwendungszweck: Anpassung der semantische Abgrenzung von Inhalten durch eine gestrichelte Linie*/
hr.separator {
	clear: left;
	border: none;
	border-bottom: 1px dashed var(--basicButtonBorderColor);
	height: 1px;
}

.buildingObjectInactiveImage{
	margin:5px 5px 0 0;
}

/*****************************************************************************/
/*              Ausrichtungen                                                */
/*****************************************************************************/
.textAlignRight,
.p-datatable .p-datatable-tfoot > tr > td.textAlignRight,
.p-datatable .p-datatable-tbody > tr > td.textAlignRight {
	text-align: right;
}

table[id^="genSearchRes"].tableWithBorder > tbody > tr > td > div > div.textAlignRight.floatLeft {
	text-align: left;
}

table[id^="genSearchRes"].tableWithBorder > tbody > tr > td > div > div.textAlignRight.floatLeft > label[id$="periodFieldTo_inputLabel"][for^="genSearchRes"].form-label {
	margin-right: 8.5px;
}

table[id*="setFieldsBox"].tableWithBorder > tbody > tr > td > div > div.textAlignRight.floatLeft > label[id$="periodFieldTo_inputLabel"][for^="genSearchRes"].form-label {
	margin-right: 10px;
}

.textAlignLeft {
	text-align: left;
}

.textAlignCenter {
	text-align: center;
}

.paddingRight10px {
	padding-right: 10px;
}

.verticalAlignMiddle {
	vertical-align: middle;
}

.verticalAlignTop {
	vertical-align: top;
}

.verticalAlignBottom {
	vertical-align: bottom;
}

#profileForm\:j_id_3w_2d_1_44\:dataBox\:dataBox_innerFieldset strong{
	vertical-align: middle;
}

.floatRight {
	float: right;
}

.floatLeft, .roleSwitcher {
	display: inline-block;
}

.marginBottomStandard,.marginBottom4px {
	margin-bottom: 4px;
}

.marginBottom15px {
	margin-bottom: 15px;
}

.role_select {
	padding-right:10px;
	text-align: right;	/** align elements to the right rather than using float **/
}

.role_select * {
	text-align: left;
}

.paddingLeft4px {
	padding-left: 4px;
}

.marginLeftStandard,.marginLeft4px {
	margin-left: 4px;
}

.marginLeft22px{
	margin-left: 22px;
}

.marginRightStandard {
	margin-right: 4px;
}

a span.inlineicon.marginRightStandard {
	margin-right: 4px;
}

.marginTop4px {
	margin-top: 4px;
}

.marginTopMinus4px {
	margin-top: -4px !important;
}

.cCheckMargin {
	margin: 1px;
}

.rolechange_refresh{
	position:relative;
	top:4px;
}

/* Styles for the online-application*/
img.requestStatus {
	padding-left: 15px;
	padding-right: 5px;
}

.requestStatus {
	font-size: var(--fontSize5);
	background:var(--backgroundColor1);
	color:var(--contrastFontColor);
	padding: 6px 18px;
	border-radius:30px;	
	font-weight:bold;
	text-decoration:underline dotted;
	margin:5px;
}

.requestStatus:hover, .requestStatus:focus {	
	color:var(--backgroundColor38);
	border-radius:30px;	
}

@media screen and (max-width: 768px){
	 .requestStatus{
		text-decoration:underline solid;
	}
}

button.submit_linkLook.requestsubjectStatus {	
	color: var(--backgroundColor14);
	font-weight:bold;
	padding:0;
	margin-top:0 !important;
}

.requestStatusWrapper{
	margin-bottom:2px;
	display: flex;
}

@media screen and (max-width: 768px) {
	.requestFieldset .box_title_blue tr,
	.requestFieldset .box_title_blue td {
 		display: block;
	}
	
	 .requestFieldset .box_title_blue{
	 margin-left:4px;
	 }
	 
	 .requestFieldset h2 .requestStatus{
	 display:block;
	 }	
}

.lruListNumberOfMaxEntries input{
	vertical-align: middle;
}

/* Hinweistext ausblenden*/
.endlessWaitingRefresh {
	display:none;
}

/* Zweck: RefreshButton wird versteckt */
.refreshButtonNoDisplay{
    display:none;
}

/*Zweck: Vergabeverfahren-Korrektur-Zusatzlisten etwas dezenter */
.admissionprocess-diff .collapseTitle {
	font-size: 85%;
}

/*Zweck: Start Verteilungsverfahren, weniger Abstand zwischen Fieldsets */
.columnFullSizeNoPaddingBottom {
	margin: 0;
	padding: 0;
	float: left;
	width: 100%;
	min-width: 496px;
	clear: both;
}

/*Ort der Verwendung: onlineRequestsPageData.xhtml
Verwendungszweck: Abgrenzung von Elementen in der Übersichtsseite von gestellten Anträgen*/
.online-requests-overview-divider {
	margin-top: 15px;
}

/*Ort der Verwendung: Bewerbungen sichten - Bewerbungsbestandteil meldungen für fehlende Bewerbungsbestandteile
Verwendungszweck:   Verbesserung der UX und Barrierefreiheit*/
.app_fillParent {
	width: 100%;
}

.app_spaceBetween {
	justify-content: space-between;
}

.app_center {
	justify-content: center;
}

.app_missingAciFieldsetMessageText {
	margin: 0;
}

#applicationEditor\:dialogHeader\:recentlyViewedApplicantPopup\:showPopup {
	margin: 2px 1px !important;
}

/*Ort der Verwendung: Aufnahmeprüfungen planen (APP)
Verwendungszweck: Erzeugt einen Rahmen, der bei Kontrastmodi mit hohem Kontrast angezeigt wird*/
.app_dialogHeader {
	border: 1px solid transparent;
}

/*Ort der Verwendung: Bewerbungen sichten
Verwendungszweck: Ausrichtung der Inhalte */
.app_applicationContent_heading {
	margin: 0.1em 0 0.1em 0;
}

#applicationEditor .box_content .buttonsRight {
	margin-top: 0px;
	margin-right: 2px;
}

#applicationEditor td {
	vertical-align: middle;
}

/*Ort der Verwendung: Bewerbungen sichten - Bewerbungsbestandteile - label für Eingaben
Verwendungszweck: bugfix*/

.labelApplicationSubject .box_content div label {
	text-align: right;
}

/*Ort der Verwendung: Bewerbungen sichten, Bewerbungen bearbeiten 
- applicationContentInputViewOnly.xhtml, applicationContentEdit.xhtml
Verwendungszweck: bugfix  205514*/
.applicationContentTextLineBreak {
	white-space: pre-line;
	display: block;
	width: auto;
}

/*Ort der Verwendung: Bewerbungen sichten, Online Application 
- applicationContentInputViewOnly.xhtml, facelet-components/his/app/applicationContentEdit.xhtml
Verwendungszweck: bugfix  205514*/
.applicationContentTextOverflow {
	overflow: auto;
	max-height: 200px;
	min-width: 100px;
	padding: 0 20px;
}

/*Ort der Verwendung: Bewerbungen sichten - Statusanmerkungen anzeigen - vordefinierte Statusanmerkungen
Verwendungszweck:   Damit soll gezeigt werden, dass ein Text ein title Attribut hat*/
.app_dottedUnderline {
	text-decoration: underline dotted;
}

/*Ort der Verwendung: Bewerbungen sichten - Studiengangsdetails anzeigen - icon popup
Verwendungszweck:   Einheitliches Layout in der Tabelle*/
.app_allignItemsCenter {
	align-items: center;
	display: flex;
}

.app_noMarginRight {
	margin-right: 0px !important;
}

/*Ort der Verwendung: Bewerbungen sichten - Fieldsets für Gruppierung der Bewerbungsbestandteile
Verwendungszweck:   Verbesserung der UX und Barrierefreiheit*/
.app_kanbanBorder {
	border-radius: 8px;
	border: 1px solid;
	border-color: transparent;
}

.app_padding8px {
	padding: 8px;
}

/*Ort der Verwendung: Bewerbungen sichten - Bewerbungsbestandteil hinzufügen icon
Verwendungszweck:   Vereinheitlichung der Größe der Icons, so wie vereinheitlichung der Icongröße bei Mehrfach-Anträgen*/
#applicationEditor\:selectedTerm\:applicationsRequestsAndSubjectsTable\:applicationsRequestsAndSubjectsTableTable\:1\:createApplicationContentInputBtn>img {
	width: var(- -imageSizeStandard) !important;
	height: var(- -imageSizeStandard) !important;
}

/*****************************************************************************/
/*              Allgemeine Container                                         */
/*****************************************************************************/
/**
 * HISinOne - component: two-column-layout
 */
.two-column-layout {
	float: left;
	width: 100%;
	position: relative;
}

.two-column-layout .layout-column-1 {
	position: relative;
	float: left;
	width: 48.5%;
}

/**
 * HISinOne - component: content-sidebar-layout
 */
.content-sidebar-layout {
	float: left;
	width: 100%;
}

.content-sidebar-layout .layout-content {
	min-width: 460px;
	margin-right: 22.5em;
	/* IE 7 - visibility hack */
	height: 1%;
}

.content-sidebar-layout .layout-inner-content {
	float: left;
	width: 100%;
}

.content-sidebar-layout .layout-sidebar {
	float: right;
	width: 22.1em;
	margin-top:36px;
}

a.ui-sidebar-close.ui-corner-all{
	display: none;
}

/*Studienservice Layout*/
@media screen and (max-width: 1024px){ 	
	 .content-sidebar-layout .layout-content{
		min-width:320px;
		margin-right:0;
	}
	 .content-sidebar-layout .layout-sidebar{
		float:none;
		width:auto;
	}
}

@media screen and (max-width: 768px){ 
	 .content-sidebar-layout .layout-content{
		min-width:320px;
		margin-right:0;
	}
	 .content-sidebar-layout .layout-sidebar{
		float:none;
		width:auto;
		margin-top:1px;
	}
}

/*Primefaces Sidebar*/
body .ui-widget-overlay{ 
  background: rgba(0,0,0,.4);
}
body .ui-widget-overlay {
  -webkit-animation-name: modal-in;
  animation-name: modal-in;
  animation-duration: .4s;
  animation-timing-function: cubic-bezier(0.05, 0.74, 0.2, 0.99);
  animation-fill-mode: forwards;
}
.ui-dialog-mask {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  user-select: none;
}
.ui-widget-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
	
/* Hervorhebung Kalender für Feiertage: Darstellung verschiedenartiger Tage mit graphischen Rändern*/
.edge_round_solid {
	border: var(--highlightBorderForms);
}

.edge_bottom_solid {
	border-bottom: var(--highlightBorderForms);
}

.edge_bottom_right_solid {
	border-right: 1px dotted var(--backgroundColor11);
	border-bottom: var(--highlightBorderForms);
}

.edge_left_dotted {
	border-left: 1px dotted var(--backgroundColor11);
}

.borderGreen {
	border-right: 5px solid var(--borderColor4);
}

.whiteFont {
	color: var(--backgroundColor2) !important;
}

/* syntax-highlighting editor codemirror Javascript Editor*/
.CodeMirror-line-numbers {
	width: 2.2em;
	color: var(--highlightShadowColor);
	background-color: var(--backgroundColor3);
	text-align: right;
	padding-right: .4em;
	margin: 0;
	font-family: monospace;
	font-size: 10pt;
	line-height: 1.1em;
}

.CodeMirror {
  min-width:initial !important;
 }

/* codemirror style for editing ruby template */
.cm-s-ruby-template {
  height: auto !important;
  display: inline-block;
  width: -moz-available;
  max-width: 60% !important;
}

.field_with_errors > .cm-s-ruby-template {
  width: -moz-available;
  max-width: 100% !important;
}

.cm-s-ruby-template span.cm-variable {
    color: var(--basicFontColor);
}

.cm-s-ruby-template-error {
  background: var(--backgroundColor41);
}

/* codemirror style for ckeditor */
.cke_contents .cm-s-default {
	font: 13px/1.4em monospace;
	width: -moz-available;
	max-width: 100% !important;
}

.codeborder {
	border-left: var(--backgroundColor48);
	border-right: var(--backgroundColor48);
	border-top: var(--backgroundColor48);
	border-bottom: var(--backgroundColor48);
}

/*Container für Suche in der globalen Konfiguration*/

.containerLeft {
	width: 400px;
	margin-top: 1px;
	margin-left: 3px;
	margin-right: 5px;
	float: left;
}

.containerRight {
	width: 350px;
	float: left;
}

.container-fluid.row.tileFieldsetContent .tileDataContainer{
	padding-top:3px;
}

.container-fluid.row.tileFieldsetContent .tileDataContainer:empty{
	padding-top:0;
}

.buttons_horizontal li.containerRightListElement{
	margin-top:10px;	
}

/*container für controls*/
.controls {
	float: left;
	padding-left: 5px;
	margin-top:3px;
	padding-top:1px;
	border: var(--border2);
	background-color:var(--backgroundColor2) !important;
}


.imageWithTooltip{
	display:inline-block;
	margin:4px 1px 1px 1px;
}

.inboxWrapper .displayInline{
	display:inline-block;
}

.inboxWrapper .helpBox{
	margin-top:4px;
}

.inboxWrapper .inboxBadge{
	vertical-align:middle;
	position: relative;
    top: 11px;
}

.caseSearch-container {
	float: right;
}

.caseSearch {
	width: 100%;
}

.caseSearch input[type="text"] {
    width: 22em;
}

/* Zweck: Adds box shadow with opacity 0.13 to right and bottom side */
.boxShadow_right_bottom_13 {
	-webkit-box-shadow: 7px 7px 5px 0 var(--backgroundColor44);
	-moz-box-shadow: 7px 7px 5px 0 var(--backgroundColor44);
	box-shadow: 7px 7px 5px 0 var(--backgroundColor44);
}

/*Zweck: 30 percentage width */
.width30 {
	width: 30% !important;
}

/*Container gekennzeichnet mit roter oder grüner  Linie (Hauptrangverfahren bzw. Freigabe hervorheben)*/
.mainProcessHighlighting{
	border-left:4px solid var(--backgroundColor6);
}

.addressSidebar{
	margin-bottom:25px;
	margin-top:20px;
}

.addressSidebar button{	
	margin-right: 0;
	padding: 11px;
}

.addressSidebar button, .notificationAgreement button{	
	background-position: 0;
}

.sidebarApplicantName{
	font-weight:bold;
}

@media screen and (max-width: 768px){		
	 #map_canvas_gsm{
		min-height:300px;
	}
	
	 #map_canvas_osm{
		min-height:300px;
	}
}

/*****************************************************************************/
/*              Container Buttons und Icons ueber Karteikarten               */
/*****************************************************************************/
.buttonsTop {
	margin: 0;
	padding: 0 0 0.2em 0;	
}

.buttonsTop button:first-child{
	margin-left: 0;	
}

.buttonsTopLineBeneath {
	margin: 0 0 0.5em 0;
	padding: 0.2em 0;
}

@media screen and (max-width: 1024px){ 	
	 .buttonsTopLineBeneath{
		margin:0 0 8px;
		padding:0;
	}
}

@media screen and (max-width: 768px){
	 .buttonsTop{
		box-sizing: border-box;
	}
}

.buttonsTopLeft {
	margin: 0;
	padding: 0;
	float: left;
}

.buttonsTopRight {
	margin: 6px 0 0 0;
	padding: 0;
	float: right;
}

#genericSearchMask\:recentlyViewedApplicantPopup\:showPopup, #genericSearchMask\:buttonsBottom\:recentlyViewedApplicantPopup\:showPopup {
	margin-top: 3px;
	padding: 7px;
}

@media screen and (max-width: 1195px) {
	#genericSearchMask\:recentlyViewedApplicantPopup\:showPopup {
		margin-top: 0px;
	}
}

@media screen and (max-width: 1024px) {
	#genericSearchMask\:recentlyViewedApplicantPopup\:showPopup {
		margin-top: 4.5px;
	}
}

@media screen and (max-width: 597px) {
	#genericSearchMask\:recentlyViewedApplicantPopup\:showPopup {
		margin-top: 4.5px;
	}
}

@media screen and (max-width: 597px) {
	#genericSearchMask\:recentlyViewedApplicantPopup\:showPopup {
		margin-top: 0px;
	}
}

#applicationEditor\:dialogHeader\:recentlyViewedApplicantPopup\:showPopup {
	padding: 7px;
	margin-top: -0.5px;
}

/*****************************************************************************/
/*              Container Buttons und Icons unter Dialogen / Karteikarten    */
/*****************************************************************************/
.buttonsBottom {
	margin: 0;
	padding: 0;
	padding-top: 0.2em;
	padding-bottom: 0.2em;
}

.buttonsBottomLineAbove {
	margin: 0;
	margin-top: 0.5em;
	padding-top: 0.2em;
	padding-bottom: 0.2em;
}

.buttonsBottomLeft {
	margin: 0;
	padding: 0;
	float: left;
}

.buttonsBottomRight {
	margin: 0;
	padding: 0;
	float: right;
}


/*****************************************************************************/
/*               Bilder                                                      */
/*****************************************************************************/
/*Mit style="vertical-align:text-top" erreichen Sie in einem <img>-Tag das Gleiche wie mit align="top",
mit style="vertical-align:middle" das Gleiche wie in standardkonformen Browsern mit align="middle",
und mit style="vertical-align:text-bottom" das Gleiche wie mit align="bottom".*/
img {
	border: none;
	vertical-align: middle;
}

.imageTableMargin5{
	margin:0 5px;
}

.imagebottom {
	vertical-align: text-bottom;
}

.imagemiddle {
	vertical-align: middle !important;
}

.imagetop, .portletInfoText img {
	vertical-align:top;
	vertical-align: text-top;
}

.imagetop2  {
	vertical-align: top;
}

.imagebottomMarginRight {
	vertical-align: text-bottom;
	margin-right: 0.3em;
}

.calendarImage {
	cursor: pointer;
	margin-left: 5px;
	margin-right: 4px;
	vertical-align: middle;
	margin:2px 3px 3px 3px;
	height:var(--imageSizeStandard);
	width:var(--imageSizeStandard);
}

.calendarImage:hover,
.calendarImage:focus {
   background-color:var(--highlightBackgroundColor) !important;
   box-shadow:var(--highlightShadow); 
   transition:var(--highlightTransition); 
   /*selectors must be positioned after the variable: for ms edge every property must be specified to avoid flickering*/
   transition-property: border 0.8s;
   transition-property: box-shadow 0.8s;
}

.calendarImage:focus {
   outline:var(--highlightFocusOutline);
   border-radius:0;
   border:var(--highlightBorder);
}

.pictures_portal_border {
	margin-left: 0;
	margin-top: 1em;
	margin-bottom: 1px;
	padding: 0;
    border: var(--border1);
}

.picture {
	background: var(--backgroundColor2);
	padding: 0;
	max-height:100%;
	width: auto;
    border: var(--border1);
}

[id$="photo"].picture{
	cursor: crosshair;
}

.pictureSel {
	position:relative;
	touch-action: manipulation; 
}

@media screen and (max-width: 768px){ 
	 .picture{
		margin-top:20px;
		height:auto;
		width:auto;
		max-width: 100% !important;
	}	
	.table .picture{
		margin-top:0;
	}
	
	.calendarImage {
        display: none;
    }
	.calendarImage--showInMobile {
        display: inline-block;
    } 
}

.BI_portlet_images img{
	width: unset;
	height: unset;
	-webkit-width : unset;
	-moz-width : unset;
	-ms-width : unset;
	-o-width : unset;
	-webkit-height : unset;
	-moz-height : unset;
	-ms-height : unset;
	-o-height : unset;
}

img.submitImageTable, img.submitImageTable:hover{
	padding:0;
	background-color:transparent;
	box-shadow:0 0 0 var(--highlightShadowColor);
}

/*****************************************************************************/
/*   	    	 SVG, Iconfonts                                              */
/*****************************************************************************/
	
[src$=".svg"] {
	height:var(--imageSizeStandard);
	width:var(--imageSizeStandard);
}


[class^="iconfont-"]:before, [class*=" iconfont-"]:before,
[class^="iconfont-"], [class*=" iconfont-"],
[class^="iconfont_2022_03-"]:before, [class*=" iconfont_2022_03-"]:before,
[class^="iconfont_2022_03-"], [class*=" iconfont_2022_03-"],
[class^="iconfont_2022_04-"]:before, [class*=" iconfont_2022_04-"]:before,
[class^="iconfont_2022_04-"], [class*=" iconfont_2022_04-"],
[class^="iconfont_2023_06-"]:before, [class*=" iconfont_2023_06-"]:before,
[class^="iconfont_2023_06-"], [class*=" iconfont_2023_06-"] { 	
  	color: var(--accentFontColor); 	
  	font-size: 120%;
} 

.treeTableIcon [class^="iconfont-"]:before, .treeTableIcon[class^="iconfont-"]:before {
	font-size: 140%;
}

span.treeTableIcon[class^="iconfont-"], span.treeTableIcon[class^="iconfont-"]:before {
	vertical-align: middle;
	vertical-align: -webkit-baseline-middle;
	margin-top: 3px;
	min-width: 0px;
}

[class^="pi-"]:before, [class*="pi-"]:before, [class^="pi-"], [class*="pi-"],
[class^="pi_2022_03-"]:before, [class*="pi_2022_03-"]:before, [class^="pi_2022_03-"], [class*="pi_2022_03-"],
[class^="pi_2022_04-"]:before, [class*="pi_2022_04-"]:before, [class^="pi_2022_04-"], [class*="pi_2022_04-"],
[class^="pi_2023_06-"]:before, [class*="pi_2023_06-"]:before, [class^="pi_2023_06-"], [class*="pi_2023_06-"] { 		
  	font-size: 120%;
} 

 .imgSize_32{
	height:32px;
	width:32px;
}

.imgSize_200, .inlineicon.imgSize_200{
	height:200px;
	width:200px;
}

.imgSize_150, .inlineicon.imgSize_150{
	height:150px;
	width:auto;
}

.imgSize_width_150{
	width:150px;
	height:auto;
}

.imgSize_width_60{
	width:60px;
	height:auto;
}

/* Bild für Stellenanzeigen mit Breiten- und Höhenangabe */
.inlineicon.imgSize_150_110{
	height:150px;
	width:110px;
}

.inlineicon.contactImage{
	background-color:var(--backgroundColor3);
	border: var(--border1);
}

.inlineicon.contactImageo{
	height:47px;
	width:139px;
}

@media screen and (max-width: 768px){	
	/*  img[src$=".svg"] {
	    height:25px;
	    width:25px;
	}	 */
	 .hochschulstartLogo{
	height:47px;
	width:139px;
	}	
	 .logoLink img{
		height:auto;
		width:auto;
	}

	/*Button-Icons mit und ohne grauen Button-Hintergrund*/
	.link_image img{
		-moz-transform: scale(1.3);
	    -ms-transform: scale(1.3);
	    -o-transform: scale(1.3);
	    -webkit-transform: scale(1.3);
	    transform: scale(1.3);
		-moz-transform-origin: 0 0;
		-ms-transform-origin: 0 0;
		-o-transform-origin: 0 0;
		-webkit-transform-origin: 0 0;
		transform-origin: 0 0;
	    margin:0 5px 0 5px;
	}
}

#applicationEditor\:selectedTerm\:applicationsRequestsAndSubjectsTable\:applicationsRequestsAndSubjectsTableTable\:1\:createApplicationContentInputBtn > img {
	width: 23px;
	height: 23px;
}

/*****************************************************************************/
/*               Sonstiges                                                   */
/*****************************************************************************/
/**

/* Verwendung: Modul-, Veranstaltungs-, Prüfungsansicht etc.*/
.headlineBorder {
	background-repeat: repeat-x;
	background-position: left bottom ;
	padding:4px 15px 4px;
	margin: 5px 2px 0 0;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	border-radius: 25px;
    border: var(--border2);
	background-color: var(--backgroundColor3) !important;
}

.headlineRoundCorner {
	font-weight: bold;
	margin: 0 0 7px 0 !important;
	padding-bottom: 0 !important;
	padding-top:2px;
	-moz-border-radius: 1px;
	-webkit-border-radius: 1px;
	border-radius: 1px;
	min-height:2.6em;
	overflow:hidden;
    border: var(--border2);
}

/* Zweck: Schriftformatierung in Duplikatsprüfung */

.tableHeaderBG.headlineRoundCorner.fontNormal span,
.tableHeaderBG.headlineRoundCorner.fontNormal a,
.tableHeaderBG.headlineRoundCorner.fontNormal fieldset .oneLine .moduleInfoBox div {
	font-weight: normal;
}

.oneLine {
	display: inline-block; 
	width: 100%;	
	background-repeat: repeat-x;
	background-position: left bottom;
	border-bottom:var(--border2);
	padding: 3px 0;
}

.oneLine.roomDescription{
	padding:5px;
}

.oneLine .submit_image {
	float: right !important;
}

.oneLine .helptext {
	margin: 3px !important;
}

/*Studiengänge Detailseite Label*/
.detailLabel{
	text-align:left;
	font-weight:bold;
	width:35%;
	margin-top:0;	
}

.fieldsetNoBorder.detailHeaderStyle{
	padding:0;
}

/*Layout wird einspaltig bei kleineren Bildschirmen*/
@media screen and (max-width : 768px)  {
	.detailLabel{
	display:block;
}
}

.detailHeaderStyle .box_title{
	margin-bottom:10px;
}
/*Ende Studiengänge Detailseite Label*/

.extendedLine {
	border-bottom: none;
	padding: 0;
	margin: 0;
	background-position: left top;
	background-repeat: repeat-x;
	-moz-box-shadow: 0 1px 0 var(--backgroundColor3);
	-webkit-box-shadow: 0 1px 0 var(--backgroundColor3); 
	box-shadow: 0 1px 0 var(--backgroundColor3); 
    border: var(--border1);
	background-color: var(--backgroundColor3) !important;
}

.extendedLine .oneLine {
	border-left: none;
	border-right: none;
}

.extendedLine .labelWithBG {
	font-weight: normal !important;
}



/*Studienplaner Darstellung Masterarbeit, Slim Layout mit Überschrift und Spalten*/

.planelementPrioritiesLevel2{
	margin-left:40px;
}

.planelementAggregate{
	margin-left:10px;
	line-height:1em;
}

.headlineSlim {
	color:var(--disabledFontColor);	
	padding-left:25px;
}

.oneLineSlim {
	color:var(--disabledFontColor);
	clear:both;	
	padding-left:25px;
}

.answerSlim {
	float: left;
	width:55%;
}

@media screen and (max-width: 768px){ 
     .answer {
	width: 99% !important;
	padding-left: 0;
	}
}

.labelWithBGSlim {
	float: left;
	width:36%;
	padding-right:10px;
}

/**
 * Styles für ALU-Ankündigungen
 **/
.announcement {
	background-image: url("/HISinOne/images/icons/announcement.svg");
}

.announcement_category dt a {
	background-position:left center;
	background-repeat:no-repeat;
	padding-left: 28px;
}

.category_item_list.announcement dt{
	background:transparent;
}

.category_item_list.announcement dd.category_item_options{
	background:transparent;
}

form .defaultbutton {
	width: 0;
	height: 0;
	overflow: hidden;
	font-size: 0;
	position: absolute;
	top: -9999px;
	left: -9999px;
}

.content-element {
	margin-bottom: 1em;
}

.content-section {
	margin-bottom: 2em;
}

/*****************************************************************************/
/*                            Kalender                                       */
/*****************************************************************************/
/* Default attributes of DIV containing table container for entire calendar.
 * You probably don't want to alter this style.
 */
 
 .jscalendar-hidden {
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.3s, visibility 0s 0.3s;
}

.jscalendar-visible {
    visibility: visible;
    opacity: 1;
    transition: opacity 0.3s;
}

.jscalendar-DB-div-style {
	z-index: 99999;
	position: absolute;
}

/* Default attributes of table container for entire calendar */
.jscalendar-DB-table-style {
	box-shadow:var(--highlightShadow);
	border-radius: var(--popupRadius);
	font-family: var(--font) !important;
	padding:3px;
}

/* Default attributes used in calendar title (month and year columns).*/
.jscalendar-DB-title-style {
	color: var(--basicFontColor) !important;
	font-family: var(--font) !important;
}

.jscalendar-DB-title-style+td {
	background-color: var(--backgroundColor2);
}

/* Default attributes used in calendar title background.*/
.jscalendar-DB-title-background-style {
	background-color: var(--backgroundColor2);
}

/* Normal appearance of controls in calendar title. */
/* Note: The right, left and down icons are images, jscalendar-DBich must be edited if you need to change them. */
.jscalendar-DB-title-control-normal-style { 
	border-color:transparent;
	font-size: var(--fontSize3);
}

/* Moused-over (selected) appearance of controls in calendar title. */
.jscalendar-DB-title-control-select-style {
	background-color:var(--highlightBackgroundColor); 
	font-size: var(--fontSize3);
	border:var(--highlightBorderTransparent);
	box-shadow:var(--highlightShadow);
}

/* Default attributes of drop down lists (month and year). */
.jscalendar-DB-dropdown-style {
	font-size: var(--fontSize5) !important;
	border: var(--border2);
	font-family: var(--font) !important;
	background-color:var(--backgroundColor2) !important;
}

.jscalendar-DB-dropdown-style td {
	border-bottom: none !important;
	background-color:var(--highlightBackgroundColor);	
	padding:2px 5px;
	border-radius:2px;
}

.jscalendar-DB-dropdown-style td:hover {
	border-bottom: none !important;
	background-color:var(--backgroundColor2) !important;
}

/* Default attributes selected (mouse-over) item in drop down lists (month and year). */
.jscalendar-DB-dropdown-select-style {
	outline:none;
    background-color:var(--highlightBackgroundColor) !important;
}

/* Default attributes unselected (mouse-off) item in drop down lists (month and year). */
.jscalendar-DB-dropdown-normal-style {
	background-color: inherit;
	border-bottom: none !important;
}

/* Default attributes of calendar body (weekday titles and numbers). */
.jscalendar-DB-body-style {
	font-size: var(--fontSize5) !important;
	color: var(--accentFontColor) !important;
	padding: 0 !important;
	font-family: var(--font) !important;
	background-color:var(--backgroundColor2) !important;
}

.jscalendar-DB-body-style tr:hover,.jscalendar-DB-body-style tr:focus {
	background-color: transparent !important;
}

.jscalendar-DB-body-style td {
	border-bottom: none !important;
	padding-top: 1px !important;
	font-weight:normal !important;
	font-size: var(--fontSize3);
}

.jscalendar-DB-today-style {
  padding: 2px;  
  color: var(--accentFontColor);
}

/* Attributes of current day in calendar body. */
.jscalendar-DB-current-day-style {
	color: var(--basicFontColor);
	font-weight: bold !important;
	text-decoration: none !important;
	border: 3px dotted var(--basicFontColor);
	background-color: var(--backgroundColor3);
}

/* Attributes of end-of-week days (Sundays) in calendar body. */
.jscalendar-DB-end-of-weekday-style {
	color: var(--basicFontColor)!important;
	text-decoration: none !important;
}

/* Attributes of all other days in calendar body. */
.jscalendar-DB-normal-day-style {
	color: var(--basicFontColor)!important;
	text-decoration: none !important;
}

.jscalendar-DB-normal-day-style:focus,.jscalendar-DB-normal-day-style:hover	{
	background-color: transparent !important;
}

a.jscalendar-DB-normal-day-style:hover,a.jscalendar-DB-normal-day-style:focus,a.jscalendar-DB-end-of-weekday-style:hover,a.jscalendar-DB-end-of-weekday-style:focus
	{
    background-color:var(--highlightBackgroundColor) !important;
}

a.jscalendar-DB-normal-day-style:focus{
	transition-duration: 0.0s;
}

.jscalendar-DB-dropdown-style {
	font-size: var(--fontSize5);
	border: var(--border2);
}

.jscalendar-DB-selected-day-style,
.jscalendar-DB-selected-day-style:hover,
.jscalendar-DB-selected-day-style:focus{
	background-color: var(--highlightBackgroundColor);
	border: 3px solid var(--backgroundColor7);
}

/* Default attributes of designated holidays. */
.jscalendar-DB-holiday-style {
	background-color:var(--backgroundColor16) !important;
}

.jscalendar-DB-today-lbl-style {
	color: var(--basicFontColor)!important;
	padding: 5px !important;
	text-align: center !important;
}

.jscalendar-DB-today-lbl-style span {
	color: var(--basicFontColor)!important;
	font-size: var(--fontSize3);
}

/* Attributes of today display at bottom on calendar */

a.jscalendar-DB-today-style:hover,a.jscalendar-DB-today-style:focus {
	color: var(--basicFontColor)!important;
	background-color:var(--highlightBackgroundColor) !important;
	text-decoration: none !important;
}

/* Attributes of week number division (divider.gif) */
.jscalendar-DB-weeknumber-div-style {
	padding: 0 !important;
}

.jscalendar-DB-would-be-selected-day-style {
	background-color: var(--backgroundColor3) !important;
}

@media screen and (max-width: 1024px){ 	
	.jscalendar-DB-dropdown-style{
	font-size:var(--fontSize3) !important;
	}
}

.jscalendar-DB-title-style .jscalendar-DB-title-control-normal-style img,
.jscalendar-DB-title-style .jscalendar-DB-title-control-select-style img,
.jscalendar-DB-title-background-style table td a img{
	display:none;
}


/* Bilder durch Hintergrund-Iconfonts ersetzen */
.jscalendar-DB-title-style .jscalendar-DB-title-control-normal-style:nth-child(1)::after,
.jscalendar-DB-title-style .jscalendar-DB-title-control-select-style:nth-child(1)::after {
  content: "\e9b9" / "";
  font-family: "HISinOneIcons" !important;
  color: var(--accentFontColor);
  font-size: 140%;
  padding-right: 12px;
  position: relative;
  top: 3px;
}

.jscalendar-DB-title-style .jscalendar-DB-title-control-normal-style:nth-child(1),
.jscalendar-DB-title-style .jscalendar-DB-title-control-select-style:nth-child(1) {
  transition:var(--highlightTransition);
}

.jscalendar-DB-title-style .jscalendar-DB-title-control-normal-style:nth-child(2)::after,
.jscalendar-DB-title-style .jscalendar-DB-title-control-select-style:nth-child(2)::after {
  content: "\e9b8" / "";
  font-family: "HISinOneIcons" !important;
  color: var(--accentFontColor);
  font-size: 140%;
  padding-right: 12px;
  position: relative;
  top: 4px;
}

.jscalendar-DB-title-style .jscalendar-DB-title-control-normal-style:nth-child(3)::after,
.jscalendar-DB-title-style .jscalendar-DB-title-control-select-style:nth-child(3)::after,
.jscalendar-DB-title-style .jscalendar-DB-title-control-normal-style:nth-child(4)::after,
.jscalendar-DB-title-style .jscalendar-DB-title-control-select-style:nth-child(4)::after {
  content: "\e9b4" / "";
  font-family: "HISinOneIcons" !important;
  color: var(--accentFontColor);
  font-size: 140%;
  position: relative;
  top: 4px;
}

.jscalendar-DB-title-background-style table td a::after{
	content: "\e99b" / "";
    font-family: "HISinOneIcons" !important;
    color: var(--accentFontColor);
    font-size: 120%;
    position: relative;
    top: 2px;
}

.jscalendar-DB-title-background-style table td a{
	text-decoration: none;
	vertical-align: bottom;
	padding: 4px;
	font-size: 145%;
}

.jscalendar-DB-title-background-style table{
	width:100% !important;
}

@media screen and (max-width: 768px){ 	
	 .jscalendar-DB-dropdown-style{
	font-size:15px !important;
	}	
	 .jscalendar-DB-div-style img{
	width:17px;
	height:17px;
	}
}
/*****************************************************************************/
/*                            Kalender in Ruby                               */
/*****************************************************************************/
#pcIDcalendar{
	border: var(--basicButtonBorder)!important;
	-webkit-box-shadow: 3px 3px 15px var(--highlightShadowColor);
	-moz-box-shadow: 3px 3px 15px var(--highlightShadowColor);
	-o-box-shadow: 3px 3px 15px var(--highlightShadowColor);
	box-shadow: 3px 3px 15px var(--highlightShadowColor);
	-moz-border-radius: 2px;
	border-radius: 2px;
}

#pcIDselectYear, #pcIDselectMonth{
	border: var(--basicButtonBorder)!important;
	-webkit-box-shadow: 3px 3px 15px var(--highlightShadowColor);
	-moz-box-shadow: 3px 3px 15px var(--highlightShadowColor);
	-o-box-shadow: 3px 3px 15px var(--highlightShadowColor);
	box-shadow: 3px 3px 15px var(--highlightShadowColor);
	-moz-border-radius: 2px;
	border-radius: 2px;
}

#pcIDselectYear ul, #pcIDselectMonth ul{
	background-color:var(--backgroundColor2);
	padding:3px;
}

#pcIDselectYear li a, #pcIDselectMonth li a{
	font-size:95%;
	padding:2px 4px 2px 4px;
	color: var(--basicFontColor);
	font-family: var(--font) !important;
}

#pcIDselectYear li a:hover,
#pcIDselectMonth li a:hover {
   background-color:var(--highlightBackgroundColor) !important;
}

#pcIDcontent table{
	border:none;
	border-collapse:collapse;
	border:0;
}

#pcIDcaption{
	background-color:var(--backgroundColor3) !important;
	padding:6px;
}

#pcIDcaption div a, #pcIDcaption div a:hover{
	border:transparent;
}

#pcIDleft a{
	background: url("/HISinOne/images/icons/resultset_previous.svg") no-repeat center !important ;
}  

#pcIDright a{
	background: url("/HISinOne/images/icons/resultset_next.svg") no-repeat center !important ;
}  

#pcIDMonth a, #pcIDYear a{
	background: url("/HISinOne/images/icons/resultset_down.svg") no-repeat right !important ;
} 

#pcIDMonth a, #pcIDMonth a:hover, #pcIDYear a, #pcIDYear a:hover{
	padding:0 20px 0 12px;
}

#pcIDcaption div a{
	font-size:128%;
	font-family: var(--font) !important;
} 

td.pcWeekNumber{
	font-size:130%;
	padding:4px;
	font-family: var(--font) !important;
}

#pcIDcontent th{
	font-size:130%;
	padding:8px;
	border-bottom:none;
	font-family: var(--font) !important;
}
 
#pcIDcontent td{
	background-color:transparent;
	padding-top:3px;
}

td.pctd a{
	font-size:130%;
	padding:5px;
	color:var(--disabledFontColor);
	font-family: var(--font) !important;
}

#pcIDcontent td{
	padding:5px !important;
}

#pcIDcontent td.pcDaySelected{
	border-bottom:1px solid var(--backgroundColor48) !important;
}	

td.pcWeekend a, td.pcWeekend a:visited, td.pcWeekend a:link{
	font-weight:bold;
  	color: var(--accentFontColor); 
}

#pcIDfooter{
	font-size:101%;
	padding:4px;
	text-decoration:none !important;
	font-family: var(--font) !important;
	background-color: var(--backgroundColor3) !important;
	background-color: var(--backgroundColor8) !important;
} 

#pcIDfooter a {		
	color: var(--basicFontColor);
}

td.pctd, #pcIDcontent th, td.pcWeekNumber{
	text-align:center;
}

#pcIDcontent td.pcToday{
	border:1px dashed var(--backgroundColor6) !important;
}

/*****************************************************************************/
/*               Textformatierung                                            */
/*****************************************************************************/

.text_white p {
	display: block;
}

.text_white {
	background-color:var(--backgroundColor2) !important;
}

.text_white img {
	height:var(--imageSizeStandard);
	width:var(--imageSizeStandard);
}

.text_yellow {
	color: var(--disabledFontColor);
	background-color:var(--backgroundColor9) !important;	
}

.example_html {
	clear: both;
	display: block;
	border: 1px dashed var(--basicButtonBorderColor);
	padding: 1em;
	background-color:var(--backgroundColor2) !important;
}

.text_white,.text_yellow {	
	margin-bottom: 0.6em;
	margin-left: 0;
	margin-right: 0;
	padding: 0.5em 0.5em 0.5em 0.6em;
	line-height: 1.3em;
	max-width: 550px;
	min-width: 200px;
    border: var(--border1);
}

.text_white_small {
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	border-radius: 2px;
	padding: 4px 6px;
	line-height: 1.3em;
	background: var(--backgroundColor2) ;
	color: var(--disabledFontColor);
    border: var(--border1);
}

.text_white_searchresult {
	margin: 0.2em 1.5px 0 0.5px;
	padding: 0.5em 1em 0.4em 0.6em;
	line-height: 1.15em;
    border: var(--border1);
	background-color:var(--backgroundColor2) !important;
}

.text_bg_img_white_border_top_bottom {
	margin: 0 0 0.6em 0;
	padding: 1em 1em 1em 0.5em;
	max-width: 550px;
    border: var(--border1);
}

.note, .note_grey{
	padding: 3px 8px 5px 8px;
	vertical-align: middle;
	margin-right: 3px;
	display:inline-block;
    border: var(--border1);
}

.note {		
	background-color: var(--backgroundColor40);
	border: 3px solid var(--backgroundColor5);
	padding: 20px;
}

.note_grey {
	background-color: var(--backgroundColor3);
}

.graphContainer{
	width:100%;
}

.yourgrade{
	text-align:center;
	border: 2px solid var(--backgroundColor51);
	padding: 5px;
	font-weight: bold;
  	width: 50%;
  	margin: 0 auto;
}	

.yourgradeInformation{
	line-height:1em;
	text-align: center;
}

.textFixed, .textFixed:hover {
	background-color:var(--backgroundColor4);
	padding: 5px 2px 5px 2px;
	margin: 2px 0;
	width: 60%;
	min-height: 19px;
	display: inline-block;
    border:  1px solid var(--borderColor3);
    min-height:2.1em;
}

@media screen and (max-width: 768px){ 
	.textFixed, .textFixed:hover {	
	width: 90%;
	max-width:90%;
	}
}

.invisibleText {
	display: block;
	position: absolute;
	left: -9999px;
	top: -1000px;
	height: 0;
	width: 0;
	overflow: hidden;
	line-height: 0;
}

.noDisplay {
	display: none;
	height:0;
}

.textMarkerGrey {
	background-color: var(--backgroundColor3);
	border: var(--basicButtonBorder);
	padding-left: 3px;
	padding-right: 3px;
}

.textItalicGrey {
	font-style: italic;
	color: var(--disabledFontColor);
}

.textItalic {
	font-style: italic;
}

.textSmall {
	margin-left: 3px;
	padding-bottom: 1px;
	padding-left: 5px;
	font-size: var(--fontSize5);
}

.textSmallGrey, .textSmallGrey span {
	color: var(--disabledFontColor);
}

.textAccent, .textAccent span {
	color: var(--accentFontColor);
}

.textSmallGrey {
	font-size: var(--fontSize5);
}

.textBold,  .textFixed, .textFixed:hover {
	font-weight: bold;
}

.labelAsDiv + div.textBold,  .labelAsDiv + div.textFixed, .labelAsDiv + div.textFixed:hover {
	vertical-align:top;
}

@media screen and (max-width: 768px){ 	
	.labelItemLine  .answer_54.textBold, .labelAsDiv + .textBold.field-content-wrapper,  .textFixed, .textFixed:hover {
		font-weight: normal;
	}
}

.itemKeywords{
	font-weight: bold;
}

.editKeywordsList .textMarkerGrey{
	display:inline-block;
	padding:3px;
	border-width:2px;
}

.labelBold label {
	font-weight: bold;
	margin-left: 31%;
    text-align: left;
}

input.textBold, a.textBold {
	font-weight: bold;
}

.whiteSpaceNormal {
	white-space: normal;
}

/*Codeformatierung REST-Webservices Anfrage 301172*/
.highlight-code code[class*="language-"],
.curl-command code[class*="language-"]{
  color: var(--contrastFontColor);
 }  

/* Zweck: Diff-Ansicht CC */
.uitext-conf-diff-old {
	text-decoration:line-through;
	color: var(--backgroundColor41);
}

/* Zweck: In Tagesaktuellen Veranstaltungen für Ausfalltermine den Link zur Detailsicht rot und durchgestrichen darstellen, siehe Hiszilla 165181 */
.cancelled_lecture {
	text-decoration:line-through;
	color: var(--backgroundColor41) !important; 
}

/*Zweck: welcome BI */
.welcome_text {
    float: left;
    margin-top: 5px;
    padding-left: 4px;
    padding-right: 4px;
    width: 75%;
}

.headline {
    display: table;
    margin-left: 20px;
    width: 90%;
}

.headline .square1 {
	background-color:var(--backgroundColor11);	
	background-color:var(--backgroundColor12) !important;	
}

.headline .square2 {
	background-color:var(--backgroundColor10);	
}

.headline .square3 {
    margin-bottom: 0;
	background-color: var(--backgroundColor12) !important;
}
.headline .square {
    height: 40px;
    margin-bottom: 7px;
    width: 40px;
}

.headline .headlineText {
    display: table-cell;
    vertical-align: middle;
    width: 100%;
    line-height:1.6em;
}

/*Bricht nur überlange Worte um. Zweck: Bewerbungen sichten (Hiszilla #169713); Zeilen-/Wort-Umbruch erzwingen, damit langer Text ohne Leerzeichen Grenzlinien nicht überschreitet. */
.wordbreak {
	word-break: break-word;
}
/*Bricht alle Worte um, auch "normale" Umbrüche in Zeichenketten, die keine Leerzeichen enthalten, erzeugen*/
.breakAll{
	word-break:break-all;
}

sub {
	vertical-align: sub;
}

sup {	
	vertical-align: super;
}

/*Zweck: Text Overflow mit Pünktchen - funktioniert nur bei reinen Texten */
.ellipsis {
	white-space: nowrap;
	overflow: hidden;
	/* IE 6+, FF 7+, Op 11+, Saf 1.3+, Chr 1+*/
	text-overflow: ellipsis;
	/*for Opera 9 & 10*/
	-o-text-overflow: ellipsis;
}

/* Zweck: Text Overflow Hidden  */
.overflowHidden {
	white-space: nowrap;
	overflow: hidden;
}

/* Zweck: Text Umbruch - erzwungener Umbruch, nicht dudengerecht */
.wortumbruch {
	word-wrap: break-word;
}

/* Zweck: Text Overflow mit einem vollausfüllenenden Fieldset */
.overflowFullSize {
	display: block;
	width: 100%;
}

/*Wird für die highlight Komponente verwendet, um Text zu highlighten*/
.highlightSearch .searchMenuHighlight {
	color: var(--backgroundColor2);
	background-color: var(--accentFontColor);
}

/*****************************************************************************/
/*               Styles für Java Script/Ajax Funktionen                      */
/*****************************************************************************/


/*Zweck: Elemente per CSS ausblenden, wenn Javascript aktiv ist. Diese Klasse wird in einem noscript-Tag wieder auf display: block gesetzt. */
.display-none-if-javascript-active {
    display:none;
}

#applicationEditorPortal{
	background-color: var(--backgroundColor2);
    border-bottom: 2px dashed var(--disabledFontColor);
    display: block;
    height: 4000px;
    margin-bottom: 20px;
    padding-bottom: 10px;
    width: 100%;
}

#applicationEditorPortal iframe{
	width:100%;
	height:100%;
	display:block;
	border:none;
	-webkit-box-flex: 1;
  	-moz-box-flex:  1;
 	-webkit-flex:  1;
  	-ms-flex:  1;
  	flex:  1;
}

/*****************************************************************************/
/*               Styles für individuelle Konfiguration                       */
/*****************************************************************************/
.filterIcon {
	background: none;
	border: none;
}

.eaddress {
	vertical-align: middle;
	margin:2px 0 3px 0;
}

.saveCriteriaContainer {
	-webkit-display: flex;
	-ms-display: flex;
	display: flex;
}

.saveCriteriaBtn {
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	padding-left: 3px;
}

td.singleLine {
	/**
	* TODO: this workaround and css class eventually to be removed completely!!
	*/
	display: table-cell;
	white-space: nowrap;
}

#editApplication .buttonsTopLineBeneath {
	width: 100%;
}

#editApplication .buttonsTopLineBeneath .buttonsTopRight {
	padding-right: 20px;
} 

.semsterContainer {
	text-align: left;
}

.field_with_errors {
	display: inline-block;
	width: 60%;
}

.field_with_errors > *:first-child {
	width: 100%;
}

.captchaBox {
	display: inline-block; 
	width: 33%;
	box-sizing: border-box;
}

.captchaBox:focus span {
  	box-shadow:var(--highlightShadow); 
    /*selectors must be positioned after the variable: for ms edge every property must be specified to avoid flickering*/
    outline:var(--highlightFocusOutline);
}  

.columnHalfLeft .captchaBox {
	width: 60%;
}

.captchaBox .captchaText {
	width: 100%;
	box-sizing: border-box;
	font-weight:bold;
	padding:6px;
}

.elementIterator button {
	background: none;
	border: none;
	padding: 0;
	margin:0;
	vertical-align: top;
	border: var(--highlightBorderTransparent);
}

.elementIterator button:hover {
	vertical-align: top;
}

.elementIterator span {	
	vertical-align: top;
}

.refreshCaptcha {
	vertical-align: top;
}

@media screen and (max-width: 768px){ 	
	.captchaQuestion span{
		width:98% !important;
	}
	.captchaBox{
	width:90%;
	}	
}

.courseResultBar {
	margin-top: 5px;
}

.courseResultBar .searchResultPager {
	display: inline-block;
}

.semester-label,
.label-center {
	margin-right: 5px;
}

.date-field-container {
	margin-right: 10px;
}

/** Zweck: Anpassung des spezifischen Selektors auf höhere Wertigkeit in tagesaktuelle Veranstaltungen anzeigen , da fieldset-Struktur default-Werte überschreibt **/

.box_content .date-field-container label {
	vertical-align: top;
	margin-top: 0;
	display: inline;
	margin-left: 5px;
} 

.date-field-container {
	display: inline-block;
	vertical-align: middle;
}

.elementIteratorText {
	vertical-align: middle;
}

.removeLabel {
	display: none;
}


/**
 * Verwendung: Funktionsbereich "Mein Profil" (HISinOne-COM)
 * Verwendungszweck: Festlegung der Darstellung von "Label"-Elementen für das HISinOne-Profil einer Person
 */
.profileLabel {
	float: left;
	width: 30%;
	margin-top: 5px;
}

.profile-content .profileLabel, .profile-content label {
	float: left;
	width: 12em;
	display:inline;
}

.profile-content .profileValue {
	margin-left: 6em;
}

#studyserviceForm  .profile-content .profileValue{
    margin: 5px 0 0 0;
}   
    
    #studyserviceForm  .profile-content .profileLabel{
    font-weight:bold; 
    text-align:left;   
}

@media screen and (max-width: 1024px){ 			
 	 .profile-content .profileLabel {
    	width: 10em;
	} 	
 	 .profile-content .profileValue {
    	margin-left: 1em;
	}
	 .js_tooltip_image{
		width: 20px;
		height: 20px;
		margin-top: 7px;
	}
	
}

@media screen and (max-width: 768px){ 
     .profile-content .profileValue{
    margin:0;
    display:block;
    }   
    .profile-content .profileLabel{
    float:none;}
    
    #studyserviceForm  .profile-content .profileValue{
    margin:0 0 1em 0;
    display:block;
    }   
    
    #studyserviceForm  .profile-content .profileLabel{
    float:none;    
    font-weight:bold;    
    }
}

.ui-autocomplete.ui-menu{
	max-height: 300px;
	overflow-y: auto;
	max-width: 800px;
	overflow-x: hidden;
	position: absolute;
	z-index: 2000;
}

.ui-autocomplete {
	font-size: var(--fontSize4);
} 

.ui-autocomplete .ui-menu-item .ui-state-active {
   outline:none;
   background-color:var(--highlightBackgroundColor) !important;  
   border-radius:0;
   border:var(--highlightBorder);
}

.ui-autocomplete .ui-menu-item .ui-menu-item-wrapper {   
   border:var(--highlightBorderTransparent); 
}

/* Die Checkbox für den Autologin auf dem Desktop soll korrekt ausgerichtet sein. Wenn das hier entfernt wird, greifen die globalen
Selektoren des Fieldsets und des Labels */
html .mobileLoginContainer .loginPortletCheckbox {
	width: auto;
	text-align: left;
	min-width: 140px;
 }
 
/*Zweck: Antragsfachübersicht in "Bewerbungen sichten": Output-Texte mit großem HTML-Inhalt einpassen bzw. scrollbar machen */
.htmlOutput { 
	overflow: auto; 
	max-height: 200px;
}

.htmlOutput:hover { 
	border: 1px dotted var(--basicButtonBorderColor);
	margin: -1px; /* Nötig, damit keine Verschiebung von Inhalt/Umgebung bei border-Anzeige während hover-Aktion eintritt */
}

/*Zweck: Links, die aufgrund der Platzverhältnisse in mehrere Zeilen umgebrochen werden, sollen in jeder Zeile das gleiche padding usw. (u.a. decorations) besitzen. */
.app_link_text {
	padding: 2px 0 2px 0; 
	-webkit-box-decoration-break: clone;
	-ms-box-decoration-break: clone;
	-o-box-decoration-break: clone;
	box-decoration-break: clone;
}

.app_link_text:hover {
	box-shadow: 2px 0 0 var(--highlightBackgroundColor), -2px 0 0 var(--highlightBackgroundColor); 
}

/*Zweck: Elemente in "Bewerbungen sichten" variabel aus- und einblenden.  Ausgeblendete als navigierbar und durch Selenium ansteuerbar erhalten. */
.bb-mausvariabel, .bb-mausvariabel-top {
	opacity: 0.01;
  	transition: opacity 0.2s linear;
}

.bb-mausvariabel:focus, .bb-mausvariabel-top:focus {
	opacity: 1;
  	transition: opacity 0.2s linear;
}

.bb-mausvariabel_container:hover .bb-mausvariabel, .bb-mausvariabel-top_container:hover .bb-mausvariabel-top {
	opacity: 1;
  	transition: opacity 0.2s linear;
}

/*Zweck: Variables Ein-/Ausblenden (siehe oben) für Tablets und Smartphones deaktivieren */

html.tablet .bb-mausvariabel, html.tablet .bb-mausvariabel-top {
	opacity: 1;
  	transition: unset;
} 

html.mobile .bb-mausvariabel, html.mobile .bb-mausvariabel-top {
	opacity: 1;
  	transition: unset;
} 

/*Zweck: - Element in Fieldset-Headern in "Bewerbungen sichten" sollen vertikal mittig ausgerichtet sein;
          - Fieldset-Header sollen die gleichen abgerundeten Ecken haben wie der gesamte Fieldset-Rand
          - Die Abstände der Fieldsets zueinander sollen einheitliche sein
          - Linksbündige Icons in Fieldset-Headern sollen einen Abstand zum linken Rand einhalten */
.fieldset_kanban .collapseTitle, .fieldset_kanban .layoutFieldsetIconsLeft, .fieldset_kanban .buttonsRight {
	vertical-align: middle;
}

.fieldset_kanban .layoutFieldsetIconsLeft {
	padding-left: 3px;
}

.fieldset_kanban .box_title_blue {
	border-radius: 3px;
}

.fieldset_kanban .box_title_rose, .fieldset_kanban .box_title_yellow, .fieldset_kanban .box_title_green {
	border-radius: 3px;
	margin: 0;
}

/*Zweck: Anpassen des Aussehens von FieldsetMessages innerhalb des Kanban-Layouts von "Bewerbungen sichten" an die anderen Fieldsets */
.helptext.fieldsetMessage_kanban {
	border-radius: 3px;
	line-height: normal;
	padding: 6px;
}

#kanbanLayout>.row {
	width: unset;
	float: unset;	
}

/* .kanbanLayout  */

.kanbanLayout .fieldsetNoBorder{
	padding:0;
}

.kanbanLayout .layoutFieldsetTitle .titleCollapseArea {
	border:none;
}

.kanbanLayout .layoutFieldsetTitle.collapseTitle {
	width:90%;
}

 .kanbanLayout  .box_title_blue .layoutFieldsetTableFlex.printPositionTable{
	background-color: var(--backgroundColor23);
} 

.kanbanLayout  .layoutFieldsetTableFlex.printPositionTable.columnHalfLeft{
	width: 80%;
	min-width:400px;
	padding-bottom: 0;
}

/*Zweck: Anpassung der Antrag-/Antragsfach-Tabelle in Bewerbungen sichten hinsichtlich: Gesamtbreite & gleichbleibende Spaltenbreiten  */
.selectedRequestTable {
	margin-left: -3px;
	margin-right: -3px;
}

.subjectSelectorTable .column0 {
	width: 40%;
}

.subjectSelectorTable .column1 {
	width: 25%;
}

.subjectSelectorTable .column2 {
	width: 30%;
}

.subjectSelectorTable .column3 {
	width: 5%;
}
 
 /*Zweck: OverlayBackground soll gesamte scrollbare Höhe bedecken (bei entsprechend "hohen" Overlays) */
 #applicationEditor .overlayBackground {
 	position: fixed;
 } 
 
/**
 * Verschoben aus jobConfiguration.css damit das CSS der Komponente auch in Overlays verwendet werden kann. Sonst können keine Resourcen
 * via Overlay (AJAX) nachgeladen werden. Verwendungszweck: Style der Komponente "jobConfigurationPanel" zur Konfiguration und Ausführung von (Report-)Jobs.
 */
.jobConfiguration {
	padding: 0.5em;
	margin-top: -1px;
}

.jobConfigurationDetails .input_58, .contextJobConfigurationCreationPanel .input_33{
	vertical-align:middle;
}

.newContextJobConfigurationLink{
	margin-left:30%;
}

@media screen and (max-width: 768px){
	.jobConfigurationInfoText{
	margin-left:0;
    }
    .newContextJobConfigurationLink{
    margin-left:0;
    }
}

.jobConfigurationSelector{	
	padding-left:5px;
	padding-right:5px;
	padding-top:3px;
	padding-bottom:3px;
	border:var(--basicButtonBorder);
	background-color:var(--basicButtonBackgroundColor);
}

.jobConfigurationSelector select{
	margin-left:3px;
	padding:4px;
}
@media screen and (max-width: 768px){
	.jobConfigurationSelector{
		padding:0;
	}
	.jobConfigurationSelector select{
		margin:0;
	}
}
.jobConfigurationSelector option[value=""]{
	display: none;
}

.contextJobConfigurationSelectionPanel label,
.contextJobConfigurationCreationPanel label{	
	text-align: right;
	display: inline-block;
}

.link_button.showReportingCenterLink{
	display:inline-block;
	padding: 8.5px 4px;
}

.jobPanelSegmentTitle h3{
	display:inline-block;
	margin-top:2px;
}

.jobPanelSegmentTitle .helptext{
	width:30%;
} 

.jobPanelSegmentTitle .helpButton{
	margin-top:0;
} 

ul.jobActions {
	list-style-type: "";
	display: inline;
	margin: 0;
	padding: 0;
}

.jobActions > li {
	display: inline;
	margin: 0;
}
	
.jobConfigurationSelector {
		display: inline-block;
}
	
button.submit_image_text.button_badge.jobstartBadge{
	margin-top: 2px;
	margin-right: 3px;
	vertical-align:top;
}

button.submit_image_text.button_badge.jobstartBadge:focus {
    box-shadow: none;
    border: none;
}

button.submit_image_text.button_badge.jobstartBadge span{	
	margin-top: 2px;
	padding-top: 1px;
	padding-right: 3px;
}	

.jobConfigurationSelector .submit_image{
	margin:0;
}

#ncpSelectionForm [type="submit"] {
	margin-top:1.5em;
}

.tenRowsHeight  div.p-editor-content.ql-container.ql-snow {
	height: 200px;
}

.tenRowsHeight  div.p-editor-content.ql-container.ql-snow.ql-disabled .ql-editor {
    background: var(--backgroundColor3) !important;
}

/*****************************************************************************/
/*               UI im IE11 unsichtbar machen                                */
/*****************************************************************************/

.ie_old .imagebottom, 
.ie_old  h1,
.ie_old .boxStandard,
.ie_old .headerRightTop,
.ie_old #logoAndServicesHeader .navbar-toggle,
.ie_old .debugJsf,
.ie_old .mikronavi_submit {
	display: none;
}

.ie_old div.errortext{
	background-image:none;
}

/**
Full width in documents overlay view

*/
/*****************************************************************************/
/*        volle Breite der Kanban Teile in Bewerbungen Sichten im Overlay    */
/*****************************************************************************/

/*Styleguide-Seite HTML,Test neuer HTML-Komponenten detail und accent-color*/

details {
	border: var(--basicButtonBorder);
}

details summary {
	padding-left: 1em;
}

details[open] summary {
	background: var(--backgroundColor24);
	margin-bottom: 1em;
}

input[type="checkbox"].testcheckbox,
input[type="range"], progress{
	opacity:1;
	accent-color:var(--accentFontColor);
}

input[type="checkbox"]:checked + label.testcheckboxlabel::before,
input[type="checkbox"]:not(:checked) + label.testcheckboxlabel::before{
	content:none;
}

/*Sichtbarkeit des Tooltips bei Fokus*/
.focusTooltip {
    position:fixed;
    z-index: 999999;
    background-color:var(--backgroundColor44);
    border:var(--border2);
    color:var(--contrastFontColor);
    box-shadow: 2px 1px 3px var(--highlightShadowColor);
    padding:0.5em 10px;
    font-size:var(--fontSize4);
    line-height:1.2em;
    border-radius:5px;
    max-width:400px;
    animation: fadeIn 1s;
}

@keyframes fadeIn {
  0% { opacity: 0; }
  75% { opacity: 0; }
  100% { opacity: 1; }
}
