gallery Can't target a specific image gallery section (not add gallery block) with CSS

Trying to apply CSS to a specific  image gallery section ((add gallery/images - not add gallery block)

I tried entering the section, then yui I see with inspect and ultimately even the entire page with collection but the damn code keeps applying to the entire site and not only on that particular gallery section . Am I getting the syntax wrong or is targeting gallery sections impossible? Forum seems to suggest is doable but cant get it right

section[data-section-id="65eba2ee2952eb7dd0fc1ef9"]     is the one in question. trying to apply it to the following code. Entering that, with or with out the word section, with or without * before { ...code ...}, doesnt seem to work.  What gives?

https://www.dphworld.com/santorini/homer

pass 1234

/* LIGHTBOX CONTROLS FOR FLOOR PLANS */
/* General controls and adjustments */
  .gallery-lightbox-controls {
    display: flex !important;
}
.gallery-lightbox-control-btn .gallery-lightbox-control-btn-icon svg * {
    stroke: white;
    stroke-width: 4px;
}
.gallery-lightbox-close-btn-icon * {
    color: white !important;
}
.gallery-grid.gallery-grid--layout-grid {
    align-items: center !important;
}

/* Change the background lightbox color - gallery */
.gallery-lightbox-background {
    background: #404040;
    opacity: 0.8;
}

/* Desktop gallery thumbnail position / per row */
@media screen and (min-width:933px) {
    .gallery-grid-wrapper {
        grid-template-columns: repeat(3, 1fr) !important;
    }
    .gallery-grid.gallery-grid--layout-grid {
        padding-left: 25vw !important;
        padding-right: 25vw !important;
    }
}

/* Mobile gallery lightbox arrow position */
@media screen and (max-width:932px) {
    .gallery-lightbox-control-btn[aria-label="Previous Slide"] {
        left: -22px;
    }
    .gallery-lightbox-control-btn[aria-label="Next Slide"] {
        right: -10px;
    }
  } 
/* END LIGHTBOX CONTROLS FOR FLOOR PLANS */

3 hours ago, takis-7124 said:

Trying to apply CSS to a specific  image gallery section ((add gallery/images - not add gallery block)

I tried entering the section, then yui I see with inspect and ultimately even the entire page with collection but the damn code keeps applying to the entire site and not only on that particular gallery section . Am I getting the syntax wrong or is targeting gallery sections impossible? Forum seems to suggest is doable but cant get it right

section[data-section-id="65eba2ee2952eb7dd0fc1ef9"]     is the one in question. trying to apply it to the following code. Entering that, with or with out the word section, with or without * before { ...code ...}, doesnt seem to work.  What gives?

 

https://www.dphworld.com/santorini/homer

pass 1234

/* LIGHTBOX CONTROLS FOR FLOOR PLANS */
/* General controls and adjustments */
  .gallery-lightbox-controls {
    display: flex !important;
}
.gallery-lightbox-control-btn .gallery-lightbox-control-btn-icon svg * {
    stroke: white;
    stroke-width: 4px;
}
.gallery-lightbox-close-btn-icon * {
    color: white !important;
}
.gallery-grid.gallery-grid--layout-grid {
    align-items: center !important;
}

/* Change the background lightbox color - gallery */
.gallery-lightbox-background {
    background: #404040;
    opacity: 0.8;
}

/* Desktop gallery thumbnail position / per row */
@media screen and (min-width:933px) {
    .gallery-grid-wrapper {
        grid-template-columns: repeat(3, 1fr) !important;
    }
    .gallery-grid.gallery-grid--layout-grid {
        padding-left: 25vw !important;
        padding-right: 25vw !important;
    }
}

/* Mobile gallery lightbox arrow position */
@media screen and (max-width:932px) {
    .gallery-lightbox-control-btn[aria-label="Previous Slide"] {
        left: -22px;
    }
    .gallery-lightbox-control-btn[aria-label="Next Slide"] {
        right: -10px;
    }
  } 
/* END LIGHTBOX CONTROLS FOR FLOOR PLANS */

 

Your code is applied for a lightbox, what is the page that lightbox? I dont see it on homepage...

Thanks for taking the time @Beyondspace . Lightbox pops up if you press any of the gallery pictures with the floor plans of the house, towards the end. Circled in red below

6 hours ago, Beyondspace said:

Selector the section lightbox is

eg

[data-lightbox-section-id="65eba2ee2952eb7dd0fc1ef9"] .gallery-lightbox-control-btn .gallery-lightbox-control-btn-icon svg * {
    stroke: white;
    stroke-width: 4px;
}

 

Excellent explanation. Works like a charm. Apparently I was using wrong syntax. Section and lightbox sections are different. Thanks