#statistics > .items {
	align-items: flex-start;
	display: flex;
	flex-flow: row wrap;
	margin-top: 20px;
}

#statistics > .items > .item {
	border: 1px dashed var(--line);
	border-radius: 5px;
	margin: 5px;
	min-width: 130px;
	padding: 15px;
	width: calc((100% / 4) - (15px * 2) - (5px * 2) - 2px);
}

#statistics > .items > .item > .value {
	font-size: 162%;
	font-weight: 700;
	line-height: 100%;
}

#statistics > .items > .item > .label {
	line-height: 100%;
	margin-top: 5px;
	opacity: .7;
}



#statistics > .last-names {
	align-items: flex-start;
	border: 1px dashed var(--line);
	border-radius: 5px;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	line-height: 100%;
	margin-top: 20px;
	padding: 10px;
}

#statistics > .last-names > div {
	padding: 8px;
}



#statistics > .centuries {
	display: block;
	margin-top: 50px;
}

#statistics > .centuries > h2 {
	margin: 0 0 10px 0;
}

#statistics > .centuries > .list {
	align-items: flex-start;
	display: flex;
	flex-flow: row nowrap;
	margin-top: 10px;
}

#statistics > .centuries > .list > div {
	min-width: 230px;
}

#statistics > .centuries > .list > div > h3 {
	margin: 0 0 5px 0;
}

#statistics > .centuries > .list > div > .century > .label {
	font-weight: 700;
}

#statistics > .centuries > .list > div > .century > .value {
	padding: 0 0 20px 10px;
}

#statistics > .centuries > .list > div > .century > .value > div > .percentage {
	font-size: 78%;
	line-height: 100%;
	margin-left: 5px;
	opacity: .7;
}