.l-timeline-gantt {
    min-width: 2px;
    overflow: hidden;
	position: absolute;
	top: $timelineSwimlaneGanttVM; bottom: $timelineSwimlaneGanttVM;

	.bar {
		@include ellipsize();
		height: $activityBarH;
		line-height: $activityBarH;
		padding: 0 $interiorMargin;

		span {
            $iconW: 20px;
            @include absPosDefault();
            display: block;
			&.s-activity-type {
                right: auto; width: $iconW;
                text-align: center;
				&.timeline {
					&:before {
						content:"S";
					}
				}
				&.activity {
					&:before {
						content:"A";
					}
				}
			}
			&.s-title {
                overflow: hidden;
                text-overflow: ellipsis;
                left: $iconW;
			}
			&.duration {
				left: auto;
				opacity: 0.75;
				right: 0;
				text-align: right;
				width: 60px;
			}
			&.handle {
				top: 0;
				bottom: 0;
				height: auto;
				width: 15px;
				&.left {
					right: auto;
				}
				&.middle {
					right: 15px;
					left: 15px;
					width: auto;
				}
				&.right {
					right: 0;
					left: auto;
				}
			}
		}
	}
    &.sm .bar span {
        // Hide icon and label if width is too small
        display: none;
    }
}

.edit-mode .s-timeline-gantt,
.s-status-editing .s-timeline-gantt {
	.handle {
		cursor: col-resize;
		&.mid {
			cursor: ew-resize;
		}
	}
}