Hi!
The problem is that the logo container is not a flexible element, so it’s hard to place it there without the theme authors suggestions.
I placed the 4th search instance to the file you suggested and applied the following custom CSS rules:
[html]#ajaxsearchpro4_1 {
display: block;
vertical-align: middle;
flex-grow: 1;
flex-basis: 500px;
}
#ajaxsearchpro4_1 .probox svg {
vertical-align: top !important;
}
.header-logo {
display: inline-block;
width: auto;
}
.add-header-height {
justify-content: center;
display: flex;
align-items: flex-start;
align-items: center;
}[/html]
This changes the logo container to a display: flex; element, which allows growing/shrinking based on the screen width. (these rules you can find on the Custom CSS section of the 4th search instance). This is not a final solution, you will have to test different resolutions as well. I’m way beyond my support duties helping you with the customizations, I hope you understand.
I also suggest asking the theme developer in case you need a better suggestion on where to exactly put the module, he might know much better implementation than I do.