When you load your company logo into EvolutionX, it will automatically scale down to around 100px 50px. If you would like to increase the size of your logo, you can do this by applying some simple CSS. The code required is as follows;

☝🏽First try to use the Widget settings for the logo in your header layout.

If this doesn't work. You can use the below

For Desktops

.header-full .logo img {
/* Change this for desktop */
    max-width: 350px !important;
    height: auto !important;
    max-height: none !important;
}

For Mobile

@media only screen and (max-width: 425px){
header .header-mobile .logo img {
/* change this for mobile portrait view */
    max-width: 150px;
}
}
@media only screen and (max-width: 768px){
header .header-mobile .logo img {
/* change this for mobile landscape view */
    max-width: 200px;
}
}

⚠️ Important: If you increase your logo too large you will need to increase the background header.

To increase the size of your background header, simply paste in the coding below;

.header-full>.container {
height: 120px;
}

.header-full .logo img {
max-width: 245px !important;
max-height: 120px !important;
width: auto !important;
}

header .header-full .logo {
margin: 0px;

}

Simply copy the code - click on appearance>theme options and scroll down to the CSS block area - paste your code in here!

Don't forget to publish your changes and check in all screen sizes!

To make some tweaks simply alter the pixel size (in the above example,350px) to resize your logo!

Hey presto, your logo should now appear larger on your webstore!