@charset "utf-8";

/******************************************************************************
 *
 * Programm-Liste
 *
 ******************************************************************************/

/*** The complete list ***/
.calendar-event-list-definition-list {
/*	clear: both; */
	float: right;
	display: inline;
	width: 100%;
/*	max-height: 2000px; */
/*	overflow-y: scroll; */
	padding-right: 5px ;
	background-color: inherit;
}

/*** The output of the current page and the number of total pages ***/
.calendar-event-list-definition-list .calendar-list-template-header {
}

/*** The output of the date range and the number of matches  ***/
.calendar-event-list-definition-list .calendar-list-template-header2 {
}

/*** A complete entry of the event-list ***/
.calendar-event-list-definition-list .calendar-event-list-definition-list-entry {
	border-bottom: 1px solid black;
	margin-bottom: 5px;
}

/****************************************************************************************************
 *
 *	Ein ganzer Eintrag
 *
 ****************************************************************************************************/
.calendar-event-list-definition-list .calendar-event-list-entry {
	clear: both;
	float: left;
	overflow: hidden;
	display: inline;
	width: 100%;
	padding: 3px;
	margin-top: 5px;
/*	border-bottom: 1px solid #cccccc; */
}

.calendar-event-list-definition-list .calendar-event-list-entry.calendar-even.event-with-time {
/*  background-color: red; */
}

.calendar-event-list-definition-list .calendar-event-list-entry.calendar-odd.event-with-time {
/*  background-color: green; */
}

.calendar-event-list-definition-list .calendar-event-list-entry.calendar-even.event-allday {
/*  background-color: magenta; */
}

.calendar-event-list-definition-list .calendar-event-list-entry.calendar-odd.event-allday {
/*  background-color: blue; */
}

/*** Event Details ***/
.calendar-event-list-definition-list .calendar-list-text-block .event-detail {
	float: left;
	width: 100%;
	overflow: hidden;
	color: #000000;
	padding-left: 0 !important;
}

.calendar-event-list-definition-list .calendar-list-text-block .event-detail label {
	float: left;
}

.calendar-event-list-definition-list .calendar-list-text-block .event-detail .value {
	float: left;
/*	font-size: var(--input-field-big-screen---font-size); */
	line-height: 27px;
}

@media all and (max-width: 640px) {
	.calendar-event-list-definition-list .calendar-list-text-block .event-detail label {
		width: 100px;	/* Für "Ort:" */
	}
}

@media all and (min-width: 640px) {
	.calendar-event-list-definition-list .calendar-list-text-block .event-detail label {
		width: 160px;
	}
}

/****************************************************************************************************
 *
 *	Title-Bar, Bild und Text-Block ohne Superuser-Info
 *
 ****************************************************************************************************/
.image-and-text-wrapper {
	float: left;
	width: 100%;
/*	border: 1px solid #555555; */
}

.calendar-event-list-definition-list .calendar-event-list-entry a:hover,
.calendar-event-list-definition-list .calendar-event-list-entry a:focus {
	text-decoration: none;
}

/*** The image of one entry ***/
.calendar-event-list-definition-list .calendar-list-image img {
/*	max-width: 100px; wird via tx_calendar_controller.listW gesetzt */
/*	width: 75px; */
	height: auto;
}

/*** Die Elemente des Text-Teils (rechts des Bildes) ohne den Titelbalken ***/
.calendar-event-list-definition-list .preview-text {
	clear: both;
	float: left;
/*	padding: 2px 0 2px 5px; */
}

/****************************************************************************************************
 *
 *	Der Balken mit dem Titel der Veranstaltung
 *
 ****************************************************************************************************/
.calendar-event-list-definition-list .calendar-list-title-bar {
	display: table;
	height: 50px;
	padding: 0 10px;
	font-size: 16px;
	font-weight: bold;
}

.calendar-event-list-definition-list .event-controls {
	display: table-cell;
	vertical-align: middle;
/*	border: 1px solid red; */
}

.calendar-event-list-definition-list .event-control {
	display: table-cell;
	min-width: 50px;
	text-align: center;
	vertical-align: middle;
/*	border: 1px solid red; */
}

.calendar-event-list-definition-list .event-control-on-white {
	display: table-cell;
	min-width: 50px;
	text-align: center;
	vertical-align: middle;
	background-color: white;
}

/*** Titel-Link ***/
.calendar-event-list-definition-list .calendar-list-title-bar a {
	display: block;
	line-height: 100%;
/*	border: 1px solid green; */
}

.calendar-event-list-definition-list .calendar-list-title-bar a img {
/*	border: 1px solid blue; */
}

.calendar-event-list-definition-list .calendar-list-title-bar a:hover {
	text-decoration: underline;
}

/** Allday Event ***/
.calendar-event-list-definition-list .calendar-list-allday-title {
/*	color: #000; */
}

/****************************************************************************************************
 *
 *	Image and Text
 *
 ****************************************************************************************************/
.calendar-list-image-and-text-block {
	float: left;
	width: 100%;
	border: 1px solid #dddddd;
	background-color: #f9f9f9;
	border-bottom-left-radius: 3px;
	border-bottom-right-radius: 3px;
	padding: 3px;
}

/****************************************************************************************************
 *
 *	Image
 *
 ****************************************************************************************************/
.calendar-event-list-definition-list .calendar-list-image {
/*	max-width: 100px; */
/*	margin-top: 5px; */
/*	border: 1px solid magenta; */
}

/****************************************************************************************************
 *
 *	Der Text-Teil (rechts des Bildes) eines ganzer Eintrags
 *
 ****************************************************************************************************/
.calendar-event-list-definition-list .calendar-list-text-block {
	margin-left: 0;
	padding-left: 10px;
	/*	padding-right: 80px; */
	/*	border-left: 1px solid #cccccc; */
	z-index: 10000;
}

/*** The field with date and time ***/
.calendar-event-list-definition-list .calendar-list-date-time {
	padding-top: 10px;
	color: #000000;
}

/*** The date and time fields ***/
.calendar-event-list-definition-list .calendar-list-date,
.calendar-event-list-definition-list .calendar-list-time {
	color: #000000;
}

/*** The teaser ***/
.calendar-event-list-definition-list .calendar-list-teaser {
	padding-top: 10px;
	font-style: italic;
	font-weight: normal;
	color: #c00;
}

.calendar-event-list-definition-list .calendar-list-teaser p {
	padding: 0 !important;
	margin: 0 !important;
}

.calendar-event-list-definition-list .calendar-list-teaser .bodytext {
	margin-top: 10px;
	margin-bottom: 10px;
	font-weight: bold;
 	color: #000;
}

/*** The category ***/
.calendar-event-list-definition-list .calendar-list-category {
	padding-top: 10px;
}

/*** The organizer ***/
/*
.calendar-event-list-definition-list .organizer-preview {
	color: #000000;
	margin-top: 0;
	margin-bottom: 0;
	padding-left: 5px;
}
*/

/*** The location ***/
/*
.calendar-event-list-definition-list .location-preview {
	color: #000000;
	margin-top: 0;
	margin-bottom: 0;
	padding-left: 5px;
}
*/

.calendar-event-list-definition-list .location-preview a {
	color: #000000;
}

.calendar-event-list-definition-list .location-preview a:hover {
	color: #000000;
	text-decoration: underline;
}

.calendar-event-list-definition-list .calendar-list-description {
	font-size: 12px;
	font-style: italic;
	color: #000;
}

.calendar-event-list-definition-list .calendar-list-description .bodytext {
	font-size: 12px;
	font-style: italic;
}

/*** The footer ***/
	.calendar-event-list-definition-list .calendar-list-template-footer {
}

/** The pages browser **/
.calendar-pagebrowser {
	float: left;
	display: inline;

	width: 100%;
	height: auto;
	margin-top: 10px;
	margin-bottom: 20px;
	border: 1px solid #eeeccc;
}

.pagebrowser-actPage {
	padding: 5px;
	margin: 2px;
	border: 1px solid red;
}

.pagebrowser-page {
	padding: 5px;
	margin: 2px;
}

.calendar-pagebrowser .page-of {
	padding: 5px;
	float: left;
	display: inline;

}

.calendar-pagebrowser .pages {
	padding: 5px;
	float: left;
	display: inline;

}

.pagebrowser-next {
	padding: 5px;
	margin: 2px;
}

.pagebrowser-prev {
	padding: 5px;
	margin: 2px;
}

.pagebrowser-space {
	margin-left: 20px;
	margin-right: 20px;
}


.calendar-event-list-definition-list .calendar-list-day-wrapper {
}

.calendar-event-list-definition-list .calendar-list-month-wrapper {
}

.calendar-event-list-definition-list .calendar-list-template {
}

.calendar-event-list-definition-list .calendar-list-week-wrapper {
}

.calendar-event-list-definition-list .calendar-pagebrowser {
}

.calendar-event-list-definition-list .yearTitle {
	float: left;
	width: 100%;
	height: auto;
	margin: 0;
	font-weight: bold;
	font-size: 24px;
}

.calendar-event-list-definition-list .monthTitle {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 18px;
	font-weight: normal;
	height: 50px;
	line-height: 50px;
	text-align: left;
	padding-left: 35px;
	color: #000000;
	background-color: #eeeeee;
	margin-bottom: 0;
}

.calendar-event-list-definition-list .monthTitle,
.calendar-event-list-definition-list .month {
	clear: both;
	float: left;
	width: 100%;
}

.calendar-event-list-definition-list .month {
	padding-left: 0;
	padding-right: 0;
	border: 0;
}

.calendar-event-list-definition-list .month {
	margin-bottom: 30px;
}

/**
 * jQuery Checkbox-Button
 */
.ui-button,
.ui-button:hover {
	background: transparent;
}

.ui-state-active {
	background-image: none;
}

.ui-button:hover,
.ui-button.ui-state-active:hover {
	background-image: none;
}

input.ui-button {
	padding: 0;
}

.calendar-list-title {
	display: table-cell;
	width: 100%;
	text-align: left;
	vertical-align: middle;
}

.calendar-list-title h1 {
	color: inherit;
	margin: inherit;
	padding: inherit;
	font-size: inherit;
	font-weight: inherit;
	font-family: inherit;
}

.calendar-list-title-wrap {
	display: block;
	width: 100%;
/*	border: 1px solid red; */
}

.edit-and-delete-event {
	display: table-cell;
	width: 100px;
	text-align: right;
	vertical-align: middle;
}

.edit-and-delete-event a {
	margin-right: 10px;
}

.tx-cal-controller .calendarEvents,
.tx-cal-controller .deleteSelectedEvents {
	float: left;
	width: 100%;
	margin-top: 20px;
}

.tx-cal-controller .deleteSelectedEvents input {
	float: right;
}

/********************************************************************************
 *
 * Ganz kleine Displays:
 * iPhone, iPhone4, iPhone5
 * width <= 640
 *
 ********************************************************************************/
@media all and (max-width:400px) {

	/* Die Veranstaltungsliste kommt bis an den Rand des Displays */
	.tx-cal-controller {
/*		margin-left: -15px; */
/*		margin-right: -15px; */
	}

	.ui-accordion .ui-accordion-content {
		padding: 0;
		border: 0;
	}

	.calendar-event-list-definition-list .calendar-event-list-entry {
		padding: 0;
	}
}

/********************************************************************************
 *
 * Kleine Displays:
 * iPhone, iPhone4, iPhone5
 * width <= 640
 *
 ********************************************************************************/
@media all and (max-width: 767px) {

	/* Kategorienumschaltung nicht anzeigen */
	.legend {
	display: none;
	}
}

/********************************************************************************
 *
 * Grosse Displays:
 * iPhone, iPhone4, iPhone5
 * width <= 640
 *
 ********************************************************************************/
@media all and (min-width:768px) {

	/* Eingeloggter Benutzer ist ersichtlich bei Logoug */
	.menu-top-username-box {
		display: none;
	}
}

#toggleShowAccordions {
	clear: both;
	float: right;
	margin-bottom: 10px;
	background-color: #eeeeee;
	color: #555;
	border-radius: 5px;
	padding: 0 10px;
}

#toggleShowAccordions:hover {
	background-color: #dddddd;
}

@media all and (max-width:767px) {
	#toggleShowAccordions {
		/* display: none; */
	}
}

.event-admin-info {
	clear: both;
	float: left;
	width: 100%;
	font-size: 12px;
	color: #555;
	background-color: #eee;
	margin-top: 10px;
}

.event-admin-info b,
.event-admin-info strong {
	font-size: 12px;
}

/**
 * Die Felder und Buttons zum Neuladen des Kalenders
 */
.calendarRefreshHeader {
	float: left;
	width: auto;
	font-weight: bold;
	margin: 0 0 10px 0;
}

form[name="calendarRefreshForm"] {
	float: left;
	width: 100%;
}

/* Ganzes Feld mit dem Startdatum, dem Enddatum und dem Button */
.calendarStartAndEndDate {
	display: table;
	height: 40px;
	width: 100%;
}

/* Ganzes Feld mit dem Startdatum, dem Enddatum und dem Button */
.calendarOldDatesRow {
	display: table-row;
}

/* Ganzes Feld mit dem Startdatum, dem Enddatum und dem Button */
.calendarStartEndDateCell {
	display: table-cell;
	vertical-align: middle;
	padding-right: 10px;
	height: 40px;
}

.calendarStartEndDateField {
	float: left;
}

.calendarStartEndDateField label {
	float: left;
	margin-right: 10px;
}

.calendarStartEndDateField input {
	float: left;
	width: 90px;
}

/* Neu laden Button */
.calendarRefreshButton {
	display: table-cell;
	text-align: right;
	vertical-align: middle;
	padding-right: 10px;
	margin-right: 10px;
}

.calendarRefreshButton input {
	height: 30px;
	line-height: 24px;
}

.calendar_search_box {
	display: table;
	height: 40px;
	width: 100%;
}

.calendar_search_label {
	display: table-cell;
	vertical-align: middle;
	width: 100px;
}

.calendar_search_field {
	display: table-cell;
	vertical-align: middle;
}

@media all and (max-width:767px) {

	/* Ganzes Feld mit dem Startdatum, dem Enddatum und dem Button */
	.calendarStartAndEndDate {
		float: left;
		width: 100%;
		height: 40px;
		margin-bottom: 20px;
	}

	/* Ganzes Feld mit dem Startdatum, dem Enddatum und dem Button */
	.calendarOldDatesRow {
	}

	/* Startdatum oder Enddatum */
	.calendarStartEndDateCell {
		float: left;
		width: 100%;
		vertical-align: middle;
		padding-right: 10px;
		height: 40px;
	}

	.calendarStartEndDateField {
		float: left;
	}

	.calendarStartEndDateField label {
		float: left;
		width: 80px;
		margin-right: 5px;
	}

	.calendarStartEndDateField input {
		float: left;
		width: 90px;
	}

	/* Neu laden Button */
	.calendarRefreshButton {
		float: left;
		width: 100%;
		vertical-align: middle;
		padding-right: 10px;
		margin-right: 10px;
	}

	.calendarRefreshButton input {
		height: 24px;
		line-height: 24px;
	}
}