
/* Allgemein
-------------*/

	.kanban-board {
		padding: 0 20px;
		display: grid;
		column-gap: 20px;
		grid-template-columns: auto 1fr auto;
	}
	.kanban-board[data-cols="1"] {
		grid-template-columns: auto minmax(0, 1fr);
	}
	.kanban-board[data-cols="2"] {
		grid-template-columns: auto auto minmax(0, 1fr);
	}
	.kanban-board[data-cols="3"] {
		grid-template-columns: auto auto auto minmax(0, 1fr);
	}
	.kanban-board[data-cols="4"] {
		grid-template-columns: auto auto auto auto minmax(0, 1fr);
	}
	.kanban-board[data-cols="5"] {
		grid-template-columns: auto auto auto auto auto minmax(0, 1fr);
	}
	.kanban-board[data-cols="6"] {
		grid-template-columns: auto auto auto auto auto auto minmax(0, 1fr);
	}


/* Spalte
----------*/

	.kanban-col {
		width: 350px;
		background-color: #eff3f4;
		border-radius: 5px;
		padding: 20px 0 20px 0;
		vertical-align: top;
		position: relative;
	}

	.kanban-col--empty {
		width: 2px;
		border-right: none;
		display: none;
		padding: 0;
	}

	.kanban-col  h2x {
		margin: 0;
		color: #178498;
		font-weight: 600;
	}

	/* Header
	----------*/

		.kanban-col-header {
			padding: 0 15px;
			display: grid;
			grid-template-columns: minmax(0, 1fr) auto;
			column-gap: 20px;
		}

		.kanban-col-title h2 {
			display: inline-block;
			background-color: #454545;
			border-radius: 20px;
			color: #FFFFFF;
			font-size: 15px;
			margin: 0;
			padding: 3px 15px;
			font-weight: 400;
			border: none;
		}

		.kanban-col-menu > img {
			cursor: pointer;
			opacity: 0.2;
		}

		.kanban-col-menu > img:hover {
			opacity: 1;
		}

		.kanban-col-menu {
			position: relative;
		}

		.kanban-col-menu ul {
			display: none;
		}

		.kanban-col-menu ul {

			background-color: #FFFFFF;
			border: 1px solid #DDDDDD;
			margin: 0;
			padding: 0;
			position: absolute;
			top: 0;
			right: 0;
			list-style-type: none;
			border-radius: 5px;
			z-index: 2;
		}

		.kanban-col-menu ul li {
			display: block;
			white-space: nowrap;
			padding: 5px 15px;
		}

/* Aufgabe
-----------*/

	.kanban-cardlist {
		position: relative;
		border-radius: 5px;
		margin-top: 20px;
		padding: 0 15px;
		min-height: 5px;
	}

	.kanban-card {
		position: relative;
		background-color: #FFFFFF;
		margin-top: 15px;
		border-radius: 5px;
		padding: 15px;
		cursor: pointer;
		/*
		border: 1px solid #EEEEEE;
		box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14),0px 1px 3px 0px rgba(0,0,0,.12);
		*/
		box-shadow: rgba(9, 30, 66, 0.25) 0px 1px 0px 0px;
	}

	.kanban-card:hover {
		background-color: #F7F7F7;
	}

	.kanban-card:first-of-type {
		margin-top: 0;
	}

	.kanban-card-title {
		margin: 0;
		padding: 0;
	}

	/* Gehobener Zustand
	---------------------*/

		.kanban-card.ui-sortable-helper {
			transform: rotate(4deg);
			box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14),0px 1px 3px 0px rgba(0,0,0,.12);
		}

		.card-placeholder {
			background-color: rgba(146, 195, 45, 0.2) !important;
			margin-top: 20px;
			border: none !important;
			outline: 1px dashed #DDDDDD;
			border-radius: 5px;
		}

	/* Dragged-Zustand Spalte
	--------------------------*/

		.kanban-placeholder {
			width: 100px !important;
			min-height: 200px !important;
			background-color: #f2f2f2 !important;
		}

/* Eingabefeld für Aufgaben
----------------------------*/

	.kanban-cardlist form {
		max-width: 100%;
	}

	.kanban-card-textarea {
		display: block;
		width: 100%;
		border: 1px solid #DDDDDD;
		background-color: #FFFFFF;
		position: relative;
		margin-top: 20px;
		border-radius: 5px;
		padding: 10px;
		cursor: pointer;
		box-shadow: rgba(9, 30, 66, 0.25) 0px 1px 0px 0px;
		resize: none;
	}

	.kanban-card-textarea:focus {
		outline: none;
	}