summary-header-text css

Site URL: https://kraftbergen.squarespace.com/

Hi, I am trying to work around .summary-header-text on my website as my customer wnats to show 
header text on the thumbnails. But I am struggling with adjustment, as the texts look slightly out of center on each of the thumbnails. 
I am using this css:

span.summary-header-text {
    font-size: 2rem;
    font-family: 'Parabole';
    color: #fff !important;
    align-items: center;
    justify-content: center;
    z-index: 1;
    display: inline-block;
    text-align: center;
    position: absolute;
    left: 50%;
    top: 30%;
    transform: translateX(-50%);
    width: 80%;
    pointer-events: none;
}

How could I solve it?
Thanks for all advice!

Password to the site is: Kraft1445!
 

Which text?

Hi @tuanphan

I have got some help to manage the text. It was the white text on thumbnails. It works ok now.
 

All the best,

Kristina