.ff-job, .ff-subrole {
	filter: drop-shadow(10px 5px 5px black);
}

.ff-subrole {
	width : 70px;
	margin : 5px 15px 5px 5px;
}

.ff-job {
	width : 60px;
	margin : 5px;
}

.mask {
	height : 30px;
	text-align: center;
}

.disabled {
	opacity: 0.5;
}

.not-available {
	opacity: 0.5;
	cursor: not-allowed;
}

.vertical-divider {
	border-left: 1px solid #B0BEC5;
}

@keyframes rainbow-box-shadow {
	0% { filter: drop-shadow(0 0 20px #ff0000); }
	5% { filter: drop-shadow(0 0 20px #ff0074); }
	10% { filter: drop-shadow(0 0 20px #ff00b4); }
	15% { filter: drop-shadow(0 0 20px #f000ff); }
	20% { filter: drop-shadow(0 0 20px #a300ff); }
	25% { filter: drop-shadow(0 0 20px #5600ff); }
	30% { filter: drop-shadow(0 0 20px #1500ff); }
	35% { filter: drop-shadow(0 0 20px #0051ff); }
	40% { filter: drop-shadow(0 0 20px #00abff); }
	45% { filter: drop-shadow(0 0 20px #00fff9); }
	50% { filter: drop-shadow(0 0 20px #00ffb8); }
	55% { filter: drop-shadow(0 0 20px #00ff78); }
	60% { filter: drop-shadow(0 0 20px #00ff2b); }
	65% { filter: drop-shadow(0 0 20px #22ff00); }
	70% { filter: drop-shadow(0 0 20px #6fff00); }
	75% { filter: drop-shadow(0 0 20px #b0ff00); }
	80% { filter: drop-shadow(0 0 20px #f0ff00); }
	85% { filter: drop-shadow(0 0 20px #ffb400); }
	90% { filter: drop-shadow(0 0 20px #ff7400); }
	95% { filter: drop-shadow(0 0 20px #ff3300); }
	100% { filter: drop-shadow(0 0 20px #ff0000); }
}

.job-carousel {
	animation: rainbow-box-shadow 1s infinite;
}

.picked-job {
	display: none;
}

.job-carousel, .picked-job {
	width: 192px;
	height: 192px;
}

.tank {
	filter: drop-shadow(0 0 20px #0051ff);
}

.healer {
	filter: drop-shadow(0 0 20px #22ff00);
}

.dps {
	filter: drop-shadow(0 0 20px #ff0000);
}

.none {
	filter: drop-shadow(0 0 20px #ffffff);
}