Hello have problem with Responsive Mode Shopin Template Layout, use this template a lot but always have problem in phone mode, I copied the css from my previos support question but not working.

I have removed the login and cart function but added language changer same position as the account and cart position, also I dont want the phone number to show which is added in the template basic settings, it should only show on desktop and tablet view not on mobile.

I have a custom css file and this is what I added:

@media (min-width: 992px) and (max-width: 1550px) {
  #sp-menu {
    width: 57%;
    padding-right: 0px;
  }
  .sp-megamenu-parent > li > a, .sp-megamenu-parent > li > span {
    padding: 0px 10px;
  }
  #sp-top1 {
    padding-top: 0px !important;
    text-align: right !important;
    padding-left: 0px;
    padding-right: 10px;
    width: 18%;
  }
  #sp-top1 > div > .sp-module {
    padding-left: 5px;
  }
  #sp-top2 a {
    font-size: 14px;
  }
  #sp-logo {
    padding: 0px;
  }
}
@media (min-width: 992px) and (max-width: 1320px) {
  #sp-header {
    padding: 0px 10px !important;
  }
  #sp-menu {
    width: 57%;
    padding-right: 0px;
  }
  .sp-megamenu-parent > li > a, .sp-megamenu-parent > li > span {
    font-size: 14px;
    padding: 0px 10px;
  }
  #sp-top1 {
    padding-top: 0px !important;
    text-align: right !important;    
    padding-left: 0px;
    padding-right: 10px;
    width: 18%;
  }
  #sp-top1 > div > .sp-module {
    padding-left: 5px;
  }
  #sp-top2 a {
    font-size: 14px;
  }
  #sp-top1 a {
    font-size: 13px;
  }
  #sp-header .logo {
    height: 80px;
  }
  #sp-logo {
    padding: 0px;
  }
  .shopin-ico-search {
    margin: 5px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .sp-megamenu-parent > li > a, .sp-megamenu-parent > li > span {
    padding: 0 5px;
    font-size: 13px;
  }
}
@media (max-width: 991px) {
  #sp-menu {
    display: flex;
    justify-content: end;
    padding: 0px;
    margin-right: 10px;
  }
  #sp-logo {
    width: 50%;
  }
  #sp-top1 {
    padding-top: 0px !important;
    text-align: right !important;    
    padding-left: 0px;
    padding-right: 10px;
    width: 18%;
  }
  #sp-top2 {
    padding: 0px;
  }
  .sp-page-title {  
    background-position: top 55px left 105px !important;
  }
}