Astrid Theme : Transparent Background in service page

Hello everybody,

Thanks a lot Guys for this great theme.
I have a question about the customization of the service page.
In my website :
How can I get rid of the white color in the middle. I would like to have the background image displayed all over the page.

I tried this but in vain :

.page-template-single-service {
background-image: url(‘’) !important;
background-attachment: scroll !important;
background-repeat: repeat !important;
background-size: 50% !important;
background-color : transparent !important;

Thank you in advance!


First, at the moment you’re overriding your own code with that last extra line you have on your site but have not posted here background: transparent !important;

Use this to remove the white background behind the content:

.page-template-single-service .site-content > .container,
.page-template-single-service .hentry {
         background: transparent;
         border: 0;

Note that the background image you’re using is very large.

Thanks a lot ! Resolved!
Great Theme and Great Support.

Best Regards,


Astrid is a great theme, thanks.

I have tried the code above in Custom CSS .container.content-wrapper {
background-color: transparent;

to try to make transparent the white box around pages, as requested above. Nothing happens.

Is there a way to do this? Any advice much apprecitaed
This is the development site

Also, cannot see a way to remove or hide the black bar across the page…?

Thanks and regards,


If anyone is interested, I discovered how to do this:
Add this to Additional CSS under [Appearance].

/* 40% opaque - Grey Colour */
.page-template .site-content > .container,
.page-template .hentry {
background: rgba(127,127,127,0.3);
border: 0;

/* background: transparent;
background-color: grey;
Colors can be defined in the Red-green-blue-alpha model (RGBa) using the rgba() functional notation. RGBa extends the RGB color model to include the alpha channel, allowing specification of the opacity of a color.
a means opacity: 0=transparent; 1=opaque;
10% opaque red /
40% opaque red /
70% opaque red /
/rgba(255,0,0, 1)//
full opaque red */