1. the site title is 20% on desktop and menu area is 80%. Change them like this:
@media screen and (min-width: 1025px){
#site-branding{
width: 20%;
}
.site-navigation{
width: 80%;
}
}this assumes not using the modified css from before to make the mobile menu only appear at a narrower width, so in your case you could use this:
@media screen and (min-width: 769px){
#site-branding{
width: 20%;
}
.site-navigation{
width: 80%;
}
}2. not at the moment no sorry it is quite a major change to get that to work how you want it. Please wait for the next update which will have option to change the break-point for mobile menu.
3. this can be changed by changing the padding at top and bottom of the page title area:
.header-title {
padding-top: 70px;
padding-bottom: 70px;
}the code above will format it on all screen widths, to change it on mobile only use this:
@media screen and (max-width: 768px){
.header-title {
padding-top: 70px;
padding-bottom: 70px;
}
}We’re happy to help with minor CSS modifications but if you are going to be changing a lot of the formatting I would very much recommend looking into using browser inspection tools which you could use to find the right elements to modify. See the links below for more information.