diff --git a/admin_interface/templates/admin/base_site.html b/admin_interface/templates/admin/base_site.html
index 708178b..284487f 100644
--- a/admin_interface/templates/admin/base_site.html
+++ b/admin_interface/templates/admin/base_site.html
@@ -10,589 +10,18 @@
 {% get_admin_interface_theme as theme %}
 <style type="text/css">
 
-    #header {
-        height:auto;
-        min-height:40px;
-        background:{{ theme.css_header_background_color }};
-        color:{{ theme.css_header_text_color }};
-    }
-
-    #header #user-tools a {
-        color:{{ theme.css_header_link_color }};
-    }
-
-    #header #user-tools a:hover,
-    #header #user-tools a:active {
-        color:{{ theme.css_header_link_hover_color }};
-        border-bottom-color:rgba(255, 255, 255, 0.5);
-    }
-
-    #branding h1 img.logo {
-        max-height:100px;
-        margin-top:10px;
-        margin-bottom:10px;
-        margin-right:15px;
-    }
-
-    #branding h1 {
-        color:{{ theme.css_header_title_color }};
-    }
-
-    #branding h1 img+span {
-        white-space:nowrap;
-    }
-
-    .module h2,
-    .module caption,
-    .module.filtered h2 {
-        background:{{ theme.css_module_background_color }};
-        color:{{ theme.css_module_text_color }};
-    }
-
-    .module a.section:link,
-    .module a.section:visited {
-        color:{{ theme.css_module_link_color }};
-    }
-
-    .module a.section:active,
-    .module a.section:hover {
-        color:{{ theme.css_module_link_hover_color }};
-    }
-
-    div.breadcrumbs {
-        background:{{ theme.css_module_background_color }};
-        color:{{ theme.css_module_text_color }};
-    }
-
-    div.breadcrumbs a {
-        color:{{ theme.css_module_link_color }};
-    }
-
-    div.breadcrumbs a:active,
-    div.breadcrumbs a:focus,
-    div.breadcrumbs a:hover {
-        color:{{ theme.css_module_link_hover_color }} !important;
-    }
-
-    fieldset.collapse {
-        border: 1px solid transparent;
-    }
-
-    fieldset.collapse.collapsed a.collapse-toggle {
-        color:{{ theme.css_generic_link_color }} !important;
-        font-weight: bold;
-        text-transform: lowercase;
-    }
-
-    fieldset.collapse.collapsed a.collapse-toggle:hover,
-    fieldset.collapse.collapsed a.collapse-toggle:active {
-        color:{{ theme.css_generic_link_hover_color }} !important;
-    }
-
-    fieldset.collapse a.collapse-toggle {
-        color:{{ theme.css_module_link_color }} !important;
-        font-weight: bold;
-        text-transform: lowercase;
-    }
-
-    fieldset.collapse a.collapse-toggle:hover,
-    fieldset.collapse a.collapse-toggle:active {
-        color:{{ theme.css_module_link_hover_color }} !important;
-    }
-
-    .inline-group h2 {
-        background:{{ theme.css_module_background_color }};
-        color:{{ theme.css_module_text_color }};
-    }
-
-    .selector-chosen h2 {
-        background:{{ theme.css_module_background_color }} !important;
-        color:{{ theme.css_module_text_color }} !important;
-    }
-
-    a:link, a:visited {
-        color:{{ theme.css_generic_link_color }};
-    }
-
-    a:hover {
-        color:{{ theme.css_generic_link_hover_color }};
-    }
-
-    .button, input[type=submit], input[type=button], .submit-row input, a.button {
-        background:{{ theme.css_save_button_background_color }};
-        color:{{ theme.css_save_button_text_color }};
-    }
-
-    .button:active, input[type=submit]:active, input[type=button]:active,
-    .button:focus, input[type=submit]:focus, input[type=button]:focus,
-    .button:hover, input[type=submit]:hover, input[type=button]:hover {
-        background:{{ theme.css_save_button_background_hover_color }};
-        color:{{ theme.css_save_button_text_color }};
-        outline: none;
-    }
-
-    .button.default, input[type=submit].default, .submit-row input.default {
-        background:{{ theme.css_save_button_background_color }};
-        color:{{ theme.css_save_button_text_color }};
-        outline: none;
-    }
-
-    .button.default:active, input[type=submit].default:active,
-    .button.default:focus, input[type=submit].default:focus,
-    .button.default:hover, input[type=submit].default:hover {
-        background:{{ theme.css_save_button_background_hover_color }};
-        color:{{ theme.css_save_button_text_color }};
-        outline: none;
-    }
-
-    .submit-row a.deletelink:link,
-    .submit-row a.deletelink:visited {
-        background:{{ theme.css_delete_button_background_color }};
-        color:{{ theme.css_delete_button_text_color }};
-    }
-
-    .submit-row a.deletelink:hover {
-        background:{{ theme.css_delete_button_background_hover_color }} !important;
-        color:{{ theme.css_delete_button_text_color }};
-    }
-
-    /*
-    #changelist table tbody tr.selected {
-        background-color:#FFFFCC;
-    }
-    */
-
-    #changelist .paginator {
-        margin-top:-1px !important; /* merge 2 borders into 1 */
-        line-height:42px;
-    }
-
-    .paginator a,
-    .paginator a:link,
-    .paginator a:visited,
-    .paginator .this-page {
-        padding:7px 12px !important;
-        {% if theme.css_module_rounded_corners %}border-radius:4px;{% endif %}
-    }
-
-    .paginator a,
-    .paginator a:link,
-    .paginator a:visited {
-        background-color:#ffffff !important;
-        color:{{ theme.css_generic_link_color }} !important;
-    }
-
-    .paginator a:hover,
-    .paginator a:active {
-        background-color:#f8f8f8 !important;
-        color:{{ theme.css_generic_link_hover_color }} !important;
-    }
-
-    .paginator .this-page {
-        background-color:{{ theme.css_module_background_color }} !important;
-        color:{{ theme.css_module_link_color }} !important;
-    }
-
-    .paginator a,
-    .paginator .this-page {
-        margin-left:0px;
-    }
-
-    .paginator .this-page,
-    .paginator a.end {
-        margin-right:25px;
-    }
-
-    .paginator .this-page + a:not(.showall)  {
-        margin-left:-25px !important;
-    }
-
-    body .paginator a.showall,
-    body .paginator a.showall:link,
-    body .paginator a.showall:visited {
-        margin-left:20px;
-        color:{{ theme.css_generic_link_color }} !important;
-    }
-
-    body .paginator a.showall:hover,
-    body .paginator a.showall:active {
-        color:{{ theme.css_generic_link_hover_color }} !important;
-    }
-
-    /* OTHER FIXES */
-
-    /* reduced width */
-    .login #container {
-        width:320px !important;
-        min-width:320px !important;
-    }
-
-    .login #content {
-        padding:10px 30px 10px 30px !important;
-    }
-
-    /* same lateral padding as in logged view */
-    .login #header {
-        padding:15px 30px !important;
-    }
-
-    .login #branding h1 {
-        margin-right:0;
-    }
-
-    .login #branding h1 img.logo {
-        max-width:100%;
-        margin-right:0;
-    }
-
-    /* login button right aligned */
-    .login #header #branding h1 img+span {
-        display:block;
-    }
-
-    /* login button right aligned */
-    .login .submit-row {
-        padding-left:0 !important;
-        text-align:right !important;
-    }
-
-    /* top-right buttons color on hover -> just a lighten grey */
-    .object-tools a:focus,
-    .object-tools a:hover,
-    .object-tools li:focus a,
-    .object-tools li:hover a {
-        background-color:#AAAAAA;
-    }
-
-    /* fix help text icon on newline */
-    .inline-group thead th {
-        white-space:nowrap;
-    }
-
-    .inline-group thead th img {
-        vertical-align: -2px;
-        margin-left: 5px;
-    }
-
-    form .form-row p.file-upload > a {
-        margin-right:10px;
-    }
-
-    form .form-row p.file-upload .clearable-file-input {
-        display:inline-block;
-    }
-
-    form .wide p.help {
-        padding-left:10px !important;
-    }
-
-    form .aligned.wide p.help,
-    form .aligned.wide ul.error-list,
-    form .aligned.wide ul.errorlist {
-        margin-left: 200px;
-    }
-
-    form .aligned.wide div.help {
-        margin-left: 210px;
-    }
-
-    textarea.tinymce ~ p.help {
-        margin-top:5px !important;
-    }
-
-    .aligned p.file-upload {
-        display:table;
-    }
-
-    /* begin fix issue #13 - Datetime widget broken in long inlines */
-    p.datetime {
-        white-space:nowrap;
-    }
-    /* end fix */
-
-    /* begin fix lateral padding to align text with field labels */
-    .module h2,
-    .dashboard .module caption,
-    .module.filtered h2,
-    .inline-group h2 {
-        padding-left:10px;
-        padding-right:10px;
-    }
-    /* end fix */
-
-    /* begin fix issue #11 - Inline border bottom should not be rounded */
-    .module h2,
-    .dashboard .module caption,
-    .module.filtered h2 {
-        {% if theme.css_module_rounded_corners %}
-        border-radius:4px;
-        {% endif %}
-    }
-
-    .inline-group h2 {
-        {% if theme.css_module_rounded_corners %}
-        border-bottom-left-radius:0;
-        border-bottom-right-radius:0;
-        {% endif %}
-    }
-    /* end fix */
-
-    .module.filtered h2 {
-        border-bottom-left-radius:0;
-        border-bottom-right-radius:0;
-    }
-
-    .module.filtered #changelist-filter {
-        border-bottom-left-radius:4px;
-        border-bottom-right-radius:4px;
-    }
-
-    .module.filtered #changelist-filter h2 {
-        font-size: 11px;
-        padding: 10px 15px;
-    }
-
-    .module.filtered #changelist-filter select {
-        background-color:#ffffff;
-    }
-
-    .module.filtered #changelist-filter li.selected a,
-    .module.filtered #changelist-filter li.selected a:hover {
-        color: {{ theme.css_generic_link_color }};
-    }
-
-    #content-related {
-        {% if theme.css_module_rounded_corners %}
-        border-radius:4px;
-        {% endif %}
-    }
-
-    /* selector chooseall / clearall color on hover -> just a lighten grey */
-    a.selector-chooseall:hover, a.selector-clearall:hover {
-        color:#888888 !important;
-    }
-
-    .inline-group {
-        overflow-x:auto;
-    }
-
-    /* begin fix issue #10 - Related widget broken in long tabular inline */
-    .inline-group .tabular .related-widget-wrapper {
-        white-space:nowrap;
-    }
-    /* end fix */
-
-    .inline-related h3 {
-        padding:6px 10px !important;
-    }
-
-    /* begin fix issue #12 - Inlines bad delete buttons alignement */
-    .inline-group .tabular thead th:last-child:not([class]):not([style]) {
-        text-align:right;
-    }
-
-    .inline-group .tabular tr td.delete {
-        text-align:right;
-        padding-right:15px;
-    }
-
-    .inline-group .tabular tr td.delete a.inline-deletelink {
-        margin-top:2px;
-        overflow:hidden;
-        text-indent:9999px;
-    }
-    /* end fix */
-
-    /*
-    django-modeltranslation support
-    https://github.com/deschler/django-modeltranslation/pull/313/commits
-    */
-    #content h1 select {
-        text-transform:uppercase;
-        margin-left:15px;
-    }
-
-    .ui-tabs .ui-tabs-nav {
-        padding:10px 0 0 10px !important;
-    }
-
-    .ui-tabs .ui-tabs-nav li {
-        margin-left:-1px !important;
-    }
-
-    .ui-tabs .ui-tabs-nav li a {
-        outline:none;
-        background-color:#f8f8f8 !important;
-        border:1px solid #eeeeee !important;
-        border-bottom:none !important;
-        text-transform:uppercase;
-
-        padding:7px 14px 8px 14px !important;
-        margin-top:1px !important;
-    }
-
-    .ui-tabs .ui-tabs-nav li.ui-tabs-active a,
-    .ui-tabs .ui-tabs-nav li.ui-tabs-selected a {
-
-        padding:8px 14px 8px 14px !important;
-        margin-top:0px !important;
-
-        margin-bottom:-1px !important;
-
-        background-color:#FFFFFF !important;
-        color:{{ theme.css_module_background_color }} !important;
-
-        border-bottom:1px solid #FFFFFF !important;
-    }
-
-    .inline-group .tabular .ui-tabs .ui-tabs-panel {
-        padding:8px !important;
-    }
-
-    #changelist .row1:not(.selected):hover,
-    #changelist .row2:not(.selected):hover {
-        background:#f9f9f9;
-    }
-
-    .row2 {
-        background:#fcfcfc;
-    }
-
-    .row2 .ui-tabs .ui-tabs-nav li a {
-        background-color:#f5f5f5 !important;
-        border:1px solid #ebebeb !important;
-    }
-
-    .row2 .ui-tabs .ui-tabs-nav li.ui-tabs-active a,
-    .row2 .ui-tabs .ui-tabs-nav li.ui-tabs-selected a {
-        background-color:#fcfcfc !important;
-        border-bottom:1px solid #fcfcfc !important;
-    }
-
-    /*
-    list-filter-dropdown
-    */
-    .list-filter-dropdown {
-        margin-top:10px;
-        margin-bottom:20px;
-    }
-
-    .list-filter-dropdown select {
-        width:90%;
-        margin-right:5%;
-    }
-
-
-    /*
-    sorl-thumbnail - improved AdminImageMixin widget layout
-    https://github.com/mariocesar/sorl-thumbnail
-    */
-    a.thumbnail + input[type="checkbox"] {
-        margin:10px 0;
-    }
-
-    /*
-    ckeditor + light theme
-    https://github.com/Ikimea/ckeditor-light-theme
-    */
-    .cke_inner, .cke_wysiwyg_frame {
-        border-top-left-radius: 4px !important;
-        border-top-right-radius: 4px !important;
-        border-bottom-left-radius: 4px !important;
-        border-bottom-right-radius: 4px !important;
-    }
-
-    .cke_top {
-        background: #f6f6f6 !important;
-        border-top: none;
-
-        border-top-left-radius: 4px !important;
-        border-top-right-radius: 4px !important;
-
-        -moz-box-shadow: none !important;
-        -webkit-box-shadow: none !important;
-        box-shadow: none !important;
-    }
-
-    .cke_bottom {
-        background: #f6f6f6 !important;
-        border-top: 1px solid #efefef !important;
-
-        border-bottom-left-radius: 4px !important;
-        border-bottom-right-radius: 4px !important;
-    }
-
-    .cke_source {
-        padding: 13px 15px !important;
-        box-sizing: border-box !important;
-    }
-
-    a.cke_button_on {
-        -moz-box-shadow: none !important;
-        -webkit-box-shadow: none !important;
-        box-shadow: none !important;
-        background-color: rgba(0,0,0,0.1) !important;
-        border-radius: 4px !important;
-    }
-
-    .cke_resizer {
-        border-color: transparent #999 transparent transparent !important;
-    }
-
-    /*
-    related modal + magnific popup customization
-    https://github.com/dimsemenov/Magnific-Popup
-    */
-    .related-modal.mfp-bg {
-        background-color:{{ theme.related_modal_background_color }} !important;
-        opacity: {{ theme.related_modal_background_opacity }} !important;
-    }
-
-    .related-modal .mfp-content {
-        height: 100% !important;
-        overflow: hidden;
-        {% if theme.related_modal_rounded_corners %}
-        border-radius: 4px;
-        {% endif %}
-        -webkit-box-shadow: 0px 5px 30px 0px rgba(0,0,0,0.2);
-        -moz-box-shadow: 0px 5px 30px 0px rgba(0,0,0,0.2);
-        box-shadow: 0px 5px 30px 0px rgba(0,0,0,0.2);
-    }
-
-    .related-modal .mfp-container {
-        padding: 90px 90px 90px 90px !important;
-    }
-
-    .related-modal__nested .mfp-container {
-        padding: 30px 60px 30px 60px !important;
-    }
-
-    @media (max-width:640px){
-        .related-modal .mfp-container {
-            padding: 60px 15px 60px 15px !important;
-        }
-        .related-modal__nested .mfp-container {
-            padding: 30px 30px 30px 30px !important;
-        }
-    }
-
-    .related-modal #related-modal-iframe {
-        width: 100%;
-        height: 100%;
-        background-color: #FFFFFF;
-        background-repeat: no-repeat;
-        background-position: center center;
-        background-size: 30px 30px;
-        background-image: url("data:image/svg+xml;utf8,<?xml version='1.0' encoding='utf-8'?><svg width='30px' height='30px' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='xMidYMid' class='uil-ring-alt'><rect x='0' y='0' width='100' height='100' fill='none' class='bk'></rect><circle cx='50' cy='50' r='40' stroke='#eeeeee' fill='none' stroke-width='6' stroke-linecap='round'></circle><circle cx='50' cy='50' r='40' stroke='#aaaaaa' fill='none' stroke-width='6' stroke-linecap='round'><animate attributeName='stroke-dashoffset' dur='2s' repeatCount='indefinite' from='0' to='500'></animate><animate attributeName='stroke-dasharray' dur='2s' repeatCount='indefinite' values='150 100;1 250;150 100'></animate></circle></svg>");
-        border: none;
-        margin: 0 auto;
-        padding: 0;
-        display: block;
-    }
-
-    {% if theme.css %}
-        {{ theme.css|safe }}
-    {% endif %}
+{% include "admin_interface/css/admin-interface.css" %}
+{% include "admin_interface/css/admin-interface-fix.css" %}
+{% include "admin_interface/css/list-filter-dropdown.css" %}
+{% include "admin_interface/css/related-modal.css" %}
+{% include "admin_interface/css/modeltranslation.css" %}
+{% include "admin_interface/css/sorl-thumbnail.css" %}
+{% include "admin_interface/css/ckeditor.css" %}
+{% include "admin_interface/css/tinymce.css" %}
+
+{% if theme.css %}
+    {{ theme.css|safe }}
+{% endif %}
 
 </style>
 {% endblock %}
diff --git a/admin_interface/templates/admin_interface/css/admin-interface-fix.css b/admin_interface/templates/admin_interface/css/admin-interface-fix.css
new file mode 100644
index 0000000..de0bf60
--- /dev/null
+++ b/admin_interface/templates/admin_interface/css/admin-interface-fix.css
@@ -0,0 +1,275 @@
+.admin-interface.login #container {
+    width:320px;
+    margin:90px auto;
+    box-sizing:border-box;
+    -moz-box-sizing:border-box;
+    -webkit-box-sizing:border-box;
+}
+
+.admin-interface.login #content {
+    padding:15px 30px 10px 30px;
+}
+
+@media (max-width:767px){
+
+    .admin-interface.login #container {
+        margin:0px auto;
+    }
+
+    .admin-interface.login #content {
+        padding:20px 30px 30px 30px;
+    }
+}
+
+.admin-interface.login #header {
+    padding:15px 30px 10px;
+    line-height:30px;
+}
+
+.admin-interface.login #branding h1 {
+    margin-right:0;
+}
+
+.admin-interface.login #branding h1 img.logo {
+    max-width:100%;
+    margin-right:0;
+}
+
+.admin-interface.login #header #branding h1 img.logo+span {
+    display:block;
+    margin-bottom: 5px;
+}
+
+.admin-interface.login .submit-row {
+    padding-left:0;
+    text-align:right;
+}
+
+.admin-interface #header {
+    height:auto;
+    min-height:40px;
+}
+
+.admin-interface #branding h1 img.logo {
+    max-height:100px;
+    margin-top:10px;
+    margin-bottom:10px;
+    margin-right:15px;
+    display:inline-block !important;
+}
+
+.admin-interface #branding h1 img.logo+span {
+    white-space:nowrap;
+}
+
+.admin-interface fieldset.collapse {
+    border: 1px solid transparent;
+}
+
+.admin-interface fieldset.collapse.collapsed a.collapse-toggle {
+    font-weight: bold;
+    text-transform: lowercase;
+}
+
+.admin-interface fieldset.collapse a.collapse-toggle {
+    font-weight: bold;
+    text-transform: lowercase;
+}
+
+/*
+#changelist table tbody tr.selected {
+    background-color:#FFFFCC;
+}
+*/
+
+.admin-interface #changelist .paginator {
+    margin-top:-1px !important; /* merge 2 borders into 1 */
+    line-height:42px;
+}
+
+.admin-interface .paginator a,
+.admin-interface .paginator a:link,
+.admin-interface .paginator a:visited,
+.admin-interface .paginator .this-page {
+    padding:7px 12px !important;
+}
+
+.admin-interface .paginator a,
+.admin-interface .paginator .this-page {
+    margin-left:0px;
+}
+
+.admin-interface .paginator .this-page,
+.admin-interface .paginator a.end {
+    margin-right:25px;
+}
+
+.admin-interface .paginator .this-page + a:not(.showall)  {
+    margin-left:-25px/* !important*/;
+}
+
+body.admin-interface .paginator a.showall,
+body.admin-interface .paginator a.showall:link,
+body.admin-interface .paginator a.showall:visited {
+    margin-left:20px;
+}
+
+/* fix help text icon on newline */
+.admin-interface .inline-group thead th {
+    white-space:nowrap;
+}
+
+.admin-interface .inline-group thead th img {
+    vertical-align: -2px;
+    margin-left: 5px;
+}
+
+.admin-interface .aligned p.file-upload {
+    display:table;
+}
+
+.admin-interface form .form-row p.file-upload > a {
+    margin-right:20px;
+}
+
+.admin-interface form .form-row p.file-upload .clearable-file-input {
+    display:inline-block;
+    margin-left:
+}
+
+.admin-interface form .form-row p.file-upload .clearable-file-input label {
+    padding-bottom:0px;
+    margin-left:2px;
+}
+
+.admin-interface form .form-row p.file-upload > input[type="file"] {
+    margin-top: 0px;
+}
+
+@media (max-width:767px){
+    .admin-interface form .form-row p.file-upload > a {
+        margin-right:0px;
+        display: block;
+    }
+
+    .admin-interface form .form-row p.file-upload .clearable-file-input {
+        display: block;
+        margin-top: 10px;
+        margin-bottom: -10px;
+    }
+
+    .admin-interface form .form-row p.file-upload > input[type="file"] {
+        display: block;
+        width: auto;
+        padding: 0px;
+    }
+}
+
+
+/* HELPS / MESSAGES */
+.admin-interface form .wide p.help {
+    padding-left:10px;
+}
+
+@media (max-width:767px){
+    .admin-interface form .wide p.help {
+        padding-left:0px;
+    }
+}
+
+.admin-interface form .aligned.wide p.help,
+.admin-interface form .aligned.wide ul.error-list,
+.admin-interface form .aligned.wide ul.errorlist {
+    margin-left: 200px;
+}
+
+.admin-interface form .aligned.wide div.help {
+    margin-left: 210px;
+}
+
+
+/* LIST FILTER */
+.admin-interface .module.filtered h2 {
+    border-bottom-left-radius:0;
+    border-bottom-right-radius:0;
+}
+
+.admin-interface .module.filtered #changelist-filter {
+    border-bottom-left-radius:4px;
+    border-bottom-right-radius:4px;
+}
+
+.admin-interface .module.filtered #changelist-filter h2 {
+    font-size: 11px;
+    padding: 10px 15px;
+}
+
+/* begin fix issue #13 - Datetime widget broken in long inlines */
+.admin-interface p.datetime {
+    white-space:nowrap;
+}
+/* end fix */
+
+/* begin fix lateral padding to align text with field labels */
+.admin-interface .module h2,
+.admin-interface.dashboard .module caption,
+.admin-interface .module.filtered h2,
+.admin-interface .inline-group h2 {
+    padding-left:10px;
+    padding-right:10px;
+}
+/* end fix */
+
+/* selector chooseall / clearall color on hover -> just a lighten grey */
+.admin-interface a.selector-chooseall:hover,
+.admin-interface a.selector-clearall:hover {
+    color:#888888/* !important*/;
+}
+
+.admin-interface .inline-group {
+    overflow-x:auto;
+}
+
+/* begin fix issue #10 - Related widget broken in long tabular inline */
+.admin-interface .inline-group .tabular .related-widget-wrapper {
+    white-space:nowrap;
+}
+/* end fix */
+
+.admin-interface .inline-related h3 {
+    padding:6px 10px/* !important*/;
+}
+
+/* begin fix issue #12 - Inlines bad delete buttons alignement */
+.admin-interface .inline-group .tabular thead th:last-child:not([class]):not([style]) {
+    text-align:right;
+}
+
+.admin-interface .inline-group .tabular tr td.delete {
+    text-align:right;
+    padding-right:15px;
+}
+
+.admin-interface .inline-group .tabular tr td.delete a.inline-deletelink {
+    margin-top:2px;
+    overflow:hidden;
+    text-indent:9999px;
+}
+/* end fix */
+
+/* top-right buttons color on hover -> just a lighten grey */
+.admin-interface .object-tools a {
+    color:#FFFFFF;
+}
+.admin-interface .object-tools a:focus,
+.admin-interface .object-tools a:hover,
+.admin-interface .object-tools li:focus a,
+.admin-interface .object-tools li:hover a {
+    background-color:#AAAAAA;
+}
+
+/* selector chooseall / clearall color on hover -> just a lighten grey */
+.admin-interface a.selector-chooseall:hover,
+.admin-interface a.selector-clearall:hover {
+    color:#888888/* !important*/;
+}
diff --git a/admin_interface/templates/admin_interface/css/admin-interface.css b/admin_interface/templates/admin_interface/css/admin-interface.css
new file mode 100644
index 0000000..d900733
--- /dev/null
+++ b/admin_interface/templates/admin_interface/css/admin-interface.css
@@ -0,0 +1,204 @@
+.admin-interface #header {
+    background:{{ theme.css_header_background_color }};
+    color:{{ theme.css_header_text_color }};
+}
+
+.admin-interface #branding h1 {
+    color:{{ theme.css_header_title_color }};
+}
+
+.admin-interface #header #user-tools a {
+    color:{{ theme.css_header_link_color }};
+}
+
+.admin-interface #header #user-tools a:hover,
+.admin-interface #header #user-tools a:active {
+    color:{{ theme.css_header_link_hover_color }};
+    border-bottom-color:rgba(255, 255, 255, 0.5);
+}
+
+.admin-interface .module h2,
+.admin-interface .module caption,
+.admin-interface .module.filtered h2 {
+    background:{{ theme.css_module_background_color }};
+    color:{{ theme.css_module_text_color }};
+}
+
+.admin-interface .module a.section:link,
+.admin-interface .module a.section:visited {
+    color:{{ theme.css_module_link_color }};
+}
+
+.admin-interface .module a.section:active,
+.admin-interface .module a.section:hover {
+    color:{{ theme.css_module_link_hover_color }};
+}
+
+.admin-interface div.breadcrumbs {
+    background:{{ theme.css_module_background_color }};
+    color:{{ theme.css_module_text_color }};
+}
+
+.admin-interface div.breadcrumbs a {
+    color:{{ theme.css_module_link_color }};
+}
+
+.admin-interface div.breadcrumbs a:active,
+.admin-interface div.breadcrumbs a:focus,
+.admin-interface div.breadcrumbs a:hover {
+    color:{{ theme.css_module_link_hover_color }};
+}
+
+.admin-interface fieldset.collapse.collapsed a.collapse-toggle {
+    color:{{ theme.css_generic_link_color }};
+}
+
+.admin-interface fieldset.collapse.collapsed a.collapse-toggle:hover,
+.admin-interface fieldset.collapse.collapsed a.collapse-toggle:active {
+    color:{{ theme.css_generic_link_hover_color }};
+}
+
+.admin-interface fieldset.collapse a.collapse-toggle {
+    color:{{ theme.css_module_link_color }};
+}
+
+.admin-interface fieldset.collapse a.collapse-toggle:hover,
+.admin-interface fieldset.collapse a.collapse-toggle:active {
+    color:{{ theme.css_module_link_hover_color }};
+}
+
+.admin-interface .inline-group h2 {
+    background:{{ theme.css_module_background_color }};
+    color:{{ theme.css_module_text_color }};
+}
+
+.admin-interface .selector-chosen h2 {
+    background:{{ theme.css_module_background_color }};
+    color:{{ theme.css_module_text_color }};
+}
+
+.admin-interface a:link,
+.admin-interface a:visited {
+    color:{{ theme.css_generic_link_color }};
+}
+
+.admin-interface a:hover {
+    color:{{ theme.css_generic_link_hover_color }};
+}
+
+.admin-interface .button,
+.admin-interface input[type=submit],
+.admin-interface input[type=button],
+.admin-interface .submit-row input,
+.admin-interface a.button {
+    background:{{ theme.css_save_button_background_color }};
+    color:{{ theme.css_save_button_text_color }};
+}
+
+.admin-interface .button:active,
+.admin-interface .button:focus,
+.admin-interface .button:hover,
+.admin-interface input[type=submit]:active,
+.admin-interface input[type=submit]:focus,
+.admin-interface input[type=submit]:hover,
+.admin-interface input[type=button]:active,
+.admin-interface input[type=button]:focus,
+.admin-interface input[type=button]:hover {
+    background:{{ theme.css_save_button_background_hover_color }};
+    color:{{ theme.css_save_button_text_color }};
+    outline: none;
+}
+
+.admin-interface .button.default,
+.admin-interface input[type=submit].default,
+.admin-interface .submit-row input.default {
+    background:{{ theme.css_save_button_background_color }};
+    color:{{ theme.css_save_button_text_color }};
+    outline: none;
+}
+
+.admin-interface .button.default:active,
+.admin-interface .button.default:focus,
+.admin-interface .button.default:hover,
+.admin-interface input[type=submit].default:active,
+.admin-interface input[type=submit].default:focus,
+.admin-interface input[type=submit].default:hover {
+    background:{{ theme.css_save_button_background_hover_color }};
+    color:{{ theme.css_save_button_text_color }};
+    outline: none;
+}
+
+.admin-interface .submit-row a.deletelink:link,
+.admin-interface .submit-row a.deletelink:visited {
+    background:{{ theme.css_delete_button_background_color }};
+    color:{{ theme.css_delete_button_text_color }};
+}
+
+.admin-interface .submit-row a.deletelink:hover {
+    background:{{ theme.css_delete_button_background_hover_color }};
+    color:{{ theme.css_delete_button_text_color }};
+}
+
+.admin-interface .paginator a,
+.admin-interface .paginator a:link,
+.admin-interface .paginator a:visited,
+.admin-interface .paginator .this-page {
+    {% if theme.css_module_rounded_corners %}border-radius:4px;{% endif %}
+}
+
+.admin-interface .paginator a,
+.admin-interface .paginator a:link,
+.admin-interface .paginator a:visited {
+    background-color:#FFFFFF !important;
+    color:{{ theme.css_generic_link_color }};
+}
+
+.admin-interface .paginator a:hover,
+.admin-interface .paginator a:active {
+    background-color:#F8F8F8 !important;
+    color:{{ theme.css_generic_link_hover_color }};
+}
+
+.admin-interface .paginator .this-page {
+    background-color:{{ theme.css_module_background_color }};
+    color:{{ theme.css_module_link_color }};
+}
+
+.admin-interface .paginator a.showall,
+.admin-interface .paginator a.showall:link,
+.admin-interface .paginator a.showall:visited {
+    color:{{ theme.css_generic_link_color }};
+}
+
+.admin-interface .paginator a.showall:hover,
+.admin-interface .paginator a.showall:active {
+    color:{{ theme.css_generic_link_hover_color }};
+}
+
+.admin-interface .module.filtered #changelist-filter li.selected a,
+.admin-interface .module.filtered #changelist-filter li.selected a:hover {
+    color: {{ theme.css_generic_link_color }};
+}
+
+/* begin fix issue #11 - Inline border bottom should not be rounded */
+.admin-interface .module h2,
+.admin-interface.dashboard .module caption,
+.admin-interface .module.filtered h2 {
+    {% if theme.css_module_rounded_corners %}
+    border-radius:4px;
+    {% endif %}
+}
+
+.admin-interface .inline-group h2 {
+    {% if theme.css_module_rounded_corners %}
+    border-bottom-left-radius:0;
+    border-bottom-right-radius:0;
+    {% endif %}
+}
+/* end fix */
+
+.admin-interface #content-related {
+    {% if theme.css_module_rounded_corners %}
+    border-radius:4px;
+    {% endif %}
+}
\ No newline at end of file
diff --git a/admin_interface/templates/admin_interface/css/ckeditor.css b/admin_interface/templates/admin_interface/css/ckeditor.css
new file mode 100644
index 0000000..d3fdf9d
--- /dev/null
+++ b/admin_interface/templates/admin_interface/css/ckeditor.css
@@ -0,0 +1,48 @@
+/*
+ckeditor + light theme
+https://github.com/Ikimea/ckeditor-light-theme
+*/
+.admin-interface .cke_inner,
+.admin-interface .cke_wysiwyg_frame {
+    border-top-left-radius: 4px;
+    border-top-right-radius: 4px;
+    border-bottom-left-radius: 4px;
+    border-bottom-right-radius: 4px;
+}
+
+.admin-interface .cke_top {
+    background: #f6f6f6;
+    border-top: none;
+
+    border-top-left-radius: 4px;
+    border-top-right-radius: 4px;
+
+    -moz-box-shadow: none;
+    -webkit-box-shadow: none;
+    box-shadow: none;
+}
+
+.admin-interface .cke_bottom {
+    background: #f6f6f6;
+    border-top: 1px solid #efefef;
+
+    border-bottom-left-radius: 4px;
+    border-bottom-right-radius: 4px;
+}
+
+.admin-interface .cke_source {
+    padding: 13px 15px;
+    box-sizing: border-box;
+}
+
+.admin-interface a.cke_button_on {
+    -moz-box-shadow: none;
+    -webkit-box-shadow: none;
+    box-shadow: none;
+    background-color: rgba(0,0,0,0.1);
+    border-radius: 4px;
+}
+
+.admin-interface .cke_resizer {
+    border-color: transparent #999 transparent transparent;
+}
\ No newline at end of file
diff --git a/admin_interface/templates/admin_interface/css/list-filter-dropdown.css b/admin_interface/templates/admin_interface/css/list-filter-dropdown.css
new file mode 100644
index 0000000..f1f5d82
--- /dev/null
+++ b/admin_interface/templates/admin_interface/css/list-filter-dropdown.css
@@ -0,0 +1,13 @@
+/*
+list-filter-dropdown
+*/
+.admin-interface .list-filter-dropdown {
+    margin-top:10px;
+    margin-bottom:20px;
+}
+
+.admin-interface .list-filter-dropdown select {
+    background-color:#FFFFFF;
+    width:90%;
+    margin-right:5%;
+}
\ No newline at end of file
diff --git a/admin_interface/templates/admin_interface/css/modeltranslation.css b/admin_interface/templates/admin_interface/css/modeltranslation.css
new file mode 100644
index 0000000..a61aa8b
--- /dev/null
+++ b/admin_interface/templates/admin_interface/css/modeltranslation.css
@@ -0,0 +1,65 @@
+/*
+django-modeltranslation support
+https://github.com/deschler/django-modeltranslation/pull/313/commits
+*/
+.admin-interface #content h1 select {
+    text-transform:uppercase;
+    margin-left:15px;
+}
+
+.admin-interface .ui-tabs .ui-tabs-nav {
+    padding:10px 0 0 10px/* !important*/;
+}
+
+.admin-interface .ui-tabs .ui-tabs-nav li {
+    margin-left:-1px/* !important*/;
+}
+
+.admin-interface .ui-tabs .ui-tabs-nav li a {
+    outline:none;
+    background-color:#f8f8f8/* !important*/;
+    border:1px solid #eeeeee/* !important*/;
+    border-bottom:none/* !important*/;
+    text-transform:uppercase;
+
+    padding:7px 14px 8px 14px/* !important*/;
+    margin-top:1px/* !important*/;
+}
+
+.admin-interface .ui-tabs .ui-tabs-nav li.ui-tabs-active a,
+.admin-interface .ui-tabs .ui-tabs-nav li.ui-tabs-selected a {
+
+    padding:8px 14px 8px 14px/* !important*/;
+    margin-top:0px/* !important*/;
+
+    margin-bottom:-1px/* !important*/;
+
+    background-color:#FFFFFF/* !important*/;
+    color:{{ theme.css_module_background_color }} !important;
+
+    border-bottom:1px solid #FFFFFF !important;
+}
+
+.admin-interface .inline-group .tabular .ui-tabs .ui-tabs-panel {
+    padding:8px/* !important*/;
+}
+
+.admin-interface #changelist .row1:not(.selected):hover,
+.admin-interface #changelist .row2:not(.selected):hover {
+    background:#f9f9f9;
+}
+
+.admin-interface .row2 {
+    background:#fcfcfc;
+}
+
+.admin-interface .row2 .ui-tabs .ui-tabs-nav li a {
+    background-color:#f5f5f5/* !important*/;
+    border:1px solid #ebebeb/* !important*/;
+}
+
+.admin-interface .row2 .ui-tabs .ui-tabs-nav li.ui-tabs-active a,
+.admin-interface .row2 .ui-tabs .ui-tabs-nav li.ui-tabs-selected a {
+    background-color:#fcfcfc/* !important*/;
+    border-bottom:1px solid #fcfcfc/* !important*/;
+}
\ No newline at end of file
diff --git a/admin_interface/templates/admin_interface/css/related-modal.css b/admin_interface/templates/admin_interface/css/related-modal.css
new file mode 100644
index 0000000..3156f17
--- /dev/null
+++ b/admin_interface/templates/admin_interface/css/related-modal.css
@@ -0,0 +1,50 @@
+/*
+related modal + magnific popup customization
+https://github.com/dimsemenov/Magnific-Popup
+*/
+.admin-interface .related-modal.mfp-bg {
+    background-color:{{ theme.related_modal_background_color }}/* !important*/;
+    opacity: {{ theme.related_modal_background_opacity }}/* !important*/;
+}
+
+.admin-interface .related-modal .mfp-content {
+    height: 100%/* !important*/;
+    overflow: hidden;
+    {% if theme.related_modal_rounded_corners %}
+    border-radius: 4px;
+    {% endif %}
+    -webkit-box-shadow: 0px 5px 30px 0px rgba(0,0,0,0.2);
+    -moz-box-shadow: 0px 5px 30px 0px rgba(0,0,0,0.2);
+    box-shadow: 0px 5px 30px 0px rgba(0,0,0,0.2);
+}
+
+.admin-interface .related-modal .mfp-container {
+    padding: 90px 90px 90px 90px/* !important*/;
+}
+
+.admin-interface .related-modal__nested .mfp-container {
+    padding: 30px 60px 30px 60px/* !important*/;
+}
+
+@media (max-width:640px){
+    .admin-interface .related-modal .mfp-container {
+        padding: 60px 15px 60px 15px/* !important*/;
+    }
+    .admin-interface .related-modal__nested .mfp-container {
+        padding: 30px 30px 30px 30px/* !important*/;
+    }
+}
+
+.admin-interface .related-modal #related-modal-iframe {
+    width: 100%;
+    height: 100%;
+    background-color: #FFFFFF;
+    background-repeat: no-repeat;
+    background-position: center center;
+    background-size: 30px 30px;
+    background-image: url("data:image/svg+xml;utf8,<?xml version='1.0' encoding='utf-8'?><svg width='30px' height='30px' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='xMidYMid' class='uil-ring-alt'><rect x='0' y='0' width='100' height='100' fill='none' class='bk'></rect><circle cx='50' cy='50' r='40' stroke='#eeeeee' fill='none' stroke-width='6' stroke-linecap='round'></circle><circle cx='50' cy='50' r='40' stroke='#aaaaaa' fill='none' stroke-width='6' stroke-linecap='round'><animate attributeName='stroke-dashoffset' dur='2s' repeatCount='indefinite' from='0' to='500'></animate><animate attributeName='stroke-dasharray' dur='2s' repeatCount='indefinite' values='150 100;1 250;150 100'></animate></circle></svg>");
+    border: none;
+    margin: 0 auto;
+    padding: 0;
+    display: block;
+}
\ No newline at end of file
diff --git a/admin_interface/templates/admin_interface/css/sorl-thumbnail.css b/admin_interface/templates/admin_interface/css/sorl-thumbnail.css
new file mode 100644
index 0000000..7e3240d
--- /dev/null
+++ b/admin_interface/templates/admin_interface/css/sorl-thumbnail.css
@@ -0,0 +1,37 @@
+/*
+sorl-thumbnail - improved AdminImageMixin widget layout
+https://github.com/mariocesar/sorl-thumbnail
+*/
+.admin-interface a.thumbnail + input[type="checkbox"] {
+    margin: 10px 0;
+}
+
+.admin-interface a.thumbnail ~ label {
+    color: #333;
+    font-size: 11px;
+    display: inline;
+    float: none;
+    margin-left: 2px;
+}
+
+.admin-interface.change-form div[style="float:left"] {
+    font-size: 11px;
+    font-weight: bold;
+    color: #666;
+    margin-bottom: 5px;
+}
+
+.admin-interface .aligned .form-row a.thumbnail ~ input[type="file"] {
+    margin-top: 0px;
+}
+
+@media (max-width:767px){
+    .admin-interface .aligned .form-row a.thumbnail ~ input[type="file"] {
+        width: auto;
+        padding: 0px;
+    }
+
+    .admin-interface div[style="float:left"] {
+        margin-bottom: 0px;
+    }
+}
\ No newline at end of file
diff --git a/admin_interface/templates/admin_interface/css/tinymce.css b/admin_interface/templates/admin_interface/css/tinymce.css
new file mode 100644
index 0000000..f0aa1a0
--- /dev/null
+++ b/admin_interface/templates/admin_interface/css/tinymce.css
@@ -0,0 +1,3 @@
+.admin-interface textarea.tinymce ~ p.help {
+    margin-top:5px/* !important*/;
+}
\ No newline at end of file