/* Tablas */
.table{
   font-family: @baseFontFamily;
   font-weight: normal;
   color: @bg_type;
   font-size: 11px;
   font-weight: bold;
   border-bottom:1px solid lighten(@bg_type,80%);
   thead > tr{
      background-color:@color02;
      color:@color02_type;
      font-weight: normal;
      text-transform:uppercase;
      th{
         font-weight: normal;
         text-align: center;
         &.name,&.team,{
            text-align: left;
         }
         &.goals{
            //text-align: right;
         }
      }
   }
   tbody > tr {
      #gradient .vertical-three-colors(darken(@bg,10%), @bg, 20%, @bg);
      &.firstLine{
        td{
          height: 72px;
          font-size: 14px;
          >div{
            font-size: 14px;
          }
        }
        .name{
          .boxElements{
            width: 72px;
            .images{
              width: 60px;
              height: 60px;
            }
          }
          >div{
            &:last-child{
              left: 88px;
            }
          }
        }
        .goals{
          .badge{
            min-width: 40px;
            min-height: 40px;
            line-height: 34px;
          }
        }
      }
      &.withMedia{
        .name, .nombre{
          >div{
            &:last-child{
              left: 62px;
            }
            &.boxElements {
              div.images{
                background-size: cover;
                background-position: top center;
                background-repeat: no-repeat; 
              }
            }
          }
        }
        .nombre{
          width: 32%;
          .border{
            width: 75%;
            left: 50px;
          }
          div.boxElements {
              width: 35px;
          }
        }
      }
      td{
         text-align: center;
         padding: 0 1px;
         height: 45px;
         line-height: normal;
         vertical-align: middle;
         position: relative;
         >div{
          .verticalAlign(absolute);
          width: 100%;
         }
         &.pos{
            font-size: 24px;
            color: @bg_dest_type;
            line-height: 24px;
         }
         &.mark{
           position: relative;
           &:before{
             width: 15px;
             height: 15px;
             .border-radius(50%);
             content: " ";
             display: block;
             left: 0;
             top: 32%;
             position: absolute;
           }
           &.box1{
             &:before{
               background-color: @referenceColor05;
             }
           }
           &.box2{
             &:before{
               background-color: @referenceColor06;
             }
           }
           &.box3{
             &:before{
               background-color: @referenceColor07;
             }
           }
           &.box4{
             &:before{
               background-color: @referenceColor08;
             }
           }
           &.box5{
             &:before{
               background-color: @referenceColor09;
             }
           }
           &.box6{
             &:before{
               background-color: @referenceColor10;
             }
           }
           &.box7{
             &:before{
               background-color: @referenceColor11;
             }
           }
           &.team{
            padding-left: 20px;
           }
         }
         &.name,&.team, &.nombre{
            text-align: left;
            text-indent: 0;
            > div{
              &.boxElements{
                width: 50px;
              }
            }
         }
         &.team, &.nombre, &.name{
           .border{
             border-right: none;
           }
            }
         &.team{
            padding: 0 10px;
            width: 15%;
            >div{
              width: auto;
              &:last-child{
                left: 42px;
              }
            }
         }
         &.name{
            >div{
              width: auto;
            }
         }
         &.nombre{
          >div{
            &:last-child{
              width: 90%;
              .flex-display();
              span{
                &:nth-child(2){
                  .verticalAlign(absolute);
                  left: 36px;
                }
              }
              a{
                .verticalAlign(absolute);
                left: 36px;
                color: inherit;
                text-decoration: none;
                &:hover{
                  color: @bg_dest_type;
                }
                &.link-disabled:hover{
                  color: @bg_type;
                }
              }
            }
          }
         }
         .border{
            border-right: 1px solid @bg_dest_type;
            margin-top: 0px;
            position: relative;
            top: 0;
            -webkit-transform: translateY(0);
            -ms-transform: translateY(0);
            transform: translateY(0);
            a{
              color: inherit;
              text-decoration: none;
              &:hover{
                color: @bg_dest_type;
              }
            } 
         }
         &.goals{
            //text-align: right;
            text-align: center;
         }
         &.puntos.destacado, &.goals{
            .border{
              border-right: 0;
              &:after{
                position: absolute;
                right: 0;
                content: " ";
                display: block;
                width: 1px;
                height: 13px;
                background-color: @bg_dest_type;
                top: 50%;
                .translate(0,-50%);
              }
              .badge{
                  color: @color01_type;
                  margin:0 auto;
              }
            }
         }
          &.puntos.destacado, &.puntosanterior1{
            .border{
              &:before{
                position: absolute;
                left: 0;
                content: " ";
                display: block;
                width: 1px;
                height: 13px;
                background-color: @bg_dest_type;
                top: 50%;
                .translate(0,-50%);
              }
            }
          }
         .badge{
            background-color: @color01;
            line-height: 23px;
            text-align: center;
            width: 29px;
            height: 29px;
            .border-radius(50%);
            color:@color01_type;
            display: block;
            text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
            white-space: nowrap;
         }
         &:first-child{
           padding-left: 10px;
         }
      }
   }
}
.mark-position{
  .flex-display();
  .flex-wrap(@wrap: wrap);
  >div{
    padding: 0px 1%;
    position: relative;
    .flex-display();
    .align-items(@align: center);
    .flex(@columns: 1 1 50%);
    float: left;
    &:after, &:before{
      content: " ";
      display: block;
      position: absolute;
      width: 98%;
      height: 1px;
      left: 0;
      right: 0;
      margin: 0 auto;
    }
    &::before{
      background: darken(@bg, 20%);
      bottom: 1px;
    }
    &::after{
      background: @bg;
      bottom:0;
    }
    span{
      font-size: 11px;
      color: @bg_type;
      width: 90%;
      display: block;
      padding: 8px 0 8px 10px;
      &:first-child{
        .border-radius(50%);
        width: 15px;
        height: 15px;
        padding: 0;
        .box-shadow(0 0 5px darken(@bg, 20%));
        &.box1{
          background-color: @referenceColor05;
        }
        &.box2{
          background-color: @referenceColor06;
        }
        &.box3{
          background-color: @referenceColor07;
        }
        &.box4{
          background-color: @referenceColor08;
        }
        &.box5{
          background-color: @referenceColor09;
        }
        &.box6{
          background-color: @referenceColor10;
        }
        &.box7{
          background-color: @referenceColor11;
        }
      }
    }
  }
}
&.maxSize-991{
  .table{
    tbody > tr {
      td{
        &:first-child{
          width: 20%;
        }
        &.nombre{
          >div{
            &:last-child{
              span{
                &:nth-child(2){
                  width: 60%;
                }
              }
            }
          }
         }
      }
    }
  }
}
&.maxSize-767{
  .mark-position{
    > div{
      width: 100%;
      .flex(@columns: 1 1 100%);
    }
  }
  .boxElements {
    .images{
      margin: 0;
      width: 30px;
      height: 30px;
    }
  }
  .table{
    tbody > tr {
      td{
        &:first-child{
          width: 35%;
        }
      }
    }
  }
}
.maxSize-479{
  .table{
    thead{
      th{
        &:nth-child(2){
          text-indent: -999999px;
        }
      }
    }
    tbody > tr{
      td{
        &:first-child{
          width: 60%;
        }
        &.team{
          width: auto;
        }
        &.team, &.nombre, &.name{
          &:after{
            display: none;
          }
        }
        &.puntos.destacado, &.goals{
          .border{
            &:after, &:before{
              display: none;
            }
          }
        }
        &.nombre{
          .border{
            position: initial;
            .button-style{
              top: 11px;
              right: 5px;
            }
          }
        }
        &.name{
          .boxElements{
            width: 35px;
          }
        }
      }
      &.withMedia{
        .name, .nombre{
          >div{
            &:last-child{
              a{
                left: 80px;                
              }
            }
          }
        }
      }
    }
  }
}
.descenso{
  .table{
    tbody > tr {
      td{
        .badge{
          min-height: 29px;
          min-width: 29px;
          display: inline-block;
          width: auto;
          height: auto;
        }
        &:first-child, &:nth-child(2){
          width: auto;
        }
      }
    }
  }
}
.planteles{
  .table{
    tbody > tr {
      td{
        .badge{
          padding-left: 0;
          padding-right: 0;
        }
      }
    }
  }
}
.goleadores{
  .table{
    tbody > tr {
      td{
        &.team{
          width: auto;
          .flex-display();
          .align-items(center);
          > div{
            position: relative;
            top: 0;
            -webkit-transform: translateY(0);
            -ms-transform: translateY(0);
            transform: translateY(0%);
            float: left;
            &:last-child{
              padding-left: 10px;
              left: 0;
            }
          }
        }
      }
    }
  }
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .goleadores{
    .table{
      tbody > tr {
        td{
          &.team{
            margin-top: -1px;
          }
        }
      }
    }
  }
}
@supports (-ms-ime-align:auto) {
  .goleadores{
    .table{
      tbody > tr {
        td{
          &.team{
            margin-top: -1px;
          }
        }
      }
    }
  }
}
@-moz-document url-prefix() {
  .goleadores{
    .table{
      tbody > tr {
        td{
          &.team{
            margin-top: -1px;
          }
        }
      }
    }
  }
}

/* Fin Tablas */