diff --git a/css/m4lab.css b/css/m4lab.css
index 5a005998b898c0441d85715dff42c5b0652776aa..f23f6a76c98439b37c04b84ebef2630a344c1587 100644
--- a/css/m4lab.css
+++ b/css/m4lab.css
@@ -255,4 +255,70 @@ justify-content:space-evenly;}
   background-color: #f1f1f1;
   padding: 20px;
   padding-right: 60px;
-}
\ No newline at end of file
+}
+
+.card {
+  position: relative;
+  display: -ms-flexbox;
+  display: flex;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  min-width: 0;
+  word-wrap: break-word;
+  background-color: #fff;
+  background-clip: border-box;
+  border: 1px solid rgba(0, 0, 0, 0.125);
+  border-radius: 0.25rem;
+}
+
+.card-body {
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  padding: 1.25rem;
+}
+
+.card-header {
+  padding: 0.75rem 1.25rem;
+  margin-bottom: 0;
+  background-color: rgba(0, 0, 0, 0.03);
+  border-bottom: 1px solid rgba(0, 0, 0, 0.125);
+}
+
+.card-header:first-child {
+  border-radius: calc(0.25rem - 1px) calc(0.25rem - 1px) 0 0;
+}
+
+.card-header + .list-group .list-group-item:first-child {
+  border-top: 0;
+}
+
+.help .card-title > a:before {
+  float: right !important;
+  content: "-";
+  padding-right: 5px;
+}
+.help .card-title > a.collapsed:before {
+    float: right !important;
+    content: "+";
+}
+.help h3 > a {
+  color: #708090;
+  text-decoration: none;
+  display: block;
+}
+.help a {
+    display: inline;
+}
+.help .card > .card-header {
+  color: #fff;
+}
+.card-title {
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+}
+#infoicon {
+  color: #708090;
+}
+.heading {
+  color: #708090;
+}
diff --git a/help/gitlab-pages.html b/help/gitlab-pages.html
index cd09fafb246cff206e6ff9a2c462b2574c2cdf1b..5ebb502e8c1b49977238de812740f082dc68438d 100644
--- a/help/gitlab-pages.html
+++ b/help/gitlab-pages.html
@@ -4,7 +4,7 @@
 <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
-    <title>Gitlab-Pages</title>
+    <title>Hilfe: Gitlab-Pages</title>
     <link rel="stylesheet" href="/css/bootstrap.min.css">
     <link rel="stylesheet" href="/css/m4lab.css">
     <link rel="stylesheet" href="/fonts/font-awesome.min.css">
@@ -17,18 +17,16 @@
 <body>
 
     <div style="background-color: #dadada;">
+    
         <div class="container" style="background-color: #ffffff;margin-bottom: 30px;">
             <div class="row">
-                <div class="col-md-12">
-                    <h4 class="text-center">Das Transferportal bietet die Möglichkeit, über Gitlab-pages eigene Webseiten zu erstellen und zu veröffentlichen:</h4>
-                </div>
             </div>
-        </div>
+       </div> 
         <div id="Gitlab_Text" style="margin-top: 40px;margin-bottom: 30px;">
             <div class="container" style="background-color: #ffffff;">
                 <div style="margin-bottom: 0;padding-top: 20px;padding-bottom: 20px;">
                     <div class="col-lg-12">
-                        <h2 class="d-flex flex-column flex-shrink-1 justify-content-lg-start text-center" style="padding-top: 15px;color: #708090;"><strong>Gitlab</strong></h2>
+                        <h2 class="d-flex flex-column flex-shrink-1 justify-content-lg-start text-center" style="padding-top: 15px;color: #708090;"><strong>Gitlab-pages</strong></h2>
                     </div>
                     <div class="col-auto flex-row flex-grow-1 flex-fill" style="background-color: #ffffff;">
                         <p><a href="https://de.wikipedia.org/wiki/GitLab">GitLab</a> ist eine umfangreiche Webanwendung zur Versionsverwaltung für Softwareprojekte auf Basis von <a href="https://de.wikipedia.org/wiki/Git">Git</a> die auch Wiki-Funktionen und Issue Tracking bietet. Das Transferportal der HFT-Stuttgart betreibt eine eigene GitLab-Instanz für die Hochschule für Technik Stuttgart und ihre Kooperationspartner unter einer Open-Access-Lizenz. Mit <a href="https://docs.gitlab.com/ee/user/project/pages/">GitLab Pages </a> besteht für Angehörige der HFT die Möglichkeit, eine öffentliche statische Projektwebsite aus einem GitLab-Projekt heraus zu erzeugen. 
@@ -46,79 +44,93 @@
             <div class="container" style="background-color: #ffffff;">
                 <div style="margin-bottom: 0;padding-top: 20px;padding-bottom: 20px;">
                     <div class="col-lg-12">
-                        <h2 class="d-flex flex-column order-1 justify-content-lg-start text-center" style="padding-top: 15px;color: #708090;"><strong>Gitlab-pages Projekt erstellen</strong></h2> 
+                        <h2 class="d-flex flex-column order-1 justify-content-lg-start text-center" style="padding-top: 15px;color: #708090;"><strong>Gitlab-pages Projekte</strong></h2> 
                     </div>
                     <div class="col-auto" style="background-color: #ffffff;">
-                        <p>
-                            Um ein eigenes Gitlab-pages Projekt zu erstellen und damit eine eigene Projektseite zu erstellen, führen Sie folgende Schritte aus:
-                            </p>
-                            <ol>
-                            <li> Legen Sie sich auf <a href="https://transfer.hft-stuttgart.de"> https://transfer.hft-stuttgart.de</a> ein Benutzerkonto an bzw. loggen Sie sich   mit Ihren HFT-Nutzerdaten in das Transferportal ein.</li>
-                            <li> Besuchen Sie die Website <a href="https://transfer.hft-stuttgart.de/gitlab/explore/projects">https://transfer.hft-stuttgart.de/gitlab/explore/projects</a></li>
-                            <li> Loggen Sie sich mit ihren Anmeldedaten ein </li>
-                            <li> Legen Sie ein neues Projekt an, indem Sie auf den Button <em> New Project </em> klicken
-                                <img src="/img/help/newproject.png" width="80%"/>
-                            </li>
-                            <li> Wählen Sie <em> Create from template </em> aus und nutzen Sie das Template <em> </em> aus dem Bereich <em> Instance </em>, Klicken Sie dort auf <em> Use template</em> <img src="/img/help/fromtemplate.png" width="80%"/> <img src="/img/help/choosetemplate.png" width="80%"/> </li>
-                            <li> Nun können Sie ihr Projekt befüllen. Tragen Sie mindestens die Grundinformationen wie <em> Project name </em> und <em> Project description </em> ein.<img src="/img/help/createproject.png" width="80%"/> </li>
-                            <li> Klicken Sie auf <em> Create project</em></li>
-                            <li> Ihr Projekt wird nun erstellt und enthält automatisch die notwendigen Grundeinstellungen für das Publizieren einer Website über die Funktion Pages. Vor allem wird im Repositorium der Ordner <em> Public </em> angelegt. <img src="/img/help/folderpublic.png" width="80%"/> <br/>
-                            In diesem Ordner befinden sich die Dateien <em> index.html, aktuelles.html </em>, <em> style.css </em> und <em>settings.js</em>. Diese sorgen für Inhalt (aktuelles.html, index.html) und Aussehen (style.css) der statischen Webseite und enthalten allgemeine Projektinformationen (settings.js). Direkt nach Projekterstellung enthalten sie zunächst nur allgemeine, grundsätzliche Informationen aus dem Template. <img src="/img/help/content_public.png" width="80%"/></li>
-                            <li> Um Ihre eigenen Projektinhalte zu veröffentlichen, können Sie entweder eine komplett eigene HTML-Seite erzeugen oder sich an unseren Vorgaben aus dem Template orientieren. Eine Anleitung zur Verwendung unserer Vorlage finden Sie im Bereich <a href="#template_Text">Gitlab-pages Template benutzen</a> </li>
-                            <li> Sobald Sie mit dem Inhalt der Seite zufrieden sind, und diese veröffentlichen wollen, informieren Sie den Administrator unter <a href="mailto:support-transfer@hft-stuttgart.de">support-transfer@hft-stuttgart.de</a>. Dieser wird dann Ihr Projekt das erste Mal auf den Server hochladen, für weitere Schritte gehen Sie zum Abschnitt <a href="#update_Text"> Gitlab-pages Projekt warten</a>
-                            </ol>
+                        <div class="help">
+                            <div class="card">
+                                <div class="card-header">
+                                    <h3 class="card-title">
+                                        <a class="collapsed" data-toggle="collapse" href="#collapse1" aria-expanded="false" aria-controls="collapse1">
+                                        <small>Gitlab-pages Projekt erstellen</small></a>
+                                    </h3>
+                                </div>
+                                <div id="collapse1" class="card-body collapse" style="">
+                                    <p>
+                                        Um ein eigenes Gitlab-pages Projekt zu erstellen und damit eine eigene Projektseite zu erstellen, führen Sie folgende Schritte aus:
+                                    </p>
+                                    <ol>
+                                        <li> Legen Sie sich auf <a href="https://transfer.hft-stuttgart.de"> https://transfer.hft-stuttgart.de</a> ein Benutzerkonto an bzw. loggen Sie sich   mit Ihren HFT-Nutzerdaten in das Transferportal ein.</li>
+                                        <li> Besuchen Sie die Website <a href="https://transfer.hft-stuttgart.de/gitlab/explore/projects">https://transfer.hft-stuttgart.de/gitlab/explore/projects</a></li>
+                                        <li> Loggen Sie sich mit ihren Anmeldedaten ein </li>
+                                        <li> Legen Sie ein neues Projekt an, indem Sie auf den Button <em> New Project </em> klicken
+                                            <img src="/img/help/newproject.png" width="95%"/>
+                                        </li>
+                                        <li> Wählen Sie <em> Create from template </em> aus und nutzen Sie das Template <em> </em> aus dem Bereich <em> Instance </em>, Klicken Sie dort auf <em> Use template</em> <img src="/img/help/fromtemplate.png" width="95%"/> <img src="/img/help/choosetemplate.png" width="95%"/> </li>
+                                        <li> Nun können Sie ihr Projekt befüllen. Tragen Sie mindestens die Grundinformationen wie <em> Project name </em> und <em> Project description </em> ein.<img src="/img/help/createproject.png" width="95%"/> </li>
+                                        <li> Klicken Sie auf <em> Create project</em></li>
+                                        <li> 
+                                            Ihr Projekt wird nun erstellt und enthält automatisch die notwendigen Grundeinstellungen für das Publizieren einer Website über die Funktion Pages. Vor allem wird im Repositorium der Ordner <em> Public </em> angelegt. <img src="/img/help/folderpublic.png" width="95%"/> <br/>
+                                            In diesem Ordner befinden sich die Dateien <em> index.html, aktuelles.html </em>, <em> style.css </em> und <em>settings.js</em>. Diese sorgen für Inhalt (aktuelles.html, index.html) und Aussehen (style.css) der statischen Webseite und enthalten allgemeine Projektinformationen (settings.js). Direkt nach Projekterstellung enthalten sie zunächst nur allgemeine, grundsätzliche Informationen aus dem Template. <img src="/img/help/content_public.png" width="95%"/>
+                                        </li>
+                                        <li> 
+                                            Um Ihre eigenen Projektinhalte zu veröffentlichen, können Sie entweder eine komplett eigene HTML-Seite erzeugen oder sich an unseren Vorgaben aus dem Template orientieren. Eine Anleitung zur Verwendung unserer Vorlage finden Sie im Bereich <a href="#template_Text">Gitlab-pages Template benutzen</a> 
+                                        </li>
+                                        <li> 
+                                            Sobald Sie mit dem Inhalt der Seite zufrieden sind, und diese veröffentlichen wollen, informieren Sie den Administrator unter <a href="mailto:support-transfer@hft-stuttgart.de">support-transfer@hft-stuttgart.de</a>. Dieser wird dann Ihr Projekt das erste Mal auf den Server hochladen, für weitere Schritte gehen Sie zum nächsten Abschnitt.
+                                        </li>
+                                    </ol>
+                                    <a class="btn btn-primary text-center d-inline-flex d-lg-flex flex-column flex-grow-1 flex-shrink-1 flex-fill justify-content-between align-items-baseline align-content-center align-self-baseline flex-wrap order-3 mb-auto justify-content-md-center align-items-md-end align-items-lg-center justify-content-xl-center mx-auto"
+                                    role="button" style="background-color: #E0001B;" href="mailto:support-transfer@hft-stuttgart.de"><strong>Administratorkontakt</strong></a>
+                                </div>
+                            </div>
+                            <br/>
+                            <div class="card">
+                                <div class="card-header">
+                                    <h3 class="card-title">
+                                        <a class="collapsed" data-toggle="collapse" href="#collapse2" aria-expanded="false" aria-controls="collapse2">
+                                        <small>Gitlab-pages Projekt ändern</small></a>
+                                    </h3>
+                                </div>
+                                <div id="collapse2" class="card-body collapse" style="">
+                                    <p>
+                                        Nachdem Ihr Projekt das erste Mal veröffentlicht wurde, möchten Sie sicherlich Änderungen an der Seite vornehmen. Dafür gehen Sie wie folgt vor:
+                                        <ol>
+                                            <li> 
+                                                Klicken Sie die Datei, die Sie ändern wollen, in der Projektübersicht an <img src="/img/help/content_index_marked.png" width="95%"/>
+                                            </li>
+                                            <li> 
+                                                Klicken Sie in der sich nun öffnenden Dateiansicht auf <em> Edit </em> <img src="/img/help/file_view.png" width="95%"/>
+                                            </li>
+                                            <li> 
+                                                Bearbeiten Sie ihre Datei 
+                                            </li>
+                                            <li> 
+                                                Um die Änderungen zu speichern und auf ihrer Seite sofort zu übernehmen, klicken Sie auf <em> Commit changes </em> 
+                                                <img src="/img/help/save_file.png" width="95%"/>
+                                            </li>
+                                            <li> 
+                                                In der Projektübersicht sehen Sie nun den Status der Deployment-Pipeline, die ihre Webseite auf unserem Server veröffentlicht. Durch Klick auf das Symbol gelangen Sie zu einer Übersicht aller für Ihr Projekt angelaufenen Pipelines.
+                                                <img src="/img/help/pipeline_pending.png" width="95%"/><br/>
+                                                Durch Klick auf eine Pipeline wird Ihnen eine Erklärung zum aktuellen Status angezeigt, der Sie auch eventuelle Probleme entnehmen können.
+                                                <img src="/img/help/overview_pipelines.png" width="95%"/><br/>
+                                                Eine fehlerfrei durchgelaufene Pipeline liefert etwa ein solches Ergebnis:
+                                                <img src="/img/help/output.png" width="95%"/><br/>
+                                                Für eine Übersicht über häufig auftretende Fehler und was man dagegen tun kann, siehe <a href="#error_Text"> hier </a>.
+                                            </li>
+                                            <li> Wenn die Änderungen an Ihrer Homepage ohne Probleme übernommen wurden, sehen Sie dies an einem grünen Haken in der Projektübersicht
+                                                <img src="/img/help/pipeline_good.png" width="95%"/>
+                                            </li>
+                                        </ol>
+                                    </p>
+                                </div>
+                            </div>
+                        </div>
                     </div>
-                     <a class="btn btn-primary text-center d-inline-flex d-lg-flex flex-column flex-grow-1 flex-shrink-1 flex-fill justify-content-between align-items-baseline align-content-center align-self-baseline flex-wrap order-3 mb-auto justify-content-md-center align-items-md-end align-items-lg-center justify-content-xl-center mx-auto"
-                            role="button" style="background-color: #E0001B;" href="mailto:support-transfer@hft-stuttgart.de"><strong>Administratorkontakt</strong></a>
                 </div>
             </div>
         </div>
     
-        <div id="update_Text" style="margin-top: 10px;margin-bottom: 30px;">
-            <div class="container" style="background-color: #ffffff;">
-                <div style="margin-bottom: 0;padding-top: 20px;padding-bottom: 20px;">
-                    <div class="col-lg-12">
-                        <h2 class="d-flex flex-column order-1 justify-content-lg-start text-center" style="padding-top: 15px;color: #708090;"><strong>Gitlab-pages Projekt aktualisieren</strong></h2>
-                    </div>
-                    <div class="col-auto" style="background-color: #ffffff;">
-                        <p>
-                            Nachdem Ihr Projekt das erste Mal veröffentlicht wurde, möchten Sie sicherlich Änderungen an der Seite vornehmen. Dafür gehen Sie wie folgt vor:
-                            <ol>
-                                <li> 
-                                    Klicken Sie die Datei, die Sie ändern wollen, in der Projektübersicht an <img src="/img/help/content_index_marked.png" width="80%"/>
-                                </li>
-                                <li> 
-                                    Klicken Sie in der sich nun öffnenden Dateiansicht auf <em> Edit </em> <img src="/img/help/file_view.png" width="80%"/>
-                                </li>
-                                <li> 
-                                    Bearbeiten Sie ihre Datei 
-                                </li>
-                                <li> 
-                                    Um die Änderungen zu speichern und auf ihrer Seite sofort zu übernehmen, klicken Sie auf <em> Commit changes </em> 
-                                    <img src="/img/help/save_file.png" width="80%"/>
-                                </li>
-                                <li> 
-                                    In der Projektübersicht sehen Sie nun den Status der Deployment-Pipeline, die ihre Webseite auf unserem Server veröffentlicht. Durch Klick auf das Symbol gelangen Sie zu einer Übersicht aller für Ihr Projekt angelaufenen Pipelines.
-                                    <img src="/img/help/pipeline_pending.png" width="80%"/><br/>
-                                    Durch Klick auf eine Pipeline wird Ihnen eine Erklärung zum aktuellen Status angezeigt, der Sie auch eventuelle Probleme entnehmen können.
-                                    <img src="/img/help/overview_pipelines.png" width="80%"/><br/>
-                                    Eine fehlerfrei durchgelaufene Pipeline liefert etwa ein solches Ergebnis:
-                                    <img src="/img/help/output.png" width="80%"/><br/>
-                                    Für eine Übersicht über häufig auftretende Fehler und was man dagegen tun kann, siehe <a href="#error_Text"> hier </a>.
-                                </li>
-                                <li> Wenn die Änderungen an Ihrer Homepage ohne Probleme übernommen wurden, sehen Sie dies an einem grünen Haken in der Projektübersicht
-                                    <img src="/img/help/pipeline_good.png" width="80%"/>
-                                </li>
-                            </ol>
-                        </p>
-                    </div>
-                </div>
-            </div>
-        </div>
-        
-    
-        
-        
         <div id="error_Text" style="margin-top: 10px;margin-bottom: 30px;">
             <div class="container" style="background-color: #ffffff;">
                 <div style="margin-bottom: 0;padding-top: 20px;padding-bottom: 20px;">
@@ -164,7 +176,10 @@
             </div>
         </div>
         
-        
+        <div class="container" style="background-color: #ffffff;margin-bottom: 30px;">
+            <div class="row">
+            </div>
+       </div> 
     </div>
 </div>
 
diff --git a/help/gitlab.html b/help/gitlab.html
new file mode 100644
index 0000000000000000000000000000000000000000..18f21a602258a8e4b42fbd5e0bdf9c7efa1238a0
--- /dev/null
+++ b/help/gitlab.html
@@ -0,0 +1,184 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
+    <title>Hilfe: Gitlab</title>
+    <link rel="stylesheet" href="/css/bootstrap.min.css">
+    <link rel="stylesheet" href="/css/m4lab.css">
+    <link rel="stylesheet" href="/fonts/font-awesome.min.css">
+    <link rel="stylesheet" href="/fonts/ionicons.min.css">
+    <link rel="stylesheet" href="/css/Testimonials.css">
+    <link rel="stylesheet" href="/css/help.css">
+    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css" integrity="sha384-oS3vJWv+0UjzBfQzYUhtDYW+Pj2yciDJxpsK1OYPAYjqT085Qq/1cq5FLXAZQ7Ay" crossorigin="anonymous">
+</head>
+
+<body>
+
+    <div style="background-color: #dadada;">
+        
+        <div class="container" style="background-color: #ffffff;margin-bottom: 30px;">
+            <div class="row">
+            </div>
+       </div> 
+        <div id="Gitlab_Text" style="margin-top: 40px;margin-bottom: 30px;">
+            <div class="container" style="background-color: #ffffff;">
+                <div style="margin-bottom: 0;padding-top: 20px;padding-bottom: 20px;">
+                    <div class="col-lg-12">
+                        <h2 class="d-flex flex-column flex-shrink-1 justify-content-lg-start text-center" style="padding-top: 15px;color: #708090;"><strong>Gitlab</strong></h2>
+                    </div>
+                    <div class="col-auto flex-row flex-grow-1 flex-fill" style="background-color: #ffffff;">
+                        <p><a href="https://de.wikipedia.org/wiki/GitLab">GitLab</a> ist eine umfangreiche Webanwendung zur Versionsverwaltung für Softwareprojekte auf Basis von <a href="https://de.wikipedia.org/wiki/Git">Git</a> die auch Wiki-Funktionen und Issue Tracking bietet. Das Transferportal der HFT-Stuttgart betreibt eine eigene GitLab-Instanz für die Hochschule für Technik Stuttgart und ihre Kooperationspartner unter einer Open-Access-Lizenz. 
+                        </p>
+                    </div>
+                    <a class="btn btn-primary text-center d-inline-flex d-lg-flex flex-column flex-grow-1 flex-shrink-1 flex-fill justify-content-between align-items-baseline align-content-center align-self-baseline flex-wrap order-3 mb-auto justify-content-md-center align-items-md-end align-items-lg-center justify-content-xl-center mx-auto"
+                            role="button" style="background-color: #E0001B;" href="https://transfer.hft-stuttgart.de/gitlab/explore/projects"><strong>Zugriff auf Gitlab</strong></a>
+                </div>
+            </div>
+        </div>
+        <div id="help_Text" style="margin-top: 10px;margin-bottom: 30px;">
+            <div class="container" style="background-color: #ffffff;">
+                <div style="margin-bottom: 0;padding-top: 20px;padding-bottom: 20px;">
+                    <div class="col-lg-12">
+                        <h2 class="d-flex flex-column order-1 justify-content-lg-start text-center" style="padding-top: 15px;color: #708090;"><strong>Hilfestellung zu Gitlab</strong></h2> 
+                    </div>
+                    <div class="col-auto" style="background-color: #ffffff;">
+                        <div class="help">
+                            <div class="card">
+                                <div class="card-header">
+                                    <h3 class="card-title">
+                                        <a class="collapsed" data-toggle="collapse" href="#collapse1" aria-expanded="false" aria-controls="collapse1">
+                                        <small>Möchten Sie die Projektinhalte ansehen oder herunterladen?</small></a>
+                                    </h3>
+                                </div>
+                                <div id="collapse1" class="card-body collapse" style="">
+                                    <p>
+                                        Dann klicken Sie auf diesen
+                                            <a href="https://transfer.hft-stuttgart.de/gitlab/explore/projects"><i class="fas fa-chevron-right">Link zu den Gitlab-Projekten</i></a>
+                                        um die Liste aller im Gitlab erfassten Projekte zu sehen. Vor dort können Sie dann auf die einzelnen
+                                        Projekte zugreifen.
+                                        Ein Anmelden am Portal ist dazu nicht nötig.
+                                    </p>
+                                </div>
+                            </div>
+                            <br/>
+                            <div class="card">
+                                <div class="card-header">
+                                    <h3 class="card-title">
+                                        <a class="collapsed" data-toggle="collapse" href="#collapse2" aria-expanded="false" aria-controls="collapse2">
+                                            <small>Möchten Sie zu einem Projekt beitragen?</small></a>
+                                    </h3>
+                                </div>
+                                <div id="collapse2" class="card-body collapse" style="">
+                                    <p>
+                                        Sie können mittels Issues dem Projekteigentümer eine Rückmeldung geben bzw. einen Fehler melden.
+                                        Darüberhinaus können Sie sich auch aktiv beteiligen. Dazu müssen Sie im Portal als Nutzer
+                                        registriert sein.
+                                    </p>
+                                    <p>
+                                        Wenn Sie noch kein Benutzerkonto haben, klicken Sie bitte oben auf den Link Benutzerkonto und folgen
+                                        Sie dem System durch die Registrierungsprozedur.
+                                    </p>
+                                    <p>
+                                        Haben Sie ein Benutzerkonto, befolgen Sie bitte folgende Schritte:
+                                    </p>
+                                    <ol>
+                                        <li>
+                                            Folgen Sie dem <a href="https://transfer.hft-stuttgart.de/gitlab/explore/projects">
+                                                <i class="fas fa-chevron-right">Link zu den Gitlab-Projekten</i></a>, um zum Gitlab zu
+                                            gelangen.
+                                        </li>
+                                        <li>
+                                            Melden Sie sich bei Gitlab an, indem Sie im Gitlab auf den Link Sign-In klicken.
+                                        </li>
+                                        <li>
+                                            Sie werden dann auf eine Anmeldeseite von unserem Portal geführt. Geben Sie dort bitte ihre
+                                            Benutzerdaten vom Portal ein.
+                                        </li>
+                                        <li>
+                                            Nach erfolgreichem Anmelden werden Sie zum Gitlab zurückgeführt.
+                                        </li>
+                                        <li>
+                                            Navigieren Sie dann zum Projekt Ihrer Wahl.
+                                        </li>
+                                        <li>
+                                            Abhängig davon wie der Projekteigentümer das Projekt konfiguriert hat, können Sie entweder
+                                            direkt loslegen, oder Sie müssen zunächst noch beim Projekteigentümer Zugang zum Projekt
+                                            anfragen, indem Sie im Gitlab bei der entsprechende Projektseite auf den Link Request Access
+                                            klicken.
+                                        </li>
+                                    </ol>
+                                </div>
+                            </div>
+                            <br/>
+                            <div class="card">
+                                <div class="card-header">
+                                    <h3 class="card-title">
+                                        <a class="collapsed" data-toggle="collapse" href="#collapse3" aria-expanded="false" aria-controls="collapse3">
+                                            <small>Möchten Sie selbst ein Projekt anlegen, um es der Öffentlichkeit
+                                            bereitzustellen?</small></a>
+                                    </h3>
+                                </div>
+                                <div id="collapse3" class="card-body collapse" style="">
+                                <p>
+                                    Vorraussetzung dazu ist, dass Sie aktives oder ehemaliges Mitglied der Hochschule für Technik sind,
+                                    d.h. eine (noch) gültige HFT-Emailadresse haben, und zudem im Portal als Nutzer registriert sein.
+                                </p>
+                                <p>
+                                    Wenn Sie noch kein Benutzerkonto haben, klicken Sie bitte oben auf den Link Benutzerkonto und folgen
+                                    Sie dem System durch die Registrierungsprozedur.
+                                </p>
+                                <p>
+                                    Haben Sie ein Benutzerkonto, befolgen Sie bitte folgende Schritte:
+                                </p>
+                                <ol>
+                                    <li>
+                                        Folgen Sie dem <a href="https://transfer.hft-stuttgart.de/gitlab/explore/projects">
+                                        <i class="fas fa-chevron-right">Link zu den Gitlab-Projekten</i></a>, um zum Gitlab zu
+                                        gelangen.
+                                    </li>
+                                    <li>
+                                        Melden Sie sich bei Gitlab an, indem Sie im Gitlab auf den Link Sign-In klicken.
+                                    </li>
+                                    <li>
+                                        Sie werden dann auf eine Anmeldeseite von unserem Portal geführt. Geben Sie dort bitte ihre
+                                        Benutzerdaten vom Portal ein.
+                                    </li>
+                                    <li>
+                                        Nach erfolgreichem Anmelden werden Sie zum Gitlab zurückgeführt.
+                                    </li>
+                                    <li>
+                                        Erstellen Sie dann in Gitlab ein neues Projekt durch Klicken auf den grünen New Project-Knopf
+                                        und anschließendem Befolgen der Eingabemaske von Gitlab.
+                                    </li>
+                                </ol>
+                                <p>
+                                    Weitere Hilfestellung zum Anlegen von Projekten in Gitlab finden Sie in der <a href="https://docs.gitlab.com/ee/gitlab-basics/create-project.html" target="_blank">Gitlab-Dokumentation</a>.
+                                </p>
+                                <p>
+                                    Hinweis: Um Inhalte zum Gitlab "pushen" zu können, verwendet die Gitlab-Instanz unseres Portals die
+                                    s.g. "SSH Keys".
+                                    Weitere Informationen dazu finden Sie in der <a href="https://transfer.hft-stuttgart.de/gitlab/help/ssh/README" target="_blank">
+                                    <i class="fas fa-chevron-right">Gitlab-Dokumentation zu SSH Keys</i></a>.
+                                </p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="container" style="background-color: #ffffff;margin-bottom: 30px;">
+        <div class="row">
+        </div>
+    </div> 
+</div>
+
+<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
+<!--<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>-->
+<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
+<script src="/js/headfoot.js"></script>
+</body>
+
+</html>
diff --git a/help/index.html b/help/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..4e1b156885de2628cd7be1305715e9336a840f58
--- /dev/null
+++ b/help/index.html
@@ -0,0 +1,89 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
+    <title>Hilfe</title>
+    <link rel="stylesheet" href="/css/bootstrap.min.css">
+    <link rel="stylesheet" href="/css/m4lab.css">
+    <link rel="stylesheet" href="/fonts/font-awesome.min.css">
+    <link rel="stylesheet" href="/fonts/ionicons.min.css">
+    <link rel="stylesheet" href="/css/Testimonials.css">
+    <link rel="stylesheet" href="/css/help.css">
+    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css" integrity="sha384-oS3vJWv+0UjzBfQzYUhtDYW+Pj2yciDJxpsK1OYPAYjqT085Qq/1cq5FLXAZQ7Ay" crossorigin="anonymous">
+</head>
+
+<body>
+
+    <div style="background-color: #dadada;">
+        <div class="container" style="background-color: #ffffff;margin-bottom: 30px;">
+            <div class="row">
+                <div class="col-md-12">
+                    <h4 class="text-center">Hilfethemen Ãœbersicht</h4>
+                    
+                </div>
+            </div>
+        </div>
+        <div id="gitlab" style="margin-top: 40px;margin-bottom: 30px;">
+            <div class="container" style="background-color: #ffffff;">
+                <div style="margin-bottom: 0;padding-top: 20px;padding-bottom: 20px;">
+                    <div class="col-lg-12">
+                        <h2 class="d-flex flex-column order-1 justify-content-lg-start text-center" style="padding-top: 15px;color: #708090;"><strong>Gitlab</strong></h2>
+                    </div>
+                    <div class="col-auto" style="background-color: #ffffff;">
+                        <ul>
+                            <li>
+                                <a href="/help/gitlab.html"> Projektverwaltung mittels Gitlab </a>
+                            </li>
+                            <li>
+                                <a href="/help/gitlab-pages.html">Projektwebseiten mittels Gitlab-pages </a>
+                            </li>
+                        </ul>
+                    </div>
+                </div>
+            </div>
+        </div>
+    
+        <div id="videoconference" style="margin-top: 10px;margin-bottom: 30px;">
+            <div class="container" style="background-color: #ffffff;">
+                <div style="margin-bottom: 0;padding-top: 20px;padding-bottom: 20px;">
+                    <div class="col-lg-12">
+                        <h2 class="d-flex flex-column order-1 justify-content-lg-start text-center" style="padding-top: 15px;color: #708090;"><strong>Videokonferenzen</strong></h2>
+                    </div>
+                    <div class="col-auto" style="background-color: #ffffff;">
+                        <ul>
+                            <li>
+                                <a href="/help/jitsi.html"> Videokonferenzen über Jitsi</a>
+                            </li>
+                        </ul>
+                    </div>
+                </div>
+            </div>
+        </div>
+        
+        <div id="videoconference" style="margin-top: 10px;margin-bottom: 30px;">
+            <div class="container" style="background-color: #ffffff;">
+                <div style="margin-bottom: 0;padding-top: 20px;padding-bottom: 20px;">
+                    <div class="col-lg-12">
+                        <h2 class="d-flex flex-column order-1 justify-content-lg-start text-center" style="padding-top: 15px;color: #708090;"><strong>Mailinglisten</strong></h2>
+                    </div>
+                    <div class="col-auto" style="background-color: #ffffff;">
+                        <ul>
+                            <li>
+                                <a href="/help/mailinglists.html"> Mailinglisten erstellen und verwalten</a>
+                            </li>
+                        </ul>
+                    </div>
+                </div>
+            </div>
+        </div>
+</div>
+
+<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
+<!--<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>-->
+<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
+<script src="/js/headfoot.js"></script>
+</body>
+
+</html>
diff --git a/help/jitsi.html b/help/jitsi.html
new file mode 100644
index 0000000000000000000000000000000000000000..9ee3684756c724d16b776f44d6222760da91989e
--- /dev/null
+++ b/help/jitsi.html
@@ -0,0 +1,76 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
+    <title>Hilfe: Jitsi</title>
+    <link rel="stylesheet" href="/css/bootstrap.min.css">
+    <link rel="stylesheet" href="/css/m4lab.css">
+    <link rel="stylesheet" href="/fonts/font-awesome.min.css">
+    <link rel="stylesheet" href="/fonts/ionicons.min.css">
+    <link rel="stylesheet" href="/css/Testimonials.css">
+    <link rel="stylesheet" href="/css/help.css">
+    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css" integrity="sha384-oS3vJWv+0UjzBfQzYUhtDYW+Pj2yciDJxpsK1OYPAYjqT085Qq/1cq5FLXAZQ7Ay" crossorigin="anonymous">
+</head>
+
+<body>
+
+    <div style="background-color: #dadada;">
+       <div class="container" style="background-color: #ffffff;margin-bottom: 30px;">
+            <div class="row">
+       <!--         <div class="col-md-12">
+                    <h4 class="text-center">Jitsi</h4>
+                    
+                </div>
+       -->     </div>
+       </div> 
+        <div id="Jitsi" style="margin-top: 40px;margin-bottom: 30px;">
+            <div class="container" style="background-color: #ffffff;">
+                <div style="margin-bottom: 0;padding-top: 20px;padding-bottom: 20px;">
+                    <div class="col-lg-12">
+                        <h2 class="d-flex flex-column order-1 justify-content-lg-start text-center" style="padding-top: 15px;color: #708090;"><strong>Jitsi</strong></h2>
+                    </div>
+                    <div class="col-auto" style="background-color: #ffffff;">
+                        <p> 
+                            Jitsi ist ein Open-Source-Videokonferenz-System für HFT-interne und externe Nutzer. Es ermöglicht, Videokonferenzen direkt im Browser abzuhalten. Wir empfehlen hierbei die Nutzung von Chrome auf einem Desktopsystem oder Laptop. Die Verwendung des Internet Explorers hierfür ist leider nicht möglich, da Jitsi über diesen nicht aufgerufen werden kann. Da die Daten-Hauptlast bei diesem System clientseitig getragen wird, raten wir von einer Nutzung auf mobilen Endgeräten ab. 
+                        </p>
+                    </div>
+                </div>
+                 <a class="btn btn-primary text-center d-inline-flex d-lg-flex flex-column flex-grow-1 flex-shrink-1 flex-fill justify-content-between align-items-baseline align-content-center align-self-baseline flex-wrap order-3 mb-auto justify-content-md-center align-items-md-end align-items-lg-center justify-content-xl-center mx-auto"
+                            role="button" style="background-color: #E0001B;" href="https://telemeeting.hft-stuttgart.de"><strong>Zugang über das Transferportal</strong></a>
+            </div>
+        </div>
+    
+        <div id="usage" style="margin-top: 10px;margin-bottom: 30px;">
+            <div class="container" style="background-color: #ffffff;">
+                <div style="margin-bottom: 0;padding-top: 20px;padding-bottom: 20px;">
+                    <div class="col-lg-12">
+                        <h2 class="d-flex flex-column order-1 justify-content-lg-start text-center" style="padding-top: 15px;color: #708090;"><strong>Jitsi verwenden</strong></h2>
+                    </div>
+                    <div class="col-auto" style="background-color: #ffffff;">
+                        <ol>
+                            <li>Beim Transferportal als Organisator anmelden</li>
+                            <li>Videokonferenz über Jitsi eröffnen</li>
+                            <li>Eingabe eines Namens für das Meeting<br></li>
+                            <li>Start der Konferenz<br></li>
+                            <li>Einladung weiterer Teilnehmer über den generierten Link<br></li>
+                        </ul>
+                    </div>
+                </div>
+            </div>
+        </div>
+      
+      <div class="container" style="background-color: #ffffff;margin-bottom: 30px;">
+            <div class="row">
+            </div>
+       </div> 
+</div>
+
+<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
+<!--<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>-->
+<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
+<script src="/js/headfoot.js"></script>
+</body>
+
+</html>
diff --git a/help/mailinglists.html b/help/mailinglists.html
new file mode 100644
index 0000000000000000000000000000000000000000..161be526d7824e0f179e87bfdfa9df7eb87e9f9b
--- /dev/null
+++ b/help/mailinglists.html
@@ -0,0 +1,122 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
+    <title>Hilfe: Mailinglisten</title>
+    <link rel="stylesheet" href="/css/bootstrap.min.css">
+    <link rel="stylesheet" href="/css/m4lab.css">
+    <link rel="stylesheet" href="/fonts/font-awesome.min.css">
+    <link rel="stylesheet" href="/fonts/ionicons.min.css">
+    <link rel="stylesheet" href="/css/Testimonials.css">
+    <link rel="stylesheet" href="/css/help.css">
+    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css" integrity="sha384-oS3vJWv+0UjzBfQzYUhtDYW+Pj2yciDJxpsK1OYPAYjqT085Qq/1cq5FLXAZQ7Ay" crossorigin="anonymous">
+</head>
+
+<body>
+
+    <div style="background-color: #dadada;">
+        <div class="container" style="background-color: #ffffff;margin-bottom: 30px;">
+            <div class="row">
+            </div>
+        </div>
+        <div id="abo" style="margin-top: 40px;margin-bottom: 30px;">
+            <div class="container" style="background-color: #ffffff;">
+                <div style="margin-bottom: 0;padding-top: 20px;padding-bottom: 20px;">
+                    <div class="col-lg-12">
+                        <h2 class="d-flex flex-column flex-shrink-1 justify-content-lg-start text-center" style="padding-top: 15px;color: #708090;"><strong>Mailinglisten</strong></h2>
+                    </div>
+                    <div class="col-auto" style="background-color: #ffffff;">
+                        <div class="help">
+                            <div class="card">
+                                <div class="card-header">
+                                    <h3 class="card-title">
+                                        <a class="collapsed" data-toggle="collapse" href="#collapse1" aria-expanded="false" aria-controls="collapse1">
+                                        <small>Mailingliste abonnieren</small></a>
+                                    </h3>
+                                </div>
+                                <div id="collapse1" class="card-body collapse" style="">
+                                    <p>
+                                        <ol>
+                                            <li>
+                                                Gehen Sie im Transferportal auf Zusammenarbeit – Mailinglisten. Dort finden Sie alle Mailinglisten, die zur Zeit im Transferportal gelistet sind.
+                                            </li>
+                                            <li>
+                                                Klicken Sie auf den Link der Mailingliste, der Sie interessiert. Sie werden dann zum Mailinglistendienst des DFN (Deutsches Forschungsnetzwerk) weitergeleitet, über den die Mailinglisten verwaltet werden.
+                                            </li>
+                                            <li>
+                                                Sie landen dann auf der Infoseite des DFN zur entsprechenden Mailinglist. Klicken Sie hier den Link <em> Abonnieren </em> <img src="/img/help/ml_abo_00.png" width="95%"/>
+                                            </li>
+                                            <li>
+                                                Es erscheint eine Eingabemaske. Schreiben SieIhre Emailadresse in das Feld. Klicken Sie dann den Link <em> Ausführen </em> <img src="/img/help/ml_abo_01.png" width="95%"/>
+                                            </li>
+                                            <li>
+                                                Es erscheint eine Webseite mit Hinweisen zum weiteren Vorgehen. <img src="/img/help/ml_abo_02.png" width="95%"/>
+                                            </li>
+                                            <li>
+                                                Überprüfen Sie Ihr Emailpostfach auf die genannte Email. Klicken Sie auf den Link, mit dem Sie das Abonnement bestätigen. (Im Beispiel der zweite Link) <img src="/img/help/ml_abo_03.png" width="95%"/> 
+                                            </li>
+                                            <li>
+                                                War die Bestätigung erfolgreich, sollten Sie eine Willkommensemail erhalten haben: <img src="/img/help/ml_abo_04.png" width="95%"/> <br/> Von jetzt an sollten Sie alle Emails in ihr Postfach erhalten, die über diese Mailingliste verteilt werden. <br/> <b> Hinweis:</b> Manchmal konfiguriert ein Listenbetreiber die Liste so, dass Abonnementanfragen zunächst bestätigt werden müssen. Wenn dem so ist, erhalten Sie die Wilkommensemail erst nach Freigabe durch den Listenbetreiber.
+                                            </li>
+                                            <li>
+                                                In der Regel hat der Listenbetreiber die Mailingliste so eingestellt, dass auch Sie als Abonnent an die Liste schreiben können. Dazu schicken Sie einfach über Ihr normales Emailprogramm eine Email an die in der Einladung genannente Adresse. Diese hat die Form: <p> NAME_DER_LISTE@listserv.dfn.de </p>. 
+                                                Je nach Konfiguration durch den Listenbetreiber wird Ihre Email direkt verteilt oder muss zunächst durch die Moderation freigegeben werden. <br/> <b> Anmerkung </b> Eine typische Ausnahme, bei der Sie als Abonnent keine Emails an die Liste versenden können ist, wenn der Listenbetreiber die Liste als Newsletter verwendet 
+                                            </li>
+                                            <li>
+                                                Wenn Sie die Mailingliste wieder abbestellen wollen, können Sie
+                                                <ul>
+                                                    <li>
+                                                        den dazu in der Wilkommensemail genannten Link verwenden
+                                                    </li>
+                                                    <li>
+                                                        auf die Infoseite der Mailingliste zurückkehren (siehe Punkt 2), dort auf <em> Abbestellen </em> klicken und den Anweisungen folgen.
+                                                    </li>
+                                                </ul>
+                                            </li>
+                                            <li>
+                                                <b> Hinweis für Mailinglisten-Erfahrene </b> <br/> Sie können auch weitere Einstellungen bzgl. des Empfangs und Versands von Emails machen, sowie weitere Mailinglisten, die Sie über den DFN-Dienst abonnieren, verwalten. Dazu müssen Sie sich auf <a href="https://www.listserv.dfn.de/sympa">https://www.listserv.dfn.de/sympa</a> mit Ihrer Mailadresse registrieren und anmelden. Dann stehen Ihnen über die Weboberfläche verschiedene Funktionen zur Verfügung.
+                                            </li>
+                                        </ol>
+                                    </p>
+                                    <a class="btn btn-primary text-center d-inline-flex d-lg-flex flex-column flex-grow-1 flex-shrink-1 flex-fill justify-content-between align-items-baseline align-content-center align-self-baseline flex-wrap order-3 mb-auto justify-content-md-center align-items-md-end align-items-lg-center justify-content-xl-center mx-auto"
+                                    role="button" style="background-color: #E0001B;" href="https://www.listserv.dfn.de/sympa/help"><strong>Weitergehende Dokumentation bei DFN (externer Link)</strong></a>
+                                </div>
+                            </div>
+                            <br/>
+                            <div class="card">
+                                <div class="card-header">
+                                    <h3 class="card-title">
+                                        <a class="collapsed" data-toggle="collapse" href="#collapse2" aria-expanded="false" aria-controls="collapse2">
+                                        <small>Mailingliste erstellen</small></a>
+                                    </h3>
+                                </div>
+                                <div id="collapse2" class="card-body collapse" style="">
+                                    <p>
+                                    </p>
+                                    
+                                <a class="btn btn-primary text-center d-inline-flex d-lg-flex flex-column flex-grow-1 flex-shrink-1 flex-fill justify-content-between align-items-baseline align-content-center align-self-baseline flex-wrap order-3 mb-auto justify-content-md-center align-items-md-end align-items-lg-center justify-content-xl-center mx-auto"
+                                    role="button" style="background-color: #E0001B;" href="https://www.listserv.dfn.de/sympa/help/admin"><strong>Weitergehende Dokumentation bei DFN (externer Link)</strong></a>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <div class="container" style="background-color: #ffffff;margin-bottom: 30px;">
+            <div class="row">
+            </div>
+        </div>
+        
+        
+</div>
+
+<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
+<!--<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>-->
+<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
+<script src="/js/headfoot.js"></script>
+</body>
+
+</html>
diff --git a/img/help/ml_abo_00.png b/img/help/ml_abo_00.png
new file mode 100644
index 0000000000000000000000000000000000000000..4ad59530636fce60d10482480322bc2bb2c6ac45
Binary files /dev/null and b/img/help/ml_abo_00.png differ
diff --git a/img/help/ml_abo_01.png b/img/help/ml_abo_01.png
new file mode 100644
index 0000000000000000000000000000000000000000..5d89db645deadc70b0eebf7f41a9a1f724ec155b
Binary files /dev/null and b/img/help/ml_abo_01.png differ
diff --git a/img/help/ml_abo_02.png b/img/help/ml_abo_02.png
new file mode 100644
index 0000000000000000000000000000000000000000..e35263707217053460f31543ef29c1c67708f082
Binary files /dev/null and b/img/help/ml_abo_02.png differ
diff --git a/img/help/ml_abo_03.png b/img/help/ml_abo_03.png
new file mode 100644
index 0000000000000000000000000000000000000000..f014ef3217a93e1c6abd864b1a5e5b07f0364a8b
Binary files /dev/null and b/img/help/ml_abo_03.png differ
diff --git a/img/help/ml_abo_04.png b/img/help/ml_abo_04.png
new file mode 100644
index 0000000000000000000000000000000000000000..a0a9108f7ab86d11ff8dcfd68106f2caea73ad56
Binary files /dev/null and b/img/help/ml_abo_04.png differ
diff --git a/js/headfoot.js b/js/headfoot.js
index c386403bec82370e44e2b89b23aa408fdf887dae..6d9b19e74881491a5356853183318ba28f82c246 100755
--- a/js/headfoot.js
+++ b/js/headfoot.js
@@ -1,4 +1,4 @@
-var menu = [{'name':'Informationen', 'combos':[{'name':'Projekte', 'link':'/project'}, {'name':'Ãœber das M4_LAB', 'link':'/projectoverview?projectID=1'},{'name':'Kontakt', 'link':'/account/contact'}], 'type':'dropdown', 'link':'#'},{'name':'Zusammenarbeit', 'combos':[{'name':'Mailinglisten', 'link':'/mailinglists'},{'name':'Videokonferenzen', 'link':'/videoconference.html'},/* {'name':'...', 'link':'#'}*/], 'type':'dropdown', 'link':'#'},{'name':'Events', 'combos':[{'name':'Veranstaltungen der HfT', 'link':'http://www.hft-stuttgart.de/Aktuell/Veranstaltungen/'},{'name':'Veranstaltungen der HfT Forschung', 'link':'https://www.hft-stuttgart.de/forschung/veranstaltungen'}], 'type':'dropdown', 'link':'#'},{'name':'Hilfe', 'combos':[{'name':'Webseiten mit Gitlab-Pages', 'link':'/help/gitlab-pages.html'}], 'type':'dropdown', 'link':'#'},{'name':'Benutzerkonto', 'combos': [], 'type':'', 'link':'/account/'}];
+var menu = [{'name':'Informationen', 'combos':[{'name':'Projekte', 'link':'/project'}, {'name':'Ãœber das M4_LAB', 'link':'/projectoverview?projectID=1'},{'name':'Kontakt', 'link':'/account/contact'}], 'type':'dropdown', 'link':'#'},{'name':'Zusammenarbeit', 'combos':[{'name':'Mailinglisten', 'link':'/mailinglists'},{'name':'Videokonferenzen', 'link':'/videoconference.html'},/* {'name':'...', 'link':'#'}*/], 'type':'dropdown', 'link':'#'},{'name':'Events', 'combos':[{'name':'Veranstaltungen der HfT', 'link':'http://www.hft-stuttgart.de/Aktuell/Veranstaltungen/'},{'name':'Veranstaltungen der HfT Forschung', 'link':'https://www.hft-stuttgart.de/forschung/veranstaltungen'}], 'type':'dropdown', 'link':'#'},{'name':'<i class="fa fa-question-circle" aria-hidden="true"></i>', 'combos': [], 'type':'', 'link':'/help/'},{'name':'<i class="fa fa-user-circle" aria-hidden="true"></i>', 'combos': [], 'type':'', 'link':'/account/'}];
 
 
 var hft_links = [{'url':'/account/contact', 'name':'Kontakt'},{'url':'https://www.hft-stuttgart.de/impressum', 'name':'Impressum'},{'url':'https://www.hft-stuttgart.de/datenschutz', 'name':'Datenschutz'}]
diff --git a/videoconference.html b/videoconference.html
index 6fc99975274802316e73d268f2fb52af18b4f29a..caabf102283e9039cc7b366d914ec9b9741a0290 100644
--- a/videoconference.html
+++ b/videoconference.html
@@ -96,19 +96,13 @@
                     <div class="col-auto col-md-4 col-lg-6 flex-row flex-grow-1 flex-fill order-1" style="background-color: #ffffff;">
                         <p>Jitsi&nbsp;ist ein Open-Source-Videokonferenz-System für HFT-interne und externe Nutzer. Es ermöglicht, Videokonferenzen direkt im Browser abzuhalten. Wir empfehlen hierbei die Nutzung von Chrome auf einem Desktopsystem oder Laptop.
                             Die Verwendung des Internet Explorers hierfür ist leider nicht möglich, da Jitsi über diesen nicht aufgerufen werden kann. Da die Daten-Hauptlast bei diesem System clientseitig getragen wird, raten wir von einer Nutzung auf
-                            mobilen Endgeräten ab.&nbsp;<br/><br/>Aktuelle Informationen und Tutorials zu Jitsi finden Sie auf den&nbsp;<a href="https://confluence.hft-stuttgart.de/display/IAF001/Jitsi+an+der+HFT">Confluence-Seiten der HFT Stuttgart</a>&nbsp;(Intranet).<br/></p>
+                            mobilen Endgeräten ab.&nbsp;<br/></p>
                     </div>
                     <div class="col-auto col-md-4 col-lg-6 text-center flex-row flex-grow-1 flex-fill justify-content-between flex-wrap order-2" style="background-color: #ffffff;">
                         <div class="justify-content-between order-2" style="background-color: rgba(255,255,255,0);">
-                            <p class="text-left d-flex d-md-flex flex-row flex-grow-1 flex-shrink-1 flex-fill justify-content-between align-items-start align-content-start align-self-start flex-wrap order-1 justify-content-md-center align-items-md-start justify-content-lg-start"><strong>Um Jitsi zu nutzen gehen Sie folgendermaßen vor:</strong></p>
-                            <ol class="text-left justify-content-end order-2">
-                                <li>Gehen Sie zu Jitsi, in dem Sie auf den Link "Zugang über das Transferportal" klicken.</li>
-                                <li>Geben Sie einen Namen für das Meeting ein.</li>
-                                <li>Als Gastgeber des Meetings klicken Sie auf "Ich bin der Gastgeber / I am the host".</li>
-                                <li>Sie werden dann auf eine Anmeldeseite von unserem Portal geführt. Geben Sie dort bitte ihre Benutzerdaten vom Portal ein.</li>
-                                <li>Nach erfolgreichem Anmelden werden Sie zu Jitsi zurückgeführt und das Meeting startet.</li>
-                                <li>Teilen Sie den generierten Link mit den anderen Teilnehmern, so dass diese sich einwählen können.</li>
-                            </ol>
+                            <p class="text-left d-flex d-md-flex flex-row flex-grow-1 flex-shrink-1 flex-fill justify-content-between align-items-start align-content-start align-self-start flex-wrap order-1 justify-content-md-center align-items-md-start justify-content-lg-start">
+                            Aktuelle Informationen und Tutorials zu Jitsi finden Sie auf den&nbsp;<a href="https://confluence.hft-stuttgart.de/display/IAF001/Jitsi+an+der+HFT">Confluence-Seiten der HFT Stuttgart</a>&nbsp;(Intranet).<br/><br/><strong>Eine Anleitung zur Nutzung von Jitsi finden Sie in unserem <a href="/help/jitsi.html"> Hilfebereich </a> </strong>
+                            </p>
                         </div><a class="btn btn-primary text-center d-inline-flex d-lg-flex flex-column flex-grow-1 flex-shrink-1 flex-fill justify-content-between align-items-baseline align-content-center align-self-baseline flex-wrap order-3 mb-auto justify-content-md-center align-items-md-end align-items-lg-center justify-content-xl-center mx-auto"
                             role="button" style="background-color: #E0001B;" href="https://telemeeting.hft-stuttgart.de/"><strong>Zugang über das Transferportal</strong></a></div>
                 </div>
@@ -157,4 +151,4 @@
 <script src="/js/headfoot.js"></script>
 </body>
 
-</html>
\ No newline at end of file
+</html>