#element-info-bar.display-aside
{
	.menu-element { height: auto }
}

.menu-element
{
	z-index: 10;
	position: absolute;
	bottom: 0;
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;

	.gogo-icon-star-full {
		color: $favorite-color;
	}

	.menu-element-item
	{
		margin: 0 1rem;
		height: 2.7rem;
		display: flex;
    align-items: center;

		a { 
			color: inherit; 
			display: flex;
			align-items: center;
			&.disabled {
				pointer-events: none;
				opacity: .5;
			}
		}

		.menu-icon
		{
			font-size: 20px;
			display: flex;
    	margin-bottom: 2px;
			&.small-icon { font-size: 18px; }

			@media #{$medium-and-up}
			{
				font-size: 22px;
				&.small-icon { font-size: 20px; }
			}
		}

		&.item-stamp.filled {
			color: $favorite-color;
			font-weight: bold;
		}
		
		&.hidden {
			display: none;
		}
		&.item-subscribe-element #subscriber-loader,
		&.item-unsubscribe-element #unsubscriber-loader {
			display: none;
			width: 22px;
			height: 22px;
			.spinner-layer {
				opacity: .5;
				border-color: white;
			}
		}
		&.item-unsubscribe-element #unsubscriber-loader {
			.spinner-layer {
				border-color: $favorite-color;
			}
		}
		&.item-unsubscribe-element:not(.hidden) {
			color: $favorite-color;
		}
	}

	&:not(.full-text) { 
		.menu-element-item-text { display: none; }
	}

	&.full-text
	{
		padding: .4rem 0 .7rem 0;
		@media #{$small-only} { padding-top: 0; }

		.menu-element-item {
			@media #{$small-only} { margin: 0 6px -.9rem 6px }
			margin: 0 10px -.5rem 10px;
			@media (min-width: 1400px) { margin: 0 .8rem -.5rem .8rem; }

			.menu-element-item-text
			{
				display: inline;
				text-transform: uppercase;
				font-size: 0.75rem;
				margin-left: .5rem;

				@media #{$small-only} { font-size: 10px; }
				@media (min-width: 1400px) { font-size: 0.8rem; }

				&.favorite { 
					color: $favorite-color;
					font-weight: bold;
				}
			}
		}
	}
}