// Secondary navigation styling
.secondary-navigation a {
	display: block;
	line-height: 32px;
	padding: 0.5rem 1rem;
}

.secondary-navigation ul {
	display: flex;

	// This is for when the secondary navigation might wrap below the site title
	margin-left: -0.5rem;

	li {
		margin-bottom: 0;
	}
	
}

// show secondary navigation
@media #{$screen-sm}{
    #site-header-secondary-menu {
		display: flex;
		font-size: $nav-secondary-font-size;
		align-items: center;

		a {
			color: $nav-secondary-color;
		}

        a:hover {
            color: $nav-secondary-hover-color;
        }
	}

}
