Unify HTML templates across test, main, basicConfig

9 files changed, 551 insertions, 797 deletions

diff --git a/connector/src/test/resources/config/properties/messages.properties b/connector/src/test/resources/config/properties/messages.properties
index 2f99d892..3f662ef9 100644
--- a/connector/src/test/resources/config/properties/messages.properties
+++ b/connector/src/test/resources/config/properties/messages.properties
@@ -84,8 +84,8 @@ gui.countryselection.country.ro=Romania
 gui.countryselection.country.ro.logo.alt=Romania-eID
 gui.countryselection.country.sk=Slovakia
 gui.countryselection.country.sk.logo.alt=Slovakia-eID
-gui.countryselection.country.sw=Sweden
-gui.countryselection.country.sw.logo.alt=Sweden-eID
+gui.countryselection.country.se=Sweden
+gui.countryselection.country.se.logo.alt=Sweden-eID
 gui.countryselection.country.uk=United Kingdom
 gui.countryselection.country.uk.logo.alt=United Kingdom-eID
 
@@ -97,17 +97,19 @@ gui.countryselection.mode.qs=QS
 gui.countryselection.mode.test=Test
 gui.countryselection.mode.dev=Development
 
+##Other Login Methods page
+gui.otherlogin.title=eIDAS-Login Other Login Methods
+gui.otherlogin.header.selection=Select an alternative login method
+gui.otherlogin.hs=Mobile Signature ("Handy-Signatur")
+gui.otherlogin.eidas=Alternative eIDAS ID
+gui.otherlogin.none=No alternative login methods
+gui.otherlogin.cancel=Cancel
 
 ##Austrian Residency page
 gui.residency.title=Austrian Residency
-gui.residency.logo.bmi.alt=Logo BMI
-gui.residency.link.bmi=Mainpage BMI
-gui.residency.header1=Federal Ministry of Internal Affairs
-gui.residency.header2=Austrian Central eIDAS Node
-gui.residency.header3=Operated by Federal Ministry of Internal Affairs
 gui.residency.header.selection=Search for your Austrian Residency
 gui.residency.header.help=You can search for the address that you have been registered at in the past. Please enter a \
-  Municipality or Village first to start the search.
+  postcode, municipality or village first to start the search.
 gui.residency.header.inputinvalid=Be sure to enter a value for Municipality or Village
 gui.residency.cancel=Cancel
 gui.residency.search=Search
diff --git a/connector/src/test/resources/config/properties/messages_de.properties b/connector/src/test/resources/config/properties/messages_de.properties
index ead751d0..c0f3c9a5 100644
--- a/connector/src/test/resources/config/properties/messages_de.properties
+++ b/connector/src/test/resources/config/properties/messages_de.properties
@@ -85,8 +85,8 @@ gui.countryselection.country.ro=Romänien
 gui.countryselection.country.ro.logo.alt=Romänische-eID
 gui.countryselection.country.sk=Slovakei
 gui.countryselection.country.sk.logo.alt=Slovakische-eID
-gui.countryselection.country.sw=Schweden
-gui.countryselection.country.sw.logo.alt=Schwedische-eID
+gui.countryselection.country.se=Schweden
+gui.countryselection.country.se.logo.alt=Schwedische-eID
 gui.countryselection.country.uk=Großbritanien
 gui.countryselection.country.uk.logo.alt=Britische-eID
 
@@ -98,17 +98,19 @@ gui.countryselection.mode.qs=Qualitätsicherung
 gui.countryselection.mode.test=Test
 gui.countryselection.mode.dev=Development
 
+##Other Login Methods page
+gui.otherlogin.title=eIDAS-Login Alternative Anmeldemethoden
+gui.otherlogin.header.selection=Wählen Sie eine alternative Anmeldemethode
+gui.otherlogin.hs=Handy-Signatur
+gui.otherlogin.eidas=Alternativer eIDAS Login
+gui.otherlogin.none=Keine
+gui.otherlogin.cancel=Abbrechen
 
 ##Austrian Residency page
 gui.residency.title=Österreichischer Wohnsitz
-gui.residency.logo.bmi.alt=Logo BMI
-gui.residency.link.bmi=Startseite BMI
-gui.residency.header1=Bundesministerium für Inneres
-gui.residency.header2=Zentraler eIDAS Knoten der Republik Österreich
-gui.residency.header3=Betrieben durch das Bundesministerium für Inneres
 gui.residency.header.selection=Suche nach Österreichischem Wohnsitz
 gui.residency.header.help=Hier können Sie nach einem Wohnsitze in Österreich suchen. Bitte geben Sie zuerst eine \
-  Gemeinde oder Ortschaft ein um die Suche zu starten.
+  Postleitzahl, Gemeinde oder Ortschaft ein um die Suche zu starten.
 gui.residency.header.inputinvalid=Bitte geben Sie einen Wert für Gemeinde oder Ortschaft ein
 gui.residency.cancel=Abbrechen
 gui.residency.search=Suche
diff --git a/connector/src/test/resources/config/templates/countrySelection.html b/connector/src/test/resources/config/templates/countrySelection.html
index 2483030b..e196cd31 100644
--- a/connector/src/test/resources/config/templates/countrySelection.html
+++ b/connector/src/test/resources/config/templates/countrySelection.html
@@ -4,233 +4,266 @@
       layout:decorator="fragments/base"
       th:with="lang=${#locale.language}" th:lang="${lang}">
 <head>
-  <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <link rel="stylesheet" href="$contextPath/static/css/css_country.css" th:href="@{/static/css/css_country.css}"/>
-  <title th:text="#{gui.countryselection.title}">eIDAS-Login Länderauswahl</title>
-<script type="text/javascript">
-</script>
-<style>
-body {
-	background-image: none;
-	margin:		0px;
-	font-family:	"Helvetica Neue", Helvetica, Arial, sans-serif;
-}
-
-div.header {
-	background-color: #e9ecef;
-	padding-top: 28px;
-	padding-left: 137px;
-	padding-right: 137px;
-	padding-bottom: 12px;
-}
-div.titlebar {
-	padding: 0px;
-}
-div.titlebar div {
-}
-.hidden {
-	display: none;
-}
-ul.nav_oben {
-	padding: 0px;
-	margin: 0px;
-	text-align: right;
-	text-transform: uppercase;
-}
-li {
-	display: inline-block;
-}
-div.header a {
-	text-decoration: none;
-	color: black;
-}
-a {
-	text-decoration: none;
-	color: #a22c1c;
-}
-.block {
-	/* override country.css */
-	width: 200px;
-	padding-bottom: 20px;
-}
-@media only screen and (min-width: 1000px) {
-	div.header {
-		padding-left: 137px;
-		padding-right: 137px;
-	}
-	.content {
-		padding-left: 137px;
-		padding-right: 137px;
-	}
-	footer {
-		padding-left: 137px;
-		padding-right: 137px;
-	}
-}
-@media only screen and (max-width: 999px) {
-	div.header {
-		padding-left: 1em;
-		padding-right: 1em;
-	}
-	.content {
-		padding-left: 1em;
-		padding-right: 1em;
-	}
-	footer {
-		padding-left: 1em;
-		padding-right: 1em;
-	}
-}
-
-div.subtitle h1 {
-	padding: 0px;
-	margin: 0px;
-	font-size: 130%;
-	align: right;
-}
-div.subtitle h2 {
-	padding: 0px;
-	margin: 0px;
-	font-size: 115%;
-}
-footer {
-    left: 0;
-    padding-top: 1em;
-    bottom: 0;
-    width: 100%;
-    height: 2em;
-    background-color: rgb(162,44,28);
-    color: white;
-}
-.float {
-	float: left;
-}
-.floatright {
-	float: right;
-}
-.copyright {
-	width: 66%;
-	font-size: 80%;
-}
-#countries {
-	padding-bottom: 40px;
-}
-#country {
-	padding-bottom: 20px;
-}
-input[type=submit] {
-	width: inherit;
-/*	text-align: left; */
-}
-form {
-	justify-content: center;
-}
-</style>
-<script type="text/javascript">
-
-/* Element.closest polyfill - https://developer.mozilla.org/en-US/docs/Web/API/Element/closest License: public domain*/
-if (!Element.prototype.matches)
-    Element.prototype.matches = Element.prototype.msMatchesSelector ||
-                                Element.prototype.webkitMatchesSelector;
-
-if (!Element.prototype.closest)
-    Element.prototype.closest = function(s) {
-        var el = this;
-        if (!document.documentElement.contains(el)) return null;
-        do {
-            if (el.matches(s)) return el;
-            el = el.parentElement || el.parentNode;
-        } while (el !== null && el.nodeType === 1);
-        return null;
-    };
-
-
-function clickCountryFlag(element) {
-	if (!element) return false;
-
-	var form = element.closest("form");
-
-	if (!form) return false;
-
-	form.submit();
-	return false;
-}
-</script>
+    <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <link rel="stylesheet" href="$contextPath/static/css/css_country.css" th:href="@{/static/css/css_country.css}"/>
+    <script type="text/javascript" src="$contextPath/static/js/js_country.js"
+            th:attr="src=@{/static/js/js_country.js}"></script>
+    <title th:text="#{gui.countryselection.title}">eIDAS-Login Länderauswahl</title>
 </head>
 <body>
-  <div class="header container">
+<div class="header container">
     <div class="titlebar">
-      <div>
-	     <a href="https://www.bmi.gv.at/" target="_blank" title="Home">
-	       <img class="toplogo img-responsive" src="/static/BMI.png" alt="Logo BMI"
-              th:attr="alt=#{gui.countryselection.logo.bmi.alt}">
-	       <h1 class="hidden" th:text="#{gui.countryselection.header1}"> Bundesministerium für Inneres </h1>
-	     </a>
-      </div>
-      <ul class="nav_oben">
-        <li>
-          <div class="languageselection" th:include="language_selection :: selectlanguage">
-            LanguageSelectionBlock
-          </div>
-        </li>
-        &nbsp; &nbsp;
-        <li><a href="https://www.bmi.gv.at/" target="_blank" th:text="#{gui.countryselection.link.bmi}" > Startseite BMI </a></li>
-      </ul>
+        <div>
+            <a href="https://www.bmi.gv.at/" target="_blank" title="Home">
+                <img class="toplogo img-responsive" src="/static/BMI.png" alt="Logo BMI"
+                     th:attr="alt=#{gui.countryselection.logo.bmi.alt}">
+                <h1 class="hidden" th:text="#{gui.countryselection.header1}"> Bundesministerium für Inneres </h1>
+            </a>
+        </div>
+        <ul class="nav_oben">
+            <li>
+                <div class="languageselection" th:include="language_selection :: selectlanguage">
+                    LanguageSelectionBlock
+                </div>
+            </li>
+            &nbsp; &nbsp;
+            <li><a href="https://www.bmi.gv.at/" target="_blank" th:text="#{gui.countryselection.link.bmi}"> Startseite
+                BMI </a></li>
+        </ul>
     </div>
-  </div>
-  <div class="content">
+</div>
+<div class="content">
     <div class="subtitle">
-      <h1 th:text="#{gui.countryselection.header2}" > Zentraler eIDAS Knoten der Republik Österreich </h1>
-      <h2 th:text="#{gui.countryselection.header3}" > Betrieben durch das Bundesministerium für Inneres </h2>
+        <h1 th:text="#{gui.countryselection.header2}"> Zentraler eIDAS Knoten der Republik Österreich </h1>
+        <h2 th:text="#{gui.countryselection.header3}"> Betrieben durch das Bundesministerium für Inneres </h2>
     </div>
 
     <h1 th:text="#{gui.countryselection.header.selection}"> Wählen Sie Ihr Land / Select your country </h1>
 
     <div id="country">
-    <!-- Active countries -->
-            <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-                <a><img class="countryimage" src="$contextPath/img/countries/germany-eu_.png" alt="Germany-eID"
-                        th:attr="src=@{/img/countries/germany-eu_.png},alt=#{gui.countryselection.country.de.logo.alt}"/></a>
-                <input type="submit" role="button" value="Deutschland / Germany" th:attr="value=#{gui.countryselection.country.de}" />
-                <input type="hidden" name="selectedCountry" value="XX">
-                <input  type="hidden" name="pendingid"  value="$pendingid" th:attr="value=${pendingid}" />
-            </form>
+        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <a><img class="countryimage" src="$contextPath/img/countries/germany-eu_.png" alt="Germany-eID"
+                    th:attr="src=@{/img/countries/germany-eu_.png},alt=#{gui.countryselection.country.de.logo.alt}"/></a>
+            <input type="submit" role="button" value="Deutschland / Germany"
+                   th:attr="value=#{gui.countryselection.country.de}"/>
+            <input type="hidden" name="selectedCountry" value="DE">
+            <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"/>
+            <select id="testEnvironment" name="selectedEnvironment">
+                <option value="prod" th:text="#{gui.countryselection.mode.prod}">Production</option>
+                <option value="qs" th:text="#{gui.countryselection.mode.qs}">QS</option>
+                <option value="test" th:text="#{gui.countryselection.mode.test}">Testing</option>
+                <option value="dev" th:text="#{gui.countryselection.mode.dev}">Development</option>
+            </select>
+        </form>
+
+        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <a><img class="countryimage" src="$contextPath/img/countries/Belgium-EU_gray.png" alt="Belgium-eID"
+                    th:attr="src=@{img/countries/Belgium-EU_gray.png},alt=#{gui.countryselection.country.be.logo.alt}"/></a>
+            <input type="submit" value="Belgium" th:attr="value=#{gui.countryselection.country.be}">
+        </form>
+
+        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <a><img disabled class="countryimage" src="$contextPath/img/countries/Bulgaria-EU_gray.png"
+                    alt="Bulgaria-eID"
+                    th:attr="src=@{/img/countries/Bulgaria-EU_gray.png},alt=#{gui.countryselection.country.bg.logo.alt}"/></a>
+            <input type="submit" value="Bulgaria" th:attr="value=#{gui.countryselection.country.bg}" disabled>
+        </form>
+
+        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <a><img class="countryimage" src="$contextPath/img/countries/Croatia-EU_gray.png" alt="Croatia-eID"
+                    th:attr="src=@{/img/countries/Croatia-EU_gray.png},alt=#{gui.countryselection.country.hr.logo.alt}"/></a>
+            <input type="submit" value="Croatia" th:attr="value=#{gui.countryselection.country.hr}">
+        </form>
+
+        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <a><img disabled class="countryimage" src="$contextPath/img/countries/Cyprus-EU_gray.png" alt="Cyprus-eID"
+                    th:attr="src=@{/img/countries/Cyprus-EU_gray.png},alt=#{gui.countryselection.country.cy.logo.alt}"/></a>
+            <input type="submit" value="Cyprus" th:attr="value=#{gui.countryselection.country.cy}" disabled>
+        </form>
+
+        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <a><img class="countryimage" src="$contextPath/img/countries/CzechRepublic-EU_gray.png"
+                    alt="CzechRepublic-eID"
+                    th:attr="src=@{/img/countries/CzechRepublic-EU_gray.png},alt=#{gui.countryselection.country.cz.logo.alt}"/></a>
+            <input type="submit" value="CzechRepublic" th:attr="value=#{gui.countryselection.country.cz}">
+        </form>
+
+        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <a><img disabled class="countryimage" src="$contextPath/img/countries/Denmark-EU_gray.png" alt="Denmark-eID"
+                    th:attr="src=@{/img/countries/Denmark-EU_gray.png},alt=#{gui.countryselection.country.dk.logo.alt}"/></a>
+            <input type="submit" value="Denmark" th:attr="value=#{gui.countryselection.country.dk}" disabled>
+        </form>
+
+        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <a><img class="countryimage" src="$contextPath/img/countries/Estonia-EU_gray.png" alt="Estonia-eID"
+                    th:attr="src=@{/img/countries/Estonia-EU_gray.png},alt=#{gui.countryselection.country.ee.logo.alt}"/></a>
+            <input type="submit" value="Estonia" th:attr="value=#{gui.countryselection.country.ee}">
+        </form>
+
+        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <a><img disabled class="countryimage" src="$contextPath/img/countries/Finland-EU_gray.png" alt="Finland-eID"
+                    th:attr="src=@{/img/countries/Finland-EU_gray.png},alt=#{gui.countryselection.country.fi.logo.alt}"/></a>
+            <input type="submit" value="Finland" th:attr="value=#{gui.countryselection.country.fi}" disabled>
+        </form>
+
+        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <a><img disabled class="countryimage" src="$contextPath/img/countries/France-EU_gray.png" alt="France-eID"
+                    th:attr="src=@{/img/countries/France-EU_gray.png},alt=#{gui.countryselection.country.fr.logo.alt}"/></a>
+            <input type="submit" value="France" th:attr="value=#{gui.countryselection.country.fr}" disabled>
+        </form>
+
+        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <a><img disabled class="countryimage" src="$contextPath/img/countries/Greece-EU_gray.png" alt="Greece-eID"
+                    th:attr="src=@{/img/countries/Greece-EU_gray.png},alt=#{gui.countryselection.country.gr.logo.alt}"/></a>
+            <input type="submit" value="Greece" th:attr="value=#{gui.countryselection.country.gr}" disabled>
+        </form>
+
+        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <a><img disabled class="countryimage" src="$contextPath/img/countries/Hungary-EU_gray.png" alt="Hungary-eID"
+                    th:attr="src=@{/img/countries/Hungary-EU_gray.png},alt=#{gui.countryselection.country.hu.logo.alt}"/></a>
+            <input type="submit" value="Hungary" th:attr="value=#{gui.countryselection.country.hu}" disabled>
+        </form>
+
+        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <a><img disabled class="countryimage" src="$contextPath/img/countries/Ireland-EU_gray.png" alt="Ireland-eID"
+                    th:attr="src=@{/img/countries/Ireland-EU_gray.png},alt=#{gui.countryselection.country.ir.logo.alt}"/></a>
+            <input type="submit" value="Ireland" th:attr="value=#{gui.countryselection.country.ir}" disabled>
+        </form>
+
+        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <a><img class="countryimage" src="$contextPath/img/countries/Italy-EU_gray.png" alt="Italy-eID"
+                    th:attr="src=@{/img/countries/Italy-EU_gray.png},alt=#{gui.countryselection.country.it.logo.alt}"/></a>
+            <input type="submit" value="Italy" th:attr="value=#{gui.countryselection.country.it}">
+            <select id="testEnvironment" name="selectedEnvironment">
+                <option value="prod" th:text="#{gui.countryselection.mode.prod}">Production</option>
+                <option value="qs" th:text="#{gui.countryselection.mode.qs}">QS</option>
+                <option value="test" th:text="#{gui.countryselection.mode.test}">Testing</option>
+                <option value="dev" th:text="#{gui.countryselection.mode.dev}">Development</option>
+            </select>
+        </form>
+
+        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <a><img disabled class="countryimage" src="$contextPath/img/countries/Latvia-EU_gray.png" alt="Latvia-eID"
+                    th:attr="src=@{/img/countries/Latvia-EU_gray.png},alt=#{gui.countryselection.country.lv.logo.alt}"/></a>
+            <input type="submit" value="Latvia" th:attr="value=#{gui.countryselection.country.lv}" disabled>
+        </form>
+
+        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <a><img disabled class="countryimage" src="$contextPath/img/countries/Luxembourg-EU_gray.png"
+                    alt="Luxembourg-eID"
+                    th:attr="src=@{/img/countries/Luxembourg-EU_gray.png},alt=#{gui.countryselection.country.lu.logo.alt}"/></a>
+            <input type="submit" value="Luxembourg" th:attr="value=#{gui.countryselection.country.lu}" disabled>
+        </form>
+
+        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <a><img disabled class="countryimage" src="$contextPath/img/countries/Malta-EU_gray.png" alt="Malta-eID"
+                    th:attr="src=@{/img/countries/Malta-EU_gray.png},alt=#{gui.countryselection.country.mt.logo.alt}"/></a>
+            <input type="submit" value="Malta" th:attr="value=#{gui.countryselection.country.mt}" disabled>
+        </form>
+
+        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <a><img class="countryimage" src="$contextPath/img/countries/Poland-EU_gray.png" alt="Poland-eID"
+                    th:attr="src=@{/img/countries/Poland-EU_gray.png},alt=#{gui.countryselection.country.pl.logo.alt}"/></a>
+            <input type="submit" value="Poland" th:attr="value=#{gui.countryselection.country.pl}">
+        </form>
+
+        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <a><img class="countryimage" src="$contextPath/img/countries/Portugal-EU_gray.png" alt="Portugal-eID"
+                    th:attr="src=@{/img/countries/Portugal-EU_gray.png},alt=#{gui.countryselection.country.pt.logo.alt}"/></a>
+            <input type="submit" value="Portugal" th:attr="value=#{gui.countryselection.country.pt}">
+        </form>
+
+        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <a><img disabled class="countryimage" src="$contextPath/img/countries/Romania-EU_gray.png" alt="Romania-eID"
+                    th:attr="src=@{/img/countries/Romania-EU_gray.png},alt=#{gui.countryselection.country.ro.logo.alt}"/></a>
+            <input type="submit" value="Romania" th:attr="value=#{gui.countryselection.country.ro}" disabled>
+        </form>
+
+        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <a><img disabled class="countryimage" src="$contextPath/img/countries/Slovakia-EU_gray.png"
+                    alt="Slovakia-eID"
+                    th:attr="src=@{/img/countries/Slovakia-EU_gray.png},alt=#{gui.countryselection.country.sk.logo.alt}"/></a>
+            <input type="submit" value="Slovakia" th:attr="value=#{gui.countryselection.country.sk}" disabled>
+        </form>
+
+        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <a><img class="countryimage" src="$contextPath/img/countries/Slovenia-EU_gray.png" alt="Slovenia-eID"
+                    th:attr="src=@{/img/countries/Slovenia-EU_gray.png},alt=#{gui.countryselection.country.si.logo.alt}"/></a>
+            <input type="submit" value="Slovenia" th:attr="value=#{gui.countryselection.country.si}">
+        </form>
+
+        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <a><img class="countryimage" src="$contextPath/img/countries/Spain-EU_gray.png" alt="Spain-eID"
+                    th:attr="src=@{/img/countries/Spain-EU_gray.png},alt=#{gui.countryselection.country.es.logo.alt}"/></a>
+            <input type="submit" value="Spain" th:attr="value=#{gui.countryselection.country.es}">
+            <select id="testEnvironment" name="selectedEnvironment">
+                <option value="prod" th:text="#{gui.countryselection.mode.prod}">Production</option>
+                <option value="qs" th:text="#{gui.countryselection.mode.qs}">QS</option>
+                <option value="test" th:text="#{gui.countryselection.mode.test}">Testing</option>
+                <option value="dev" th:text="#{gui.countryselection.mode.dev}">Development</option>
+            </select>
+        </form>
+
+        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <a><img disabled class="countryimage" src="$contextPath/img/countries/Sweden-EU_gray.png" alt="Sweden-eID"
+                    th:attr="src=@{/img/countries/Sweden-EU_gray.png},alt=#{gui.countryselection.country.se.logo.alt}"/></a>
+            <input type="submit" value="Sweden" th:attr="value=#{gui.countryselection.country.se}" disabled>
+        </form>
+
+        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <a><img class="countryimage" src="$contextPath/img/countries/TheNetherlands-EU_gray.jpg"
+                    alt="TheNetherlands-eID"
+                    th:attr="src=@{/img/countries/TheNetherlands-EU_gray.jpg},alt=#{gui.countryselection.country.nl.logo.alt}"/></a>
+            <input type="submit" value="Netherlands" th:attr="value=#{gui.countryselection.country.nl}">
+        </form>
+
+        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <a><img disabled class="countryimage" src="$contextPath/img/countries/UnitedKingdom-EU_gray.png"
+                    alt="UnitedKingdom-eID"
+                    th:attr="src=@{/img/countries/UnitedKingdom-EU_gray.png},alt=#{gui.countryselection.country.uk.logo.alt}"/></a>
+            <input type="submit" value="United Kingdom" th:attr="value=#{gui.countryselection.country.uk}" disabled>
+        </form>
 
     </div>
 
     <!-- Abbrechen Button -->
-    <form   class="block" method="post"  action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-      <input  type="submit" class="btn btn-outline-primary btn-block" value="Abbrechen/Cancel" th:attr="value=#{gui.countryselection.cancel}">
-      <input  type="hidden" name="stopAuthProcess" value="true" >
-      <input  type="hidden" name="pendingid"  value="$pendingid" th:attr="value=${pendingid}">
+    <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+        <input type="submit" class="btn btn-outline-primary btn-block" value="Abbrechen/Cancel"
+               th:attr="value=#{gui.countryselection.cancel}">
+        <input type="hidden" name="stopAuthProcess" value="true">
+        <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}">
     </form>
 
-    <p th:text="#{gui.countryselection.notsupportedinfo}" >Wenn Sie Ihr Land in dieser Aufzählung nicht entdecken ... </p>
-
-<h2 th:text="#{gui.countryselection.infos.general.header}" > Information zur Anmeldung über Europäische eIDs </h2>
-<p>
-  <span th:text="#{gui.countryselection.infos.general.part.1}"> first part </span>
-  <a href="https://www.bmi.gv.at/" target="_blank" th:text="#{gui.countryselection.header1}" > Bundesministerium für Inneres </a>
-  <span th:text="#{gui.countryselection.infos.general.part.2}"> second part </span>
-</p>
-
-<p>
-  <span th:text="#{gui.countryselection.infos.general.part.3}"> third part </span>
-  <a href="https://eur-lex.europa.eu/legal-content/DE/TXT/HTML/?uri=CELEX:32014R0910&from=DE" target="_blank" th:text="#{gui.countryselection.infos.general.link.1}"> eIDAS-Verordnung der Europäischen Union </a>
-  <span th:text="#{gui.countryselection.infos.general.part.4}"> fourth part </span>
-</p>
-
-<p
-  <span th:text="#{gui.countryselection.infos.general.part.5}"> fived part </span>
-  <a href="https://www.dsb.gv.at/-/das-erganzungsregister-fur-naturliche-personen-ernp-" target="_blank" th:text="#{gui.countryselection.infos.general.link.2}" ></a>
-  <span th:text="#{gui.countryselection.infos.general.part.6}"> sixed part </span>
-</p>
-
-  </div>
-  <footer>
-	<div class="copyright">&copy; BUNDESMINISTERIUM FÜR INNERES</div>
-	<div></div>
- </footer>
+    <p th:text="#{gui.countryselection.notsupportedinfo}">Wenn Sie Ihr Land in dieser Aufzählung nicht entdecken
+        ... </p>
+
+    <h2 th:text="#{gui.countryselection.infos.general.header}"> Information zur Anmeldung über Europäische eIDs </h2>
+    <p>
+        <span th:text="#{gui.countryselection.infos.general.part.1}"> first part </span>
+        <a href="https://www.bmi.gv.at/" target="_blank" th:text="#{gui.countryselection.header1}"> Bundesministerium
+            für Inneres </a>
+        <span th:text="#{gui.countryselection.infos.general.part.2}"> second part </span>
+    </p>
+
+    <p>
+        <span th:text="#{gui.countryselection.infos.general.part.3}"> third part </span>
+        <a href="https://eur-lex.europa.eu/legal-content/DE/TXT/HTML/?uri=CELEX:32014R0910&from=DE" target="_blank"
+           th:text="#{gui.countryselection.infos.general.link.1}"> eIDAS-Verordnung der Europäischen Union </a>
+        <span th:text="#{gui.countryselection.infos.general.part.4}"> fourth part </span>
+    </p>
+
+    <p
+    <span th:text="#{gui.countryselection.infos.general.part.5}"> fived part </span>
+    <a href="https://www.dsb.gv.at/-/das-erganzungsregister-fur-naturliche-personen-ernp-" target="_blank"
+       th:text="#{gui.countryselection.infos.general.link.2}"></a>
+    <span th:text="#{gui.countryselection.infos.general.part.6}"> sixed part </span>
+    </p>
+
+</div>
+<footer>
+    <div class="copyright">&copy; BUNDESMINISTERIUM FÜR INNERES</div>
+    <div></div>
+</footer>
 </body>
 </html>
diff --git a/connector/src/test/resources/config/templates/countrySelection_example.html b/connector/src/test/resources/config/templates/countrySelection_example.html
deleted file mode 100644
index 2128f14d..00000000
--- a/connector/src/test/resources/config/templates/countrySelection_example.html
+++ /dev/null
@@ -1,210 +0,0 @@
-<!DOCTYPE html>
-<html xmlns:th="http://www.thymeleaf.org"
-      xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
-      layout:decorator="fragments/base"
-      th:with="lang=${#locale.language}" th:lang="${lang}">
-
-<head>
-  <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <link rel="stylesheet" href="$contextPath/static/css/css_country.css" th:href="@{/static/css/css_country.css}"/>
-  <script type="text/javascript" src="$contextPath/static/js/js_country.js" th:attr="src=@{/static/js/js_country.js}"></script>
-  <title th:text="#{gui.countryselection.title}">eIDAS-Login Länderauswahl</title>
-</head>
-
-<body>
-    <div id="page">
-      <div class="languageselection" th:include="language_selection :: selectlanguage">
-          LanguageSelectionBlock
-      </div>
-
-        <h2 th:text="#{gui.countryselection.header.selection}"> Select your country </h2>
-        <div id="country">
-
-            <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-                <a><img class="countryimage" src="$contextPath/img/countries/germany-eu_.png" alt="Germany-eID"
-                        th:attr="src=@{/img/countries/germany-eu_.png},alt=#{gui.countryselection.country.de.logo.alt}"/></a>
-                <input type="submit" role="button" value="Deutschland / Germany" th:attr="value=#{gui.countryselection.country.de}" />
-                <input type="hidden" name="selectedCountry" value="DE">
-                <input  type="hidden" name="pendingid"  value="$pendingid" th:attr="value=${pendingid}" />
-                <select id="testEnvironment" name="selectedEnvironment">
-                       <option value="prod" th:text="#{gui.countryselection.mode.prod}">Production</option>
-                       <option value="qs" th:text="#{gui.countryselection.mode.qs}">QS</option>
-                       <option value="test" th:text="#{gui.countryselection.mode.test}">Testing</option>
-                       <option value="dev" th:text="#{gui.countryselection.mode.dev}">Development</option>
-                </select>
-            </form>
-
-            <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-                <a><img class="countryimage" src="$contextPath/img/countries/Belgium-EU_gray.png" alt="Belgium-eID"
-                        th:attr="src=@{img/countries/Belgium-EU_gray.png},alt=#{gui.countryselection.country.be.logo.alt}"/></a>
-                <input type="submit" value="Belgium" th:attr="value=#{gui.countryselection.country.be}">
-            </form>
-
-            <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-                <a><img disabled class="countryimage" src="$contextPath/img/countries/Bulgaria-EU_gray.png" alt="Bulgaria-eID"
-                        th:attr="src=@{/img/countries/Bulgaria-EU_gray.png},alt=#{gui.countryselection.country.bg.logo.alt}"/></a>
-                <input type="submit" value="Bulgaria" th:attr="value=#{gui.countryselection.country.bg}" disabled>
-            </form>
-
-            <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-                <a><img class="countryimage" src="$contextPath/img/countries/Croatia-EU_gray.png" alt="Croatia-eID"
-                        th:attr="src=@{/img/countries/Croatia-EU_gray.png},alt=#{gui.countryselection.country.hr.logo.alt}"/></a>
-                <input type="submit" value="Croatia" th:attr="value=#{gui.countryselection.country.hr}">
-            </form>
-
-            <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-                <a><img disabled class="countryimage" src="$contextPath/img/countries/Cyprus-EU_gray.png" alt="Cyprus-eID"
-                        th:attr="src=@{/img/countries/Cyprus-EU_gray.png},alt=#{gui.countryselection.country.cy.logo.alt}"/></a>
-                <input type="submit" value="Cyprus" th:attr="value=#{gui.countryselection.country.cy}" disabled>
-            </form>
-
-            <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-                <a><img class="countryimage" src="$contextPath/img/countries/CzechRepublic-EU_gray.png" alt="CzechRepublic-eID"
-                        th:attr="src=@{/img/countries/CzechRepublic-EU_gray.png},alt=#{gui.countryselection.country.cz.logo.alt}"/></a>
-                <input type="submit" value="CzechRepublic" th:attr="value=#{gui.countryselection.country.cz}">
-            </form>
-
-            <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-                <a><img disabled class="countryimage" src="$contextPath/img/countries/Denmark-EU_gray.png" alt="Denmark-eID"
-                        th:attr="src=@{/img/countries/Denmark-EU_gray.png},alt=#{gui.countryselection.country.dk.logo.alt}"/></a>
-                <input type="submit" value="Denmark" th:attr="value=#{gui.countryselection.country.dk}" disabled>
-            </form>
-
-            <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-                <a><img class="countryimage" src="$contextPath/img/countries/Estonia-EU_gray.png" alt="Estonia-eID"
-                        th:attr="src=@{/img/countries/Estonia-EU_gray.png},alt=#{gui.countryselection.country.ee.logo.alt}"/></a>
-                <input type="submit" value="Estonia" th:attr="value=#{gui.countryselection.country.ee}">
-            </form>
-
-            <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-                <a><img disabled class="countryimage" src="$contextPath/img/countries/Finland-EU_gray.png" alt="Finland-eID"
-                        th:attr="src=@{/img/countries/Finland-EU_gray.png},alt=#{gui.countryselection.country.fi.logo.alt}"/></a>
-                <input type="submit" value="Finland" th:attr="value=#{gui.countryselection.country.fi}" disabled>
-            </form>
-
-            <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-                <a><img disabled class="countryimage" src="$contextPath/img/countries/France-EU_gray.png" alt="France-eID"
-                        th:attr="src=@{/img/countries/France-EU_gray.png},alt=#{gui.countryselection.country.fr.logo.alt}"/></a>
-                <input type="submit" value="France" th:attr="value=#{gui.countryselection.country.fr}" disabled>
-            </form>
-
-            <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-                <a><img disabled class="countryimage" src="$contextPath/img/countries/Greece-EU_gray.png" alt="Greece-eID"
-                        th:attr="src=@{/img/countries/Greece-EU_gray.png},alt=#{gui.countryselection.country.gr.logo.alt}"/></a>
-                <input type="submit" value="Greece" th:attr="value=#{gui.countryselection.country.gr}" disabled>
-            </form>
-
-            <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-                <a><img disabled class="countryimage" src="$contextPath/img/countries/Hungary-EU_gray.png" alt="Hungary-eID"
-                        th:attr="src=@{/img/countries/Hungary-EU_gray.png},alt=#{gui.countryselection.country.hu.logo.alt}"/></a>
-                <input type="submit" value="Hungary" th:attr="value=#{gui.countryselection.country.hu}" disabled>
-            </form>
-
-            <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-                <a><img disabled class="countryimage" src="$contextPath/img/countries/Ireland-EU_gray.png" alt="Ireland-eID"
-                        th:attr="src=@{/img/countries/Ireland-EU_gray.png},alt=#{gui.countryselection.country.ir.logo.alt}"/></a>
-                <input type="submit" value="Ireland" th:attr="value=#{gui.countryselection.country.ir}" disabled>
-            </form>
-
-            <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-                <a><img class="countryimage" src="$contextPath/img/countries/Italy-EU_gray.png" alt="Italy-eID"
-                        th:attr="src=@{/img/countries/Italy-EU_gray.png},alt=#{gui.countryselection.country.it.logo.alt}"/></a>
-                <input type="submit" value="Italy" th:attr="value=#{gui.countryselection.country.it}">
-                <select id="testEnvironment" name="selectedEnvironment">
-                       <option value="prod" th:text="#{gui.countryselection.mode.prod}">Production</option>
-                       <option value="qs" th:text="#{gui.countryselection.mode.qs}">QS</option>
-                       <option value="test" th:text="#{gui.countryselection.mode.test}">Testing</option>
-                       <option value="dev" th:text="#{gui.countryselection.mode.dev}">Development</option>
-                </select>
-            </form>
-
-            <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-                <a><img disabled class="countryimage" src="$contextPath/img/countries/Latvia-EU_gray.png" alt="Latvia-eID"
-                        th:attr="src=@{/img/countries/Latvia-EU_gray.png},alt=#{gui.countryselection.country.lv.logo.alt}"/></a>
-                <input type="submit" value="Latvia" th:attr="value=#{gui.countryselection.country.lv}" disabled>
-            </form>
-
-            <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-                <a><img disabled class="countryimage" src="$contextPath/img/countries/Luxembourg-EU_gray.png" alt="Luxembourg-eID"
-                        th:attr="src=@{/img/countries/Luxembourg-EU_gray.png},alt=#{gui.countryselection.country.lu.logo.alt}"/></a>
-                <input type="submit" value="Luxembourg" th:attr="value=#{gui.countryselection.country.lu}" disabled>
-            </form>
-
-            <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-                <a><img disabled class="countryimage" src="$contextPath/img/countries/Malta-EU_gray.png" alt="Malta-eID"
-                        th:attr="src=@{/img/countries/Malta-EU_gray.png},alt=#{gui.countryselection.country.mt.logo.alt}"/></a>
-                <input type="submit" value="Malta" th:attr="value=#{gui.countryselection.country.mt}" disabled>
-            </form>
-
-            <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-                <a><img class="countryimage" src="$contextPath/img/countries/Poland-EU_gray.png" alt="Poland-eID"
-                        th:attr="src=@{/img/countries/Poland-EU_gray.png},alt=#{gui.countryselection.country.pl.logo.alt}"/></a>
-                <input type="submit" value="Poland" th:attr="value=#{gui.countryselection.country.pl}">
-            </form>
-
-            <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-                <a><img class="countryimage" src="$contextPath/img/countries/Portugal-EU_gray.png" alt="Portugal-eID"
-                        th:attr="src=@{/img/countries/Portugal-EU_gray.png},alt=#{gui.countryselection.country.pt.logo.alt}"/></a>
-                <input type="submit" value="Portugal" th:attr="value=#{gui.countryselection.country.pt}">
-            </form>
-
-            <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-                <a><img disabled class="countryimage" src="$contextPath/img/countries/Romania-EU_gray.png" alt="Romania-eID"
-                        th:attr="src=@{/img/countries/Romania-EU_gray.png},alt=#{gui.countryselection.country.ro.logo.alt}"/></a>
-                <input type="submit" value="Romania" th:attr="value=#{gui.countryselection.country.ro}" disabled>
-            </form>
-
-            <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-                <a><img disabled class="countryimage" src="$contextPath/img/countries/Slovakia-EU_gray.png" alt="Slovakia-eID"
-                        th:attr="src=@{/img/countries/Slovakia-EU_gray.png},alt=#{gui.countryselection.country.sk.logo.alt}"/></a>
-                <input type="submit" value="Slovakia" th:attr="value=#{gui.countryselection.country.sk}" disabled>
-            </form>
-
-            <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-                <a><img class="countryimage" src="$contextPath/img/countries/Slovenia-EU_gray.png" alt="Slovenia-eID"
-                        th:attr="src=@{/img/countries/Slovenia-EU_gray.png},alt=#{gui.countryselection.country.si.logo.alt}"/></a>
-                <input type="submit" value="Slovenia" th:attr="value=#{gui.countryselection.country.si}">
-            </form>
-
-            <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-                <a><img class="countryimage" src="$contextPath/img/countries/Spain-EU_gray.png" alt="Spain-eID"
-                        th:attr="src=@{/img/countries/Spain-EU_gray.png},alt=#{gui.countryselection.country.es.logo.alt}"/></a>
-                <input type="submit" value="Spain" th:attr="value=#{gui.countryselection.country.es}">
-                <select id="testEnvironment" name="selectedEnvironment">
-                       <option value="prod" th:text="#{gui.countryselection.mode.prod}">Production</option>
-                       <option value="qs" th:text="#{gui.countryselection.mode.qs}">QS</option>
-                       <option value="test" th:text="#{gui.countryselection.mode.test}">Testing</option>
-                       <option value="dev" th:text="#{gui.countryselection.mode.dev}">Development</option>
-                </select>
-            </form>
-
-            <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-                <a><img disabled class="countryimage" src="$contextPath/img/countries/Sweden-EU_gray.png" alt="Sweden-eID"
-                        th:attr="src=@{/img/countries/Sweden-EU_gray.png},alt=#{gui.countryselection.country.se.logo.alt}"/></a>
-                <input type="submit" value="Sweden" th:attr="value=#{gui.countryselection.country.se}" disabled>
-            </form>
-
-            <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-                <a><img class="countryimage" src="$contextPath/img/countries/TheNetherlands-EU_gray.jpg" alt="TheNetherlands-eID"
-                        th:attr="src=@{/img/countries/TheNetherlands-EU_gray.jpg},alt=#{gui.countryselection.country.nl.logo.alt}"/></a>
-                <input type="submit" value="Netherlands" th:attr="value=#{gui.countryselection.country.nl}">
-            </form>
-
-            <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-                <a><img disabled class="countryimage" src="$contextPath/img/countries/UnitedKingdom-EU_gray.png" alt="UnitedKingdom-eID"
-                        th:attr="src=@{/img/countries/UnitedKingdom-EU_gray.png},alt=#{gui.countryselection.country.uk.logo.alt}"/></a>
-                <input type="submit" value="United Kingdom" th:attr="value=#{gui.countryselection.country.uk}" disabled>
-            </form>
-
-        </div>
-
-        <form   class="block" method="post"  action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-          <input  type="submit" class="btn btn-outline-primary btn-block" value="Abbrechen/Cancel" th:attr="value=#{gui.countryselection.cancel}">
-          <input  type="hidden" name="stopAuthProcess" value="true" >
-          <input  type="hidden" name="pendingid"  value="$pendingid" th:attr="value=${pendingid}">
-        </form>
-
-    </div>
-</body>
-</html>
diff --git a/connector/src/test/resources/config/templates/error.html b/connector/src/test/resources/config/templates/error.html
new file mode 100644
index 00000000..e2c605c7
--- /dev/null
+++ b/connector/src/test/resources/config/templates/error.html
@@ -0,0 +1,53 @@
+<!DOCTYPE HTML>
+<html xmlns:th="http://www.thymeleaf.org"
+      xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
+      layout:decorator="fragments/base"
+      th:with="lang=${#locale.language}" th:lang="${lang}">
+
+<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
+<link rel="stylesheet" href="$contextPath/css/css_error.css" th:href="@{/css/css_error.css}"/>
+
+<title th:text="#{gui.errorpage.msg.title}">An error arise ... </title>
+</head>
+
+<body>
+<div id="page">
+    <div id="page1" class="case selected-case" role="main">
+        <div class="hell" role="application">
+            <h2 class="OA_header" role="heading" th:text="#{gui.errorpage.msg.title}">Error Header</h2>
+
+            <div id="alert_area" class="hell" role="application">
+                <p th:text="#{gui.errorpage.msg.information}">Error Information</p>
+                <br/>
+                <p><b th:text="#{gui.errorpage.msg.errorcode}">Code :</b> <span th:text="${errorCode}"></span></p>
+                <p><b th:text="#{gui.errorpage.msg.errormsg}">Msg :</b> <span
+                        th:text="${#messages.msgWithParams('__${errorCode}__', '__${errorParams}__')}"></span></p>
+            </div>
+        </div>
+
+        <div th:if="${timestamp}">
+            <p><b>Timestamp:</b> <span th:text="${timestamp}"></span></p>
+        </div>
+        <div th:if="${error}">
+            <p><b>Error:</b> <span th:text="${error}"></span></p>
+        </div>
+        <div th:if="${status}">
+            <p><b>Status:</b> <span th:text="${status}"></span></p>
+        </div>
+        <div th:if="${message}">
+            <p><b>Message:</b> <span th:text="${message}"></span></p>
+        </div>
+        <div th:if="${exception}">
+            <p><b>Exception:</b> <span th:text="${exception}"></span></p>
+        </div>
+        <div th:if="${trace}">
+            <p><b>Trace:</b> <span th:text="${trace}"></span></p>
+        </div>
+        <div th:if="${Stacktrace}">
+            <p><b>Stacktrace:</b> <span th:text="${stacktrace}"></span></p>
+        </div>
+
+    </div>
+</div>
+</body>
+</html>
\ No newline at end of file
diff --git a/connector/src/test/resources/config/templates/other_login_method.html b/connector/src/test/resources/config/templates/other_login_method.html
index 56c368c6..c233c5c4 100644
--- a/connector/src/test/resources/config/templates/other_login_method.html
+++ b/connector/src/test/resources/config/templates/other_login_method.html
@@ -7,179 +7,7 @@
     <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <link rel="stylesheet" href="$contextPath/static/css/css_country.css" th:href="@{/static/css/css_country.css}"/>
-    <title th:text="#{gui.countryselection.title}">eIDAS-Login Login-Auswahl</title>
-    <script type="text/javascript">
-    </script>
-    <style>
-        body {
-            background-image: none;
-            margin: 0px;
-            font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
-        }
-
-        div.header {
-            background-color: #e9ecef;
-            padding-top: 28px;
-            padding-left: 137px;
-            padding-right: 137px;
-            padding-bottom: 12px;
-        }
-
-        div.titlebar {
-            padding: 0px;
-        }
-
-        div.titlebar div {
-        }
-
-        .hidden {
-            display: none;
-        }
-
-        ul.nav_oben {
-            padding: 0px;
-            margin: 0px;
-            text-align: right;
-            text-transform: uppercase;
-        }
-
-        li {
-            display: inline-block;
-        }
-
-        div.header a {
-            text-decoration: none;
-            color: black;
-        }
-
-        a {
-            text-decoration: none;
-            color: #a22c1c;
-        }
-
-        .block {
-            /* override country.css */
-            width: 200px;
-            padding-bottom: 20px;
-        }
-
-        @media only screen and (min-width: 1000px) {
-            div.header {
-                padding-left: 137px;
-                padding-right: 137px;
-            }
-
-            .content {
-                padding-left: 137px;
-                padding-right: 137px;
-            }
-
-            footer {
-                padding-left: 137px;
-                padding-right: 137px;
-            }
-        }
-
-        @media only screen and (max-width: 999px) {
-            div.header {
-                padding-left: 1em;
-                padding-right: 1em;
-            }
-
-            .content {
-                padding-left: 1em;
-                padding-right: 1em;
-            }
-
-            footer {
-                padding-left: 1em;
-                padding-right: 1em;
-            }
-        }
-
-        div.subtitle h1 {
-            padding: 0px;
-            margin: 0px;
-            font-size: 130%;
-            align: right;
-        }
-
-        div.subtitle h2 {
-            padding: 0px;
-            margin: 0px;
-            font-size: 115%;
-        }
-
-        footer {
-            left: 0;
-            padding-top: 1em;
-            bottom: 0;
-            width: 100%;
-            height: 2em;
-            background-color: rgb(162, 44, 28);
-            color: white;
-        }
-
-        .float {
-            float: left;
-        }
-
-        .floatright {
-            float: right;
-        }
-
-        .copyright {
-            width: 66%;
-            font-size: 80%;
-        }
-
-        #countries {
-            padding-bottom: 40px;
-        }
-
-        #country {
-            padding-bottom: 20px;
-        }
-
-        input[type=submit] {
-            width: inherit;
-            /*	text-align: left; */
-        }
-
-        form {
-            justify-content: center;
-        }
-    </style>
-    <script type="text/javascript">
-
-        /* Element.closest polyfill - https://developer.mozilla.org/en-US/docs/Web/API/Element/closest License: public domain*/
-        if (!Element.prototype.matches)
-            Element.prototype.matches = Element.prototype.msMatchesSelector ||
-                Element.prototype.webkitMatchesSelector;
-
-        if (!Element.prototype.closest)
-            Element.prototype.closest = function (s) {
-                var el = this;
-                if (!document.documentElement.contains(el)) return null;
-                do {
-                    if (el.matches(s)) return el;
-                    el = el.parentElement || el.parentNode;
-                } while (el !== null && el.nodeType === 1);
-                return null;
-            };
-
-
-        function clickCountryFlag(element) {
-            if (!element) return false;
-
-            var form = element.closest("form");
-
-            if (!form) return false;
-
-            form.submit();
-            return false;
-        }
-    </script>
+    <title th:text="#{gui.otherlogin.title}">eIDAS-Login Other Login Methods</title>
 </head>
 <body>
 <div class="header container">
@@ -198,8 +26,10 @@
                 </div>
             </li>
             &nbsp; &nbsp;
-            <li><a href="https://www.bmi.gv.at/" target="_blank" th:text="#{gui.countryselection.link.bmi}"> Startseite
-                BMI </a></li>
+            <li>
+                <a href="https://www.bmi.gv.at/" target="_blank" th:text="#{gui.countryselection.link.bmi}">Startseite
+                    BMI </a>
+            </li>
         </ul>
     </div>
 </div>
@@ -209,35 +39,31 @@
         <h2 th:text="#{gui.countryselection.header3}"> Betrieben durch das Bundesministerium für Inneres </h2>
     </div>
 
-    <h1 th:text="#{gui.countryselection.header.selection}"> Wählen Sie Ihr Land / Select your country </h1>
+    <h1 th:text="#{gui.otherlogin.header.selection}"> Select an alternative login method </h1>
 
-    <div id="country">
-        <!-- Active countries -->
+    <div id="otherlogin">
         <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
             <input type="submit" role="button" value="Handy-Signatur / Mobile Signature"
-                   th:attr="value=#{gui.countryselection.country.de}"/>
-            <input type="hidden" name="selectedCountry" value="HS">
+                   th:attr="value=#{gui.otherlogin.hs}"/>
+            <input type="hidden" name="loginSelection" value="MOBILE_PHONE_SIGNATURE_LOGIN">
             <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"/>
         </form>
         <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-            <input type="submit" role="button" value="Andere eIDAS ID"
-                   th:attr="value=#{gui.countryselection.country.de}"/>
-            <input type="hidden" name="selectedCountry" value="EIDAS">
+            <input type="submit" role="button" value="Andere eIDAS ID" th:attr="value=#{gui.otherlogin.eidas}"/>
+            <input type="hidden" name="loginSelection" value="EIDAS_LOGIN">
             <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"/>
         </form>
         <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-            <input type="submit" role="button" value="Keine weitere HS / eIDAS"
-                   th:attr="value=#{gui.countryselection.country.de}"/>
-            <input type="hidden" name="selectedCountry" value="NONE">
+            <input type="submit" role="button" value="Keine weitere HS / eIDAS" th:attr="value=#{gui.otherlogin.none}"/>
+            <input type="hidden" name="loginSelection" value="NO_OTHER_LOGIN">
             <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"/>
         </form>
-        <!-- todo wohnsitz -->
     </div>
 
     <!-- Abbrechen Button -->
     <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
         <input type="submit" class="btn btn-outline-primary btn-block" value="Abbrechen/Cancel"
-               th:attr="value=#{gui.countryselection.cancel}">
+               th:attr="value=#{gui.otherlogin.cancel}">
         <input type="hidden" name="stopAuthProcess" value="true">
         <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}">
     </form>
diff --git a/connector/src/test/resources/config/templates/residency.html b/connector/src/test/resources/config/templates/residency.html
index 99de851a..44cf17a4 100644
--- a/connector/src/test/resources/config/templates/residency.html
+++ b/connector/src/test/resources/config/templates/residency.html
@@ -3,7 +3,6 @@
       xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
       layout:decorator="fragments/base"
       th:with="lang=${#locale.language}" th:lang="${lang}">
-
 <head>
     <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
     <meta name="viewport" content="width=device-width, initial-scale=1">
@@ -102,17 +101,41 @@
 </head>
 
 <body>
-<div id="page">
-    <div class="languageselection" th:include="language_selection :: selectlanguage">
-        LanguageSelectionBlock
+<div class="header container">
+    <div class="titlebar">
+        <div>
+            <a href="https://www.bmi.gv.at/" target="_blank" title="Home">
+                <img class="toplogo img-responsive" src="/static/BMI.png" alt="Logo BMI"
+                     th:attr="alt=#{gui.countryselection.logo.bmi.alt}">
+                <h1 class="hidden" th:text="#{gui.countryselection.header1}"> Bundesministerium für Inneres </h1>
+            </a>
+        </div>
+        <ul class="nav_oben">
+            <li>
+                <div class="languageselection" th:include="language_selection :: selectlanguage">
+                    LanguageSelectionBlock
+                </div>
+            </li>
+            &nbsp; &nbsp;
+            <li>
+                <a href="https://www.bmi.gv.at/" target="_blank" th:text="#{gui.countryselection.link.bmi}">Startseite
+                    BMI </a>
+            </li>
+        </ul>
+    </div>
+</div>
+<div class="content">
+    <div class="subtitle">
+        <h1 th:text="#{gui.countryselection.header2}"> Zentraler eIDAS Knoten der Republik Österreich </h1>
+        <h2 th:text="#{gui.countryselection.header3}"> Betrieben durch das Bundesministerium für Inneres </h2>
     </div>
 
-    <h2 th:text="#{gui.residency.header.selection}">Search your Austrian Residency</h2>
+    <h1 th:text="#{gui.residency.header.selection}">Search your Austrian Residency</h1>
 
     <div id="residency">
         <form id="inputForm" method="post" action="$contextPath$submitEndpoint"
               th:attr="action=@{${submitEndpoint}}">
-            <div th:text="#{gui.residency.header.help}">Please enter a Municipality or Village first</div>
+            <div th:text="#{gui.residency.header.help}">Please enter a postcode, municipality or village first</div>
             <div>
                 <label for="inputPostleitzahl" th:text="#{gui.residency.input.postleitzahl}">Postleitzahl</label>
                 <input type="text" id="inputPostleitzahl" name="postleitzahl" value=""/>
@@ -181,5 +204,9 @@
     </form>
 
 </div>
+<footer>
+    <div class="copyright">&copy; BUNDESMINISTERIUM FÜR INNERES</div>
+    <div></div>
+</footer>
 </body>
 </html>
diff --git a/connector/src/test/resources/config/webcontent/css/css_country.css b/connector/src/test/resources/config/webcontent/css/css_country.css
index 4091955f..bc575c90 100644
--- a/connector/src/test/resources/config/webcontent/css/css_country.css
+++ b/connector/src/test/resources/config/webcontent/css/css_country.css
@@ -1,137 +1,158 @@
 @charset "utf-8";
-    body {
-         background-image: none;
-	       margin:		0px;
-      	 font-family:	"Helvetica Neue", Helvetica, Arial, sans-serif;
-    }
-    #page {
-        padding-top: 2%;
-        padding-left: 10%;
-    }
-    
-    #country {
-        display: flex;
-        flex-direction: row;
-        flex-wrap: wrap;
-        align-items: center;
-    }
-
-    .block {
-        display: flex;
-        flex-direction: row;
-        flex-wrap: wrap;
-        cursor: pointer;
-        text-decoration: none;
-        padding-right:2%;
-        width: 250px;
-    }
-    
-    .countryimage {
-        width:50px;
-        height:50px;
-        padding-right: 2%;
-        padding-bottom: 4%;
-    }
-
-    input[type=button], input[type=submit], input[type=reset] {
-       display:flex;
-        background-color:transparent;
-        border:none;
-        color: black;
-        text-decoration: none;
-        cursor: pointer;  
-    }
-    #testEnvironment {
-        border: none;
-        color: black;
-        padding: 10px 20px;
-        text-decoration: none;
-        margin: 4px 2px;
-        height: 3%;
-        display: inline-block;
-        vertical-align: middle;
-        width: 40%;  
-    }
-    #button{
-        background-color: transparent;
-        border:none;
-    }
-    div.header { 
-	      background-color: #e9ecef;
-	      padding-top: 28px;
-      	padding-left: 137px;
-      	padding-right: 137px;
-      	padding-bottom: 12px;
-    }
-    div.titlebar { 
-        padding: 0px;
-    }
-    div.titlebar div { 
-    }
-    .hidden {
-        display: none;
-    }
-    ul.nav_oben {
-      	padding: 0px;
-      	margin: 0px;
-      	text-align: right;
-      	text-transform: uppercase;
-    }
-    li {
-      	display: inline-block;
-    }	
-    div.header a {
-      	text-decoration: none;
-      	color: black;
-    }
-    a {
-      	text-decoration: none;
-      	color: #a22c1c;
-    }
-    .content {
-      	padding-left: 137px;
-        padding-right: 137px;
-    }
-    div.subtitle h1 {
-      	padding: 0px;
-      	margin: 0px;
-      	font-size: 130%;
-      	align: right;
-    }
-    div.subtitle h2 {
-      	padding: 0px;
-      	margin: 0px;
-      	font-size: 115%;
-    }
-    footer {
-        position: fixed;
-        left: 0;
-        padding-left: 137px;
-        padding-right: 137px;
-        padding-top: 1em;
-        bottom: 0;
-        width: 100%;
-        height: 2em;
-        background-color: rgb(162,44,28);
-        color: white;
-    }
-    .float {
-      	float: left;
-    }
-    .floatright {
-      	float: right;
-    }
-    .copyright {
-      	width: 66%;
-      	font-size: 80%;
-    }
-    #countries,#country {
-      	padding-bottom: 40px; 
-    }
-    input[type=submit] {
-      	width: inherit;
-        /*	text-align: left; */
-    }
-    form {
-      	justify-content: center;
-    }
\ No newline at end of file
+body {
+    background-image: none;
+    margin: 0px;
+    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+}
+
+#page {
+    padding-top: 2%;
+    padding-left: 10%;
+}
+
+#country {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    align-items: center;
+}
+
+.block {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    cursor: pointer;
+    text-decoration: none;
+    padding-right: 2%;
+    width: 250px;
+}
+
+.countryimage {
+    width: 50px;
+    height: 50px;
+    padding-right: 2%;
+    padding-bottom: 4%;
+}
+
+input[type=button], input[type=submit], input[type=reset] {
+    display: flex;
+    background-color: transparent;
+    border: none;
+    color: black;
+    text-decoration: none;
+    cursor: pointer;
+}
+
+#testEnvironment {
+    border: none;
+    color: black;
+    padding: 10px 20px;
+    text-decoration: none;
+    margin: 4px 2px;
+    height: 3%;
+    display: inline-block;
+    vertical-align: middle;
+    width: 40%;
+}
+
+#button {
+    background-color: transparent;
+    border: none;
+}
+
+div.header {
+    background-color: #e9ecef;
+    padding-top: 28px;
+    padding-left: 137px;
+    padding-right: 137px;
+    padding-bottom: 12px;
+}
+
+div.titlebar {
+    padding: 0px;
+}
+
+div.titlebar div {
+}
+
+.hidden {
+    display: none;
+}
+
+ul.nav_oben {
+    padding: 0px;
+    margin: 0px;
+    text-align: right;
+    text-transform: uppercase;
+}
+
+li {
+    display: inline-block;
+}
+
+div.header a {
+    text-decoration: none;
+    color: black;
+}
+
+a {
+    text-decoration: none;
+    color: #a22c1c;
+}
+
+.content {
+    padding-left: 137px;
+    padding-right: 137px;
+}
+
+div.subtitle h1 {
+    padding: 0px;
+    margin: 0px;
+    font-size: 130%;
+    align: right;
+}
+
+div.subtitle h2 {
+    padding: 0px;
+    margin: 0px;
+    font-size: 115%;
+}
+
+footer {
+    position: fixed;
+    left: 0;
+    padding-left: 137px;
+    padding-right: 137px;
+    padding-top: 1em;
+    bottom: 0;
+    width: 100%;
+    height: 2em;
+    background-color: rgb(162, 44, 28);
+    color: white;
+}
+
+.float {
+    float: left;
+}
+
+.floatright {
+    float: right;
+}
+
+.copyright {
+    width: 66%;
+    font-size: 80%;
+}
+
+#countries, #country {
+    padding-bottom: 40px;
+}
+
+input[type=submit] {
+    width: inherit;
+    /*	text-align: left; */
+}
+
+form {
+    justify-content: center;
+}
\ No newline at end of file
diff --git a/connector/src/test/resources/config/webcontent/js/js_country.js b/connector/src/test/resources/config/webcontent/js/js_country.js
index 5dcea90e..9baa0d0a 100644
--- a/connector/src/test/resources/config/webcontent/js/js_country.js
+++ b/connector/src/test/resources/config/webcontent/js/js_country.js
@@ -1,41 +1,41 @@
 function clickCountryFlag(element) {
-	if (!element) return false;
+    if (!element) return false;
 
-	var form = element.target.closest("form"); 
+    var form = element.target.closest("form");
 
-	if (!form) return false;
+    if (!form) return false;
 
-	form.submit();
-	return false;
+    form.submit();
+    return false;
 }
 
 
 /* Set JS events by EventListener to prevent problems with CSP*/
-document.addEventListener("DOMContentLoaded", function(event) {
-
-  /* Element.closest polyfill - https://developer.mozilla.org/en-US/docs/Web/API/Element/closest License: public domain*/
-  if (!Element.prototype.matches)
-      Element.prototype.matches = Element.prototype.msMatchesSelector || 
-                                Element.prototype.webkitMatchesSelector;
-
-  if (!Element.prototype.closest)
-      Element.prototype.closest = function(s) {
-        var el = this;
-        if (!document.documentElement.contains(el)) return null;
-        do {
-            if (el.matches(s)) return el;
-            el = el.parentElement || el.parentNode;
-        } while (el !== null && el.nodeType === 1); 
-        return null;
-    };
-
-  /* set Click events by EventListener to prevent JavaScript in HTML which can be a problem with CSP*/
-  var allFlags = document.getElementsByClassName("countryimage");
-  for (i=0;i<allFlags.length;i++) {
-    if(allFlags[i].getAttribute("disabled") == null) {
-      allFlags[i].closest("a").addEventListener('click', clickCountryFlag, false);
+document.addEventListener("DOMContentLoaded", function (event) {
+
+    /* Element.closest polyfill - https://developer.mozilla.org/en-US/docs/Web/API/Element/closest License: public domain*/
+    if (!Element.prototype.matches)
+        Element.prototype.matches = Element.prototype.msMatchesSelector ||
+            Element.prototype.webkitMatchesSelector;
+
+    if (!Element.prototype.closest)
+        Element.prototype.closest = function (s) {
+            var el = this;
+            if (!document.documentElement.contains(el)) return null;
+            do {
+                if (el.matches(s)) return el;
+                el = el.parentElement || el.parentNode;
+            } while (el !== null && el.nodeType === 1);
+            return null;
+        };
+
+    /* set Click events by EventListener to prevent JavaScript in HTML which can be a problem with CSP*/
+    var allFlags = document.getElementsByClassName("countryimage");
+    for (i = 0; i < allFlags.length; i++) {
+        if (allFlags[i].getAttribute("disabled") == null) {
+            allFlags[i].closest("a").addEventListener('click', clickCountryFlag, false);
+        }
     }
-  }
 });