.select-gear {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100vh;
	width: 100vw;
}

@media (orientation: landscape) {
	.select-gear .items {
		background: linear-gradient(to right, #4EA6F0, #0068A4);
		transform: rotate(90deg);
		height: 100vw;
		width: 100vh;
	}

	.select-gear .item {
		transform: rotate(-90deg);
	}
}

@media (orientation: portrait) {
	.select-gear .items {
		background: linear-gradient(#4EA6F0, #0068A4);
		height: 100vh;
		width: 100vw;
	}
}

.select-gear .items {
	display: flex;
	flex-direction: column;
	align-items: center;
	overflow-y: auto;
	overflow-x: hidden;
	pointer-events: auto;
}

.select-gear .item {
	pointer-events: auto;
	align-items: center;
	display: flex;
	flex-direction: column;
}

.select-gear .buttons {
	position: absolute;
	bottom: 10px;
	z-index: 200;
}

@media only screen and (min-width: 1200px) {
	.select-gear .item-img {
		height: 500px;
	}
}
@media only screen and (max-width: 1200px) {
	.select-gear .item-img {
		height: 50vh;
	}
}

.select-gear .item-img {
	box-sizing: border-box;
	border: 2px solid transparent;
}

.select-gear .item-img.selected {
	border: 2px solid white;
	z-index: 50;
}

.select-gear .item-img:hover {
	cursor: pointer;
	border: 2px solid white;
}