Astroid is very flexible when it comes to modifying the layout of certain areas, including doing a transparent header like this one (https://demo.joomdev.com/servx/toolbar/).
Add the following classes to your header section using the layout manager (doc).
header-transparent position-absolute
Add the following CSS in your astroid custom css section (doc).
.astroid-header-section {
background: transparent;
z-index: 9999;
border-bottom: 1px solid rgba(255, 255, 255, 0.26);
}
Make sure your header doesn’t have any background color selected in the backend section level or the colors section and change that color to transparent as well.
That’s it. This should do it. You may add the class pb-2 (padding bottom 2 (range is between 1 – 5)) to create additional padding towards the bottom between the header and the section below.