Tremont logo and social icons not centered on larger screens

I'm using the Tremont template and have managed to get the logo and social icons centered with some CSS however, if you view the site on a larger monitor (24"+) the logo and social icons are no longer centered. Any ideas how to make it consistent over multiple screen sizes?

View the site demo here - https://rumemockup.squarespace.com/home PASSWORD: RUME

Thank you!

@meagen try removing these code

.site-branding h1 img {
   position: absolute;
   left: 36%
}

@media screen and (max-width: 640px) {
   .site-branding h1 img {
       position:absolute;
       left: 23%;
       margin-top: 50px
   }
}

.tweak-nav-style-standard.tweak-display-social-icons.tweak-social-icons-on-right:not(.move-social) .header-social-icons-right {
   position: absolute;
   left: 29%;
   margin-top: -80px !important
}

@media screen and (max-width: 640px) {
   .tweak-nav-style-standard.tweak-display-social-icons.tweak-social-icons-on-right:not(.move-social) .header-social-icons-right {
       position:absolute;
       left: 17% !important;
       margin-top: -20px !important
   }
}

@media screen and (max-width: 1920px) {
   .header-social-icons-with-nav .sqs-template-social-icons,.header-social-icons-right .sqs-template-social-icons {
       margin-left:-100px
   }
}

and add this code to Home > Design > Custom CSS

/* Move social icon top, logo bottom */
header#siteHeader {
   display: flex;
   flex-direction: column-reverse;
}
/* Center Social Icons */
.header-social-icons-right {
   margin-left: unset !important;
}

@tuanphan thank you so much, worked perfectly!

@tuanphan thank you so much, worked perfectly!

@tuanphan I spoke too soon! Noticing the social icons aren't appearing on mobile. Any solution? Thanks for the help!

@tuanphan I spoke too soon! Noticing the social icons aren't appearing on mobile. Any solution? Thanks for the help!

@meagen edit last code to

.header-social-icons-right {
   margin-left: unset !important;
   visibility: visible !important;
   right: unset !important;
}

@tuanphan

Hmm, noticing on a larger screen the logo is still being iffy and not centering. See example here

https://imgur.com/a/JQ1jxtF

Is it possible for this to work on a large screen resolution?

Thanks in advance! :)

Hi @tuanphan I seem to be having the exact same problem. Did you ever happen to find a solution for the centered logo being ever so slightly off center? Please see attached image which shows the centre line (blue) and the logo ever slightly off-center. Please help!

2 hours ago, JakeMagnus said:

Hi @tuanphan I seem to be having the exact same problem. Did you ever happen to find a solution for the centered logo being ever so slightly off center? Please see attached image which shows the centre line (blue) and the logo ever slightly off-center. Please help!

 

Please share site url to check.

Thanks @tuanphan, the site is https://capybera-tangerine-g3d5.squarespace.com/en/projects. (pw: STUCHBURY13) Also wondering if you know anything about adding a language switcher button? I have created all the necessary multilingual pages and they are working properly ie spanish pages have the spanish navigation bar and vice versa with english but just can't seem to create the button to toggle between them.

Hi @tuanphan I actually managed to get the language switcher to appear and ALMOST working. The english button works perfectly but when I click "Spanish" It takes me to the spanish version but the home index page won't load.

Hi again, @tuanphan really sorry to keep bothering you! I got the language switcher working great but just wondering if you could check why the logo isn't quite centered

2 hours ago, JakeMagnus said:

Hi again, @tuanphan really sorry to keep bothering you! I got the language switcher working great but just wondering if you could check why the logo isn't quite centered

 

Your site is private. Please setup password  & share url again.

See my signature if you dont know how to.

5 minutes ago, tuanphan said:

Your site is private. Please setup password  & share url again.

See my signature if you dont know how to.

Hi, thanks it should be good to go now. https://capybera-tangerine-g3d5.squarespace.com/config/pages PW: qwerty