Reply To: Custom sticky header?

Hello,

Thank you for using our theme.

We have prepared some CSS code that may do the necessary adjustments on your web-site to make sticky header look as you want to. This part add to Custom CSS section in Theme Settings -> Custom CSS

.sticky-header .container {
    display: flex;
    -webkit-display: flex;
    display: -ms-flex;
    justify-content: space-between;
    -webkit-justify-content: space-between;
    justify-content: -ms-space-between;
    align-items: center;
    -webkit-align-items: center;
    -ms-align-items: center;
    height: auto;
    min-height:60px;
}
.sticky-header .container:after,
.sticky-header .container:before {
    content:none;
}
.sticky-header .right-column,
.sticky-header .main-nav {
    width:40%;
}
.sticky-header .main-nav {
    order: -1;
    -ms-order: -1;
    -webkit-order: -1;
    text-align: left;  
}
.sticky-header .site-logo {
    width:20%;
    text-align: center;
}
.sticky-header .site-logo img {
    max-width:100%;
}

And this part add only for mobile devices

.sticky-header .right-column,
.sticky-header .site-logo {
    width:auto;
}
.sticky-header .right-column {
    flex-shrink: 0;
    -ms-flex-shrink: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
}