Шаблон:SkillLevelsInfoBox/styles.css

.skill-levels-infobox {
	float: right;
	width: auto;
}
.skill-levels-infobox .skill-infobox {
	float: none;
	clear: both;
	margin: 0;
	user-select: text;
}
.skill-levels-infobox .level-infobox {
	display: none;
	user-select: none;
}
.skill-levels-infobox .level-infobox > label {
	cursor: pointer;
	background: rgba(0, 0, 0, 0.8);
	border: 1px solid #FFF;
	border-radius: 5px 5px 0 0;
	border-bottom: none;
	color: #fff;
	padding: 0 3px;
    font-size: 0.9em;
    box-shadow: 0 0 5px black;
    margin: 0 5px;
    user-select: none;
}
.skill-levels-infobox .level-infobox .next-level {
	float: right;
}
.skill-levels-infobox .level-infobox .prev-level {
	float: left;
}
.skill-levels-infobox input[data-level] {
	display: none;
}
.skill-levels-infobox input[data-level="1"]:checked ~ .level-infoboxes .level-infobox[data-level="1"],
.skill-levels-infobox input[data-level="2"]:checked ~ .level-infoboxes .level-infobox[data-level="2"],
.skill-levels-infobox input[data-level="3"]:checked ~ .level-infoboxes .level-infobox[data-level="3"],
.skill-levels-infobox input[data-level="4"]:checked ~ .level-infoboxes .level-infobox[data-level="4"],
.skill-levels-infobox input[data-level="5"]:checked ~ .level-infoboxes .level-infobox[data-level="5"],
.skill-levels-infobox input[data-level="6"]:checked ~ .level-infoboxes .level-infobox[data-level="6"],
.skill-levels-infobox input[data-level="7"]:checked ~ .level-infoboxes .level-infobox[data-level="7"],
.skill-levels-infobox input[data-level="8"]:checked ~ .level-infoboxes .level-infobox[data-level="8"],
.skill-levels-infobox input[data-level="9"]:checked ~ .level-infoboxes .level-infobox[data-level="9"],
.skill-levels-infobox input[data-level="10"]:checked ~ .level-infoboxes .level-infobox[data-level="10"],
.skill-levels-infobox input[data-level="11"]:checked ~ .level-infoboxes .level-infobox[data-level="11"],
.skill-levels-infobox input[data-level="12"]:checked ~ .level-infoboxes .level-infobox[data-level="12"],
.skill-levels-infobox input[data-level="13"]:checked ~ .level-infoboxes .level-infobox[data-level="13"],
.skill-levels-infobox input[data-level="14"]:checked ~ .level-infoboxes .level-infobox[data-level="14"],
.skill-levels-infobox input[data-level="15"]:checked ~ .level-infoboxes .level-infobox[data-level="15"],
.skill-levels-infobox input[data-level="16"]:checked ~ .level-infoboxes .level-infobox[data-level="16"],
.skill-levels-infobox input[data-level="17"]:checked ~ .level-infoboxes .level-infobox[data-level="17"],
.skill-levels-infobox input[data-level="18"]:checked ~ .level-infoboxes .level-infobox[data-level="18"],
.skill-levels-infobox input[data-level="19"]:checked ~ .level-infoboxes .level-infobox[data-level="19"],
.skill-levels-infobox input[data-level="20"]:checked ~ .level-infoboxes .level-infobox[data-level="20"],
.skill-levels-infobox input[data-level="21"]:checked ~ .level-infoboxes .level-infobox[data-level="21"] {
	display: block;
}