Box shadow on only ONE image

Site URL: https://carrot-tortoise-9tyj.squarespace.com/

I want to apply a box shadow to the image in the row with the title "Main Areas of Expertise", but I can't seem to figure out how. I have tried using the code below, but it is still applying the box shadow to ALL images, instead of just the one. Any idea what I need to do? I've scoured the forum and haven't found an answer. I don't think you can see the site because it isn't live yet (not my decision) so I've attached an image so you can see what I'm trying to do, and another images showing the box shadow on images where I do NOT want it (the 3 columns.)  THANK YOU!

div#block-edb065db6191d80dc228 .sqs-block-image .image-block-outer-wrapper.image-block-v2 .image-inset {
-moz-box-shadow: none !important;
-webkit-box-shadow: none !important;
box-shadow: none !important;
}

Your site is private. Please post the URL to the page where you are having the issue.

Please set up a site-wide password. Post the password here.

We can then take a look at your issue.

Thank you! Here it is:

forumhelp

You won't need the CSS you posted.

In your Custom CSS you have the following rule-set.

.sqs-block-image .image-block-outer-wrapper.image-block-v2 .image-inset {
    -moz-box-shadow: 180px 25px 0px 0px #426791 !important;
    -webkit-box-shadow: 180px 25px 0px 0px #426791 !important;
    box-shadow: 180px 0px 25px 0px 0px #426791 !important
}

That is causing all image blocks to get the box shadow.

Change it to the following.

#block-edb065db6191d80dc228.sqs-block-image .image-block-outer-wrapper.image-block-v2 .image-inset {

  -moz-box-shadow: 180px 25px 0px 0px #426791;
  -webkit-box-shadow: 180px 25px 0px 0px #426791;
  box-shadow: 180px 0px 25px 0px 0px #426791;
  
  }

Then only the first image you show will get the shadow.

Let us know how it goes.

Thank you both -- I can't tell you how long I spent trying to figure this out!

@jodybethw Your site has very long content on mobile. You can consider adding a back to top button.

On Tablet Overlay Menu, linkedin not align with top nav links - bottom button.

Add this to Design > Custom CSS

@media screen and (max-width:991px) and (min-width:768px) {
.header-menu-actions {
    padding-left: 3vw;
}
}

You haven't changed SEO Title so the browser tab still shows "Services 4"

https://carrot-tortoise-9tyj.squarespace.com/research

Similar on this page "General 1" https://carrot-tortoise-9tyj.squarespace.com/speaking-and-consulting

and this "Services 1" https://carrot-tortoise-9tyj.squarespace.com/books

and this "about 1" https://carrot-tortoise-9tyj.squarespace.com/biocv