.header {
  height: 6%;
	overflow: hidden;
	width: 100%;
	max-width: 100%;
}

.headerItem{
	width: auto;
	padding-left: 1vmin;
	padding-right: 1vmin;
	white-space: nowrap;
	overflow: hidden;
}

.searchBar{
	border: none;
	border-radius: 5px;
	padding-left: 10px;
	overflow: hidden;
	font-size: 3vmin;
	margin-right: 10px;
}

.searchButton{
	border: none;
	padding-left: 10px;
	padding-right: 10px;
	border-radius: 5px;
	font-weight: bold;
	cursor: pointer;
	background: White;
	font-size: 3vmin;
}

#searchForm{
	margin: 0px;
}

#sidebarButton{
	width: 3%;
}

#logoButton{
	width: 10%;
}

#userProfile{
	color: White;
	font-size: 2vmin;
	font-family: Verdana, Geneva, sans-serif;
	text-align: center;
	width: 8%;
	max-width: 15%;
	text-overflow: ellipsis;
	border-radius: 5px;
}

#userProfile:hover{
	border: solid;
	border-color: White;
}

#userProfileLink{
	text-decoration: none;
  color: White;
	font-size: 2vmin;
	font-family: Verdana, Geneva, sans-serif;
}

#optionButton{
	color: White;
	font-size: 2vmin;
	font-family: Verdana, Geneva, sans-serif;
	cursor: pointer;
	width: 8%;
	text-align: center;
	border-radius: 5px;
}

#optionButton:hover{
	border: solid;
	border-color: White;
}

#LogoButtonImg{
	width: 23.3vmin;
	height: 4vmin;
	cursor: pointer;
}

#SideBarButtonImg{
	width: 4vmin;
	height: 4vmin;
	cursor: pointer;
}

#HomeHeader{
	background-color: Black;
}

#MTHeader{
	background-color: Black;
}

#ShopHeader{
	background-color: #4a93b8;
}

#FieldHeader{
	background-color: #336A33;
}

#HRHeader{
	background-color: DarkOrange;
}

#KBHeader{
	background-color: #7e0202;
}