/*
This file is (almost?) exclusively used by the 'detailFixt'
3-column results layout.
*/
.subContainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;

  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;

  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;

  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}

legend.flexitem {
  white-space: nowrap;

  width: 15vmax;
}

.mid {
  -webkit-box-flex: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 1;
  flex-shrink: 1;

  width: 15vmax;
  text-align: center;
}

.colA,
.colH {
  -webkit-box-flex: 0;
  -ms-flex: 0 1 auto;
  flex: 0 1 auto;

  width: 35vmax;
}

.mid,
.colA,
.colH {
  white-space: nowrap;
  overflow: auto;
}

.colH {
  text-align: right;
}

.colA {
  text-align: left;
}

.bolder {
  font-weight: bolder;
  font-size: larger;
}

div>span.Goal {
  font-weight: 400;
}

div span.assist {
  font-style: italic;
  font-size: x-small;
}

div>.Yellow,
div>.Red,
div>.Pen_Miss,
div>.Yllw_2 {
  font-weight: 100;
  font-size: xx-small;
}

div>span>img.icon {
  height: calc(0.45rem + 1.1vmin);
  margin: 0px;
}

.colH img.icon {
  float: right;
}

.colA img.icon {
  float: left;
}

div.colA,
div.colH,
div.mid {

  background-color: var(--light);
  color: var(--dark);
  border: .15rem solid var(--dark);

  padding: .35rem;
}

/* These may be overridden in the next section */
.Dundee_United .colH, .Dundee_United .colA,
.Livingston .colH, .Livingston .colA,
.Motherwell .colH, .Motherwell .colA {
  color: var(--light);
  background-color: var(--dark);
}

div.Aberdeen,
div.Celtic,
div.Dundee,
/* NB all previous clubs may appear in archived data  */
div.Dundee_FC,
/* div.Dundee_United, */
div.Falkirk,
div.Hearts,
/* NB all previous clubs may appear in archived data  */
div.Heart_of_Midlothian,
div.Hibernian,
div.Kilmarnock,
/* div.Livingston, */
/* div.Motherwell, */
div.Rangers,
div.Ross_County,
div.St__Mirren,
div.St__Johnstone {
  color: var(--light);
  background-color: var(--dark);
  border: .15rem solid var(--light);
}

div.win {
  border: .35rem solid var(--greenyellow);
  padding: .15rem;
}

div.loss {
  border: .35rem solid var(--red);
  padding: .15rem .35rem;
}

div.draw {
  border: .35rem solid var(--pinkish);
}

.noBorder {
  border: none;
}

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) and (orientation:portrait),
only screen and (max-height: 300px) and (orientation:landscape) {

  .mid,
  .colA,
  .colH {
    white-space: nowrap;
    overflow: auto;
  }
}