.ui-option-picker {
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 0;

	> .option {
		margin: 0;
		padding: 5px 11px;
		color: map-get($gray-shades, 600);
		cursor: pointer;
		position: relative;
		list-style: none;
		

		&:hover {
			> .text {
				color: map-get($yellow-shades, 800);
			}
		}

		> .text {
			font-size: 1rem;
			font-weight: 400;
			text-transform: uppercase;
			letter-spacing: 0.00375rem;
		}
	}

	> .selected {
		> .text {
			color: map-get($yellow-shades, 700) !important;
			font-weight: 400;
		}
	}
}

.ui-option-picker-horiz {
	> .option {
		display: inline-block;

		@media only screen and (max-width: 1200px) {
			display: block;
			width: 100%;
		}
	}
}