CSS work on my wordpress site

I am having a hard time figuring out how to fix this problem. My wordpress has a "dark" and a "light" option for the top header where the menu text is either white or dark grey. There is also an option for the logo to be dark or light. However when the website goes to 1024 px the logo doesn't switch colors.

2. related to the same issue, the hamburger mobile menu also doesn't change to dark or light

3. lastly, the telephone link on the top right used to change properly but when I changed the colors of the links on the template it changed it and now it is the wrong color. The funny thing is that it only seems to be a different color on this page and not the rest: http://calgarypetsitters.ca/book-online/

here is the website: http://calgarypetsitters.ca

So to recap, I want my top header logo, hamburger and telephone number to follow the menu and turn dark or light according to the background image.