/**
 * Base css for Mobile tables
 */
.mobiletable {
  overflow:hidden;
}

.mobiletable.active {
  overflow-x: scroll;
  -webkit-overflow-scrolling: touch;
}

.mobiletable-wrapper {
  position:relative;
  z-index: 1;
  clear: both;
}

.mobiletable .touchable {
  display:none;
  visibility: hidden;
}

.mobiletable .touchable .icon {
  position:relative;
}

.mobiletable.active .touchable {
  display:block;
  visibility: visible;
  position:absolute;
  z-index: 2;
  right: 0;
  top:0;
  text-align:center;
  width:40px;
  background: linear-gradient(to right, rgba(255,255,255,0), white);
  background-image: -webkit-linear-gradient(left, rgba(255,255,255,0), white);
  background: -o-linear-gradient(left, rgba(255,255,255,0), white);
  background: -moz-linear-gradient(left, rgba(255,255,255,0), white);
}

.mobiletable.active .touchable .icon {
  width:38px;
  height:38px;
  background: url('swipe.svg') transparent no-repeat 0 0;
  background-size: 38px 38px;
  text-indent: -900px;
  overflow: hidden;
  right: 0;
}