#header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	width: 100.0%;
	border-bottom: 1px solid #b0bec5;
	background-color: #ffffff;
	z-index: 250;
}

	#header-inner {
		position: relative;
		float: left;
		left: 50.0%;
		width: 1200px;
		height: 60px;
		padding: 15px 40px;
		margin-left: -600px;
	}

		#header-left {
			position: relative;
			float: left;
			width: 50.0%;
			height: 100.0%;
		}

			#header-title {
				position: relative;
				float: left;
				height: 100.0%;
				margin: 0;
				font-size: 25px;
				color: #7f8c8d;
			}

			#header-logo {
				position: relative;
				float: left;
				height: 100.0%;
			}

				#header-logo svg {
					position: relative;
					float: left;
					height: 100.0%;
				}

		#header-right {
			position: relative;
			float: right;
			width: 50.0%;
			height: 100.0%;
		}

@media (max-width: 880px) {
	#header-inner {
		padding: 15px 10px;
	}
}

@media (max-width: 1199px) {
	#header-inner {
		left: 0;
		width: 100.0%;
		margin-left: 0;
	}
}
@media (max-width: 880px) {
	header#header button.header-menu {
		position: relative;
		float: right;
		left: 0;
		width: 26px;
		height: 26px;
		padding: 0;
		border: 0;
		margin: 2px 0;
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		background-color: transparent;
		cursor: pointer;
	}

	header#header button.header-menu .material-icons {
		width: 26px;
		height: 26px;
		line-height: 26px;
		font-size: 26px;
		color: #757575;
	}

	header#header button.header-menu:hover .material-icons {
		text-shadow: 2px 2px 10px rgba(255, 255, 255, 0.25), 2px -2px 10px rgba(255, 255, 255, 0.25), -2px -2px 10px rgba(255, 255, 255, 0.25), -2px 2px 10px rgba(255, 255, 255, 0.25);
	}
}

/* ----- sm (Small) ----- */
@media (min-width: 880px) {
	header#header button.header-menu {
		display: none;
	}
}