Unable to remove margin when changing featured pages hover

Hi all,

After tweaking a bit the codes found here, and in the Customizr documentation, I was able to change the hover on the featured pages from the circle zoom, to overlay with blur, and have the text underneath in a color box.

However, there is border that I can’t get rid of all around the image. I’m not sure if it’s the placement, padding, margin or what, but nothing I’ve tried works. Any idea how to fix this?

Another issue I have is that the overlay animation starts in a circle, that is not centered, so it reaches the left edge first, if someone knows how to fix I’d appreciate it.

Posting images because I’m building locally:
Borders: https://i.imgur.com/L2Yg3fa.png
Hover animation: https://i.imgur.com/VLrBfbH.png

Here’s the code I’m using:

/*FP HOVER*/
.widget-front {
color: #fff;
background-color: rgba(0, 126, 199, 1);
padding-bottom: 15px;
padding-top: 0px;
}

.home .round-div {
border-color: transparent;
}

.home .round-div:hover{
opacity:0.3;
background: #00446B;
}

.thumb-wrapper:hover {
-webkit-filter: blur(1px); /* Safari */
filter: blur 1px !important;
}

.home .thumb-wrapper {
border-radius: 0px;
margin: 0px;
width: 100%;
}

.widget-front h2 {
color: #fff !important;
}
/*FP HOVER END*/

Thanks,