.dt {
  /*data table*/

  & > table {
    & .tdWithAvatar {
      & label {
        margin-left: 34px;
        max-width: calc(100% - 34px);
      }
      & span {
        margin-left: 34px;
        max-width: calc(100% - 34px);
      }

      & .avatarOnTD {
        position: absolute;
        top: 2px;
        left: 4px; //forze para alinearlo :(
        height: 30px;
        width: 30px;

        cursor: pointer;
        margin-right: 0px !important;
        border-radius: 50%;
        //background-image:  url('../../../../public/server/storage/beestock/entities/accounts/12/avatar/lowlowlowCompression/avatar.png') !important;

        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        //background-color: $cs-blue;
        //border: 2px solid $c-surface;
        z-index: 2;
        @include selectNo();
        
        & letter {
          position: relative;
          display: inline-block;
          top: 7px;
          left: 0px;
          height: 30px;
          width: 30px;
          @include clearfix;

          color: #000000c5 !important; /* kelvin */
          font-size: 13px;
          font-weight: 400;
          text-align: center;
          //text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);

          //border: 0.5px solid red;           //←←←←←←←←←←←←←←←←←←←←
        }
      }
    } /*tdWithAvatar*/

    & .tdWithIcon {
      & label {
        margin-left: 24px;
        max-width: calc(100% - 24px);
      }
      & span {
        margin-left: 24px;
        max-width: calc(100% - 24px);
      }
      & svg {
        position: absolute;
        top: 2px;
        left: 4px; //forze para alinearlo :(
        height: 18px;
        width: 18px;

        fill: $c-w;
        transform: rotate(0deg);
        @include transition(0.5s, stan); 
        @include selectNo;
        @include back-visivility;
        @include selectNo();

        // border: 0.5px solid red;           //←←←←←←←←←←←←←←←←←←←←
      }
      //border: 0.3px solid red;               //←←←←←←←←←←←←←←←←←←←←
    } /**/

    & .tdWithIconAnimated {
      & svg {
        @include loading();
      }
    }

    & .td-red-icon {
      & svg {
        fill: $cs-red;
      }
    } /*tdWithAvatar*/

    & .td-blue-icon {
      & svg {
        fill: $cs-blue;
      }
    } /*tdWithAvatar*/
  } /*table*/
} /*dt*/
