diff --git a/resources/assets/js/scriptJoinPage.js b/resources/assets/js/scriptJoinPage.js
index 80aed71c643d3dd055beb3803fcc3db268766a57..5c1030c0ae18eeb7ceed8e09ce6e018450c11e72 100644
--- a/resources/assets/js/scriptJoinPage.js
+++ b/resources/assets/js/scriptJoinPage.js
@@ -1,7 +1,7 @@
 function checkFormBeforePrinting () {
   var requiredElements = document.querySelectorAll("[required]");
   var passed = true;
-  for (i = 0; i < requiredElements.length; i++) {
+  for (var i = 0; i < requiredElements.length; i++) {
     if(requiredElements[i].value == "") {
       passed = false;
       requiredElements[i].style.backgroundColor = "#ff9999";
diff --git a/resources/assets/less/metager/beitritt.less b/resources/assets/less/metager/beitritt.less
index 02892cdbfc96135bee9d36bde81519c0d6543911..f658d4e1b425150d0f5d9436a1425675a068955c 100644
--- a/resources/assets/less/metager/beitritt.less
+++ b/resources/assets/less/metager/beitritt.less
@@ -1,120 +1,123 @@
 /* Style für die Druckversion des Beitrittsformulars */
 
-#donation-form {
-    .beitritt-inputs {
-        display: flex;
-        flex-wrap: wrap;
-        >div {
-            width: 50%;
-            padding: 10px;
-        }
-        @media print {
-            padding: 0px;
-            flex-direction: column;
-            flex-wrap: nowrap;
-        }
-    }
-    label {
-        font-weight: normal;
-    }
-    .signature {
-        border-top: 1px dashed black;
-        width: 50%;
-        margin-top: 50px;
+.beitritt-inputs {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  > div {
+    width: 50%;
+    padding: 10px;
+    @media screen and (max-width: 600px) {
+      width: 100%;
     }
+  }
+}
+
+label {
+  font-weight: normal;
+}
+
+.signature {
+  border-top: 1px dashed black;
+  width: 50%;
+  margin-top: 16px;
 }
 
 @media print {
-    .card-heavy {
-        border: none !important;
-        box-shadow: none !important;
+  .card-heavy {
+    border: none !important;
+    margin: 0px 0px 8px 0px !important;
+    padding: 0;
+    -webkit-box-shadow: none !important;
+    box-shadow: none !important;
+    webkit-box-shadow: none !important;
+  }
+  .beitritt-inputs {
+    margin: 0px !important;
+    padding: 0px !important;
+    margin-bottom: 0px !important;
+  }
+  h1 {
+    margin-top: 0 !important;
+    padding-top: 0 !important;
+  }
+  * {
+    font-size: 12px !important;
+  }
+  header {
+    display: none !important;
+  }
+  footer {
+    display: none !important;
+  }
+  hr {
+    display: none !important;
+  }
+  .help-block {
+    text-decoration: none;
+  }
+  input[type="text"],
+  input[type="email"] {
+    font-weight: bold;
+    margin: 0px !important;
+    padding: 0px !important;
+    height: initial !important;
+    border: 0;
+  }
+  /* Passt die Größe der Radio-Buttons an
+     * Skalierung für Firefox, absolut für die anderen Browser 
+     */
+  input[type="radio"] {
+    -webkit-transform: scale(0.5);
+    transform: scale(0.5);
+    width: 20px !important;
+    height: 20px !important;
+    margin-top: 0px !important;
+    padding-top: 0px !important;
+  }
+  /* Blendet die Placeholder aus */
+  input::-webkit-input-placeholder {
+    /* WebKit browsers */
+    color: transparent !important;
+  }
+  input:-moz-placeholder {
+    /* Mozilla Firefox 4 to 18 */
+    color: transparent !important;
+  }
+  input::-moz-placeholder {
+    /* Mozilla Firefox 19+ */
+    color: transparent !important;
+  }
+  input:-ms-input-placeholder {
+    /* Internet Explorer 10+ */
+    color: transparent !important;
+  }
+  .container {
+    width: auto !important;
+    margin: 0px;
+    padding: 0px;
+  }
+  .wrapper {
+    padding: 0 !important;
+    margin: 0 !important;
+  }
+  .sign {
+    margin-top: 10px;
+  }
+  .donation-amount-input {
+    padding-top: 5px;
+  }
+  .pagebreak {
+    page-break-before: always;
+  }
+  #spendenaufruf {
+    display: none !important;
+  }
+  .beitritt-formular-info {
+    * {
+      font-size: 7pt !important;
     }
-    #donation-form {
-        * {
-            font-size: 14px !important;
-        }
-        header {
-            display: none !important;
-        }
-        footer {
-            display: none !important;
-        }
-        h1 {
-            margin-top: 0 !important;
-            padding-top: 0 !important;
-            font-size: 18px !important;
-        }
-        hr {
-            display: none !important;
-        }
-        label {
-            text-decoration: underline;
-        }
-        .help-block {
-            text-decoration: none;
-        }
-        input[type=text],
-        input[type=email] {
-            margin: 0px !important;
-            padding: 0px !important;
-            height: initial !important;
-            border: 0;
-        }
-        /* Passt die Größe der Radio-Buttons an
-         * Skalierung für Firefox, absolut für die anderen Browser 
-         */
-        input[type=radio] {
-            transform: scale(0.5);
-            width: 20px !important;
-            height: 20px !important;
-            margin-top: 0px !important;
-            padding-top: 0px !important;
-        }
-        /* Blendet die Placeholder aus */
-        input::-webkit-input-placeholder {
-            /* WebKit browsers */
-            color: transparent !important;
-        }
-        input:-moz-placeholder {
-            /* Mozilla Firefox 4 to 18 */
-            color: transparent !important;
-        }
-        input::-moz-placeholder {
-            /* Mozilla Firefox 19+ */
-            color: transparent !important;
-        }
-        input:-ms-input-placeholder {
-            /* Internet Explorer 10+ */
-            color: transparent !important;
-        }
-        .container {
-            width: auto !important;
-            margin: 0px;
-            padding: 0px;
-        }
-        .wrapper {
-            padding-top: 0 !important;
-        }
-        * {
-            font-size: 12px!important;
-        }
-        .sign {
-            margin-top: 10px;
-        }
-        .donation-amount-input {
-            padding-top: 5px;
-        }
-        .pagebreak {
-            page-break-before: always;
-        }
-        #spendenaufruf {
-            display: none !important;
-        }
-        .beitritt-formular-info {
-            margin-top: 50px;
-            * {
-                font-size: 7pt !important;
-            }
-        }
-    }
-}
\ No newline at end of file
+  }
+}
diff --git a/resources/assets/less/metager/sidebar.less b/resources/assets/less/metager/sidebar.less
index 95eac30aae3027460dcfc508466ed0a9d69e43d9..db1714c8ac9f18ae788ab988d177f95d9a106b61 100644
--- a/resources/assets/less/metager/sidebar.less
+++ b/resources/assets/less/metager/sidebar.less
@@ -158,7 +158,6 @@ label#openSidebar {
     &:hover {
         color: @metager-orange;
     }
-    .noprint;
 }
 
 @media (max-width: @screen-xs-max) {
diff --git a/resources/views/parts/sidebar.blade.php b/resources/views/parts/sidebar.blade.php
index 4ce31dff1e4bc63cb10ab0195dc7cc81e54c306d..bb95177cd79f168d945c2c23ce8ead1c53f91d9d 100644
--- a/resources/views/parts/sidebar.blade.php
+++ b/resources/views/parts/sidebar.blade.php
@@ -1,5 +1,5 @@
 <input id="sideBarToggle" style="display: none;" type="checkbox">
-<label id="openSidebar" role="button" for="sideBarToggle"></label>
+<label id="openSidebar" class="noprint" role="button" for="sideBarToggle"></label>
 <div class="sideBar">
   <label id="closeSidebar" role="button" for="sideBarToggle"></label>
   <a href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/") }}">
diff --git a/resources/views/spende/beitritt.blade.php b/resources/views/spende/beitritt.blade.php
index 7e560370db4d794643c1fc317d6fd13a8bee1c0a..b52f39cca2dd38931bd8d1d45b0eab760719a799 100644
--- a/resources/views/spende/beitritt.blade.php
+++ b/resources/views/spende/beitritt.blade.php
@@ -5,91 +5,92 @@
 @section('navbarFocus.donate', 'class="dropdown active"')
 
 @section('content')
-	<link type="text/css" rel="stylesheet" href="{{ mix('/css/beitritt.css') }}" />
+	<link type="text/css" rel="stylesheet" href="{{ mix('/css/beitritt.css') }}" />	
+	<script src="{{ mix('js/scriptJoinPage.js') }}"></script>
+<form id="donation-form">
 	<div class="card-heavy">
 		<h1>{{ trans('beitritt.heading.1') }}</h1>
-		<form id="donation-form">
-			<div class="beitritt-inputs">
-				<div>
-					<label for="name">{{ trans('beitritt.beitritt.1') }}</label>
-					<input type="text" class="form-control beitritt-input" name="name" placeholder="{{trans('beitritt.placeholder.1')}}" required>
-				</div>
-				<div>
-					<label for="firma">{{ trans('beitritt.beitritt.2') }}</label>
-					<input type="text" class="form-control beitritt-input" name="firma" placeholder="{{trans('beitritt.placeholder.2')}}">
-				</div>
-				<div>
-					<label for="funktion">{{ trans('beitritt.beitritt.3') }}</label>
-					<input type="text" class="form-control beitritt-input" name="funktion" placeholder="{{trans('beitritt.placeholder.3')}}">
-				</div>
-				<div>
-					<label for="adresse">{{ trans('beitritt.beitritt.4') }}</label>
-					<input type="text" class="form-control beitritt-input" name="adresse" placeholder="{{trans('beitritt.placeholder.4')}}" required>
-				</div>
-				<div>
-					<label for="email">{{ trans('beitritt.beitritt.5') }}</label>
-					<input type="email" class="form-control beitritt-input" name="email" placeholder="">
-				</div>
-				<div>
-					<label for="homepage">{{ trans('beitritt.beitritt.6') }}</label>
-					<input type="text" class="form-control beitritt-input" name="homepage" placeholder="http://">
-				</div>
-				<div>
-					<label for="telefon">{{ trans('beitritt.beitritt.7') }}</label>
-					<input type="text" class="form-control beitritt-input" name="telefon" placeholder="{{trans('beitritt.placeholder.7')}}">
-				</div>
+		<div class="beitritt-inputs">
+			<div>
+				<label for="name">{{ trans('beitritt.beitritt.1') }}</label>
+				<input type="text" class="form-control beitritt-input" name="name" placeholder="{{trans('beitritt.placeholder.1')}}" required>
+			</div>
+			<div>
+				<label for="firma">{{ trans('beitritt.beitritt.2') }}</label>
+				<input type="text" class="form-control beitritt-input" name="firma" placeholder="{{trans('beitritt.placeholder.2')}}">
+			</div>
+			<div>
+				<label for="funktion">{{ trans('beitritt.beitritt.3') }}</label>
+				<input type="text" class="form-control beitritt-input" name="funktion" placeholder="{{trans('beitritt.placeholder.3')}}">
 			</div>
 			<div>
-				<p>{{ trans('beitritt.beitritt.8') }}</p>
-				<input type="text" class="form-control" name="betrag" required>
-				<p> {{ trans('beitritt.beitritt.9') }}</p>
+				<label for="adresse">{{ trans('beitritt.beitritt.4') }}</label>
+				<input type="text" class="form-control beitritt-input" name="adresse" placeholder="{{trans('beitritt.placeholder.4')}}" required>
 			</div>
 			<div>
-				<p>{{ trans('beitritt.beitritt.10') }}</p>
-				<p>{{ trans('beitritt.beitritt.11') }}</p>
+				<label for="email">{{ trans('beitritt.beitritt.5') }}</label>
+				<input type="email" class="form-control beitritt-input" name="email" placeholder="">
 			</div>
 			<div>
-				<input type="radio" name="veröffentlichung" checked> {{ trans('beitritt.beitritt.12') }}
-				<input type="radio" name="veröffentlichung"> {{ trans('beitritt.beitritt.13') }}
+				<label for="homepage">{{ trans('beitritt.beitritt.6') }}</label>
+				<input type="text" class="form-control beitritt-input" name="homepage" placeholder="http://">
 			</div>
 			<div>
-				<div>
-					<label for="ort">{{ trans('beitritt.beitritt.14') }}</label>
-					<input type="text" class="form-control beitritt-input" id="ort" placeholder="">
-				</div>
-				<p class="signature">{{ trans('beitritt.unterschrift') }}</p>
+				<label for="telefon">{{ trans('beitritt.beitritt.7') }}</label>
+				<input type="text" class="form-control beitritt-input" name="telefon" placeholder="{{trans('beitritt.placeholder.7')}}">
+			</div>
+		</div>
+		<div>
+			<p>{{ trans('beitritt.beitritt.8') }}</p>
+			<input type="text" class="form-control beitritt-input" name="betrag" required>
+			<p> {{ trans('beitritt.beitritt.9') }}</p>
+		</div>
+		<div>
+			<p>{{ trans('beitritt.beitritt.10') }}</p>
+			<p>{{ trans('beitritt.beitritt.11') }}</p>
+		</div>
+		<div>
+			<input type="radio" name="veröffentlichung" checked> {{ trans('beitritt.beitritt.12') }}
+			<input type="radio" name="veröffentlichung"> {{ trans('beitritt.beitritt.13') }}
+		</div>
+		<div>
+			<div>
+				<label for="ort">{{ trans('beitritt.beitritt.14') }}</label>
+				<input type="text" class="form-control beitritt-input" id="ort" placeholder="">
 			</div>
+			<br>
+			<p class="signature">{{ trans('beitritt.unterschrift') }}</p>
 		</div>
-		<div class="card-heavy">
-			<div class="newpage"></div>
-			<h1>{{ trans('beitritt.abbuchung.2') }}</h1>
-			<p>{{ trans('beitritt.abbuchung.3') }}</p>
-			<div class="beitritt-inputs">
-				<div>
-					<label for="kontoname">{{ trans('beitritt.abbuchung.4') }}</label>
-					<input type="text" class="form-control" name="kontoname" placeholder="">
-				</div>
-				<div>
-					<label for="bankverbindung">{{ trans('beitritt.abbuchung.5') }}</label>
-					<input type="text" class="form-control" name="bankverbindung" placeholder="">
-				</div>
-				<div>
-					<label for="iban">{{ trans('beitritt.abbuchung.6') }}</label>
-					<input type="text" class="form-control" name="iban" maxlength="22" placeholder="">
-				</div>
-				<div>
-					<label for="bic">{{ trans('beitritt.abbuchung.7') }}</label>
-					<input type="text" class="form-control" name="bic" placeholder="">
-				</div>
+	</div>
+	<div class="card-heavy">
+		<div class="newpage noprint"></div>
+		<h1>{{ trans('beitritt.abbuchung.2') }}</h1>
+		<p>{{ trans('beitritt.abbuchung.3') }}</p>
+		<div class="beitritt-inputs">
+			<div>
+				<label for="kontoname">{{ trans('beitritt.abbuchung.4') }}</label>
+				<input type="text" class="form-control beitritt-input" name="kontoname" placeholder="">
+			</div>
+			<div>
+				<label for="bankverbindung">{{ trans('beitritt.abbuchung.5') }}</label>
+				<input type="text" class="form-control beitritt-input" name="bankverbindung" placeholder="">
+			</div>
+			<div>
+				<label for="iban">{{ trans('beitritt.abbuchung.6') }}</label>
+				<input type="text" class="form-control beitritt-input" name="iban" maxlength="22" placeholder="">
 			</div>
 			<div>
-				<div>
-					<label for="ort2">{{ trans('beitritt.abbuchung.8') }}</label>
-					<input type="text" class="form-control beitritt-input" id="ort2" placeholder="">
-				</div>
-				<p class="signature">{{ trans('beitritt.unterschrift') }}</p>
+				<label for="bic">{{ trans('beitritt.abbuchung.7') }}</label>
+				<input type="text" class="form-control beitritt-input" name="bic" placeholder="">
 			</div>
-		</form>
+		</div>
+		<div>
+			<label for="ort2">{{ trans('beitritt.abbuchung.8') }}</label>
+			<input type="text" class="form-control beitritt-input" id="ort2" placeholder="">
+			<br>
+			<p class="signature">{{ trans('beitritt.unterschrift') }}</p>
+		</div>
+		<hr>
 		<div class="beitritt-formular-info">
 			<p>{{ trans('beitritt.anweisung.1') }}</p>
 			<ul class="dotlist">
@@ -101,6 +102,6 @@
 			<p>{{ trans('beitritt.anweisung.6') }}</p>
 		</div>
 	</div>
+</form>
 	<button type="button" class="noprint js-only btn btn-lg btn-primary" onclick="window.print();">{{ trans('beitritt.anweisung.7') }}</button>
-	<!-- <script src="{{ mix('js/scriptJoinPage.js') }}"></script> -->
 @endsection
diff --git a/webpack.mix.js b/webpack.mix.js
index c7b1272ea7b5c6cb1602b6eb89379e659fd37456..f8fd523975b1abf39d72da6c30d657e924d11004 100644
--- a/webpack.mix.js
+++ b/webpack.mix.js
@@ -26,5 +26,6 @@ mix
   .babel('resources/assets/js/focus-creator.js', 'public/js/focus-creator.js')
   // utility
   .babel(['resources/assets/js/utility.js', 'resources/assets/js/translations.js'], 'public/js/utility.js')
+  .babel('resources/assets/js/scriptJoinPage.js', 'public/js/scriptJoinPage.js')
   .sourceMaps(false, 'inline-source-map')
   .version();
\ No newline at end of file