* {
  border: 0;
  font-family: Roboto;
  margin: 0;
  padding: 0;
}
#menu {
  background-color: #3CB371;
  height: calc(100% - 40px);
  overflow: scroll;
  padding: 20px 0;
  position: fixed;
  right: 100%;
  top: 75px;
  transform: translateX(-105vw);
  transform-origin: (0, 0);
  transition: 0.6s ease-in-out;
  width: 100%;
  z-index: 10;
}
#open-menu-checkbox:checked ~ #menu {
  right: 0;
  transform: translateX(0);
}
#open-menu-checkbox:checked ~ h1 #open-menu-icon-a {
  transform: translate(-1px, 3px) rotate(-45deg);
  width: 20px;
}
#open-menu-checkbox:checked ~ h1 #open-menu-icon-c {
  transform: translate(-1px, -3px) rotate(45deg);
  width: 20px;
}
#open-menu-checkbox:checked ~ h1 #open-menu-icon span {
  background-color: #FBE156;
}
#menu-content {
}
#menu ul {
}
#menu li {
  padding: 10px 0;
}
#menu a {
  color: #FFF;
  display: block;
  font-size: 1.8em;
  font-weight: 500;
  padding: 10px 20px;
  text-decoration: none;
}
#menu li ul {
  padding: 0;
}
#menu li ul a {
  font-size: 1.5em;
  padding: 0 40px;
}
#open-menu-checkbox {
  height: 70px;
  left: 0;
  opacity: 0;
  position: fixed;
  top: 3px;
  width: 70px;
  z-index: 20;
}
#open-menu-icon {
  display: inline-block;
  padding: 26px 5px 22px 20px;
  vertical-align: top;
}
#open-menu-icon span {
  background-color: #444;
  border-radius: 2px;
  display: block;
  height: 5px;
  margin: 0 0 5px;
  transition: 0.4s ease-in-out;
  width: 30px;
}
#open-menu-icon span:last-child {
  margin-bottom: 0;
}
h1 {
  background-color: #3CB371;
  height: 70x;
  position: fixed;
  width: 100%;
  z-index: 10;
}
h1 a {
  color: #FFF;
  display: inline-block;
  padding: 20px 20px 20px 5px;
  text-decoration: none;
  vertical-align: top;
  width: calc(100% - 90px);
}
#content {
  padding-top: 75px;
}
h2 {
  background-color: #DDD;
  color: #222;
  padding: 20px;
}
h3 {
  background-color: #F2F3F4;
  color: #222;
  font-size: 1.3em;
  padding: 20px;
}
.h-obs {
  color: #AAA;
  display: inline-block;
  font-size: 0.6em;
  font-weight: normal;
  padding-left: 10px;
}
h4 {
  color: #222;
  font-size: 1.3em;
  padding: 20px 20px 15px;
}
h4.bg-yellow {
  background-color: #FBE156
}
table {
  border-collapse: collapse;
  width: 100%;
}
.table-overflow {
  display: block;
  overflow-x: auto;
}
.table-overflow table {
    display: table;
    width: 100%;
}
th {
  color: #444;
}
td {
  color: #222;
}
th, td {
  border-bottom: 1px solid #EEE;
  border-collapse: collapse;
  padding: 20px;
}
th.number, td.number {
  text-align: right;
}
td a {
  color: #1E8449;
  text-decoration: none;
}
.game-players {
  float: left;
  margin-bottom: 10px;
  width: 50%;
}
.game-players.right {
  text-align: right;
}
.game-players .player-name {
  display: inline-block;
}
.player-goalkeeper {
  display: none;
}
.player-goalkeeper.show {
  display: inline-block;
}
.goals-for {
  display: inline-block;
}
.goals-against {
  display: inline-block;
  color: #ED4646;
}
.team-column {
  width: 40%;
}
.player-column {
  vertical-align: top;
  width: 40%;
}
.goals-column {
  text-align: center;
  vertical-align: top;
  width: 8%;
}
.x {
  padding: 0;
  width: 4%;
}
.after-links {
  margin: 10px 15px;
}
.last-card {
  margin: 20px 15px;
}
.after-links a, .last-card a, .last-line a {
  background-color: #F2F3F4;
  border-radius: 3px;
  color: #1E8449;
  display: inline-block;
  font-size: 1em;
  margin: 0 5px 10px;
  padding: 10px;
  text-decoration: none;
}
.card {
  border-bottom: 1px solid #EEE;
  padding: 20px;
}
.player-position {
  background-color: #EEE;
  border-radius: 20px;
  display: inline-block;
  font-weight: bold;
  height: 25px;
  padding-top: 5px;
  text-align: center;
  vertical-align: middle;
  width: 30px;
}
.player-position-1 {
  background-color: #F2B50D;
  color: #FFF;
}
.player-position-2 {
  background-color: #738C8C;
  color: #FFF;
}
.player-position-3 {
  background-color: #B36B4D;
  color: #FFF;
}
.card-name {
  display: inline-block;
  padding: 10px 10px 30px 10px;
  text-decoration: none;
  width: calc(100% - 60px);
}
#partners .card-name {
  padding-left: 0;
}
.card-values {
  color: #444;
}
.card .number {
  border: 1px solid #EEE;
  border-radius: 5px;
  display: inline-block;
  margin-right: 10px;
  min-width: 75px;
  padding: 5px 10px;
  text-align: center;
}
.number-value {
  display: inline-block;
}
.number-description {
  color: #999;
  display: inline-block;
  font-size: 0.8em;
  vertical-align: middle;
}
.number-against {
  color: #ED4646;
  font-size: 0.8em;
}
.number-against.none {
  display: none;
}
.obs {
  color: #AAA;
  font-size: 0.8em;
  line-height: 1.3em;
  margin: 20px;
}
.obs p {
  margin-bottom: 10px;
}
.obs ul {
  list-style-position: inside;
  margin: 0 0 10px 5px;
}
.obs ul ul {
  margin-left: 20px;
}
.player-full-name {
  color: #222;
  font-size: 1.1em;
}
.highlighted {
  font-weight: 500;
}
.empty-records {
  color: #999;
}
.friendly {
  color: #999;
}
.big-cards {
  text-align: center;
}
.table-name {
  color: #666;
  font-size: 2em;
  font-weight: 500;
  margin-bottom: 20px;
}
.big-cards .player-position {
  border-radius: 100px;
  font-size: 4em;
  height: 100px;
  line-height: 100px;
  margin-bottom: 20px;
  padding-top: 0;
  width: 100px;
}
.table-counters {
  color: #666;
  font-size: 1.5em;
}
.circle-results {
  text-align: center;
}
.circle-results ul {
  margin-bottom: 20px;
}
.circle-result {
  border-radius: 15px;
  display: inline-block;
  height: 15px;
  margin: 0 3px;
  width: 15px;
}
.result-win {
  background-color: #3CB371;
}
.result-lose {
  background-color: #ED4646;
}
.result-draw {
  background-color: #AAA;
}
.game-days {
  padding: 0 13px 20px;
}
.game-day-scoreboard {
  display: inline-block;
  position: relative;
  text-align: center;
  text-decoration: none;
  width: 60px;
}
.game-day {
  background-color: #FFF;
  border: 1px solid #1E8449;
  border-radius: 40px;
  color: #1E8449;
  display: inline-block;
  margin: 0 7px;
  padding: 10px;
  text-align: center;
  text-decoration: none;
}
.game-day-scoreboard.season- .game-day {
  background-color: #EEE;
  border-color: #AAA;
  color: #AAA;
}
.game-day-scoreboard .circle-result {
  position: absolute;
  right: 4px;
}
.game-scoreboard {
  color: #AAA;
  font-size: 0.7em;
}
.odd {
  background-color: #ffeb9cfd;
  border: 1px solid #b9a860dd;
  border-radius: 5px;
  color: #312800dd;
  display: inline-block;
  font-size: 0.6em;
  min-width: 15px;
  padding: 1px 3px;
  text-align: center;
  vertical-align: middle;
}
.odd:empty {
  display: none;
}

#sortable-players {}
#sortable-players .team {
  display: inline-block;
  vertical-align: top;
  width: calc(50% - 2px);
}
#sortable-players .team-name, #sortable-players li {
  border-bottom: 1px solid #EEE;
  padding: 20px;
}
#sortable-players li {
  list-style: none;
}
