/* ****************************************************************************\
|* Suchoptionen                                                               *|
\* ****************************************************************************/

div.page-body-section-options {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	grid-template-rows: auto;
	grid-column-gap: 20px;
	grid-row-gap: 10px;
	grid-template-areas: "search-options-locations search-options-categories search-options-types";
	align-items: start;
	margin: 1rem 0;
}

div.page-body-section-options-category {
	border: solid 1px #eee;
	border-radius: 6px;
	font-size: 1rem;
	color: #bbb;
}
div.page-body-section-options-category.locations {
	grid-area: search-options-locations;
}
div.page-body-section-options-category.categories {
	grid-area: search-options-categories;
}
div.page-body-section-options-category.types {
	grid-area: search-options-types;
}

div.page-body-section-options-category-header {
	position: relative;

	padding: .5rem 1.8rem .5rem .5rem;
	font-size: 1.3rem;

	border-radius: .5rem;
	background-repeat: no-repeat;
	background-size: 22px 22px;
	background-position: right 5px center;
	cursor: pointer;
}
div.page-body-section-options-category.closed div.page-body-section-options-category-header {
	background-image: url("../Icons/Pages/grey_light/ic-chevron-right.svg");
}
div.page-body-section-options-category.open div.page-body-section-options-category-header {
	background-image: url("../Icons/Pages/grey_light/ic-expand-more.svg");
}

div.page-body-section-options-category-header span.page-body-section-options-category-header-counter {
	float: right;
	color: #f1951c;
	letter-spacing: .03rem;
}

div.page-body-section-options-category-tree {
	position: relative;
	padding: 0 .5rem .5rem .5rem;
}

/* Anpassungen: Tablett */

@media only screen and (max-width: 939px) {
	div.page-body-section-options {
		width: 620px;
		grid-template-columns: 1fr 1fr;
		grid-template-areas:
			"search-options-locations search-options-categories"
			"search-options-types ."
		;
	}
}

/* Anpassungen: Mobil */

@media only screen and (max-width: 619px) {
	div.page-body-section-options {
		width: 300px;
		grid-template-columns: 1fr;
		grid-template-areas:
			"search-options-locations"
			"search-options-categories"
			"search-options-types"
		;
	}
}



/* ########################################################################## *\
|# Titel mit Buttons für aktive Filter                                        #|
\* ########################################################################## */

div.page div.page-body > div.page-body-section > header > span > span.label {
	display: inline-block;
}
div.page div.page-body > div.page-body-section > header > span > span.words {
	display: inline-block;
}
div.page div.page-body > div.page-body-section > header > span > span.words:before {
	content: ': ';
	color: #bbb;
}
div.page div.page-body > div.page-body-section > header > span > span.words > a {
	display: inline-block;
	padding-right: 25px;
	margin-right: .5rem;
	border-bottom: none;
	background: url("../Icons/Pages/grey_light/xs_web_icon_delete_01.svg") right 4px no-repeat;
	background-size: 24px 24px;
	cursor: pointer;
	color: #f1951c;
}

/* Anpassungen: Mobil */

@media only screen and (max-width: 619px) {
	div.page div.page-body > div.page-body-section > header > span > span.words > a {
		padding-right: 19px;
		margin-right: .5rem;
		background-size: 18px 18px;
	}
}



/* ########################################################################## *\
|# Filterboxen                                                                #|
\* ########################################################################## */

div.page-body-section-options-category-tree ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}
div.page-body-section-options-category-tree ul li.page-body-section-options-category-tree-node {
	position: relative;
	list-style-type: none;
	margin: 0;
	padding: 0;
}
div.page-body-section-options-category-tree ul li.page-body-section-options-category-tree-node ul li.page-body-section-options-category-tree-node {
	padding-left: 0;
}
div.page-body-section-options-category-tree ul li.page-body-section-options-category-tree-node div.page-body-section-options-category-tree-node-switch {
	display: block;

	margin: 0;
	padding: 3px 23px 3px 20px;

	background-position: -5px 2px;
	background-repeat: no-repeat;
	background-size: 22px 22px;
	cursor: pointer;
}
div.page-body-section-options-category-tree ul li.page-body-section-options-category-tree-node.closed div.page-body-section-options-category-tree-node-switch {
	background-image: url("../Icons/Pages/grey_light/ic-chevron-right.svg");
}
div.page-body-section-options-category-tree ul li.page-body-section-options-category-tree-node.open div.page-body-section-options-category-tree-node-switch {
	background-image: url("../Icons/Pages/grey_light/ic-expand-more.svg");
}
div.page-body-section-options-category-tree ul li.page-body-section-options-category-tree-node.standalone div.page-body-section-options-category-tree-node-switch {
	/*background-image: url("../Icons/Pages/material-design-icons/navigation/ic_unfold_more_24px.svg");*/
	cursor: default;
}

div.page-body-section-options-category-tree li.page-body-section-options-category-tree-node input[type="checkbox"] {
	display: none;
}
div.page-body-section-options-category-tree li.page-body-section-options-category-tree-node input[type="checkbox"] + label {
	display: block;
	
	position: absolute;
	right: 0;
	top: 3px;
	width: 20px;
	height: 24px;

	cursor: pointer;

	background-image: url("../Icons/Pages/grey_light/ic-checkbox-blank.svg");
	background-position: right 5px;
	background-repeat: no-repeat;
	background-size: 16px 16px;
}
div.page-body-section-options-category-tree li.page-body-section-options-category-tree-node.standalone input[type="checkbox"] + label {
	position: relative;
	right: auto;
	top: auto;
	width: auto;
	height: auto;

	margin: 0;
	margin-left: 20px;
	padding: 3px 19px 3px 0;
}
div.page-body-section-options-category-tree li.page-body-section-options-category-tree-node input[type="checkbox"] + label:hover {
	background-color: #f9f9f9;
}
div.page-body-section-options-category-tree li.page-body-section-options-category-tree-node input[type="checkbox"]:checked + label {
	color: #888;
	background-image: url("../Icons/Pages/grey_medium/ic-checkbox-checked.svg");
}
div.page-body-section-options-category-tree li.page-body-section-options-category-tree-node input[type="checkbox"]:indeterminate + label {
	color: #888;
	background-image: url("../Icons/Pages/grey_medium/ic-checkbox-indeterminate.svg");
}



/* ########################################################################## *\
|# Kalenderboxen                                                              #|
\* ########################################################################## */

div.content-tile-box.calendar div.header {
	background-color: rgb(165, 157, 150);
	height: 70px;
}

div.content-tile-box.calendar div.calendar {
	display: table;
	table-layout: fixed;

	position: absolute;
	left: 0;
	top: 70px;
	width: 300px;
	height: 330px;
	overflow: hidden;
	z-index: 5;
}
div.content-tile-box.calendar div.calendar > div.calendar-head {
	display: table-row-group;
}
div.content-tile-box.calendar div.calendar > div.calendar-body > div.calendar-head-row {
	display: table-row;
}
div.content-tile-box.calendar div.calendar > div.calendar-body > div.calendar-head-row > div.calendar-head-cell {
	display: table-cell;
	font-weight: bold;
	text-align: center;
	vertical-align: middle;
	border-bottom: solid 1px #eee;
}
div.content-tile-box.calendar div.calendar > div.calendar-body {
	display: table-row-group;
}
div.content-tile-box.calendar div.calendar > div.calendar-body > div.calendar-body-row {
	display: table-row;
}
div.content-tile-box.calendar div.calendar > div.calendar-body > div.calendar-body-row > div.calendar-body-cell {
	display: table-cell;
	position: relative;
	text-align: center;
	vertical-align: middle;
}
div.content-tile-box.calendar div.calendar > div.calendar-body > div.calendar-body-row > div.calendar-body-cell.outer {
	color: #bbb;
}

div.content-tile-box.calendar div.calendar > div.calendar-body > div.calendar-body-row > div.calendar-body-cell.today,
div.content-tile-box.calendar div.calendar > div.calendar-body > div.calendar-body-row > a.calendar-body-cell.today {
	background-color: #eee;
}
div.content-tile-box.calendar div.calendar > div.calendar-body > div.calendar-body-row > div.calendar-body-cell.today span.day-number,
div.content-tile-box.calendar div.calendar > div.calendar-body > div.calendar-body-row > a.calendar-body-cell.today span.day-number {
	font-weight: bold;
}
div.content-tile-box.calendar div.calendar > div.calendar-body > div.calendar-body-row > a.calendar-body-cell.selected {
	background-color: #f1951c;
	color: #fff;
}

div.content-tile-box.calendar div.calendar > div.calendar-body > div.calendar-body-row > a.calendar-body-cell {
	display: table-cell;
	position: relative;
	text-align: center;
	vertical-align: middle;
	border: none;
}
div.content-tile-box.calendar div.calendar > div.calendar-body > div.calendar-body-row > a.calendar-body-cell.weekyear {
	color: #f1951c;
	/*font-weight: bold;*/
	background-color: #eee;
}
div.content-tile-box.calendar div.calendar > div.calendar-body > div.calendar-body-row > a.calendar-body-cell span.event-count {
	display: block;
	position: absolute;
	right: .4rem;
	top: .4rem;
	font-size: .8rem;
	color: #f1951c;
}
div.content-tile-box.calendar div.calendar > div.calendar-body > div.calendar-body-row > a.calendar-body-cell.selected span.event-count {
	color: #fff;
}



/* ########################################################################## *\
|# Veranstaltungsliste                                                        #|
\* ########################################################################## */

div.page-event-listing {
	width: 100%;

	box-sizing: content-box;
	font-size: .9rem;
}
div.page-event-listing a {
	color: inherit;
	text-decoration: none;
}

/* Standardeintrag */
div.page-event-listing-entry {
	position: relative;
	padding: .5rem 0;
	border-bottom: solid 1px #eee;
}
div.page-event-listing-entry.search-result {
	padding: 1.25rem 0;
}
div.page-event-listing-entry.content-banner-box {
	position: relative;
	margin: 0 !important;
	padding: .5rem 0;
}

div.page-event-listing-entry > a,
div.page-event-listing-entry > span {
	display: grid;
	grid-template-columns: 48px minmax(0, 1fr);
	grid-template-rows: auto;
	grid-column-gap: 5px;
	grid-row-gap: 0;
	grid-template-areas:
		"course-listing-symbol course-listing-captions"
	;
}
div.page-event-listing-entry:hover {
	background-color: #f9f9f9;
}
div.page-event-listing-entry:first-child {
	border-top: solid 1px #eee;
}
/* Eintrag ist "Kein Ergebnis" */
div.page-event-listing-entry.no-result {
	display: grid;
	grid-template-columns: 48px minmax(0, 1fr);
	grid-template-rows: auto;
	grid-column-gap: 5px;
	grid-row-gap: 0;
	grid-template-areas:
		"course-listing-symbol course-listing-captions"
	;
}
div.page-event-listing-entry.no-result-slim {
	display: grid;
	grid-template-columns: 16px minmax(0, 1fr);
	grid-template-rows: auto;
	grid-column-gap: 5px;
	grid-row-gap: 0;
	grid-template-areas:
		"course-listing-symbol course-listing-captions"
	;
}

div.page-event-listing-entry > a,
div.page-event-listing-entry > a:hover,
div.page-event-listing-entry > a:active {
	color: inherit;
	text-decoration: none;
	border-bottom: none;
}
div.page-event-listing-entry div.symbol {
	grid-area: course-listing-symbol;

	position: relative;
	width: 48px;
	height: 64px;
	margin: 0;
	border-radius: 5px;
	overflow: hidden;
}
div.page-event-listing-entry.no-result-slim div.symbol {
	width: 16px;
	height: 16px;
}
div.page-event-listing-entry div.symbol div.symbol-header {
	position: absolute;
	z-index: 10;
	left: 0;
	top: 0;
	right: 0;
	height: 20px;
	padding: 4px 5px;
	color: #fff;
	font-size: .7rem;
	font-weight: bold;
}
div.page-event-listing-entry.no-result-slim div.symbol div.symbol-header {
	height: 16px;
}
div.page-event-listing-entry div.symbol div.picture {
	position: absolute;
	width: 100%;
	left: 0;
	top: 20px;
	height: 44px;
	overflow: hidden;
	z-index: 5;
}
div.page-event-listing-entry div.symbol div.picture img {
	width: 100%;
	height: 100%;
}

div.page-event-listing-entry div.captions {
	grid-area: course-listing-captions;
}
div.page-event-listing-entry div.captions div.location-n-date {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
div.page-event-listing-entry div.captions div.title {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	font-weight: bold;
}
div.page-event-listing-entry div.captions div.profile-title {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	font-style: italic;
}
div.page-event-listing-entry div.captions div.shorttext {
	overflow: hidden;
	display: -webkit-box;
	display: box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	line-clamp: 2;
}

/* Anpassungen: Tablett */

@media only screen and (max-width: 939px) {
	/* Standardeintrag */
	div.page-event-listing-entry > a {
		width: 620px;
	}
}

/* Anpassungen: Mobil */

@media only screen and (max-width: 619px) {
	/* Standardeintrag */
	div.page-event-listing-entry > a {
		width: 300px;
	}
}



/* ########################################################################## *\
|# Detailansicht                                                              #|
\* ########################################################################## */

article.page-body-section-content-details.event-details {
	width: 940px;
	grid-template-columns: 940px;
	grid-template-rows: auto;
	grid-template-areas:
		"header"
		"content"
		"footer"
	;
}
article.page-body-section-content-details.event-details.display-header-picture {
	grid-template-areas:
		"header"
		"header-picture"
		"content"
		"footer"
	;
}
article.page-body-section-content-details.event-details.display-event-map {
	grid-template-areas:
		"header"
		"location-map"
		"content"
		"footer"
	;
}

article.page-body-section-content-details.event-details header div.headlines div.headlines-related-university,
article.page-body-section-content-details.event-details header div.headlines div.headlines-location-date {
	font-size: 1.3rem;
	color: #fff;

	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

article.page-body-section-content-details.event-details div.event-header-picture {
	grid-area: header-picture;
	position: relative;
	width: 100%;
	height: 266px;
	text-align: center;
}
article.page-body-section-content-details.event-details div.event-header-picture img.event-header-picture-background {
	position: absolute;
	left: 50%;
	top: 0;
	width: 940px;
	height: 266px;
	margin-left: -470px;
	z-index: 1;
}
article.page-body-section-content-details.event-details div.event-header-picture picture.event-header-picture-foreground {
	position: relative;
	z-index: 2;
}
article.page-body-section-content-details.event-details div.event-header-picture picture.event-header-picture-foreground img {
	max-height: 266px;
}

article.page-body-section-content-details.event-details div.event-map-canvas {
	grid-area: location-map;
	position: relative;
	width: 100%;
	min-height: 266px;

	background-image: url("../Images/FavoritesMapBackground.jpg");
	background-position: center top;
	background-repeat: no-repeat;
	background-size: 940px 330px;
}
article.page-body-section-content-details.event-details div.event-map-canvas > div.permissions > div.inner {
	position: absolute;

	left: 0;
	top: 0;
	width: 100%;
	height: 266px;

	background-color: rgba(255, 255, 255, .7);
}
article.page-body-section-content-details.event-details div.event-map-canvas > div.permissions > div.inner > div {
	position: relative;
	font-size: 1rem;
	color: #555;
}
article.page-body-section-content-details.event-details div.event-map-canvas > div.permissions > div.inner > div.description {
	padding: 4rem 1rem 0 1rem;
	text-align: center;
}
article.page-body-section-content-details.event-details div.event-map-canvas > div.permissions > div.inner > div.button {
	padding: 1rem 1rem 0 1rem;
	text-align: center;
}
article.page-body-section-content-details.event-details div.event-map-canvas > div.permissions > div.inner > div.button button {
	display: inline-block;
	margin: 0;
	padding: .3rem .3rem .3rem 1.6rem;

	background-color: #f1951c;
	background-image: url("../Icons/Pages/white/xs_web_icon_location_01.svg");
	background-position: .3rem center;
	background-repeat: no-repeat;
	background-size: 1.3rem 1.3rem;

	border: none;
	border-radius: 5px;

	font-size: 1.3rem;
	color: #fff;

	cursor: pointer;
}


article.page-body-section-content-details.event-details div.event-details-content-grid {
	grid-area: content;

	width: 940px;
	display: grid;
	grid-template-columns: 620px auto;
	grid-template-rows: auto;
	grid-column-gap: 20px;
	grid-row-gap: 0;
	padding: 15px;
}
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-main,
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-sidebar {
	width: auto;
	overflow: hidden;
}
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-sidebar {
	color: #bbb;
}
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-main > *,
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-sidebar > * {
	margin-top: .5rem;
	margin-bottom: .5rem;
}
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-main > h1,
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-main > h2,
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-main > h3,
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-main > h4,
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-main > h5,
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-main > h6,
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-sidebar > h1,
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-sidebar > h2,
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-sidebar > h3,
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-sidebar > h4,
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-sidebar > h5,
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-sidebar > h6 {
	margin-top: 1rem;
}
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-sidebar > * {
	color: #bbb;
}
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-main > *:first-child,
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-sidebar > *:first-child {
	margin-top: 0;
	padding-top: 0;
}
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-main > *:last-child,
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-sidebar > *:last-child {
	margin-bottom: 0;
	padding-bottom: 0;
}

article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-sidebar div.university-logo {
	width: 100%;
}
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-sidebar div.university-logo img {
	width: auto;
	max-width: 100%;
	height: auto;
}

article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-sidebar figure.event-picture {
	margin: 0;
	padding: 0;
	width: 100%;
	height: auto;
	border: solid 1px #eee;
	background-color: #eee;
	border-radius: 10px;
	overflow: hidden;
}
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-sidebar figure.event-picture img {
	display: block;
	width: 100%;
	height: auto;
}
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-sidebar figure.event-picture figcaption {
	font-size: .8rem;
	padding: 7px 10px 10px 10px;
}
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-sidebar figure.event-picture figcaption > * {
	margin: .5rem 0;
	padding: 0;
}
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-sidebar figure.event-picture figcaption > *:first-child {
	margin-top: 0;
}
article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-sidebar figure.event-picture figcaption > *:last-child {
	margin-bottom: 0;
}

/* Anpassungen: Tablett */

@media only screen and (max-width: 939px) {
	article.page-body-section-content-details.event-details {
		grid-template-columns: 620px;
		width: 620px;
	}

	article.page-body-section-content-details.event-details div.event-details-content-grid {
		width: 620px;
		grid-template-columns: 300px auto;
	}
	article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-main,
	article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-sidebar {
		overflow: auto;
	}
}

/* Anpassungen: Mobil */

@media only screen and (max-width: 619px) {
	article.page-body-section-content-details.event-details {
		grid-template-columns: 300px;
		width: 300px;
	}

	article.page-body-section-content-details.event-details header div.headlines div.headlines-related-university,
	article.page-body-section-content-details.event-details header div.headlines div.headlines-location-date {
		font-size: 1rem;
	}

	article.page-body-section-content-details.event-details div.event-details-content-grid {
		width: 300px;
		grid-template-columns: auto;
		grid-column-gap: 0;
		grid-row-gap: 12px;
		padding: 12px;
	}
	article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-main,
	article.page-body-section-content-details.event-details div.event-details-content-grid div.event-details-content-grid-sidebar {
		overflow: auto;
	}
}



/* ########################################################################## *\
|# Seitenbrowser                                                              #|
\* ########################################################################## */

div.page-event-listing-page-browser {
	margin: 1rem 0;
	padding: .3em;
	font-size: 1rem;
	color: #bbb;
	text-align: center;

	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
div.page-event-listing-page-browser a,
div.page-event-listing-page-browser a:hover,
div.page-event-listing-page-browser a:active,
div.page-event-listing-page-browser a:visited,
div.page-event-listing-page-browser a:focus,
div.page-event-listing-page-browser span {
	width: auto;
	display: inline-block;
	padding: .3em .4em;
	overflow: hidden;
	color: #bbb;
	border: none;
}
div.page-event-listing-page-browser a.label {
	color: #888;
}
div.page-event-listing-page-browser span.current {
	color: #888;
}


































/* ########################################################################## *\
|# Eingabeformular                                                            #|
\* ########################################################################## */

/* ZUM TESTEN * /
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular input[type="file"],
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular input[type="text"],
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular input[type="email"],
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular input[type="tel"],
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular input[type="number"],
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular input[type="date"],
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular input[type="time"],
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular select,
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular textarea {
	border: none;
	background-color: #eee;
}

div.page div.page-body > div.page-body-section > form.event-frontend-input-formular input[type="file"]:disabled,
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular input[type="text"]:disabled,
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular input[type="email"]:disabled,
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular input[type="tel"]:disabled,
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular input[type="number"]:disabled,
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular input[type="date"]:disabled,
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular input[type="time"]:disabled,
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular select:disabled,
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular textarea:disabled {
	border: none;
	background-color: #bbb;
}
/ * ZUM TESTEN */

div.page div.page-body > div.page-body-section h2.frontend-input-header {
	font-size: 1.6rem;
	margin: 1.5em 0 .5em 0;
	color: #bbb;
}

div.page div.page-body > div.page-body-section > form.event-frontend-input-formular {
	max-width: 620px;
}
/*
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular input:required:invalid,
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular select:required:invalid,
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular textarea:required:invalid {
	outline: solid 1px #f1951c;
}
*/
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular h3 {
	margin-top: 2rem;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular p.error-message {
	color: #f1951c;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-separator {
	font-size: .3rem;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field {
	margin-bottom: .4rem;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field div.input-field-input.with-button {
	display: grid;
	grid-template-columns: auto min-content;
	grid-template-rows: auto;
	grid-column-gap: 5px;
	grid-row-gap: 0;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field div.input-field-input.with-button button {
	display: inline-block;
	margin: 0;
	margin-right: .5rem;
	padding: .5rem .5rem .5rem .5rem;
	min-width: 100px;

	background-color: #bbb;

	border: none;
	border-radius: 5px;

	font-size: 1rem;
	color: #555;
	white-space: nowrap;

	cursor: pointer;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-dual-field {
	margin-bottom: .4rem;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-dual-field:after {
	display: block;
	content: '';
	clear: both;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-dual-field div.input-zip-field {
	float: left;
	width: 20%;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-dual-field div.input-zip-field div.input-field-input {
	width: 99%;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-dual-field div.input-zip-field div.input-field-input input {
	width: 100%;
	min-width: 50px;
}

div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-dual-field div.input-city-field {
	float: left;
	width: 80%;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-dual-field div.input-city-field div.input-field-input {
	width: 100%;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-dual-field div.input-city-field div.input-field-input input {
	width: 100%;
	min-width: 50px;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field input[type="text"],
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field input[type="email"],
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field input[type="tel"],
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field input[type="file"],
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field textarea {
	width: 100%;
	resize: none;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field select {
	width: 100%;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field input[type="file"] {
	font-size: .8rem;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field label.required {
	font-weight: bold;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field label.required:after {
	content: ' \002a';
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field label.required.failure {
	color: #f1951c;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.horizontal-line {
	height: 1px;
	font-size: 0;
	line-height: 0;
	background-color: #eee;
	margin: 2rem 0;
}

div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field div.checkbox-group {
	border: solid 1px #eee;
	border-radius: 6px;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field div.checkbox-group:after {
	content: '';
	display: block;
	clear: left;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field div.checkbox-group > div.checkbox-group-item {
	padding: .3rem 1rem .3rem .3rem;
	float: left;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field div.input-field-checkbox input[type="checkbox"],
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field div.checkbox-group > div.checkbox-group-item input[type="checkbox"] {
	display: none;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field div.input-field-checkbox input[type="checkbox"] + label,
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field div.checkbox-group > div.checkbox-group-item input[type="checkbox"] + label {
	display: block;
	padding-left: 22px;
	min-height: 20px;

	background-image: url("../Icons/Pages/grey_light/ic-checkbox-blank.svg");
	background-position: left center;
	background-repeat: no-repeat;
	background-size: 20px 20px;
	cursor: pointer;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field div.input-field-checkbox input[type="checkbox"]:checked + label,
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field div.checkbox-group > div.checkbox-group-item input[type="checkbox"]:checked + label {
	background-image: url("../Icons/Pages/grey_light/ic-checkbox-checked.svg");
}


div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field div.radio-group {
	border: solid 1px #eee;
	border-radius: 6px;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field div.radio-group:after {
	content: '';
	display: block;
	clear: left;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field div.radio-group > div.radio-group-item {
	padding: .3rem 1rem .3rem .3rem;
	float: left;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field div.input-field-radio input[type="radio"],
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field div.radio-group > div.radio-group-item input[type="radio"] {
	display: none;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field div.input-field-radio input[type="radio"] + label,
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field div.radio-group > div.radio-group-item input[type="radio"] + label {
	display: block;
	padding-left: 22px;
	min-height: 20px;

	background-image: url("../Icons/Pages/grey_light/ic-checkbox-blank.svg");
	background-position: left center;
	background-repeat: no-repeat;
	background-size: 20px 20px;
	cursor: pointer;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field div.input-field-radio input[type="radio"]:checked + label,
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field div.radio-group > div.radio-group-item input[type="radio"]:checked + label {
	background-image: url("../Icons/Pages/grey_light/ic-checkbox-indeterminate.svg");
}



div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field div.select-relation-container {
	background-color: #fff;
	border: solid 1px #eee;
	border-radius: 6px;
}
/*
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field div.select-relation-container.invalid {
	outline: solid 1px #f1951c;
}
*/
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field div.select-relation-container div.select-relation-placeholder {
	color: #555;
	padding: 0.3rem;
	cursor: pointer;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field div.select-relation-container input {
	border: none;
	padding: 0.3rem;
}

div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field-group div.input-field {
	float: left;
	margin-right: .3rem;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.input-field-group:after {
	content: '';
	display: block;
	clear: left;
}

div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.field-gdpr-acknowledgment {
	position: relative;
	padding: .3rem;
	border: solid 1px #eee;
	border-radius: 6px;
	margin-top: .5rem;
	margin-bottom: .5rem;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.field-gdpr-acknowledgment div.field-gdpr-acknowledgment-checkbox {
	display: block;
	position: absolute;
	left: .3rem;
	top: .3rem;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.field-gdpr-acknowledgment label {
	display: block;
	width: 100%;
	font-size: .8rem;
	padding-left: 1.5rem;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.field-gdpr-acknowledgment label.failure {
	color: #f1951c;
}


div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.event-frontend-input-formular-newsletter {
	position: relative;
	padding: .3rem;
	border: solid 1px #eee;
	border-radius: 6px;
	margin-top: .5rem;
	margin-bottom: .5rem;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.event-frontend-input-formular-newsletter input {
	display: block;
	position: absolute;
	left: .3rem;
	top: .3rem;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.event-frontend-input-formular-newsletter label {
	display: block;
	width: 100%;
	padding-left: 1.5rem;
}


div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.captcha {
	width: 150px;
	padding: 0;
	border: solid 1px #eee;
	border-radius: 6px;
	margin-top: .5rem;
	margin-bottom: .5rem;
	overflow: hidden;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.captcha div.image {
	border-bottom: solid 1px #eee;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.captcha div.input input {
	min-width: 150px;
	width: 150px;
	border: none;
}

div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.event-frontend-input-formular-button {
	margin-top: 2rem;
	margin-bottom: 2rem;
}
div.page div.page-body > div.page-body-section > form.event-frontend-input-formular div.event-frontend-input-formular-button button {
	display: inline-block;
	margin: 0;
	margin-right: .5rem;
	padding: .5rem .5rem .5rem .5rem;
	min-width: 100px;

	background-color: #f1951c;

	border: none;
	border-radius: 5px;

	font-size: 1rem;
	color: #fff;

	cursor: pointer;
}