@charset "UTF-8";
nav.grupos {
  position: relative;
  width: 90%;
  max-width: 1060px;
}
@media (max-width: 1366px) {
  nav.grupos {
    width: 92%;
  }
}
@media (max-width: 1024px) {
  nav.grupos {
    width: 94%;
  }
}

/* Cabecera de temporadas anteriores */
header.secundario.champions p:after {
  border-top-color: #162e58;
}
header.secundario.champions nav {
  background: #162e58;
}
header.secundario.champions p a {
  width: 9em;
  background-image: url("https://s.libertaddigital.com/images/svg/champions-santander.svg");
}
header.secundario.champions ul {
  vertical-align: middle;
}
header.secundario.champions ul li a:hover {
  color: #162e58;
}

div.champions {
  font-size: 16px;
  /* Modificación de los estilos de la Liga */
  /* Resultados */
  /* Equipos */
}
@media (min-width: 480px) and (max-width: 1060px) {
  div.champions {
    font-size: calc(16px + 4 * ( (100vw - 480px) / 580));
  }
}
@media (min-width: 1060px) {
  div.champions {
    font-size: 20px;
  }
}
div.champions a {
  color: #162e58;
  transition: all 0.3s;
}
div.champions a:hover {
  background: #162e58;
  color: #fff;
  text-decoration: none;
}
div.champions h3 {
  font: normal 1.41421em "Roboto Condensed", "Roboto", sans-serif;
  margin-bottom: 0.5em;
  clear: both;
}
div.champions p {
  color: #333;
  font-weight: 300;
  line-height: 160%;
}
div.champions nav.temporada {
  background: #000;
  margin-bottom: 1em;
  color: #fff;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border: 0;
  padding: 0 0.3em;
  border-radius: var(--border-radius);
  background: #f3f3f3;
}
div.champions nav.temporada > * {
  font-size: 1em;
  font-family: var(--alt-font);
  vertical-align: middle;
}
div.champions nav.temporada h2 {
  font-weight: normal;
  margin: 0;
  padding: 0.2em 0;
}
div.champions nav.temporada h2:after {
  content: "〉";
}
div.champions nav.temporada h3 {
  font-weight: normal;
  padding: 0.2em 0.4em;
  background: #162e58;
  text-align: center;
}
div.champions nav.temporada ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
  font-weight: 300;
}
div.champions nav.temporada ul li {
  margin: 0;
  padding: 0 0.2em;
  display: table-cell;
  font-weight: 300;
  text-align: right;
  border-right: 1px solid white;
}
div.champions nav.temporada ul li:last-child {
  border: 0;
}
div.champions nav.temporada, div.champions nav.temporada h2:after {
  color: #162e58;
}
div.champions nav.temporada h2 {
  padding: 0.3em 0;
  width: 100%;
}
div.champions nav.temporada ul li {
  vertical-align: middle;
  border-style: dotted;
  border-color: #162e58;
}
div.champions nav.temporada h3 a, div.champions nav.temporada ul li a {
  white-space: nowrap;
  color: #162e58;
}
div.champions nav.temporada h3 a:hover, div.champions nav.temporada ul li a:hover {
  color: #fff;
}
@media (max-width: 480px) {
  div.champions nav.temporada {
    display: block;
  }
  div.champions nav.temporada > * {
    display: block;
  }
  div.champions nav.temporada ul li:first-child {
    padding-left: 0;
  }
}
div.champions .resultados {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media (max-width: 480px) {
  div.champions .resultados {
    display: block;
  }
}
div.champions .grupo-resultados {
  flex: 0 1 48%;
}
div.champions .grupo-resultados.final {
  margin-left: 25%;
  margin-right: 25%;
  width: 50%;
}
div.champions .grupo-resultados img {
  display: inline-block;
  vertical-align: -10%;
}
div.champions .grupo-resultados table {
  font-size: 0.7071085624em;
}
div.champions .grupo-resultados table th, div.champions .grupo-resultados table td {
  padding: 0.3em 0.2em;
}
div.champions .grupo-resultados table th {
  background: #162e58;
  color: white;
  border-bottom: 2px solid white;
  border-left: 0;
}
div.champions .grupo-resultados table td {
  background: #dcdcdc;
  border-bottom: 1px solid white;
  vertical-align: middle;
}
div.champions .grupo-resultados table td.local, div.champions .grupo-resultados table td.visitante {
  width: 50%;
}
div.champions .grupo-resultados table td.local {
  text-align: right;
}
div.champions .grupo-resultados table td.resultado {
  text-align: center;
  padding: 0.2em 0;
  white-space: nowrap;
}
div.champions .grupo-resultados table td.resultado sup {
  font-size: 0.7071085624em;
  vertical-align: super;
}
div.champions .grupo-resultados table td .fecha {
  float: right;
}
div.champions .grupo-resultados table.clasificacion td:first-child {
  text-align: left;
  white-space: nowrap;
}
div.champions .grupo-resultados table.proximos td:first-child {
  padding-right: 0;
  vertical-align: top;
}
div.champions .grupo-resultados table.proximos td:last-child {
  padding-left: 0;
  text-align: right;
  vertical-align: top;
}
@media (max-width: 480px) {
  div.champions .grupo-resultados {
    margin: 0 0 1em 0 !important;
    border-bottom: 1px solid #ccc;
  }
  div.champions .grupo-resultados.final {
    width: 100%;
  }
}
div.champions .conlateral > div.equipo {
  display: flex;
  justify-content: space-between;
}
@media (max-width: 480px) {
  div.champions .conlateral > div.equipo {
    flex-direction: column;
  }
}
div.champions .conlateral > div.equipo > div:first-child {
  flex: 1 1 70%;
}
div.champions .conlateral > div.equipo > div:first-child > img {
  width: 100%;
}
div.champions .conlateral > div.equipo .jugadores {
  flex: 1 1 30%;
  margin-left: 2em;
}
div.champions .conlateral > div.equipo .jugadores img {
  float: right;
}
div.champions .conlateral > div.equipo .jugadores h3 {
  clear: none;
}
div.champions .conlateral > div.equipo .jugadores p {
  margin-bottom: 0.5em;
}
div.champions .conlateral > div.equipo .jugadores table {
  font-size: 0.7071085624em;
}
div.champions .conlateral > div.equipo .jugadores table th, div.champions .conlateral > div.equipo .jugadores table td {
  padding: 0.5em 0.25em;
}
div.champions .conlateral > div.equipo .jugadores table th {
  color: #000;
  background: #dcdcdc;
}
div.champions .conlateral > div.equipo .jugadores table td {
  vertical-align: top;
}

/* Palmarés */
.palmares th {
  background: #162e58;
  border-bottom: 1px solid white;
  color: white;
}
.palmares tr {
  background: #DCDCDC;
  border-bottom: 1px solid white;
}
.palmares td {
  padding: 0.3em 0.4em;
}
.palmares td.decada {
  font-weight: bold;
  text-align: center;
  font-size: 1.41421em;
}
.palmares td sup {
  font-size: 0.7071085624em;
  vertical-align: super;
}
.palmares td:nth-child(1), .palmares td:nth-child(4) {
  white-space: nowrap;
}
.palmares td:nth-child(2), .palmares td:nth-child(5), .palmares td:nth-child(7) {
  vertical-align: middle;
  padding: 0;
}
.palmares td:nth-child(8) {
  font-size: 0.7071085624em;
}
@media (max-width: 1024px) {
  .palmares td:nth-child(7) {
    display: none;
  }
}
@media (max-width: 480px) {
  .palmares th {
    display: none;
  }
  .palmares tr {
    display: block;
    position: relative;
  }
  .palmares td {
    display: inline-block;
  }
  .palmares td:nth-child(1), .palmares td:nth-child(8) {
    display: block;
  }
  .palmares td:nth-child(2), .palmares td:nth-child(5) {
    padding: 0 0 0 0.4em;
    width: 18px;
  }
  .palmares td:nth-child(3), .palmares td:nth-child(6) {
    width: calc(50% - 18px - 2.6em);
    padding: 0.2em;
  }
  .palmares td:nth-child(4) {
    width: 2em;
    padding: 0.2em 0.2em 0.2em 0.4em;
  }
  .palmares td:nth-child(8) {
    position: absolute;
    top: 0;
    right: 0;
    padding: 0.4em;
  }
}

/* Menú de grupos */
nav.grupos {
  display: flex;
  margin: 0 auto 1em;
}
nav.grupos .grupo {
  vertical-align: top;
  width: 100%;
  background: #EAEAEA;
  border: 0;
  border-right: 0.2em solid white;
}
nav.grupos .grupo:last-child {
  border: 0;
}
nav.grupos .grupo h4 {
  margin: 0.5em 0 1em;
  background: #00A5CB;
  text-transform: uppercase;
  text-align: center;
}
nav.grupos .grupo h4 a {
  display: block;
  color: #fff;
  font: 300 1em/1.41421em "Roboto Condensed", "Roboto", sans-serif;
}
nav.grupos .grupo h4 a:hover {
  color: #000;
}
nav.grupos .grupo ul {
  list-style: none;
  margin: 0 0.5em 1em;
}
nav.grupos .grupo ul li a {
  display: block;
  font-size: 0.7071085624em;
  line-height: 1.9999899241em;
  text-transform: uppercase;
  white-space: nowrap;
}
nav.grupos .grupo ul li a:hover {
  background: #fff;
}
nav.grupos .grupo ul li img {
  display: inline-block;
  margin-right: 0.3em;
  vertical-align: -10%;
}
@media (max-width: 820px) {
  nav.grupos .grupo ul li img {
    display: none;
  }
}
@media (max-width: 480px) {
  nav.grupos .grupo ul li span, nav.grupos .grupo h4 a span {
    display: none;
  }
  nav.grupos .grupo ul {
    margin: 0 auto;
    text-align: center;
  }
  nav.grupos .grupo ul li, nav.grupos .grupo ul li a, nav.grupos .grupo ul li img {
    display: block;
    margin: 0 auto 0.3em;
  }
}

/* Sedes */
.sedes {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

section.estadio {
  margin: 1em 0 1.5em;
  box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.5);
}
section.estadio:nth-child(n+2) {
  flex: 0 1 48%;
}
section.estadio figure {
  overflow: visible;
  margin: 0;
}
section.estadio figure figcaption {
  top: 0;
  bottom: auto;
  background: 0;
  padding: 0;
  text-align: left;
}
section.estadio figure figcaption h2 {
  background: #00A5CB;
  display: inline-block;
  font-size: 1.41421em;
  padding: 0.5em;
  position: absolute;
  margin-top: -0.9em;
  border-top-right-radius: 0.5em;
}
section.estadio figure figcaption span {
  color: #333;
  position: absolute;
  right: 0;
  top: -1.5em;
}
section.estadio p {
  padding: 0.5em;
}
@media (max-width: 480px) {
  section.estadio {
    margin-bottom: 3em;
  }
  section.estadio:nth-child(n+2) {
    flex-basis: 100%;
    min-height: auto;
  }
  section.estadio figure figcaption span {
    display: none;
  }
}