.tabpill{
  padding-left:0;
  padding-right:0;
}
.tabpill-inner i::before {
  color: #FF5900;
}

.tabpill-menu{
  display:grid;
  grid-gap:1em;
  width:81.3%;
  margin:0 auto;
}
.tabpill-item{
  display:flex;
  justify-content:center;
  align-items:center;
  display:inline-block;
  height:90px;
  overflow: hidden;
  border-radius: var(--rounded-xl);
}


}

.tabpill-item:hover{
box-shadow:0 3px 10px 0 rgba(0,0,0,.2), 0 1px 3px 0 rgba(0,0,0,.1);
      transition: box-shadow .1s ease-out;
}

.tabpill-inner{
  padding:18px 32px 18px 16px;
  background-color:var(--color-gris-fondo);
  display:flex;
  align-items:center;
  justify-content:flex-start;
  flex-wrap:nowrap;
  height:100%;
  
}

.tabpill-inner:hover{
  background-color:var(--color-primario);;
}

.tabpill-inner:hover h3{
  color:white;
  
  
}

.tabpill-inner:hover .tabpill-label{
  transform:translateX(4px);
  transition:.2s transform linear;
}

.tabpill-inner:hover .tabpill-icon, .tabpill-inner:hover .flecha{
      filter: brightness(0) invert(1);
}

.tabpill-icon{
  max-width:45px;
   font-size: 28px;  
  
}


h3.tabpill-label{
  font-size:1rem;
  display:inline-flex;
  color:var(--color-tipografia);
  margin-bottom:0;
  margin-top:0;
  padding-left:1rem;
  width: 100%;
  transform:translateX(0px);
  transition:.2s transform linear;
}

.tabpill-inner .flecha{
  justify-self:flex-end;
  color:var(--color-primario);
}

@media screen and (max-width:1025px){
  .tabpill-menu{
    width:100%;
    padding-left:15px;
    padding-right:15px;
  }
  h3.tabpill-label{
  font-size:1rem;
   }
}
