Layout issues on mobile

Yes this can be fixed by increasing or removing the max-height on line 1550 in your style.css file –

.front-page-1 {
    max-height: 740px;
    position: relative;
}

The max-height was added by default in the theme for the first Front-Page-1 widget to make sure the background image doesn’t take up too much space. This is only useful if you’re trying to recreate the way the Front-Page-1 and Front-Page-2 Widgets look in the demo – http://demo.appfinite.net/aspire/

It looks like you won’t need your Front-Page-1 widget to be a limited height, so I would remove that code so your entire widget is shown.

“Secondly how can I assign a background image where there is non in the customizer?”

Are you talking about the Widget locations with the Solid Color Backgrounds? (White/Dark)
We can still add those, but they would have to either be added manually through CSS, or you can add them as an option in the Theme’s PHP files.

In the customizer Theme files, we can add in those specific widgets to have the background image uploader, but that requires editing 2 PHP files. If you don’t want to mess with the PHP code, then you can still add them in through CSS as a background image. Either way it’s pretty easy to do, just let me know which one you’re comfortable with.

One more thing, I thought I added this yesterday. If you look around line 1555 you’ll see this code –

.front-page-1 {
    height: 100vh;
}

Once you remove that then the height should return back to normal.

Also, I would remove the Parallax effect since your images aren’t large enough for the content you have. If you have a background image that moves with the Parallax style, then that means the image needs to be large enough to cover the height of the text/content. If you have too much text/content and the background image isn’t large enough, then the image will stop at a certain point while the content keeps going. If you remove the Parallax effect, then this will allow the background image to resize and cover the entire area of the content without looking “cut off”.

The parallax effect can be disabled on the front-page.php file. Looks like this –

		//* Enqueue parallax script
		add_action( 'wp_enqueue_scripts', 'aspire_enqueue_parallax_script' );
		function aspire_enqueue_parallax_script() {

			if ( ! wp_is_mobile() ) {

				wp_enqueue_script( 'parallax-script', get_bloginfo( 'stylesheet_directory' ) . '/js/parallax.js', array( 'jquery' ), '1.0.0' );

			}

		}

********************************************************************************

For front-page-6 add .solid-section right after like this –

.front-page-6 .solid-section {
    background-image: url(http://toedeloe.codebase.space/wp-content/uploads/2017/09/geschenken.jpg);
}

The .solid-section class is a div that displays a white background that shows up on line 1508 for every widget area you see with a white background. If you add a background image to front-page-6 then the solid section div shows up on top of it. So we would need to override that with the code above.

Let me know if you need help making any of these adjustments.