/* roboto-condensed-regular - latin */
@font-face {
	font-family: 'Roboto Condensed';
	font-style:  normal;
	font-weight: 400;
	src:         local(''),
	             url('../images/roboto-condensed-v25-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ url('../images/roboto-condensed-v25-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

@font-face {
	font-family: 'Roboto Condensed';
	font-style:  normal;
	font-weight: 600;
	src:         local(''),
	             url('../images/roboto-condensed-v27-latin-600.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ url('../images/roboto-condensed-v25-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

body {
	font-family: "Roboto Condensed", serif;
	font-size:   12px;
}

.canvas h1 {
	font-size:               2.5em;
	font-style:              inherit;
	color:                   #a1a1a1;
	text-shadow:             0 0 7px black;
	margin:                  0.5em 5% 0 5%;
	background:              #a52a2acf;
	padding:                 5px;
	border-top-left-radius:  10px;
	border-top-right-radius: 10px;
	/* box-shadow: 0 0 12px 5px black; */
	border:                  1px solid white;
	border-bottom:           0;
}

.h1heim {
	color: white;
}

.canvas {
	width:            960px;
	height:           540px;
	background-image: url('../images/dart-bg.jpg');
	background-size:  cover;
	overflow:         hidden;
	border:           0 solid red;
	padding:          0;
	position:         relative;
	display:          flex;
	justify-content:  center;
	text-align:       center;
	margin: 20px;
	box-shadow: 0 0 10px 3px black;
}

img.clip {
	position: absolute;
	left:     -60px;
	bottom:   -70px;
	width:    275px;
}

img.logo {
	position: absolute;
	right:    10px;
	bottom:   5px;
	width:    100px;
}

div.disclaimer {
	position: absolute;
	bottom: 0;
	color: white;
}

.table {
	width: 90%;
}

table.dartrangliste {
	border:           3px solid white;
	border-radius:    10px;
	font-family:      "Roboto Condensed", serif;
	margin:           0;
	background-color: rgb(0, 0, 0, 82%);
	font-size:        1.9em;
	/*backdrop-filter: blur(5px);*/
	border-collapse:  separate;
	border-spacing:   0;
	width:            100%;
	color:            white;
	/*margin-top: 10%;*/
}

table.dartrangliste td {
	border-top: 1px solid rgb(255, 255, 255, 40%);
}

table.dartrangliste th.matrixheader {
	font-size: 12px;
	max-width: 50px;
	padding: 0.3em;
}
table.dartrangliste th.matrixheader div{
	hyphens: auto;
	padding: 0;
	/*overflow: hidden;
	text-overflow: ellipsis;
	-webkit-line-clamp: 2;
	display: -webkit-box;
	-webkit-box-orient: vertical;*/

}

table.dartrangliste td[rang],
table.dartrangliste th[rang],
table.dartrangliste td[ergebnisse],
table.dartrangliste th[ergebnisse],
table.dartrangliste td[begegnungen],
table.dartrangliste th[begegnungen] {
	width: 50px;
}

table.dartrangliste td[punkte],
table.dartrangliste th[punkte] {
	width: 90px;
}

table.dartrangliste tr.heim,
table.dartrangliste th.heim,
table.dartrangliste td.heim {
	background: blue;
}

table.dartrangliste tr.strike,
table.dartrangliste td.strike {
	text-decoration: red line-through;
}

table.dartrangliste tr.spielfrei td,
table.dartrangliste tr.strike td,
table.dartrangliste td.strike {
	color: rgba(91, 91, 91, 0.82);
}

table.dartrangliste td, table.dartrangliste th {
	padding:    0.3em;
	text-align: center;
}

td div.subtext {
	font-size: 0.6em;
	color:     darkgrey;
}

td div.subtext-location {
	font-size: 0.4em;
	color:     darkgrey;
}

td.paarung .heim {font-weight: bold;}

td.paarung .gast {color: #b7b7b7;}

td .vs-sep {padding: 0 4px;color: rgb(255, 255, 255, 40%)}

.punkte0 {color: orangered;}

.punkte1 {color: yellow;}

.punkte2 {color: darkgreen;}

.punkte3 {color: limegreen;}

@media screen and (max-width: 768px) {
	table.dartrangliste td, table.dartrangliste th {
		/*font-size: 12px;*/
	}

	table.dartrangliste .td-saetze {
		/*display: none;*/
	}
}

.diffpos {color: limegreen;}

.diffneg {color: orangered;}

div.faehnchen {
	/*text-align: right;*/
	display:         flex;
	font-size:       1.3em;
	/*margin-top:      2px;*/
	justify-content: space-between;
}

div.faehnchen span.stand {
	background:                 #ff3e01;
	margin-right:               20px;
	padding:                    2px 15px;
	border-bottom-left-radius:  10px;
	border-bottom-right-radius: 10px;
	color:                      white;
}

div.faehnchen span.legende {
	background:                 #000;
	margin-left:                200px;
	padding:                    2px 15px;
	border-bottom-left-radius:  10px;
	border-bottom-right-radius: 10px;
	color:                      white;
}

span.legende span.punkte:after {
	content: "⬤";
}

span.legende span.punkte1,
span.legende span.punkte2,
span.legende span.punkte3,
span.legende span.punkte0 {
	font-size:   16px;
	line-height: 10px;
}

.dots {
	display:   flex;
	flex-wrap: wrap;
	width:     40px;
	float:     right;
}

.dots.breiter {
	width: 50px;
}

.dots div {
	line-height: 10px;
	font-size:   1.3em;
}

div.levelUp:before {
	content:      "↑";
	color:        limegreen;
	margin-right: 10px;
}

div.levelDown:before {
	content:      "↓";
	color:        red;
	margin-right: 10px;

}

span.prevRang {
	font-size: 0.6em;
	color:     grey;
}

div.teamergebnisse,
td.teamergebnisse {
	font-size:  12px;
	text-align: center;
}

.ergebnis-is-offen {
	color: grey;
}

.ergebnis-is-heim {
	background:    blue;
	padding:       1px 3px;
	border-radius: 4px;
}

/*
.ergebnis-is-heim:before {
	content: "🏠";
	margin-right: 4px;

}

.ergebnis-is-gast:before {
	content:      " ";
	margin-right: 4px;
}
*/