diff --git a/artwork2.html b/artwork2.html
index a40d1f8..f58f03f 100644
--- a/artwork2.html
+++ b/artwork2.html
@@ -12,20 +12,169 @@
 		position:absolute;
 		width: 17vw;
 		height: 17vw;
+		opacity: 1;
+		transition: opacity 4s;
 	}
 
-	.visible #viewbox{
-		top: 0 !important;
-		left: 0 !important;
-		width: 100% !important;
-		height: 100% !important;
+	.visible #wrapper{
+		width:100%;
+		height:100%;
+		left:0;
+		top:0;
+	}
+
+	#wrapper{
+		position: absolute;
+		left:5vw;
+		top: 5vw;
+		width: 90vw;
+		height: calc(100% - 10vw);
+	}
+
+	#viewbox.gone {
+		opacity:0;
+	}
+
+	#ad{
+		position: absolute;
+		bottom:10em;
+		left: 2em;
+		/*left:20%;*/
+		/*top: 50%;
+		width:100%;*/
+		/*text-align: right;*/
+		transform: rotate(90deg);
+		color:#ccc;
+		font-family:sans-serif;
+		width: 21em;
+		font-size:80%;
+	}
+	#ad h1{
+		color: #ff7474;
+		/*text-align: center;*/
+	}
+
+	.visible #ad{
+		display:none;
+	}
+
+	#visibleBlock{
+		background: white;
+		opacity: 0;
+		transition: opacity 5s;
+		position:absolute;
+		left:0;
+		top:0;
+		width:100%;
+		height:100%;
+		z-index:9999;
+	}
+	.visible #visibleBlock{
+		opacity: 1;
 	}
 </style>
 <body class=''>
+	<div id='wrapper'>
 	<div id='viewbox'>
 	</div>
-
+	</div>
+	<div id='ad'>
+	<h1>preview mode</h1>
+	<p>This is a limited edition. To purchase the full version, with 24/7 access to Joseph Huot's work, contact Ruben van de Ven.</p>
+	<!-- <p>To be able to access Joseph Huot's work 24/7, purchase </p> -->
+	<!-- <p id='timer'></p> -->
+	</div>
+	<div id='visibleBlock'>
+	</div>
 <script type="text/javascript">
+
+var percentageDisabled = 30; // disabled 30/100 -> ±18 minuten  per uur
+var minInterval = 10 * 60; // seconds: 10 minutes
+var maxInterval = 2 * 60 * 60; // seconds: 2 hours
+
+var viewboxEl = document.getElementById("viewbox");
+var wrapperEl = document.getElementById("wrapper");
+var timerEl = document.getElementById("timer");
+
+let box = viewboxEl.getBoundingClientRect();
+var wrapBox = wrapperEl.getBoundingClientRect();
+
+var posX = Math.random() * (wrapBox['width'] - box['width']);
+var posY = Math.random() * (wrapBox['height'] - box['height']);
+
+function fade() {
+	let box = viewboxEl.getBoundingClientRect();
+	let wrapBox = wrapperEl.getBoundingClientRect();
+
+	posX = Math.random() * (wrapBox['width'] - box['width']);
+	posY = Math.random() * (wrapBox['height'] - box['height']);
+
+	viewboxEl.classList.add('gone');
+	setTimeout(fadeIn, 5000);
+	setTimeout(fade, 20000);
+}
+
+function fadeIn(){
+	viewboxEl.style.left = posX +"px";
+	viewboxEl.style.top = posY +"px";
+	viewboxEl.classList.remove('gone');
+}
+
+var toggleEnabled = function() {
+	let isHidden = !document.body.classList.contains('visible');
+
+	var nextIntervalPercentage = isHidden ? 100 - percentageDisabled : percentageDisabled;
+	
+	// choose a random interval between min & max, independent of whether it's hidden.
+	let currentInterval = minInterval + Math.random() * (maxInterval - minInterval);
+	// now determine the used interval by taking the percentage
+	let useInterval = currentInterval * (nextIntervalPercentage / 100);
+	// random spreads evenly, so taking percentage will give us (over time) an even spread of the enabled/disabled according to percentageDisabled
+	// useInterval /= 300;
+	setTimeout(toggleEnabled, useInterval * 1000);
+	console.log(useInterval);
+
+	if(isHidden) {
+		// sliderEl.style.transitionDuration = Math.floor(useInterval * 0.5) + "s";
+		// // sliderEl.style.transitionDelay = Math.floor(useInterval * 0.5) + "s";
+		document.body.classList.add('visible');
+	} else {
+		// sliderEl.style.transitionDuration = Math.floor(useInterval * 0.5) + "s";
+		// // sliderEl.style.transitionDelay = Math.floor(useInterval * 0.5) + "s";
+		document.body.classList.remove('visible');
+		startTimer(useInterval);
+	}
+}
+
+// countdown timer
+// var interval = null;
+// function startTimer(duration) {
+//     var timer = duration, minutes, seconds;
+//     if(interval != null) {
+//     	clearInterval(interval);
+//     }
+//     interval = setInterval(function () {
+//         minutes = parseInt(timer / 60, 10)
+//         seconds = parseInt(timer % 60, 10);
+
+//         minutes = minutes < 10 ? "0" + minutes : minutes;
+//         seconds = seconds < 10 ? "0" + seconds : seconds;
+
+//         timerEl.textContent = minutes + ":" + seconds;
+
+//         if (--timer < 0) {
+//             timer = duration;
+//         }
+//     }, 1000);
+// }
+
+
+window.addEventListener('load', function(){
+	fade();
+	toggleEnabled();
+});
+
+/*
 // speed per sec
 var speedX = 10;
 var speedY = 10;
@@ -33,8 +182,6 @@ var speedY = 10;
 var curX = 100;
 var curY = 0;
 
-var viewboxEl = document.getElementById("viewbox");
-
 var lastTick = new Date();
 
 
@@ -80,7 +227,7 @@ function animate(){
 
 	window.addEventListener('load', function(){
 		animate();
-	});
+	});*/
 </script>
 </body>
 </html>
