Hi there please help!

I added a background image:

#mainwrap {
background: url(https://sanjorgeecolodges.com/images/SJT/San-Jorge-Tandayapa-Landscape.jpg) no-repeat center center fixed;
background-size: cover;
height: 100%;
overflow: hidden;
}

I need to reduce the opacity of the above image.

Also, after adding this image as a background I notice that I need to reduce the opacity of other divs such as breadcrumps? and footerwrap? (they have a solid #212121 color) in order for the backgroud image to be seen underneath.

Thankyou

    jcruz2016
    Hi
    the image is apply on the main content DIV so the opacity
    opacity: 0.8; will apply on the full content or you add an BG image that already has opacity on its image so there is no need to apply and it will work normal. about the footer part its different section and BG image will not work as its applied only for the main content
    http://prntscr.com/x31zlp

        Ninja Dear Sir. For the footer and breadcrump section what do you recomend me to do in order to reduce the transparency?

            jcruz2016
            Hi
            The BG image is applied on the Mainbody only it would not work on footer in any way as it is diffeerent block.
            Here is style code

            #footerwrap {
    background-color: #000;
    position: relative;
    color: #fff;
}

            You can customize for footer area.

              Are you trying to say there's nothing I can do to make the breadcump div transparent? Thanks
@pankaj#143073

                jcruz2016
                Hi
                use this code in custom.css

                #abovewrap .zen-spotlight {
    background-color: transparent;
}
                  Write a Reply...
                  You need to Login to view replies.