Add padding to social icons on mobile Contact page

Site URL: https://pentagon-snail.squarespace.com/contact

They appear absolutely fine on desktop, but when you switch to mobile, they no longer align with the text... how do I access them in my code, simply social-icons ? 

Also, is there any way to add left and right padding to this contact form?

THANK YOU!

Site password: kerri2021

On 12/5/2021 at 9:03 PM, hannahpellatt said:

Site URL: https://pentagon-snail.squarespace.com/contact

They appear absolutely fine on desktop, but when you switch to mobile, they no longer align with the text... how do I access them in my code, simply social-icons ? 

Also, is there any way to add left and right padding to this contact form?

THANK YOU!

Site password: kerri2021

Is it the result you want to achieve?

On 12/6/2021 at 3:17 PM, bangank36 said:

Is it the result you want to achieve?

I'm hoping to achieve something like this (attached image) so that the icons are aligned with the text above. Any ideas?!

@hannahpellatt Try adding this to Design > Custom CSS

/* Mobile contact page align icons */
@media screen and (max-width:767px) {
div#block-daffe230b4ac26f68586 {
    margin-left: 20px;
    margin-right: 20px;
}
}