/* Bloodshed: Redux theme: blood red on near-black, condensed headings */
@font-face { font-family: "Oswald"; src: url("fonts/Oswald-Medium.woff") format("woff"); font-weight: normal; }
@font-face { font-family: "Oswald"; src: url("fonts/Oswald-Bold.woff") format("woff"); font-weight: bold; }

html, body { background: #070303; color: #efe9e6; }
body { font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif; }

#server-name, #player-name, #wordmark { font-family: "Oswald", Impact, "Arial Narrow", sans-serif; font-weight: bold; }
#server-name { text-transform: uppercase; letter-spacing: 1.5px; }
#player-name { letter-spacing: 0.5px; }

.eyebrow { color: #e5483f; opacity: 0.95; }

/* darker, red-tinted atmosphere over the backgrounds */
#bg:after {
	content: "";
	position: absolute; top: 0; left: 0; width: 100%; height: 100%;
	background: rgba(80, 0, 0, 0.22);
}
#shade {
	background: rgba(10, 0, 0, 0.55);
	background: -webkit-radial-gradient(center, ellipse cover, rgba(20, 2, 2, 0.30) 0%, rgba(8, 0, 0, 0.90) 100%);
	background: radial-gradient(ellipse at center, rgba(20, 2, 2, 0.30) 0%, rgba(8, 0, 0, 0.90) 100%);
}
#shade-bottom {
	background: -webkit-linear-gradient(bottom, rgba(8, 2, 2, 0.97) 0%, rgba(8, 2, 2, 0) 100%);
	background: linear-gradient(to top, rgba(8, 2, 2, 0.97) 0%, rgba(8, 2, 2, 0) 100%);
}

.panel {
	background: rgba(16, 6, 6, 0.66);
	border-color: rgba(255, 70, 60, 0.14);
}
.music { background: rgba(16, 6, 6, 0.5); }

/* a little wider than the other screens so longer track names fit */
#corner { width: 350px; }

.avatar-wrap {
	background: #c8191a;
	background: -webkit-linear-gradient(135deg, #ff5145, #6e0a0a);
	background: linear-gradient(135deg, #ff5145, #6e0a0a);
	-webkit-box-shadow: 0 0 24px rgba(200, 25, 25, 0.5);
	box-shadow: 0 0 24px rgba(200, 25, 25, 0.5);
}

#bar-fill, #music-progress {
	background: #c8191a;
	background: -webkit-linear-gradient(left, #6e0a0a, #e3261d);
	background: linear-gradient(to right, #6e0a0a, #e3261d);
	-webkit-box-shadow: 0 0 14px rgba(220, 30, 30, 0.75);
	box-shadow: 0 0 14px rgba(220, 30, 30, 0.75);
}
.bar, .music-track { background: rgba(255, 220, 220, 0.10); }

.music-eq span { background: #e5483f; }
#music-mute { color: #e5483f; }

/* Wordmark text in bone white and blood red; the Icefuse logo and divider keep their own colours */
.wm-ice {
	color: #e9e2de;
	background: -webkit-linear-gradient(top, #ffffff 0%, #e9e2de 50%, #a99d97 100%);
	background: linear-gradient(to bottom, #ffffff 0%, #e9e2de 50%, #a99d97 100%);
	-webkit-background-clip: text;
}
.wm-fire {
	color: #d4201a;
	background: -webkit-linear-gradient(top, #ff5a4e 0%, #d4201a 55%, #7a0a0a 100%);
	background: linear-gradient(to bottom, #ff5a4e 0%, #d4201a 55%, #7a0a0a 100%);
	-webkit-background-clip: text;
}
#wordmark { font-size: 34px; letter-spacing: 5px; }

@media (max-height: 800px) {
	#wordmark { font-size: 28px; }
}