How can I center text on my home page banner?

Store Design
1

Hello! I have impulse design and I’m trying to center it on my site. How do I do this?

Here is my website: theblackibis.com

I want ‘Your virtual gift shop because we all deserve to feel important’ to be centered…along with the buttons for shop men and shop women. Thank you!

2

To center text, you can install my free app Custom CSS and add the following code

If you don’t want to install the app, you can add the following at the bottom of your assets/styles.scss.liquid or assets/theme.scss.liquid file

.template-index .hero__text-wrap .page-width {
  display: block;
  position: relative;
}

.template-index .hero__text-wrap .hero__text-content {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
3

please find theme.scss file in code and paste this.

.template-index .hero__text-wrap .page-width {
display: block;
position: relative;
}

.template-index .hero__text-wrap .hero__text-content {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
}