/*Equipos*/
.statsCenterTeamTab{
   .selectTeam{
      width: 100%;
      min-height:50px;
      background-color: darken(@bg, 5%);
      box-shadow:0px 2px 11px -4px darken(@bg,40%) inset;
      display:block;
      border-bottom: 1px solid @color01;
      span{
         font-weight: bold;
         padding: 0 0 0 40px;
         float: left;
         display: block;
         color: @bg_type;
         line-height: 50px;  
      }
      div{
         float: right;
         width: 30px;
         height: 30px;
         background: @color01;
         margin: 10px 30px 10px 0;
         display: block;
         position: relative;
         cursor: pointer;
         &:after{
            width: 0px;
            height: 0px;
            border-style: solid;
            border-width: 8px 6px 0 6px;
            border-color: @color02 transparent transparent transparent;
            position: absolute;
            top: 12px;
            left: 0;
            right: 0;
            margin: 0 auto;
            content: '';
         }
      }
   }
   .planteles{
      .nav{
         border-bottom: 1px solid @color01;
      }
   }
   .itemsRanking{
      &:after{
         width: 0;
         background: transparent;
      }
      &.home{
         .G_barsRanking{
            .barraIn{
               .G_bars(@homeColor);
            }
         }
      }
   }
   .blockTeam{
      &.itemsRanking{
         margin: 0;
      }
      .subHeader{
         text-align: left;
         padding-left: 20px;
      }
      .row{
         padding:8px 10px;
         min-height: 55px;
         cursor: auto;
         #gradient .vertical-three-colors(darken(@bg,10%), @bg, 20%, @bg);
         .teamLogo {
            background-color:@bg;
            border-radius: 50%;
            box-shadow: 0 0 5px 0 darken(@bg, 30%);
            display: block;
            height: 35px;
            line-height: 35px;
            width: 35px;
            position: relative;
            float: left;
            margin-right: 10px;
            img{
               margin: 6px auto;
            }
         }
         .badge{
            padding-left: 7px;
            padding-right: 7px;
            background-color:@color01;
            margin-right: 10px;
            line-height: 23px;
            text-align: center;
            min-width: 28px;
            border-radius: 15px;
            color: @color01_type;
            display: inline-block;
            text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
            vertical-align: baseline;
            white-space: nowrap;
            min-height: 29px;
            float: left;
         }
         .name{
            padding:0 5% 0 0;
            display: block;
            float: left;
            line-height: 35px;
            color: @bg_type;
            font-size: 10px;
            text-transform: uppercase;
            font-weight: bold;
            width: 16%;
         }
         .G_ranking{
            width: 40%;
            padding: 12px 5% 0 0;
            height: auto;
            margin: 0;
            .G_barsRanking{
               div{
                  height: 100%;
                  float: left;
                  background: @color01;
               }
               .second{
                  background: @color02;
               }
               .third{
                  background: lighten(@color02, 60%)
               }
               .fourth{
                  background: lighten(@color02, 80%)
               }
               .fifth{
                  background: lighten(@color02, 40%)
               }
            }
            .num{
               float: right;
               line-height: 16px;
               font-size: 18px;
               small{
                  font-size: 14px;
               }
            }
         }
         .dataContent{
            float: left;
            width: 37%;
            margin:15px 0 0 0;
            .box{
               float: left;
               width: 100%;
               .num{
                  width: 20px;
                  height:14px;
                  display: block;
                  float: left;
                  font-size: 10px;
                  color:@color01_type;
                  border-radius: 4px;
                  text-align: center;
                  margin-right: 4px;
                  background: @color01;
                  text-transform: uppercase;
                  &.second{
                     background: @color02;
                  }
                  &.third{
                     background: lighten(@color02, 60%)
                  }
                  &.fourth{
                     background: lighten(@color02, 80%)
                  }
                  &.fifth{
                     background: lighten(@color02, 40%)
                  }
               }
               .text{
                  text-transform: uppercase;
                  color: @bg_type;
                  font-size: 10px;
                  font-weight: bold;
               }
               .initial{
                  display: none;
                  text-transform: uppercase;
                  color: @bg_type;
                  font-size: 10px;
                  font-weight: bold;
               }
            }
         }
      }
      .graphical, .data{
         .table {
            border: 0;
            thead > tr th{
               text-align: left;
               padding: 0;
               vertical-align: middle;
               width: 10%;
               .minutes{
                  width: 100%;
                  background: @color01;
                  padding: 2px 0 8px;
                  position: relative;
                  margin: 0 auto;
                  border-right: 1px solid @bg;
                  .num{
                     display: block;
                     text-align: center;
                  }
                  .down{
                     width: 0; 
                     height: 0; 
                     border-left: 5px solid transparent;
                     border-right: 5px solid transparent;                             
                     border-top: 5px solid @bg;
                     position: absolute;
                     left: -10px;
                     right: 0;
                     margin: 0 auto;
                     cursor: pointer;
                  }
                  .up{
                     width: 0; 
                     height: 0; 
                     border-left: 5px solid transparent;
                     border-right: 5px solid transparent;
                     border-bottom: 5px solid @bg;
                     position: absolute;
                     right: -10px;
                     left: 0;
                     margin: 0 auto;
                     cursor: pointer;
                  }
                  &.second{
                     background: @color02;
                  }
                  &.third{
                     background: lighten(@color02, 60%);
                  }
                  &.fourth{
                     background: lighten(@color02, 80%);
                  }
                  &.fifth{
                     background: lighten(@color02, 40%);
                  }
                  &.sixth{
                     background: darken(@color01, 30%);
                     border-right: 0;
                  }
               }
               &.team{
                  padding: 0 0 0 20px;
                  width: 40%;
               }
            }
            tbody {
               > tr {
                  td{
                     text-align: left;
                     padding:8px;
                     .point{
                        background: @color01;
                        width: 25px;
                        border-radius: 50%;
                        display: block;
                        height: 25px;
                        margin: 12px auto 0;
                        &.second{
                           background: @color02;
                        }
                        &.third{
                           background: lighten(@color02, 60%);
                        }
                        &.fourth{
                           background: lighten(@color02, 80%);
                        }
                        &.fifth{
                           background: lighten(@color02, 40%);
                        }
                        &.sixth{
                           background: darken(@color01, 30%);
                        }
                     }
                     &.number{
                        text-align: center;
                        font-size: 10px;
                        color: @bg_type;
                        span{
                           display: block;
                           margin-top: 6px;
                           border-right: 1px solid @color01;
                        }
                     }
                     &:last-child{
                        &.number{
                           span{
                              border-right: 0;
                           }
                        }
                     }
                     .name{
                        width: auto;
                     }
                  }
               }
            }
         }
      }
      &.twoData{
         .row{
            .dataContent{
               .box{
                  width: 50%;
               }
            }
         }
      }
      &.threeData{
         .row{
            .dataContent{
               .box{
                  width: 33%;
               }
            }
         }
      }
      &.fourData{
         .row{
            .G_ranking{
               width: 30%;
               .G_barsRanking{
                  width: 74%;
               }
            }
            .dataContent{
               width: 45%;
               .box{
                  width: 25%;
               }
            }
         }
      }
      &.fiveData{
         .row{
            .G_ranking{
               width: 30%;
               .G_barsRanking{
                  width: 74%;
               }
            }
            .dataContent{
               width: 45%;
               .box{
                  width: 20%;
               }
            }
         }
      }
   }
   .dataTeam{
      padding: 20px 0;
      position: relative;
      .info{
         padding: 30px 0;
         table{
            width: 60%;
            margin: 0 auto;
            tr{
               border-bottom: 1px solid lighten(@color02,85%);
               &:last-child{
                  border-bottom: 0;
               }
               td{
                  &:first-child{
                     width: 40%;
                  }
                  vertical-align: top;
                  width: 60%;
                  color:@bg_type;
                  font-size: 11px;
                  text-transform: uppercase;
                  padding: 0;
                  line-height: 18px;
                  strong{
                     font-weight: bold;
                     color:@bg_type;
                  }
               }
            }
         }
         &.colRight{
            float: right;
         }
      }
      .middle{
         position: absolute;
         left: 0;
         right: 0;
         margin: 0 auto;
         .circle{
            float: none;
            margin: 0 auto;
            height: 50px;
            width: 50px;
            line-height: 50px;
            img{
               width: 35px;
            }
         }
         span{
            display: block;
            font-size: 14px;
            font-weight: bold;
            color: @bg_type;
            text-transform: uppercase;
            text-align: center;
            margin: 20px 0 10px;
         }
         .change{
            background: @color01;
            color: @color01_type;
            min-height: 30px;
            width: 100px;
            line-height: 30px;
            text-transform: uppercase;
            text-align: center;
            font-size: 12px;
            font-weight: bold;
            margin:0 auto;
            cursor: pointer;
         }
      }
   }
   .posiciones{
      .table{
         border-bottom: 0;
         margin-bottom: 0;
      }
   }
   .fixture{
      .fase{
         max-height: 300px;
         overflow-y: auto;
      }
   }
   .blockGames{
      position:relative;
      .colLeft{
         text-align: center;
         padding: 90px 0;
         span{
            font-size: 20px;
            text-transform: uppercase;
            color: @bg_type;
            &.number{
               color: @bg_dest_type;
               font-size: 24px;
               font-family: @type_Special;
               padding-left: 10px;
            }
         }
      }
      .colRight{
         position:relative;
         padding: 50px 0;
         &:after{
            .G_divider;         
         }
         .total{
            margin: 0 auto;
            position: relative;
            height: 180px;
            canvas{
               position: absolute;
               left: 0;
               right: 0;
               margin: 0 auto;
            }
            .numberCharts{
               position: absolute;
               top: 37px;
               left: 0;
               right: 0;
               text-align: center;
               margin: 0 auto;
               font-size: 24px;
               color: @bg_type;
            }
            .tp-arc-top{
               top: 128px;
               .tooltip{
                  float: none;
               }
            }
         }
         .blockCircles{
            margin-top: 35px;
            text-align: center;
            .circle{
               float: none;
               display: inline-block;
               margin: 0;
               &.blue{
                  margin-right: 26px;
               }
               &.gray{
                  margin-left: 25px;
               }
            }
         }
         .tp-arc-top{
            top: 10px;
            width: 100%;
            position: relative;
            text-align: center;
            .tooltip{
               position:relative;
               min-width: 55px;
               margin-right: 4px;
               display: inline-block;
               &:last-child{
                  margin-right: 0;
               }
               .tooltip-inner{
                  min-height: 22px;
                  font-size: 9px;
                  padding: 0 3px;
                  text-align: center;
                  line-height: 22px;
                  border-radius: 0;
               }
            }
         }
      }
   }
   .blockEvolutionGames{
      &:after{
         .G_divider;         
      }
   }
   .cols{
      .lessGoals, .average, .moreGoals{
         height: 150px;
         text-align: center;
         .content{
            padding: 40px 0;
            .circle{
               float: none;
               display: inline-block;
               line-height: 28px;
            }
            span{
               &.icon{
                  border-left: 1px dotted lighten(@color02, 10%);
                  margin-right: 10px;
               }
               &.name{
                  color: @bg_type;
                  font-size: 12px;
                  text-transform: uppercase;
                  font-weight: bold;
               }
               &.number{
                  color: @bg_dest_type;
                  font-size: 20px;
                  font-weight: bold;
               }
            }
         }
      }
      .average, .moreGoals{
         .content{
            &:after{
               .G_divider;
               height: 70%;
               top: 26%;
            }  
         }
      }
   }
   .barComparing{
      background-color:@color02;
      #gradient .vertical-three-colors(darken(@bg,10%), @bg, 20%, @bg);
      min-height: 85px;
      position: relative;
      margin-bottom: 10px;
      .comparing{
         clear:both;
         height:50px;
         .num{
            height: 60px;
            font:20px @type_Special;
            font-weight:bold;
            text-align:center;
            line-height: 60px;
            float:left;
            width:5%;
            color:@bg_dest_type;
         }
         .num1{
            margin-right:0%;
            z-index:3;
            position:relative;
         }
         .num2{
            margin-left:0%;
            z-index:3;
            position:relative;
         }
         .bar{
            margin-top: 25px;
            width:85%;
            .G_comparisonBars;
            float: left;
            .homeBar {
               background: @color01;
            }
            .awayBar {
               background:@color02;
            }
         }
         .center{
            content:"";
            width:0;
            height:12px;
            position:absolute;
            border-left: 1px dotted lighten(@color02, 10%);
         }
      }
      .teamGoals{
         position: absolute;
         bottom: 0;
         .circle{
            line-height: 30px;
         }
         .tooltip{
            position:relative;
            min-width: 55px;
            float: left;
            margin: 0 4px 0 0;
            padding: 4px;
            &:last-child{
               margin-right: 0;
            }
            .tooltip-inner{
               min-height: 22px;
               font-size: 12px;
               padding: 0 10px;
               text-align: center;
               line-height: 22px;
               border-radius: 0;
               text-transform: uppercase;
            }
         }
         .number{
            color: @bg_dest_type;
            font-size: 25px;
            font-weight: bold;
         }
      }
   }
   .goalPerMinute{
      img{
         margin:0 auto;
      }
   }
   .typeGoals{
      .total{
         margin:100px auto;
         position: relative;
         height: 100px;
         canvas{
            position: absolute;
            left: 0;
            right: 0;
            margin: 0 auto !important;
         }
         .circle{
            position: absolute;
            top: 37px;
            left: 0;
            right: 0;
            text-align: center;
            margin: 0 auto;
            background-repeat: no-repeat;
            background-position: center center;
         }
      }
      .data{
         padding: 60px 0 0;
         .block{
            width: 100%;
            clear: both;
            height: 40px;
            .circle{
               background: @color01;
               color:@color01_type;
               &.second{
                  background: @color02;
               }
               &.third{
                  background: lighten(@color02, 60%)
               }
               &.fourth{
                  background: lighten(@color02, 80%)
               }
               &.fifth{
                  background: lighten(@color02, 40%)
               }
            }
            .tooltip{
               margin-top: 6px;
               margin-left: 40px;
               .tooltip-inner {
                  min-height: 22px;
                  font-size: 12px;
                  padding: 0 10px;
                  text-align: center;
                  line-height: 22px;
                  border-radius: 0;
                  text-transform: uppercase;
               }
            }
         }
      }
      &:after{
         .G_divider;
         top: 15%;
      }
   }
   &.maxSize-991{
      .blockTeam{
         &.fiveData, &.fourData{
            .row{
               .name{
                  width: auto;
                  line-height: 12px;
                  margin: 0;
               }
               .G_ranking{
                  width: 90%;
                  padding: 0;
                  .G_barsRanking{
                     width: 90%;
                  }
               }
               .dataContent{
                  width: 85%;
                  margin: 0;
               }
            }
         }
         .row{
            .G_ranking{
               .G_barsRanking{
                  width: 70%;
               }
            }
         }
      }
   }
   &.maxSize-767{
      .blockTop3{
         .itemsRanking{
            .box{
               width: 48%;
               margin: 0 2% 2% 0;
            }
         }
      }
      .blockTeam{
         .row{
            .name{
               width: auto;
               line-height: 12px;
               margin: 0;
               padding: 0;
            }
            .G_ranking{
               width: 85%;
               padding: 0;
               .G_barsRanking{
                  width: 85%;
               }
            }
            .dataContent{
               width: 85%;
               margin: 0;
            }
         }
         .graphical, .data{
            .row{
               .name{
                  line-height: 35px;
               }
            }
         }
         &.fiveData,&.fourData{
            .row{
               .G_ranking{
                  width: 85%;
                  .G_barsRanking{
                     width: 85%;
                  }
               }
               .dataContent{
                  width: 90%;
                  .box{
                     .text {
                        display: none;
                     }
                     .initial{
                        display: block;
                     } 
                  }
                  &.explain{
                     width: 100%;
                     .box{
                        width: 50%;
                        margin: 3px 0;
                        .text{
                           display: block;
                        }
                     }
                  }
               }
            }
         }
      }
      .dataTeam{
         padding: 20px 0;
         .info{
            padding: 0;
            float: right;
            margin-bottom: 20px;
            &:last-child{
               margin-bottom: 0;
            }
            table{
               width: 90%;
            }
         }
         .middle{
            float: left;
            position: relative;
            position: relative;
            left: inherit;
            &:after{
               .G_divider;     
               right:-1px;
               left: inherit;
               height:140%; 
               top: 0;      
            }
         }
      }
      .typeGoals{
         .data{
            .block{
               .tooltip{
                  .tooltip-inner {
                     font-size: 9px;
                     padding: 0 2px;
                  }
               }
            }
         }
      }
   }
   &.maxSize-479{
      .navbar-header{
         height: 37px;
      }
      .selectTeam{
         span{
            padding: 0 0 0 10px;
         }
      }
      .blockTop3{
         .itemsRanking{
            .box{
               width: 100%;
               margin: 0 0 2% 0;
            }
         }
      }
      .blockTeam{
         .row{
            min-height: 65px;
            padding: 8px 5px;
            .name{
               width:auto;
            }
            .G_ranking{
               width: 79%;
               .G_barsRanking{
                  width: 70%;
               }
            }
            .dataContent{
               width: 77%;
               .box{
                  .text {
                     display: none;
                  }
                  .initial{
                     display: block;
                  } 
               }
               &.explain{
                  width: 100%;
                  .box{
                     width: 50%;
                     margin-top: 6px;
                     .text{
                        display: block;
                     }
                     &.extensive{
                        width: 100%;
                     }
                  }
               }
            }
         }
         .graphical, .data{
            thead > tr th{
               width: 10%;
               &.team{
                  padding: 0 0 0 8px;
                  width: 10%;
               }
            }
            .row{
               .name{
                  display: none;
               }
            }
         }
         &.fiveData, &.fourData{
            .row{
               .G_ranking{
                  width: 77%;
                  .G_barsRanking{
                     width: 70%;
                  }
               }
               .dataContent{
                  width: 77%;
               }
            }
         }
      }
      .dataTeam{
         .contentColumns{
            overflow-x: scroll;
         }
         .info{
            float: none;
            &.colRight{
               position: absolute;
               margin-left: 440px;
               top: 0;
            }
         }
         .middle{
            float:none;
            margin-bottom: 30px;
            &:after{
               width: 0;
            }
         }
      }
      .blockGames{
         .colLeft{
            padding: 10px 0;
            &:after{
               .G_divider;
               height: 3px;
               width: 60%;
               left: 0;
               right: 0;
               margin:0 auto;
               top: 100%;
            }
         }
         .colRight{
            padding: 10px 0;
         }
      }
      .cols{
         .lessGoals, .average, .moreGoals{
            height: 100px;
            .content{
               padding: 20px 0 0;
            }
         }
      }
      .barComparing{
         .comparing{
            .num{
               width:4.9%;
            }
         }
      }
      .fixture{
         .fecha{
            .match, .detalles{
               .link{
                   height: 80px;
                   margin-top: -40px;
                   a, a span{
                        height: 100%;
                        line-height: 80px;
                   }
               }
            }
         }
      }
   }
}
/*Fin Equipos */