Index: /views/css/frontend.css
===================================================================
--- /views/css/frontend.css	(revision 8351)
+++ /views/css/frontend.css	(revision 8353)
@@ -559,5 +559,26 @@
 
 /* wpsg_mod_prepayment - QR-Code auf Bestellabschlussseite */
+.wpsg_mod_prepayment_info_wrap { display:flex; justify-content:center; flex-direction:column; gap:20px; }
 .wpsg_mod_prepayment_info { display: flex; gap: 20px; border: 1px solid #000000; padding: 20px; }
+.wpsg_mod_prepayment_info h4{ margin: 0; }
 .wpsg_mod_prepayment_info_left { display: flex; flex-direction: column; }
-.wpsg_mod_prepayment_info h4{ margin: 0; }
+.wpsg_mod_prepayment_info_left_qrcodeimg { width:240px; height:240px; }
+.wpsg_mod_prepayment_info_left_wrap { display:flex; gap:25%; }
+.wpsg_mod_prepayment_info_left_currency { display:flex; flex-direction:column; }
+.wpsg_mod_prepayment_info_left_amount { display:flex; flex-direction:column; }
+
+.wpsg_mod_prepayment_girocode { display: flex; gap: 20px; border: 1px solid #000000; padding: 20px;}
+.wpsg_mod_prepayment_girocode h4{ margin: 0; }
+.wpsg_mod_prepayment_girocode_left { display: flex; flex-direction: column; }
+.wpsg_mod_prepayment_girocode_left_qrcodeimg { width:240px; height:240px; }
+.wpsg_mod_prepayment_girocode_left_wrap { display:flex; gap:25%; }
+.wpsg_mod_prepayment_girocode_left_currency { display:flex; flex-direction:column; }
+.wpsg_mod_prepayment_girocode_left_amount { display:flex; flex-direction:column; }
+
+.wpsg_mod_prepayment_qrrechnung { display: flex; gap: 20px; border: 1px solid #000000; padding: 20px; }
+.wpsg_mod_prepayment_qrrechnung h4{ margin: 0; }
+.wpsg_mod_prepayment_qrrechnung_left { display: flex; flex-direction: column; }
+.wpsg_mod_prepayment_qrrechnung_left_qrcodeimg { width:240px; height:240px; }
+.wpsg_mod_prepayment_qrrechnung_left_wrap { display:flex; gap:25%; }
+.wpsg_mod_prepayment_qrrechnung_left_currency { display:flex; flex-direction:column; }
+.wpsg_mod_prepayment_qrrechnung_left_amount { display:flex; flex-direction:column; }
Index: /views/mods/mod_prepayment/order_done.phtml
===================================================================
--- /views/mods/mod_prepayment/order_done.phtml	(revision 8351)
+++ /views/mods/mod_prepayment/order_done.phtml	(revision 8353)
@@ -34,26 +34,28 @@
 		?>
 
-		<div style="display: flex; justify-content: center; flex-direction: column; gap: 20px;">
+		<div class="wpsg_mod_prepayment_info_wrap">
 			<?php foreach ($img as $i) { ?>
-				<div class="wpsg_mod_prepayment_info" style="display: flex; gap: 20px; border: 1px solid #000; padding: 20px;">
-					<div class="wpsg_mod_prepayment_info_left" style="display: flex; flex-direction: column;">
-						<h4 style="margin: 0;"><?php echo wpsg_translate(__($i['title'], $wpsg)); ?></h4>
-						<?php if (isset($i['filepath'])) { ?><a title="Downloadlink fÃŒr die QR-Rechnung" style="box-shadow:none; font-size:smaller; font-style:italic; text-decoration:underline;" target="_blank" href="<?php echo $this->callMod('wpsg_mod_prepayment', 'getFrontendLink', [$i['order_id']]); ?>">Download</a><?php } ?>
+				<div class="wpsg_mod_prepayment_info">
+					<div class="wpsg_mod_prepayment_info_left">
+                    <div class="wpsg_mod_prepayment_info_left_qr-download">
+						<h4><?php echo wpsg_translate(__($i['title'], $wpsg)); ?></h4>
+						<?php if (isset($i['filepath'])) { ?><a title="Downloadlink fÃŒr die QR-Rechnung" target="_blank" href="<?php echo $this->callMod('wpsg_mod_prepayment', 'getFrontendLink', [$i['order_id']]); ?>"><i class="fa fa-download" aria-hidden="true"></i></a><?php } ?>
+                    </div>	
+                        <br />
+						<?php echo '<img class="wpsg_mod_prepayment_info_left_qrcodeimg" src="data:image/png;base64,'.$i['hash'].'" />'; ?>
 						<br />
-						<?php echo '<img style="width: 240px; height:240px;" src="data:image/png;base64,'.$i['hash'].'" />'; ?>
-						<br />
-						<div style="display: flex; gap: 25%;">
-							<div style="display: flex; flex-direction: column;">
-								<h4 style="margin: 0;"><?php echo wpsg_translate(__('WÃ€hrung', $wpsg)); ?></h4>
+						<div class="wpsg_mod_prepayment_info_left_wrap">
+							<div class="wpsg_mod_prepayment_info_left_currency">
+								<h4><?php echo wpsg_translate(__('WÃ€hrung', $wpsg)); ?></h4>
 								<?php echo $this->get_option('wpsg_currency'); ?>
 							</div>
-							<div style="display: flex; flex-direction: column;">
-								<h4 style="margin: 0;"><?php echo wpsg_translate(__('Betrag', $wpsg)); ?></h4>
+							<div class="wpsg_mod_prepayment_info_left_amount">
+								<h4><?php echo wpsg_translate(__('Betrag', $wpsg)); ?></h4>
 								<?php echo sprintf("%.2f", $i['invoiceAmount']); ?>
 							</div>
 						</div>
 					</div>
-					<div class="wpsg_mod_prepayment_info_right" style="display: flex; flex-direction: column;">
-						<h4 style="margin: 0;"><?php echo wpsg_translate(__('Konto / Zahlbar an', $wpsg)); ?></h4>
+					<div class="wpsg_mod_prepayment_info_right">
+						<h4><?php echo wpsg_translate(__('Konto / Zahlbar an', $wpsg)); ?></h4>
 						<?php echo $this->replaceUniversalPlatzhalter($this->get_option('wpsg_mod_prepayment_iban')); ?><br />
 						<?php echo $this->replaceUniversalPlatzhalter($this->get_option('wpsg_mod_prepayment_kinhaber')); ?><br />
@@ -61,10 +63,10 @@
 						<?php echo $this->replaceUniversalPlatzhalter($this->get_option('wpsg_shopdata_zip')).' '.$this->replaceUniversalPlatzhalter($this->get_option('wpsg_shopdata_city')); ?><br />
 						<?php if (!empty($i['referenceNumber'])) { ?>
-							<h4 style="margin: 0;"><?php echo wpsg_translate(__('Referenz', $wpsg)); ?></h4>
+							<h4><?php echo wpsg_translate(__('Referenz', $wpsg)); ?></h4>
 							<?php echo $i['referenceNumber']; ?><br />
 						<?php } ?>
-						<h4 style="margin: 0;"><?php echo wpsg_translate(__('ZusÃ€tzliche Informationen', $wpsg)); ?></h4>
+						<h4><?php echo wpsg_translate(__('ZusÃ€tzliche Informationen', $wpsg)); ?></h4>
 						<?php echo $i['additionalInformation']; ?><br /> 
-						<h4 style="margin: 0;"><?php echo wpsg_translate(__('Zahlbar durch', $wpsg)); ?></h4>
+						<h4><?php echo wpsg_translate(__('Zahlbar durch', $wpsg)); ?></h4>
 						<?php echo $i['customerdata']['vname'].' '.$i['customerdata']['name']; ?><br />
 						<?php echo $i['customerdata']['strasse'].' '.$i['customerdata']['nr']; ?><br />
@@ -91,23 +93,23 @@
 		?>
 
-		<div class="wpsg_mod_prepayment_girocode" style="display: flex; gap: 20px; border: 1px solid #000; padding: 20px;">
-			<div class="wpsg_mod_prepayment_girocode_left" style="display: flex; flex-direction: column;">
-				<h4 style="margin: 0;"><?php echo wpsg_translate(__($img['title'], $wpsg)); ?></h4>
+		<div class="wpsg_mod_prepayment_girocode">
+			<div class="wpsg_mod_prepayment_girocode_left" >
+				<h4><?php echo wpsg_translate(__($img['title'], $wpsg)); ?></h4>
 				<br />
-				<?php echo '<img style="width: 240px; height:240px;" src="data:image/png;base64,'.$img['hash'].'" />'; ?>
+				<?php echo '<img class="wpsg_mod_prepayment_girocode_left_qrcodeimg" src="data:image/png;base64,'.$img['hash'].'" />'; ?>
 				<br>
-				<div style="display: flex; gap: 25%;">
-					<div style="display: flex; flex-direction: column;">
-						<h4 style="margin: 0;"><?php echo wpsg_translate(__('WÃ€hrung', $wpsg)); ?></h4>
+				<div class="wpsg_mod_prepayment_girocode_left_wrap">
+					<div class="wpsg_mod_prepayment_girocode_left_currency">
+						<h4><?php echo wpsg_translate(__('WÃ€hrung', $wpsg)); ?></h4>
 						<?php echo $this->get_option('wpsg_currency'); ?>
 					</div>
-					<div style="display: flex; flex-direction: column;">
-						<h4 style="margin: 0;"><?php echo wpsg_translate(__('Betrag', $wpsg)); ?></h4>
+					<div class="wpsg_mod_prepayment_girocode_left_amount">
+						<h4><?php echo wpsg_translate(__('Betrag', $wpsg)); ?></h4>
 						<?php echo sprintf("%.2f", $img['invoiceAmount']); ?>
 					</div>
 				</div>
 			</div>
-			<div class="wpsg_mod_prepayment_girocode_right" style="display: flex; flex-direction: column;">
-				<h4 style="margin: 0;"><?php echo wpsg_translate(__('Konto / Zahlbar an', $wpsg)); ?></h4>
+			<div class="wpsg_mod_prepayment_girocode_right">
+				<h4><?php echo wpsg_translate(__('Konto / Zahlbar an', $wpsg)); ?></h4>
 				<?php echo $this->replaceUniversalPlatzhalter($this->get_option('wpsg_mod_prepayment_iban')); ?><br />
 				<?php echo $this->replaceUniversalPlatzhalter($this->get_option('wpsg_mod_prepayment_kinhaber')); ?><br />
@@ -115,10 +117,10 @@
 				<?php echo $this->replaceUniversalPlatzhalter($this->get_option('wpsg_shopdata_zip')).' '.$this->replaceUniversalPlatzhalter($this->get_option('wpsg_shopdata_city')); ?><br />
 				<?php if (!empty($img['referenceNumber'])) { ?>
-					<h4 style="margin: 0;"><?php echo wpsg_translate(__('Referenz', $wpsg)); ?></h4>
+					<h4><?php echo wpsg_translate(__('Referenz', $wpsg)); ?></h4>
 					<?php echo $img['referenceNumber']; ?><br />
 				<?php } ?>
-				<h4 style="margin: 0;"><?php echo wpsg_translate(__('ZusÃ€tzliche Informationen', $wpsg)); ?></h4>
+				<h4><?php echo wpsg_translate(__('ZusÃ€tzliche Informationen', $wpsg)); ?></h4>
 				<?php echo $img['additionalInformation']; ?><br /> 
-				<h4 style="margin: 0;"><?php echo wpsg_translate(__('Zahlbar durch', $wpsg)); ?></h4>
+				<h4><?php echo wpsg_translate(__('Zahlbar durch', $wpsg)); ?></h4>
 				<?php echo $img['customerdata']['vname'].' '.$img['customerdata']['name']; ?><br />
 				<?php echo $img['customerdata']['strasse'].' '.$img['customerdata']['nr']; ?><br />
@@ -138,24 +140,23 @@
 		?>
 		
-		<div class="wpsg_mod_prepayment_qrrechnung" style="display: flex; gap: 20px; border: 1px solid #000; padding: 20px;">
-			<div class="wpsg_mod_prepayment_qrrechnung_left" style="display: flex; flex-direction: column;">
-				<h4 style="margin: 0;"><?php echo wpsg_translate(__($img['title'], $wpsg)); ?></h4>
-				<?php if (isset($i['filepath'])) { ?><a title="Downloadlink fÃŒr die QR-Rechnung" style="box-shadow:none; font-size:smaller; font-style:italic; text-decoration:underline;" target="_blank" href="<?php echo $this->callMod('wpsg_mod_prepayment', 'getFrontendLink', [$i['order_id']]); ?>">Download</a><?php } ?>
+		<div class="wpsg_mod_prepayment_qrrechnung">
+			<div class="wpsg_mod_prepayment_qrrechnung_left">
+				<h4><?php echo wpsg_translate(__($img['title'], $wpsg)); ?></h4>
 				<br />
-				<?php echo '<img style="width: 240px; height:240px;" src="data:image/png;base64,'.$img['hash'].'" />'; ?>
+				<?php echo '<img class="wpsg_mod_prepayment_qrrechnung_left_qrcodeimg" src="data:image/png;base64,'.$img['hash'].'" />'; ?>
 				<br>
-				<div style="display: flex; gap: 25%;">
-					<div style="display: flex; flex-direction: column;">
-						<h4 style="margin: 0;"><?php echo wpsg_translate(__('WÃ€hrung', $wpsg)); ?></h4>
+				<div class="wpsg_mod_prepayment_qrrechnung_left_wrap">
+					<div class="wpsg_mod_prepayment_qrrechnung_left_currency">
+						<h4><?php echo wpsg_translate(__('WÃ€hrung', $wpsg)); ?></h4>
 						<?php echo $this->get_option('wpsg_currency'); ?>
 					</div>
-					<div style="display: flex; flex-direction: column;">
-						<h4 style="margin: 0;"><?php echo wpsg_translate(__('Betrag', $wpsg)); ?></h4>
+					<div class="wpsg_mod_prepayment_qrrechnung_left_amount">
+						<h4><?php echo wpsg_translate(__('Betrag', $wpsg)); ?></h4>
 						<?php echo sprintf("%.2f", $img['invoiceAmount']); ?>
 					</div>
 				</div>
 			</div>
-			<div class="wpsg_mod_prepayment_qrrechnung_right" style="display: flex; flex-direction: column;">
-				<h4 style="margin: 0;"><?php echo wpsg_translate(__('Konto / Zahlbar an', $wpsg)); ?></h4>
+			<div class="wpsg_mod_prepayment_qrrechnung_right">
+				<h4><?php echo wpsg_translate(__('Konto / Zahlbar an', $wpsg)); ?></h4>
 				<?php echo $this->replaceUniversalPlatzhalter($this->get_option('wpsg_mod_prepayment_iban')); ?><br />
 				<?php echo $this->replaceUniversalPlatzhalter($this->get_option('wpsg_mod_prepayment_kinhaber')); ?><br />
@@ -163,10 +164,10 @@
 				<?php echo $this->replaceUniversalPlatzhalter($this->get_option('wpsg_shopdata_zip')).' '.$this->replaceUniversalPlatzhalter($this->get_option('wpsg_shopdata_city')); ?><br />
 				<?php if (!empty($img['referenceNumber'])) { ?>
-					<h4 style="margin: 0;"><?php echo wpsg_translate(__('Referenz', $wpsg)); ?></h4>
+					<h4><?php echo wpsg_translate(__('Referenz', $wpsg)); ?></h4>
 					<?php echo $img['referenceNumber']; ?><br />
 				<?php } ?>
-				<h4 style="margin: 0;"><?php echo wpsg_translate(__('ZusÃ€tzliche Informationen', $wpsg)); ?></h4>
+				<h4><?php echo wpsg_translate(__('ZusÃ€tzliche Informationen', $wpsg)); ?></h4>
 				<?php echo $img['additionalInformation']; ?><br /> 
-				<h4 style="margin: 0;"><?php echo wpsg_translate(__('Zahlbar durch', $wpsg)); ?></h4>
+				<h4><?php echo wpsg_translate(__('Zahlbar durch', $wpsg)); ?></h4>
 				<?php echo $img['customerdata']['vname'].' '.$img['customerdata']['name']; ?><br />
 				<?php echo $img['customerdata']['strasse'].' '.$img['customerdata']['nr']; ?><br />
