@media screen and (max-width: $fat-mobile) {
  body {
    .auth .panel {
      border-radius: 0;
      box-sizing: border-box;
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      left: 0;
      margin: 0;
      label,
      input[type="text"],
      input[type="password"],
      input[type="tel"],
      input[type="email"] {
        clear: both;
        float: left !important;
      }
      input[type="submit"],
      a {
        clear: both;
      }
      p {
        clear: both;
      }
      input-password {
        input[type="password"] {
          width: 88%;
        }
        button {
          float: left;
        }
      }
    }

    .responsive-table {
      thead.slided + tbody {
        //cause display block slide
        display: block !important;
      }
    }
    //specific share table
    .share .responsive-table {
      table {
        thead {
          display: none;
        }
        tr {
          position: relative;
          margin: 20px;
          box-shadow: 0 1px 1px $medium-grey;
          border-top: 1px solid $light-grey;
        }
        td {
          width: inherit;
          padding: 10px 20px;
          .drop-line {
            display: none;
          }
        }
        td:first-child {
          max-width: none;
          box-sizing: border-box;
          font-size: 18px;
          padding: 20px;
          font-weight: bold;
          text-transform: none;
          border-top: none;
          &:before {
            display: none;
          }

          display: flex;
          align-items: center;
          justify-content: center;
        }
        td:last-child {
          display: none;
        }
        //datalabel
        td:before {
          text-transform: none;
          padding-bottom: 15px;
        }
        tr td.drop-line {
          position: absolute;
          width: 30px;
          height: 30px;
          padding: 0;
          border-radius: 50%;
          line-height: 30px;
          top: -10px;
          right: -10px;
          cursor: pointer;
          display: block;
          @include run-transition(all);
        }
        tr td.drop-line:hover {
          &:before {
            color: $white;
          }
        }
      }
    }

    //// ACCOUNT

    &.account {
      .user-infos .sheet {
        .four.cell {
          width: 100%;
          font-weight: bold;
          padding-top: 15px;
        }
        .seven.cell {
          width: calc(100% - 30px);
          font-weight: normal;
          font-style: normal;
          font-size: 12px;
          color: #555;
        }
        //mode view
        em.eight {
          width: calc(100% - 30px);
          font-weight: normal;
          font-style: normal;
          font-size: 12px;
          color: #555;
        }
        form .row {
          i::before {
            font-size: 18px;
          }
        }
      }
      .user-book {
        article .row {
          .two.cell {
            width: 100%;
            font-weight: bold;
            padding: 15px 0 0;
          }
          .nine.cell {
            width: calc(100% - 40px);
            font-weight: normal;
            font-style: normal;
            font-size: 12px;
            color: #555;
          }
          .one.cell {
            float: right;
            i::before {
              font-size: 18px;
            }
          }
        }
      }
    }

    ////
  }
}