
.timeline{
    width:100%;
    background-color: var(--background-color);
    color:#fff;
    padding:30px 20px;
    box-shadow:1px 1px 9px 3px rgba(0,0,0,.5);
}

.timeline a {
    /*color: rgb(249,154,46);*/
    color: var(--text-decoration-color);
    text-decoration: none;
}
.timeline ul{
    list-style-type:none;
    border-left:2px solid #094a68;
    padding:10px 5px;
}
.timeline ul li{
    padding:20px 20px;
    position:relative;
    cursor:pointer;
    transition:.5s;
}
.timeline ul li span{
    display:inline-block;
    background-color:#1685b8;
    border-radius:25px;
    padding:2px 5px;
    font-size:15px;
    text-align:center;
}
.timeline ul li .content h3{
    color:#34ace0;
    font-size:17px;
    padding-top:5px;
}
.timeline ul li .content p{
    padding:5px 0px 15px 0px;
    font-size:15px;
}
.timeline ul li:before{
    position:absolute;
    content:'';
    width:10px;
    height:10px;
    background-color:#34ace0;
    border-radius:50%;
    left:-11px;
    top:28px;
    transition:.5s;
}
.timeline ul li:hover{
    background-color:#071f2a;
}
.timeline ul li:hover:before{
    /*background-color:#0F0;*/
    /*box-shadow:0px 0px 10px 2px #0F0;*/
    background-color:var(--text-decoration-color);
    box-shadow:0px 0px 10px 2px var(--text-decoration-color);
}
@media (max-width:300px){
    .timeline{
        width:100%;
        padding:30px 5px 30px 10px;
    }
    .timeline ul li .content h3{
        color:#34ace0;
        font-size:15px;
    }

}