/*-------------------------------------------------------------------*/
/* Timeline */
/*-------------------------------------------------------------------*/
@media (min-width: 768px) {
    .timeline-left {
        border-right: solid 5px #ddd;
    }

    .timeline-right {
        padding-top: 100px;
    }

    .timeline-event-left {
        width: 97%;
        position: relative;
    }

        .timeline-event-left:before {
            content: "";
            width: 20px;
            height: 20px;
            background-color: #808080;
            border-radius: 50px;
            border: solid 4px #ddd;
            position: absolute;
            right: -37px;
            top: 13px;
            margin-left: -12px;
            z-index: 10;
        }

    .timeline-event-right:before {
        content: "";
        width: 20px;
        height: 20px;
        background-color: #808080;
        border-radius: 50px;
        border: solid 4px #ddd;
        position: absolute;
        left: -25px;
        top: 13px;
        margin-left: -12px;
        z-index: 10;
    }

    .timeline-event-right {
        width: 97%;
        margin-left: 3%;
        position: relative;
    }

    .timeline-event:after {
        content: "";
        width: 0px;
        height: 0px;
        border-style: solid;
        position: absolute;
        top: 9px;
    }

    .timeline-event-left:after {
        border-width: 14px 0 14px 20px;
        border-color: transparent transparent transparent #808080;
        right: -18px;
    }

    .timeline-event-right:after {
        border-width: 14px 20px 14px 0;
        border-color: transparent #808080 transparent transparent;
        left: -18px;
    }
}

@media (min-width: 992px) {
    .timeline-event-left:before {
        right: -41px;
        margin-left: -12px;
    }

    .timeline-event-right:before {
        left: -29px;
        margin-left: -12px;
    }
}

@media (min-width: 1200px) {
    .timeline-event-left:before {
        right: -44px;
        margin-left: -12px;
    }

    .timeline-event-right:before {
        left: -32px;
        margin-left: -12px;
    }
}

.timeline-title {
    text-align: center;
    display: block;
    margin: 0 auto 40px auto;
}

    .timeline-title span {
        background-color: #808080;
        padding: 8px;
        color: #fff;
        border-radius: 3px;
    }
/* Timeline 2 */
@media (min-width: 768px) {
    .timeline-2 {
        border-left: solid 5px #eee;
        list-style-type: none;
        margin: 0;
        padding: 0;
        padding-left: 20px;
        margin-left: 110px;
    }

        .timeline-2 li {
            position: relative;
        }

    .timeline-2-point {
        top: 20px;
        left: -10px;
        width: 10px;
        height: 10px;
        position: absolute;
        background: #808080;
        margin: 0 0 0 -17px;
        box-shadow: 0 0 0 4px #eee;
        -webkit-font-smoothing: antialiased;
        border-radius: 30px;
        z-index: 20;
    }

    .timeline-2 li:hover .timeline-2-point {
        background-color: #444;
    }

    .timeline-2 li .timeline-time {
        position: relative;
        top: 0px;
        left: -150px;
        z-index: 20;
        text-align: right;
        display: block;
        width: 100px;
    }

        .timeline-2 li .timeline-time span {
            display: block;
            font-size: 1.6em;
        }

    .timeline-2 li .panel,
    .timeline-2 li .alert,
    .timeline-2 li blockquote {
        margin-top: -45px;
        position: relative;
        top: 0;
    }
}

@media (max-width: 767px) {
    .timeline-2 {
        list-style-type: none;
        margin: 0;
        padding: 0;
    }

    .timeline-2-point {
        display: none;
    }

    .timeline-2 li {
        margin-bottom: 40px;
    }

        .timeline-2 li .timeline-time {
            font-size: 1.6em;
            /*padding-bottom: 20px;*/
            display: block;
        }
}

/*-------------------------------------------------------------------*/
/* Custom */
/*-------------------------------------------------------------------*/
.timeline-2 .panel-body {
    padding: 10px 5px;
}

.nisTelegramm .tab-content {
    padding-top: 14px;
}

@media (min-width: 768px) {
    .timeline-2-point {
        top: 8px;
    }

    .timeline-2 li .panel, .timeline-2 li .alert, .timeline-2 li blockquote {
        margin-top: -37px;
    }

    .nisTelegramm .timeline-2 {
        border-left: solid 4px #aaa;
    }

    .timeline-2-point {
        box-shadow: 0px 0px 0px 1px #aaa;
    }
}