Content not visible during scorling in Angular component

In Angular, I have three components header, lefpanel and router-outlet for all other component data/page need to display. The initial component introduction have some contents, but only partial content is visible in router outlet others are not visible. The app component is

<div  class="container-fluid p-0 w-100 h-100"  style="display: grid;grid-template-areas:'header header''menu content';grid-template-columns: 1fr 3fr;grid-template-rows: 1fr 2fr;"><app-header [user]="uname" style="grid-area: header;"></app-header><app-leftpanel style="grid-area: menu;"></app-leftpanel><div style="grid-area: content;overflow-y:auto;"><router-outlet></router-outlet></div></div>

The introduction component (when we click About us tab) style is

.login-right {    background: #83648f;    padding: 5rem 10%;    overflow-y: auto;  }

While scrolling the partial content is visisble

Already I posted regarding this, i got some inputs but still not working for me.The stackblitz link ishttps://stackblitz.com/github/reegan2024/myproject?file=README.md

Can Someone help to solve this.