create a button in the header of the mobile menu in the middle of the logo and the menu accordion

good evening everybody, I would like to implement a button in the mobile menu in the header between the middle of the logo and the middle of the menu accordion (explanation in the image that I will send)

I tried to do it but rarely it only works for me on a cell phone in the mobile version but in the others it is not also possible to see in the css search engine of google chrome, when you put the responsive versions but in other devices it does not appear

this is the link of the page: https://bildschulebuchs.ch/aktuelles/

here the image

This is the code that I used but it didn't help me

el html este:

div id=masthead class=navbar menu-primary menu-light submenu-dark style-light-original menu-with-logo
  div class=mobile-additional-icons
    a class=efectobotonn href=https://bildschulebuchs.ch/kurse/Kurse/a
    /div/div

this is the css used:

@media screen and (max-width: 890px){
.efectobotonn {
    width: 90px;
    height: 50px;
    position: relative;
    margin: auto;
    left:-50px!important;
    top:65px!important;
    font-size: 24px!important;
    font-family: 'Roboto Mono', -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;
    border-radius: 10px;
    border: 2px solid #000;
    padding: 5px;
    border-style: dashed;
    color:#000!important;
    z-index:100;
    background-color: #fff;
}
}

I don't know if I have to call a php function to make it work, but I don't know which one, and it works on some devices but not on others

If you could help me I would appreciate it very much