body{   
    font-family: Arial, Helvetica, sans-serif;
    /* background-color: #111217; */
}
::-webkit-scrollbar {
  height: 8px;
  overflow: visible;
  width: 8px;
}
* {
  box-sizing: border-box;
}
.bracket-wrapper{
  width: 98vw;
  padding:3em;
  overflow-x: auto;
  white-space: nowrap;
}
.bracket{  
  width: 170em;
  overflow-x:auto;  
  /* color:#ddd */
}

.playoffs{  
  display:block;
  padding-left: 40vw;    
}

div.round{
  position: relative;
  float: left;
  width:20em;
  height: auto;
  display:block;  
}
div.podium{
  position: relative;
  float: left;
  width:20em;
  height: auto;
  display:block;  
}
.round .match{
    position:relative;
    display:block;
  }
.round-title{
	height:3em;
	padding-top:.3em;
  width: 14em;
	text-align:center;
	border-bottom:2px solid #ddd;
	margin-bottom:2em;
  
}

.team-container{
    position: relative;
    float: left;    
}
.team-container .team{
  width: 14em;
  height:3em;
  padding:1em 0 0 1em;  
  /* background:#1B1C23  ; */
  background:#ddd  ;
  font-weight:700;

  border:2px solid #aaa;
}
.team-container  .top{  
  border-bottom:0;
  border-top-right-radius: 5px;	
  border-top-left-radius: 5px;	
  
}

.label{
  width:84%;
  display:inline-block
}

.team-container  .bottom{  
  border-bottom-right-radius: 5px;	
  border-bottom-left-radius: 5px;	   
  border-top:2px solid  #fff;  
}


.team-container .team .label{
  width:75%;  
}

.pk, .tiebreaker{
  position: absolute;
  float: right;
  left:14.2em; 
  width: 3em;  
}


.team-container .team .label,
.team-container .team .score{
  float:left;
}

.match-details{
  width: 14em;
  height:2em;  
  padding-left:1em;
  padding-top:.5em
}

.team-container  .team-win{
  background-color: darkgoldenrod;  
	color: white;
}

.team-container .team-champion{
  background-color: #BC952C;
}

.team-container .team-second{
  background-color: #ACACAC  
}
.team-container .team-third{
  background-color: #8C612D  
}

.team-container  .team-win-tie{
  background-color: #999
}