the weekends work, will ref the issues later

__init__.py

-from flask import Flask, render_template, redirect
+from flask import Flask, render_template, redirect, url_for
 import csv
 import os
 import glob
@@ -14,6 +14,7 @@ pattern4 = r'(peut\-être)'
 replace0 = r'<span class="uncertain_match">\1</span>'
 replace1 = r'<span class="uncertain_match"> \1</span>'
 uncertainlist = glob.glob('static/word_patterns/*.csv')
+
 full_dict = {}
 full_counter = 0
 
@@ -29,8 +30,8 @@ for file in uncertainlist:
         row[11] = re.sub(pattern4, replace0, row[11])
         row[11] = re.sub(pattern0, replace0, row[11])
         row[11] = re.sub(pattern1, replace0, row[11])
-        row[11] = re.sub(pattern2, replace0, row[11])
-        row[11] = re.sub(pattern3, replace1, row[11])
+        # row[11] = re.sub(pattern2, replace0, row[11])
+        # row[11] = re.sub(pattern3, replace1, row[11])
         currentlist.append(row)
         full_counter += 1
     full_dict[filename] = currentlist
@@ -54,6 +55,14 @@ def home():
 
     return render_template("index.html", full_dict=full_dict, uncertainlist=uncertainlist, csv_file=csv_file, file=file, full_counter=full_counter, amounts=amounts)
 
+@app.route('/collection')
+def collection():
+    return render_template("collection.html", full_counter=full_counter, uncertainlist=uncertainlist, file=file, amounts=amounts)
+
+@app.route('/collection/')
+def redirectCollection():
+    return redirect(url_for('collection'))
+
 @app.route('/collection/<uncertain>')
 def word_pattern(uncertain):
     uncertainlist = glob.glob('static/word_patterns/*.csv')
@@ -74,13 +83,21 @@ def word_pattern(uncertain):
 def about():
     return render_template("about.html", full_counter=full_counter, uncertainlist=uncertainlist, file=file, amounts=amounts)
 
+@app.route('/about/')
+def redirectAbou():
+    return redirect(url_for('about'))
+
 @app.route("/news")
 def news():
     return render_template("news.html", full_dict=full_dict, full_counter=full_counter, amounts=amounts)
 
+@app.route('/news/')
+def redirectNews():
+    return redirect(url_for('news'))
+
 @app.errorhandler(404)
 def not_found(error):
     return render_template('error.html'), 404
 
 if __name__ == '__main__':
-    app.run(host='0.0.0.0', port='5001')
+    app.run(host='0.0.0.0', port='5001', debug=True)

static/build/main.js

@@ -8,6 +8,8 @@ var typed = new Typed('#main-title', {
   loop: true
 });
 
+// expand filter area
+
 $(".passepartout").hover(function(){
     var itemNo = $(this).attr('class').split(' ')[1];
     var itemTitle = $(this).attr('title')
@@ -32,6 +34,8 @@ $("span.description").hover(function(){
     $(".passepartout." + itemNo).css("filter", "greyscale(1) !important");
 });
 
+// Date & Time widgets
+
 updateTime();
 var update = setInterval(updateTime, 1000);
 function updateTime(){
@@ -46,6 +50,8 @@ function setDate(){
   document.getElementById('date').innerHTML=date;
 }
 
+// chartJS in footer
+
 var ctx = document.getElementById('myChart').getContext('2d');
 var chart = new Chart(ctx, {
     type: 'line',
@@ -73,12 +79,36 @@ var chart = new Chart(ctx, {
       }
 });
 
+// smooth scrolling on index
+
 document.querySelectorAll('a[href^="#"]').forEach(anchor => {
     anchor.addEventListener('click', function (e) {
         e.preventDefault();
-
         document.querySelector(this.getAttribute('href')).scrollIntoView({
             behavior: 'smooth'
         });
     });
 });
+
+// filter by language
+
+$(".toggle-FR").on("click", function(){
+      $(this).toggleClass("striked");
+      $(".language-Français").toggle();
+});
+
+$(".toggle-NL").on("click", function(){
+      $(this).toggleClass("striked");
+      $(".language-Nederlands").toggle();
+});
+
+$(".toggle-EN").on("click", function(){
+      $(this).toggleClass("striked");
+      $(".language-English").toggle();
+});
+
+$(document).ready(function(){
+  $('.expand-filters').click(function(){
+    $(".main-area").toggleClass("ANYTHING");
+  });
+});

static/build/screen.css

@@ -111,14 +111,36 @@ ul {
 }
 
 div.main-nav {
-  min-height: 8vh;
-  height: 8vh;
+  margin-top: 0.55em;
+  margin-bottom: 0.55em;
+  min-height: 9vh;
+  height: 9vh;
+}
+.lt-ie9 div.main-nav {
   margin-top: 2.2em;
+  margin-bottom: 1.1em;
+}
+@media screen and (min-width: 1364px) {
+  div.main-nav {
+    margin-top: 2.2em;
+    margin-bottom: 1.1em;
+  }
 }
 div.main-nav h1 {
+  margin-top: 0.275em;
+  line-height: 0.9em !important;
+  font-size: 1.5em;
+}
+.lt-ie9 div.main-nav h1 {
   font-size: 2.5em;
 }
+@media screen and (min-width: 1364px) {
+  div.main-nav h1 {
+    font-size: 2.5em;
+  }
+}
 div.main-nav h1 span.title-uncertain {
+  line-height: 0.9em !important;
   color: #e6e619;
 }
 div.main-nav .row {
@@ -132,15 +154,37 @@ div.top-left-context ul, div.top-right-context ul {
   list-style-type: none;
 }
 div.top-left-context ul li, div.top-right-context ul li {
-  font-size: 1.6em !important;
+  font-size: 1em !important;
+  margin: 0 !important;
+  line-height: 1em;
   margin: 0 !important;
   margin-bottom: 0.4em;
 }
+.lt-ie9 div.top-left-context ul li, .lt-ie9 div.top-right-context ul li {
+  font-size: 1.6em !important;
+}
+@media screen and (min-width: 1364px) {
+  div.top-left-context ul li, div.top-right-context ul li {
+    font-size: 1.6em !important;
+  }
+}
 
 div.top-right-context {
   text-align: right;
 }
 
+div.top-left-context {
+  display: none;
+}
+.lt-ie9 div.top-left-context {
+  display: block;
+}
+@media screen and (min-width: 600px) {
+  div.top-left-context {
+    display: block;
+  }
+}
+
 span.uncertain_match {
   color: #e6e619;
 }
@@ -159,9 +203,43 @@ div.hp-half::-webkit-scrollbar-thumb:vertical {
   background-color: black;
 }
 
-div.white-row {
+div.whiterow, div.white-row {
   background-color: white;
   height: 75vh;
+  overflow-y: scroll;
+  webkit-scrollbar-width: thin;
+  scrollbar-width: thin;
+  scrollbar-color: black #e6e619;
+}
+div.whiterow ::-webkit-scrollbar, div.white-row ::-webkit-scrollbar {
+  width: 6px;
+  height: 6px;
+}
+div.whiterow ::-webkit-scrollbar-track-piece, div.white-row ::-webkit-scrollbar-track-piece {
+  background-color: #e6e619;
+}
+div.whiterow ::-webkit-scrollbar-thumb:vertical, div.white-row ::-webkit-scrollbar-thumb:vertical {
+  height: 30px;
+  background-color: black;
+}
+
+.collection-page {
+  color: black;
+}
+.collection-page b {
+  color: black !important;
+  font-family: AntiqueNobleRegular;
+}
+.collection-page a {
+  color: grey;
+}
+.collection-page .graph {
+  margin-top: 2.2em;