Подскажите как сверстать меню как на скриншоте - HTML, CSS - Ответ 9785385

* {
    margin: 0;
    padding: 0;
}
 
ul {list-style-type: none;}
 
body {
    background-color: #e6ebee;
    margin: 50px 0;
}
 
.nav {
    border-bottom: 1px solid #92979a;
    height: 43px;
}
 
.nav ul {
    float: right;
    margin-right: 80px;
}
 
.nav ul li {
    float: left;
}
 
.nav ul li a {
    border-right: 1px solid #92979a;
    border-top: 1px solid #92979a;
    padding: 15px 30px;
    line-height: 40px;
    text-decoration: none;
    color: #8f9497;
}
 
.nav ul li a:hover {
    border-bottom: 1px solid #e9eef1;
    background: linear-gradient(to bottom, #ffffff, #e9eef1);
    color: #00bdf3;
}
 
.nav ul li:last-child a {
    border-radius: 0 20px 0 0;
}
 
.nav ul li:first-child a {
    border-radius: 20px 0 0 0;
    border-left: 1px solid #92979a;
}