/* Planteles */
.planteles{
   &.plantel-social .table.table-condensed.responsive{
      display: none;
   }
   &.plantel-social{
      head{
         .title{
            font-size: 16px;
            height: 35px;
            line-height: 35px;
         }
         .country{
            height: 80px;
            .teamLogo{
               width: 60px;
               height: 60px;
               float: left;
               margin: 0 20px;
               img{
                  margin: 14px auto;
               }
            }
         }
         .name{
            font-size: 28px;
            float: left;
            padding-top: 16px;
         }
      }
   }
   .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, &.pais {
            text-align: left;
         }
      }



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

            }
         }

      }
   }
   .html-card{
      .twitter-timeline-content{
         height: 225px;
         overflow: auto;
      }
      .flex-display();
      .flex-direction();
      .flex-wrap(wrap);
      .justify-content(center);
      border-top:1px solid @color02;
      padding: 20px;
      &-item{
         width: 25%;
         margin-bottom:5px;
         padding: 5px;
         &-container{
            border:1px solid @color02;
            padding: 10px;
         }
         &-top{
            .clearfixStyles();
            &-firstPlayer{
               .boxStuff{
                  width: 65px;
                  height: 65px;
                  margin: 0px auto;
                  svg{
                     height: 100%;
                     left: 4px;
                     width: 100%;
                  }
               }
            }
            &-data{
               /*padding: 10px 0 0;*/
               >div{
                  .clearfixStyles();
                  .badge{
                     background-color: @color01;
                     line-height: 23px;
                     text-align: center;
                     width: 29px;
                     height: 29px;
                     .border-radius(50%);
                     color:@color01_type;
                     text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
                     white-space: nowrap;
                     margin: 6px 0 0 10px;
                  }
                  .boxStuff{
                     display: none;
                  }
                  &.info{
                     padding-top: 6px;
                     >div{
                        color: @bg_type;
                        font-size: 13px;
                        font-weight: bold;
                        float: none;
                        &:nth-child(2){
                           font-weight: bold;
                        }
                     }
                  }
                  >div{
                     float: left;
                  }
               }
            }
         }
         &-nav{
            .clearfixStyles();
     /*       border-bottom:1px solid lighten(@bg_type,80%);
            border-top:1px solid lighten(@bg_type,80%);*/
            padding: 5px 0;
            ul{
               li{
                  display: block;
                  padding-right: 5px;
                  &:last-child{
                     padding-right: 0;
                     padding-left:5px;
                  }
                  a{
                     font-family: @baseFontFamily;
                     height: 25px;
                     line-height: 25px;
                     color:@bg_type;
                     text-shadow:none;
                     padding:0px;
                     cursor: pointer;
                     display: block;
                     text-decoration: none;
                     text-transform: uppercase;
                     transition:all 0.5s ease;
                     font-size: 11px;
                     font-weight: bold;
                     margin-bottom: 0;
                     text-align: center;
                     white-space: nowrap;
                     vertical-align: middle;
                     .border-radius(4px);
                     &:focus, &:hover, &:active{
                        background-color: @color01;
                        color: @color01_type;
                        outline: 0;
                        border-bottom: 3px solid darken(@color01, 20%);
                     }
                  }
                  &.active{
                     a{
                        background-image:none;
                        background-color: @color01;
                        color: @color01_type;
                        border-bottom: 3px solid darken(@color01, 20%);
                        &:focus, &:hover, &:active{
                           background-color: lighten(@color01, 5%);
                           outline: 0;
                        }
                     }
                  }
               }
            }
         }
         &-content{
            .clearfixStyles();
            >div{
               padding: 30px 5px 0 0;
               min-height: 230px;
               .clearfixStyles();
               &:last-child{
                  padding: 5px 0 0 5px;
                  ul{
                     border-bottom:1px solid lighten(@bg_type,80%);
                     text-align: center;
                     li{
                        display: inline-block;
                        a{
                           i{
                              background: url('../images/social-icons.png') no-repeat 0 0;
                              width: 35px;
                              background-size: 180px;
                              display: block;
                              height: 35px;
                              &.insta{
                                 background-position: -73px 0;
                              }
                              &.fb{
                                 background-position: 0 0;
                              }
                              &.gog{
                                 background-position: -145px 0;
                              }
                           }
                        }
                     }
                  }
               }
            }
            p, span{
               font-family: @type_Special;
               font-size: 14px;
               color:@bg_type;
            }
            p{
               font-weight: bold;
               text-transform: uppercase;
            }
            span{
               margin-bottom: 15px;
               display: block;
            }
         }
      }
   }
   div.table-wrapper div.scrollable table.responsive th.ocultar {
      display: block;
      width: 232%;
   }
   .button-style{display:none;}
   &.maxSize-991{
      .html-card{
         &-item{
            width: 33.33%;
         }
      }
   }
   &.maxSize-767{
      .table{
         tbody > tr{
            td{
               &.nombre{
                  width: 40%;
                  .border{
                     width: 66%;
                  }
               }
               &:nth-child(2){
                  width: 20%;
               }
            }
         }
      }
      .html-card{
         padding:0;
         display: block;
         &-item{
            width: 100%;
            padding: 0;
            margin:0;
            &-container{
               border:none;
               border-bottom:1px solid @color02;
            }
            &-top{
               &-firstPlayer{
                  >div{
                     &:first-child{
                        display: none;
                     }
                  }
               }
               &-data{
                  width: 100%;
                  padding:0;
                  .teamLogo{
                     display: none;
                  }
                  >div{
                     float: left;
                     padding-right: 10px;
                     .boxStuff{
                        display: block;
                        width: 29px;
                        height: 29px;
                        margin: 0;
                     }
                     .badge{
                        margin: 0 10px 0 0;
                     }
                     &.info{
                        padding-top: 0;
                     }
                  }
               }
               .button-style{
                  display: block;
               }
            }
            &-nav{
               display: none;
            }
            &-content{
               display: none;
               border-top:1px solid lighten(@bg_type,80%);
               margin-top: 10px;
               >div{
                  &:first-child{
                     border-bottom:1px solid lighten(@bg_type,80%);
                  }
                  &:last-child {
                     display: block !important;
                     visibility: visible !important;
                  }
               }
            }
         }
      }
      .head {
         .country {
            height: 70px;
            .flex-display();
            .flex-direction();
            .flex-wrap(wrap);
            .justify-content(center);
            .teamLogo,.name{
               float:none;
            }
            .teamLogo{
               width: 50px;
               height: 50px;
               img {
                  margin: 10px auto;
               }
            }
            .name{
               padding-top: 10px;
            }
         }
      }
   }
   &.maxSize-479{
      .table{
         tbody > tr{
            td{
               &.nombre{
                  padding-right: 10px;
                  >div{
                     top: 0;
                     -webkit-transform:initial;
                     -ms-transform: initial;
                     transform: initial;
                     position: initial;
                     display: block;
                     vertical-align: middle;
                  }
                  .border{
                     width: auto;
                     span, a{
                        display: inline-block;
                        &:nth-child(2){
                           width: auto;
                           padding-left: 10px;
                           top: 0;
                           position: initial;
                           -webkit-transform: translateY(0%);
                           -ms-transform: translateY(0%);
                           transform: translateY(0%);
                        }
                     }
                  }
               }
            }
         }
      }
   }
}
.maxSize-479{

   .planteles{
      .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: 10px !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 */