.hovermode .button_p{
position : relative;
display : inline-block;
}
.hovermode .button_bold{
position : relative;
display : inline-block;
}







.button_p {
font-family:"SoletoTK_W_lt"
display: inline-block;
font-size: 16px;
margin-top: 5px;
color: #454542;
cursor: pointer;
}

.button_bold {

display: inline-block;
font-size: 18px;
margin-top: 2.7px;
color: #454542;
cursor: pointer;
}

.hide{
visibility: hidden;
opacity: 0;

}
.timeline_img{
margin:auto;
background-color: lightblue;
overflow: hidden;
display: inline-block;
margin-right: 12px;
margin-left: 12px ;
z-index: 100;

}

.hovermode{
}

.hovermode .button_p::after {
content : "";
position : absolute;
width : 100%;
bottom: 2px;
height : 2px;
background-color: #454542;
bottom: 0;
left: 0;
transform : scaleX(0);
transform-origin: bottom left;
transition : transform 0.3s linear;
}

.hovermode .button_bold::after {
content : "";
position : absolute;
width : 100%;
bottom: 2px;
height : 2px;
background-color: #454542;
bottom: 0;
left: 0;
transform : scaleX(0);
transform-origin: bottom left;
transition : transform 0.3s linear;
}

.hovermode:hover .asdr {
transform: rotate(90deg);
transition : transform 0.3s linear;
}

.asdr{
transform: rotate(0deg);
transition : transform 0.3s linear;
}

.hovermode:hover .button_p::after {
transform-origin: bottom left;
transform: scaleX(1);
}
.hovermode:hover .button_bold::after {
transform-origin: bottom left;
transform: scaleX(1);
}


.hovermode:hover .hide {
transition: visibility 0s, opacity 0.2s linear;
}

.hovermode:hover .hide {
visibility: visible;
opacity: 1;
}