/**
 * Styles für die Portal-Ansicht
 * Diese CSS-Datei wird nur bei Login eingebunden und beinhaltet
 * sämtliche Portal-sepzifischen Definitionen
 */

/* Allgemeines
---------------*/

	main h3 {
		font-size: 18px;
		margin-bottom: 20px;
	}

/* Portal-Navigation
---------------------*/

	.portalnavigation {
		margin: 0 0 20px 0;
	}

	.portalnavigation li {
		list-style-type: none;
		margin: 0;
	}

	.portalnavigation li a {
		display: block;
		padding: 12px 20px;
		text-decoration: none;
		font-size: 14px;
		font-weight: 500;
		border-bottom: 1px dashed #DDDDDD;
	}

	.portalnavigation li:last-of-type a {
		border-bottom: none;
	}

	.portalnavigation li a.active {
		background-color: #F8F8F8;
		font-weight: bold;
		color: #333333;
	}

	.portalnavigation li a:hover {
		background-color: #F2F2F2;
	}

	.portalnavigation li a .fa {
		padding-right: 7px;
	}

/* Kalender-Timeline
---------------------*/

	.calendar {
		background-color: #FFFFFF;
		width: 100%;
		overflow-y: scroll;
		margin-top: 20px;
		margin-bottom: 20px;
		box-sizing: border-box;
		position: relative;
		padding-bottom: 10px;
		border-radius: 5px;
	}

	.calender * {
		box-sizing: border-box;
	}

	.calendar-grid {
		width: 9999px;
	}

	/* Monat
	----------*/

		.month {
			display: block;
			float: left;
		}

		.month-title {
			display: block;
			padding: 5px 10px;
			text-align: center;
			border-bottom: 1px solid #DDDDDD;
			border-right: 1px solid #DDDDDD;
			font-size: 12px;
			background-color: #f2f2f2;
		}

		.days {
			white-space: nowrap;
			border-bottom: 1px dotted #AAAAAA;
		}

		.days:after {
			content: "";
			clear: both;
			display: table;
		}

		.days .day {
			display: block;
			width: 20px;
			height: 20px;
			float: left;
			border-right: 1px dotted #AAAAAA;
			text-align: center;
			font-size: 12px;
			line-height: 18px;
		}

		.days:first-of-type .day {
			background-color: #efefef;
		}

		.days .day[data-weekday="sat"],
		.days .day[data-weekday="sun"]{
			background-color: #efefef;
		}

		.days .day.today {
			background-color: #f44336 !important;
			color: #FFFFFF;
		}

		.days .day:hover {
			background-color: #f2f2f2;
			cursor: default;
		}

	/* Buchung
	-----------*/

		.booking {
			background-color: #0C7DD8;
			height: 20px;
			border-radius: 5px;
			position: absolute;
			cursor: pointer;
			color: #FFFFFF;
			line-height: 18px;
			font-size: 12px;
			font-weight: 400;
			padding-left: 10px
		}

/* Stellenanzeigen
-------------------*/

	.package {
		position: relative;
		background-color: #FFFFFF;
		padding: 20px;
		margin-bottom: 20px;
	}

	.package {
		border-left: 3px solid #91C515;
	}

	.package.is-inactive {
		border-left: 3px solid #f44336;
	}

	.package.is-planned {
		border-left: 3px solid #999999;
	}

	.package.ui-droppable-hover {
		background-color: #c1e2b3;
	}

	/* Titel
	---------*/

		.package-title {
			font-weight: bold;
			margin: 0;
		}

	/* Aktionen
	------------*/

		.package-job-counter {
			position: absolute;
			top: 20px;
			right: 20px;
			font-size: 14px;
		}

	/* Info
	--------*/

		.package-info {
			margin: 0 0 20px 0;
			padding: 0;
		}

		.package-info li {
			display: inline-block;
			list-style-type: none;
			font-size: 11px;
			font-weight: 400;
			border-right: 1px solid #DDDDDD;
			padding: 0px 5px 0 5px;
		}

		.package-info li:first-of-type {
			padding-left: 0;
		}

		.package-info li:last-of-type {
			border-right: none;
		}

	/* Erstellen-Button
	--------------------*/

		.btn-create-entry {
			display: none;
			position: absolute;
			top: 15px;
			left: calc(50% - 20px);
		}

		.package-slot:hover .btn-create-entry {
			display: inline-block;
			}

	/* Slot
	--------*/

		.package-slot {
			background-color: #f8f8f8;
			border-radius: 5px;
			padding: 0;
			min-height: 60px;
			background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMTIwMCIgaGVpZ2h0PSIxMjAwIiB2aWV3Qm94PSIwIDAgMTIwMCAxMjAwIj48Zz48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSg2MDAgNjAwKSBzY2FsZSgwLjY5IDAuNjkpIHJvdGF0ZSgwKSB0cmFuc2xhdGUoLTYwMCAtNjAwKSIgc3R5bGU9ImZpbGw6IzY2NjY2NiI+PHN2ZyBmaWxsPSIjNjY2NjY2IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4bWw6c3BhY2U9InByZXNlcnZlIiB2ZXJzaW9uPSIxLjEiIHN0eWxlPSJzaGFwZS1yZW5kZXJpbmc6Z2VvbWV0cmljUHJlY2lzaW9uO3RleHQtcmVuZGVyaW5nOmdlb21ldHJpY1ByZWNpc2lvbjtpbWFnZS1yZW5kZXJpbmc6b3B0aW1pemVRdWFsaXR5OyIgdmlld0JveD0iMCAwIDY2MSA2NjEiIHg9IjBweCIgeT0iMHB4IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCI+PGRlZnM+PHN0eWxlIHR5cGU9InRleHQvY3NzIj4KICAgCiAgICAuZmlsMCB7ZmlsbDojNjY2NjY2fQogICAKICA8L3N0eWxlPjwvZGVmcz48Zz48cGF0aCBjbGFzcz0iZmlsMCIgZD0iTTMzMSAwYzM2LDAgNjYsMzAgNjYsNjZsMCAxOTkgMTk4IDBjMzcsMCA2NiwyOSA2Niw2NiAwLDM2IC0yOSw2NiAtNjYsNjZsLTE5OCAwIDAgMTk4YzAsMzcgLTMwLDY2IC02Niw2NiAtMzcsMCAtNjYsLTI5IC02NiwtNjZsMCAtMTk4IC0xOTkgMGMtMzYsMCAtNjYsLTMwIC02NiwtNjYgMCwtMzcgMzAsLTY2IDY2LC02NmwxOTkgMCAwIC0xOTljMCwtMzYgMjksLTY2IDY2LC02NnoiPjwvcGF0aD48L2c+PC9zdmc+PC9nPjwvZz48L3N2Zz4=");
			margin-bottom: 10px;
			background-size: 20px 20px;
			background-position: center;
			background-repeat: no-repeat;
			cursor: pointer;
			position: relative;
			border: 1px dotted #DDDDDD;
		}

		.package-slot:hover {
			background-color: #f0f0f0;
		}



	/* Job-Eintrag im Slot
	-----------------------*/

		.job-offer {
			background-color: #FFFFFF;
			border-radius: 5px;
			width: 100%;
			border-top: 1px solid #DDDDDD;
			border-right: 1px solid #DDDDDD;
			border-left: 1px solid #DDDDDD;
			margin-bottom: 15px;
			-webkit-box-shadow: 0px 3px 2px -1px rgba(128,125,128,1);
			-moz-box-shadow: 0px 3px 2px -1px rgba(128,125,128,1);
			box-shadow: 0px 3px 2px -1px rgba(128,125,128,1);
		}

		.job-offer-title {
			font-weight: bold;
			padding: 10px 10px;
		}

		.job-offer-content {
			padding: 0 10px 10px 30px;
		}

		.job-offer-content * {
			font-size: 12px;
		}

		.job-offer-content:after {
			content: "";
			clear: both;
			display: table;
		}

		.job-offer.unpublished {
			opacity: 0.4;
		}

		.jobs {
			min-height: 40px;
		}

		.jobs .hr {
			position: relative;
			display: block;
			padding: 0 0 20px 0;
			margin: 20px 0 0 0;
			width: 100%;
			text-align: center;
		}

		.jobs .hr:before {
			content: "";
			display: block;
			position: absolute;
			top: 10px;
			width: 100%;
			border-bottom: 1px dotted #DDDDDD;
		}

		.jobs .hr span {
			position: relative;
			z-index: 2;
			display: inline-block;
			background-color: #FFFFFF;
			padding: 0 15px 0 15px;
			font-size: 13px;
			color: #AAAAAA;
		}

/* Paket-Auswahl
-----------------*/

	.package-selector select {
		display: none;
	}

	.package-selector:after {
		content: '';
		clear: both;
		display: table;
	}

	.package-selector ul {
		margin: 0;
		padding: 0;
	}

	.package-selector-option {
		display: block;
		background-color: #FFFFFF;
		margin: 0 0 20px 0;
		border: 3px solid #DDDDDD;
		padding: 15px;
		cursor: pointer;
	}

	.package-selector-option.is-active {
		border: 3px solid #0C7DD8;
	}

	.package-selector-title {
		font-size: 25px;
		font-weight: bold;
		margin-bottom: 5px;
	}

	.package-selector-subtitle {
		font-size: 20px;
		font-weight: bold;
		margin-bottom: 5px;
	}

/* Checkbox
------------*/

	.portal-checkbox {
		margin-bottom: 20px;
	}

	.portal-checkbox input {
		display: none;
	}

	.portal-checkbox .checkbox {
		display: inline-block;
		height: 25px;
		width: 25px;
		border: 1px solid #DDDDDD;
		cursor: pointer;
		background-color: #FFFFFF;
		float: left;
		margin-right: 10px;
	}

	.portal-checkbox .checkbox.is-active {
		background-color: #3475B4;
		background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMTIwMCIgaGVpZ2h0PSIxMjAwIiB2aWV3Qm94PSIwIDAgMTIwMCAxMjAwIj48Zz48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSg2MDAgNjAwKSBzY2FsZSgwLjY5IDAuNjkpIHJvdGF0ZSgwKSB0cmFuc2xhdGUoLTYwMCAtNjAwKSIgc3R5bGU9ImZpbGw6I0ZGRkZGRiI+PHN2ZyBmaWxsPSIjRkZGRkZGIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMTIgMTAiIHZlcnNpb249IjEuMSIgeD0iMHB4IiB5PSIwcHgiPjx0aXRsZT5jaGVja21hcms8L3RpdGxlPjxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPjxnIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xODUuMDAwMDAwLCAtMTk4NS4wMDAwMDApIiBmaWxsPSIjRkZGRkZGIj48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSg0MC4wMDAwMDAsIDE2ODAuMDAwMDAwKSI+PHBhdGggZD0iTTE1NS44MzMyNSwzMDUuNTk0NSBDMTU1LjY4ODI1LDMwNS40NDc1IDE1NS40NDgyNSwzMDUuNDQ3NSAxNTUuMzAyMjUsMzA1LjU5NDUgTDE0OS43MDQyNSwzMTEuMTgxNSBDMTQ5LjU1ODI1LDMxMS4zMzA1IDE0OS4zMTkyNSwzMTEuMzMwNSAxNDkuMTczMjUsMzExLjE4MTUgTDE0Ni43MjAyNSwzMDguNjc2NSBDMTQ2LjY0ODI1LDMwOC42MDM1IDE0Ni41NTIyNSwzMDguNTY2NSAxNDYuNDU3MjUsMzA4LjU2NjUgQzE0Ni4zNjAyNSwzMDguNTY1NSAxNDYuMjYyMjUsMzA4LjYwMTUgMTQ2LjE4ODI1LDMwOC42NzY1IEwxNDUuMTA1MjUsMzA5LjY1NDUgQzE0NS4wMzIyNSwzMDkuNzI4NSAxNDQuOTkzMjUsMzA5LjgyMTUgMTQ0Ljk5MzI1LDMwOS45MTg1IEMxNDQuOTkzMjUsMzEwLjAxNTUgMTQ1LjAzMjI1LDMxMC4xMTg1IDE0NS4xMDUyNSwzMTAuMTkxNSBMMTQ5LjE3MzI1LDMxNC40MDU1IEMxNDkuMzE5MjUsMzE0LjU1MjUgMTQ5LjU1ODI1LDMxNC41NTI1IDE0OS43MDQyNSwzMTQuNDA1NSBMMTU2Ljg5NzI1LDMwNy4yMDY1IEMxNTcuMDQzMjUsMzA3LjA1OTUgMTU3LjA0MzI1LDMwNi44MTY1IDE1Ni44OTcyNSwzMDYuNjY5NSBMMTU1LjgzMzI1LDMwNS41OTQ1IEwxNTUuODMzMjUsMzA1LjU5NDUgWiI+PC9wYXRoPjwvZz48L2c+PC9nPjwvc3ZnPjwvZz48L2c+PC9zdmc+");
		background-repeat: no-repeat;
		background-size: 20px 20px;
		background-position: center;
		border: 1px solid #3475B4;
	}

	.portal-checkbox label {
		cursor: pointer;
	}

/* Checkout
------------*/

	.checkout-left {
		float: left;
		width: calc(100% - 340px);
		padding-right: 20px;
	}

	.checkout-right {
		float: right;
		width: 320px;
	}

/* Mini-Warenkorb
------------------*/

	.minicart-container {
		position: fixed;
		width: inherit;
	}

	.minicart {
		background-color: #FFFFFF;
		border: 1px solid #e5e5e5;
		border-radius: 5px;
		width: 100%;
	}

	.minicart-position {
		border-bottom: 1px solid #e5e5e5;
		padding: 15px 20px;
	}

	.minicart-position:after {
		content: '';
		clear: both;
		display: table;
	}

	.minicart-content {
		float: left;
		width: calc(100% - 100px);
	}

	.minicart-content strong {
		font-weight: 600;
		display: block;
		margin-bottom: 5px;
	}

	.minicart-content p {
		margin-bottom: 5px;
	}

	.minicart-content label {
		display: block;
		font-size: 12px;
		margin-bottom: -6px;
	}

	.minicart-price {
		float: right;
		width: 100px;
		text-align: right;
	}

.error-message-container {
	display: none;
}

/* Tooltip-Korrektur
---------------------*/

	[data-tooltip] {
		position: relative;
		top: 0;
		margin-left: 2px;
	}

/* Sprachflaggen
-----------------*/

	.language-flags {
		margin-bottom: 20px;
		z-index: 2;
	}

	.language-flags a {
		display: inline-block;
		opacity: 0.2;
	}

	.language-flags a.is-active {
		opacity: 1;
	}

	.language-flags a img {
		width: 45px;
		height: 25px;
		border-radius: 3px;
		margin-right: 10px;
	}

/* Select2 Anpassungen
-------------------------------------------*/

.select2.select2-container {
	width: 100% !important;
}

.select2-selection {
	border: 1px solid #CCCCCC !important;
	padding: 3px 10px !important;
	height: auto !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 100% !important;
}

/* Box-Trenner
---------------*/

	.box-seperator {
		display: block;
		border-bottom: 5px dotted #E5E5E5;
		padding-top:20px;
		margin-bottom: 20px;
		margin-left: -20px;
		margin-right: -20px;
	}

/* Box-Sprachauswahl
---------------------*/

	.box-languages {
		position: fixed;
		top: 180px;
		right: calc(((100% - 1100px)/ 2) - 50px);
		width: 50px;

	}

	.box-languages a {
		position: relative;
		display: block;
		background-color: #FFFFFF;
		padding: 12px 10px 10px 10px;
		opacity: 0.3;
		border-top-right-radius: 5px;
		border-bottom-right-radius: 5px;
		margin-bottom: 7px;
		width: 50px;
		box-shadow: inset 4px 0 9px -7px rgba(0,0,0,0.4);
	}

	.box-languages a:after {
		content: '';
		clear: both;
		display: table;
	}

	.box-languages a.active {
		opacity: 1;
		border: none;
	}

	.box-languages a.current {
		opacity: 1;
		border-top-left-radius: 0;
		border-bottom-left-radius: 0;
		box-shadow: none;
	}

	.box-languages a img {
		display: block;
		float: right;
		width: 30px;
		height: 18px;
		border-radius: 3px;
		-webkit-filter: grayscale(100%);
  		filter: grayscale(100%);
	}

	.box-languages a.active img,
	.box-languages a.current img {
		-webkit-filter: grayscale(0%);
		filter: grayscale(0);
	}

	.box-languages a:hover img {
		-webkit-filter: grayscale(70%);
  		filter: grayscale(70%);
	}

/* Switch-Buttons
------------------*/

	.switch-button {
		position: relative;
		margin-right: 10px;
		background: #e3e3e3;
		border: 1px solid #aaa6a0;
		border-radius: 12px;
		content: '';
		display: block;
		height: 20px;
		transition: background .2s ease-in 0s;
		vertical-align: middle;
		width: 35px;
		z-index: 0;
		top: 3px;
		cursor: pointer;
		margin-bottom: 20px;
	}

	.switch-button .switch-button-toggler {
		position: absolute;
		background: #fff;
		border: 1px solid #aaa6a0;
		border-radius: 100%;
		content: '';
		display: block;
		height: 20px;
		transition: left .2s ease-in 0s;
		width: 20px;
		z-index: 1;
		left: -1px;
		top: -1px;
	}

	.switch-button::after {
		content: '';
		display: block;
		clear: both;
		height: 20px;
	}


	.switch-button.active {
		background-color: #79a22e;
	}

	.switch-button.active .switch-button-toggler {
		background-color: #FFFFFF;
		left: unset;
		right: -1px;
	}

	div[data-inputtype='switch'] .action-switch-label.is-active .action-switch::before {
		left: unset;
		right: -1px;
	}

	.switch-button input {
		display: none;
	}

	.switch-button label {
		margin-left: 45px;
		cursor: pointer;
		opacity: 0.7;
	}

	.switch-button.active label {
		opacity: 1;
	}

/* Dialoge
-----------*/

	.ui-dialog {
		padding: 0;
		-webkit-box-shadow: 0px 0px 13px -6px rgba(0,0,0,0.75);
		-moz-box-shadow: 0px 0px 13px -6px rgba(0,0,0,0.75);
		box-shadow: 0px 0px 13px -6px rgba(0,0,0,0.75);
	}

	.ui-dialog .ui-dialog-titlebar {
		background-color: #2c3237;
		border-radius: 0;
		border: none;
		padding: 10px 20px;
	}

	.ui-dialog.error .ui-dialog-titlebar {
		background-color: #ba3027;
	}

	.ui-dialog-titlebar * {
		color: #FFFFFF;
		font-weight: 400;
	}

	.ui-widget.ui-widget-content {
		border: none;
		border-radius: 0;
	}

	.ui-dialog-closer {
		position: absolute;
		right: 15px;
		top: 11px;
		font-size: 18px;
		cursor: pointer;
	}

	.ui-widget-overlay {
		background-color: #000000;
		opacity: 0.5;
	}

	.ui-dialog .field {
		margin-bottom: 10px;
	}

/* UI-Kalender
---------------*/

	.ui-datepicker-calendar {
		border-collapse: collapse;
	}

	.ui-state-highlight {
		background-color: transparent;
		border: 1px dotted #AAAAAA;
		width: 100%;
		background-color: #c1e2b3;
	}

	.ui-datepicker td a {
		border: none !important;
		text-align: center;
	}