How can I center align content in a specific block on my front page?

Store Design
1

Hi guys, I have tried to align content in a specifik block on our front page with no success.

After reading different solutions in this community I tried to add this code to the bottom of my theme.css.liquid

@media only screen and (min-width: 749px) {
#section-template--16187925168386__163971441079050d49 .section-block-top {
   display: flex !important;
    flex-wrap: wrap;
    justify-content: center;
}
#section-template--16187925168386__163971441079050d49 .section-block-top {
	flex: 0 0 20%;
}
}

This is the content that I like to align to center on the frontpage of Mylla.se:

2.PNG
2.PNG579×544 30.7 KB

I’m thankfull for any help!

2

Hi there, in custom-style.scss.css find this code

.custom-image-with-text-block .section-block-top {
padding: 25px 25px 33px;
background-color: #fff;
border: 1px solid #000;
border-radius: 5px;
box-shadow: 5px 5px;
text-align: center; // add this to the end
}

Also in custom-style.scss.css line 195 you’ll see this

.custom-image-with-text-block .block-top-subheading {
margin-top: 20px;
width: 82%;
margin-right: auto; // add this
margin-left: auto; // add this
}

For the button in custom-style.scss.css line 206 you’ll see this

.custom-image-with-text-block .block-top-button {
margin-top: 30px; // remove this
width: fit-content;
margin: 30px auto; // add this
}