/* Header */
header {
	margin-bottom: 2rem; padding: .5rem 0;
	border-bottom: 1px solid #bbb; background-color: #f4f4f4;
}
header .button {margin-bottom: 0;}
header > .row > .columns {float: right; min-height: 1px;}

/* Header - Start */
header .start {display: flex; align-items: center;}
header .start .logo {border-radius: 50%; overflow: hidden;}
header .start .logo img {width: 40px; height: 40px;}
header .start .logo:hover img {filter: invert(50%) sepia(40%) saturate(500%) hue-rotate(150deg);}
header .start .cms {margin: 0 1rem -2px 2rem; font-size: 31px; font-family: Arial;}
header .start .module {font-size: 22px;}

/* Header - Menu */
header .topMenu {display: flex;}
header .topMenu .items a {
	box-sizing: border-box; float: right; height: 56px;
	margin: -.5rem 0; padding: 0 1rem; line-height: 56px; font-size: 1.2rem;
}
header .topMenu .items a:hover {background-color: #eaeaea;}
header .topMenu .items a[disabled] {
	height: 57px; margin-bottom: -9px; color: #0a0a0a;
	border-bottom: 2px solid #999; background-color: #e4e4e4;
}
header .topMenu .items .parent {
	position: relative; height: 56px !important; margin-left: 24px;
	border-bottom: 0 !important; background-color: #e4e4e4;
}
header .topMenu .items .parent:after {
	content: ''; position: absolute; top: 22px; left: -14px;
	width: 14px; height: 14px; transform: rotate(45deg);
	border-width: 0 0 3px 3px; border-style: solid; border-color: #999;
}
header .topMenu .items .sub-menu {
	height: 36px; line-height: 36px;
	margin: 2px 6px 0 0; padding: 0 10px; border-radius: 8px;
}
header .topMenu .items .sub-menu:hover {color: black; background-color: #dceef3;}
header .topMenu .items .sub-menu[disabled] {height: 36px; border: 0; background-color: #c4e6f0;}

header .topMenu .items .sub-menu.lines {
	display: flex; flex-direction: column; justify-content: center;
	height: 40px; margin-top: 0; line-height: 1; text-align: center; font-size: 1rem;
}
header .topMenu .items .sub-menu.lines[disabled] {height: 40px;}

header .topMenu .buttons {margin-right: auto;}
header .topMenu .buttons .button:not(:first-child) {margin-right: .5rem;}
header .topMenu .buttons span {font-size: 1rem;}

/* Header - Member */
header .member .button {float: left; width: 50px; padding: 0; background-color: #ccc;}
header .member .button + .button {margin-left: .5rem;}
header .member .button i {line-height: 40px; font-size: 23px; color: #777;}
header .member .button:hover i {color: #555;}
header .member .button.notifications {position: relative;}
header .member .button.notifications .counter {
	position: absolute; top: -5px; right: -5px;
	min-width: 20px; height: 20px; padding: 0 5px;
	background-color: orangered; line-height: 20px;
	border-radius: 10px; font-size: 14px; color: white;
}
