Not Found page rendering for an entire page

Below in the App.js file , the routes component wraps part of the website , but i needed the NotFound component to be rendered for the whole page if a wrong url was entered , please advice on how this can be done in this case , i appreciate your feedback

const App = () => {
  return (
    <Box>
      <CssBaseline />
      <Navbar />
      <Routes>
        <Route path="/" element={<Navigate to="/home" />} />
        <Route path="/home" element={<Home />} />
        <Route path="/tours" element={<Tours />} />
        <Route path="/music" element={<Music />} />
        <Route path="/contact" element={<ContactUs />} />
      </Routes>
      <Testimonials />
      <Footer />
    </Box>
  );
};