How to change SOLD OUT appearance in Prestige Theme

[rodriiiv1]

How can I change the appearance of sold out products in the collection / home page from the small badge on the top corner as you can see in the attached image?

My website URL is twistedfriends.com

[dmwwebartisan]

@rodriiiv1 

 Please Go to Online Store->Theme->Edit code then go to assets/theme.scss.liquid ->paste below code at the bottom of the file. 

.template-index .ProductItem__LabelList {
    position: absolute;
    top: 50% !important;
    text-align: center;
    left: 38% !important;
}

Thanks!

[Zworthkey]

Hii, @rodriiiv1 
Paste this code on top of the theme.scss file.

.ProductItem__LabelList {
    position: absolute;
    left: 35% !important;
    top: 40% !important;
    text-align: left;
}

Thank You.

[Kinjaldavra · Accepted solution]

hello @rodriiiv1 

please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

.template-index .ProductItem__LabelList {
    position: absolute;
    left: 50% !important;
    top: 50% !important;
    text-align: left;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

[rodriiiv1]

Thank you very much!