nested navbar doesn't align under main nav - html

Question

Hello I'm trying to add a nested nav in my main nav. The problem is the nested nav doesn't align properly under the main nav. Please see the screenshot. The nested nav doesn't align right under the main nav. The nested nav moved around 50% to the right. I'm using css flexbox to layout the nav.
body {
background-color: red; /* to see menu */
}
.nav-wrapper {
display: flex;
align-items: center;
justify-content: space-around;
height: 8rem;
width: 100%;
background-color: transparent;
transition: height 0.5s;
}
.heading a:link,
a:visited {
font-family: 'Alata', sans-serif;
font-size: 3rem;
text-transform: capitalize;
color: white;
cursor: pointer;
display: block;
position: relative;
transition: .3s ease;
}
.heading a:hover,
a:active {
transform: translate(.3rem, -.2rem);
color: white;
}
.navbar {
display: flex;
width: 45%;
justify-content: space-between;
list-style-type: none;
z-index: 1000;
position: relative;
}
.navbar li {
position: relative;
flex: 1 1 auto;
}
.nested {
display: flex;
flex-direction: column;
list-style-type: none;
position: absolute;
width: 100%;
}
.nested li {
width: 100%;
}
.navbar li a:link,
a:visited {
padding: 5px 0px;
cursor: pointer;
color: white;
display: block;
transition: .3s;
}
.navbar li a:hover,
a:active {
transform: scale(1.2);
color: white;
background: rgba(0, 0, 0, 0.082);
}
.toggler {
display: none;
}
<div class="nav-wrapper">
<h1 class="heading">HeaderName</h1>
<div class="toggler">
<i class="fas fa-bars"></i>
</div>
<ul class="navbar">
<li> Home
<ul class="nested">
<li>
<i class="fas fa-user-alt"></i> About Us
</li>
<li><i class="fas fa-concierge-bell"></i> Services</li>
</ul>
</li>
<li>
<i class="fas fa-user-alt"></i> About Us
</li>
<li><i class="fas fa-concierge-bell"></i> Services</li>
<li><i class="fas fa-briefcase"></i> Portfolio</li>
<li><i class="fa fa-share" aria-hidden="true"></i> Contact</li>
</ul>
</div>

Answer 1

Finally got the got the problem. there was padding on the nested nav. had to add padding:0 property to css. My suggestion is to add margin:0 and padding:0 to ul, li ,a property.