diff --git a/coinmanager/coinc/static/coinc/main.js b/coinmanager/coinc/static/coinc/main.js
index 6d4790f..d352ab5 100644
--- a/coinmanager/coinc/static/coinc/main.js
+++ b/coinmanager/coinc/static/coinc/main.js
@@ -18,6 +18,7 @@
 
 
 import { Cookie } from './modules/cookie.mjs';
+import { Modal, detach } from './modules/modal.mjs';
 
 let settings = {
     found:        true,
@@ -101,9 +102,10 @@ function render_found() {
 
 
 // update table cell according to settings
-function render_response(td, set) {
+function render_response(data, td, set) {
     let td_class = '';
     let div_class = '';
+    let value = Number($(td).attr('value'));
 
     if (!set['exists']) {
         td_class = 'noexist';
@@ -111,7 +113,7 @@ function render_response(td, set) {
         td_class = 'buy_only';
     } else if (set['circulation'] && set['circulation'] < 1500000 && set['circulation'] != 0) {
         td_class = 'rare';
-    } else if ([10, 20, 50].includes(Number($(td).attr('value')))) {
+    } else if ([10, 20, 50].includes(value)) {
         td_class = 'brass';
     } else if (set['found'] && set['found_by']) {
         td_class = 'found';
@@ -123,17 +125,38 @@ function render_response(td, set) {
         td_class += ' checked';
     }
 
+    /* add or update marker (and name) if found */
     if (set['found'] && set['found_by'] && set['exists']) {
         div_class = set['found_by'];
         $(td).find('div.coin span').html('').html('x');
+        if ('name' in data) {
+            console.log(data['name']);
+            let c = String(value).substring(2,3);
+            let div_special_name = $(td).find('div.special' + c + '_name');
+            console.log(div_special_name);
+            if (div_special_name.length == 0) {
+                $(td).append('<div class="special' + c + '_name three_lines">' + data['name'] + '</div>');
+            } else if (div_special_name.length == 1) {
+                div_special_name.html(data['name']);
+            }
+        }
     }
+
+    /* remove marker if not exists */
     if (!set['exists'] || !set['found']) {
         $(td).find('div.coin span').html('');
     }
+
+    /* apply td styles */
     $(td).removeClass();
     $(td).addClass('coin ' + td_class);
+
+    /* apply div overlay styles */
     $(td).find('div[type=overlay]').removeClass();
     $(td).find('div[type=overlay]').addClass('found ' + div_class);
+
+
+    //TODO add text to Sondermünzen :))
 }
 
 
@@ -187,50 +210,68 @@ $(document).ready(function() {
             $(this).click(function() {
                 save_settings();
 
-                let csrf_token = $('input[name=csrfmiddlewaretoken]').val();
-                let value = $(this).attr('value');
-                let year = Number($(this).parent('tr').attr('name'));
-// TODO fix this before the end of 2098
-                year += (year == 99) ? 1900 : 2000;
-                let country = $(this).parents('table').attr('name');
-                let stamp = $(this).parent('tr').attr('stamp');
-                let name = ''
-                let found_by = (settings['found'] === true) ? settings['found_by'] : ''
-                let found_on = (settings['found'] === true) ? settings['found_on'] : ''
-                let circulation = (settings['circulation'] == 'Auflage') ? 0 : settings['circulation'];
+                let csrf_token  = $('input[name=csrfmiddlewaretoken]').val();
+                let value       = Number($(this).attr('value'));
+                let year        = Number($(this).parent('tr').attr('name'));
+                year           += (year == 99) ? 1900 : 2000; // TODO fix this before the end of 2098
+                let country     = $(this).parents('table').attr('name');
+                let stamp       = $(this).parent('tr').attr('stamp');
+                let found_by    = (settings['found']) ? settings['found_by'] : ''
+                let found_on    = (settings['found']) ? settings['found_on'] : ''
+                let circulation = (settings['circulation'] == 'Auflage') ? 0 : settings['circulation']
 
                 if (settings['exists'] === false) { circulation = 0; }
 
                 let data = {
                     csrfmiddlewaretoken: csrf_token,
-                    value: value,
-                    year: year,
-                    country: country,
-                    stamp: stamp,
-                    name: name,
-                    found_by: found_by,
-                    found_on: found_on,
+                    value:       value,
+                    year:        year,
+                    country:     country,
+                    stamp:       stamp,
+                    found_by:    found_by,
+                    found_on:    found_on,
                     circulation: circulation,
-                    buy_only: settings['buy_only'],
-                    checked: settings['checked'],
-                    ec: settings['ec'],
-                    exists: settings['exists']
+                    buy_only:    settings['buy_only'],
+                    checked:     settings['checked'],
+                    ec:          settings['ec'],
+                    exists:      settings['exists']
                 }
 
-                $.ajax({
-                    type: 'POST',
-                    url: 'add/coin',
+                let args = {
                     data: data,
-                    dataType: 'json',
-                    td: this,
-                    success: function(response) {
-                        if (response.status === 0) {
-                            render_response(this.td, settings);
-                        } else {
-                            alert(response.message);
-                        }
+                    td:   this
+                }
+
+                if ([201, 202, 203].includes(value)) {
+                    let modal = new Modal('add_coin_name', add_coin_name, args);
+                    modal.show();
+                } else {
+                    add_coin_name(args);
+                }
+
+                function add_coin_name(args, response='') {
+                    let data = args['data'];
+                    let td = args['td'];
+                    if (response) {
+                        data['name'] = response['name'];
                     }
-                });
+                    $.ajax({
+                        type:     'POST',
+                        url:      'add/coin',
+                        data:     data,
+                        dataType: 'json',
+                        td:       td,
+                        success:  function(response) {
+                            if (response.status === 0) {
+                                render_response(data, this.td, settings);
+                                detach('add_coin_name');
+                            } else {
+                                alert(response.message);
+                            }
+                        }
+                    });
+                }
+
             });
         });
     });
@@ -324,7 +365,7 @@ $(document).ready(function() {
     //
 
     // hide modal add user
-    function hide_modal() { $('#modal_add_user').fadeOut('fast'); }
+    function hide_modal(modal_id) { $('#' + modal_id).fadeOut('fast'); }
 
     // modal #add_user
     $('#show_add_user').click(function() {
diff --git a/coinmanager/coinc/static/coinc/modules/modal.mjs b/coinmanager/coinc/static/coinc/modules/modal.mjs
new file mode 100644
index 0000000..82fdc93
--- /dev/null
+++ b/coinmanager/coinc/static/coinc/modules/modal.mjs
@@ -0,0 +1,95 @@
+/*
+
+  Copyright (C) 2020 willipink.eu
+  Author Moritz Münch moritzmuench@mailbox.org
+
+  This program is free software: you can redistribute it and/or modify
+  it under the terms of the GNU General Public License as published by
+  the Free Software Foundation, either version 3 of the License, or
+  (at your option) any later version.
+
+  This program is distributed in the hope that it will be useful,
+  but WITHOUT ANY WARRANTY; without even the implied warranty of
+  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+  GNU General Public License for more details.
+
+  You should have received a copy of the GNU General Public License
+  along with this program. If not, see <http://www.gnu.org/licenses/>. */
+
+
+
+/* create a modal dialog */
+class Modal {
+
+    constructor(modal, callback, callback_arguments) {
+
+        this.modal = modal;
+        this.callback = callback;
+        this.callback_arguments = callback_arguments;
+
+        $('#' + this.modal + '_show')
+            .bind('click', {this: this}, function(event) {
+                event.data.this.show();
+        });
+    }
+
+
+    /* show the modal dialog */
+    show() {
+
+        $('#' + this.modal).fadeIn('fast');
+
+        /* close modal on click outside of modal */
+        $(document)
+            .bind('click', {this: this}, function(event) {
+                let scope = event.data.this
+                if ($('#' + scope.modal).is(':visible')) {
+                    if ($(event.target).attr('id') === scope.modal) {
+                        hide(scope.modal);
+                    }
+                }
+            });
+
+        /* close modal on keypress ESC */
+        $(document)
+            .bind('keypress', {this: this}, function(event) {
+                if (event.keyCode == 27) {
+                    hide(event.data.this.modal);
+                    $(document).off('keypress');
+                }
+            });
+
+        /* close modal on button #<modal_name>_close */
+        $('#' + this.modal + '_close')
+            .bind('click', {this: this}, function(event) {
+                hide(event.data.this.modal);
+            });
+
+        /* trigger callback on button #<modal_name>_action */
+        $('#' + this.modal + '_action')
+            .bind('click', {this: this}, function(event) {
+                let scope = event.data.this;
+                let response = {};
+                $('#' + scope.modal + ' input[type=text]').each(function() {
+                    response[$(this).attr('name')] = $(this).val();
+                }).get();
+                scope.callback(scope.callback_arguments, response);
+            });
+    }
+
+}
+
+/* hide the modal dialog */
+function hide(modal) {
+    $('#' + modal).fadeOut('fast');
+}
+
+/* detach all eventTypes */
+function detach(modal) {
+    hide(modal);
+    $('#' + modal + '_action').off('click');
+    $('#' + modal + '_close').off('click');
+    $(document).off('keypress click');
+}
+
+export { Modal, detach, hide };
diff --git a/coinmanager/coinc/static/coinc/styles.css b/coinmanager/coinc/static/coinc/styles.css
index 08b5ea6..b04a3aa 100644
--- a/coinmanager/coinc/static/coinc/styles.css
+++ b/coinmanager/coinc/static/coinc/styles.css
@@ -48,8 +48,6 @@ img.country {
 
 table {
   border-collapse: collapse;
-  width: 360px;
-  table-layout: fixed;
   white-space: nowrap;
   margin-bottom: 63px !important;
 }
@@ -60,7 +58,7 @@ th {
 }
 
 tr {
-  height: 30px;
+  height: 40px;
 }
 
 td {
@@ -88,21 +86,21 @@ thead > tr:nth-child(2) > th:after {
   z-index: 1020;
   left: 0;
   top: -1px;
-  width: 30px;
-  height: 32px;
+  width: 40px;
+  height: 42px;
+  line-height: 40px;
   border-top: 1px solid gray;
   border-left: 1px solid gray;
   border-bottom: 2px solid black;
 }
 
-thead > tr:nth-child(2) > th:last-child:after {
-  border-right: 1px solid gray;
-}
-
+tr:nth-child(2) > th:nth-child(10):after { content: '201'; }
+tr:nth-child(2) > th:nth-child(11):after { content: '202'; }
+tr:nth-child(2) > th:nth-child(12):after { content: '203'; }
+tr:nth-child(2) > th:last-child:after { border-right: 1px solid gray; }
 
 thead > tr:nth-child(2) > th, table > tbody > tr > td {
   text-align: center;
-  font-size: 0.8rem;
   font-weight: normal;
 }
 
@@ -114,19 +112,11 @@ tbody > tr > td {
 tbody > tr > td > div.coin {
   position: relative;
   z-index: 1000;
-  height: 30px;
-  width: 30px;
+  height: 40px;
+  width: 40px;
   text-align: inherit;
-  line-height: 30px;
-}
-
-div.found {
-  position: absolute;
-  z-index: 1001;
-  top: 0;
-  height:30px;
-  width:30px;
-  clip-path: polygon(100% 70%, 100% 100%, 70% 100%);
+  line-height: 40px;
+  float: left;
 }
 
 td > * {
@@ -134,6 +124,107 @@ td > * {
   overflow: hidden;
 }
 
+div.found {
+  position: absolute;
+  z-index: 1001;
+  top: 0;
+  height:40px;
+  width:40px;
+  clip-path: polygon(100% 70%, 100% 100%, 70% 100%);
+}
+
+div.three_lines {
+  font-size: 0.8rem !important;
+  line-height: 13px !important;
+}
+div.two_lines {
+  font-size: 0.9rem !important;
+  line-height: 20px !important;
+}
+
+div.special1_name, div.special2_name, div.special3_name {
+  display:     none;
+  height:      40px;
+  width:       150px;
+  font-size:   1rem;
+  font-weight: 400;
+  line-height: 40px;
+  color:       black;
+  text-align:  left;
+  word-wrap:   anywhere;
+  word-break:  break-all;
+  white-space: break-spaces;
+}
+
+/* smallest view 12 * 40 = 480px */
+@media (max-width: 654px) {
+  table { width: 360px; }
+  tr:nth-child(2) > th { width: 30px; }
+  tr:nth-child(2) > th:after { width: 30px; }
+  tbody > tr > td > div.coin {
+    height: 30px;
+    width: 30px;
+    line-height: 30px;
+  }
+  div.found {
+    height: 30px;
+    width: 30px;
+  }
+  tr { height: 30px; }
+  thead > tr:nth-child(2) > th:after {
+    height: 32px;
+    width: 30px;
+    line-height:30px;
+  }
+  thead > tr:nth-child(2) > th, tbody > tr > td { font-size: 0.8rem; }
+}
+
+/* 1st special coin: 11 * 40 + 200 = 640px */
+@media (min-width: 655px) {
+  table { width: 640px; }
+  tr:nth-child(2) > th:nth-child(10) {
+    width: 200px;
+    text-align: left;
+  }
+  tr:nth-child(2) > th:nth-child(10):after {
+    width: 200px;
+    padding-left: 5px;
+    content: 'Sondermünze 1';
+  }
+  div.special1_name { display: block; }
+}
+
+/* 2nd special coin 10 * 40 + 400 = 800px */
+@media (min-width: 815px) {
+  table { width: 800px; }
+  tr:nth-child(2) > th:nth-child(11) {
+    width: 200px;
+    text-align: left;
+  }
+  tr:nth-child(2) > th:nth-child(11):after {
+    width: 200px;
+    padding-left: 5px;
+    content: 'Sondermünze 2';
+  }
+  div.special2_name { display: block; }
+}
+
+/* 3rd special coin 9 * 40 + 600 = 960px */
+@media (min-width: 975px) {
+  table { width: 960px; }
+  tr:nth-child(2) > th:nth-child(12) {
+    width: 200px;
+    text-align: left;
+  }
+  tr:nth-child(2) > th:nth-child(12):after {
+    width: 200px;
+    padding-left: 5px;
+    content: 'Sondermünze 3';
+  }
+  div.special3_name { display: block; }
+}
+
+
 
 .buy_only {
   background-color: #dd7e6b;
diff --git a/coinmanager/coinc/templates/coinc/coin.html b/coinmanager/coinc/templates/coinc/coin.html
index a94bff2..0d41f6a 100644
--- a/coinmanager/coinc/templates/coinc/coin.html
+++ b/coinmanager/coinc/templates/coinc/coin.html
@@ -1 +1,7 @@
-          <td class="coin {{ td_class }}" value="{{ value }}"><div class="coin"><span>{{ marker }}</span><div class="{{ div_class }}" type="overlay"></div></div></td>
+          <td class="coin {{ td_class }}" value="{{ value }}"><div class="coin"><span>{{ marker }}</span><div class="{{ div_class }}" type="overlay"></div></div>
+          {% if name %}
+            {% if value == 201 %}<div class="special1_name {{ special_class }}">{{ name }}</div>{% endif %}
+            {% if value == 202 %}<div class="special2_name {{ special_class }}">{{ name }}</div>{% endif %}
+            {% if value == 203 %}<div class="special3_name {{ special_class }}">{{ name }}</div>{% endif %}
+          {% endif %}
+          </td>
diff --git a/coinmanager/coinc/templates/coinc/controlbar.html b/coinmanager/coinc/templates/coinc/controlbar.html
index e73a64e..dbd4935 100644
--- a/coinmanager/coinc/templates/coinc/controlbar.html
+++ b/coinmanager/coinc/templates/coinc/controlbar.html
@@ -84,3 +84,26 @@ div.{{ user.name }} {
   </div>
 </div>
 </div>
+
+<div id="add_coin_name" class="modal-container">
+<div class="modal-dialog" role="document">
+  <div class="modal-content">
+    <div class="modal-header">
+      <h5 class="modal-title">Sondermünze</h5>
+      <button id="add_coin_name_close" type="button" class="close" data-dismiss="modal" aria-label="Close">
+        <span aria-hidden="true">×</span>
+      </button>
+    </div>
+    <div class="modal-body">
+      <div class="form-group">
+        <label for="add_coin_name_name">Name</label>
+        <input type="text" name="name" id="add_coin_name_name" class="form-control">
+      </div>
+    </div>
+    <div class="modal-footer">
+      <span id="response"></span>
+      <button type="button" id="add_coin_name_action" class="btn btn-primary">+ Münze hinzufügen</button>
+    </div>
+  </div>
+</div>
+</div>
diff --git a/coinmanager/coinc/templates/coinc/country.html b/coinmanager/coinc/templates/coinc/country.html
index 4812504..74182cb 100644
--- a/coinmanager/coinc/templates/coinc/country.html
+++ b/coinmanager/coinc/templates/coinc/country.html
@@ -22,9 +22,9 @@
           <th class="brass">50</th>
           <th>100</th>
           <th>200</th>
-          <th>201</th>
-          <th>202</th>
-          <th>203</th>
+          <th></th>
+          <th></th>
+          <th></th>
         </tr>
       </thead>
       <tbody>
diff --git a/coinmanager/coinc/templates/coinc/year.html b/coinmanager/coinc/templates/coinc/year.html
index 44e98e5..f252e1f 100644
--- a/coinmanager/coinc/templates/coinc/year.html
+++ b/coinmanager/coinc/templates/coinc/year.html
@@ -1,5 +1,5 @@
 {% for stamp in year %}        <tr name="{{ year_short }}" stamp="{{ stamp }}">
-          <td class="year"><div class="">{{ stamp }}{{ year_short }}</div></td>
+          <td class="year"><div class="coin">{{ stamp }}{{ year_short }}</div></td>
 {% for value in values %}{% show_coin country year_short stamp value %}{% endfor %}        </tr>{% endfor %}{% ifnotequal year|length 1 %}
         <tr>
           <td class="spacer" colspan="12"></td>
diff --git a/coinmanager/coinc/views.py b/coinmanager/coinc/views.py
index bf1eeae..fb8fd9f 100644
--- a/coinmanager/coinc/views.py
+++ b/coinmanager/coinc/views.py
@@ -175,11 +175,21 @@ def show_coin(country, year, stamp, value):
         div_class = f"found {coin.found_by}"
         marker = 'x'
 
+    name = coin.name if coin.name else ''
+    special_class = ''
+    if name:
+        if len(name) >= 26 and len(name) <= 52:
+            special_class = 'two_lines'
+        elif len(name) > 53:
+            special_class = 'three_lines'
+
     return {
+        'value': value,
         'marker': marker,
+        'name': name,
         'td_class': td_class,
         'div_class': div_class,
-        'value': value,
+        'special_class': special_class
     }
 
 
@@ -256,7 +266,7 @@ def add_coin(request):
             return response(1, f"Die Prägerei '{stamp}' existiert nicht.")
         stamp = None
 
-    exists   = True if request.POST['exists']   == 'true' else False
+    exists = True if request.POST['exists'] == 'true' else False
     if not exists:
         name        = ''
         found_by    = None
@@ -267,8 +277,9 @@ def add_coin(request):
         ec          = False
 
     else:
+        name = request.POST['name'] if request.POST['name'] else ''
         try:
-            name = str(request.POST['name'])
+            name = str(name)
         except Exception as e:
             return response(1, f"Der Münzenname '{name}' ist kein gültiger Name. {e}")