diff --git a/templates/index.html.ep b/templates/index.html.ep
index 9acc7a1..44d3f01 100644
--- a/templates/index.html.ep
+++ b/templates/index.html.ep
@@ -10,6 +10,7 @@
     <script src = "https://cdn.datatables.net/plug-ins/1.10.16/sorting/scientific.js"></script>
     <script src='https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.2/MathJax.js?config=TeX-MML-AM_CHTML'></script>
     <link rel="stylesheet" href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css">
+    <link rel="stylesheet" href="/derekovecs/css/derekovecs.css">
     <script
       src="http://code.jquery.com/ui/1.12.1/jquery-ui.min.js"
       integrity="sha256-VazP97ZCwtekAsvgPBSUwPFKdrwD3unUfSGVYrahUqU="
@@ -410,239 +411,6 @@
     <script src="/derekovecs/js/tsne.js"></script>
     <script src="/derekovecs/js/som.js"></script>
     <script src="/derekovecs/js/labeler.js"></script>
-    <style>
-     body, input {
-       font-family: Lato, sans-serif;
-       font-size: 11pt;
-     }
-
-     .info {
-       font-size: 8pt;
-       margin-top: 4px;
-       /* position: absolute;
-          bottom: 0;
-          left: 0;
-          right: 0; */
-     }
-
-     h1,  h2, h3 {
-       margin: 5px 10px 0 0;
-       color: rgb(246,168,0);
-       font-family: "Univers LT Std 47 Cn Lt", "Univers LT Std 67 Cn Lt", "Roboto Condensed", "Univers LT Std 67 Cn Bold", "UniversLTStd-BoldCn", "Times", 'League Gothic', Impact, sans-serif;
-       font-weight: bold;
-       line-height: 1.35;
-       letter-spacing: normal;
-       text-transform: uppercase;
-       text-shadow: none;
-       word-wrap: break-word;
-     }
-
-
-     showoptions, #SEARCH {
-       margin-left: 10px;
-       margin-right: 10px;
-     }
-
-     .tabs-left-vertical .ui-tabs-nav {
-       position: absolute;
-       width: 21em;
-       transform: translate(-100%,0%) rotate(-90deg);
-       transform-origin: 100% 0%;
-     }
-
-     .tabs-left-vertical .ui-tabs-nav li {
-       float: right;
-     }
-
-     .tabs-left-vertical .ui-tabs-panel {
-       padding-left: 3.5em;
-     }
-
-     .tabs-left-vertical .ui-tabs-panel {
-       height: 20em;
-     }
-
-     .mono {
-       font-family: "DejaVu Sans Mono", Inconsolata, SourceCodePro, "Courier New", Courier, monospace;
-     }
-
-     .ui-tooltip-content {
-       font-size: 10pt;
-       color: #222222;
-     }
-
-     svg > .ui-tooltip-content {
-       font-size: 8pt;
-       color: #222222;
-     }
-
-     a.merged {
-       color: green;
-       fill: green;
-     }
-
-     #first a {
-       text-decoration: none;
-     }
-
-     a.marked, #first a.marked {
-       text-decoration: underline;
-     }
-
-     a.target {
-       color: red;
-       fill: red;
-     }
-
-     table.display {
-       width: 40% important!;
-       margin: 1;  /* <- works for me this way ****/
-     }
-
-     table.dataTable thead th, table.dataTable thead td, table.dataTable tbody td {
-       padding: 2px 2px;
-       //  border-bottom: 1px solid #111;
-     }
-
-     td.collocator {
-       cursor: pointer;
-     }
-
-     #collocators {
-       margin-bottom: 15px;
-     }
-
-     #header {
-       width: 100%;
-       //   border: 1px solid red;
-       overflow: hidden; /* will contain if #first is longer than #second */
-     }
-
-     #topwrapper {
-       width: 100%;
-       display: flex;
-//       border: 1px solid red;
-     }
-
-     #wrapper {
-       width: 100%;
-       display: flex;
-       flex-wrap: wrap;
-      padding:5px;
-//       border: 1px solid green;
-       //   border: 1px solid red;
-       //  overflow: hidden; /* will contain if #first is longer than #second */
-     }
-
-     #pagetitle {
-       max-width: 460px;
-       margin-right: 20px;
-       float: left;
-       overflow: hidden; /* if you don't want #second to wrap below #first */
-       //    border: 1px solid green;
-     }
-
-     #options {
-       float: left;
-       width: 800px;
-       margin: 10px;
-       overflow: hidden; /* if you don't want #second to wrap below #first */
-     }
-
-     #word {
-       width: 50%;
-     }
-
-     #first {
-       margin-right: 20px;
-       float: left;
-       overflow: hidden; /* if you don't want #second to wrap below #first */
-       //    border: 1px solid green;
-     }
-     #tabs {
-       margin-right: 20px;
-       overflow: hidden; /* if you don't want #second to wrap below #first */
-     }
-
-     .tabs-min {
-       background: transparent;
-       border: none;
-     }
-
-     .tabs-min .ui-widget-header {
-       background: transparent;
-       border: none;
-       border-bottom: 1px solid #c0c0c0;
-       -moz-border-radius: 0px;
-       -webkit-border-radius: 0px;
-       border-radius: 0px;
-     }
-
-     .tabs-min .ui-tabs-nav .ui-state-default {
-       background: transparent;
-       border: none;
-     }
-
-     .tabs-min .ui-tabs-nav .ui-state-active {
-       background: transparent url(derekovecs/img/uiTabsArrow.png) no-repeat bottom center;
-       border: none;
-     }
-
-     .tabs-min .ui-tabs-nav .ui-state-default a {
-       color: #c0c0c0;
-     }
-
-     .tabs-min .ui-tabs-nav .ui-state-active a {
-       color: rgb(246,168,0);
-     }
-
-     #embed {
-       max-width: 802px;
-       border: 1px solid #333;
-     }
-
-     #second {
-       min-width: 700px;
-       //       border: 1px solid #333;
-       overflow: hidden; /* if you don't want #second to wrap below #first */
-     }
-     #som2 svg {
-       border: 1px solid #333;
-     }
-
-     #cost {
-       font-size: 8pt;
-       color: #222222;
-       margin-top: 4px;
-       margin-bottom: 12px;
-     }
-
-     #sominfo1, #sominfo {
-       font-size: 8pt;
-       color: #222222;
-       margin-top: 0px;
-     }
-
-     #somcolor1, #somcolor2, #somcolor3 {
-       display: inline-block;
-       height: 10px;
-       width: 10px;
-     }
-
-     #third {
-       border: 1px solid #333;
-     }
-
-     th {
-       color: rgb(246,168,0);
-       font-family: "Univers LT Std 47 Cn Lt", "Univers LT Std 67 Cn Lt", "Roboto Condensed", "Univers LT Std 67 Cn Bold", "UniversLTStd-BoldCn", "Times", 'League Gothic', Impact, sans-serif;
-     }
-
-     p.citation {
-       font-size: 8pt;
-       color: #999999;
-     }
-    </style>
     <script src="/derekovecs/js/derekovcs.js"></script>
     <script>