polish HTML semantics in instructions

Author: liam-o-marsh

user_templates/INST.j2

@@ -1,34 +1,30 @@
 
-
+    <ul style="text-align: justify;">
 {% if step==1 %}
-    {% set kbdVar="auto" %}
-    {% set ssVar="hidden" %}
-    <ul style="color: black; text-align: justify;">
+        {% set kbdVar="auto" %}
+        {% set ssVar="hidden" %}
+        <li style="color: black;">
 {% else %}
-    {% set kbdVar="hidden" %}
-    {% set ssVar="auto" %}
-    <ul style="color: Gray; text-align: justify;">
+        {% set kbdVar="hidden" %}
+        {% set ssVar="auto" %}
+        <li style="color: Gray;">
 {% endif %}
-        <li>
             Upload the input file, select its corresponding file format, and press 
             <kbd {{kbdVar}}>Calculate my structure</kbd>
             <strong {{ssVar}}><samp {{ssVar}}>Calculate my structure</samp></strong>
             .
         </li>
-    </ul>
-
-</br>
+        <br/>
 
 {% if step==2 %}
-    {% set kbdVar="auto" %}
-    {% set ssVar="hidden" %}
-    <ul style="color: black; text-align: justify;">
+        {% set kbdVar="auto" %}
+        {% set ssVar="hidden" %}
+        <li style="color: black;">
 {% else %}
-    {% set kbdVar="hidden" %}
-    {% set ssVar="auto" %}
-    <ul style="color: Gray; text-align: justify;">
+        {% set kbdVar="hidden" %}
+        {% set ssVar="auto" %}
+        <li style="color: Gray;">
 {% endif %}
-        <li>
             If the input file was imported and interpreted successfully, you will be able to view basic structure information under 
             the 
             <kbd {{kbdVar}}>Structure information</kbd>
@@ -39,21 +35,17 @@
             and wait. 
             The waiting time depends on the structure size and complexity. 
         </li>
-    </ul>
-
-</br>
-
+        <br/>
 
 {% if step==3 %}
-    {% set kbdVar="auto" %}
-    {% set ssVar="hidden" %}
-    <ul style="color: black; text-align: justify;">
+        {% set kbdVar="auto" %}
+        {% set ssVar="hidden" %}
+        <li style="color: black;">
 {% else %}
-    {% set kbdVar="hidden" %}
-    {% set ssVar="auto" %}
-    <ul style="color: Gray; text-align: justify;">
+        {% set kbdVar="hidden" %}
+        {% set ssVar="auto" %}
+        <li style="color: Gray;">
 {% endif %}
-        <li>
             If the structure was analyzed successfully, you will be able to view its analysis under the 
             <kbd {{kbdVar}}>Structure analysis</kbd>
             <strong {{ssVar}}><samp {{ssVar}}>Structure analysis</strong></samp>
@@ -65,30 +57,27 @@
             <strong {{ssVar}}><samp {{ssVar}}>View structure</strong></samp> 
             to view, interact and download specific molecules or complexes.
         </li>
-    </ul>
-
-</br>
+        <br/>
 
 {% if step==4 %}
-    {% set kbdVar="auto" %}
-    {% set ssVar="hidden" %}
-    <ul style="color: black; text-align: justify;">
+        {% set kbdVar="auto" %}
+        {% set ssVar="hidden" %}
+        <li style="color: black;">
 {% else %}
-    {% set kbdVar="hidden" %}
-    {% set ssVar="auto" %}
-    <ul style="color: Gray; text-align: justify;">
+        {% set kbdVar="hidden" %}
+        {% set ssVar="auto" %}
+        <li style="color: Gray;">
 {% endif %}
-    <li>
-        By double-clicking  on the 3d structure you will be able to zoom in, zoom out, and rotate the model. On the left column,  
-        you can select which molecular components (ligands, molecules, or metals) are displayed. Below the 3d structure, you will find a toggle 
-        button to select if you want to view the cell or one mol (molecule or complex). When mol is selected, you can use the 
-        dropdown menu to choose one to visualize. The xyz file of the selected mol containing
-        charge, spin, and cartesian coordinates (ready for quantum chemical calculations), can be downloaded by clicking 
-        <kbd {{kbdVar}}>Download selected mol (.xyz)</kbd>
-        <strong {{ssVar}}><samp {{ssVar}}>Download selected mol (.xyz)</strong></samp>
-        .
-    </li>
-</ul>
+            By double-clicking  on the 3d structure you will be able to zoom in, zoom out, and rotate the model. On the left column,  
+            you can select which molecular components (ligands, molecules, or metals) are displayed. Below the 3d structure, you will find a toggle 
+            button to select if you want to view the cell or one mol (molecule or complex). When mol is selected, you can use the 
+            dropdown menu to choose one to visualize. The xyz file of the selected mol containing
+            charge, spin, and cartesian coordinates (ready for quantum chemical calculations), can be downloaded by clicking 
+            <kbd {{kbdVar}}>Download selected mol (.xyz)</kbd>
+            <strong {{ssVar}}><samp {{ssVar}}>Download selected mol (.xyz)</strong></samp>
+            .
+        </li>
+    </ul>
 
 <p style="text-align: justify;">
     {% if step==-1 %}