Shopify template CSS/HTML amends

General information for the website: We are updating the design of our website and require some Shopify template changes
Kind of development: Customization of existing website
Description of requirements/features: We would like to edit our Shopify theme, which is a clean version of this Shopify template: https://elda-theme.myshopify.com.

We would like to change the header and menu bar section of the template, so that it looks and works similar to the one on www.onekingslane.com.

I have mocked this up in the attachment to show how it should look. I have also written a detailed description below to help describe what I'm after:

- Menu bar fonts/style/size to be the same as onekingslane.com. This is called Proxima Nova Semibold, and I have already added this font to my TypeKit package.

- I have mocked up the header that I would like - it’s almost identical to that on onekingslane.com with the following changes:

a. The left side of the bar to have ‘Our story’, ‘Delivery/Returns’ and ‘Contact us’ links alongside the little icons. On the right side (separated by the little grey vertical line) will be the menu options from my Shopify menu options. You can hard code the left-hand links, and have the right-hand ones dynamically placed from the Shopify menu option set-up. The design of the drop-down menus can remain as they are already coded in the theme.

b. Please make the search box look exactly the same as in the mock-up.

c. Please add the ‘Call free…’ etc text to the right of the search box (in same style as on my current site template) then the basket icon which, when clicked, initiates the cart view slider (this is a button on the current template - see current site template (www.shrops-design.co.uk) to see how this works). If there are items in the cart, please can the cart icon display with a small blue dot and the number of items in the cart – I have mocked this up.

d. The ‘Shropshire Design’ logo is attached, as is the watercolour background image.

e. The menu should be the same width as the template’s page content width, so will be a little wider than the mock-up.

Mobile responsiveness:

f. The template is mobile responsive. The menu should adapt to the width by adjusting the spacing of each menu option (like onekingslane.com). If the header/menu can no-longer fit, please trigger the mobile menu (the resolution that currently triggers this is 767px, but I think this may have to be bigger). I have mock-up how I would like this to look, see attached.

g. On small (mobile) screens, you can remove the ‘call us’ text so that only the menu icon, logo and shopping cart icon appears.

h. The template already has a menu that slides in from the left-hand side so please make the menu icon trigger this.
Extra notes: I will provide you with access to the Shopify back-end to make the edits.

I am looking for an excellent English speaker and also will be asking the successful bidder to help with other code edits once the menu is complete.

I am looking for clean, commented code, so we can identify the customisations.

This needs to be completed in 1 week including snags/bug fixes.

The images/icons you need are attached. They are all to be used as retina/HD images.