.timeline-wrap {
    position: relative;
    background: #fff;
    width: 100%;
    font: normal 12px/18px 'lucida grande', 'lucida sans', helvetica, tahoma, sans-serif;
    color: #333;
    padding: 60px 0 20px 0
}

.timeline-body {
    display: block;
    height: 18px;
    border: 1px solid #c5c5c5;
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.05) inset;
    border-radius: 20px;
    margin-bottom: 40px;
    position: relative;
    z-index: 9;
    background: #f5f5f5;
    background: -moz-linear-gradient(top, #f5f5f5 0, #fefefe 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f5f5f5), color-stop(100%, #fefefe));
    background: -webkit-linear-gradient(top, #f5f5f5 0, #fefefe 100%);
    background: -o-linear-gradient(top, #f5f5f5 0, #fefefe 100%);
    background: -ms-linear-gradient(top, #f5f5f5 0, #fefefe 100%);
    background: linear-gradient(top, #f5f5f5 0, #fefefe 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#f5f5f5', endColorstr='#fefefe', GradientType=0)
}

.timeline-body:before {
    position: absolute;
    display: block;
    content: "";
    left: 0;
    top: 0;
    width: 37px;
    height: 20px;
    background: url('../images/sprite.png') 0 -31px
}

.timeline-body:after {
    position: absolute;
    display: block;
    content: "";
    right: 0;
    top: 0;
    width: 37px;
    height: 20px;
    background: url('../images/sprite.png') -37px -31px
}

.timeline-draggable {
    position: absolute;
    left: 0;
    top: -1px;
    width: 20px;
    height: 20px;
    background: url('../images/sprite.png') -1px -11px;
    box-shadow: 0 0 30px rgba(0, 0, 0, 0.13);
    border-radius: 20px;
    cursor: pointer;
    z-index: 9
}

.timeline-arrow {
    position: absolute;
    left: 0;
    top: 108px;
    width: 21px;
    height: 11px;
    background: url('../images/sprite.png') 0 0;
    z-index: 9
}

.timeline-event {
    display: block;
    position: absolute;
    left: 0;
    top: 120px;
    width: 100%;
    z-index: 9;
}

.timeline-event-node {
    position: absolute;
    left: 6px;
    top: -90px;
    width: 20px;
    height: 20px;
    cursor: pointer
}

.timeline-event-node:before {
    position: absolute;
    display: block;
    content: "";
    background: #fff;
    border: 1px solid #b9b9b9;
    border-radius: 20px;
    -webkit-transition: background-color .5s;
    -moz-transition: background-color .5s;
    transition: background-color .5s;
    width: 5px;
    height: 5px;
    left: 7px;
    top: 7px
}

.timeline-event-node.selected-event:before {
    background: #ddc31a;
    border-color: #ddc31a;
}

.timeline-title {
    position: absolute;
    cursor: pointer;
    left: 0;
    top: -110px
}

.timeline-container {
    position: relative;
    display: block;
    border: 1px solid #c5c5c5;
	border-bottom: 3px solid #ddc31a;
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.10);
    border-radius: 6px;
    background: #fdfdfd;
    background: -moz-linear-gradient(top, #fdfdfd 0, #f5f5f5 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fdfdfd), color-stop(100%, #f5f5f5));
    background: -webkit-linear-gradient(top, #fdfdfd 0, #f5f5f5 100%);
    background: -o-linear-gradient(top, #fdfdfd 0, #f5f5f5 100%);
    background: -ms-linear-gradient(top, #fdfdfd 0, #f5f5f5 100%);
    background: linear-gradient(top, #fdfdfd 0, #f5f5f5 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#fdfdfd', endColorstr='#f5f5f5', GradientType=0)
}

.timeline-container:before {
    position: absolute;
    content: "";
    display: block;
    width: 100%;
    height: 7px;
    left: 0;
    top: -68px;
    background: url('../images/lines.png') repeat-x
}

.timeline-container:after {
    position: absolute;
    content: "";
    display: block;
    width: 100%;
    height: 7px;
    left: 0;
    top: -41px;
    background: url('../images/lines.png') repeat-x
}

.timeline-content {
    padding: 20px
}

.timeline-container h1,
.timeline-content h1 {
    font-size: 16px;
    margin: 10px 0
}

.timeline-container p,
.timeline-content p {
    margin: 10px 0
}

.timeline-content {
    display: none
}