/* Planteles */
.planteles{
   .nav-pills{
      padding: 5px;
      background-color:@bg;
      >li{
         cursor: pointer;
         &.active >a,&.active >a:hover,&.active >a:focus, {
            background-color:transparent;
         }
         a{
            padding: 5px;
            &:hover{
               background: none;
               .teamLogo{
                  border: 3px solid @color02;
               }
            }
         }
         &.active{
            .teamLogo{
               border: 3px solid @color02;
            }
         }
      }
   }
   .show .teamLogo{
      border: 3px solid @color02;
   }
   .teamLogo{
      background-color: #FFFFFF;
      border: 3px solid transparent;
      border-radius: 50%;
      box-shadow: 0 0 5px 0 darken(@bg, 30%);
      display: inline-block;
      height: 40px;
      line-height: 40px;
      position: relative;
      text-align: center;
      width: 40px;
      img{
         margin: 5px auto;
             vertical-align:top;
      }
   }
   .head{
      width: 100%;
      .title{
         width: 100%;
         text-align: center;
         font-size: 14px;
         text-transform: uppercase;
         background-color: @color01;
         color: @color01_type;
         font-weight: normal;
         height: 20px;
         line-height: 20px;
         display: block;
      }
      .country{
         #gradient .vertical(mix(@color01,@bg,15%),@bg);
         text-align: center;
         width: 100%;
         height: 60px;
         line-height: 30px;
         padding: 10px 0;
         display: block;

      }
      .name{
         color:@bg_type;
         font-size: 14px;
         text-transform: uppercase;
      }
   }
   .table{
      float: none;

      th{
         font-size: 11px;    
         background-color:@color02;
         color:@color02_type;
         font-weight: normal;
         text-transform:uppercase;
         text-align: center;
         &.jugador{
            text-align: left;
         }
      }



      tbody > tr{
         td{
            &.nombre{
               text-align: left;
               padding: 2px 0;
            }
         }
         &.cabezal{
            background-color:@color02;
            color:@color02_type;
            th{
               &.ocultar{
                  display: none; 
               }

            }
         }

      }
   }
   div.table-wrapper div.scrollable table.responsive th.ocultar {
      display: block;
      width: 232%;
   }
   .button-style{display:none;}
}
.maxSize-479{
   
   .table tbody > tr td .border{
      border-right: none !important;
      position:relative
   }
   .button-style{
      display:block !important;
      position:absolute;
      right:0;
      top:0;
      box-shadow:0px -1px 6px 0px darken(@color01,30%) inset;
      background:@color01;
      width: 27px;
      height: 25px;
      padding: 0 8px !important;
      vertical-align: middle !important;
      cursor: pointer;
      color: @color01_type;
      text-align: center;
      font-size: 18px !important;
      line-height: 23px !important;
      &.active{
         background:@color01_h;
         color: @color01_h_type;
         box-shadow:0px -1px 6px 0px darken(@color01_h,30%) inset;
      }

   }
   .content-style{
      background:darken(@bg,10%);
      padding:12px 0 !important;
      margin-top: 3px !important;
      box-shadow:0px -1px 6px 0px darken(@bg,20%) inset;
      width: 100%;
      -webkit-transition: all 1s ease-in-out;
      -moz-transition: all 1s ease-in-out;
      -ms-transition: all 1s ease-in-out;
      -o-transition: all 1s ease-in-out;
      transition: all 1s ease-in-out;
   }
   .content-style ul{
      margin:0 0 0 5%;
      width:90%;
   }
   .content-style li{
      border-bottom: 1px solid darken(@bg,20%);
      line-height: 24px;
      border-top: 1px solid @bg;
   }
   .content-style li:first-child{
      border-top: none;
   }
   .content-style li:last-child{
      border-bottom: none;
   }


}

/* Fin Planteles */