diff --git a/mutalyzer/website/templates/batch-job-progress.html b/mutalyzer/website/templates/batch-job-progress.html
index bed41e1265caa6c3a2b3b66479742bf37e0105ec..7f64c01fd0bcb95029c71e732da60fec3b4546a0 100644
--- a/mutalyzer/website/templates/batch-job-progress.html
+++ b/mutalyzer/website/templates/batch-job-progress.html
@@ -16,6 +16,7 @@
     <a href="{{ url_for('.batch_job_result', result_id=result_id) }}">batch-job-{{ result_id }}.txt</a>
     </p>
   </div>
+
   {% if items_left %}
     <script type="text/javascript">
 function check_items_left() {
@@ -38,8 +39,8 @@ function check_items_left() {
 }
 check_items_left();
     </script>
-  {% endif %}
-{% else %}
+  {% endif %}{# items_left #}
+{% else %}{# result_id #}
   <p>Unknow batch job.</p>
 {% endif %}
 
diff --git a/mutalyzer/website/templates/batch-jobs.html b/mutalyzer/website/templates/batch-jobs.html
index 36876544b07a1147fcde977260d0642562dc2df3..f428b69cfc7bf946d661a9118394bc9294270c84 100644
--- a/mutalyzer/website/templates/batch-jobs.html
+++ b/mutalyzer/website/templates/batch-jobs.html
@@ -10,101 +10,106 @@
 
 {% block content %}
 
-    <form action="{{ url_for('.batch_jobs_submit') }}" method="post" enctype="multipart/form-data">
-		<!-- BatchType -->
-		<div class="form-group">
-			<label>Batch job type</label>
-			<div class="radio">
-				<label><input onchange="return changeBatch(this);" type="radio" name="job_type" value="name-checker"{% if job_type == "name-checker" %} checked{% endif %} />Name Checker</label>
-			</div>
-			<div class="radio">
-				<label><input onchange="return changeBatch(this);" type="radio" name="job_type" value="syntax-checker"{% if job_type == "syntax-checker" %} checked{% endif %} />Syntax Checker</label>
-			</div>
-			<div class="radio">
-				<label><input onchange="return changeBatch(this);" type="radio" name="job_type" value="position-converter"{% if job_type == "position-converter" %} checked{% endif %} />Position Converter</label>
-			</div>
-			<div class="radio">
-				<label><input onchange="return changeBatch(this);" type="radio" name="job_type" value="snp-converter"{% if job_type == "snp-converter" %} checked{% endif %} />SNP Converter</label>
-			</div>
-
-			<div id="assembly_name_or_alias" style="display:none" class="form-group">
-				<label>Assembly</label>
-				<select name="assembly_name_or_alias" class="form-control">
-					{% for assembly in assemblies %}
-					<option value="{{ assembly.name }}"{% if assembly_name_or_alias in (assembly.name, assembly.alias) %} selected="selected"{% endif %}>{{ assembly.taxonomy_common_name }} &mdash; {{ assembly.name }}{% if assembly.alias %} ({{ assembly.alias }}){% endif %}</option>
-					{% endfor %}
-				</select>
-			</div>
-
-			<div class="form-group">
-				<label for="email">Email address</label>
-				<input name="email" type="email" class="form-control" placeholder="Email address" required value="{{ email }}">
-			</div>
-
-			<div class="form-group">
-				<label for="file">File</label>
-				<input type="file" name="file">
-			</div>
-		</div>
-
-		<div class="form-group">
-			<input type="submit" class="btn btn-primary" value="Submit">
-			<a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/BatchCheckers" target="new" class="btn btn-default pull-right">Help</a>
-			<a href="#" onclick="toggle_visibility('help');" class="btn btn-default pull-right">File format help <span class="caret"></span></a>
-
-		</div>
-	</form>
-
-<div id='help' style="display:none">
-	<h3>Help</h3>
+<form class="form" action="{{ url_for('.batch_jobs_submit') }}" method="post" enctype="multipart/form-data">
+  <!-- BatchType -->
+  <div class="form-group">
+    <label>Batch job type</label>
+    <div class="radio">
+      <label><input onchange="return changeBatch(this);" type="radio" name="job_type" value="name-checker"{% if job_type == "name-checker" %} checked{% endif %} />Name Checker</label>
+    </div>
+    <div class="radio">
+      <label><input onchange="return changeBatch(this);" type="radio" name="job_type" value="syntax-checker"{% if job_type == "syntax-checker" %} checked{% endif %} />Syntax Checker</label>
+    </div>
+    <div class="radio">
+      <label><input onchange="return changeBatch(this);" type="radio" name="job_type" value="position-converter"{% if job_type == "position-converter" %} checked{% endif %} />Position Converter</label>
+    </div>
+    <div class="radio">
+      <label><input onchange="return changeBatch(this);" type="radio" name="job_type" value="snp-converter"{% if job_type == "snp-converter" %} checked{% endif %} />SNP Converter</label>
+    </div>
+
+    <div id="assembly_name_or_alias" style="display:none" class="form-group">
+      <label>Assembly</label>
+      <select name="assembly_name_or_alias" class="form-control">
+        {% for assembly in assemblies %}
+          <option value="{{ assembly.name }}"{% if assembly_name_or_alias in (assembly.name, assembly.alias) %} selected="selected"{% endif %}>{{ assembly.taxonomy_common_name }} &mdash; {{ assembly.name }}{% if assembly.alias %} ({{ assembly.alias }}){% endif %}</option>
+        {% endfor %}
+      </select>
+    </div>
+
+    <div class="form-group">
+      <label for="email">Email address</label>
+      <input name="email" type="email" class="form-control" placeholder="Email address" required value="{{ email }}">
+    </div>
+
+    <div class="form-group">
+      <label for="file">File</label>
+      <input type="file" name="file">
+    </div>
+  </div>
+
+  <div class="form-group">
+      <input type="submit" class="btn btn-primary" value="Submit">
+      <a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/BatchCheckers" target="new" class="btn btn-default pull-right">Help</a>
+      <a href="#" onclick="toggle_visibility('help');" class="btn btn-default pull-right">File format help <span class="caret"></span></a>
+  </div>
+</form>
+
+<div id="help" style="display:none">
+  <hr>
   <p>The mutalyzer batch checker accepts the following file formats:</p>
-    <ul>
-        <li>Tab delimited text file / CSV file</li>
-        <li>Microsoft Excel file</li>
-        <li>OpenOffice ODS file</li>
-    </ul>
-    <p>
+  <ul>
+    <li>Tab delimited text file / CSV file</li>
+    <li>Microsoft Excel file</li>
+    <li>OpenOffice ODS file</li>
+  </ul>
+  <p>
     The maximum file size is {{ max_file_size }} megabytes, and the maximum
     length per entry (variant description) is 200 characters.
-    </p>
-  We accept two types of input files, you can download examples below.
+  </p>
 
-	<h4>New Style</h4>
-	<p>This file format has no header-row. Each row consists of one or more tab delimited fields, where every field contains a single variant description (or dbSNP rs number in case of the SNP Converter). Note that all rows must have the same number of fields.</p>
-	  <table class="table">
-	      <tr><td>AB026906.1:c.274G&gt;T</td></tr>
-	      <tr><td>AL449423.14(CDKN2A_v002):c.5_400del</td></tr>
-	  </table>
-  	<a href="{{ url_for('.downloads', filename='batchtestnew.txt') }}">Download new style example file</a>
+  <p>We accept two types of input files, you can download examples below.</p>
 
+  <h4>New Style</h4>
+  <p>This file format has no header-row. Each row consists of one or more tab delimited fields, where every field contains a single variant description (or dbSNP rs number in case of the SNP Converter). Note that all rows must have the same number of fields.</p>
+  <table class="table">
+    <tr><td>AB026906.1:c.274G&gt;T</td></tr>
+    <tr><td>AL449423.14(CDKN2A_v002):c.5_400del</td></tr>
+  </table>
 
-  <h4>Old Style</h4>
-      <p >This file format has a header-row, which consists of
-      three tab delimited fields. In each following row the
-      corressponding data is also tab delimited.</p>
-      <table class="table">
-          <thead>
-              <th>AccNo</th>
-			  <th>Genesymbol</th>
-			  <th>Mutation</th>
-          </thead>
-          <tr>
-              <td>AB026906.1</td><td>SDHD</td><td>g.7872G>T</td>
-          </tr>
-      </table>
-
-	  <a href="{{ url_for('.downloads', filename='batchtestold.txt') }}">Download old style example file</a>
+  <p><a href="{{ url_for('.downloads', filename='batchtestnew.txt') }}">Download new style example file</a></p>
 
+  <h4>Old Style</h4>
+  <p>This file format has a header-row, which consists of
+    three tab delimited fields. In each following row the
+    corressponding data is also tab delimited.</p>
+  <table class="table">
+    <thead>
+      <tr>
+        <th>AccNo</th>
+        <th>Genesymbol</th>
+        <th>Mutation</th>
+      </tr>
+    </thead>
+    <tbody>
+      <tr>
+        <td>AB026906.1</td><td>SDHD</td><td>g.7872G>T</td>
+      </tr>
+    </tbody>
+  </table>
+
+  <p><a href="{{ url_for('.downloads', filename='batchtestold.txt') }}">Download old style example file</a></p>
 
   <h4>Output Format</h4>
-	<p>
-		The output of a Mutalyzer Batch run is a tab delimited CSV file,
-        which has a header-row to clarify the results. We recommend opening
-        the file in a spreadsheet program, such as OpenOffice Calc or
-        Microsoft Excel.<BR />
-        Note that empty lines are removed from the batch input file.
-	</p>
-</div>
+
+  <p>
+    The output of a Mutalyzer Batch run is a tab delimited CSV file,
+    which has a header-row to clarify the results. We recommend opening
+    the file in a spreadsheet program, such as OpenOffice Calc or
+    Microsoft Excel.
+  </p>
+  <p>Note that empty lines are removed from the batch input file.</p>
+</div>{# id="help" #}
+
 <script language="javascript">
 oldload = window.onload
 initpage = function() {
@@ -115,29 +120,15 @@ initpage = function() {
 window.onload = initpage;
 </script>
 
-{% if errors %}
-  <div class="alert alert-danger">
-  <h4>Batch not started</h4>
-  <p>The batch process was not started due to the following errors:</p>
-  <ul>
-    {% for m in errors %}
-      <li class="{{ m.class }}" title="{{ m.level }} (origin: {{ m.origin
-      }})">{{ m.description }}</li>
-    {% endfor %}
-  </ul>
-	</div>
-{% endif %}
-
 {% if messages %}
-  <p>
-  <b>Messages:</b>
-  </p>
-  <div class="messages">
-    {% for m in messages %}
-      <p class="{{ m.class }}" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p>
-    {% endfor %}
-    <p>{{ summary }}</p>
-  </div>
+  <hr>
+  {% for m in messages %}
+    {% if m.class == "error" %}
+      <p class="alert alert-danger" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p>
+    {% elif m.class == "warning" %}
+      <p class="alert alert-warning" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p>
+    {% endif %}
+  {% endfor %}
 {% endif %}
 
 {% endblock content %}
diff --git a/mutalyzer/website/templates/description-extractor.html b/mutalyzer/website/templates/description-extractor.html
index 4f41354cba2be09c532e2a9226102a75a12a2c54..98efb347370f6147a62ff6ea55c1d9b5dad63de0 100644
--- a/mutalyzer/website/templates/description-extractor.html
+++ b/mutalyzer/website/templates/description-extractor.html
@@ -5,12 +5,12 @@
 
 {% block content %}
 
-<p>
-<b style="color: red">Note that this is an experimental service.</b>
-</p>
+<p class="alert alert-warning">Note that this is an experimental service.</p
 
 <p>
-Extract the HGVS variant description from a reference sequence and an observed sequence. For now, we require the user to fill in two sequences. After the testing phase, we plan to use the underlying algorithm for:
+Extract the HGVS variant description from a reference sequence and an observed
+sequence. For now, we require the user to fill in two sequences. After the
+testing phase, we plan to use the underlying algorithm for:
 </p>
 
 <ul>
@@ -26,84 +26,76 @@ Extract the HGVS variant description from a reference sequence and an observed s
 </ul>
 
 <p>
-	Please supply a reference sequence and an observed sequence.
+Please supply a reference sequence and an observed sequence.
 </p>
 
-	<form action="{{ url_for('.description_extractor') }}" method="get" class="form">
-		<div class="form-group">
-			<h3>Reference sequence</h3>
-			<p>Example: <code class="example-input">ATGATTTGATCAGATACATGTGATACCGGTAGTTAGGACAA</code></p>
-			<input type="text" name="reference_sequence" value="{{ reference_sequence }}" class="form-control form-pre example-target" placeholder="Reference sequence">
-			<!-- <input type="button" value="Clear field" onclick="clearField(this.form, 'reference_sequence');" class="btn"> -->
-		</div>
-		<div class="form-group">
-			<h3>Observed sequence</h3>
-
-			<p>Example: <code class="example-input-2">ATGATTTGATCAGATACATGTGATACCGGTAGTTAGGACAA</code></p>
-			<input type="text" name="variant_sequence" value="{{ variant_sequence }}" class="form-control form-pre example-target-2" placeholder="Observed sequence">
-			<!-- <input type="button" value="Clear field" onclick="clearField(this.form, 'variant_sequence');" class="btn"> -->
-		</div>
-		
-		<div class="form-group">
-			<input type="submit" class="btn btn-primary" value="Submit">
-			<input type="reset" class="btn btn-default pull-right" value="Undo">
-			<a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/DescriptionExtractor" target="new" class="btn btn-default pull-right">Help</a>
-		</div>
-	</form>
+<form action="{{ url_for('.description_extractor') }}" method="get" class="form">
+  <div class="form-group">
+    <label for="reference_sequence">Reference sequence</label>
+    <input type="text" name="reference_sequence" value="{{ reference_sequence }}" class="form-control form-pre example-target" placeholder="Reference sequence">
+    <p>Example: <code class="example-input">ATGATTTGATCAGATACATGTGATACCGGTAGTTAGGACAA</code></p>
+  </div>
+  <div class="form-group">
+    <label for="variant_sequence">Observed sequence</label>
+    <input type="text" name="variant_sequence" value="{{ variant_sequence }}" class="form-control form-pre example-target-2" placeholder="Observed sequence">
+    <p>Example: <code class="example-input-2">ATGATTTGATCAGATACATGTGATACCGGTAGTTAGGACAA</code></p>
+  </div>
+  <div class="form-group">
+    <input type="submit" class="btn btn-primary" value="Submit">
+    <a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/DescriptionExtractor" target="new" class="btn btn-default pull-right">Help</a>
+  </div>
+</form>
 
 {% if description %}
-  <h3>Variant Description Extractor results:</h3>
-
-<table class="table">
-      {% for m in messages %}
-		{% if m.class == "error" %}
-			<tr><td class="alert alert-danger" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</td></tr>
-		{% elif m.class == "warning" %}
-			<tr><td class="warning" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</td></tr>
-		{% endif %}
-      {% endfor %}
-	  
-	  {% if summary == "0 Errors, 0 Warnings."%}
-			<tr><td class="success summary">{{ summary }}</td>
-	  {% endif %}
-</table>
+  <hr>
+  {% for m in messages %}
+    {% if m.class == "error" %}
+      <p class="alert alert-danger" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p>
+    {% elif m.class == "warning" %}
+      <p class="alert warning" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p>
+    {% endif %}
+  {% endfor %}
 
+  {% if summary == "0 Errors, 0 Warnings." %}
+    <p class="alert alert-success summary">{{ summary }}</p>
+  {% else %}
+    <p>{{summary}}</p>
+  {% endif %}
 
   {% if not errors %}
-    <p>
-    <b>Genomic description:</b>
-    </p>
-    <p>
-    <pre>g.{{ description }}</pre>
-    </p>
-    <p>
-    <b>Overview of the raw variants:</b>
-    </p>
+    <hr>
+
+    <h4>Genomic description</h4>
+    <p><code>g.{{ description }}</code></p>
+
+    <h4>Overview of the raw variants</h4>
     <table class="table">
-      <thead><tr>
-        <th>Start</th>
-        <th>End</th>
-        <th>Type</th>
-        <th>Deleted</th>
-        <th>Inserted</th>
-        <th>Shift</th>
-        <th>Description</th>
-      </tr></thead>
-      {% for raw_var in raw_vars %}
-       <tbody>
-		<tr>
-          <td>{{ raw_var.start }}</td>
-          <td>{{ raw_var.end }}</td>
-          <td>{{ raw_var.type }}</td>
-          <td>{{ raw_var.deleted }}</td>
-          <td>{{ raw_var.inserted }}</td>
-          <td>{{ raw_var.shift }}</td>
-          <td>{{ raw_var.hgvs }}</td>
+      <thead>
+        <tr>
+          <th>Start</th>
+          <th>End</th>
+          <th>Type</th>
+          <th>Deleted</th>
+          <th>Inserted</th>
+          <th>Shift</th>
+          <th>Description</th>
         </tr>
-	   </tbody>
-      {% endfor %}
+      </thead>
+      <tbody>
+        {% for raw_var in raw_vars %}
+          <tr>
+            <td>{{ raw_var.start }}</td>
+            <td>{{ raw_var.end }}</td>
+            <td>{{ raw_var.type }}</td>
+            <td>{{ raw_var.deleted }}</td>
+            <td>{{ raw_var.inserted }}</td>
+            <td>{{ raw_var.shift }}</td>
+            <td>{{ raw_var.hgvs }}</td>
+          </tr>
+        {% endfor %}
+      </tbody>
     </table>
-  {% endif %}
-{% endif %}
+  {% endif %}{# not errors #}
+{% endif %}{# description #}
 
 {% endblock content %}
diff --git a/mutalyzer/website/templates/name-checker.html b/mutalyzer/website/templates/name-checker.html
index fc697e432cbd13fb1764e799d0cafe1a882d9654..94549c1180c0a2137b8ad3dd2760edeb62f047cf 100644
--- a/mutalyzer/website/templates/name-checker.html
+++ b/mutalyzer/website/templates/name-checker.html
@@ -1,5 +1,5 @@
 {% if not standalone %}
-	{% extends "base.html" %}
+    {% extends "base.html" %}
 {% endif -%}
 
 <!DOCTYPE html>
@@ -29,287 +29,285 @@
 
 <body>
 
-	<h1>Name Checker</h1>
+<h1>Name Checker</h1>
 
-	{% set active_page = "name-checker" %}
-	{% set page_title = "Name Checker" %}
+{% set active_page = "name-checker" %}
+{% set page_title = "Name Checker" %}
 
-    <div class="container-fluid" >
+<div class="container-fluid" >
 
 {% block content %}
 
-		{% if parse_error %}
-			<div class="alert alert-danger">
-				<h4>Parse error</h4>
-				<p>The &quot;^&quot; indicates the position where the error occurred:</p>
-			    <pre>{{ parse_error[0] }}<br>{{ parse_error[1] }}</pre>
-			</div><!--  alert alert-danger -->
-		{% endif %} <!-- if parse_error -->
-
-        {% if messages %}
-            {% for m in messages %}
-                {% if m.class == "error" %}
-                    <p class="alert alert-danger" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p>
-                {% elif m.class == "warning" %}
-                    <p class="alert alert-warning" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p>
-                {% endif %}
-            {% endfor %}
-        {% endif %} <!-- messages -->
-
-        {% if summary == "0 Errors, 0 Warnings."%}
-            <p class="alert alert-success summary">{{ summary }}</p>
-        {% else %}
-            <p>{{summary}}</p>
-            <hr />
+{% if not standalone %}
+  <p>
+  Please insert the mutation name using
+  the <a href="http://www.hgvs.org/mutnomen" title="Human Genome Variation
+  Society standard variant nomenclature" alt="Human Genome Variation Society
+  standard variant nomenclature">HGVS</a> format:
+  </p>
+
+  <pre>&lt;accession number&gt;.&lt;version number&gt;(&lt;gene symbol&gt;):&lt;sequence type&gt;.&lt;variant description&gt;</pre>
+
+  <form class="form" action="{{ url_for('.name_checker') }}" method="get">
+    <div class="form-group">
+      <label for="description">HGVS Description</label>
+      <input class="form-control form-pre example-target" type="text" name="description" id="hgvs" value="{{ description }}" placeholder="Mutation name using HGVS format">
+      <p>Example: <code class="example-input">AB026906.1:c.274G&gt;T</code></p>
+    </div>
+
+    <div class="form-group button-group">
+      <input type="submit" class="btn btn-primary" value="Check name">
+      <a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/NameChecker" target="new" class="btn btn-default pull-right">Help</a>
+    </div>
+  </form>
+
+  {% if description %}
+    <hr>
+  {% endif %}
+{% endif %}{# not standalone #}
+
+{% if description %}
+  {% if parse_error %}
+    <div class="alert alert-danger">
+      <h4>Parse error</h4>
+      <pre>{{ parse_error[0] }}<br>{{ parse_error[1] }}</pre>
+      <p>The &quot;^&quot; indicates the position where the error occurred.</p>
+    </div>
+  {% endif %}
+
+  {% if messages %}
+    {% for m in messages %}
+      {% if m.class == "error" %}
+        <p class="alert alert-danger" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p>
+      {% elif m.class == "warning" %}
+        <p class="alert alert-warning" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p>
+      {% endif %}
+    {% endfor %}
+  {% endif %}
+
+  {% if summary == "0 Errors, 0 Warnings." %}
+      <p class="alert alert-success summary">{{ summary }}</p>
+  {% else %}
+      <p>{{summary}}</p>
+  {% endif %}
+
+  {% if not parse_error %}
+    <hr>
+
+    <div class="row">
+      <div class="col-md-8 name-checker-left-column">
+        {% if visualisation %}
+          <h4>Overview of the raw variants</h4>
+          {% for i in visualisation %}
+            <p>Raw variant {{ loop.index }}: {{ i[0] }}</p>
+            <pre>{{ i[1] }}<br>{{ i[2] }}</pre>
+          {% endfor %}
         {% endif %}
 
-	    {% if not standalone %}
-            <p>
-                Please insert the mutation name using the <a href="http://www.hgvs.org/mutnomen" title="Human Genome Variation Society standard variant nomenclature" alt="Human Genome Variation Society standard variant nomenclature">HGVS</a> format: <br/>
+        {% if browserLink %}
+          <p><a href="{{ browserLink }}">View original variant in UCSC Genome Browser</a></p>
+        {% endif %}
 
-                <code>&lt;accession number&gt;.&lt;version number&gt;(&lt;gene symbol&gt;):&lt;sequence type&gt;.&lt;variant description&gt;</code>
-            </p>
+        {% if genomicDescription %}
+          {% if genomicDNA %}
+            <h4>Genomic description</h4>
+          {% else %}
+            <h4>Description relative to transcription start</h4>
+            <p>(Not for use in LSDBs in case of protein-coding transcripts).</p>
+          {% endif %}
+          <p><code><a href="{{ url_for('.name_checker', description=genomicDescription) }}">{{ genomicDescription }}</a></code></p>
+        {% endif %}
+
+        {% if chromDescription %}
+          <h4>Alternative chromosomal position</h4>
+          <p><code>{{ chromDescription }}</code></p>
+        {% endif %}
 
-            <p>Example: <code class="example-input">AB026906.1:c.274G&gt;T</code>	</p>
+        {% if descriptions %}
+          <h4>Affected transcripts</h4>
+          {% for i in descriptions %}
+            {% if i.endswith('?') %}
+              <p><code>{{ i }}</code></p>
+            {% else %}
+              <p><code><a href="{{ url_for('.name_checker', description=i) }}">{{ i }}</a></code></p>
+            {% endif %}
+          {% endfor %}
+        {% endif %}
 
-            <form class="form" action="{{ url_for('.name_checker') }}" method="get">
-            <div class="form-group">
-                <label for="description">HGVS Description</label>
-                <input class="form-control form-pre example-target" type="text" name="description" id="hgvs" value="{{ description }}" placeholder="Mutation name using HGVS format">
-            </div>
+        {% if protDescriptions %}
+          <h4>Affected proteins</h4>
+          {% for i in protDescriptions %}
+            <p><code>{{ i }}</code></p>
+          {% endfor %}
+        {% endif %}
+
+        {% if transcriptInfo %}
+          {% if oldProtein %}
+            <h4>Reference protein</h4>
+            <pre>
+            {%- for i in oldProtein -%}
+              {{-i |safe -}}<br>
+            {%- endfor -%}
+            </pre>
+
+            <h4>Protein codedicted from variant coding sequence</h4>
+            {% if newProtein %}
+              <pre>
+              {%- for i in newProtein -%}
+                {{- i|safe -}}<br>
+              {%- endfor -%}
+              </pre>
+            {% else %}
+              <p>No change: codedicted protein (not shown) equals reference protein.</p>
+            {% endif %}
+
+            {% if altStart %}
+              <h4>Alternative protein using start codon {{ altStart }}</h4>
+              {% if altProtein %}
+                <pre>
+                {%- for i in altProtein -%}
+                  {{- i|safe -}}<br>
+                {%- endfor -%}
+                </pre>
+              {% else %}
+                <p>No change: codedicted protein (not shown) equals reference protein.</p>
+              {% endif %}
+            {% endif %}
+          {% endif %}
+        {% endif %}{# transcriptInfo #}
+
+        {% if restrictionSites %}
+          <h4>Effects on Restriction sites</h4>
+          <table class="table">
+            <thead>
+              <tr>
+                <th>Raw variant</th>
+                <th>Created</th>
+                <th>Deleted</th>
+              </tr>
+            </thead>
+            <tbody>
+              {% for i in restrictionSites %}
+                <tr>
+                  <td>{{ loop.index }}</td>
+                  <td>
+                  {% for j in i[0] %}
+                      {{ j }}{{ ',' if not loop.last }}
+                  {% endfor %}
+                  </td>
+                  <td>
+                  {% for j in i[1] %}
+                      {{ j }}{{ ',' if not loop.last }}
+                  {% endfor %}
+                  </td>
+                </tr>
+              {% endfor %}
+            </tbody>
+          </table>
+        {% endif %}
 
-            <div class="form-group button-group">
-                <input type="submit" class="btn btn-primary" value="Check name">
-                <a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/NameChecker" target="new" class="btn btn-default pull-right">Help</a>
-                <input type="reset" class="btn btn-default pull-right" value="Undo">
-            </div>
-            </form>
+        {% if extractedDescription %}
+          <h4>Experimental services</h4>
+          <p>Genomic description: <code>{{ extractedDescription }}</code></p>
+          <p>Protein description: <code>{{ extractedProtein }}</code></p>
         {% endif %}
+      </div>{# class="col-md-8 name-checker-left-column" #}
+
+      <div class="col-md-4">
+          {% if transcriptInfo %}
+            <h4>Exon information</h4>
+            <table class="table table2">
+              <thead>
+                <tr>
+                  <th>Number</th>
+                  <th>Start (g.)</th>
+                  <th>Stop (g.)</th>
+                  <th>Start {{ '(c.)' if transcriptCoding else '(n.)' }}</th>
+                  <th>Stop {{ '(c.)' if transcriptCoding else '(n.)' }}</th>
+                </tr>
+              </thead>
+              <tbody>
+                {% for i in exonInfo %}
+                  <tr>
+                    <td>{{ loop.index }}</td>
+                    {% for j in i %}
+                      <td>{{ j }}</td>
+                    {% endfor %}
+                  </tr>
+                {% endfor %}
+              </tbody>
+            </table>
+
+            {% if transcriptCoding %}
+              <h4><span class="helper" title="Coding Sequence">CDS</span> information</h4>
+              <table class="table">
+                <thead>
+                  <tr>
+                    <th></th>
+                    <th>g.</th>
+                    <th>c.</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  <tr>
+                    <td>Start</td>
+                    <td>{{ cdsStart_g }}</td>
+                    <td>{{ cdsStart_c }}</td>
+                  </tr>
+                  <tr>
+                    <td>Stop</td>
+                    <td>{{ cdsStop_g }}</td>
+                    <td>{{ cdsStop_c }}</td>
+                  </tr>
+                </tbody>
+              </table>
+            {% endif %}
+          {% endif %}{# transcriptInfo #}
+
+          {% if reference_filename and not standalone %}
+            <h4>Links</h4>
+            <p>
+            Download this reference sequence file:
+            <a href="{{ url_for('.reference', filename=reference_filename) }}">{{ reference_filename }}</a>
+            </p>
+          {% endif %}
+      </div>{# class="col-md-4" #}
+    </div>{# class="row" #}
+
+    <div class="row">
+      <div class="col-md-12">
+        <hr />
+        {% if legends %}
+          <h4>Legend</h4>
+          <table class="table table3">
+            <thead>
+              <tr>
+                <th>Name</th>
+                <th>ID</th>
+                <th>Locus tag</th>
+                <th>Product</th>
+                <th>Link method</th>
+              </tr>
+            </thead>
+            <tbody>
+              {% for i in legends %}
+                <tr>
+                  {% for j in i %}
+                    <td>{{ j if j else '' }}</td>
+                  {% endfor %}
+                </tr>
+              {% endfor %}
+            </tbody>
+          </table>
+        {% endif %}
+      </div>
+    </div>
+  {% endif %}{# not parse_error #}
+{% endif %}{# description #}
 
-	<hr />
-	<div class="row">
-		<div class="col-md-8 name-checker-left-column">
-			{% if visualisation %}
-				<h3>Overview of the raw variants</h3>
-				{% for i in visualisation %}
-					<p>Raw variant {{ loop.index }}: {{ i[0] }}</p>
-					<pre>{{ i[1] }}<br>{{ i[2] }}</pre>
-				{% endfor %}
-			{% endif %} <!-- if visualisation -->
-
-			{% if browserLink %}
-				<p>
-				<a href="{{ browserLink }}">View original variant in UCSC Genome Browser</a>
-				</p>
-			{% endif %} <!-- if browserLink -->
-
-			{% if not parse_error %}
-				{% if description %}
-					<h3>Name checker results</h3>
-
-					{% if genomicDescription %}
-						{% if genomicDNA %}
-							<h4>Genomic description</h4>
-						{% else %} <!-- if genomicDNA -->
-							<h4>Description relative to transcription start</h4>
-							(Not for use in LSDBs in case of protein-coding transcripts).
-						{% endif %} <!-- if genomicDNA -->
-						<code><a href="{{ url_for('.name_checker', description=genomicDescription) }}">{{ genomicDescription }}</a></code>
-					{% endif %} <!-- if genomicDescription -->
-
-					{% if chromDescription %}
-						<p>Alternative chromosomal position:</p>
-						<code>{{ chromDescription }}</code>
-					{% endif %} <!-- if chromDescription -->
-
-					{% if descriptions %}
-						<h4>Affected transcripts:</h4>
-						{% for i in descriptions %}
-							{% if i.endswith('?') %}
-								<code>{{ i }}</code>
-								{% else %}
-								<code><a href="{{ url_for('.name_checker', description=i) }}">{{ i }}</a></code>
-							{% endif %} <!-- if endswith -->
-						{% endfor %} <!-- for i in descriptions -->
-					{% endif %} <!-- if descriptions -->
-
-					{% if protDescriptions %}
-						<h4>Affected proteins:</h4>
-						<p>
-						{% for i in protDescriptions %}
-							<code>{{ i }}</code>
-						{% endfor %} <!-- for i in protDescriptions -->
-						</p>
-					{% endif %} <!-- if protDescriptions -->
-
-					{% if transcriptInfo %}
-						{% if oldProtein %}
-						<h4>Reference protein</h4>
-						<pre>
-						{%- for i in oldProtein -%}
-							{{-i |safe -}}<br>
-						{%- endfor -%}
-						</pre>
-
-						<h4>Protein codedicted from variant coding sequence</h4>
-						{% if newProtein %}
-							<pre>
-							{%- for i in newProtein -%}
-								{{- i|safe -}}<br>
-							{%- endfor -%} <!-- for i in newProtein -->
-							</pre>
-						{% else %} <!-- if newProtein -->
-							<p>
-							No change: codedicted protein (not shown) equals reference
-							protein.
-							</p>
-						{% endif %} <!-- if newProtein -->
-
-						{% if altStart %}
-							<h4>Alternative protein using start codon {{ altStart }}</h4>
-							{% if altProtein %}
-								<pre>
-								{%- for i in altProtein -%}
-									{{- i|safe -}}<br>
-								{%- endfor -%} <!-- for i in altProtein -->
-								</pre>
-							{% else %} <!-- if altProtein -->
-								<p>No change: codedicted protein (not shown) equals reference protein.</p>
-							{% endif %} <!-- if altProtein -->
-						{% endif %} <!-- if altStart -->
-					{% endif %} <!-- if transcriptInfo -->
-
-					{% if restrictionSites %}
-						<h4>Effects on Restriction sites</h4>
-						<div class="code">
-							<table class="table table3">
-								<thead>
-								<th>Raw variant</th>
-								<th>Created</th>
-								<th>Deleted</th>
-								</thead>
-								{% for i in restrictionSites %}
-									<tr>
-									<td>{{ loop.index }}</td>
-									<td>
-									{% for j in i[0] %}
-										{{ j }}{{ ',' if not loop.last }}
-									{% endfor %}
-									</td>
-									<td>
-									{% for j in i[1] %}
-										{{ j }}{{ ',' if not loop.last }}
-									{% endfor %}
-									</td>
-									</tr>
-								{% endfor %}
-							</table>
-						</div>
-					{% endif %} <!-- if restrictionSites -->
-
-					{% if extractedDescription %}
-						<h4>Experimental services</h4>
-						<p>Genomic description: <code>{{ extractedDescription }}</code></p>
-						<p>Protein description: <code>{{ extractedProtein }}</code></p>
-					{% endif %} <!-- if extractedDescription -->
-				{% endif %} <!-- description -->
-			{% endif %} <!-- parse_error -->
-		</div><!-- col-md-8 -->
-
-		<div class="col-md-4">
-			{% if description %}
-				<h4>Exon information</h4>
-				<div class="code">
-					<table class="table table2">
-						<thead>
-						<th>Number</th>
-						<th>Start (g.)</th>
-						<th>Stop (g.)</th>
-						<th>Start {{ '(c.)' if transcriptCoding else '(n.)' }}</th>
-						<th>Stop {{ '(c.)' if transcriptCoding else '(n.)' }}</th>
-						</thead>
-
-						{% for i in exonInfo %}
-							<tr>
-								<td>{{ loop.index }}</td>
-								{% for j in i %}
-									<td>{{ j }}</td>
-								{% endfor %}
-							</tr>
-						{% endfor %}
-					</table>
-				</div>
-
-				{% if transcriptCoding %}
-					<h4><span class = "helper" title = "Coding Sequence">CDS</span> information:</h4>
-					<div class="code">
-						<table class="table table3">
-						<thead>
-						<th></th>
-						<th>g.</th>
-						<th>c.</th>
-						</thead>
-						<tr>
-						<td>Start</td>
-						<td>{{ cdsStart_g }}</td>
-						<td>{{ cdsStart_c }}</td>
-						</tr>
-						<tr>
-						<td>Stop</td>
-						<td>{{ cdsStop_g }}</td>
-						<td>{{ cdsStop_c }}</td>
-						</tr>
-						<tr>
-						</tr>
-						</table>
-					</div>
-				{% endif %} <!-- if transcriptCoding -->
-				<!-- {% endif %} --> <!-- ??? -->
-
-
-				{% if reference_filename and not standalone %}
-					<h4>Links</h4>
-					<p>
-					Download this reference sequence file:
-					<a href="{{ url_for('.reference', filename=reference_filename) }}">{{ reference_filename }}</a>
-					</p>
-				{% endif %}
-
-			{% endif %} <!-- description -->
-		</div><!-- col-md-4 -->
-	</div><!-- row -->
-
-	{% if not parse_error %}
-	<div class="row">
-		<div class="col-md-12">
-			<hr />
-			{% if legends %}
-				<h4>Legend</h4>
-				<div class="code">
-				<table class="table table3">
-				  <thead>
-					<th>Name</th>
-					<th>ID</th>
-					<th>Locus tag</th>
-					<th>Product</th>
-					<th>Link method</th>
-				  </thead>
-				  {% for i in legends %}
-					<tr>
-					  {% for j in i %}
-						<td>{{ j if j else '' }}</td>
-					  {% endfor %}
-					</tr>
-				  {% endfor %}
-				</table>
-				</div>
-			{% endif %}
-		</div><!-- col-md-12 -->
-	</div><!-- row -->
-	{% endif %}
 {% endblock content %}
 
-    </div>
+</div>
 
 {% if piwik %}
 <!-- Piwik -->
diff --git a/mutalyzer/website/templates/name-generator.html b/mutalyzer/website/templates/name-generator.html
index 0467603ce2466d175d2bdcbcd9abf81e1d54b576..fcf152e3fe7c96c80bce135eb20c3591288e780b 100644
--- a/mutalyzer/website/templates/name-generator.html
+++ b/mutalyzer/website/templates/name-generator.html
@@ -1,156 +1,156 @@
-
 {% extends "base.html" %}
 
 {% set active_page = "name-generator" %}
 {% set page_title = "Name Generator" %}
 
 {% block content %}
-	<div class="form">
-		
-		<p>Construct the mutation from a reference by adding variants to it. The HGVS name is constructed instantly <a href="#constructed_name">below</a>.
-		
-		<hr/>
-	
-	<form id="mainform" onkeyup="update();" onchange="update();" style="padding: 0;" class="form-horizontal" role="form">
-
-		<h4>Reference</h4>
-		<div class="form-group">
-			<label for="refe" class="col-sm-2 control-label">Reference sequence</label>
-			<div class="col-sm-10">
-				<input type="text" name="refe" value=""class="form-control" placeholder="Reference" >
-			</div>
-		</div>
-			
-		<div class="form-group">
-			<label for="seqT" class="col-sm-2 control-label">Sequence Type</label>
-			<div class="col-sm-10">
-				<select name="seqT" class="form-control">
-					<option value="g">Genomic</option>
-					<option value="c" selected="1">Coding DNA</option>
-					<option value="n">NonCoding DNA</option>
-					<option value="r">RNAcss</option>
-					<option value="m">Mitochondrial DNA</option>
-					<option value="p" disabled="true">Protein</option>
-					<!-- Protein Naming not yet implemented-->
-					<option value="e">EST</option>
-				</select>
-			</div>
-		</div>
-			
-
-		<div id="tlc" style="display: none; " class="form-group">
-			<label class="label-left">TLC</label>
-			<div class="radio">
-				<label class="label-left"><input type="radio" name="tlc" value="0"class="form-control" > One Letter Code</label>
-			</div>
-			<div class="radio">
-				<label class="label-left"><input type="radio" name="tlc" value="1" checked=""class="form-control" > Three Letter Code</label>
-			</div>
-		</div>
-
-			<div id="gSym" class="form-group">
-				<label for="gSym" class="col-sm-2 control-label">Gene symbol</label>
-				<div class="col-sm-10">
-					<input type="text" name="gSym" size="20" value=""class="form-control" placeholder="Gene symbol">
-				</div>
-			</div>
-
-			<div id="tVar" class="form-group">
-				<label for="tVar" class="col-sm-2 control-label">Transcript</label>
-				<div class="col-sm-10">
-					<input type="text" name="tVar" size="20" value=""class="form-control form-control-small" placeholder="Transcript">
-				</div>
-			</div>
-			
-		<div class="form-group small text-danger">
-			<div class="col-sm-offset-2 col-sm-10">
-				<div id="seqTerror" style="display: none;"></div>
-				<div id="refeerror"></div>
-				<div id="gSymerror"></div>
-				<div id="tVarerror"></div>
-			</div>
-		</div>
-	
-	<div id="variants">
-	<!-- This is where the mutations will be arriving -->
-	</div>
-		
-<!-- 	<div id="optional">
-		<sup>*</sup> This field is optional
-	</div> -->
-	
+
+    <div class="form">
+
+        <p>Construct the mutation from a reference by adding variants to it. The HGVS name is constructed instantly <a href="#constructed_name">below</a>.
+
+        <hr/>
+
+    <form id="mainform" onkeyup="update();" onchange="update();" style="padding: 0;" class="form-horizontal" role="form">
+
+        <h4>Reference</h4>
+        <div class="form-group">
+            <label for="refe" class="col-sm-2 control-label">Reference sequence</label>
+            <div class="col-sm-10">
+                <input type="text" name="refe" value=""class="form-control" placeholder="Reference" >
+            </div>
+        </div>
+
+        <div class="form-group">
+            <label for="seqT" class="col-sm-2 control-label">Sequence Type</label>
+            <div class="col-sm-10">
+                <select name="seqT" class="form-control">
+                    <option value="g">Genomic</option>
+                    <option value="c" selected="1">Coding DNA</option>
+                    <option value="n">NonCoding DNA</option>
+                    <option value="r">RNAcss</option>
+                    <option value="m">Mitochondrial DNA</option>
+                    <option value="p" disabled="true">Protein</option>
+                    <!-- Protein Naming not yet implemented-->
+                    <option value="e">EST</option>
+                </select>
+            </div>
+        </div>
+
+
+        <div id="tlc" style="display: none; " class="form-group">
+            <label class="label-left">TLC</label>
+            <div class="radio">
+                <label class="label-left"><input type="radio" name="tlc" value="0"class="form-control" > One Letter Code</label>
+            </div>
+            <div class="radio">
+                <label class="label-left"><input type="radio" name="tlc" value="1" checked=""class="form-control" > Three Letter Code</label>
+            </div>
+        </div>
+
+            <div id="gSym" class="form-group">
+                <label for="gSym" class="col-sm-2 control-label">Gene symbol</label>
+                <div class="col-sm-10">
+                    <input type="text" name="gSym" size="20" value=""class="form-control" placeholder="Gene symbol">
+                </div>
+            </div>
+
+            <div id="tVar" class="form-group">
+                <label for="tVar" class="col-sm-2 control-label">Transcript</label>
+                <div class="col-sm-10">
+                    <input type="text" name="tVar" size="20" value="" class="form-control" placeholder="Transcript">
+                </div>
+            </div>
+
+        <div class="form-group small text-danger">
+            <div class="col-sm-offset-2 col-sm-10">
+                <div id="seqTerror" style="display: none;"></div>
+                <div id="refeerror"></div>
+                <div id="gSymerror"></div>
+                <div id="tVarerror"></div>
+            </div>
+        </div>
+
+    <div id="variants">
+    <!-- This is where the mutations will be arriving -->
+    </div>
+
+<!--    <div id="optional">
+        <sup>*</sup> This field is optional
+    </div> -->
+
 
 <!-- Variant Template -->
-	<div id="varianttemplate" style="display: none">
-		<div class="row form-horizontal-inline">
-			<div class="form-group col-md-6" id="V{NMBR}mutTrow">
-				<label for="V{NMBR}mutT"  id="V{NMBR}mutTname">Mutation Type</label>
-				<select name="V{NMBR}mutT" onchange="update();"class="form-control input-sm" >
-				<option value="1">Substitution</option>
-				<option value="2">Deletion</option>
-				<option value="3">Insertion</option>
-				<option value="4">Duplication</option>
-				<option value="5">Insertion/Deletion</option>
-				<option value="6">Inversion</option>
-			  </select>
-				<div class="text-danger small" id="{NMBR}mutTerror" class="errors"></div>
-			</div>
-		
-			<div class="form-group col-md-6" id="V{NMBR}P1row">
-				<label id="V{NMBR}P1name">Start Position</label>
-				<input type="text" name="V{NMBR}P1" value="" class="form-control input-sm">
-				<div class="text-danger small" id="V{NMBR}P1error"></div>
-			</div>
-	
-			<div class="form-group col-md-6" id="V{NMBR}P2row">
-				<label id="V{NMBR}P2name">End Position</label>
-				<input type="text" name="V{NMBR}P2" size="20" value="" class="form-control input-sm" >
-				<div class="text-danger small" id="V{NMBR}P2error"></div>
-			</div>
-		</div>
-		<div class="row form-horizontal-inline">
-			<div class="col-md-6" id="V{NMBR}S1row">
-			  <div class="form-group" name="S1">
-				  <label id="V{NMBR}S1name">Old Sequence</label>	
-				  <input type="text" name="V{NMBR}S1" size="20" value=""class="form-control input-sm">
-				  <div class="text-danger small" id="V{NMBR}S1error"></div>
-			  </div>
-			</div>
-
-			<div class="col-md-6" id="V{NMBR}S2row">
-			  <div class="form-group" name="S2">
-				  <label id="V{NMBR}S2name">New Sequence</label>	
-				  <input type="text" name="V{NMBR}S2" size="20" value=""class="form-control input-sm">
-				<div class="text-danger small" id="V{NMBR}S2error"></div>
-			  </div>
-			</div>
-		</div>		
-		<hr/>
-	</div><!-- varianttemplate -->
-	
-	
-	
-	<div class="form-group">
-		<div class="col-sm-12">
-			<input type="button" onclick="addVariant();" class="btn btn-success" value="Add variant +">
-			<a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/NameGenerator" target="new" class="btn btn-default pull-right">Help</a>
-			<input type="button" onclick="if(confirm('This action will clear all input fields'))javascript:location.reload(true);" value="Clear form" class="btn btn-default pull-right">
-		</div>
-	</div>
-	
-	
-
-	</form>
-	
-	<hr/>	
-	
-	<a id="constructed_name"><h4>Constructed HGVS Name</h4></a>
-	<pre id="output" >
-		<!-- Empty PlaceHolder -->
-	</pre>
-	<p class="text-muted">Please click the link to check with the Name Checker</p>
-
-	</div><!-- form -->
+    <div id="varianttemplate" style="display: none">
+        <div class="row form-horizontal-inline">
+            <div class="form-group col-md-6" id="V{NMBR}mutTrow">
+                <label for="V{NMBR}mutT"  id="V{NMBR}mutTname">Mutation Type</label>
+                <select name="V{NMBR}mutT" onchange="update();"class="form-control input-sm" >
+                <option value="1">Substitution</option>
+                <option value="2">Deletion</option>
+                <option value="3">Insertion</option>
+                <option value="4">Duplication</option>
+                <option value="5">Insertion/Deletion</option>
+                <option value="6">Inversion</option>
+              </select>
+                <div class="text-danger small" id="{NMBR}mutTerror" class="errors"></div>
+            </div>
+
+            <div class="form-group col-md-6" id="V{NMBR}P1row">
+                <label id="V{NMBR}P1name">Start Position</label>
+                <input type="text" name="V{NMBR}P1" value="" class="form-control input-sm">
+                <div class="text-danger small" id="V{NMBR}P1error"></div>
+            </div>
+
+            <div class="form-group col-md-6" id="V{NMBR}P2row">
+                <label id="V{NMBR}P2name">End Position</label>
+                <input type="text" name="V{NMBR}P2" size="20" value="" class="form-control input-sm" >
+                <div class="text-danger small" id="V{NMBR}P2error"></div>
+            </div>
+        </div>
+        <div class="row form-horizontal-inline">
+            <div class="col-md-6" id="V{NMBR}S1row">
+              <div class="form-group" name="S1">
+                  <label id="V{NMBR}S1name">Old Sequence</label>
+                  <input type="text" name="V{NMBR}S1" size="20" value=""class="form-control input-sm">
+                  <div class="text-danger small" id="V{NMBR}S1error"></div>
+              </div>
+            </div>
+
+            <div class="col-md-6" id="V{NMBR}S2row">
+              <div class="form-group" name="S2">
+                  <label id="V{NMBR}S2name">New Sequence</label>
+                  <input type="text" name="V{NMBR}S2" size="20" value=""class="form-control input-sm">
+                <div class="text-danger small" id="V{NMBR}S2error"></div>
+              </div>
+            </div>
+        </div>
+        <hr/>
+    </div><!-- varianttemplate -->
+
+
+
+    <div class="form-group">
+        <div class="col-sm-12">
+            <input type="button" onclick="addVariant();" class="btn btn-success" value="Add variant +">
+            <a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/NameGenerator" target="new" class="btn btn-default pull-right">Help</a>
+            <input type="button" onclick="if(confirm('This action will clear all input fields'))javascript:location.reload(true);" value="Clear form" class="btn btn-default pull-right">
+        </div>
+    </div>
+
+
+
+    </form>
+
+    <hr/>
+
+    <a id="constructed_name"></a><h4>Constructed HGVS Name</h4>
+    <p><code id="output" >
+        <!-- Empty PlaceHolder -->
+    </code></p>
+    <p class="text-muted">Please click the link to check with the Name Checker</p>
+
+    </div><!-- form -->
 
 
 <!-- Inline Javascript -->
@@ -165,6 +165,4 @@
 
 </script>
 
-
-
 {% endblock content %}
diff --git a/mutalyzer/website/templates/position-converter.html b/mutalyzer/website/templates/position-converter.html
index d7dc142404bc690a70d5725581135fd73eec3f4d..625e4219b6f237e83e90bb5f366e0f64381e3353 100644
--- a/mutalyzer/website/templates/position-converter.html
+++ b/mutalyzer/website/templates/position-converter.html
@@ -5,80 +5,64 @@
 
 {% block content %}
 
-  <p>
-  Please supply the genome assembly which you want to use to convert your
-  position.
-  </p>
-  <p>
-  <b>Note:</b> The Position Converter does NOT check the description or
-  normalize it to HGVS. Use the <a href="{{ url_for('.name_checker') }}">Name Checker</a> for this.
-  </p>
-  <p>
-  Examples: <code class="example-input">NM_003002.2:c.274G&gt;T</code>, <code class="example-input">chr11:g.111959693G&gt;T</code> and <code class="example-input">NC_000011.9:g.111959693G&gt;T</code>
-  </p>
-	<form class="form-horizontal" role="form" action="{{ url_for('.position_converter') }}" method="get" enctype="multipart/form-data">
-	
-		<div class="form-group">
-			<label for="assembly_name_or_alias" class="col-md-2 control-label">Build</label>
-			<div class="col-md-10">
-				<select name="assembly_name_or_alias" class="form-control">
-			{% for assembly in assemblies %}
-					<option value="{{ assembly.name }}"{% if assembly_name_or_alias in (assembly.name, assembly.alias) %} selected="selected"{% endif %}>{{ assembly.taxonomy_common_name }} &mdash; {{ assembly.name }}{% if assembly.alias %} ({{ assembly.alias }}){% endif %}</option>
-			{% endfor %}
-				</select>
-			</div>
-		</div>
-			
-		<div class="form-group">
-			<label for="description" class="col-md-2 control-label">Variant</label>
-			<div class="col-md-10">
-				<input type="text" name="description" value="{{ description }}" class="form-control form-pre example-target" placeholder="Variant">
-			</div>
-		</div>
-		<div class="form-group">
-			<div class=" col-md-12">
-				<input type="submit" class="btn btn-primary" value="Submit">
-				<a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/PositionConverter" target="new" class="btn btn-default pull-right">Help</a>
-				<input type="reset" class="btn btn-default pull-right" value="Undo">
-			</div>
-		</div>
-	</form>
+<p>
+Please supply the genome assembly which you want to use to convert your
+position.
+</p>
 
-{% if description %}
-  <h3>Results</h3>
+<p>
+<b>Note:</b> The Position Converter does NOT check the description or
+normalize it to HGVS. Use the <a href="{{ url_for('.name_checker') }}">Name Checker</a> for this.
+</p>
+
+
+<form class="form" role="form" action="{{ url_for('.position_converter') }}" method="get" enctype="multipart/form-data">
+  <div class="form-group">
+    <label for="assembly_name_or_alias">Build</label>
+    <select name="assembly_name_or_alias" class="form-control">
+      {% for assembly in assemblies %}
+        <option value="{{ assembly.name }}"{% if assembly_name_or_alias in (assembly.name, assembly.alias) %} selected="selected"{% endif %}>{{ assembly.taxonomy_common_name }} &mdash; {{ assembly.name }}{% if assembly.alias %} ({{ assembly.alias }}){% endif %}</option>
+      {% endfor %}
+    </select>
+  </div>
+  <div class="form-group">
+    <label for="description">Variant</label>
+    <input type="text" name="description" value="{{ description }}" class="form-control form-pre example-target" placeholder="Variant">
+    <p>Examples: <code class="example-input">NM_003002.2:c.274G&gt;T</code>, <code class="example-input">chr11:g.111959693G&gt;T</code> and <code class="example-input">NC_000011.9:g.111959693G&gt;T</code></p>
+  </div>
+  <div class="form-group button-group">
+    <input type="submit" class="btn btn-primary" value="Submit">
+    <a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/PositionConverter" target="new" class="btn btn-default pull-right">Help</a>
+  </div>
+</form>
 
+{% if description %}
+  <hr>
   {% for m in messages %}
-	{% if m.class == "error" %}
-		<div class="alert alert-danger" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</div>
-	{% elif m.class == "warning" %}
-		<div class="alert warning" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</div>
-	{% endif %}
+    {% if m.class == "error" %}
+      <p class="alert alert-danger" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p>
+    {% elif m.class == "warning" %}
+      <p class="alert warning" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p>
+    {% endif %}
   {% endfor %}
-  
-  {% if summary == "0 Errors, 0 Warnings."%}
-		<div class="alert success summary">{{ summary }}</div>
+
+  {% if summary == "0 Errors, 0 Warnings." %}
+    <p class="alert alert-success summary">{{ summary }}</p>
   {% else %}
-	<div>{{summary}}</div>
+    <p>{{summary}}</p>
   {% endif %}
 
   {% if chromosomal_description %}
-    <p>
-    <h4>Chromosomal Variant:</h4>
-    </p>
-    <pre>{{ chromosomal_description }}</pre>
-    {% if not transcript_descriptions %}
-      <p>
-      <b>No transcripts found in mutation region</b>
-      </p>
-    {% endif %}
-  {% endif %}
+    <h4>Chromosomal variant</h4>
+    <p><code>{{ chromosomal_description }}</code></p>
 
-  {% if transcript_descriptions %}
-    <p>
-    <b>Found transcripts in mutation region:</b>
-    </p>
-    <pre>{% for d in transcript_descriptions %}{{ d }}<br>{% endfor %}</pre>
+    {% if transcript_descriptions %}
+      <h4>Found transcripts in mutation region</h4>
+      <pre>{% for d in transcript_descriptions %}{{ d }}<br>{% endfor %}</pre>
+    {% else %}
+      <h4>No transcripts found in mutation region</h4>
+    {% endif %}
   {% endif %}
-{% endif %}
+{% endif %}{# description #}
 
 {% endblock content %}
diff --git a/mutalyzer/website/templates/reference-loader.html b/mutalyzer/website/templates/reference-loader.html
index decbc6b89913b6b15dc76bb611f40bae4b10e075..a4e2e1ba3534738a0559f4a3c32f8aeccd565e01 100644
--- a/mutalyzer/website/templates/reference-loader.html
+++ b/mutalyzer/website/templates/reference-loader.html
@@ -13,174 +13,172 @@ window.onload=function(){
 }
 </script>
 
-{% if errors %}
-<div class="alert alert-danger" role="alert">
-	<h4>Reference File not loaded!</h4>
-	The following errors occured:
-	<ul>
-	{% for i in errors %}
-		<li>{{ i }}</li>
-	{% endfor %}
-	</ul>
-</div>
-{% endif %}
-
-{% if ud %}
-<div class="alert alert-success">
-	<h4>Reference Sequence successfully loaded</h4>
-	<p>Your reference sequence was loaded successfully. You can now use Mutalyzer with the following accession number as reference:</p>
-	<p class="text-center" style="font-size: 20px"><strong>{{ ud }}</strong></p>
-	<p class="text-center"><a href="{{ url_for('.reference', filename=ud + '.gb') }}" id="reference_download" class="">Download this reference sequence.</a></p>
-</div>
-{% endif %}
-
-
 <p>
 The Reference File Loader allows you to use your own reference
 sequence when no appropriate RefSeq, GenBank or LRG file is available.
 </p>
 <p>
 Please select one of the options below to upload or retrieve your reference
-sequence (maximum size is {{ max_file_size }} megabytes):
+sequence (maximum size is {{ max_file_size }} megabytes).
 </p>
 
 <form name="invoer" enctype="multipart/form-data" action="{{ url_for('.reference_loader') }}" method="post">
-	<div class="row">
-		<div class="col-md-6">
-			<div class="form-group" id="input-methods">
-				<div class="radio">
-					<label>
-						<input type="radio" name="method" value="upload" checked >
-						The reference sequence file is a local file
-					</label>
-				</div>
-				<div class="radio">	
-					<label>
-						<input type="radio" name="method" value="url" >
-						The reference sequence file can be found at the following URL
-					</label>
-				</div>
-				<div class="radio">	
-					<label>
-						<input type="radio" name="method" value="slice_gene" >
-						Retrieve part of the reference genome for a (HGNC) gene symbol
-					</label>
-				</div>
-				<div class="radio">	
-					<label>
-						<input type="radio" name="method" value="slice_accession" >
-						Retrieve a range of a chromosome by accession number
-					</label>
-				</div>
-				<div class="radio">	
-					<label>
-						<input type="radio" name="method" value="slice_chromosome" >
-						Retrieve a range of a chromosome by name
-					</label>
-				</div>	
-			</div>
-		</div>
-		<script type="text/javascript">
-		$('#input-methods input').on('change', updateVisibility);
-		</script>
-		<div class="col-md-6">
-			
-			
-			<div class="form-group" id="upload_label">
-				<label for="file">GenBank file</label>
-				<input type="file" name="file">
-				<p class="help-block">Please select the GenBank file in plain text format</p>
-			</div>
-			
-			
-			<div class="form-group" id="url_label">
-				<label for="url">GenBank file URL</label>
-				<input type="text" name="url" class="form-control">
-				<p class="help-block">Please enter the URL of the GenBank file in plain text (including http://)</p>
-			</div>
-			
-			
-			<div id="slice_gene_label">
-				<div class="form-group">
-					<p class="help-block">Please enter the Gene symbol and organism name without spaces
-				          and specify the length of the flanking sequences</p>
-					<p class="help-block"><b>Note:</b> This uses
-				          the <a href="http://www.ncbi.nlm.nih.gov/sites/gquery">NCBI
-				          Entrez</a> search engine and is therefore based on the current
-				          Entrez assembly for the given organism (GRCh38/hg38 for human).</p>
-				
-					<label for="genesymbol">Gene symbol</label>
-					<input type="text" name="genesymbol" class="form-control">
-				</div>
-				<div class="form-group">
-					<label for="organism">Organism name</label>
-					<input type="text" name="organism" class="form-control">
-				</div>				
-				<div class="form-group">
-					<label for="upstream">Number of 5' flanking nucleotides</label>
-					<input type="text" name="upstream" value="5000" class="form-control">
-				</div>
-				<div class="form-group">
-					<label for="downstream"><td>Number of 3' flanking nucleotides</label>
-					<input type="text" name="downstream" value="2000" class="form-control">
-				</div>
-			</div>
-			
-			
-			<div id="slice_accession_label">
-				<div class="form-group">
-					<p class="help-block">Please enter the accession number of the chromosome or contig and specify the range</p>
-					<label>Chromosome accession number</label>
-					<input type="text" name="accession" class="form-control">
-				</div>
-				<div class="form-group">
-					<label>Start position</label>
-					<input type="text" name="accession_start" class="form-control">
-				</div>
-				<div class="form-group">
-					<label>Stop position</label>
-					<input type="text" name="accession_stop" class="form-control">
-				</div>
-				<div class="form-group">
-					<label>Orientation</label>
-					<div class="radio"><label><input type="radio" name="accession_orientation" value="1" checked> Forward</label></div>
-					<div class="radio"><label><input type="radio" name="accession_orientation" value="2"> Reverse</label></div>
-				</div>
-			</div>
-			
-			<div id="slice_chromosome_label">
-				<div class="form-group">
-					<p class="help-block">Please enter the name of the chromosome and specify the range</p>
-					<label for="assembly_name_or_alias">Assembly</label>
-	                <select name="assembly_name_or_alias">
-	                  {% for assembly in assemblies %}
-	<option value="{{ assembly.name }}"{% if assembly_name_or_alias in (assembly.name, assembly.alias) %} selected="selected"{% endif %}>{{ assembly.taxonomy_common_name }} &mdash; {{ assembly.name }}{% if assembly.alias %} ({{assembly.alias }}){% endif %}</option>
-	                  {% endfor %}
-	                </select>
-				</div>
-				<div class="form-group">
-					<label for="chromosome">Chromosome name</label>
-					<input type="text" name="chromosome" class="form-control">
-				</div>
-				<div class="form-group">
-					<label for="chromosome_start">Start position</label>
-					<input type="text" name="chromosome_start" class="form-control">
-				</div>
-				<div class="form-group">
-					<label for="chromosome_stop">Stop position</label>
-					<input type="text" name="chromosome_stop" class="form-control">
-				</div>				
-				<div class="form-group">
-					<label for="chromosome_orientation">Orientation</label>
-					<div class="radio"><label><input type="radio" name="chromosome_orientation" value="1" checked> Forward</label></div>
-					<div class="radio"><label><input type="radio" name="chromosome_orientation" value="2"> Reverse</label></div>
-				</div>
-			</div>
-		</div>
-	</div>
-    <input type="submit" value="Submit"class="btn btn-primary btn-submit" >
-	<a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/SyntaxChecker" target="_blank" class="btn btn-default pull-right">Help</a>
-	
+  <div class="row">
+    <div class="col-md-6">
+      <div class="form-group" id="input-methods">
+        <div class="radio">
+          <label>
+            <input type="radio" name="method" value="upload" checked >
+            The reference sequence file is a local file.
+          </label>
+        </div>
+        <div class="radio">
+          <label>
+            <input type="radio" name="method" value="url" >
+            The reference sequence file can be found at the following URL.
+          </label>
+        </div>
+        <div class="radio">
+          <label>
+            <input type="radio" name="method" value="slice_gene" >
+            Retrieve part of the reference genome for a (HGNC) gene symbol.
+          </label>
+        </div>
+        <div class="radio">
+          <label>
+            <input type="radio" name="method" value="slice_accession" >
+            Retrieve a range of a chromosome by accession number.
+          </label>
+        </div>
+        <div class="radio">
+          <label>
+            <input type="radio" name="method" value="slice_chromosome" >
+            Retrieve a range of a chromosome by name.
+          </label>
+        </div>
+      </div>
+    </div>
+
+    <script type="text/javascript">
+    $('#input-methods input').on('change', updateVisibility);
+    </script>
+
+    <div class="col-md-6">
+      <div class="form-group" id="upload_label">
+        <label for="file">GenBank file</label>
+        <input type="file" name="file">
+        <p class="help-block">Please select the GenBank file in plain text format.</p>
+      </div>
+
+      <div class="form-group" id="url_label">
+        <label for="url">GenBank file URL</label>
+        <input type="text" name="url" class="form-control">
+        <p class="help-block">Please enter the URL of the GenBank file in plain text (including http://).</p>
+      </div>
+
+      <div id="slice_gene_label">
+        <div class="form-group">
+          <p class="help-block">Please enter the Gene symbol and organism name without spaces
+            and specify the length of the flanking sequences.</p>
+          <p class="help-block"><b>Note:</b> This uses
+            the <a href="http://www.ncbi.nlm.nih.gov/sites/gquery">NCBI
+              Entrez</a> search engine and is therefore based on the current
+            Entrez assembly for the given organism (GRCh38/hg38 for human).</p>
+          <label for="genesymbol">Gene symbol</label>
+          <input type="text" name="genesymbol" class="form-control">
+        </div>
+        <div class="form-group">
+          <label for="organism">Organism name</label>
+          <input type="text" name="organism" class="form-control">
+        </div>
+        <div class="form-group">
+          <label for="upstream">Number of 5' flanking nucleotides</label>
+          <input type="text" name="upstream" value="5000" class="form-control">
+        </div>
+        <div class="form-group">
+          <label for="downstream"><td>Number of 3' flanking nucleotides</label>
+          <input type="text" name="downstream" value="2000" class="form-control">
+        </div>
+      </div>
+
+      <div id="slice_accession_label">
+        <div class="form-group">
+          <p class="help-block">Please enter the accession number of the chromosome or contig and specify the range.</p>
+          <label>Chromosome accession number</label>
+          <input type="text" name="accession" class="form-control">
+        </div>
+        <div class="form-group">
+          <label>Start position</label>
+          <input type="text" name="accession_start" class="form-control">
+        </div>
+        <div class="form-group">
+          <label>Stop position</label>
+          <input type="text" name="accession_stop" class="form-control">
+        </div>
+        <div class="form-group">
+          <label>Orientation</label>
+          <div class="radio"><label><input type="radio" name="accession_orientation" value="1" checked> Forward</label></div>
+          <div class="radio"><label><input type="radio" name="accession_orientation" value="2"> Reverse</label></div>
+        </div>
+      </div>
+
+      <div id="slice_chromosome_label">
+        <div class="form-group">
+          <p class="help-block">Please enter the name of the chromosome and specify the range.</p>
+          <label for="assembly_name_or_alias">Assembly</label>
+          <select name="assembly_name_or_alias" class="form-control">
+            {% for assembly in assemblies %}
+              <option value="{{ assembly.name }}"{% if assembly_name_or_alias in (assembly.name, assembly.alias) %} selected="selected"{% endif %}>{{ assembly.taxonomy_common_name }} &mdash; {{ assembly.name }}{% if assembly.alias %} ({{assembly.alias }}){% endif %}</option>
+            {% endfor %}
+          </select>
+        </div>
+        <div class="form-group">
+          <label for="chromosome">Chromosome name</label>
+          <input type="text" name="chromosome" class="form-control">
+        </div>
+        <div class="form-group">
+          <label for="chromosome_start">Start position</label>
+          <input type="text" name="chromosome_start" class="form-control">
+        </div>
+        <div class="form-group">
+          <label for="chromosome_stop">Stop position</label>
+          <input type="text" name="chromosome_stop" class="form-control">
+        </div>
+        <div class="form-group">
+          <label for="chromosome_orientation">Orientation</label>
+          <div class="radio"><label><input type="radio" name="chromosome_orientation" value="1" checked> Forward</label></div>
+          <div class="radio"><label><input type="radio" name="chromosome_orientation" value="2"> Reverse</label></div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="form-group">
+    <input type="submit" value="Submit"class="btn btn-primary">
+    <a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/SyntaxChecker" target="_blank" class="btn btn-default pull-right">Help</a>
+  </div>
 </form>
 
+{% if errors %}
+  <hr>
+  <div class="alert alert-danger" role="alert">
+    <h4>Reference File not loaded!</h4>
+    The following errors occured:
+    <ul>
+      {% for i in errors %}
+        <li>{{ i }}</li>
+      {% endfor %}
+    </ul>
+  </div>
+{% endif %}
+
+{% if ud %}
+  <hr>
+  <div class="alert alert-success">
+    <h4>Reference Sequence successfully loaded</h4>
+    <p>Your reference sequence was loaded successfully. You can now use Mutalyzer with the following accession number as reference:</p>
+    <p class="text-center" style="font-size: 20px"><code>{{ ud }}</code></p>
+    <p><a href="{{ url_for('.reference', filename=ud + '.gb') }}" id="reference_download" class="">Download this reference sequence</a>.</p>
+  </div>
+{% endif %}
+
 {% endblock content %}
diff --git a/mutalyzer/website/templates/snp-converter.html b/mutalyzer/website/templates/snp-converter.html
index 837ce97c27218ec863c1889572126d7a7b080128..b24064ff9b0b3cbdfedca2ee3abd75c076e91630 100644
--- a/mutalyzer/website/templates/snp-converter.html
+++ b/mutalyzer/website/templates/snp-converter.html
@@ -5,68 +5,53 @@
 
 {% block content %}
 
-			{% if messages %}
-				{% for m in messages %}
-					{% if m.class == "error" %}
-						<p class="alert alert-danger" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p>
-					{% elif m.class == "warning" %}
-						<p class="alert alert-warning" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p>
-					{% endif %}
-				{% endfor %}
-			{% endif %} <!-- messages -->
-			
-			{% if summary == "0 Errors, 0 Warnings."%}
-				<p class="alert alert-success summary">{{ summary }}</p>
-			{% else %}
-				<p>{{summary}}</p>
-				<hr />
-			{% endif %}
-
-	<p>
-	Please insert the
-	<a href="http://www.ncbi.nlm.nih.gov/projects/SNP/">dbSNP</a> rs
-	number below. Mutalyzer will retrieve the HGVS description of the SNP specified on the reference sequence(s) used by dbSNP.
-	</p>
-
-	<p>
-	Example: <code class="example-input">rs9919552</code>
-	</p>
-		
-	<form role="form" class="form" action="{{ url_for('.snp_converter') }}" method="get">
-	<div class="form-group">
-		<label for="description">dbSNP rs number</label>
-		<input type="text" class="form-control form-pre example-target" name="rs_id" placeholder="" value="{{ rs_id }}" ></input>
-	</div>		
-
-	<div class="form-group">
-		<input type="submit" class="btn btn-primary" value="Submit">
-		<a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/PositionConverter" target="new" class="btn btn-default pull-right">Help</a>
-		<input type="reset" class="btn btn-default pull-right" value="Undo">
-	</div>
-	</form>
+<p>
+Please insert
+the <a href="http://www.ncbi.nlm.nih.gov/projects/SNP/">dbSNP</a> rs number
+below. Mutalyzer will retrieve the HGVS description of the SNP specified on
+the reference sequence(s) used by dbSNP.
+</p>
+
+<form role="form" class="form" action="{{ url_for('.snp_converter') }}" method="get">
+  <div class="form-group">
+    <label for="description">dbSNP rs number</label>
+    <input type="text" class="form-control form-pre example-target" name="rs_id" placeholder="" value="{{ rs_id }}" ></input>
+    <p>Example: <code class="example-input">rs9919552</code></p>
+  </div>
+
+  <div class="form-group">
+    <input type="submit" class="btn btn-primary" value="Submit">
+    <a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/PositionConverter" target="new" class="btn btn-default pull-right">Help</a>
+  </div>
+</form>
 
 {% if rs_id %}
-  <h3>SNP converter results</h3>
+  <hr>
+  {% if messages %}
+    {% for m in messages %}
+      {% if m.class == "error" %}
+        <p class="alert alert-danger" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p>
+      {% elif m.class == "warning" %}
+        <p class="alert alert-warning" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p>
+      {% endif %}
+    {% endfor %}
+  {% endif %}
 
-<!--   {% for m in messages %}
-	{% if m.class == "error" %}
-		<div class="alert alert-danger" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</div>
-	{% elif m.class == "warning" %}
-		<div class="alert warning" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</div>
-	{% endif %}
-  {% endfor %}
-  
   {% if summary == "0 Errors, 0 Warnings."%}
-		<div class="alert success summary">{{ summary }}</div>
+    <p class="alert alert-success summary">{{ summary }}</p>
   {% else %}
-	<div>{{summary}}</div>
-  {% endif %} -->
-      
+    <p>{{summary}}</p>
+  {% endif %}
+
+  <hr>
 
   <h4>dbSNP rs ID</h4>
-  <pre>{{ rs_id }}</pre>
+  <p><code>{{ rs_id }}</code></p>
+
   <h4>HGVS descriptions</h4>
-  <pre>{% for d in descriptions %}{{ d }}</br>{% endfor %}</pre>
-{% endif %}
+  {% for d in descriptions %}
+    <p><code>{{ d }}</code></p>
+  {% endfor %}
+{% endif %}{# rs_id #}
 
 {% endblock content %}
diff --git a/mutalyzer/website/templates/static/css/style.css b/mutalyzer/website/templates/static/css/style.css
index 99241013150cf74b41c36768882682140c958f87..08f868e646cb034afe19beb5ab63474230a0f6d9 100644
--- a/mutalyzer/website/templates/static/css/style.css
+++ b/mutalyzer/website/templates/static/css/style.css
@@ -3,7 +3,7 @@ body{
 /*	margin: 0 10px;*/
 	padding-top: 70px;
 /*	padding-top: 110px;*/
-	
+
 	font-family: Roboto;
 	-webkit-font-smoothing: antialiased;
 }
@@ -15,17 +15,17 @@ body{
 	margin-right: auto;
 	padding: 40px;
 	margin-bottom: 25px;
-	
+
 	border-radius: 2px;
-	
-	font-size: 14px; 
+
+	font-size: 14px;
 	font-weight: 400;
 
 }
 .block-shadow {
 /*	box-shadow: 0 -1px 2.5px rgba(0,0,0,0.12), 0 1px 2px rgba(0, 0,0,0.24);*/
 	box-shadow: 1px 2px 2px rgba(50,50,50,.16), -1px -1px 3px rgba(50, 50, 50,.23);
-	
+
 }
 
 
@@ -49,11 +49,11 @@ body{
 	.block {
 		padding: 15px;
 	}
-	
+
 	.block-shadow {
 		box-shadow: none;
 	}
-	
+
 	.block h1 {
 		font-size: 32px;
 		line-height: 1em;
@@ -75,7 +75,7 @@ footer.row {
 /*	padding-top:20px;
 	padding-bottom: 20px;*/
 }
-.navbar-header { 
+.navbar-header {
 	z-index: 3;
 	position: relative;
 }
@@ -120,7 +120,7 @@ h2,h3,h4,h5{
 }
 
 input[type="text"].form-pre{
-  font-family: Menlo, Monaco, Consolas, "Courier New", monospace;	
+  font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
 }
 
 code {
@@ -146,11 +146,11 @@ header.main-header {
 .table2 > td {
   padding: 3px;
  }
- 
+
 .table2{
 	margin-bottom: 0px;
 }
- 
+
 .pre {
   padding: 0 9.5px;
   margin: 0 30px 10px 30px;
@@ -167,15 +167,6 @@ header.main-header {
 	cursor: default;
 }
 
-.btn-right{
-	width: 177px;
-	margin-left: 375px;
-}
-
-.btn-submit{
-	margin-top: 15px;
-}
-
 .summary{
 	text-align: left;
 }
@@ -195,7 +186,7 @@ header.main-header {
 	font-size: 11px;
 	cursor: pointer;
 }
-	
+
 #variants{
 	/* border: 1px solid green; */
 }
diff --git a/mutalyzer/website/templates/syntax-checker.html b/mutalyzer/website/templates/syntax-checker.html
index 75c353ce544e5fd345569a38255139d8d83db96c..3854c8c1269be83038824a09f26562df7dad08e5 100644
--- a/mutalyzer/website/templates/syntax-checker.html
+++ b/mutalyzer/website/templates/syntax-checker.html
@@ -2,49 +2,51 @@
 
 {% set active_page = "syntax-checker" %}
 {% set page_title = "Syntax checker" %}
-<!-- {% set page_titles = "Syntax Checker" %} -->
 
 {% block content %}
-	{% if description %}
-	  <h3>Variant syntax checker results</h3>
-	  {% if parse_error %}
-	  	<div class="alert alert-danger">
-			<h4>There were errors</h4>
-			<ul>
-		      {% for m in messages %}
-				<li title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</li>
-		      {% endfor %}
-			</ul>
-		    <h5>Details of the parse error</h5>
-		    <pre>{{- parse_error[0] }}<br>{{- parse_error[1] }}</pre>
-		    <p>The &quot;^&quot; indicates the position where the error occurred.</p>
-	  	</div>
-	  {% else %}
-	  	<div class="alert alert-success">
-			The syntax of this variant is OK!
-		</div>
-	  {% endif %}
-	  <br>
-	{% endif %}
-  	<p>
-  		Please insert the mutation name using the <a href="http://www.hgvs.org/mutnomen" title="Human Genome Variation Society standard variant nomenclature" alt="Human Genome Variation Society standard variant nomenclature">HGVS</a> format:<br>
-		<code>&lt;accession number&gt;.&lt;version number&gt;(&lt;gene symbol&gt;):&lt;sequence type&gt;.&lt;variant description&gt;</code>
-  	</p>
-  		
-    <p>
-    	Example: <code class="example-input">AB026906.1:c.274G&gt;T</code>
-    </p>
-
-      <form class="form" action="{{ url_for('.syntax_checker') }}" method="get">
-		  <div class="form-group">
-			  <label for="description">HGVS Description</label>
-			  <input class="form-control form-pre example-target" type="text" name="description" value="{{ description }}" placeholder="Mutation name using HGVS format">	
-		  </div>
-		  <div class="form-group button-group">
-			  <input type="submit" class="btn btn-primary" value="Check syntax">
-			  <a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/SyntaxChecker" target="new" class="btn btn-default pull-right">Help</a>
-			  <input type="reset" class="btn btn-default pull-right" value="Undo">
-		  </div>
-    </form>
-	
+
+<p>
+Please insert the mutation name using
+the <a href="http://www.hgvs.org/mutnomen" title="Human Genome Variation
+Society standard variant nomenclature" alt="Human Genome Variation Society
+standard variant nomenclature">HGVS</a> format:
+</p>
+
+<pre>&lt;accession number&gt;.&lt;version number&gt;(&lt;gene symbol&gt;):&lt;sequence type&gt;.&lt;variant description&gt;</pre>
+
+<form class="form" action="{{ url_for('.syntax_checker') }}" method="get">
+  <div class="form-group">
+    <label for="description">HGVS Description</label>
+    <input class="form-control form-pre example-target" type="text" name="description" value="{{ description }}" placeholder="Mutation name using HGVS format">
+    <p>Example: <code class="example-input">AB026906.1:c.274G&gt;T</code></p>
+  </div>
+  <div class="form-group button-group">
+    <input type="submit" class="btn btn-primary" value="Check syntax">
+    <a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/SyntaxChecker" target="new" class="btn btn-default pull-right">Help</a>
+  </div>
+</form>
+
+{% if description %}
+  <hr>
+  {% if parse_error %}
+    <div class="alert alert-danger">
+      <h4>Parse error</h4>
+      <pre>{{ parse_error[0] }}<br>{{ parse_error[1] }}</pre>
+      <p>The &quot;^&quot; indicates the position where the error occurred.</p>
+    </div>
+  {% else %}
+    <p class="alert alert-success">The syntax of this variant is OK!</p>
+  {% endif %}
+
+  {% if messages %}
+    {% for m in messages %}
+      {% if m.class == "error" %}
+        <p class="alert alert-danger" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p>
+      {% elif m.class == "warning" %}
+        <p class="alert alert-warning" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p>
+      {% endif %}
+    {% endfor %}
+  {% endif %}
+{% endif %}{# description #}
+
 {% endblock content %}
diff --git a/mutalyzer/website/views.py b/mutalyzer/website/views.py
index 9f47146c07b22a1a74b00b8efe7c83d9c0ed7410..992e84a502ba6d46c310f65f0e50b9611b6ac412 100644
--- a/mutalyzer/website/views.py
+++ b/mutalyzer/website/views.py
@@ -829,14 +829,14 @@ def batch_jobs_submit():
     for error in errors:
         output.addMessage(__file__, 3, 'EBATCHJOB', error)
 
-    errors = map(util.message_info, output.getMessages())
+    messages = map(util.message_info, output.getMessages())
 
     return render_template('batch-jobs.html',
                            assemblies=assemblies,
                            assembly_name_or_alias=assembly_name_or_alias,
                            job_type=job_type,
                            max_file_size=settings.MAX_FILE_SIZE // 1048576,
-                           errors=errors)
+                           messages=messages)
 
 
 @website.route('/batch-job-progress')
diff --git a/tests/test_website.py b/tests/test_website.py
index a7fa1b1dc6a5cce119897309930522e32d40c2c8..06b19d9d7bf24ceab3a4ec7ae7d7a0a23149538b 100644
--- a/tests/test_website.py
+++ b/tests/test_website.py
@@ -124,7 +124,7 @@ class TestWebsite(MutalyzerTest):
         r = self.app.get('/syntax-checker',
                          query_string={'description': 'AB026906.1:c.27'})
         assert 'Fatal' in r.data
-        assert 'Details of the parse error' in r.data
+        assert 'The &quot;^&quot; indicates the position where the error occurred' in r.data
 
     @fix(database, cache('NM_002001.2'))
     def test_check_valid(self):
@@ -742,7 +742,7 @@ class TestWebsite(MutalyzerTest):
                          query_string={'description': 'La Pe\xf1a'})
         body = r.get_data(as_text=True)
         assert 'Fatal' in body
-        assert 'Details of the parse error' in body
+        assert 'The &quot;^&quot; indicates the position where the error occurred' in body
         assert 'Expected W:(0123...) (at char 2), (line:1, col:3)' in body
 
     @fix(database)