  
  .expand {
    width: 0;
    border: none;
    width: 80%;
    height: 2px;
    background-color:gray;
    animation: expandAnimation 1s ease forwards;
  }
  
  @keyframes expandAnimation {
    0% {
      width: 0;
    }
    100% {
      width: 100%;
    }
  }

.history-tl-container{ 
  display:block;
  position:relative;


}
.history-tl-container ul.tl{
    display:inline-block;
    list-style: none;

}
.history-tl-container ul.tl li{
    list-style: none;
    margin:auto;
    min-height:50px;
    /*background: rgba(255,255,0,0.1);*/
    border-left: 1px dashed #5a5c5d;
    padding:0 0 20px 30px;
    position:relative;
}
.history-tl-container ul.tl li:last-child{ border-left:0;}
.history-tl-container ul.tl li::before{
    position: absolute;
    left: -10px;
    content: " ";
    border: 8px solid rgba(255, 255, 255, 0.74);
    border-radius: 500%;
    background: #000000;
    height: 20px;
    width: 20px;
    transition: all 500ms ease-in-out;

}


ul.tl li .item-detail{
    color:rgba(0,0,0,0.5);
    font-size:80%;
}


ul.tl li .timestamp{
    color: #8D8D8D;
    text-align: left;
    font-size: 80%;
}

.profile_info{
    font-size: x-large
}

  .custom-btn {
    position: absolute;
    bottom: 15px;
    right: 20px;
    background-color: #5f5e5e; /* Grayish background color */
    color: #fff;
    border: none;
    font-size: 20px;
    border-radius: 50%; /* Circular border radius */
    width: 30px; /* Adjust button width */
    height: 30px; /* Adjust button height */
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.3); /* Subtle shadow effect */

  }



  