{% extends "theme.html" %}

 {% block body %}

 <div class="container">

  <div class="col-lg-12">

  	<div class="row">

      {{ content|safe }}

     </div>

         {{lat}}

         {{o3offset}}

  <br>

  <br>

      <i>

          <h3>

             UV-Index für 50 DU Ozonverlust bei der Breite 50°N:

          </h3>

      </i>

  <br>

  <br>

      <form>

             <img src="/static/images/uvindex/{{figname}}" alt="{{ alt }}" border="6">

             <table border="black">

                 <colgroup>

                     <col width="100">

                     <col width="100">

                     <col width="400">

                 </colgroup>

                 <tr>

                     <th align="center" bgcolor="#E0E0E0">UV-Index</th>

                     <th align="center" bgcolor="#E0E0E0">Bewertung</th>

                     <th align="center" bgcolor="#E0E0E0">Schutz</th>

                 </tr>

                 <tr>

                     <td align="center" bgcolor="#00B000">0 – 2 </td>

                     <td align="center" bgcolor="#00B000">niedrig</td>

                     <td style="padding-left:25px;">Kein Schutz erforderlich</td>

                 </tr>

                 <tr>

                     <td align="center" bgcolor="#FFFF00">3 – 5</td>

                     <td align="center" bgcolor="#FFFF00">mäßig</td>

                     <td style="padding-left:25px;">Schutz erforderlich: Hut, T-Shirt, Sonnenbrille, Sonnencreme</td>

                 </tr>

                 <tr>

                     <td align="center" bgcolor="#F87820">6 – 7</td>

                     <td align="center" bgcolor="#F87820">hoch</td>

                     <td style="padding-left:25px">Schutz erforderlich: Hut, T-Shirt, Sonnenbrille, Sonnencreme</td>

                 </tr>

                 <tr>

                     <td align="center" bgcolor="#FF0000">8 – 10</td>

                     <td align="center" bgcolor="#FF0000">sehr hoch</td>

                     <td style="padding-left:25px;">zusätzlicher Schutz erforderlich: Aufenthalt im Freien möglichst vermeiden</td>

                 </tr>

                 <tr>

                     <td align="center" bgcolor="#7F00FF">≥ 11</td>

                     <td align="center" bgcolor="#7F00FF">extrem</td>

                     <td style="padding-left:25px;">zusätzlicher Schutz erforderlich: Aufenthalt im Freien möglichst vermeiden</td>

                 </tr>

             </table>

             <h6>Quelle: Schweizerisches Bundesamt für Gesundheit <a href="http://www.uv-index.ch/de/uvindex.html"> www.uv-index.ch/de/uvindex.html</a></h6>

      </form>

  <br>

  <br>

      <i>

          <h4>

              Andere Werte auswählen:

          </h4>

      </i>

     <form method="post" action="/ozoneloss/uvi_graph">

         <table border="0" width="100%">

             <tr>

                 <th> <label for="Dobson-Unit" font-size="18">Bitte Ozonverlust auswählen:</label> </th>

                 <th> <label for="Gradzahl">Bitte geographische Breite auswählen:</label> </th>

             </tr>

             <tr>

                 <td>

                     <p>

                         <select name="Dobson-Unit" size="1" font-size="14"  border-color="gray">

                             <option>25</option>

                             <option selected>50</option>

                             <option>75</option>

                             <option>100</option>

                         </select>

                         Dobson-Einheiten

                     </p>

                 </td>

                 <td>

                     <p>

                          <select name="Gradzahl" size="1" font-size="14"  border-color="gray">

                             <option>80° N</option>

                             <option>70° N</option>

                             <option>60° N</option>

                             <option selected>50° N</option>

                             <option>50° S</option>

                             <option>60° S</option>

                             <option>70° S</option>

                             <option>80° S</option>

                          </select>

                     </p>

                 </td>

             </tr>

         </table>

         <br>

         <input type="submit" value="Graph anzeigen" font-color="black" font-size="16" border-color="gray"/>

     </form>

 <div class="row">

 {{ content_explanation|safe }}

 {{ modal_info|safe }}

 </div>

 </div>

 </div>

 {% endblock %}