/* VIEW
--------*/

	#view-container {
		position: relative;
		overflow-x: hidden;
		overflow-y: auto;
		width: 100%;
		min-height: 100vh;
	}

	.view {
		position: absolute;
		top: 50px;
		left: 0;
		bottom: 75px;
		width: 100%;
		min-height: calc(100vh - 125px);
		transition: transform 0.3s ease, opacity 0.3s ease;
		padding: 0 15px;
		z-index: 1;
	}

	.view.active {
		transform: translateX(0);
		opacity: 1;
	}

	.view.slide-out-left {
		transform: translateX(-100%);
		opacity: 0;
		filter: grayscale(1);
	}

	.view.slide-in-right {
		transform: translateX(100%);
		opacity: 0;
	}

	.view.slide-in-right.active {
		transform: translateX(0);
		opacity: 1;
	}

/* Rechts Menü
---------------*/

	.view.slide-out-right {
		transform: translateX(100%);
		opacity: 0;
		filter: grayscale(1);
	}

	.view.slide-in-left {
		transform: translateX(-100%);
		opacity: 0;
	}

	.view.slide-in-left.active {
		transform: translateX(0);
		opacity: 1;
	}