.debug {
  display: none;
  border-top: 1px solid #fff;
  margin-top: 1em;
  top: 24px;
}

.debug::before {
  content: 'Debug';
}

/*
.match-container .col {
  -webkit-flex: 1 0 0%;
  flex: 1 0 0%;
  float: left;
  margin: 5px 0 5px 5px;
}

.match-container .row {
  display: -webkit-flex;
  display: flex;
  flex-wrap: wrap;
  background: #222232;
  width: 220px;
  border-radius: 8px;
}

.match-container .row > * {
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
}

.match-container .row::after {
  content: '';
  display: table;
  clear: both;
}
*/


.round li {
  overflow: auto;
}

.round li {
  background: #222232;
}

.round li,
.round li img {
  border-radius: 8px;
}

.ireticle {
  width: 50px;
  height: 50px;
  object-fit: cover;
  border-radius: 8px;
}

.round li div {
  width: auto;
  float: left;
  padding: 5px;
  box-sizing: content-box;
  white-space: nowrap;
}

.rr .rounds,
.ireticle {
  /* width: auto; */
  overflow: auto;
}

/*
.tournament-info {
  display: block;
  clear: both;
}
*/

.rounds {
  display: -webkit-flex;
  display: flex;
  font-size: 8pt;
}

.rounds .round {
  position: relative;
  width: 220px;
  float: left;
  margin-right: 40px;
  margin-top: 16px;
  margin-left: 24px;
  left: 20px;
  float: left;
}

.rounds .round:first-child {
  margin-left: 0px;
}

.rounds .bracket-position {
  position: absolute;
  top: -20px;
  width: 100%;
  text-align: center;
  font-size: 16pt;
  font-weight: 900;
}

.rounds .round .matchnr-container {
  position: relative;
  left: -10px;
  top: calc(50% - 2px);
  z-index: 2;
}

.rounds .round .match-container {
  /* float: left; */
  /* padding-bottom: 15px; */
}

.rounds .round .match-container .row {
  display: -webkit-flex;
  display: flex;
  flex-direction: row;
  background: #222232;
  width: 250px;
  border-radius: 8px;
  margin-bottom: 2px;
}

.rounds .round .match-container .row>* {
  padding-left: 0;
	padding-right: 5px;
}

.match-container>div.dmess {
  display: none;
  position: absolute;
  z-index: 3;
  padding: 1em;
  width: 180px;
  background: #222232;
  border: 2px solid #fff;
  top: 75%;
}

.rounds .round .match-container>div.message {
  display: none;
  position: absolute;
  z-index: 3;
  padding: 1em;
  width: 180px;
  background: #222232;
  border: 2px solid #fff;
  top: 25%;
}

.rounds .round:not(:last-of-type) .match-container>div.dmess,
.rounds .round:not(:last-of-type) .match-container>div.message {
  left: calc(100% + 1em);
}

.rounds .round:not(:first-of-type) .match-container>div.dmess,
.rounds .round:not(:first-of-type) .match-container>div.message {
  right: calc(100% + 1em);
}

.match-container:hover>div.dmess,
.rounds .round .match-container:hover>div.message {
  display: block;
}

.rounds .round .match-container picture {
  float: left;
  margin: 5px;
	width: auto;
}

.col h3 {
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  font-size: 16px;
  margin-bottom: 3px;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  display: -webkit-box;
  overflow: hidden;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;

}

.col h3 img {
  width: 17px;
  height: 17px;
  margin-right: 5px;
}

.col p {
  font-size: 13px;
}


.rounds .round .matchnr-container .matchnr {
  font-size: 11px;
  font-family: arial;
  border: 1px solid #535353;
  background: #1c1c1c;

  padding: 2px 5px;
  border-radius: 5px;
}

@supports(display:flex) {
  .rounds {
    display: -webkit-flex;
    display: flex
  }

  .rounds .round {
    display: -webkit-flex;
    display: flex;
    flex-direction: column;
    justify-content: space-around
  }

  .rounds .round:last-child {
    justify-content: center
  }

  .rounds .round .match-container {
    height: 135px !important;
  }

  .rounds .round .match-container .match {
    top: auto !important;
    margin-bottom: 2px;
    margin-top: 2px
  }
}

/* tree */
.round .match-container {
  position: relative;
}

/*
.rounds .round:not(:first-of-type) .matchnr-container::before {
  content: '';
  position: absolute;
  left: -30px;
  top: 50%;
  border-top: 1px solid #ccc;
  width: 3vh;
}

.rounds .round:not(:last-of-type) .matchnr-container::after {
  content: '';
  position: absolute;
  left: calc(100% - 1vh);
  top: calc(50% - 1px);
  border-top: 1px solid #ccc;
  width: 2vh;
}

.round:not(:last-of-type) .match-container::before {
  content: '';
  position: absolute;
  left: 100%;
  top: 50%;
  border-top: 1px solid #ccc;
  width: 0vh;
}

.round:not(:last-of-type) .match-container::after {
  content: '';
  position: absolute;
  left: 100%;
  border-left: 1px solid #ccc;
  border-radius: 10px;
  height: 100%;
}

.round .match-container:nth-child(odd)::after {
  top: calc(-50% + 4px);
}

.round .match-container:nth-child(even)::after {
  bottom: calc(-50% - 4px);
}

.round:nth-child(3) .match-container:nth-child(odd)::after {
  height: 200%;
  top: calc(-150% + 4px);
}

.round:nth-child(3) .match-container:nth-child(even)::after {
  height: calc(200% + 1px);
  bottom: calc(-150% - 4px);
}
*/

.round .row {
  position: relative;
  flex-wrap: nowrap;
}

.twinner {
	position: relative;
}

.twinner::before, .tgold::after, .tsilver::after, .tbronze::after {
  position: absolute;
  bottom: 1rem;
  padding: .2rem .4rem;
  border-radius: 3px;
  box-shadow: 0 0 4px 2px #383c4d;
  text-align: center;
  font-weight: 700;
  font-size: 12pt;
}

.twinner::after {
  /* content: "W"; */
  background: #179de0;
  right: 3rem;
}

.tgold::before {
  content: "1";
  background: #efa10b;
  right: 1rem;
	padding: 0.2rem 0.55rem;
}

.tsilver::before {
  content: "2";
  background: #8e969a;
	right: 1rem;
	padding: 0.2rem 0.55rem;
}

.tbronze::before {
  content: "3";
  background: #c58251;
	right: 1rem;
	padding: 0.2rem 0.55rem;
}


.winner::before {
  content: "W";
  background: #179de0;
  padding: 2px 5px;
  text-align: center;
  border-radius: 99px;
  font-weight: 700;
  font-size: 9px;
  position: absolute;
  right: 10px;
  bottom: 10px;
  box-shadow: 0 0 4px 2px #383c4d;
}

.gold-medal:after {
  position: absolute;
  background: #efa10b;
  content: "1";
  right: -30px;
  top: calc(50% - 10px);
  padding: .4em .8em;
  border-radius: 3px;
}

.silver-medal:after {
  position: absolute;
  background: #8e969a;
  content: "2";
  right: -30px;
  top: calc(50% - 10px);
  padding: .4em .8em;
  border-radius: 3px;
}

.bronze-medal:after {
  position: absolute;
  background: #c58251;
  content: "3";
  right: -30px;
  top: calc(50% - 10px);
  padding: .4em .8em;
  border-radius: 3px;
}

.round-text {
  padding: 20px;
  padding-bottom: 10px;
  display: flex;
  gap: 10px 30px;
  flex-wrap: wrap;
  align-items: center;
  background: #222232;
  border-radius: 16px;
  margin-bottom: 30px;
}

.round-text__item {
  margin-bottom: 10px;
}

.round-text__item span {}

.round-text__item a {
  padding: 3px 5px;
  background: grey;
  border-radius: 8px;
  margin-left: 3px;
}

.footer {
  margin-top: 100px;
}