Hi msguerra74!

I guess you could overlay the outside of the arc with elements that revert the cursor back to an arrow. It's not pretty, but it works. And you can always add more divs to block off more of the arc.

<header>
  <nav>
    <div class="blocker left"></div>
    <div class="blocker right"></div>
    <ul>
      <li><a href="#">How</a></li>
      <li><a href="#">Are</a></li>
      <li><a href="#">You</a></li>
    </ul>
  </nav>
</header>

CSS

body {
  font-family: arial;
}
header {
  background: #ccc;
  height: 150px;
  margin: 50px auto;
  position: relative;
  text-align: center;
  width: 700px;
}
nav {
  left: 0;
  position: absolute;
  right: 0;
  top: -30px;
}
ul {
  border-radius: 0 0 200px 200px;
  display: inline-block;
  margin: 0;
  overflow: hidden;
  padding: 0;
}
li {
  background: green;
  display: inline-block;
  text-align: center;
  width: 100px;
}
a {
  color: #fff;
  display: block;
  padding: 5px 0 125px 0;
  text-decoration: none;
}
li:hover {
  background: blue;
}

div.blocker {
  width: 50px;
  height: 150px;
  /* border: #999 1px solid; */
  position: absolute;
  top: 20px;
  cursor: arrow;
}
div.left {
  transform: rotate(-35deg);
  left: 170px;
}
div.right {
  transform: rotate(35deg);
  left: 478px;
}

Note: I turned on prefix free for that demo.