Social Icons on Mobile ! Please HELP !

Hi,

I'm working on a new website and I want something like on this image attached with hamburger Menu but when I do this social Icons disappear but I need them on the right. 

Can someone help me, how can I force mobile icons to be visible on mobile.

I have tried to bring them up from footer but I'm not so good with coding. Only what I have achieved was to bring it up with this code but it stays always visible when I scroll down.

#block-yui_3_17_2_1_1640688529513_1878{
 
   position: fixed !important;
  max-width: 150px !important;
    top: 10px !important;
  right: 10px !important;
  padding-top: 50px !important;
    width: 100% !important;
    height: 100% !important;
 }

Can you share your site with the protected password to check it together

Hi,

Sorry I can't because it is running website and I have installed the new template to try this out...

How can I move the footer block to be at the top of the website?

Can someone help me with some code?

You need to share the website if you want us to be able to help you, as @bangank36 said before.

here is the website:

https://megalodon-capybera-w4p6.squarespace.com/ 

password: 12345 

This is the code that I have used to bring social icons from footer to header and this is what I want but the problem is that it always stays fixed and I want to behave like the heather on scroll...

#block-1fb5bb40728e7dd45230{
   position: fixed !important;
  z-index: 999;
    top: 10px !important;
  right: 10px !important;
  padding-top: 10px !important;
    width: 100% !important;
    height: 100% !important;
 }