@import url('https://fonts.googleapis.com/css?family=Montserrat');

body {
  font-family: "Montserrat", "Arial";
  color: white; 
  background-color: #444; 
}

.scoreboard {
  display: flex;
  flex-direction:row;
}

.scoreboard > * {
  border-top: 1px solid white;
  border-bottom: 1px solid white; 
  border-right: 1px solid white; 
  height: 50px; 
  font-weight: bold; 
}

.scoreboard > *:first-child {
  border-left: 1px solid white;
}

.team {
  display: flex;
  flex-direction: row;
  color: white; 
  width: 350px;
}

.team-detail {
  display: flex;
  flex-direction: column;
  justify-content: space-between; 
}

.team-detail {
  padding: 0em 0.5em; 
}

.team-detail {
  font-size: 1.5em; 
  margin-top: 9px;
}

.team-name {
  margin-right: 20px;
}

.team-detail .team-nameandscore {
  display: flex;
  flex-direction: row;
  justify-content: space-between; 
}

.team-detail .team-thisgame {
  width: 150px; 
  font-size: 0.5em; 
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  opacity: 0.8;
}

.timer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  background-color: #222; 
  width: 169px;
}

.timer-container {
  display: flex;
  flex-direction: row; 
  width: 193px;
}

.timer-container > * {
  border-right: 1px solid white; 
  padding: 0em 1em; 
  color: white;
}

.timer-container > *:last-child {
  border-right: 0; 
  color: yellow; 
}

.logo {
  display: flex;
  flex-direction: column; 
  justify-content: center; 
  padding: 0em 0.5em; 
  background-color: black; 
}

.logo img {
  width: 100px; 
}

/* Game */ 

.houston {
  background-color: crimson;
}

.dallas {
  background-color: steelblue; 
}