Logo doesn't center in smaller screen

I found out that the width of the logo has to be set up. I don’t know exactly how much it should be. I just take random number and see which works.

In order to work with chrome, it only needs a configuration for the max-width:992 but in order to work also with firefox it takes both max-width:992 & max-width:767.

Since I’m not a developer I don’t know whether this css a cross browser one.

@media (max-width:992px) {
header #thelogo {
margin-left: auto;
margin-right: auto;
width:100px !important;
}
.belowlogo-text {
text-align: center;
padding-left: 0 !important;
}

@media (max-width:767px) {
header #thelogo {
margin-left: auto;
margin-right: auto;
width:100px !important;
}
.belowlogo-text {
text-align: center;
padding-left: 0 !important;
}

Are you using a retina logo?

Can you post a link?

Kadence Themes

I use both the logo and retina logo.
The Link
https://feju-fashion.com

ok, adding this should make it work:

@media (max-width:767px) {
#logo .kad-retina-logo {
margin-left: auto;
margin-right: auto;
}
}