How indicate 'open end' for a DIV box with CSS - css

Question

I am using vis.js to display some items on a timeline.
Some items have a clear start and end date which allows me to simply use the vis.js timeline features.
By default a div box is drawn which I can overwrite with my custom CSS.
This is a running example how this looks like with some ugly custom styling:
// DOM element where the Timeline will be attached
var container = document.getElementById('visualization');
// Create a DataSet (allows two way data-binding)
var items = new vis.DataSet([
{id: 1, content: 'item 1', start: '2014-04-16', end: '2014-04-19'},
]);
// Configuration for the Timeline
var options = {};
// Create a Timeline
var timeline = new vis.Timeline(container, items, options);
body {
font-family: purisa, 'comic sans', cursive;
}
.vis-timeline {
border: 2px solid purple;
font-family: purisa, 'comic sans', cursive;
font-size: 12pt;
background: #ffecea;
}
.vis-item {
border-color: #F991A3;
background-color: pink;
font-size: 15pt;
color: purple;
box-shadow: 5px 5px 20px rgba(128,128,128, 0.5);
}
.vis-item,
.vis-item.vis-line {
border-width: 3px;
}
.vis-item.vis-dot {
border-width: 10px;
border-radius: 10px;
}
.vis-item.vis-selected {
border-color: green;
background-color: lightgreen;
}
.vis-time-axis .vis-text {
color: purple;
padding-top: 10px;
padding-left: 10px;
}
.vis-time-axis .vis-text.vis-major {
font-weight: bold;
}
.vis-time-axis .vis-grid.vis-minor {
border-width: 2px;
border-color: pink;
}
.vis-time-axis .vis-grid.vis-major {
border-width: 2px;
border-color: #F991A3;
}
<link href="http://visjs.org/dist/vis.css" rel="stylesheet"/>
<script src="http://visjs.org/dist/vis.js"></script>
<div id="visualization"></div>
</body>
</html>
This is basically creating a blue box with a solid border. So far so good.
In my case I have some items which don't have a defined start and/or end date, so there might be open ends (from ever to ever).
To be honest I am struggling with both the 'conceptual' and the 'technical' solution how to display that within the timeline.
Currently I am just setting some very early/late date for open starts/ends but ideally it would be somehow visible to the user.
First idea that I had was to draw some infinite icon in the background of my item's div at the left for open start and/or at the right for open end.
Another idea would be to somehow fade out the endings of my div (some color grading from blue to alpha and get rid of the solid borders left and right).
Does anyone have a better idea (I guess so) and how would I have to overwrite the given CSS to reach that goal?
Yet I hope the question is clear and precise enough, if not please give me some chance to explain it into more detail.