Hello,
I took over this site from another developer and he had a discombobulated amount of code from a prior layout. Can someone please advise on how to remove the logo from the mobile responsive menu, center it at the top of page and center menu button below (keeping left aligned buttons)?
Here are the media queries I am looking at:
@media screen and (max-width: 1030px) {
.s-logo img {
width:145px!important;
height:125px!important;
}
}
@media screen and (max-width: 855px) {
.home-logo img {
width:275px!important;
height:237px!important;
}
.page .masthead-stacked .x-navbar:not(homepage) {
text-align:right;
}
.portfolio .masthead-stacked .x-navbar:not(homepage) {
text-align:center;
}
}
@media screen and (max-width: 710px) {
.s-logo img {
width:100px!important;
height:86px!important;
}
}
@media screen and (max-width: 600px) {
.home-logo img {
width:200px!important;
height:172px!important;
}
}
@media screen and (max-width: 510px) {
.home-logo img {
width:145px!important;
height:125px!important;
}
.homepage .x-btn-navbar {
margin-top:0;
}
.s-logo img {
width:75px!important;
height:65px!important;
}
}
@media screen and (max-width: 381px) {
.s-logo img {
width:50px!important;
height:43px!important;
}
}
@media screen and (max-width: 367px) {
.homepage .masthead-stacked .x-navbar {
text-align:right;
}
}
@media (max-width: 979px){
.x-feature-box-graphic-inner {
width: 100%;
}
}
Thanks!