#side_card{
position:fixed;
top:50%;
right:250px;
width: 250px;
height: 250px;
padding:1rem;
background-color:#333;
color:#FFF;
transform:translate(100%,-50%);
transition: transform .4s linear;
}
#side_card.active{
transform:translate(190%,-50%);
}
#side_card.active #card_trigger span{
transform:rotate(-180deg);
}

#card_trigger{
position: absolute;
top: 50%;
left: -25px;
width:25px;
height:25px;
background-color:#333;
color:#FFF;
transform: translateY(-50%);
cursor: pointer;
}

#card_trigger span{
display: block;
font-size:12pt;
text-align:center;
line-height:25px;
}

css e eklediklerinizi bu şekilde değiştirip bi dener misiniz