.navigation {
    position: fixed;
    inset: 20px;
    
    border-radius: 24px;
    
    box-shadow: 15px 15px 25px rgba(0,0,0,0.05);
    transition: 0.5s;
}   
.navigation.active {
   
    border-radius: 50px;
}   


    .main {
        width: 100%;
    }

  
  @media (min-width: 640px) {
    .main {
        width: calc(100% - 300px);
        transition: 0.5s;
    }
    
    .main.active {
        width: calc(100% - 90px);
        
    }

  }


.titlemenu{

display: flex;

}
.titlemenu.active {
    display:none;
}

/* .toggle {
    position: absolute;
    bottom: 15px;
    right: 15px;
    width: 50px;
    height: 50px;
    background: white;
    border-radius: 50%;
    box-shadow: 5px 5px 10px rgba(0,0,0,0.15);
    cursor: pointer;
}

.toggle::before {
    content: '';
    position: absolute;

} 