/*============================================================== 
 Custom Timeline for content 'Progress'
 ============================================================== */

.timeline:before{
    width: 0;
}

.timeline-nav-button--prev:before{
    background-image: url('../img/icon/arrow-left.svg') !important;
}

.timeline-nav-button--next:before{
    background-image: url('../img/icon/arrow-right.svg') !important;
}

.timeline--horizontal .timeline-divider{
    background-color: #343a40 !important;
}

.timeline__item:after{
    border: 4px solid #343a40 !important;
}

.timeline__content{
    border: 1px solid #fff !important;
}

.timeline--horizontal .timeline__item--bottom .timeline__content__wrap > .timeline__content{
    -webkit-box-shadow: -13px -10px 70px -14px rgba(171,171,171,1);
    -moz-box-shadow: -13px -10px 70px -14px rgba(171,171,171,1);
    box-shadow: -13px -10px 70px -14px rgba(171,171,171,1);
}

.timeline--horizontal .timeline__item--top .timeline__content__wrap > .timeline__content{
    -webkit-box-shadow: 10px 10px 47px -13px rgba(171,171,171,1);
    -moz-box-shadow: 10px 10px 47px -13px rgba(171,171,171,1);
    box-shadow: 10px 10px 47px -13px rgba(171,171,171,1);
}

.timeline--horizontal .timeline__item .timeline__content:before{
    border-color: transparent !important;
}

.pg-timeline{
    margin-bottom: 5rem;
    margin-top: 5rem;
    text-align: center;
}

.pg-timeline > h2{
    padding: 2rem 0;
}

.timeline-nav-button{
    border: 2px solid #a0a0a0;
}

@media (max-width: 700px){
    .timeline:not(.timeline--horizontal):before{
        background-color: #343a40 !important;
    }

    .timeline--mobile .timeline__item .timeline__content:before{
        border-right: 12px solid transparent !important;
    }

    .timeline__content{
        -webkit-box-shadow: 7px -2px 6px 0 rgba(171,171,171,1);
        -moz-box-shadow: 7px -2px 6px 0 rgba(171,171,171,1);
        box-shadow: 7px -2px 6px 0 rgba(171,171,171,1);
    }
     
    .timeline__items{
        height: 285px !important;
        overflow: auto !important;
    }
}