[TwentyFourteen] Template for password protected pages

Hi!

I haven’t got too much experience with themes and templates in WordPress. I’ve found a template for password protected sites, originally to be found at https://www.smart-webentwicklung.de/2013/07/wordpress-template-fuer-passwortgeschuetze-seite-erstellen/. This wouldn’t work well with TwentyFourteen, because it would be covered by the secondary navigation.

So, I’ve tried to adapt the template by adding some parts of page templates of the original TwentyFourteen theme. Now, the content doesn’t display at the right position. Moreover, the secondary menu is way off to the left side. The site I’ve used the template on is https://www.altenheim-wahlscheid.de/test/.

Any ideas where I was wrong?

<?php
/* 
* Template Name: Passwortgeschütze Seite
*/ 

get_header();
?>

<div id="main-content" class="main-content">
	<div id="primary" class="content-area">
		<div id="content" class="site-content" role="main">
			<?php
				if(have_posts())
					{
						while(have_posts())
							{
								the_post(); ?>
								<article>
									<h2><a href="<?php the_permalink() ?>" title="Seite: <?php the_title(); ?>"><?php the_title(); ?></a></h2>
									<?php if(post_password_required()) { ?>
									<p>
										Hier k?nnt ihr euren Besuchern mitteilen, dass zur Ansicht der Seite ein Passwort n?tig ist. 
									</p>
									<form method="post" action="/wp-login.php?action=postpass">
										<fieldset>
											<legend>Anmeldung</legend>
											<label for="pwbox-<?php the_ID(); ?>">Passwort:</label>
											<input id="pwbox-<?php the_ID(); ?>" type="password" name="post_password"/>
										</fieldset>
										<p>
											<input type="submit" value="Anmelden" name="Submit" />
										</p>
									</form>
									<?php } else { ?>
									<?php the_content(); ?>
									<?php } ?>
								</article>
							<?php
 							   }
					}
get_sidebar();
get_footer(); 
?>