.box{
    width:290px;
    height:700px;
    background-color:#FFE6E9;
    display:flex;
    justify-content:center;
    align-items:center;
    position:fixed;
    border-radius:0 20px 20px 0;
    left:0;
    top:0;
    transition:transform 1000ms;
  transform: translateX(-265px);
}

.box:hover{
    transform:translateX(0);
}

/* hide MENU HERE when open */
.box:hover .title{
    opacity:0;
}

/* rotate diamonds when open */
.box:hover .item::before{
    transform:rotate(45deg);
}

.list{
    list-style:none;
    margin:0;
    display:flex;
    flex-direction:column;
    gap:20px;
}

.sidebar{
    width:80px;
    background-color:#000080;
    display:flex;
    justify-content:center;
}

.item{
    font-family:'Pacifico', italic;
    color:#5d4037;
    font-size:20px;
    display:flex;
    align-items:center;
    gap:20px;
}


 .title{
margin:0;
padding:0;
font-size:30px;
color:#000080;
position:absolute;
right:-70px;
top:50%;
transform:translateY(-50%) rotate(-90deg);
text-transform:uppercase;

transition-property: opacity;
transition-duration: 1000ms;
}

.item::before{
    content:"";
    display:inline-block;
    width:20px;
    height:20px;
    background-color:#9E0028;
    transform:rotate(720deg);
    transition:transform 20000ms;
}