/**
 * timeline styles
*/

.timeline .views-view-grid {
    width: 15px;
    background-color: #31F;
    display: block;
    margin: 0 auto;
    position: relative;
    background: url('http://www.lifenews.sk/themes/lifenews/images/timeline-line.png');
}

.timepoint::before {
    content: ' ';
    width: 15px;
    height: 15px;
    background: transparent url("http://www.lifenews.sk/themes/lifenews/images/timeline-point.png") repeat scroll 0% 0%;
    position: absolute;
    top: 50%;
    transform: translate(0px, -50%);
}

.timepoint {
    display: block;
    margin: 0 auto;
    //background-color: #3B2;
    width: 300px;
    position: relative;
    padding: 0 30px;
}

.timepoint-wrapper:nth-child(odd) .timepoint {
    //  transform:translate(-50%,0);
    right: 0;
    text-align: right;
}

.timepoint-wrapper:nth-child(odd) .timepoint::before {
    right: 0;
}

.timepoint-wrapper:nth-child(even) .timepoint::before {
    left: 0;
}

.timepoint-wrapper:nth-child(even) .timepoint {
    //  transform:translate(50%,0);
    left: 0;
}

.timepoint-wrapper {
    position: relative;
    min-height: 300px;
}

.timepoint {
    position: absolute;
}

.time {
    position: absolute;
    top: 50%;
    color: black;
    font-weight: bold;
}

.timepoint-wrapper:nth-child(even) .time {
    left: -60%;
}

.timepoint-wrapper:nth-child(odd) .time {
    right: -60%;
}