@ellipsis-height: 124px;

.ellipsis {
  overflow: hidden;
  height: @ellipsis-height;
  line-height: 18px;
  margin: 0 0 .5em;
}

.ellipsis:before {
  content:"";
  float: left;
  width: 5px;
  height: @ellipsis-height;
}

.ellipsis > *:first-child {
  float: right;
  width: 100%;
  margin-left: -5px;
}

.ellipsis:after {
  content: "\02026";
  box-sizing: content-box;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  float: right;
  position: relative;
  top: -17px;
  left: 100%;
  width: 3em;
  margin-left: -3em;
  padding-right: 5px;
  text-align: right;
  background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(#efefef), color-stop(50%, #efefef));
  background: -moz-linear-gradient(to right, rgba(255, 255, 255, 0), #efefef 50%, #efefef);
  background: -o-linear-gradient(to right, rgba(255, 255, 255, 0), #efefef 50%, #efefef);
  background: -ms-linear-gradient(to right, rgba(255, 255, 255, 0), #efefef 50%, #efefef);
  background: linear-gradient(to right, rgba(255, 255, 255, 0), #efefef 50%, #efefef);
}