/*--------------------------------//
//                                //
//              Tab               //
//                                //
//--------------------------------*/
.nav .tabs {
	display: flex;
}

.nav .tabs .tab {
	text-align: center;
	cursor: pointer;

	padding: 0 1em;
	opacity: 0.7;
	position: relative;
	transition: color .25s ease;
	text-transform: uppercase;
	min-width: 5.5em;
	flex-grow: 1;
}

.nav .tabs .tab > * {
	display: block;
}

.nav .tabs .tab:hover {
	opacity: 1;
}

.nav .tabs .tab.selected {
	opacity: 1;
}

.nav .tabs .tab-label {
	line-height: 4.5rem;
}

.nav .tabs .tab-indicator {
	left: 0;
	right: 0;
	background-color: #FFD600;
	background-color: var(--color-secondary);
	bottom: 0;
	height: 0.25em;
	position: absolute;
	transform: scaleY(0);
	transform-origin: bottom;
	transition: transform .25s ease;
}

.nav .tabs .tab.selected {
	opacity: 1;
}

.nav .tabs .selected .tab-indicator {
	transform: scaleY(1);
}

@media only screen and (min-device-width: 752px) and (max-device-width: 960px) {
	.nav .tabs .tab-label {
		line-height: 3rem;
	}
}

@media only screen and (max-device-width: 752px) {
	.nav .tabs {
        display: none;
	}
}