I have a situation where i have a tab structure and there are other options under each main tab so i have picked up tree tab structure where i show primary tab and secondary tab visually different.

as par old design when user scrolls down top level main tab gets converted into drop down and i think this is confusing.
and
as par new design i have made two tabs look visually different but when scrolled down sticking two tabs will not look is what i feel.
is there any other solution where i can show the context of tab when user is scrolling down

[![Old Design two tabs](https://i.stack.imgur.com/NQd0l.png)](https://i.stack.imgur.com/NQd0l.png)

[![old design after scroll it changes to drop down](https://i.stack.imgur.com/5xgPd.png)](https://i.stack.imgur.com/5xgPd.png)

[![primary tabs converted into drop down](https://i.stack.imgur.com/gTenl.png)](https://i.stack.imgur.com/gTenl.png)

[![new design](https://i.stack.imgur.com/LeG5k.png)](https://i.stack.imgur.com/LeG5k.png)