Template:Uber/styles.css

.uber-box {
	float: right;
	clear: right;
	width: 280px;
	margin: 0 0 1em 1.5em;
	padding: 12px 14px;
	background: #0a0a0c;
	color: #dcdcdc;
	border: 1px solid #4a4032;
	border-radius: 4px;
	box-shadow: 0 0 0 1px #000, 0 4px 18px rgba(0, 0, 0, 0.6);
}

.uber-name {
	font-family: 'Palatino Linotype', Palatino, 'Book Antiqua', Georgia, serif;
	font-size: 18px;
	color: #c7b377;
	text-align: center;
}

.uber-image {
	margin-top: 8px;
	text-align: center;
}

.uber-difficulty {
	margin: 6px auto 4px;
	width: fit-content;
	padding: 1px 10px;
	border-radius: 10px;
	font-size: 12px;
	font-weight: bold;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	background: #333;
	color: #ddd;
}

.uber-d-easy { background: #1e4d1e; color: #8fdc8f; }
.uber-d-moderate { background: #4d4a1e; color: #e6dc78; }
.uber-d-tricky { background: #5a3a14; color: #f0b060; }
.uber-d-hard { background: #5c1e1e; color: #f08a8a; }
.uber-d-very-hard,
.uber-d-extreme { background: #4a1240; color: #f08ae0; }

.uber-facts {
	width: 100%;
	margin-top: 8px;
	border-collapse: collapse;
	font-size: 14px;
}

.uber-facts th,
.uber-facts td {
	padding: 5px 4px;
	border-top: 1px solid #2a2620;
	vertical-align: top;
	text-align: left;
}

.uber-facts th {
	width: 76px;
	color: #8a8a8a;
	font-weight: normal;
}

@media (max-width: 720px) {
	.uber-box {
		float: none;
		width: auto;
		margin: 0 0 1em;
	}
}