diff --git a/static/css/style.css b/static/css/style.css
index 86e0c17..554a040 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -207,7 +207,6 @@ img.artwork-mockuppage{
 }
 .soon-nofix {
 	margin: 80px 80px;
-	width: 100%;
 }
 @media screen and (min-width: 1920px) {
 	.soon-nofix + #footer {
@@ -265,7 +264,7 @@ body i {
 div#header{
 	width: 100%;
 	background-color: #FFFFFF;
-	height: 134px;
+	height: 120px;
 	border-bottom: 3px solid #000;
 	display: flex;
 	width: 100%;
@@ -282,13 +281,13 @@ div#header-top{
 }
 div#animatedlogo{
 	display: flex;
-	width: 8vw; 
-	min-width: 130px;
+	width: 8.5vw; 
+	/*min-width: 130px;*/
 }
 div#animatedlogo img{
-	width: 8vw; /*auto*/
-	min-width: 130px;
-	max-width: 130px;
+	width: 8.5vw; /*auto*/
+	min-width: 58px;
+	max-width: 117px;
 	justify-self: center;
 }
 div#header-title{
@@ -331,7 +330,7 @@ div#header-top div#header-keyword-search:after {
 }
 div#header-top, div#navigation{
 	width: 100%;
-	height: 67px;
+	height: 60px;
 	padding-right: 8vw;
 }
 div#navigation{
@@ -454,14 +453,26 @@ div#footer-title-br p, div#footer-title-others p, div#footer-title-contact p, di
   	letter-spacing: 1.5px;
   	color: var(--brown-grey);
 }
-div#footer-img-br img{
-	width: 85px;
+a#footer-img-br img {
+	width: 75px;
 	height: auto;
-	padding-top: 5px;
-	margin-left: -8px;
+	margin-left: auto;
+	margin-right: auto;
+	padding-top: 15px;
+	display: block;
+/*
+	margin-left: 22px;*/
+}
+ a#footer-img-wiki img {
+	width: 75px;
+	height: auto;
+	margin-left: auto;
+	margin-right: auto;
+	display: block;
 }
 /* Banner Repeater Logo*/
-div#footer-img-br figcaption {
+a#footer-img-br, a#footer-img-br figcaption , a#footer-img-br figcaption:hover, a#footer-img-br figcaption:visited,
+a#footer-img-wiki, a#footer-img-wiki figcaption, a#footer-img-wiki figcaption:hover, a#footer-img-wiki figcaption:visited {
 	font-family: 'Roboto', sans-serif;
 	font-size: 16px;
 	margin: 0;
@@ -470,7 +481,13 @@ div#footer-img-br figcaption {
   	font-style: normal;
   	font-weight: normal;
   	white-space: nowrap;
-  	margin-top: -8px;	
+  	/*margin-top: -6px;	*/
+	text-decoration: none;
+	color: #FFFFFF;
+	cursor: pointer;
+}
+a#footer-img-wiki figcaption, a#footer-img-wiki figcaption:hover, a#footer-img-wiki figcaption:visited {
+  	margin-top: 6px;
 }
 div#footer-img-others{
 	display: flex;
@@ -478,14 +495,21 @@ div#footer-img-others{
 	flex-wrap: nowrap;
 	padding-top: 26px;
 }
-div#footer-img-lottery{
-	padding-left: 60px;
+a#footer-img-lottery, a#footer-img-lottery:hover, a#footer-img-lottery:visited, 
+a#footer-img-wiki, a#footer-img-wiki:hover, a#footer-img-wiki:visited
+a#footer-img-br:, a#footer-img-br:hover, a#footer-img-br:visited {
+	text-decoration: none;
+	color: #FFFFFF;
+	cursor: pointer;
 }
-div#footer-img-lottery img{
+a#footer-img-lottery img{
 	width: 124px;
 	height: auto;
 }
-div#footer-img-wiki img{
+a#footer-img-wiki{
+	padding-left: 60px;	
+}
+a#footer-img-wiki img{
 	width: 56px;
 	height: auto;
 }
@@ -701,7 +725,7 @@ a.paginate_button.next:after {
 }
 
 /************ TEXT STYLES************/
-.title, div.artwork-relatedworks-tile {
+.title, .artwork-relatedworks-tile {
   /* width: 200px;
   height: 26px;
   font-size: 18px;
@@ -858,6 +882,9 @@ div#home-top-div{
 	height: auto;
 	position: relative;
 	z-index: 99;
+	border: 2px solid #bdbdbd;
+	box-shadow: 1px 1px 5px 3px #00000024;
+	border-radius: 6px;
 }
 #home-top-div #wrapper-top-buttons{
 	display: flex;
@@ -1086,6 +1113,12 @@ div#home-recent-grid, div#browsethearchive-grid, div#selfpublishedindex-grid, di
   /*text-align: center;*/
   grid-gap: 1rem;
 }
+
+.browsethearchive-items-bottom a.title:hover, .browsethearchive-items-bottom a.title:hover ~ .date ,
+.home-recent-items-bottom a.title:hover, .home-recent-items-bottom a.title:hover ~ .date  {
+	color: var(--blue-blue);
+}
+
 div.home-show-wrapper{
 	width: 100%;
 	margin: 0px auto 60px auto;
@@ -1372,7 +1405,7 @@ div.browsebycategory-categories:hover {
 
 
 .artwork-title {
-	margin: 20px 8vw 30px 8vw;
+	margin: 30px 8vw 0px 8vw;
 /*	font-size: 25px; */	
 	font-family: 'Roboto Condensed Bold', sans-serif;
 	font-weight: bold;
@@ -1481,7 +1514,7 @@ div.browsebycategory-categories:hover {
 	color: var(--blue-blue);
 	cursor: pointer;
 }
-.artwork-about, .artwork-copieswrapper, .artwork-relatedwrapper  {
+.artwork-about, .artwork-copieswrapper, .artwork-relatedwrapper, .artwork-lists  {
 	width: 100%;
 	display: grid;
 	row-gap: 0rem;
@@ -1492,13 +1525,17 @@ div.browsebycategory-categories:hover {
 	 grid-template-areas: 
     "title title item1 item1 item1 item2 item2 item2 item3 item3 item3 item4 item4 item4 item5 item5 item5";
 }*/
-.artwork-about{
+
+.artwork-about, .artwork-lists{
     padding: 30px 8vw 60px 8vw;
 }
+.artwork-lists  {
+	border-top: solid 3px var(--black);	
+}
 .artwork-copieswrapper {
 	border-top: solid 3px var(--black);
 	border-bottom:  solid 3px var(--black);
-	padding: 30px 8vw 30px 8vw;
+	padding: 40px 8vw 30px 8vw;
 }
 .artwork-relatedwrapper {
 	padding: 30px 8vw 30px 8vw;
@@ -1530,26 +1567,30 @@ div.browsebycategory-categories:hover {
 	grid-row-start: 2;
 	grid-row-end: 2;
 }
-.artwork-rightcolumn-top {
+.artwork-rightcolumn-top{
+	border-bottom: 3px solid #000;
+}
+.artwork-rightcolumn-top, .artwork-rightcolumn-bottom {
 	margin: 0 !important;
 	display: grid;
 }
 
 .artwork-rightcolumn-top-contributors {
-	grid-column-start: 9;
-	grid-column-end: 13;
+	grid-column-start: 1;
+	grid-column-end: 10;
 	grid-row-start: 1;
 	grid-row-end: 1;
 }
 
 .artwork-rightcolumn-top-date {
-	grid-column-start: 14;
+	grid-column-start: 10;
 	grid-column-end: 18;
 	grid-row-start: 1;
 	grid-row-end: 1;
+
 }
-.artwork-rightcolumn-top-publishers, .artwork-rightcolumn-top-publishers {
-	grid-column-start: 15;
+.artwork-rightcolumn-top-publishers {
+	grid-column-start: 10;
 	grid-column-end: 18;
 	grid-row-start: 2;
 	grid-row-end: 2;
@@ -1569,7 +1610,7 @@ div.browsebycategory-categories:hover {
 	border-top: 3px solid black;		
 }
 
-.text-description .mw-parser-output, .text-exhibition .mw-parser-output{
+.text-description .mw-parser-output, .artwork-rightcolumn-exhibition .mw-parser-output, .text-exhibition .mw-parser-output{
 	display: initial;
 }
 .artwork-rightcolumn-exhibition  {
@@ -1586,27 +1627,23 @@ div.browsebycategory-categories:hover {
 	grid-row-end: 4;
 	border-top: 3px solid black;	
 }
-.artwork-rightcolumn-top-publishers {
-	grid-column-start: 15;
-	grid-column-end: 18;
-	grid-row-start: 2;
-	grid-row-end: 2;
-}
 .artwork-rightcolumn-exhibition, .artwork-rightcolumn-description  {
     display: grid;
     row-gap: 0rem;
-    column-gap: 1rem;
+    /*column-gap: 1rem;*/
     grid-template-columns: repeat(9, 1fr);
+    grid-template-rows: min-content auto;
 }
 .artwork-rightcolumn-exhibition p, .artwork-rightcolumn-description p {
 	grid-column-start: 1;
 	grid-column-end: 9;
 	grid-row-start: 1;
 	grid-row-end: 1;
+	margin: 1em 0 0.5em;
 }
 .text-description {
 	grid-column-start: 1;
-	grid-column-end: 7;
+	grid-column-end: 8;
 	grid-row-start: 2;
 	grid-row-end: 2;
 }
@@ -1625,9 +1662,11 @@ div.browsebycategory-categories:hover {
 	grid-column-end: 11;
 	grid-row-start: 2;
 	grid-row-end: 2;
+	margin-left: 1em;
 }
 .text-date-author .label-item:nth-of-type(1) {
- margin-top: 0px;
+/*  margin-top: 0px;*/
+  margin: 0 0;
 }
 .artwork-lists {
 	padding: 30px 8vw 30px 8vw;
@@ -1643,7 +1682,7 @@ div.browsebycategory-categories:hover {
 .artwork-copiesincollection-title-div {
 	text-align: center;
 }
-.artwork-relatedwrapper .Heading_C , .artwork-copieswrapper .Heading_C {
+.artwork-lists .Heading_C , .artwork-relatedwrapper .Heading_C , .artwork-copieswrapper .Heading_C {
 	grid-column-start: 1;
 	grid-column-end: 3;
   /*  writing-mode: sideways-lr;
@@ -1744,9 +1783,49 @@ div.browsebycategory-categories:hover {
   grid-column-end: 18;
   margin: 0 !important;
 }
-.artwork-relatedworks-imgs{
+.artwork-relatedworks-tile:hover, .artwork-relatedworks-tile:hover ~ .artwork-relatedworks-date  {
+	color: var(--blue-blue);
+}
+img.artwork-relatedworks-imgs, .artwork-lists-img img{
 	width: 100%;
 	max-width: 200px;
+	display: inline;
+}
+.artwork-relatedworks-img-div /*TEST*/ {
+	height: 80%;
+	display: flex;
+	align-items: center;
+}
+
+.artwork-lists-img {}
+
+
+.tns-controls { text-align: center; margin-bottom: 10px; }
+.tns-controls [aria-controls] {
+  display: none;
+}
+
+.tns-outer {
+	display: flex;
+	flex-direction: column-reverse;
+}
+
+.tns-nav {
+  text-align: center;
+  margin: 10px 0;
+}
+.tns-nav > [aria-controls] {
+  width: 9px;
+  height: 9px;
+  padding: 0;
+  margin: 0 5px;
+  border-radius: 50%;
+  background: #ddd;
+  border: 0;
+}
+
+#tns1-iw {
+    margin: 0px -10px 0px 0px !important;
 }
 
 /*************************************/
diff --git a/templates/artistsindex.html b/templates/artistsindex.html
index 6e1b1f3..1e1ba19 100644
--- a/templates/artistsindex.html
+++ b/templates/artistsindex.html
@@ -1,7 +1,7 @@
 {% extends "layout.html" %}
 {% block content %}
 
-<div class="pagetitle" id="artistsindex-title">INDEX OF ARTIST</div>
+<div class="pagetitle" id="artistsindex-title">INDEX OF CREATORS / CONTRIBUTORS</div>
 
 <table id="artistsindex-table">
 <thead> 
diff --git a/templates/artwork.html b/templates/artwork.html
index 6e60464..085a0a9 100644
--- a/templates/artwork.html
+++ b/templates/artwork.html
@@ -27,10 +27,10 @@
 
 		<!-- NAVIGATION HERE? -->
 		<div class="artwork-nav">
-			<div class="artwork-nav-label active">ABOUT THIS WORK</div>
+			<div class="artwork-nav-label artwork-nav-label-about active">ABOUT THIS WORK</div>
 			<!-- <div class="artwork-nav-label">RELATIONSHIPS</div> -->
 			<!-- <div class="artwork-nav-label">LISTS</div> -->
-			<div class="artwork-nav-label"><a class="det-record" target="_blank" href="https://daap.bannerrepeater.org/wiki/Item:{{ artwork_id }}">DETAILED RECORD</a></div>
+			<div class="artwork-nav-label artwork-nav-label-record"><a class="det-record" target="_blank" href="https://daap.bannerrepeater.org/wiki/Item:{{ artwork_id }}">DETAILED RECORD</a></div>
 		</div>
 	</div>
 
@@ -41,20 +41,25 @@
 		<div class="artwork-leftcolumn">
 
 				<!-- ARTWORK IMAGES -->
-				<div class="artwork-about-img">
+				<!-- removed artwork-about-img + on img artwork-about-imgs -->
+				<div class="my-slider">
 					{% if artworkimages['results']['bindings']==[] %}
-						<img class="artwork-about-imgs" src="{{ url_for('static', filename='/imgs/Icons/placeholder_no-image2.png') }}">
+						<img class="item" src="{{ url_for('static', filename='/imgs/Icons/placeholder_no-image2.png') }}">
 					{% else %}
 						{% for x in artworkimages['results']['bindings'] %}
 							
 								{% if "image" in x %}
-								<img class="artwork-about-imgs" src='{{ x["image"]["value"] | replace("wiki/File:","wiki/Special:Redirect/file/") }}'>
+								<img class="item" src='{{ x["image"]["value"] | replace("wiki/File:","wiki/Special:Redirect/file/") }}'>
 								{% endif %}
 							
 						{% endfor %}
 					{% endif %}
 				</div>
 
+
+
+
+
 <!-- other stuff like downloads, absent for now -->
 				<div class="artwork-about-under-img">
 
@@ -206,11 +211,11 @@
 								{% endif %}
 							{% endfor %}
 							{% endif %}
-					</div>
+					<!-- </div> -->
 <!-- end of date -->
 
 <!-- publishers-->
-				<div class="artwork-rightcolumn-top-publishers">
+				<!-- <div class="artwork-rightcolumn-top-publishers"> -->
 						<p class="label-item">PUBLISHERS</p>
 						<!-- loop through publishers -->
 						{% if artworkpublisher['results']['bindings']==[] %}
@@ -239,7 +244,7 @@
 <!-- end of about right top -->
 
 <!-- start of about right column bottom -->
-			<div class="artwork-rightcolumn-bottom">
+			<div class="">
 
 <!-- description -->
 
@@ -248,16 +253,16 @@
 				{% else %}
 				<!-- For loop -->
 				{% for x in artworkdescriptiondata['results']['bindings'] %}
-					<div>
+				<div class="artwork-rightcolumn-bottom">
 					<p class="label-item">DESCRIPTION</p>
 					<!-- left part with the description text already coming in a div from wiki-->
-					<div>
+					<div  class="text-description">
 						{{ x["text"] | safe }}
 					</div>
 
 
 					<!-- right ride with author etc LATER-->
-					<div>
+					<div class="text-date-author">
 						<p class="label-item">AUTHOR</p>
 						{% if "authordescriptionPageLabel" in x %}
 						<p>{{ x['authordescriptionPageLabel']['value'] }}</p>
@@ -289,14 +294,14 @@
 				{% else %}
 
 				{% for x in artworkexhibitiondata['results']['bindings'] %}
-				<div>
+				<div class="artwork-rightcolumn-exhibition">
 					<p class="label-item">EXHIBITION AND DISTRIBUTION HISTORY</p>
 
-					<div>
+					<div class="text-exhibition">
 						{{ x['text'] | safe }}
 					</div>
 					<!-- right ride with author etc LATER-->
-					<div>
+					<div class="text-date-author">
 						<p class="label-item">AUTHOR</p>
 					<!-- if there is an author name then add here otherwise info non available -->
 						{% if "authorexhibitionHisPageLabel" in x %}
@@ -344,7 +349,7 @@
 
 <!-- LISTS DESIGN IF NO LISTS TO BE CLARIFIED-->
 	<div class="artwork-lists">
-		<div class="artwork-nav-label">LISTS</div>
+		<div class="Heading_C">LISTS</div>
 
 		{% if artworklists['results']['bindings']==[] %}
 			<p>The artwork isn't featured in any lists yet</p>
@@ -441,4 +446,27 @@
 <!-- End related works -->
 
 </div>
+
+<script src="https://cdnjs.cloudflare.com/ajax/libs/tiny-slider/2.9.2/min/tiny-slider.js"></script>
+
+<script type="text/javascript">
+  var slider = tns({
+    container: '.my-slider',
+    items: 1,
+    responsive: {
+      640: {
+        edgePadding: 20,
+        gutter: 20,
+        items: 2
+      },
+      700: {
+        gutter: 30
+      },
+      900: {
+        items: 1
+      }
+    }
+  });
+
+</script>
 {% endblock content %}
\ No newline at end of file
diff --git a/templates/layout.html b/templates/layout.html
index e9a56dc..c1d2fcd 100644
--- a/templates/layout.html
+++ b/templates/layout.html
@@ -6,8 +6,7 @@
 	<title>D.A.A.P</title>
 	<link rel="stylesheet" href="{{ url_for('static', filename='/css/style.css') }}">
 	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.3/jquery.min.js"></script>
-	
-
+	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/tiny-slider/2.9.3/tiny-slider.css">
 </head>
 <body>
 
@@ -53,17 +52,21 @@
 	<div class="footer-left">
 		<div id="footer-credit">
 			<div id="footer-title-br"><p>A project by</p></div>
-			<div id="footer-img-br">
-
+			<a id="footer-img-br" target="_blank" href="https://www.bannerrepeater.org/">
 				<img src="{{ url_for('static', filename='/imgs/Logos/Banner-Repeater-logo.png') }}">
 				<figcaption>Banner Repeater</figcaption>
-			</div>
+			</a>
 		</div>
 		<div id="footer-funds">
 			<div id="footer-title-others"><p>With support from</p></div>
 			<div id="footer-img-others">
-				<div id="footer-img-wiki"><img src="{{ url_for('static', filename='/imgs/Logos/wikimedia_logo.png') }}"></div>
-				<div id="footer-img-lottery"><img src="{{ url_for('static', filename='/imgs/Logos/Lottery-white on black.png') }}"></div>
+				<a id="footer-img-lottery" target="_blank" href="https://www.artscouncil.org.uk/funding-finder/grants-arts">
+					<img src="{{ url_for('static', filename='/imgs/Logos/Lottery-white on black.png') }}">
+				</a>
+				<a id="footer-img-wiki" target="_blank" href="https://wikimedia.org.uk/">
+					<img src="{{ url_for('static', filename='/imgs/Logos/wikimedia_logo.png') }}">
+					<figcaption>Wikimedia UK</figcaption>
+				</a>
 			</div>
 		</div>
 	</div>