--- a/web/static/res/css/style_1024.css	Mon Dec 10 19:48:28 2012 +0100
+++ b/web/static/res/css/style_1024.css	Mon Dec 10 20:55:18 2012 +0100
@@ -229,6 +229,9 @@
 	text-align: center;
 	margin: 109px 0;
 }
+.big_txt:first-child {
+	margin-top: 62px;
+}	
 .big_link {
 	font-family: "Arial Black", sans-serif;  
 	font-size: 21px;
@@ -236,6 +239,9 @@
 	padding: 14px 0 16px 0;
 	margin: 0;
 }
+.pointer {
+	cursor: pointer;
+}
 /*----------------------------------------------*/
 /*	site takes all the space of the browser	*/
 /*----------------------------------------------*/
@@ -269,10 +275,11 @@
 	box-sizing: border-box; 
 } 
 #content.full_screen {
-		width: 100%;
+	width: 100%;
+	height: 100%;
 }
 /*----------------------------------------------*/
-/*	the elements takes the full height of "content_top"	*/
+/*	elements takes the full height of "content_top"	*/
 /*----------------------------------------------*/
 .container_vcentering {
   text-align:center; 
@@ -284,6 +291,21 @@
   text-align: center;
 }
 /*----------------------------------------------*/
+/*	elements is positioned in the middle of the window	*/
+/*----------------------------------------------*/
+.strut {
+    display:inline-block;
+    vertical-align:middle;
+    height:100%;
+}
+.fullScreen_vcentering {
+    margin: auto;
+    display:inline-block;
+    vertical-align:middle;
+    width: 100%;
+    padding: 0;
+}
+/*----------------------------------------------*/
 /*	4- Main	HP		*/
 /*----------------------------------------------*/
 section a,

--- a/web/static/res/js/incmosaic.js	Mon Dec 10 19:48:28 2012 +0100
+++ b/web/static/res/js/incmosaic.js	Mon Dec 10 20:55:18 2012 +0100
@@ -55,6 +55,15 @@
 		// Register effects
 		this.registerEffects();
 
+		// Set a new effect transition between 2 images
+		this.SetNewEffect();
+										
+		// Main loop
+		this.loopCallback();
+	};
+
+	this.SetNewEffect = function()
+	{
 		// Set a random pair images
 		this.setRandomPairImages();
 
@@ -62,11 +71,8 @@
 		this.setRandomSquareEffect();
 
 		// Time
-		this.startTime = new Date().getTime();
-										
-		// Main loop
-		this.loopCallback();
-	};
+		this.startTime = new Date().getTime();		
+	}
 
 	this.init = function()
 	{
@@ -79,7 +85,6 @@
 
 	this.registerPreNewCanvasSize = function(newCanvasWidth, newCanvasHeight)
 	{
-		//incMosaic.imageData = incMosaic.ctx.getImageData(0, 0, incMosaic.srcSquareWidth*incMosaic.squareCountX, incMosaic.srcSquareHeight*incMosaic.squareCountY);
 	};
 
 	this.registerPostNewCanvasSize = function(newCanvasWidth, newCanvasHeight)
@@ -87,10 +92,6 @@
 		// Recalculate the size of the mosaic squares
 		incMosaic.squareWidth = Math.floor(newCanvasWidth / incMosaic.squareCountX);
 		incMosaic.squareHeight = Math.floor(newCanvasHeight / incMosaic.squareCountY);
-
-		//incMosaic.ctx.fillStyle = "#000000";
-		//incMosaic.ctx.fillRect(0, 0, incMosaic.srcSquareWidth*incMosaic.squareCountX, incMosaic.srcSquareHeight*incMosaic.squareCountY);	
-		//incMosaic.ctx.putImageData(incMosaic.imageData, 0, 0);
 	};
 
 	this.setRandomPairImages = function()
@@ -98,12 +99,15 @@
 		this.imagesLoaded = 0;
 		var randInd = this.randomInt(0, this.pairUrl.length);
 		var pairUrl = this.pairUrl[randInd];
+
+		this.pairImages.length = 0;
 		this.pairImages.push(this.getImageFromUrl(pairUrl.imageUrl1));
 		this.pairImages.push(this.getImageFromUrl(pairUrl.imageUrl2));
 	};
 
 	this.setRandomSquareEffect = function()
 	{
+		this.squareEffects.length = 0;
 		for (var i = 0; i < this.squareCountX; ++i) {
 			for (var j = 0; j < this.squareCountY; ++j) {
 				var fullEffect = this.effects[this.randomInt(0, this.effects.length)].copy();
@@ -139,10 +143,11 @@
 		}
 
 		// Update effects
+		var effectsContinue = false;
 		for (var i = 0; i < this.squareEffects.length; ++i) {			
 			// Update
 			var fullEffect = this.squareEffects[i];
-			fullEffect.update(time);
+			effectsContinue = fullEffect.update(time) || effectsContinue;
 
 			for (var j = 0; j < 2; ++j) {
 				var effectInfo = fullEffect.effectInfos[j];
@@ -151,7 +156,12 @@
 					this.drawSquare(fullEffect, this.pairImages[j], effectInfo);	
 				}
 			}
-		}		
+		}
+
+		if (!effectsContinue) {
+			console.log("Effect finished !!!!!");
+			this.SetNewEffect();
+		}	
 	};
 
 	this.drawSquare = function(fullEffect, image, effectInfo)
@@ -184,7 +194,7 @@
 
 		// Create semi random effects
 		var range1 = 3000;
-		var range2 = 7000;
+		var range2 = 5000;
 
 		var i, time1, time2, effectParam1, effect1, effectParam2, effect2, fullEffect1;
 		for (i = 0; i < count; ++i) {
@@ -203,8 +213,8 @@
 		}
 
 		// Create semi random effects
-		range1 = 10000;
-		range2 = 25000;
+		range1 = 7000;
+		range2 = 15000;
 		for (i = 0; i < count; ++i) {
 			time1 = this.randomInt(range1, range2);
 			time2 = this.randomInt(range1, range2);
@@ -221,8 +231,8 @@
 		}
 
 		// Create semi random effects
-		range1 = 25000;
-		range2 = 30000;
+		range1 = 17000;
+		range2 = 23000;
 		for (i = 0; i < count; ++i) {
 			time1 = this.randomInt(range1, range2);
 			time2 = this.randomInt(range1, range2);
@@ -397,16 +407,24 @@
 		if (this.startTime[0] === 0) {
 			this.startTime[0] = time;
 			this.startTime[1] = time;
-			return;
+			return true;
 		}
 
 		for (var i = 0; i < 2; ++i) {
 			// If we are in the good time range we update the effect
 			var waitTime = this.startTime[i] + this.effects[i].waitTime;
-			if (time > waitTime && time < this.totalTime[i] + waitTime) {
+			var updateEffect = time < this.totalTime[i] + waitTime;
+			if (time > waitTime && updateEffect) {
 				this.effectInfos[i] = this.effects[i].update(time - waitTime);
 			}
+
+			if (i == 1 && !updateEffect) {
+				// The effect is done
+				return false;
+			}
 		}
+
+		return true;
 	};	
 }