/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS/SCSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *


 */
/* MASTER CLUB STYLINGS -----------------------------------------------------------------------------------------------*/
/* This is now the MASTER storage for EPL club colours. Adding clubs to the DB only creates options for new PLRs ------*/
.btn {
  border: 2px solid #9E9E9E;
  outline: 0;
  box-shadow: 0 0 0 transparent; }
  .btn.btn-primary {
    color: #4a3780;
    background-color: #fff;
    border-color: currentColor; }
    .btn.btn-primary:hover, .btn.btn-primary:active, .btn.btn-primary:focus, .btn.btn-primary:active:focus {
      color: #936DFF;
      background-color: #fff; }

.alert {
  color: #000;
  background-color: #9E9E9E;
  padding: 0.5rem 1rem;
  border: 0 none;
  margin-bottom: 1rem; }
  .alert.alert-success {
    background-color: #72aa00; }
  .alert.alert-info {
    background-color: #2196f3; }
  .alert.alert-warning {
    background-color: #ff9800; }
  .alert.alert-danger {
    color: #fff;
    background-color: #990000; }

.text-primary {
  color: #936DFF; }

.text-success {
  color: #72aa00; }

.text-info {
  color: #2196f3; }

.text-warning {
  color: #ff9800; }

.text-danger {
  color: #FF3838; }

.tooltip {
  opacity: 1 !important; }
  .tooltip-inner {
    background-color: #4a3780; }
  .tooltip.top .tooltip-arrow {
    border-top-color: #4a3780 !important; }
  .tooltip.bottom .tooltip-arrow {
    border-bottom-color: #4a3780 !important; }

.logo__club {
  cursor: default;
  width: 42px;
  text-align: center;
  font-size: 0.85rem;
  font-weight: 700;
  text-transform: uppercase;
  color: #424242;
  background-color: #BDBDBD;
  border: 2px solid #424242;
  border-radius: 20px;
  box-sizing: border-box;
  display: block;
  margin: auto; }
  .logo__club--ars {
    background-color: #DB0007;
    color: #ffffff;
    border-color: #DB0007; }
  .logo__club--avl {
    background-color: #670E36;
    color: #95BFE5;
    border-color: #670E36; }
  .logo__club--bou {
    background-color: #B50E12;
    color: #ffffff;
    border-color: #000000; }
  .logo__club--bre {
    background-color: #ffffff;
    color: #C10000;
    border-color: #000000; }
  .logo__club--bha {
    background-color: #0057B8;
    color: #FFCD00;
    border-color: #0057B8; }
  .logo__club--bur {
    background-color: #6C1D45;
    color: #99D6EA;
    border-color: #99D6EA; }
  .logo__club--che {
    background-color: #034694;
    color: #ffffff;
    border-color: #034694; }
  .logo__club--pal {
    background-color: #1B458F;
    color: #ffffff;
    border-color: #C4122E; }
  .logo__club--eve {
    background-color: #003399;
    color: #ffffff;
    border-color: #003399; }
  .logo__club--ful {
    background-color: #ffffff;
    color: #CC0000;
    border-color: #000000; }
  .logo__club--ips {
    background-color: #0333A0;
    color: #ffffff;
    border-color: #e2241b; }
  .logo__club--lee {
    background-color: #ffffff;
    color: #1D428A;
    border-color: #FFCD00; }
  .logo__club--lei {
    background-color: #003090;
    color: #FBBA00;
    border-color: #ffffff; }
  .logo__club--liv {
    background-color: #C8102E;
    color: #ffffff;
    border-color: #C8102E; }
  .logo__club--lut {
    background-color: #FA4616;
    color: #11223B;
    border-color: #ffffff; }
  .logo__club--mnc {
    background-color: #6CABDD;
    color: #1C2C5B;
    border-color: #ffffff; }
  .logo__club--mnu {
    background-color: #DA291C;
    color: #FBE122;
    border-color: #000000; }
  .logo__club--nwc {
    background-color: #ffffff;
    color: #241F20;
    border-color: #241F20; }
  .logo__club--nor {
    background-color: #FFF200;
    color: #037C3A;
    border-color: #038C41; }
  .logo__club--for {
    background-color: #C8102E;
    color: #ffffff;
    border-color: #ffffff; }
  .logo__club--shu {
    background-color: #EE2737;
    color: #000000;
    border-color: #000000; }
  .logo__club--sou {
    background-color: #ffffff;
    color: #D71920;
    border-color: #130C0E; }
  .logo__club--sun {
    background-color: #ffffff;
    color: #ff3f3f;
    border-color: #b20000; }
  .logo__club--tot {
    background-color: #ffffff;
    color: #132257;
    border-color: #132257; }
  .logo__club--wat {
    background-color: #FBEE23;
    color: #11210C;
    border-color: #ED2127; }
  .logo__club--wba {
    background-color: #ffffff;
    color: #122F67;
    border-color: #122F67; }
  .logo__club--whu {
    background-color: #7A263A;
    color: #F3D459;
    border-color: #1BB1E7; }
  .logo__club--wlv {
    background-color: #FDB913;
    color: #231F20;
    border-color: #FDB913; }

.player__club {
  cursor: default;
  text-align: center;
  color: #fff;
  background-color: #424242;
  border: 0 none;
  border-radius: 4px;
  box-sizing: border-box;
  display: block;
  padding: 2px 4px;
  margin: 0 auto; }
  .player__club--ars {
    background-color: #DB0007;
    color: #ffffff;
    border-color: #DB0007; }
  .player__club--avl {
    background-color: #670E36;
    color: #95BFE5;
    border-color: #670E36; }
  .player__club--bou {
    background-color: #B50E12;
    color: #ffffff;
    border-color: #000000; }
  .player__club--bre {
    background-color: #ffffff;
    color: #C10000;
    border-color: #000000; }
  .player__club--bha {
    background-color: #0057B8;
    color: #FFCD00;
    border-color: #0057B8; }
  .player__club--bur {
    background-color: #6C1D45;
    color: #99D6EA;
    border-color: #99D6EA; }
  .player__club--che {
    background-color: #034694;
    color: #ffffff;
    border-color: #034694; }
  .player__club--pal {
    background-color: #1B458F;
    color: #ffffff;
    border-color: #C4122E; }
  .player__club--eve {
    background-color: #003399;
    color: #ffffff;
    border-color: #003399; }
  .player__club--ful {
    background-color: #ffffff;
    color: #CC0000;
    border-color: #000000; }
  .player__club--ips {
    background-color: #0333A0;
    color: #ffffff;
    border-color: #e2241b; }
  .player__club--lee {
    background-color: #ffffff;
    color: #1D428A;
    border-color: #FFCD00; }
  .player__club--lei {
    background-color: #003090;
    color: #FBBA00;
    border-color: #ffffff; }
  .player__club--liv {
    background-color: #C8102E;
    color: #ffffff;
    border-color: #C8102E; }
  .player__club--lut {
    background-color: #FA4616;
    color: #11223B;
    border-color: #ffffff; }
  .player__club--mnc {
    background-color: #6CABDD;
    color: #1C2C5B;
    border-color: #ffffff; }
  .player__club--mnu {
    background-color: #DA291C;
    color: #FBE122;
    border-color: #000000; }
  .player__club--nwc {
    background-color: #ffffff;
    color: #241F20;
    border-color: #241F20; }
  .player__club--nor {
    background-color: #FFF200;
    color: #037C3A;
    border-color: #038C41; }
  .player__club--for {
    background-color: #C8102E;
    color: #ffffff;
    border-color: #ffffff; }
  .player__club--shu {
    background-color: #EE2737;
    color: #000000;
    border-color: #000000; }
  .player__club--sou {
    background-color: #ffffff;
    color: #D71920;
    border-color: #130C0E; }
  .player__club--sun {
    background-color: #ffffff;
    color: #ff3f3f;
    border-color: #b20000; }
  .player__club--tot {
    background-color: #ffffff;
    color: #132257;
    border-color: #132257; }
  .player__club--wat {
    background-color: #FBEE23;
    color: #11210C;
    border-color: #ED2127; }
  .player__club--wba {
    background-color: #ffffff;
    color: #122F67;
    border-color: #122F67; }
  .player__club--whu {
    background-color: #7A263A;
    color: #F3D459;
    border-color: #1BB1E7; }
  .player__club--wlv {
    background-color: #FDB913;
    color: #231F20;
    border-color: #FDB913; }

.playerclub .position-logo__club {
  display: flex;
  justify-content: center;
  margin-top: 0.5rem; }
  .playerclub .position-logo__club .position, .playerclub .position-logo__club .logo__club {
    margin: 0 0.5rem; }

footer.app-footer {
  text-align: center;
  color: #fff;
  padding: 0.5rem;
  border: 0 none;
  background-color: #4a3780; }
  footer.app-footer .app-version {
    font-size: 0.875rem; }

.goal {
  display: flex; }
  .goal-saved {
    position: relative;
    display: flex;
    z-index: 0;
    display: inline; }
    .goal-saved--glk .goal-saved__text {
      background-color: #FF4400; }
    .goal-saved--def .goal-saved__text {
      background-color: #FFAE00;
      background: linear-gradient(90deg, #FFAE00 50%, #72CC00 51%); }
    .goal-saved--sta .goal-saved__text {
      background-color: #B176FF;
      background: linear-gradient(90deg, #28A6FF 50%, #B176FF 51%); }
    .goal-saved__text {
      width: 16px;
      height: 16px;
      line-height: 16px;
      font-size: 0.75rem;
      font-weight: 700;
      text-transform: uppercase;
      color: #212121;
      background-color: inherit;
      border-radius: 100%;
      overflow: hidden; }
    .goal-saved .rpl-icon--cross {
      width: 10px;
      height: 10px;
      position: absolute;
      bottom: -3px;
      right: -4px;
      z-index: 2; }

.save {
  position: relative;
  z-index: 0; }
  .save .rpl-icon--glove {
    width: 20px;
    height: 20px; }
  .save .rpl-icon--cross, .save .rpl-icon--check, .save .rpl-icon--ball {
    width: 16px;
    height: 16px;
    position: absolute;
    bottom: -2px;
    right: -6px;
    z-index: 2; }
  .save--used .rpl-icon--glove path:nth-child(1) {
    fill: #fff; }
  .save--achieved .rpl-icon--glove path:nth-child(1) {
    fill: #fff; }
  .save--achieved .rpl-icon--check path:nth-child(1) {
    fill: #9E9E9E; }

.player__is-sub {
  cursor: default;
  position: relative;
  z-index: 2; }
  .player__is-sub .rpl-icon--sub {
    width: 14px;
    height: 14px;
    position: absolute;
    bottom: -2px;
    left: 1px;
    z-index: 3;
    box-shadow: 0 0 1px 1px rgba(255, 255, 255, 0.7); }

.player__goals {
  width: 20px;
  height: 20px;
  line-height: 19px;
  font-size: 0.875rem;
  font-weight: 700;
  text-align: center;
  color: #212121;
  background-color: #fff;
  border: 1px solid #424242;
  border-radius: 100%;
  box-sizing: border-box; }
  .player__goals--total {
    background-color: #9E9E9E; }
  .player__goals--final {
    position: relative; }
  .player__goals .rpl-icon--check {
    width: 16px;
    height: 16px;
    position: absolute;
    bottom: -7px;
    right: -10px;
    z-index: 2; }

.legend button {
  padding: 0.5rem 1rem;
  border: 0 none;
  border-radius: 4px;
  background-color: #4a3780;
  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.3); }

.legend ul {
  width: 240px;
  padding: 0;
  margin: 0;
  background-color: #424242; }
  .legend ul li {
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0.5rem; }
    .legend ul li.group-1 {
      background-color: #000; }
    .legend ul li.group-2 {
      background-color: #212121; }
    .legend ul li .legend__icon {
      width: 20px;
      height: 20px;
      margin-right: 1rem;
      text-align: center; }
      .legend ul li .legend__icon > * {
        justify-content: space-around; }

.position, .position:before {
  clip-path: polygon(50% 0%, 100% 20%, 100% 80%, 50% 100%, 0% 80%, 0% 20%); }

.position {
  cursor: default;
  position: relative;
  width: 36px;
  height: 20px;
  color: #9E9E9E;
  display: block;
  white-space: nowrap;
  margin: auto;
  background-color: #6C6C6C;
  /* Actual border color */ }
  .position:before {
    position: absolute;
    content: '';
    top: 2px;
    /* border width */
    left: 2px;
    /* border width */
    height: calc(100% - 4px);
    /* 100% - (2 * border width) */
    width: calc(100% - 4px);
    /* 100% - (2 * border width) */
    background-color: #212121; }
  .position__text {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    color: inherit;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2; }
  .position--glk:before, .position--def:before, .position--dmd:before, .position--mid:before, .position--stk:before {
    background-color: #212121; }
  .position--glk {
    color: #FF4400;
    background-color: #FF4400;
    /* Border color */ }
  .position--def {
    color: #FFAE00;
    background-color: #FFAE00;
    /* Border color */ }
  .position--dmd {
    color: #72CC00;
    background-color: #72CC00;
    /* Border color */ }
  .position--mid {
    color: #28A6FF;
    background-color: #28A6FF;
    /* Border color */ }
  .position--stk {
    color: #B176FF;
    background-color: #B176FF;
    /* Border color */ }
  .position--sta {
    color: #B176FF;
    background-color: #28A6FF;
    /* Border color */ }

.pitch {
  width: 100%;
  max-width: 100%;
  height: 910px;
  margin: 0 auto;
  position: relative;
  border: 2px solid #ddd;
  border-bottom: 0 none;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background-color: #2E7B03;
  opacity: 0.75;
  background-image: linear-gradient(0deg, #286c07 0%, #286c07 9%, transparent 9%, transparent 18%, #286c07 18%, #286c07 27%, transparent 27%, transparent 36%, #286c07 36%, #286c07 45%, transparent 45%, transparent 54%, #286c07 54%, #286c07 63%, transparent 63%, transparent 72%, #286c07 72%, #286c07 81%, transparent 81%, transparent 90%, #286c07 90%, #286c07 100%); }
  .pitch__wrapper {
    padding: 6rem 1rem 0 1rem;
    background-color: #2E7B03; }
    .pitch__wrapper:after {
      width: 100%;
      position: absolute;
      bottom: 0;
      left: 0;
      display: block;
      content: "";
      height: 120px;
      background-color: transparent;
      background-image: linear-gradient(0deg, #000 0%, transparent 100%); }
  @media (min-width: 768px) and (max-width: 1024px) {
    .pitch {
      width: 640px;
      height: 950px; } }
  @media screen and (min-width: 1025px) {
    .pitch {
      width: 900px;
      height: 950px; } }
  .pitch-home__corner {
    width: 16px;
    height: 16px;
    position: absolute;
    top: -2px;
    z-index: 1;
    border: 2px solid #ddd; }
    .pitch-home__corner--left {
      left: -2px;
      border-bottom-right-radius: 100%; }
    .pitch-home__corner--right {
      right: -2px;
      border-bottom-left-radius: 100%; }
  .pitch-home__penalty-area {
    width: 70%;
    height: 120px;
    border: 2px solid #ddd;
    border-top: 0 none;
    margin: 0 auto;
    position: relative; }
    @media (min-width: 768px) and (max-width: 1024px) {
      .pitch-home__penalty-area {
        width: 60%; } }
    @media screen and (min-width: 1025px) {
      .pitch-home__penalty-area {
        width: 40%; } }
  .pitch-home__goal-area {
    width: 60%;
    height: 40px;
    border: 2px solid #ddd;
    border-top: 0 none;
    margin: 0 auto; }
  .pitch-home__penalty-spot {
    width: 8px;
    height: 8px;
    background-color: #ddd;
    position: absolute;
    left: 50%;
    bottom: 35px;
    transform: translateX(-50%);
    z-index: 1;
    border-radius: 100%; }
  .pitch-home__penalty-arc {
    width: 50%;
    height: 120px;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
    overflow: hidden; }
    .pitch-home__penalty-arc:before {
      display: block;
      content: '';
      width: 100%;
      height: 100%;
      border-radius: 100%;
      transform: translateY(-75%);
      border: 2px solid #ddd; }
  .pitch-center-circle, .pitch-center-spot, .pitch-center-line {
    border-radius: 100%;
    position: absolute;
    z-index: 1;
    top: 80%;
    left: 50%;
    transform: translate(-50%, -50%); }
  .pitch-center-circle {
    width: 200px;
    height: 200px;
    border: 2px solid #ddd; }
  .pitch-center-spot {
    width: 8px;
    height: 8px;
    background-color: #ddd; }
  .pitch-center-line {
    width: 100%;
    height: 2px;
    border-radius: 0;
    background-color: #ddd; }