place social icons in main navigation on mobile

Hello, I hope you can help me with my problems with Social Media Links on this Squarespace site: https://www.bsil.de

My client wants the social icons to be displayed as flags with a fixed frame. I have set this up for the desktop version. On the smartphone view, the social icons are not displayed. Not in the menu (hamburger menu) and not as flags on the different pages. How can I fix this?

The website is created with 7.0 (Brine Family, Moksha-Template)

To create the box with the social icons, I used this CSS code: 

.Header-social {
   border: 2px solid #c3131d;
  background: #ffffff;
  color: #000000;
}
@media screen and (min-width: 640px) {
  .SocialLinks-link {
    display: block;
  }
  .Header-social {
    position: fixed; 
    top: 40%;
    z-index: 9999; 
    right: 0; 
  }
}

WONDERFUL! You made my day! Thank you very much for your support.
Regards from Munich