How to center headers and supporting copy only on mobile

Site URL: https://craigkleila.com/

Password to site is "password".

I'm trying to center the text right below the H1 on mobile ("earn more traffic..."), as well as the H2s "What I do" and "Get in Touch" and their supporting copy "data-driven SEO...", "i'm currently available for...". Can someone provide guidance on how to do this?

Edit Homepage > Click Mobile icon on top right > Then you can adjust them on mobile. This won't affect desktop

Hi, thanks for the response. This doesn't work though. If I center text on mobile, it also centers the text on desktop.

On 9/6/2022 at 5:54 AM, Craig456 said:

Hi, thanks for the response. This doesn't work though. If I center text on mobile, it also centers the text on desktop.

Try adding this to Design > Custom CSS

/* Mobile-Homepage-Center text */
@media screen and (max-width:767px) {
/* What I do */
div#block-2b146f6a3169f4db2c94, div#block-yui_3_17_2_1_1660687864781_956184 * {
    text-align: center;
}
/* Get in touch */
div#block-yui_3_17_2_1_1661541050975_578395 *, div#block-cb8724349141cf5d81b5 * {
    text-align: center !important;
}
}

I don't see earn more traffic. Which page are you referring to?

Thank you! The earn more traffic text was changed. It's the subtext right under the H1 (maximize your...)

On 9/9/2022 at 9:24 AM, Craig456 said:

Thank you! The earn more traffic text was changed. It's the subtext right under the H1 (maximize your...)

Use this new code

/* Mobile-Homepage-Center text */
@media screen and (max-width:767px) {
/* What I do */
div#block-2b146f6a3169f4db2c94, div#block-yui_3_17_2_1_1660687864781_956184 * {
    text-align: center;
}
/* Get in touch */
div#block-yui_3_17_2_1_1661541050975_578395 *, div#block-cb8724349141cf5d81b5 * {
    text-align: center !important;
}
/* grow your organic */
div#block-yui_3_17_2_1_1660700494123_911821 {
    text-align: center;
}
}