#drawer {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 550;
	visibility: hidden;
	transition-delay: 0.2s;
	-webkit-transition-delay: 0.2s;
	-moz-transition-delay: 0.2s;
	margin-top: 60px;
}

#drawer.open {
	visibility: visible;
	transition-delay: 0.0s;
	-webkit-transition-delay: 0.0s;
	-moz-transition-delay: 0.0s;
}

	#drawer-background {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: rgba(0, 0, 0, 0.5);
		visibility: hidden;
		opacity: 0;
		transition: opacity 0.2s linear 0.0s, visibility 0.0s linear 0.2s;
		-webkit-transition: opacity 0.2s linear 0.0s, visibility 0.0s linear 0.2s;
		-moz-transition: opacity 0.2s linear 0.0s, visibility 0.0s linear 0.2s;
	}

	#drawer.open > #drawer-background {
		visibility: visible;
		opacity: 1;
		transition: opacity 0.2s linear 0.0s, visibility 0.0s linear 0.0s;
		-webkit-transition: opacity 0.2s linear 0.0s, visibility 0.0s linear 0.0s;
		-moz-transition: opacity 0.2s linear 0.0s, visibility 0.0s linear 0.0s;
	}

	#drawer-inner {
		position: absolute;
		top: 0;
		right: -300px;
		bottom: 0;
		width: 400px;
		padding-top: 168px;
		background-color: #FFFFFF;
		box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.5);
		-webkit-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.5);
		-moz-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.5);
		-ms-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.5);
		-o-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.5);
		visibility: hidden;
		transition: right 0.2s ease 0.0s, visibility 0.0s linear 0.2s;
		-webkit-transition: right 0.2s ease 0.0s, visibility 0.0s linear 0.2s;
		-moz-transition: right 0.2s ease 0.0s, visibility 0.0s linear 0.2s;
	}

	#drawer.open > #drawer-inner {
		right: 0;
		visibility: visible;
		transition: right 0.2s ease 0.0s, visibility 0.0s linear 0.0s;
		-webkit-transition: right 0.2s ease 0.0s, visibility 0.0s linear 0.0s;
		-moz-transition: right 0.2s ease 0.0s, visibility 0.0s linear 0.0s;
	}

	#drawer:not(.edit):not(.create) #drawer-inner {
		padding-top: 110px;
	}

	#drawer.create #drawer-inner, #drawer.edit #drawer-inner {
		padding-top: 56px;
	}

		#drawer-header {
			position: absolute;
			top: 0;
			left: 0;
			right: 0;
		}

			#drawer .create, #drawer .view, #drawer .edit {
				display: none;
			}

			#drawer:not(.create):not(.edit) .view {
				display: block;
			}

			#drawer.create .create {
				display: block;
			}

			#drawer.edit .edit {
				display: block;
			}

		#drawer-content {
			position: relative;
			float: left;
			width: 100.0%;
			height: 100.0%;
			padding: 20px;
			overflow: hidden;
			overflow-y: auto;
		}

			#drawer .drawer-button, 
			#drawer .drawer-icon {
				width: 18px;
				height: 18px;
				padding: 0;
				border: 0;
				margin: 0;
				-webkit-appearance: none;
				-moz-appearance: none;
				-ms-appearance: none;
				-o-appearance: none;
				appearance: none;
				background-color: transparent;
			}

			#drawer .drawer-button {
				cursor: pointer;
			}