/* ---- Font Awesome ------------ */

@font-face {
  font-family: Font-Awesome-Solid;
  src: url("https://fortbildung.stadtdo.de/customFiles/customCSS/fa-solid-900.woff2");
}

@font-face {
  font-family: Font-Awesome-Regular;
  src: url("https://fortbildung.stadtdo.de/customFiles/customCSS/fa-regular-400.woff2");
}

/* ----- Ende Font Awesome ------------ */

/* -------- Fonts StadtDo----------- */

@font-face {
  font-family: "BebasNeuePro-ExpThIt";
  src: url('https://fortbildung.stadtdo.de/customFiles/webFonts/BebasNeueProExpThIt/font.woff2') format('woff2'), url('http://localhost:8080/ecadia/customFiles/webFonts/BebasNeueProExpThIt/font.woff') format('woff');
}
@font-face {
  font-family: "BebasNeuePro-ExpBk";
  src: url('https://fortbildung.stadtdo.de/customFiles/webFonts/BebasNeueProExpBk/font.woff2') format('woff2'), url('http://localhost:8080/ecadia/customFiles/webFonts/BebasNeueProExpBk/font.woff') format('woff');
}
@font-face {
  font-family: "BebasNeuePro-ExpBkIt";
  src: url('https://fortbildung.stadtdo.de/customFiles/webFonts/BebasNeueProExpBkIt/font.woff2') format('woff2'), url('http://localhost:8080/ecadia/customFiles/webFonts/BebasNeueProExpBkIt/font.woff') format('woff');
}
@font-face {
  font-family: "BebasNeuePro-ExpIt";
  src: url('https://fortbildung.stadtdo.de/customFiles/webFonts/BebasNeueProExpIt/font.woff2') format('woff2'), url('http://localhost:8080/ecadia/customFiles/webFonts/BebasNeueProExpIt/font.woff') format('woff');
}
@font-face {
  font-family: "BebasNeuePro-ExpMdIt";
  src: url('https://fortbildung.stadtdo.de/customFiles/webFonts/BebasNeueProExpMdIt/font.woff2') format('woff2'), url('http://localhost:8080/ecadia/customFiles/webFonts/BebasNeueProExpMdIt/font.woff') format('woff');
}
@font-face {
  font-family: "BebasNeuePro-ExpEbIt";
  src: url('https://fortbildung.stadtdo.de/customFiles/webFonts/BebasNeueProExpEbIt/font.woff2') format('woff2'), url('http://localhost:8080/ecadia/customFiles/webFonts/BebasNeueProExpEbIt/font.woff') format('woff');
}
@font-face {
  font-family: "BebasNeuePro-ExpRg";
  src: url('https://fortbildung.stadtdo.de/customFiles/webFonts/BebasNeueProExpRg/font.woff2') format('woff2'), url('http://localhost:8080/ecadia/customFiles/webFonts/BebasNeueProExpRg/font.woff') format('woff');
}
@font-face {
  font-family: "BebasNeuePro-ExpLtIt";
  src: url('https://fortbildung.stadtdo.de/customFiles/webFonts/BebasNeueProExpLtIt/font.woff2') format('woff2'), url('http://localhost:8080/ecadia/customFiles/webFonts/BebasNeueProExpLtIt/font.woff') format('woff');
}
@font-face {
  font-family: "BebasNeuePro-ExpMd";
  src: url('https://fortbildung.stadtdo.de/customFiles/webFonts/BebasNeueProExpMd/font.woff2') format('woff2'), url('http://localhost:8080/ecadia/customFiles/webFonts/BebasNeueProExpMd/font.woff') format('woff');
}
@font-face {
  font-family: "BebasNeuePro-ExpLt";
  src: url('https://fortbildung.stadtdo.de/customFiles/webFonts/BebasNeueProExpLt/font.woff2') format('woff2'), url('http://localhost:8080/ecadia/customFiles/webFonts/BebasNeueProExpLt/font.woff') format('woff');
}
@font-face {
  font-family: "BebasNeuePro-ExpBdIt";
  src: url('https://fortbildung.stadtdo.de/customFiles/webFonts/BebasNeueProExpBdIt/font.woff2') format('woff2'), url('http://localhost:8080/ecadia/customFiles/webFonts/BebasNeueProExpBdIt/font.woff') format('woff');
}
@font-face {
  font-family: "BebasNeuePro-ExpEb";
  src: url('https://fortbildung.stadtdo.de/customFiles/webFonts/BebasNeueProExpEb/font.woff2') format('woff2'), url('http://localhost:8080/ecadia/customFiles/webFonts/BebasNeueProExpEb/font.woff') format('woff');
}
@font-face {
  font-family: "BebasNeuePro-ExpTh";
  src: url('https://fortbildung.stadtdo.de/customFiles/webFonts/BebasNeueProExpTh/font.woff2') format('woff2'), url('http://localhost:8080/ecadia/customFiles/webFonts/BebasNeueProExpTh/font.woff') format('woff');
}
@font-face {
  font-family: "BebasNeuePro-ExpBd";
  src: url('https://fortbildung.stadtdo.de/customFiles/webFonts/BebasNeueProExpBd/font.woff2') format('woff2'), url('http://localhost:8080/ecadia/customFiles/webFonts/BebasNeueProExpBd/font.woff') format('woff');
}


/* -------- Ende Fonts StadtDo----------- */



/* ---- Icons von StadtDo --- */

@font-face {
  font-family: 'icons';
  src: url('https://fortbildung.stadtdo.de/customFiles/customCSS/icons.ttf?4q8az9') format('truetype');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

.icon {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icons' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-account:before {
  content: "\e900";
}
.icon-arrow-left:before {
  content: "\e901";
}
.icon-arrow-right:before {
  content: "\e902";
}
.icon-checkbox:before {
  content: "\e903";
}
.icon-checkbox-checked:before {
  content: "\e904";
}
.icon-download:before {
  content: "\e905";
}
.icon-filter:before {
  content: "\e906";
}
.icon-folder:before {
  content: "\e907";
}
.icon-menu:before {
  content: "\e908";
}
.icon-search:before {
  content: "\e909";
}
.icon-star:before {
  content: "\e90a";
}

/* ----- Ende Icons von StadtDo ---- */

:root {
  --stadtdo-color-darkblue: #1E2D50;
  --stadtdo-color-lightblue: #96CDE6;
}


 /* Generelles */

div.contentArea {
	margin: 0 auto;
	max-width: 1300px;
	clear: both;
}

.ui-page-theme-a {
	background-color: #efefef !important;
}
.fa-solid {
	 font-family: Font-Awesome-Solid !important;
}

/* Text auswählbar machen */
.ecadiaMobilePage :not(INPUT):not(TEXTAREA):not(a), .unselectable {
	-webkit-user-select: auto;
	-moz-user-select: auto;
	-ms-user-select: auto;
	-o-user-select: auto;
	user-select: auto;
}

/* das war ein komisches 2px padding? */
#mainPage {
	padding-top: 0px !important;
}

/* Header ist fixed, der Content rutscht jetzt in den Header rein. Damit unterbinden wir das */
div.contentArea {
	margin-top: 120px !important;
}

.fa-regular {
	font-family: Font-Awesome-Regular !important;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
	background-color: var(--stadtdo-color-darkblue)
}

.stadtdo-bottom {
  color: #292929;
  border: 2px solid #292929;
  padding: 8px 16px 12px 16px;
  border-radius: 46px;
  cursor: pointer;
  display: inline-block;
  font-family: 'BebasNeuePro-ExpBd' !important;
  font-size: .875rem;
  letter-spacing: .025rem;
  line-height: 1;

}

.stadtdo-bottom .icon {
	font-size: 1.25rem;
    position: relative;
    top: 4px;
	margin-right: 6px !important;
	line-height: 1rem;
}

.stadtdo-bottom i {
  font-size: 1.25rem;
  line-height: 1rem;
  margin-right: .5rem;
  position: relative;
  top: 4px;
}


.stadtdo-bottom:hover {
	background-color: #96CDE6;
}

*:not(.fa-solid,.icon):not(.fa-regular, .icon) {
	font-family: BebasNeuePro-ExpMd;
}

h1:not(.fa-solid, .icon), h2:not(.fa-solid,.icon), h3:not(.fa-solid, .icon) {
	font-family: BebasNeuePro-ExpEb !important;
	color: black;
}

/* Im Anmeldeprozess soll es nicht schwarz sein */
a:not(.wizard *) {
	color: black !important;
}

/* Im Standard sind h2 - h3 gleich groß?*/
h3 {
	font-size: 1em !important;
}

a {
	text-decoration: none !important;
	
}

.ui-input-text {
	border-radius: 0 !important;
}

div#userTiles {
	display: none;
}

div#headerAreaExplorer {
	background-color: #96CDE6;
    padding: 20px;
    margin-bottom: 20px;
	border-radius: 6px;
}

div#headerAreaExplorer h1 {
	font-family: 'BebasNeuePro-ExpBd' !important;
    font-size: 36px;
    font-style: italic;
    line-height: 40px;
    letter-spacing: 0.36px;
    text-transform: uppercase;
}

 /* Header */

.customHeader h2 {
    text-transform: uppercase;
    line-height: 1.1;
    color: #1E2D50 !important;
    letter-spacing: .05rem;
    padding-top: .2rem;
}

.customHeader {
	border-bottom: 1px solid #e3e3e3;
    box-shadow: 0 0 15px rgb(0, 0, 0, .2);
}

.heading-welcomeblock {
	color: white;
	font-size: 36px;
}

.customHeader .header-heading {
    margin: 10px 16px 0 36px !important;
}


/* Das Menu rechts und die Überschriften bei Smartphones ausblenden */
@media (max-width: 1000px) {
	.hide-in-mobile {
		display: none;
	}
}
	
@media (max-width: 500px) {
	.customHeader .icon, .customHeader .fa-solid {
		font-size: 10px !important;
	}
	.customHeader h2 {
		font-size: 10px !important;
	}
	
	#header-menu-area table td i, #header-menu-area table td span.icon{
		font-size: 10px !important;
		margin: 0 15px !important;
	}
}

div#header-menu-area {
    position: absolute;
    right: 10px;
}

@media (max-width: 334px) {
	div#header-menu-area {
		display: none;
	}
}

.grid-welcomeblock {
	display: grid;
	grid-template-columns: 3fr 1fr;
}
@media (max-width: 1000px) {
	.grid-welcomeblock {
		grid-template-columns: 1fr;
		padding: 24px !important;
	}
	
	.grid-welcomeblock .image-view-items {
		max-width: 500px;
		margin: 24px 0;
	}
}
.image-view-items {
	width: 100%;
	margin: 20px;
}

.homepage-searchbar {
	width: 100%;
    background-color: #1E2D50;
    margin: 120px auto 48px;
	border-radius: 6px;
    padding: 16px 36px 24px;
}

.homepage-searchbar:after {
    content: ' ';
    display: block;
    clear: both;
}


#searchInputAreaHeader #explorerSearchForm .ui-btn:not(ul *) {
	color: white !important;
    background-color: #1E2D50 !important;
    border-radius: 20px !important;
    background-image: none !important;
	border: 2px solid white !important;
}

#searchInputAreaHeader #explorerSearchForm .ui-btn.ui-mini.hideLargeMedia {
    border: 0!important;
}

#searchInputAreaHeader #explorerSearchForm .setBookmarks.hideLargeMedia,
#searchInputAreaHeader #explorerSearchForm .setBookmarks.hideSmallMedia {
	display: none!important;
}

#searchInputAreaHeader #explorerSearchForm label[for=checkOnlyThisFolder] {
	border: 0!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;
}
/* Breadcrums END */

#searchInputAreaHeader #explorerSearchForm .ui-btn.ui-icon-plus:after,
#searchInputAreaHeader #explorerSearchForm .ui-btn.ui-icon-play:after {
	/*font-family: Font-Awesome-Solid !important;*/
	font-family: 'icons' !important;
	background-image: none !important;
	background-color: transparent  !important;
}


#searchInputAreaHeader #explorerSearchForm .ui-btn.ui-icon-play:after {
	content: "\e909" !important;
}

#searchInputAreaHeader #explorerSearchForm .ui-btn.ui-icon-plus:after {
	content: "\e906" !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;
}


/* Katalog */

.explorerTrainingProductListItem .ui-li-count {
	font-size: 18px;
    background-color: beige;
}

.FolderCell {
	background-color: white  !important;
	box-shadow: 0 0 10px rgb(185, 185, 185);
	background-image: none !important;
	padding: 0px 20px !important;
}

.FolderCell.FolderCellNoImage {
    /*height: 250px;*/
}

.FolderTitle {
	font-size: 26px;
	margin-bottom: 10px;
}

.FolderTitle, .FolderDescription {
	color: black;
	
}

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

.contentArea {
	padding: 0 !important;
}

#searchInputAreaHeader > div:first-child {
	background-color: #1E2D50;
}

#searchInputAreaHeader > div:first-child {
	padding: 15px;
    margin: 0 auto;
}

#searchInputAreaHeader .ui-input-search {
	margin-top: 12px !important;
}


div[data-role=header].header {
	display: none !important;
}

.ui-listview > li h1, .ui-listview > li h2, .ui-listview > li h3, .ui-listview > li h4, .ui-listview > li h5, .ui-listview > li h6 {
    white-space: normal;
}

div#productListAreaExplorer li a img:first-child, #searchResultArea li a img:first-child {
	display: none;
}

div#productListAreaExplorer li, #searchResultArea li {
	margin-bottom: 20px;
}
div#productListAreaExplorer a:after, #searchResultArea a:after {
	display: none;
}

div#productListAreaExplorer li a, #searchResultArea li a {
	background-color: white;
}

#productListAreaExplorer ul, #searchResultArea ul {
	box-shadow: none;
}

#productListAreaExplorer.tileLayout ul,
#searchResultArea.tileLayout ul {
	max-width: 100%;
	display: flex;
    flex-wrap: wrap;
}

.TrainingProductTitleExplorerTitle, .TrainingProductTitleExplorerID {
	color: black;
}

.ui-btn {
	text-shadow: none !important;	
}

#searchResultArea {
	background-color: transparent;
}

table.eventTable td, table.eventTable th {
	padding: 0 20px 2px 20px !important;
}
table.eventTable th {
	color: grey !important;
}

span.newTrainingProductText {
    display: block;
    position: absolute;
    top: 10px;
    right: 8px;
    background-color: #ffcc00;
    color: white;
    border-radius: 100%;
    padding-top: 9px;
    text-transform: uppercase;
    width: 40px;
    height: 40px;
    box-sizing: border-box;
    text-align: center;
}

/* Damit auch unten ein kleiner Rand kommt in der Ergebnisliste der Bildungsprodukte */
a.explorerTrainingProductListItem {
	border-bottom-width: 1px !important;
}

/* -----Bildungsprodukt Seite -------*/

#columnLeft, #columnRight {
	width: 100%;
}

.pageTypeClass-trainingproduct .pageHeader,
.pageTypeClass-webPage .pageHeader{
	display: none;
}

@media only screen and (min-width: 768px) {
    .mainContentArea  {
        margin: 0 auto;
        max-width: 1290px;
    }
}

@media only screen and (min-width: 1001px) {
	#columnLeft {
    	margin-right:12px;
    	width: 60%;
    }
	
	#columnRight{
    	width: 38%;
	}
}

.mainContentArea  {
	display: flex;
	flex-wrap: wrap;
}
	
.mainContentArea h1#title {
	width: 100%;		
}

.pageHeader{
   /** display:none; **/
}
.pageHeader .ui-li-icon {
	display: none;
}

#title{
    color: #000000;
    font-size:36px;
    font-weight: bold;
}

#columnLeft {

}

.predecessorDiv .stadtdo-bottom {
    border: 0;
	border-radius: 0;
    padding: 8px 0;
    line-height: 1.4;
	border-bottom: 1px solid #dedede;
	display: block;
}

.predecessorDiv .stadtdo-bottom:hover {
    background-color: transparent;
	color: #96CDE6;
}

.predecessorDiv .stadtdo-bottom i {
    font-size: .8rem;
    top: 0px;
}

.buttonBarArea .ui-link:hover {
	background-color: #96CDE6 !important;
	cursor: pointer;
}


#trainingproductcontent-area {
	padding: 36px;
	background-color: #ffffff;
	border-radius:6px;
	font-size: 18px;
    line-height: 28px;
    letter-spacing: .18px;
}

#trainingproductcontent-area div.textBlockArea p img {
	max-width: 100%;
	height: auto;
}

.signInDiv {
    padding: 24px;
    background-color:#96CDE6;
    margin-bottom:12px;
    border-radius:6px;
}

.signInDiv .stadtdo-bottom:hover {
	background-color: #1e2d50;
	color: #fff;
}

.signInHeading {
    color:#ffffff;
    text-transform: uppercase;
    letter-spacing: 0.36px;
    font-size:36px;
    font-weight: bold;
    font-style: italic;
}
a.signInLink {
    border-style:solid;
    border-width:2px;
    border-radius:40px;
    border-color:black; 
    padding:10px;
    text-decoration: none;
    color:#000000;
    background-color:#ffffff;
    display: inline-block;
    margin: 5px;
}
.dataDiv, .predecessorDiv, .fachlicherAnsprechpartnerDiv {
    padding: 24px;
    background-color:#ffffff;
    margin-bottom:12px;
    border-radius:6px;
}
.supplierDiv{
    padding: 24px;
    background-color:#ffffff;
    border-radius:6px;
}
.catalogue-heading{
    color:#000000;
    font-size:24px;
    font-weight: bold;
}
.textBlockArea p{
    margin: 0px;
}

h2.catalogue-heading {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
    margin-top: 0 !important;
	letter-spacing: .02rem;
}

#columnLeft h2.catalogue-heading {
	margin-top: 1.5rem !important;
}

#trainingproductcontent-area > div:first-child > h2.catalogue-heading {
    margin-top: 0 !important;
}

.textBlockArea ul {
    margin-top: 0;
}

/* --------Ende Bildungsprodukt ---------------- */


/* ----- Für alle anderen Seiten ------*/

xa.ui-btn, xxbutton {
	    border-radius: 20px !important;
    border: 1px solid black !important;
    background-color: white !important;
}

a.ui-collapsible-heading-toggle {
	background-color: #1E2D50 !important;
	color: white !important;
}
a.ui-collapsible-heading-toggle:hover {
	background-color: #96CDE6 !important;
}

.customContentArea a.ui-collapsible-heading-toggle {
	background-color: #96CDE6 !important;
}

ul[data-role="listview"] .ui-btn:hover {
	background-color: #96CDE6 !important;
}
/* ----- Ende Für alle anderen Seiten ------*/


/** LOGIN **/

@media only screen and (max-width: 768px) {
	div#startpage-frontimage {
    	float: none!important;
    	width: 100%!important;
    	height: 20vh!important;
	}
	
	div#startpage-frontimage + div {
		float: none!important;
    	width: 100%!important;
    	height: auto!important;
	}
	
	div#startpage-frontimage + div > div {
		margin-top: 4rem!important;
	}
}


/** GENERAL **/
div {
  box-sizing: border-box;
}

/** TYPOGRAPHY **/

h1:not(.fa-solid, .icon), h2:not(.fa-solid,.icon), h3:not(.fa-solid, .icon) {
  color: #292929;
}

.contentArea h1 {
  font-size: 2.25rem;
}

.contentArea h3 {
  font-size: 1.5rem !important;
}


/** BLOCKS **/

#explorer.ui-content {
  padding: 0;
  overflow: visible;
  margin-bottom: 96px;
}

#folderListAreaExplorer {
  display: flex;
  flex-wrap: wrap;
}

.btn-folderCell {
  float: none;
  width: 50%;
}

.FolderCell {
  background-color: white !important;
  box-shadow: 0 0 6px #00000029;
  background-image: none !important;
  padding: 24px 36px !important;
  box-sizing: border-box;
  margin: 0 12px 12px 0;
}

.btn-folderCell:nth-child(2n) .FolderCell {
  margin-right: 0;
}

.FolderCell.FolderCellNoImage {
  border-radius: 6px;
  height: 95%!important;
}

.FolderCell.FolderCellNoImage * {
  margin: 0;
}

.FolderTitle, .FolderDescription {
  color: #292929;
  padding: 0;
}

.FolderTitle {
  margin-bottom: 12px;
}

.FolderTitle h3 {
  padding-bottom: 0 !important;
  margin-top: 0 !important;
}

@media (max-width: 900px) {
  .btn-folderCell {
    width: 100%;
  }

  .btn-folderCell .FolderCell {
    margin-right: 0;
  }
}


/* Lukas Höfgen: Ich hab das erstmal auskommentiert, weil das die Searchbar nun verändert hatte *&
.contentArea_home > div:first-of-type, 
div#headerAreaExplorer {
  /* border-radius: 6px; */
  /*padding: 36px 96px !important; */
  /* margin-bottom: 36px; */
}

.contentArea_home > div:first-of-type h1,
#headerAreaExplorer h1 {
  /** .t1 **/
  font-family: 'BebasNeuePro-ExpBd' !important;
  font-size: 36px;
  font-style: italic;
  line-height: 40px;
  letter-spacing: 0.36px;
  text-transform: uppercase;
}

div#productListAreaExplorer li, #searchResultArea li {
    margin-bottom: 12px;
}

div#productListAreaExplorer li a, #searchResultArea li a {
  border-radius: 6px;
  border: none;
  box-shadow: 0 0 6px #00000029;
  padding: 36px 96px;
}

@media (max-width: 1000px) {
	div#productListAreaExplorer li a, #searchResultArea li a {
		padding: 24px;
	}
}

@media (max-width: 680px) {
	a.explorerTrainingProductListItem > h2, a.explorerTrainingProductListItem > .embeddedProductRating {
    	padding-left: 0 !important;
	}
	
	a.explorerTrainingProductListItem.ui-btn {
    	padding-left: 24px !important;
	}
}

div#productListAreaExplorer li a *, #searchResultArea li a * {
  margin: 0;
  margin-top: 0 !important;
}

.TrainingProductTitleExplorerID {
  margin-bottom: 6px !important;
  display: block;
  /** .p3 **/
  font-family: 'BebasNeuePro-ExpMd';
  font-size: 14px;
  font-style: normal;
  line-height: 20px;
  letter-spacing: 0.28px;
}

.TrainingProductTitleExplorerTitle, .explorerTrainingProductListItem h2 {
  display: block;
  /** .t3 **/
  font-family: 'BebasNeuePro-ExpEb' !important;
  font-size: 1.5rem !important;
  font-style: normal;
  line-height: 1.75rem;
  letter-spacing: 0;
}

table.eventTable td, table.eventTable th {
    padding: 0 24px 6px 0 !important;
}

div#productListAreaExplorer li a p, #searchResultArea li a p {
  /** .p1 **/
  font-family: 'BebasNeuePro-ExpMd';
  font-size: 18px;
  font-style: normal;
  line-height: 24px;
  letter-spacing: 0.18px;
}


/** SEARCH **/

#searchInputAreaHeader > div:first-child {
  border-radius: 6px;
  padding: 24px 36px;
}

.contentArea_search .RankingWidget {
	display: none;
}


/** BREADCRUMBS **/

#explorer > .ui-btn {
  padding: .75rem 0;
}

#explorer > .ui-btn:hover {
  text-decoration: underline !important;
}


/** LAYOUT **/

div.contentArea {
  margin: 0 auto 96px;
  max-width: 95%;
  overflow: visible;
}

#folderListAreaExplorer {
  max-width: none;
}

@media (min-width: 1400px) {
  div.contentArea, 
  .homepage-searchbar {
    max-width: 1290px;
  }
}


/** BUCHUNG / KONTO **/

#MobileemployeeContainer_TabSetemployeeContainer,
#register-steps {
  background-color: #ffffff;
  border-radius: 6px;
  box-shadow: 0 0 6px #00000029;
  padding: 24px !important;
}

.wizard > .content {
  background-color: #ffffff;
  overflow: visible;
  margin: 0;
}

.wizard > .content > .body {
  padding-left: 24px;
}

.wizard > .steps a, .wizard > .steps a:hover {
  font-family: BebasNeuePro-ExpBd;
  margin: 0 .5em 2px 0 !important;
  border-radius: 0 !important;
}

.wizard > .steps .first a {
  border-radius: 6px 6px 0 0 !important;
}

.wizard > .steps .last a {
  border-radius: 6px 6px 0 0 !important;
}

.wizard.vertical > .steps .last a {
  border-radius: 0 0 6px 6px !important;
}

.wizard > .steps {
  z-index: 199;
}

.wizard .steps li:not(.current):not(.disabled) a {
  background-color: #96CDE6;
  color: #292929;
}

.wizard .steps li:not(.current):not(.disabled) a:hover {
  background-color: #1E2D50;
  color: #ffffff;
}

.wizard > .steps .current a, .wizard > .steps .current a:hover, .wizard > .steps .current a:active {
  background-color: #1E2D50;
}

.wizard > .actions a {
  font-family: BebasNeuePro-ExpBd;
  background-color: #96CDE6;
  border-radius: 24px;
  border: 2px solid #292929;
  color: #292929;
}

.wizard > .actions a:hover, .wizard > .actions a:active {
  background-color: #1E2D50;
  border-radius: 24px;
  border: 2px solid #1E2D50;
  color: #ffffff;
}

.wizard > .content .icon24 {
	display: none;
}

.ui-grid-a > .ui-block-a, .ui-grid-b > .ui-block-a {
    padding-right: 1rem;
}

.ui-grid-a > .ui-block-b, .ui-grid-b > .ui-block-c {
    padding-left: 1rem;
}

.ui-bar, .ui-body {
    padding: 0 0 1rem;
}

.content table td {
    vertical-align: top;
    padding: .5rem 1rem .5rem 0;
    border-bottom: 1px solid #efefef;
}

.content table {
    border-collapse: collapse;
    margin: 1rem 0;
	min-width: 70%;
}

.content table td table {
	margin: 0;
	width: 100%;
}

p.preregister-existing-manager-name, p.register-existing-manager-name {
	color: red;
	font-size: 20px;
}

.register-existing-manager-name ~ .ui-shadow-inset,  .preregister-existing-manager-name ~ .ui-shadow-inset, #priorizedManagerArea .ui-shadow-inset {
    border-color: red !important;
}

#EmployeeListAutocomplete a[id^="searchResultItem"] p {
	display: none;
} 

/** POSTEINGANG+NACHRICHTEN / SPERRZEITEN **/

.contentArea.contentArea_myCorrespondenceList.ui-content,
.contentArea.contentArea_selfServiceHolidays.ui-content
 {
    background: #fff;
    padding: 24px !important;
    box-sizing: border-box;
    box-shadow: 0 0 12px rgb(0 0 0 / 10%);
    border-radius: 6px;
}

.correspondenceJobHeader {
    padding: 24px;
    background: #96CDE6;
    border-radius: 6px;
    box-shadow: 0 0 10px rgb(0 0 0 / 10%);
}

.correspondenceJobAttachments {
    padding: 24px;
    background: #fff;
    border-radius: 6px;
    box-shadow: 0 0 10px rgb(0 0 0 / 10%);
    margin: 24px 0;
}

.correspondenceJobBody {
    padding: 24px;
    margin: 24px 0;
    box-shadow: 0 0 10px rgb(0 0 0 / 10%);
}

div#headerContainer .ui-block-a {
    width: 200px;
}

div#headerContainer .ui-block-a label {
    font-family: 'BebasNeuePro-ExpBd';
}

.correspondenceJobAttachments h3 {

}

label.mobileWidget[name='subjectValue'] {
    font-family: 'BebasNeuePro-ExpBd';
    margin-bottom: 24px;
}

.correspondenceJobBody h2 {
    font-size: 1.0rem;
}


/** Startseite **/

.customContentArea > div {
	border-radius: 6px;
}

.customContentArea > div h1 {
  font-family: 'BebasNeuePro-ExpBd' !important;
  font-size: 36px;
  font-style: italic;
  line-height: 40px;
  letter-spacing: 0.36px;
  text-transform: uppercase;
}

.grid-welcomeblock .heading-welcomeblock,
.columnRight .signInHeading {
  color: #fff !important;
}

.grid-welcomeblock .tab-list a {
    border-bottom: 1px solid;
    font-family: 'BebasNeuePro-ExpBd' !important;
}

.grid-welcomeblock .tab-list .ui-collapsible-content a {
    font-family: 'BebasNeuePro-ExpMd'!important;
}

.customContentArea .grid-welcomeblock a.ui-collapsible-heading-toggle {
    background-color: #1E2D50 !important;
}

.customContentArea .grid-welcomeblock a.ui-collapsible-heading-toggle:hover,
.textBlockArea a.ui-collapsible-heading-toggle:hover {
    background-color: #2f7595 !important;
}

.grid-welcomeblock .ui-collapsible-inset .ui-collapsible-heading .ui-btn,
.textBlockArea .ui-collapsible-inset .ui-collapsible-heading .ui-btn {
    border: 0;
    border-radius: 6px 6px 0 0;
}

.grid-welcomeblock .ui-collapsible-inset .ui-collapsible-heading.ui-collapsible-heading-collapsed .ui-btn,
.textBlockArea .ui-collapsible-inset .ui-collapsible-heading.ui-collapsible-heading-collapsed .ui-btn
 {
    border-radius: 6px;
}
@media (min-width: 900px) {
	.grid-welcomeblock .ui-collapsible-content {
		column-count: 2;
		padding-bottom: 1.25rem;
	}  
}


.grid-welcomeblock .ui-collapsible-content p {
    border-bottom: 1px solid #dedede;
    box-sizing: border-box;
    margin: 0;
}

.grid-welcomeblock .ui-collapsible-content p a {
    font-family: 'BebasNeuePro-ExpMd'!important;
    border-bottom: 0;
    padding: .5rem;
    display: block;
    text-shadow: none;
}

.textBlockArea a.ui-link {
    text-shadow: none;
}
.textBlockArea p a.ui-link, .textBlockArea li a.ui-link,
#contentFieldContent a {
	text-decoration: underline!important;
    color: rgb(20,180,230)!important;
}

.grid-welcomeblock .ui-collapsible-content p a:hover {
    background-color: #96CDE6;
}

div.textBlockArea {
    margin-bottom: 1.5rem;
}

table.textBlockArea {
	border: 0;
	border-collapse: collapse;
	margin: .5rem 0 0;
	width: 100%;
}

table.textBlockArea tr {
    border-bottom: 1px solid #dedede;
}

table.textBlockArea tr td {
    padding: .5rem;
	padding-left: 0;
}

table.eventHTMLDescription {
	border-collapse: collapse;
}

table.eventHTMLDescription tr {
    border-bottom: 1px solid #dedede;
}

table.eventHTMLDescription tr td {
	padding: .5rem 0;
}

table.eventHTMLDescription tr td table {
	width: 100%;
}

table.eventHTMLDescription tr td table td {
	padding: 0;
}

.textBlockArea .ui-collapsible-inset {
    margin: 0 0 0.25rem 0;
}

.textBlockArea b, .textBlockArea strong {
    font-weight: normal;
    font-family: 'BebasNeuePro-ExpBd'!important;
}

.textBlockArea .ui-collapsible-content {
    padding: 1em 1em;
    border-radius: 0 0 6px 6px;
}

.fachlicherAnsprechpartnerDiv h2,
.supplierDiv h2,
.predecessorDiv h2 {
	margin-bottom: .5rem!important;
}

.fachlicherAnsprechpartnerDiv p {
	margin: 0;
}

.fachlicherAnsprechpartnerDiv p,
.supplierDiv .textBlockArea {
	line-height: 1.4;
}


h1.signInHeading {
    color: #ffffff!important;
    text-transform: uppercase;
    letter-spacing: 0.36px;
    font-size: 36px!important;
    font-style: italic;
    margin-bottom: 0!important;
    margin-top: 0!important;
    font-family: 'BebasNeuePro-ExpBd'!important;
}

/** NEWS **/

ul.newsItemList {
	background-color: #fff;
    padding: 2rem;
    border-radius: 6px;
}

li.newsItemMain {
    border-bottom: 1px solid #efefef;
	background: transparent;
	margin: 0;
	padding: 0;
}

li.newsItemMain a {
	display: block;
    padding: 20px;
}

li.newsItemMain a:hover {
	background-color: #96CDE6;
}

.newsItemTextArea {
	float: none;
}

/** WBT + Video **/

.contentArea_selfStudyProgram .ui-block-a.ui-block-largeMedia60 {
	background: #fff;
	padding: 24px;
	border-radius: 6px;
	display: flex;
	flex-direction: column;
	margin-right: 12px;
}

.contentArea_selfStudyProgram .ui-body.ui-body-a.ui-corner-all.contentDiv:first-child {
	display: grid;
	order: 15;
}

.contentArea_selfStudyProgram .ui-block-b.ui-block-largeMedia40 {
	background: #fff;
	padding: 24px;
	border-radius: 6px;
	margin-right: -12px;
}

.contentArea_selfStudyProgram .dataDetails h2 {
	border-bottom: 0 !important;
	font-size: 24px;
}

.contentArea_selfStudyProgram .icon24 {
	display: none;
}

.contentArea_selfStudyProgram .ui-icon-star,
.contentArea_selfStudyProgram .ui-icon-mail,
.contentArea_selfStudyProgram .ui-icon-print {
	background-color: #fff!important;
	border-radius: 6px;
}

.contentArea_selfStudyProgram .expandArea p,
.contentArea_selfStudyProgram .expandArea ul li {
	font-size: 18px;
    line-height: 28px;
    letter-spacing: .18px;
}

.ecadiaHTMLContentArea img {
    max-width: 100%;
    height: auto;
}

#scormContentFrame {
	border: 0;
}

.contentArea.contentArea_wbtPlayer.ui-content {
  max-width: 100%;
  margin-bottom: 0px;
  min-height: 100%!important;
  margin-top: 80px!important;
}

.contentArea_selfStudyProgram .trainingProductDetail table {
	margin: 1rem 0;
}

.contentArea_selfStudyProgram .trainingProductDetail td {
	min-width: auto !important;
}

.contentArea_selfStudyProgram .trainingProductDetail h3 {
	font-size: 1rem !important;
    margin: 0 !important;
    padding: 0 !important;
}

.hide-next-sibling-element + p {    display: none;}

#popupApprovalDataArea > table{width:100%;}

.contentArea_selfStudyProgram #MobilelinkMyWbts_ButtonlinkMyWbts, 
.contentArea_selfStudyProgram #runPreregister {
	background-color: #96CDE6;
    border: 0;
    border-radius: 24px;
	max-width: 19rem;
}

#register-steps-p-0 .trainingProductDetail .ui-body h1 {
	font-size: 1.3rem;
}


/** Web Page **/

.contentArea_webPage {
	font-size: 18px;
    line-height: 28px;
    letter-spacing: .18px;
	max-width: 960px !important;
}

.lp_block {
	padding: 1rem 36px;
    margin-bottom: 1rem;
}

.lp_block.image_header {
	background-size: cover;
    padding: 3rem 36px;
    border-radius: .5rem;
}

.lp_block.image_header h1 {
    color: #fff;
    text-shadow: 0 0 12px rgba(0, 0, 0, .25);
	font-family: "BebasNeuePro-ExpBd" !important;
}

.lp_block a {
	text-decoration: underline !important;
    color: rgb(20, 180, 230) !important;
}

.lp_block a:hover {
	color: rgb(50, 130, 200) !important;
}

.lp_block.white {
	background-color: #ffffff;
	border-radius: 6px;
}

.lp_flex_container {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    grid-auto-rows: 1fr;
    grid-column-gap: 1rem;
    grid-row-gap: 1rem;
}

@media only screen and (min-width: 720px) {
	.lp_flex_container {
    	grid-template-columns: repeat(2, 1fr);
	}
}

@media only screen and (min-width: 960px) {
	.lp_flex_container {
    	grid-template-columns: repeat(3, 1fr);
	}
	.lp_flex_container.lp50 {
    	grid-template-columns: repeat(2, 1fr);
	}
}

ul.lp_flex_container {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

.lp_flex_item.empty {
  visibility: hidden;
}

.lp_block .lp_flex_item.card {
    border: 1px solid rgba(30,45,80,.15);
    height: 100%;
    display: block;
    box-sizing: border-box;
    font-size: 18px;
	line-height: 1.2;
	position: relative;
	box-shadow: 0 0 12px rgba(0,0,0,.15);
	transition: box-shadow .15s ease-in-out;
}

.lp_block .lp_flex_item.card:hover {
	box-shadow: 4px 4px 18px rgba(0,0,0,.25);
}

.lp_block .lp_flex_item.card img {
    width: 100%;
	height: auto;
}

.lp_block .lp_flex_item.card .card_body {
    padding: .5rem .75rem;	
}

.lp_block .lp_flex_item.card h4,
.lp_block .lp_flex_item.card h4 a {
	font-size: 18px;
	line-height: 1.2;
	font-family: "BebasNeuePro-ExpBd" !important;
	margin: 0 0 .5rem !important;
}

.lp_block .lp_flex_item.card a {
	text-decoration: none!important;
	color: #000!important;
}

.lp_block .lp_flex_item.card a::after {
	display: block;
	content: ' ';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.lp_block .lp_flex_item.card h5 {
	font-family: "BebasNeuePro-ExpBd";
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.075rem;
	color: #aaa;
}

.lp_block .lp_flex_item.card p {
	font-family: "BebasNeuePro-ExpMd";
	font-size: 14px;
	color: #999;
	margin: 0 0 .5rem;
}

.lp_block strong, .expandArea strong {
	font-family: "BebasNeuePro-ExpBd" !important;
	font-weight: bold;
}

/*** Feedback Formular ***/

.question_container .matrixTable .table h3, 
.question_container .quest h2 {
	padding-left: 0;
    font-size: 1.25rem !important;
    font-weight: normal;
    padding-top: 1rem !important;
    padding-bottom: .75rem !important;
	width: 100% !important;
}

.question_container table.table-responsive {
	padding-left: 0 !important;
}