Get rid of ghosting and plus sign in gallery of Woo Commerce

I am trying to rid my website of the ghosting and plus sign that takes place on hover in the gallery of a Woo Commerce page. (Using theme Divi.)

I don’t know CSS, but I lucked out and found directions on how TO ghost on hover, so I took out the similar code (see below) out of my theme’s style.css. I didn’t know this was a big no no. I have now set up a child theme, but I stuck.

I figured out how to take out the code when it was there, but how do I write code in my child theme that says not to follow those directions in my parent theme? (Please be detailed, because I’m just starting out.)

The code I took out of the theme’s style.css was:

/* Portfolio + Shop Overlay */
.et_overlay {
display: block;
position: absolute;
z-index: 3;
top: 0;
left: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
width: 100%;
height: 100%;
border: 1px solid #e5e5e5;
opacity: 0;
background: rgba(255, 255, 255, 0.9);
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
-webkit-transform: translate3d(0, 0, 0);
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
backface-visibility: hidden;

-o-backface-visibility: hidden;
}

.et_overlay:before {
position: absolute;
top: 55%;
left: 50%;
margin: -14px 0 0 -14px;
font-size: 32px;
content: “\e050”;
-webkit-transition: all 0.4s;
-moz-transition: all 0.4s;
transition: all 0.4s;
}

.et_overlay:hover:before {
top: 50%;
}

.et_shop_image:hover .et_overlay,
.et_portfolio_image:hover .et_overlay,
.et_pb_fullwidth_portfolio .et_pb_portfolio_image:hover .et_overlay,
.et_pb_fullwidth_portfolio .et_pb_portfolio_image:hover .meta,
.et_pb_gallery_image:hover .et_overlay {
opacity: 1;
}

.et_pb_slider.et_pb_gallery_fullwidth span.et_overlay {
display: none;
}

#ie7 .et_overlay,
#ie8 .et_overlay {
display: none;
}

Here is an example page of what I am talking about

https://www.sundaraimports.com/jewelry/

https://www.ads-software.com/plugins/woocommerce/