Logo al centro responsive

Ciao a tutti,
sto lavorando su un sito, in locale, con un tema della vamtam.
Ho notato che il logo, posto nell’header, è al centro nella versione desktop mentre è allineato a sinistra per versioni mobile e tablet. Vorrei invece averlo sempre al centro.
Qualcuno riesce a darmi una mano?
Grazie mille anticipatamente

Andando sul widget e su general setting trovo attualmente il seguente css:

.screens .linkarea img{
box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.10);
transition: all .3s ease;
border-radius: 2px;
}

.screens .linkarea img:hover {
box-shadow: 0px 2px 20px 0px rgba(0,0,0,0.16);
margin-top: -10px;
}
.page-id-9611 #style-switcher{
display: none;
}

.w-header {
text-align: center;
}
.w-header .grid-1-5{
display: inline-block;
float: none;
vertical-align: top:
}
.w-header h3{
margin: 0px;
font-weight: 600;
color: #fff;
}
.w-header p{
margin-top: 0.5em
}
.w-header .sep-3{
opacity: 0.2;
}
.w-header h1, .w-header h4, .w-header p, .w-white{
color: #fff !important;
}

.page-id-9611 h1{
font: normal 3em/1em “Libre Baskerville”;
letter-spacing: 0.3em;
}
.page-id-9611 h2{
font: normal 2.4em/1em “Libre Baskerville”;
color: #7C8A8D;
margin-bottom: 10px;
}

.big-text {
font-size: 1em;
line-height: 1em;
font-weight: 100;
}

.plugin-logos img{
padding: 0px 20px;
display: inline-block;
}

.more-testimonials{
border: solid 1px #EDEDED;
text-align: center;
padding: 20px 30px;
border: 1px solid #D9D9D9;
}
.more-testimonials h3{
margin-bottom: 9px;
margin-top: 6px;
}
.more-testimonials p{
margin-top: 0px;
}
.dark-bg h2{
color: #fff !important;
}

@media (max-width: 958px){
.twitter-button{
margin-bottom: 20px;
}
.w-header h1{
font-size: 1.8em;
}
.w-hide-bg{
padding:0px !important;
background-image: none !important;
}
.dark-bg{
background-image: none !important;
}

.w-mobile-hide{
display: none;
}
.w-hide-bg .push{
display: none;
}
}