/*********************************/
/************* CARDS *************/
/*********************************/
/*#E83F29;*/
/*linear-gradient(to right, darken(#E83F29, 15%) 0%, #E83F29 100%);*/
/*New added */
.card-container {
	position: relative;
}

	.card-container .card {
		min-height: 110px;
		margin-bottom: 30px;
		position: relative;
		perspective: 600px;
		width: 100%;
		cursor: pointer;
		z-index: 9;
	}

		.card-container .card .front {
			border-radius: 6px;
			box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
			height: 100%;
			position: relative;
			width: 100%;
			padding: 28px;
			top: 0;
			left: 0;
			z-index: 11;
			transform: rotateX(0deg) rotateY(0deg);
			transform-style: preserve-3d;
			backface-visibility: hidden;
			/* -- transition is the magic sauce for animation -- */
			-webkit-transition: all 0.4s ease-in-out;
			-o-transition: all 0.4s ease-in-out;
			transition: all 0.4s ease-in-out;
		}

		.card-container .card:hover .front {
			z-index: 11; 
			transform: rotateY(180deg);
		}

		.card-container .card:hover .back {
			z-index: 12;
			transform: rotateX(0deg) rotateY(0deg);
		}

		.card-container .card .back {
			border-radius: 6px;
			box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
			position: absolute;
			top: 0;
			border: 0;
			height: 100%;
			width: 100%;
			left: 0;
			z-index: 10;
			-webkit-transform: rotateY(-180deg);
			-moz-transform: rotateY(-179deg);
			/* setting to 180 causes an unnatural-looking half-flip */
			/* transform: rotateY(-179deg); */
			transform-style: preserve-3d;
			backface-visibility: hidden;
			/* -- transition is the magic sauce for animation -- */
			-webkit-transition: all 0.4s ease-in-out;
			-o-transition: all 0.4s ease-in-out;
			transition: all 0.4s ease-in-out;
		}

			.card-container .card .back > .row {
				height: 100%;
				margin: 0;
			}

				.card-container .card .back > .row > div {
					height: 100%;
					padding: 0;
				}

					.card-container .card .back > .row > div a {
						display: block;
						width: 100%;
						height: 100%;
						text-align: center;
						padding: 30px 10px 10px;
					}

						.card-container .card .back > .row > div a i {
							display: block;
							margin-bottom: 5px;
						}

						.card-container .card .back > .row > div a:hover {
							text-decoration: none;
						}

@media only screen and (max-width: 420px) {
	.card-container .card .front {
		padding: 28px 10px;
	}
}



.task-container {
	box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.2);
	padding: 15px;
	background-color: white;
	margin-bottom: 15px;
	border-left: 3px solid;
	position: relative;
	-webkit-transition: all 0.25s linear;
	-o-transition: all 0.25s linear;
	transition: all 0.25s linear;
}

	.task-container.priority-high {
		border-left-color: #d9534f;
	}

		.task-container.priority-high .task-priority {
			color: #d9534f;
		}

	.task-container.priority-medium {
		border-left-color: #f0ad4e;
	}

		.task-container.priority-medium .task-priority {
			color: #f0ad4e;
		}

	.task-container.priority-normal {
		border-left-color: #616f77;
	}

		.task-container.priority-normal .task-priority {
			color: #616f77;
		}

	.task-container.priority-low {
		border-left-color: #5cb85c;
	}

		.task-container.priority-low .task-priority {
			color: #5cb85c;
		}

	.task-container .task-name {
		margin: 0;
		font-size: 18px;
		color: #222;
	}

	.task-container .task-meta {
		font-size: 12px;
		color: #999;
	}

	.task-container .task-priority {
		font-size: 10px;
		text-transform: uppercase;
		position: absolute;
		right: 15px;
		top: 15px;
	}

	.task-container .task-desc {
		margin-top: 20px;
		font-size: 13px;
		line-height: 1.8;
		color: #555;
	}

	.task-container:hover {
		box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.3);
		cursor: grab;
	}

	.task-container.drag-task {
		margin: 0;
		cursor: move;
		box-shadow: 0 0 30px 5px rgba(0, 0, 0, 0.5);
		position: fixed !important;
		z-index: 9999 !important;
	}