/* Hide the admin bar until hover over */
:root {
	margin-top: 0 !important;
}

#wpadminbar {
	opacity: 1;
	transition: opacity 200ms, transform 200ms;
	transform: translateY(-46px);
	transition-delay: 1s;
}

#wpadminbar:hover {
	opacity: 1;
	transform: translateY(0);
	transition-delay: 0s;
}

/* Although the admin bar is off the screen we need something for us to trigger the hover */
#wpadminbar:after {
	content: '';
	display: block;
	position: absolute;
	top: 100%;
	bottom: -10px;
	left: 0;
	right: 0;
	width: 100%;
	transition: bottom 200ms;
	transition-delay: 1100ms;
}

#wpadminbar:hover:after {
	bottom: 0;
	transition-delay: 0s;
}

@media screen and (min-width: 783px ) {
	#wpadminbar {
		transform: translateY(-32px);
	}
}

@media screen and (max-width: 782px) {
	#wpadminbar #wp-admin-bar-wpseo-menu {
		display: none;
	}
}

#wpadminbar .quicklinks,
#wpadminbar .quicklinks > #wp-admin-bar-root-default {
	display: flex;
}

#wpadminbar .quicklinks > #wp-admin-bar-root-default {
	flex: 1 1 auto;
}

#wpadminbar .quicklinks .ab-top-secondary {
	flex: 0 0 auto;
}

#wpadminbar .quicklinks .ab-empty-item,
#wpadminbar .quicklinks > ul > li > a {
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}

#wpadminbar .quicklinks .ab-top-secondary > li {
	/*float: none;*/
	/*display: inline-block;*/
}