Ansicht für mobile Geräte optimieren

Hallo Liebe Wordpress-Community,

mit folgender Website bin ich eigentlich schon sehr zufrieden: patrick-peter.com
Sobald die Website allerdings auf mobilen Geräten wie Tablets oder Handys angezeigt wird,
beginnt das Chaos. Folgende unschöne Dinge sind mir aufgefallen:

-Das Navigationsmenü im Header wird ersetzt durch einen Navigationsbutton der nicht richtig
funktioniert. Lieber wäre mir, der Text wird abhängig von dem Display kleiner.

-Das Parallax-Bild beginnt oben und unten von neu. Besser wäre es würde ganz normal angezeigt werden.

-Der Text auf der gesamten Website und die MaxButtons skalieren nicht mit der Website

-Der Footer wird dick und die Dinge stehen nicht nebeneinander.

Die Hilfe die ich im AccessPress Parallax Forum bekam war: Buy pro and int edit the Stylesheet.

Vielen Dank schonmal im Voraus :)

Erstmal vielen Dank für eure Hilfe.

Was könnten denn mögliche Fehlerquellen sein? Die Maße des Bildes? bearbeitet habe ich das Parallax per Custom CSS nur mit

#section-10.parallax-section.clearfix.action_template {
border-width: 0px;
height: 90vh;
}

um einen unschönen orangenen rand verschwinden zu lassen und damit sich das Bild über den ganzen Bildschirm erstreckt.

Zitat von Alpha_Leviathan

Erstmal vielen Dank für eure Hilfe.

Was könnten denn mögliche Fehlerquellen sein? Die Maße des Bildes? bearbeitet habe ich das Parallax per Custom CSS nur mit

#section-10.parallax-section.clearfix.action_template {
border-width: 0px;
height: 90vh;
}

um einen unschönen orangenen rand verschwinden zu lassen und damit sich das Bild über den ganzen Bildschirm erstreckt.

Kleinigkeit zum hinzufügen: hier ist mal ein Screenshot von meinen Einstellungen für das Parallax Bild:
[COLOR=#454545][FONT=&quot][size=10]http://www.bilder-upload.eu/show.php?file=…-1518697467.png

Hier nochmal 2 Screenshots des Problems:
[/SIZE][/FONT][/COLOR]
[COLOR=#454545][FONT=&quot][size=10]http://www.bilder-upload.eu/show.php?file=…-1518697640.png[/SIZE][/FONT][/COLOR]
[COLOR=#454545][FONT=&quot][size=10][/SIZE][/FONT][/COLOR]
[COLOR=#454545][FONT=&quot][size=10]http://www.bilder-upload.eu/show.php?file=…-1518697679.png

Dann würde ich gerne noch dieses kleine Viereck entfernen:[/SIZE][/FONT][/COLOR]
[COLOR=#454545][FONT=&quot][size=10]http://www.bilder-upload.eu/show.php?file=…-1518697568.png

und die orangene Farbe hiervon ändern:
[/SIZE][/FONT][/COLOR]
[COLOR=#454545][FONT=&quot]http://www.bilder-upload.eu/show.php?file=…-1518697748.png

Danke schonmal im Voraus :)[/FONT][/COLOR]

Ok das gröbste habe ich jetzt nach stundenlangen ausprobieren hinbekommen.

Das einzige was ich noch ändern möchte ist dass das Parallax-Bild ein bisschen
mitscrollt und nicht statisch bleibt.

Außerdem hätte ich gerne den .menu-toggle button einmal mit anderen farben.
Anstatt einem grauen Kasten mit 3 weißen Streifen hätte ich gerne einen weißen
Kasten mit 3 grauen Streifen.

Und zu guter Letzt wird der Footer ungewöhnlich dick wenn der Bildschirm schmal
genug wird.

Für irgendwelche Vorschläge wäre ich super dankbar :)