Hello, this is sort of my last resort. I've trying to replicate (photo 1) the "Pause" part of the Sonic Adventure menu with little success. What I have so far is in the second photo! The code is below:   
".sa-title-oval {

background: #ff0000;



width: 150px;

height: 60px;



border-radius: 150px / 55px;



border: 4px solid #8B0000;



box-shadow: 0 10px 20px rgba(0,0,0,0.7);



display: flex;

justify-content: center;

align-items: center;



position: absolute;   

top: -30px;         

left: 50%;

transform: translateX(-50%);

}



.sa-title-inner {

background: #f2f2f2;



width: 88%;

height: 65%;



border-radius: 999px;



border: 2px solid #000;



display: flex;

justify-content: center;

align-items: center;



font-weight: bold;

font-size: 13px;

letter-spacing: 1px;

}"

.sidebar {

width: 200px;

padding: 10px;

position: relative;

border-radius: 6px;

border: 3px solid #e6e6ff;

margin-top: 20px;

margin-left: 5px;

padding-top: 50px;

background: linear-gradient(

to bottom,

\#1A7BFF,

\#4064a8

);





}



".sidebar a {

display: block;

background: linear-gradient(#4064a8, #20355d);

color: white;

padding: 8px;

margin-bottom: 6px;

text-decoration: none;

font-weight: bold;

border: 3px solid #e6e6ff;

border-radius: 6px;

text-align: center;

}



.sidebar a:hover {

background: #e6e6ff;

color: #0000cc;

box-shadow: 0 0 8px rgba(64,100,168,0.7);

}



.sidebar a:active {

color: #b83420;

transform: translateY(1px);

box-shadow: 0 1px 2px rgba(0,0,0,0.3);

}"

"<aside class="sidebar">

<div class="sa-title-oval">

<div class="sa-title-inner">

NAVIGATION

</div>

</div>

<a href="">---</a>

<a href="us-exclusives.html">US Exclusives</a>

<a href="pal-exclusives.html">PAL Exclusives</a>

<a href="log.html">Website Log</a>

<a href="about-me.html">About Me</a>

<center><img src="button-88x31.gif" alt="Dreamcast Archive" class="dreamcast-button"></center>

</aside>"

The titles are self-explanatory, the inner code covers the text part and the white part while title covers the border and the red and general shape of the oval. I also put the code for the sidebar and the last part is the HTML for the sidebar. I'm stuck and its been driving me NUTS! I just want to get the right centering, shape and the imbalanced red of the oval. I'm fairly new to HTML and CSS. 

Many thanks!! 

Struggling to replicate top "button" from Sonic Adventure.