@media screen and (min-width: 1080px) {
	
    .intro_canvas {
		position:absolute;
		width:1920px;
		height:1080px;
		background-image: url('../assets/images/intro_back.png');
		background-color:gray;
		background-repeat: no-repeat;
		background-size:1920px 1080px;
		margin:0;
		padding:0;
	}
	.intro_slide_1 {
		background-image: url('../assets/images/popup_start.gif');
		background-repeat: no-repeat;		
		background-size: 333px 167px;
		position:absolute;
		width:333px;
		height:167px;
		left: 793px;
		top:414px;
	}
	.intro_slide_1:hover {
		background-image: url('../assets/images/popup_start_on.png');
		cursor: pointer;
	}
	.intro_slide_2 {
		display:none;
		background-image: url('../assets/images/mainWindow.png');
		background-repeat: no-repeat;		
		background-size:640px 622px;
		position:absolute;
		width:600px;
		height:622px;
		left: 660px;
		top:90px;
		opacity: 0.8;
		color: rgb(114,131,164);
		font-family: "Comic Sans MS", "Comic Sans";
		font-size: 24px;
		font-weight: normal;
		padding:20px;
	}
	.intro_slide_3 {
		display:none;
		background-image: url('../assets/images/mainWindow.png');
		background-repeat: no-repeat;		
		background-size:640px 622px;
		position:absolute;
		width:600px;
		height:622px;
		left: 660px;
		top:90px;
		opacity: 0.8;
		color: rgb(114,131,164);
		font-family: "Comic Sans MS", "Comic Sans";
		font-size: 24px;
		font-weight: normal;
		padding:20px;
	}
	.intro_slide_3_avatar {
		position:absolute;
		top:350px;
	}
	.intro_slide_3_anna {
		background-image: url('../assets/images/archaeologist_w.png');
		background-repeat: no-repeat;		
		background-size:83px 167px;
		position:absolute;
		width:83px;
		height:167px;
		left: 180px;
    	top: 200px;
	}
	.intro_slide_3_anna_on {
		background-image: url('../assets/images/archaeologist_w_on.png');
		border: 1px rgb(114,131,164) solid;
	}
	.intro_slide_3_paulos {
		background-image: url('../assets/images/archaeologist_m.png');
		background-repeat: no-repeat;		
		background-size:83px 167px;
		position:absolute;
		width:83px;
		height:167px;
		left: 400px;
    	top: 200px;
	}
	.intro_slide_3_paulos_on {
		background-image: url('../assets/images/archaeologist_m_on.png');
		border: 1px rgb(114,131,164) solid;
	}
	.intro_slide_4 {
		display:none;
		background-image: url('../assets/images/mainWindow.png');
		background-repeat: no-repeat;		
		background-size:640px 622px;
		position:absolute;
		width:600px;
		height:622px;
		left: 660px;
		top:90px;
		opacity: 0.8;
		font-family: "Comic Sans MS", "Comic Sans";
		color: rgb(114,131,164);
		font-size: 24px;
		font-weight: normal;
		padding:20px;
	}
	.intro_slide_4_easy {
		float: left;
		width: 200px;
		height: 40px;
		left: 100px;
		top: 340px;
		color: rgb(114,131,164);
		font-size: 24px;
		font-weight: bold;
		padding: 20px;
		text-align: center;
	}
	.intro_slide_4_easy_on {
		border: 1px rgb(114,131,164) solid;
	}
	.intro_slide_4_hard {
		float: right;
		width: 200px;
		height: 40px;
		right: 100px;
		top: 240px;
		color: rgb(114,131,164);
		font-size: 24px;
		font-weight: bold;
		padding: 20px;
		text-align: center;
	}
	.intro_slide_4_hard_on {
		border: 1px rgb(114,131,164) solid;
	}
	.intro_next_button {
		background-image: url('../assets/images/button_next.png');
		background-repeat: no-repeat;		
		background-size:33px 33px;	
		position:absolute;
		width:33px;
		height:33px;
    	bottom: 60px;
    	left: 360px;
	}
	.intro_next_button:hover { cursor: pointer; }
	
	.intro_previous_button {
		background-image: url('../assets/images/button_previous.png');
		background-repeat: no-repeat;		
		background-size:33px 33px;	
		position:absolute;
		width:33px;
		height:33px;
    	bottom: 60px;
    	left: 240px;
	}
	.intro_previous_button:hover { cursor: pointer; }
		
		
	.level1_index_canvas {
		display:none;
		position:absolute;
		width:1920px;
		height:1080px;
		background-color:lightgray;
		background-repeat: no-repeat;
		background-size:1920px 1080px;
		/*background-image: url('../assets/images/chooseSiteBG.png');*/
		background-image: url('../assets/images/intro_back.png');
		z-index:10;
	}
	.level1_index_site1 {
		position:absolute;
    	top: 462px;
    	left: 640px;
    	width: 270px;
    	height: 203px;
		/*background-color:lightgray;
		background-repeat: no-repeat;
		background-size: 180px 135px;
		background-image: url('../assets/images/level1-index/01_zoneL1.png');*/
		z-index:10;
	}
	.level1_index_site1:hover {
		cursor:pointer;
		opacity:0.4;
		background-color:#ECF0F1;
		
		-webkit-transition: all 0.3s ease;
		-moz-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		-ms-transition: all 0.3s ease;
	
	}
	.level1_index_site2 {
		position:absolute;
    	top: 462px;
    	left: 870px;
    	width: 270px;
    	height: 203px;
		/*background-color:lightgray;
		background-repeat: no-repeat;
		background-size: 180px 135px;
		background-image: url('../assets/images/level1-index/01_zoneL2.png');*/
		z-index:10;
		display:block;
	}
	.level1_index_site2:hover {
		cursor:pointer;
		opacity:0.4;
		background-color:#ECF0F1;
		
		-webkit-transition: all 0.3s ease;
		-moz-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		-ms-transition: all 0.3s ease;

	}
	.level1_index_site3 {
		position:absolute;
    	top: 665px;
    	left: 734px;
    	width: 270px;
    	height: 203px;
		/*background-color:lightgray;
		background-repeat: no-repeat;
		background-size: 180px 135px;
		background-image: url('../assets/images/level1-index/01_zoneL3.png');*/
		z-index:10;
		display:block;
	}
	.level1_index_site3:hover {
		cursor:pointer;
		opacity:0.4;
		background-color:#ECF0F1;
		
		-webkit-transition: all 0.3s ease;
		-moz-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		-ms-transition: all 0.3s ease;

	}
	
	
	
	
	
	
	.level1_site1_selector {
		z-index:10;
		cursor:pointer;
		position:absolute;
    	top: 462px;
    	left: 640px;
    	width: 270px;
    	height: 203px;
	}
	.level1_site1_selector:hover {
		cursor: pointer;
	}
	.level1_site2_selector {
		z-index:10;
		cursor:pointer;
		position:absolute;
    	top: 462px;
    	left: 870px;
    	width: 270px;
    	height: 203px;
	}
	.level1_site2_selector:hover {
		cursor: pointer;
	}
	.level1_site3_selector {
		z-index:10;
		cursor:pointer; 
		position:absolute;
    	top: 665px;
    	left: 734px;
    	width: 270px;
    	height: 203px;
	}
	.level1_site3_selector:hover {
		cursor: pointer;
	}
	
	
	
	
	
    .level1_canvas {
		position:absolute;
		width:1920px;
		height:1080px;
		border:1px black solid;
		background-color:lightgray;
		background-repeat: no-repeat;
		background-size: 1920px 1080px;
	}
	.level1_site1 { display:none; position:absolute; width:1920px; height:1080px; background-image: url('../assets/images/level1-site1/L1.png'); background-repeat: no-repeat; background-size: 1920px 1080px; }
	.level1_site2 { display:none; position:absolute; width:1920px; height:1080px; background-image: url('../assets/images/level1-site2/L2.png'); background-repeat: no-repeat; background-size: 1920px 1080px; }
	.level1_site3 { display:none; position:absolute; width:1920px; height:1080px; background-image: url('../assets/images/level1-site3/L3.png'); background-repeat: no-repeat; background-size: 1920px 1080px; }
	
	
	.level1_tile {
		position:absolute;
		width:135px;
		height:135px;
		/*border:1px yellow dashed;*/
		cursor:pointer;
		background-color: #85C1E9;
	}
	
	.pearlImage {
		/*background-image: url('../assets/images/pearl.png'); */
		background-repeat: no-repeat; 
		background-size: 135px 135px;
		width: 135px;
		height:135px;
		position: absolute;
		top: 0px;
		left: 0px;
	}
	.pearlImage_center { background-image: url('../assets/images/pearl.png'); }
	.pearlImage_top_right { background-image: url('../assets/images/pearl_RT.png'); }
	.pearlImage_top_left { background-image: url('../assets/images/pearl_LT.png'); }
	.pearlImage_bottom_right { background-image: url('../assets/images/pearl_RB.png'); }
	.pearlImage_bottom_left { background-image: url('../assets/images/pearl_LB.png'); }
	
	.starImage {
		background-image: url('../assets/images/star.png'); 
		background-repeat: no-repeat; 
		background-size: 135px 135px;
		width: 135px;
		height:135px;
		position: absolute;
		top: 0px;
		left: 0px;
	}
	.starImage_center { background-image: url('../assets/images/star.png'); }
	.starImage_top_right { background-image: url('../assets/images/star_RT.png'); }
	.starImage_top_left { background-image: url('../assets/images/star_LT.png'); }
	.starImage_bottom_right { background-image: url('../assets/images/star_RB.png'); }
	.starImage_bottom_left { background-image: url('../assets/images/star_LB.png'); }
	
	
	.progressBar {
		width: 135px;
		height:8px;
		position: absolute;
		top: -10px;
		left: 0px;
		border: 1px solid #111;
		background-color: #292929;
	}
	.progressBar div {
		height: 100%;
		color: #fff;
		text-align: right;
		line-height: 0px; /* same as #progressBar height if we want text middle aligned */
		width: 0;
		background-color: #E18223;
	}

	
	.soundEffectsButton {
		background-image: url('../assets/images/speaker.png'); 
		background-repeat: no-repeat; 
		background-size: 30px 30px;
		width: 30px;
		height:30px;
		position: absolute;
		top: 15px;
		left: 15px;
	}
	.muteButton {
		background-image: url('../assets/images/mute.png'); 
	}
	
	


	.topographder-animation {
		height: 180px;
		width: 180px;
		background-image: url('../assets/sprites/topographer-sprite.png');
		position:absolute;
		top:-90px;
		left:-45px;
		z-index:5;
	}
	.topographder-animation-2 {
		height: 180px;
		width: 180px;
		background-image: url('../assets/sprites/topographer-sprite-2.png');
		position:absolute;
		top:-90px;
		left:-45px;
		z-index:5;
	}
	
		
	
		
	.worker-ftyari {
		height: 180px;
		width: 180px;
		background-image: url('../assets/sprites/ftyari-seq.png');
		position:absolute;
		top:-90px;
		left:-45px;
		z-index:5;
	}
	
	.worker-skalistiri {
		height: 135px;
		width: 135px;
		position:absolute;
		top:0px;
		left:0px;
		z-index:5;
	}
	.worker-skalistiri-center {
		background-image: url('../assets/sprites/skalistiri-seq_90x90.png');
	}
	.worker-skalistiri-center-ll {
		background-image: url('../assets/sprites/skalistiri-side-LL-MC.png');
	}
	.worker-skalistiri-center-lr {
		background-image: url('../assets/sprites/skalistiri-side-LR-MC.png');
	}
	.worker-skalistiri-ll-tr {
		background-image: url('../assets/sprites/skalistiri-back-LL-TR.png');
	}
	.worker-skalistiri-ll-tl {
		background-image: url('../assets/sprites/skalistiri-back-LL-TL.png');
	}
	.worker-skalistiri-ll-br {
		background-image: url('../assets/sprites/skalistiri-back-LL-BR.png');
	}
	.worker-skalistiri-ll-bl {
		background-image: url('../assets/sprites/skalistiri-back-LL-BL.png');
	}
	
	.worker-skalistiri-lr-tr {
		background-image: url('../assets/sprites/skalistiri-back-LR-TR.png');
	}
	.worker-skalistiri-lr-tl {
		background-image: url('../assets/sprites/skalistiri-back-LR-TL.png');
	}
	.worker-skalistiri-lr-br {
		background-image: url('../assets/sprites/skalistiri-back-LR-BR.png');
	}
	.worker-skalistiri-lr-bl {
		background-image: url('../assets/sprites/skalistiri-back-LR-BL.png');
	}
	
	

	.worker-skalistiri-glow {
		height: 135px;
		width: 135px;
		position:absolute;
		top:0px;
		left:0px;
		z-index:5;
		background-repeat: no-repeat; 
	}
	.worker-skalistiri-glow-center {
		background-image: url('../assets/images/skalistiri_side_glow_LR-MC.png');
	}
	.worker-skalistiri-glow-center-ll {
		background-image: url('../assets/images/skalistiri_side_glow_LL-MC.png');
	}
	.worker-skalistiri-glow-center-lr {
		background-image: url('../assets/images/skalistiri_side_glow_LR-MC.png');
	}
	.worker-skalistiri-glow-ll-tr {
		background-image: url('../assets/images/skalistiri_side_glow_LL-TR.png');
	}
	.worker-skalistiri-glow-ll-tl {
		background-image: url('../assets/images/skalistiri_back_glow_LL-TL.png');
	}
	.worker-skalistiri-glow-ll-br {
		background-image: url('../assets/images/skalistiri_back_glow-LL-BR.png');
	}
	.worker-skalistiri-glow-ll-bl {
		background-image: url('../assets/images/skalistiri_back_glow_LL-BL.png');
	}
	
	.worker-skalistiri-glow-lr-tr {
		background-image: url('../assets/images/skalistiri_back_glow_LR-TR.png');
	}
	.worker-skalistiri-glow-lr-tl {
		background-image: url('../assets/images/skalistiri_back_glow_LR-TL.png');
	}
	.worker-skalistiri-glow-lr-br {
		background-image: url('../assets/images/skalistiri_back_glow_LR-BR.png');
	}
	.worker-skalistiri-glow-lr-bl {
		background-image: url('../assets/images/skalistiri_back_glow_LR-BL.png');
	}
	
		
		
	.worker-xystra {
		height: 135px;
		width: 135px;
		position:absolute;
		top:0px;
		left:0px;
		z-index:5;
	}
	
	.worker-xystra-center {
		background-image: url('../assets/sprites/xystra-seq_90x90.png');
	}
	.worker-xystra-center-ll {
		background-image: url('../assets/sprites/xistra-side-LL-MC.png');
	}
	.worker-xystra-center-lr {
		background-image: url('../assets/sprites/xistra-side-LR-MC.png');
	}
	.worker-xystra-ll-tr {
		background-image: url('../assets/sprites/xistra-side-LL-TR.png');
	}
	.worker-xystra-ll-tl {
		background-image: url('../assets/sprites/xistra-side-LL-TL.png');
	}
	.worker-xystra-ll-br {
		background-image: url('../assets/sprites/xistra-side-LL-BR.png');
	}
	.worker-xystra-ll-bl {
		background-image: url('../assets/sprites/xistra-side-LL-BL.png');
	}

	.worker-xystra-lr-tr {
		background-image: url('../assets/sprites/xistra-side-LR-TR.png');
	}
	.worker-xystra-lr-tl {
		background-image: url('../assets/sprites/xistra-side-LR-TL.png');
	}
	.worker-xystra-lr-br {
		background-image: url('../assets/sprites/xistra-side-LR-BR.png');
	}
	.worker-xystra-lr-bl {
		background-image: url('../assets/sprites/xistra-side-LR-BL.png');
	}
	
	
	
		
	.worker-brush {
		height: 135px;
		width: 135px;
		position:absolute;
		top:0px;
		left:0px;
		z-index:5;
	}

	.worker-brush-center {
		background-image: url('../assets/sprites/brush-seq_90x90.png');
	}
	.worker-brush-center-ll {
		background-image: url('../assets/sprites/pinelo-side-LL-MC.png');
	}
	.worker-brush-center-lr {
		background-image: url('../assets/sprites/pinelo-side-LR-MC.png');
	}
	.worker-brush-ll-tr {
		background-image: url('../assets/sprites/pinelo-side-LL-TR.png');
	}
	.worker-brush-ll-tl {
		background-image: url('../assets/sprites/pinelo-side-LL-TL.png');
	}
	.worker-brush-ll-br {
		background-image: url('../assets/sprites/pinelo-side-LL-BR.png');
	}
	.worker-brush-ll-bl {
		background-image: url('../assets/sprites/pinelo-side-LL-BL.png');
	}
	
	.worker-brush-lr-tr {
		background-image: url('../assets/sprites/pinelo-side-LR-TR.png');
	}
	.worker-brush-lr-tl {
		background-image: url('../assets/sprites/pinelo-side-LR-TL.png');
	}
	.worker-brush-lr-br {
		background-image: url('../assets/sprites/pinelo-side-LR-BR.png');
	}
	.worker-brush-lr-bl {
		background-image: url('../assets/sprites/pinelo-side-LR-BL.png');
	}
	
	
	.worker-karotsi {
		display:none;
		height: 90px;
		width: 90px;
		position:absolute;
		top:270px;
		left:975px;
		z-index:5;
		background-image: url('../assets/sprites/worker-karotsi.png');
	}
	
	.topographerAnim1 {
		height: 90px;
		width: 90px;
		position:absolute;
		top:270px;
		left:975px;
		z-index:5;
		background-image: url('../assets/sprites/topographer-1.png');
	}
	.topographerAnim2 {
		height: 90px;
		width: 90px;
		position:absolute;
		top:675px;
		left:810px;
		z-index:5;
		background-image: url('../assets/sprites/topographer-2.png');
	}
	.topographerAnim3 {
		height: 90px;
		width: 90px;
		position:absolute;
		top:675px;
		left:810px;
		z-index:5;
		background-image: url('../assets/sprites/topographer-1.png');
	}
						
		
	.tile-info-panel {
		background-color: transparent
		background-repeat: no-repeat; 
		background-size: 135px 135px;
		width: 135px;
		height:135px;
		position: absolute;
		top: 0px;
		left: 0px;
		z-index:6;
		
	}
	.tile-info-panel-inner {
		position: absolute;
		top: 57px;
		left: 57px;
		background-image: url('../assets/images/viewObject.png'); 
		background-repeat: no-repeat; 
		background-size: 33px 33px;
		width: 33px;
		height: 33px;
		cursor: pointer;
	}
	
	
	
	.gotoIndexButton {
		;
	}
	
	.gotoSiteButton_1to2 {
		background-image: url('../assets/images/leftΤοR.png'); 
		background-repeat: no-repeat; 
		background-size: 96px 160px;
		width: 96px;
		height:160px;
		position: absolute;
		top: 195px;
    	left: 1800px;
	}
	.gotoSiteButton_1to2:hover {
		background-image: url('../assets/images/leftΤοR_on.png'); 
		cursor:pointer;
	}
	.gotoSiteButton_1to3 {
		background-image: url('../assets/images/leftΤοB.png'); 
		background-repeat: no-repeat; 
		background-size: 96px 160px;
		width: 96px;
		height:160px;
		position: absolute;
		top: 930px;
		left: 750px;
	}
	.gotoSiteButton_1to3:hover {
		background-image: url('../assets/images/leftΤοΒ_on.png'); 
		cursor:pointer;
	}

	.gotoSiteButton_2to1 {
		background-image: url('../assets/images/rightToL.png'); 
		background-repeat: no-repeat; 
		background-size: 96px 160px;
		width: 96px;
		height:160px;
		position: absolute;
		top: 120px;
		left: 150px;
	}
	.gotoSiteButton_2to1:hover {
		background-image: url('../assets/images/rightToL_on.png'); 
		cursor:pointer;
	}

	.gotoSiteButton_2to3 {
		background-image: url('../assets/images/rightToB.png'); 
		background-repeat: no-repeat; 
		background-size: 96px 160px;
		width: 96px;
		height:160px;
		position: absolute;
		top: 930px;
		left: 1110px;
	}
	.gotoSiteButton_2to3:hover {
		background-image: url('../assets/images/rightToB_on.png'); 
		cursor:pointer;
	}
	
	.gotoSiteButton_3to1 {
		background-image: url('../assets/images/rightToL.png'); 
		background-repeat: no-repeat; 
		background-size: 96px 160px;
		width: 96px;
		height:160px;
		position: absolute;
		top: 630px;
		left: 90px;
	}
	.gotoSiteButton_3to1:hover {
		background-image: url('../assets/images/rightToL_on.png'); 
		cursor:pointer;
	}

	
	.gotoSiteButton_3to2 {
		background-image: url('../assets/images/bottomToR.png'); 
		background-repeat: no-repeat; 
		background-size: 96px 160px;
		width: 96px;
		height:160px;
		position: absolute;
		top: 930px;
		left: 1500px;
	}
	.gotoSiteButton_3to2:hover {
		background-image: url('../assets/images/bottomToR_on.png'); 
		cursor:pointer;
	}
		
		
	
	
	.gotoIndexButton_2 {
		background-image: url('../assets/images/rightToB.png'); 
		background-repeat: no-repeat; 
		background-size: 96px 160px;
		width: 96px;
		height:160px;
		position: absolute;
		top: 930px;
		left: 990px;
	}
	.gotoIndexButton_2:hover {
		background-image: url('../assets/images/rightToB_on.png'); 
		cursor:pointer;
	}
	.gotoIndexButton_3 {
		background-image: url('../assets/images/leftΤοB.png'); 
		background-repeat: no-repeat; 
		background-size: 96px 160px;
		width: 96px;
		height:160px;
		position: absolute;
		top: 930px;
		left: 900px;
	}
	.gotoIndexButton_3:hover {
		background-image: url('../assets/images/leftΤοΒ_on.png'); 
		cursor:pointer;
	}
	
	
	.tentIcon {
		background-image: url('../assets/images/tent.png'); 
		background-repeat: no-repeat; 
		background-size: 440px 333px;
		width: 440px;
		height:333px;
		position: absolute;
		top: 210px;
		left: 1470px;
		z-index:2;
	}
	.tableIcon {
		background-image: url('../assets/images/table.png'); 
		background-repeat: no-repeat; 
		background-size: 260px 132px;
		width: 260px;
		height:132px;
		position: absolute;
		top: 360px;
		left: 1500px;
		z-index:2;
	}
	
	.karotsiIcon {
		background-image: url('../assets/images/ftiari.png'); 
		background-repeat: no-repeat; 
		background-size: 174px 117px;
		width: 174px;
		height:117px;
		position: absolute;
		top: 360px;
		left: 1500px;
		z-index:2;	
	}
	
	.topographerButton {
		background-image: url('../assets/images/topografos.png'); 
		background-repeat: no-repeat; 
		background-size: 105px 250px;
		width: 105px;
		height:250px;
		position: absolute;
		top: 810px;
		left: 23px;
	}
	.topographerButton:hover {
		background-image: url('../assets/images/topografos_on.png'); 
	}
	.workerButton {
		background-image: url('../assets/images/technician.png'); 
		background-repeat: no-repeat; 
		background-size: 105px 250px;
		width: 105px;
		height:250px;
		position: absolute;
		top: 810px;
		left: 128px;
	}
	.workerButton:hover {
		background-image: url('../assets/images/technician_on.png'); 
	}
	.workerButton-active {
		background-image: url('../assets/images/technician_on.png'); 
	}
	
	.archaeologistButton {
		height: 180px;
		width: 180px;
		position:absolute;
		transform: scale(1.4, 1.4);
		/*background-image: url('../assets/images/archaeologist_w_seated.png'); 
		background-repeat: no-repeat; 
		background-size: 105px 250px;
		width: 105px;
		height:250px;*/
		position: absolute;
		top: 810px;
		left: 232px;
	}
	.archaeologistButtonLeft {
		background-image: url('../assets/sprites/archaeologist-1.png');
	}
	.archaeologistButtonRight {
		background-image: url('../assets/sprites/archaeologist-2.png');
	}
	.archaeologistManButtonLeft {
		background-image: url('../assets/sprites/archaeologist-man-1.png');
	}
	.archaeologistManButtonRight {
		background-image: url('../assets/sprites/archaeologist-man-2.png');
	}
	/*.archaeologistButton:hover {
		background-image: url('../assets/images/archaeologist_w_seated_on.png'); 
	}*/
	
	.architectButton {
		background-image: url('../assets/images/designer.png'); 
		background-repeat: no-repeat; 
		background-size: 105px 250px;
		width: 105px;
		height:250px;
		position: absolute;
		top: 810px;
		left: 338px;
	}
	.architectButton:hover {
		background-image: url('../assets/images/designer_on.png'); 
	}
	.wormButton {
		/*background-image: url('../assets/images/skouliki.png'); 
		background-repeat: no-repeat; 
		background-size: 111px 159px;*/
		width: 167px;
		height:239px;
		position: absolute;
		top: 815px;
		left: 1722px;
		z-index:11;
	}

	.wormBubbleButton {
		display:none;
		background-repeat: no-repeat; 
		background-size: 495px 170px;
		width: 495px;
		height: 170px;
		position: relative;
    	top: -255px;
    	left: -870px;
		z-index: 20;
	}
	.wormBubbleButton_right{
		background-image: url('../assets/images/bubleLong_R.png'); 
	}
	.wormBubbleButton_left{
		background-image: url('../assets/images/bubleLong_L.png'); 
	}
	
	#wormAnimSprite {
		height: 200px;
		width: 375px;
		position:absolute;
		top:0px;
		left:0px;
		z-index:10;
		/*background-size: 90px 90px;*/
	}
	
	.wormAnimSpriteL1 {
		background-image: url('../assets/sprites/worm-seq/L1_skouliki_seq.png');
	}
	.wormAnimSpriteL1_happy {
		background-image: url('../assets/sprites/worm-seq/L1_skouliki_happy_seq.png');
	}
	.wormAnimSpriteL1_sad {
		background-image: url('../assets/sprites/worm-seq/L1_skouliki_sad_seq.png');
	}
	
	.wormAnimSpriteL2 {
		background-image: url('../assets/sprites/worm-seq/L2_skouliki_seq.png');
	}
	.wormAnimSpriteL2_happy {
		background-image: url('../assets/sprites/worm-seq/L2_skouliki_happy_seq.png');
	}
	.wormAnimSpriteL2_sad {
		background-image: url('../assets/sprites/worm-seq/L2_skouliki_sad_seq.png');
	}
	
	.wormAnimSpriteL3 {
		background-image: url('../assets/sprites/worm-seq/L3_skouliki_seq.png');
	}
	.wormAnimSpriteL3_happy {
		background-image: url('../assets/sprites/worm-seq/L3_skouliki_happy_seq.png');
	}
	.wormAnimSpriteL3_sad {
		background-image: url('../assets/sprites/worm-seq/L3_skouliki_sad_seq.png');
	}


	.wormAnimSpriteL1h {
		background-image: url('../assets/sprites/worm-seq/hole/L1_skouliki_seq.png');
	}
	.wormAnimSpriteL1h_happy {
		background-image: url('../assets/sprites/worm-seq/hole/L1_skouliki_happy_seq.png');
	}
	.wormAnimSpriteL1h_sad {
		background-image: url('../assets/sprites/worm-seq/hole/L1_skouliki_sad_seq.png');
	}
	
	.wormAnimSpriteL2h {
		background-image: url('../assets/sprites/worm-seq/hole/L2_skouliki_seq.png');
	}
	.wormAnimSpriteL2h_happy {
		background-image: url('../assets/sprites/worm-seq/hole/L2_skouliki_happy_seq.png');
	}
	.wormAnimSpriteL2h_sad {
		background-image: url('../assets/sprites/worm-seq/hole/L2_skouliki_sad_seq.png');
	}
	
	.wormAnimSpriteL3h {
		background-image: url('../assets/sprites/worm-seq/hole/L3_skouliki_seq.png');
	}
	.wormAnimSpriteL3h_happy {
		background-image: url('../assets/sprites/worm-seq/hole/L3_skouliki_happy_seq.png');
	}
	.wormAnimSpriteL3h_sad {
		background-image: url('../assets/sprites/worm-seq/hole/L3_skouliki_sad_seq.png');
	}

 
					
	.mText {
		width: 420px;
		height: 150px;
		position: absolute;
		top: 22px;
		left: 22px;
		color: rgb(114,131,164);
		font-family: "Comic Sans MS", "Comic Sans";
		font-size: 16px;
		font-weight: normal;
	}
	.mText2 {
		width: 420px;
		height: 150px;
		position: absolute;
		top: 22px;
		left: 22px;
		color: rgb(114,131,164);
		font-family: "Comic Sans MS", "Comic Sans";
		font-size: 19px;
		font-weight: normal;
	}	
	
	.cameraPanel {
		display:none;
		background-image: url('../assets/images/mainWindow.png'); 
		background-repeat: no-repeat; 
		background-size: 640px 622px;
		width: 640px;
		height:622px;
		position: absolute;
		top: 90px;
		left: 570px;
		z-index:12;
	}
	.mIconCamera {
		background-image: url('../assets/images/popup_camera.png'); 
		background-repeat: no-repeat; 
		background-size: 87px 87px;
		width: 87px;
		height:87px;
		position: absolute;
    	top: -30px;
    	left: 590px;
		z-index:12;
	}
	.mImageCamera {
		background-image: url(); 
		background-repeat: no-repeat; 
		background-size: contain;
		width: 600px;
    	height: 500px;
    	position: absolute;
    	top: 65px;
    	left: 65px;
		z-index:12;	
	}
	.mImageCaption {
		color: rgb(114,131,164);
		font-family: "Comic Sans MS", "Comic Sans";
		font-size: 24px;
		font-weight: bold;
		width: 600px;
		height: 80px;
		position: absolute;
		top: 50px;
		padding-left: 20px;
		padding-right:20px;
		text-align:center;
		z-index:12;
	}



	.journalPanel {
		display:none;
		background-image: url('../assets/images/mainWindow.png'); 
		background-repeat: no-repeat; 
		background-size: 640px 622px;
		width: 640px;
		height:622px;
		position: absolute;
		top: 90px;
		left: 570px;
		z-index:12;
	}
	.mIconJournal {
		background-image: url('../assets/images/popup_calendar.png'); 
		background-repeat: no-repeat; 
		background-size: 87px 87px;
		width: 87px;
		height:87px;
		position: absolute;
    	top: -30px;
    	left: 590px;
		z-index:12;
	}
	.mJournalBody {
		width: 600px;
    	height: 550px;
    	position: absolute;
    	top: 50px;
    	left: 20px;
		z-index:12;
		overflow-y:auto;
		overflow-x:none;	
	}
	.journal-item {
		float: left;
		margin: 4px;
		padding: 4px;
		width: 520px;
		/*height: 120px;*/
		height: auto;
		border: 1px solid lightgray;
	}
	.journal-text {
		float: right;
		margin: 4px;
		padding: 4px;
		width: 320px;	
		/*height:100px;
		line-height: 8px;*/
	}
	.journal-image {
		max-height:120px; 
		max-width:170px;
	}



	.boxPanel {
		display:none;
		background-image: url('../assets/images/mainWindow.png'); 
		background-repeat: no-repeat; 
		background-size: 640px 622px;
		width: 640px;
		height:642px;
		position: absolute;
		top: 90px;
		left: 570px;
		z-index:12;
	}
	.mIconBox {
		background-image: url('../assets/images/popup_box.png'); 
		background-repeat: no-repeat; 
		background-size: 87px 87px;
		width: 87px;
		height:87px;
		position: absolute;
    	top: -30px;
    	left: 590px;
		z-index:12;
	}
	.mBoxBody {
		width: 600px;
    	height: 550px;
    	position: absolute;
    	top: 20px;
    	left: 20px;
		z-index:12;
		overflow-y:auto;
		overflow-x:none;	
	}
	.box-item {
		float: left;
		margin: 4px;
		padding: 4px;
		width: 280px;
		height: 80px;
		border: 1px solid lightgray;
	}
	.box-text {
		float: right;
		margin: 4px;
		padding: 4px;
		width: 160px;	
	}
	.box-image {
		max-height:80px; 
		max-width:100px;
	}
	
	.boxButtonNumber {
		font-size: 24px;
		color: white;
		height: 90px;
		width: 30px;
		margin-left: 25px;
		text-align: center;
		line-height: 90px;
	}
	
	




	.sketchPanel {
		display:none;
		background-image: url('../assets/images/mainWindow.png'); 
		background-repeat: no-repeat; 
		background-size: 640px 622px;
		width: 640px;
		height:622px;
		position: absolute;
		top: 90px;
		left: 570px;
		z-index:12;
	}
	.mIconSketch {
		background-image: url('../assets/images/sketch.png'); 
		background-repeat: no-repeat; 
		background-size: 87px 87px;
		width: 87px;
		height:87px;
		position: absolute;
    	top: -30px;
    	left: 590px;
		z-index:12;
	}
	.mSketchBody {
		width: 600px;
    	height: 450px;
    	position: absolute;
    	top: 50px;
    	left: 20px;
		z-index:12;
		overflow-y:auto;
		overflow-x:none;	
	}
	.mSketchNext {
		background-image: url(../assets/images/right-arrow.png);
		background-repeat: no-repeat;
		background-size: 69px 43px;
		width: 69px;
		height: 43px;
		position: absolute;
    	top: 570px;
    	left: 280px;
		z-index: 12;
		cursor: pointer;
		display:none;
	}
	
	
	
	
	
	
	
	
	
	.xystraButton {
		display:none;
		background-image: url('../assets/images/xystra.png'); 
		background-repeat: no-repeat; 
		background-size: 65px 65px;
		width: 65px;
		height:65px;
		position: absolute;
		top: 915px;
		left: 116px;
		z-index:10;
	}
	.xystraButton:hover {
		background-image: url('../assets/images/xystra-on.png'); 
	}
	.xystraButton-active {
		background-image: url('../assets/images/xystra-on.png'); 
	}
	
	
	.skalistiriButton {
		display:none;
		background-image: url('../assets/images/skalistiri.png'); 
		background-repeat: no-repeat; 
		background-size: 65px 65px;
		width: 65px;
		height:65px;
		position: absolute;
		top: 915px;
		left: 183px;
		z-index:10;
	}
	.skalistiriButton:hover {
		background-image: url('../assets/images/skalistiri-on.png'); 
	}
	.skalistiriButton-active {
		background-image: url('../assets/images/skalistiri-on.png'); 
	}
	
	.brushButton {
		display:none;
		background-image: url('../assets/images/brush.png'); 
		background-repeat: no-repeat; 
		background-size: 65px 65px;
		width: 65px;
		height:65px;
		position: absolute;
		top: 975px;
		left: 147px;
		z-index:10;
	}
	.brushButton:hover {
		background-image: url('../assets/images/brush-on.png'); 
	}
	.brushButton-active {
		background-image: url('../assets/images/brush-on.png'); 
	}
	

	.boxButton {
		background-image: url('../assets/images/box.png'); 
		background-repeat: no-repeat; 
		background-size: 90px 90px;
		width: 90px;
		height:90px;
		position: absolute;
		top: 405px;
		left: 1770px;
		z-index:2;
	}
	.boxButton:hover {
		background-image: url('../assets/images/box_on.png'); 
	}
	.boxButton-active {
		background-image: url('../assets/images/box_on.png'); 
	}

	.cameraButton {
		background-image: url('../assets/images/camera.png'); 
		background-repeat: no-repeat; 
		background-size: 57px 47px;
		width: 57px;
		height:47px;
		position: absolute;
		top: 360px;
		left: 1530px;
		z-index:2;
	}
	.cameraButton:hover {
		background-image: url('../assets/images/camera_on.png'); 
	}
	.cameraButton-active {
		background-image: url('../assets/images/camera_on.png'); 
	}
	
	.calendarButton {
		background-image: url('../assets/images/calendar.png'); 
		background-repeat: no-repeat; 
		background-size: 65px 65px;
		width: 65px;
		height:65px;
		position: absolute;
		top: 352px;
		left: 1590px;
		z-index:2;
	}
	.calendarButton:hover {
		background-image: url('../assets/images/calendar_on.png'); 
	}
	.calendarButton-active {
		background-image: url('../assets/images/calendar_on.png'); 
	}

	.spaceplaneButton {
		display:none;
		background-image: url('../assets/images/spaceplane.png'); 
		background-repeat: no-repeat; 
		background-size: 65px 65px;
		width: 65px;
		height:65px;
		position: absolute;
		top: 915px;
		left: 45px;
		z-index:10;
	}
	.spaceplaneButton:hover {
		background-image: url('../assets/images/spaceplane-on.png'); 
	}
	.spaceplaneButton-active {
		background-image: url('../assets/images/spaceplane-on.png'); 
	}
	
	.sketchButton {
		display:none;
		background-image: url('../assets/images/sketch.png'); 
		background-repeat: no-repeat; 
		background-size: 65px 65px;
		width: 65px;
		height:65px;
		position: absolute;
		top: 915px;
		left: 360px;
		z-index:10;
	}
	.sketchButton:hover {
		background-image: url('../assets/images/sketch-on.png'); 
	}
	.sketchButton-active {
		background-image: url('../assets/images/sketch-on.png'); 
	}
		

	

	/* LEVEL 2*/

	.level2_index_canvas {
		display:none;
		position:absolute;
		width:1920px;
		height:1080px;
		background-color:lightgray;
		background-repeat: no-repeat;
		background-size: 1920px 1080px;
		/*background-image: url('../assets/images/chooseSiteBG.png');*/
		background-image: url('../assets/images/level2-index/2ndStageBG.png');
		z-index:10;
	}
	.level2_index_label {
    	text-align:center;
		font-family: "Comic Sans MS", "Comic Sans";
		font-size: 14px;
		font-weight: bold;
		width: 195px;
		left: 45px;
		top: 15px;
		position: absolute;
	}
	.level2_index_site1 {
		color: rgb(155,60,56);
		position:absolute;
    	top: 47px;
    	left: 218px;
    	width: 470px;
    	height: 812px;
		background-size: 470px 812px;
		background-image: url('../assets/images/level2-index/leftOff.png');
		z-index:10;
	}
	.level2_index_site1:hover {
		cursor:pointer;
		color: rgb(255,255,255);
		background-image: url('../assets/images/level2-index/leftOn.png');
		-webkit-transition: all 0.3s ease;
		-moz-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		-ms-transition: all 0.3s ease;
	}
	
	.level2_index_site1_figure { 
		position: absolute;
		top: 260px;
		left: 260px;
		width: 200px;
		height: 550px;
		z-index: 11;
	}
		
		
	.level2_index_site2 {
		color: rgb(155,60,56);
		position:absolute;
    	top: 50px;
    	left: 744px;
    	width: 470px;
    	height: 812px;
		background-size: 470px 812px;
		background-image: url('../assets/images/level2-index/middleOff.png');
		z-index:10;
	}
	.level2_index_site2:hover {
		cursor:pointer;
		color: rgb(255,255,255);
		background-image: url('../assets/images/level2-index/middleOn.png');
		-webkit-transition: all 0.3s ease;
		-moz-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		-ms-transition: all 0.3s ease;
	}

	.level2_index_site2_figure { 
		position: absolute;
		top: 250px;
		left: 270px;
		width: 200px;
		height: 550px;
		z-index: 11;
	}
	
	.level2_index_site3 {
		color: rgb(155,60,56);
		position:absolute;
    	top: 50px;
    	left: 1274px;
    	width: 470px;
    	height: 812px;
		background-size: 470px 812px;
		background-image: url('../assets/images/level2-index/rightOff.png');
		z-index:10;
	}
	
	.level2_index_site3:hover {
		cursor:pointer;
		color: rgb(255,255,255);
		background-image: url('../assets/images/level2-index/rightOn.png');
		-webkit-transition: all 0.3s ease;
		-moz-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		-ms-transition: all 0.3s ease;
	}

	.level2_index_site3_figure { 
		position: absolute;
		top: 250px;
		left: 270px;
		width: 200px;
		height: 550px;
		z-index: 11;
	}
	
	.level2_index_belt {
		bottom:0px;
		left:0px;
		position:absolute;
		width:1920px;
		height:134px;
		z-index:11;
		background-image: url('../assets/images/level2-index/2ndStage_Object_bg.png'); 
		background-repeat: no-repeat; 
		background-size: 1920px 134px;
	}
	.level2_index_belt_item {
		position:absolute;
		top:2px;
		width:144px;
		height:144px;
	}
	.level2_index_belt_item:hover {
		cursor: pointer;
	}
		
	.level2_lab_item {
		position:absolute;
		width: 480px;
		height: 400px;
		top: 0px;
		left: 75px;
	}
	.level2_lab_item:hover {
		cursor: pointer;
	}
	.level2_lab_item_list {
		float:left;
		position:absolute;
	}
		
    .level2_canvas {
    	display:none;
		position:absolute;
		width:1920px;
		height:1080px;
		background-color:lightgray;
		background-repeat: no-repeat;
		background-size: 1920px 1080px;
	}

	.level2_site1 { display:none; position:absolute; width:1920px; height:1080px; background-image: url('../assets/images/level2-index/ergastirio_keramikis.png'); background-repeat: no-repeat; background-size: 1920px 1080px; }
	.level2_site2 { display:none; position:absolute; width:1920px; height:1080px; background-image: url('../assets/images/level2-index/ergastirio_metallou.png'); background-repeat: no-repeat; background-size: 1920px 1080px; }
	.level2_site3 { display:none; position:absolute; width:1920px; height:1080px; background-image: url('../assets/images/level2-index/ergastirio_marmarou.png'); background-repeat: no-repeat; background-size: 1920px 1080px; }
	
	.level2_site1_gotoindex { cursor:pointer; width: 210px; height: 360px; position: absolute; top: 330px; left: 1590px; }
	.level2_site2_gotoindex { cursor:pointer; width: 210px; height: 360px; position: absolute; top: 300px; left: 1410px; }
	.level2_site3_gotoindex { cursor: pointer; width: 180px; height: 405px; position: absolute; top: 180px; left: 1440px;}

	.level2_site1_table { cursor:pointer; width: 960px; height: 150px; position: absolute; top: 690px; left: 600px; }
	.level2_site2_table { cursor:pointer; width: 720px; height: 180px; position: absolute; top: 660px; left: 660px; }
	.level2_site3_table { cursor: pointer; width: 1080px; height: 210px; position: absolute; top: 690px; left: 600px;}

	.level2_box { cursor:pointer; width: 960px; height: 150px; position: absolute; top: 900px; left: 350px;   background-image: url('../assets/images/box.png'); background-repeat: no-repeat; background-size: 90px 90px; width: 90px; height:90px; }
	.level2_site1_box { cursor:pointer; width: 960px; height: 150px; position: absolute; top: 800px; left: 300px;    background-image: url('../assets/images/box.png'); background-repeat: no-repeat; background-size: 90px 90px; width: 90px; height:90px; }
	.level2_site2_box { cursor:pointer; width: 720px; height: 180px; position: absolute; top: 800px; left: 300px;    background-image: url('../assets/images/box.png'); background-repeat: no-repeat; background-size: 90px 90px; width: 90px; height:90px; }
	.level2_site3_box { cursor: pointer; width: 1080px; height: 210px; position: absolute; top: 900px; left: 350px;  background-image: url('../assets/images/box.png'); background-repeat: no-repeat; background-size: 90px 90px; width: 90px; height:90px; }
		
	.level2_index_site1_message {
		background-image: url(../assets/images/normal_left.png);
		display: none;
		background-repeat: no-repeat;
		background-size: 506px 253px;
		width: 506px;
		height: 253px;
		position: relative;
		top: 120px;
		left: 550px;
		z-index: 20;
	}
	.level2_index_site2_message {
		background-image: url(../assets/images/normal_left.png);
		display: none;
		background-repeat: no-repeat;
		background-size: 506px 253px;
		width: 506px;
		height: 253px;
		position: relative;
		top: 120px;
   	 	left: 1080px;
		z-index: 20;
	}
	.level2_index_site3_message {
		background-image: url(../assets/images/normal_right.png);
		display: none;
		background-repeat: no-repeat;
		background-size: 506px 253px;
		width: 506px;
		height: 253px;
		position: relative;
    	top: 120px;
    	left: 1160px;
		z-index: 20;
	}

		
		
		
		
		
	/* LEVEL 3 */
	
	
	.level3_index_canvas {
		display:none;
		position:absolute;
		width:1920px;
		height:1080px;
		background-color:lightgray;
		background-repeat: no-repeat;
		background-size: 1920px 1080px;
		background-image: url('../assets/images/level3-index/level3-index.png');
		z-index:10;
	}
	
			
    .level3_canvas {
    	display:none;
		position:absolute;
		width:1920px;
		height:1080px;
		background-color:lightgray;
		background-repeat: no-repeat;
		background-size: 1920px 1080px;
	}

	.level3_site1 { display:none; position:absolute; width:1920px; height:1080px; background-image: url('../assets/images/level3-index/toixos1.png'); background-repeat: no-repeat; background-size: 1920px 1080px; }
	.level3_site2 { display:none; position:absolute; width:1920px; height:1080px; background-image: url('../assets/images/level3-index/toixos2.png'); background-repeat: no-repeat; background-size: 1920px 1080px; }
	.level3_site3 { display:none; position:absolute; width:1920px; height:1080px; background-image: url('../assets/images/level3-index/toixos3.png'); background-repeat: no-repeat; background-size: 1920px 1080px; }

	.level3_site1_gotoindex { cursor:pointer; width: 210px; height: 360px; position: absolute; top: 330px; left: 1590px; }
	.level3_site2_gotoindex { cursor:pointer; width: 210px; height: 360px; position: absolute; top: 300px; left: 1410px; }
	.level3_site3_gotoindex { cursor: pointer; width: 180px; height: 405px; position: absolute; top: 180px; left: 1440px;}

	.level3_site1_selector {
		z-index:11;
		cursor:pointer; width: 500px; height: 600px; position: absolute; top: 330px; left: 10px; /*border:2px blue solid;*/
	}
	.level3_site1_selector:hover {
		cursor: pointer;
	}
	.level3_site2_selector {
		z-index:11;
		cursor:pointer; width: 550px; height: 360px; position: absolute; top: 450px; left: 700px; /*border:2px red solid;*/
	}
	.level3_site2_selector:hover {
		cursor: pointer;
	}
	.level3_site3_selector {
		z-index:11;
		cursor:pointer; width: 500px; height: 500px; position: absolute; top: 400px; left: 1400px; /*border:2px green solid;*/
	}
	.level3_site3_selector:hover {
		cursor: pointer;
	}

	.level3_banner {
		display: block;
		border: 1px gray solid;
		background-color: lightgray;
		text-align:center;
		line-height: 300px;
		font-size: 48px;
		opacity: 0.8;
		border-radius: 4px;
		width: 773px;
		height: 300px;
		position: absolute;
		left: 570px;
		top: 16px;
		z-index:10;
	}
	
	#level3_banner_input {
		text-align:center;
		line-height: 300px;
		font-size: 32px;
		background-color: transparent;
		width:100%;
	}
	.level3_banner_close {
		display:none;
		border: 1px black solid;
		background-color: darkgray;
		border-radius: 4px;
		text-align: center;
		font-size: 32px;
		width: 120px;
		position: absolute;
		left: 1225px;
		top: 320px;
		z-index: 12;
	}
	.level3_keyboard {
		display:none;
		border: 1px black solid;
		background-color: darkgray;
		border-radius: 4px;
		width: 773px;
		position: absolute;
		left: 570px;
		top: 360px;
		z-index:12;
	}
	
	@-webkit-keyframes quickFlash {
	  0% {
		background-color: #c0c0c0;
		opacity: 0.6;
	  }
	  100% {
		background-color: inherit;
		opacity: 0;
	  }
	}

	.quickFlash {
	  -webkit-animation-name: quickFlash;
	  -webkit-animation-duration: 1500ms;
	  -webkit-animation-iteration-count: 1;
	  -webkit-animation-timing-function: ease;
	  -moz-animation-name: quickFlash;
	  -moz-animation-duration: 1500ms;
	  -moz-animation-iteration-count: 1;
	  -moz-animation-timing-function: ease;
	}


	.worm-sprite-animation {
		display:none;
		height: 90px;
		width: 90px;
		position:absolute;
		top:270px;
		left:975px;
		z-index:5;
		background-image: url('../assets/sprites/L1_skouliki_00_start.png');
	}

	.level3_box { 
		cursor:pointer; 
		width: 960px; 
		height: 150px; 
		position: absolute; 
    	top: 960px;
    	left: 620px;
		background-image: url('../assets/images/box.png'); 
		background-repeat: no-repeat; 
		background-size: 90px 90px; width: 90px; height:90px; 
	}
	
	
	.level3_index_belt {
		bottom: 0px;
		left: 1060px;
		position: absolute;
		width: 840px;
		height: 140px;
		z-index: 11;
	}
	.level3_index_belt_item {
		position:absolute;
		top:2px;
		width:144px;
		height:144px;
	}
	
	.level3_rootPlacedItem {
		position:absolute;
		width: 144px;
		height: 144px;
		background-size: 144px 144px;
		background-repeat: no-repeat;
	}
	
	.level3_toolbox {
		cursor:pointer; width: 1900px; height: 150px; position: absolute; top: 920px; left: 10px; 
		border:#c0c0c0;
		border-radius: 4px;
		background-color: rgba(127,127,127,0.7);
	}
	.level3_gotoindex {
		cursor:pointer; width: 200px; height: 140px; position: absolute; top: 5px; left: 850px; 
		border:#000;
		border-radius: 4px;
		background-image: url('../assets/images/level3-index/level3_index_thumb.jpg'); 
		background-repeat: no-repeat; 
		background-size: 200px 140px;
		background-position: center top;	
		-webkit-box-shadow: 5px 5px 3px 0px rgba(0,0,0,0.75);
		-moz-box-shadow: 5px 5px 3px 0px rgba(0,0,0,0.75);
		box-shadow: 5px 5px 3px 0px rgba(0,0,0,0.75);
	}
	
	.level3_toolbox_prothiki_1 {
		background-image: url('../assets/images/level3-index/prothiki-1.png'); 
		background-repeat: no-repeat; 
		background-size: 56px 140px;
		background-position: center top;
		width: 56px;
		height:140px;
		position: absolute;
    	top: 5px;
    	left: 20px;
	}
	.prothiki1_large { 
		background-image: url('../assets/images/level3-index/prothiki-1.png'); 
		background-repeat: no-repeat; 
		background-size: 157px 392px;
		background-position: center bottom;
		width: 224px;
		height:560px;
		position: absolute;
    	bottom: 0px;
    	left: 80px;
	}
	
	.level3_toolbox_prothiki_2 {
		background-image: url('../assets/images/level3-index/prothiki-2.png'); 
		background-repeat: no-repeat; 
		background-size: 163px 140px;
		background-position: center top;
		width: 163px;
		height:140px;
		position: absolute;
    	top: 5px;
    	left: 100px;
	}
	.prothiki2_large {
		background-image: url('../assets/images/level3-index/prothiki-2.png'); 
		background-repeat: no-repeat; 
		background-size: 408px 350px;
		background-position: center top;
		width: 408px;
		height:350px;
		position: absolute;
    	bottom: 0px;
    	left: 0px;
	}
	
	.level3_toolbox_prothiki_3 {
		background-image: url('../assets/images/level3-index/prothiki-3.png'); 
		background-repeat: no-repeat; 
		background-size: 105px 140px;
		background-position: center top;
		width: 105px;
		height:140px;
		position: absolute;
    	top: 5px;
    	left: 290px;
	}
	.prothiki3_large {
		background-image: url('../assets/images/level3-index/prothiki-3.png'); 
		background-repeat: no-repeat; 
		background-size: 263px 350px;
		background-position: center top;
		width: 263px;
		height:350px;
		position: absolute;
    	bottom: 0px;
    	left: 60px;
	}
	
	.level3_toolbox_prothiki_4 {
		background-image: url('../assets/images/level3-index/prothiki-4.png'); 
		background-repeat: no-repeat; 
		background-size: 78px 140px;
		background-position: center top;
		width: 78px;
		height:140px;
		position: absolute;
    	top: 5px;
    	left: 420px;
	}
	.prothiki4_large { 
		background-image: url('../assets/images/level3-index/prothiki-4.png'); 
		background-repeat: no-repeat; 
		background-size: 195px 350px;
		background-position: center top;
		width: 195px;
		height:350px;
		position: absolute;
    	bottom: 0px;
    	left: 80px;
	}

	.level3_toolbox_prothiki_5 {
		background-image: url('../assets/images/level3-index/prothiki-5.png'); 
		background-repeat: no-repeat; 
		background-size: 78px 140px;
		background-position: center top;
		width: 78px;
		height:140px;
		position: absolute;
    	top: 5px;
    	left: 530px;
	}
	.prothiki5_large { 
		background-image: url('../assets/images/level3-index/prothiki-5.png'); 
		background-repeat: no-repeat; 
		background-size: 195px 350px;
		background-position: center top;
		width: 195px;
		height:350px;
		position: absolute;
    	bottom: 0px;
    	left: 80px;
	}
	
	.level3_toolbox_prothiki_6 {
		background-image: url('../assets/images/level3-index/vathrο-1.png'); 
		background-repeat: no-repeat; 
		background-size: 78px 140px;
		background-position: center top;
		width: 78px;
		height:140px;
		position: absolute;
    	top: 5px;
    	left: 630px;
	}
	.prothiki6_large { 
		background-image: url('../assets/images/level3-index/vathrο-1.png'); 
		background-repeat: no-repeat; 
		background-size: 135px 240px;
		background-position: center bottom;
		width: 195px;
		height:350px;
		position: absolute;
    	bottom: 0px;
    	left: 80px;
	}
	

	
	.level3_toolbox_prothiki_7 {
		background-image: url('../assets/images/level3-index/vathrο-2.png'); 
		background-repeat: no-repeat; 
		background-size: 78px 140px;
		background-position: center top;
		width: 78px;
		height:140px;
		position: absolute;
    	top: 5px;
    	left: 740px;
	}
	.prothiki7_large { 
		background-image: url('../assets/images/level3-index/vathrο-2.png'); 
		background-repeat: no-repeat; 
		background-size: 135px 240px;
		background-position: center bottom;
		width: 195px;
		height:350px;
		position: absolute;
    	bottom: 0px;
    	left: 80px;
	}
	
	
			
	.level3_prothiki_onhover {
		border: 2px white dashed;
    	border-radius: 4px;
    	background-color: rgba(255,255,255,0.3);
	}
	.level3_site1_prothiki_1 {
		cursor: pointer;
		width: 300px;
		height: 650px;
		position: absolute;
		top: 250px;
		left: 200px;
	}

	.level3_site1_prothiki_2 {
		cursor: pointer;
		width: 400px;
		height: 650px;
		position: absolute;
		top: 250px;
		left:650px;
	}
	
	.level3_site1_prothiki_3 {
		cursor: pointer;
		width: 300px;
		height: 650px;
		position: absolute;
		top: 250px;
		left: 1440px;
	}
		

	
	.level3_site2_prothiki_1 {
		cursor: pointer;
		width: 300px;
		height: 650px;
		position: absolute;
		top: 250px;
		left: 450px;
	}

	.level3_site2_prothiki_2 {
		cursor: pointer;
		width: 400px;
		height: 650px;
		position: absolute;
		top: 250px;
		left:800px;
	}
	
	.level3_site2_prothiki_3 {
		cursor: pointer;
		width: 300px;
		height: 650px;
		position: absolute;
		top: 250px;
		left: 1200px;
	}
	
	

	.level3_site3_prothiki_1 {
		cursor: pointer;
		width: 400px;
		height: 650px;
		position: absolute;
		top: 250px;
		left: 250px;
	}

	.level3_site3_prothiki_2 {
		cursor: pointer;
		width: 400px;
		height: 650px;
		position: absolute;
		top: 250px;
		left:750px;
	}
	
	.level3_site3_prothiki_3 {
		cursor: pointer;
		width: 400px;
		height: 650px;
		position: absolute;
		top: 250px;
		left: 1250px;
	}

	

	.level3_index_figure1 {
		background-image: url('../assets/images/level3-index/fylakas.png'); 
		background-repeat: no-repeat; 
		background-size: 158px 280px;
		background-position: center top;
		width: 158px;
		height:280px;
		position: absolute;
    	top: 700px;
    	left: 1200px;
	}	

	.level3_index_figure2 {
		background-image: url('../assets/images/level3-index/mouseiologos.png'); 
		background-repeat: no-repeat; 
		background-size: 158px 280px;
		background-position: center top;
		width: 158px;
		height:280px;
		position: absolute;
    	top: 800px;
    	left: 1100px;
	}	
	
	.level3_index_figure3 {
		/*background-image: url('../assets/images/level3-index/arxaiologos-gynaika.png'); */
		background-repeat: no-repeat; 
		background-size: 158px 280px;
		background-position: center top;
		width: 158px;
		height:280px;
		position: absolute;
    	top: 800px;
    	left: 700px;
	}	
	.level3_index_figure3_woman {
		background-image: url('../assets/images/level3-index/arxaiologos-gynaika.png'); 
	}
	.level3_index_figure3_man {
		background-image: url('../assets/images/level3-index/arxaiologos-andras.png'); 
	}
	
	.level3_index_figure4 {
		background-image: url('../assets/images/level3-index/syntiritis-kerameikon.png'); 
		background-repeat: no-repeat; 
		background-size: 158px 280px;
		background-position: center top;
		width: 158px;
		height:280px;
		position: absolute;
    	top: 800px;
    	left: 780px;
    	z-index: 12;
	}
	
	.level3_index_figure5 {
		background-image: url('../assets/images/level3-index/syntiritis-marmarou.png'); 
		background-repeat: no-repeat; 
		background-size: 158px 280px;
		background-position: center top;
		width: 158px;
		height:280px;
		position: absolute;
    	top: 700px;
    	left: 860px;
    	z-index: 12;
	}

	
	.level3_index_figure6 {
		background-image: url('../assets/images/level3-index/syntiritis-metalou.png'); 
		background-repeat: no-repeat; 
		background-size: 158px 280px;
		background-position: center top;
		width: 158px;
		height:280px;
		position: absolute;
    	top: 760px;
    	left: 940px;
    	z-index: 12;
	}
	
	
	
	.level3_index_figure1_message {
		background-image: url(../assets/images/bubleLong_L.png);
		display: none;
		background-repeat: no-repeat;
		background-size: 495px 170px;
		width: 495px;
		height: 170px;
		position: relative;
    	top: 560px;
    	left: 850px;
		z-index: 22;
	}
	.level3_index_figure2_message {
		background-image: url(../assets/images/bubleLong_L.png);
		display: none;
		background-repeat: no-repeat;
		background-size: 495px 170px;
		width: 495px;
		height: 170px;
		position: relative;
		top: 670px;
   	 	left: 740px;
		z-index: 22;
	}
	.level3_index_figure3_message {
		background-image: url(../assets/images/bubleLong_L.png);
		display: none;
		background-repeat: no-repeat;
		background-size: 495px 170px;
		width: 495px;
		height: 170px;
		position: relative;
    	top: 670px;
    	left: 340px;
		z-index: 22;
	}
	.level3_index_figure4_message {
		background-image: url(../assets/images/bubleLong_L.png);
		display: none;
		background-repeat: no-repeat;
		background-size: 495px 170px;
		width: 495px;
		height: 170px;
		position: relative;
    	top: 670px;
    	left: 420px;
		z-index: 22;
	}
	.level3_index_figure5_message {
		background-image: url(../assets/images/bubleLong_L.png);
		display: none;
		background-repeat: no-repeat;
		background-size: 495px 170px;
		width: 495px;
		height: 170px;
		position: relative;
		top: 580px;
		left: 490px;
		z-index: 22;
	}
	.level3_index_figure6_message {
		background-image: url(../assets/images/bubleLong_L.png);
		display: none;
		background-repeat: no-repeat;
		background-size: 495px 170px;
		width: 495px;
		height: 170px;
		position: relative;
		top: 630px;
		left: 580px;
		z-index: 22;
	}
	
	
				
	
	
		
	.level3_site1_placeholder1 {
		width: 150px; height: 360px; position: absolute; top: 700px; left: 100px; /*border:2px red solid;*/
	}
	.level3_site1_placeholder2 {
		width: 150px; height: 360px; position: absolute; top: 600px; left: 300px; /*border:2px red solid;*/
	}
	.level3_site1_placeholder3 {
		width: 150px; height: 360px; position: absolute; top: 550px; left: 550px; /*border:2px red solid;*/
	}
			
	.level3_site2_placeholder1 {
		width: 150px; height: 360px; position: absolute; top: 450px; left: 700px; /*border:2px red solid;*/
	}
	.level3_site2_placeholder2 {
		width: 150px; height: 360px; position: absolute; top: 450px; left: 840px; /*border:2px red solid;*/
	}
	.level3_site2_placeholder3 {
		width: 150px; height: 360px; position: absolute; top: 450px; left: 1100px; /*border:2px red solid;*/
	}
			
	.level3_site3_placeholder1 {
		width: 150px; height: 360px; position: absolute; top: 550px; left: 1300px; /*border:2px red solid;*/
	}
	.level3_site3_placeholder2 {
		width: 150px; height: 360px; position: absolute; top: 600px; left: 1520px; /*border:2px red solid;*/
	}
	.level3_site3_placeholder3 {
		width: 150px; height: 360px; position: absolute; top: 650px; left: 1700px; /*border:2px red solid;*/
	}	
	
	

	.boxPanel3 {
		display:none;
		background-image: url('../assets/images/mainWindow.png'); 
		background-repeat: no-repeat; 
		background-size: 640px 622px;
		width: 640px;
		height:622px;
		position: absolute;
		top: 90px;
		left: 570px;
		z-index:12;
	}
	.mIconBox3 {
		background-image: url('../assets/images/popup_box.png'); 
		background-repeat: no-repeat; 
		background-size: 87px 87px;
		width: 87px;
		height:87px;
		position: absolute;
    	top: -30px;
    	left: 590px;
		z-index:12;
	}
	.mSketchBack3 {
		background-image: url(../assets/images/left-arrow.png);
		background-repeat: no-repeat;
		background-size: 69px 43px;
		width: 69px;
		height: 43px;
		position: absolute;
    	top: 550px;
    	left: 240px;
		z-index: 12;
		cursor: pointer;
		display:none;
	}
	
	
	
	
		
			
		


	.labPanel {
		display:none;
		background-image: url('../assets/images/popUpWindow.png'); 
		background-repeat: no-repeat; 
		background-size: 976px 631px;
		width: 976px;
		height:631px;
		position: absolute;
		top: 30px;
		left: 480px;
		z-index:12;
	}
	.mIconLab {
		display:block;
		background-image: url('../assets/images/popup_box.png'); 
		background-repeat: no-repeat; 
		background-size: 87px 87px;
		width: 87px;
		height:87px;
		position: absolute;
    	top: -30px;
    	left: 920px;
		z-index:12;
		cursor:pointer;
	}
	.mLabTools {
		width: 120px;
		height: 600px;
		position: absolute;
		top: 20px;
		left: 40px;
		z-index:12;
		overflow-y:auto;
		overflow-x:none;	
	}
	.mLabBody {
		width: 630px;
    	height: 450px;
    	position: absolute;
    	top: 100px;
    	left: 180px;
		z-index:12;
		overflow-y:auto;
		overflow-x:none;	
	}
	.mLabObjects {
		width: 100px;
		height: 400px;
		position: absolute;
		top: 50px;
		right: 40px;
		z-index:12;
		overflow-y:auto;
		overflow-x:none;	
	}
	.mLabTool_brush {
		background-image: url('../assets/images/ergaleia/lekani_OFF.png'); 
		background-repeat: no-repeat; 
		background-size: 87px 87px;
		background-position: center top;
		width: 87px;
		height:87px;
		position: absolute;
    	top: 0px;
    	left: 0px;
	}
	.mLabTool_brush:hover {
		border-color:rgb(168,167,212);
		background-image: url('../assets/images/ergaleia/lekani_ON.png'); 
	}
	.mLabTool_batoneta {
		background-image: url('../assets/images/ergaleia/buttonete_OFF.png'); 
		background-repeat: no-repeat; 
		background-size: 87px 87px;
		background-position: center top;
		width: 87px;
		height:87px;
		position: absolute;
    	top: 400px;
    	left: 0px;
	}
	.mLabTool_batoneta:hover {
		border-color:rgb(168,167,212);
		background-image: url('../assets/images/ergaleia/buttonete_ON.png'); 
	}
	.mLabTool_pinelo {
		background-image: url('../assets/images/ergaleia/pinelo_OFF.png'); 
		background-repeat: no-repeat; 
		background-size: 87px 87px;
		background-position: center top;
		width: 87px;
		height:87px;
		position: absolute;
    	top: 0px;
    	left: 0px;
	}
	.mLabTool_pinelo:hover {
		border-color:rgb(168,167,212);
		background-image: url('../assets/images/ergaleia/pinelo_ON.png'); 
	}	
	
	.mLabTool_nysteri {
		background-image: url('../assets/images/ergaleia/nisteri_OFF.png'); 
		background-repeat: no-repeat; 
		background-size: 87px 87px;
		background-position: center top;
		width: 87px;
		height:87px;
		position: absolute;
    	top: 100px;
    	left: 0px;
	}
	.mLabTool_nysteri:hover {
		border-color:rgb(168,167,212);
		background-image: url('../assets/images/ergaleia/nisteri_ON.png'); 
	}
	.mLabTool_kolla {
		background-image: url('../assets/images/ergaleia/Kolla-solinario_OFF.png'); 
		background-repeat: no-repeat; 
		background-size: 87px 87px;
		background-position: center top;
		width: 87px;
		height:87px;
		position: absolute;
    	top: 200px;
    	left: 0px;
	}
	.mLabTool_kolla:hover {
		border-color:rgb(168,167,212);
		background-image: url('../assets/images/ergaleia/Kolla-solinario_ON.png'); 
	}
	.mLabTool_tsimento {
		background-image: url('../assets/images/ergaleia/kolla_tsimedou_OFF.png'); 
		background-repeat: no-repeat; 
		background-size: 87px 87px;
		background-position: center top;
		width: 87px;
		height:87px;
		position: absolute;
    	top: 200px;
    	left: 0px;
	}
	.mLabTool_tsimento:hover {
		border-color:rgb(168,167,212);
		background-image: url('../assets/images/ergaleia/kolla_tsimedou_ON.png'); 
	}
	.mLabTool_gypsos {
		background-image: url('../assets/images/ergaleia/kolla_gipsou_OFF.png'); 
		background-repeat: no-repeat; 
		background-size: 87px 87px;
		background-position: center top;
		width: 87px;
		height:87px;
		position: absolute;
    	top: 300px;
    	left: 0px;
	}
	.mLabTool_gypsos:hover {
		border-color:rgb(168,167,212);
		background-image: url('../assets/images/ergaleia/kolla_gipsou_ON.png'); 
	}
	.mLabTool_stereotiko {
		background-image: url('../assets/images/ergaleia/Stereotiko_OFF.png'); 
		background-repeat: no-repeat; 
		background-size: 87px 87px;
		background-position: center top;
		width: 87px;
		height:87px;
		position: absolute;
    	top: 300px;
    	left: 0px;
	}
	.mLabTool_stereotiko:hover {
		border-color:rgb(168,167,212);
		background-image: url('../assets/images/ergaleia/Stereotiko_ON.png'); 
	}
	
	
	.mLabTool {
		width: 110px;
    	height: 90px;
    	position: absolute;
    	border:1px solid black;
    	text-align:center;
		color: rgb(114,131,164);
		font-family: "Comic Sans MS", "Comic Sans";
		font-size: 14px;
		font-weight: bold;	
	}
	.mLabTool:hover {
		cursor:pointer;		
	}
	.mLabTool_text {
		width: 110px;
		height: 20px;
		top: 74px;
		line-height: 20px;
		position: absolute;
		left: 0px;
		text-align: center;
		color: rgb(114,131,164);
		font-family: "Comic Sans MS", "Comic Sans";
		font-size: 10px;
		font-weight: bold
	}
	
	.frame0 {
		width:90px; height:90px;
		background-size: 90px 90px;
		position: absolute;
   		top: 0;
    	left: 0;
	}
	.frame1 {
		width:480px; height:441px;
		background-size: 480px 441px;
		position: absolute;
   		top: 0;
    	left: 0;
	}
	.frame2 {
		display:none;
		width:480px; height:441px;
		background-size: 480px 441px;
		position: absolute;
   		top: 0;
    	left: 0;	
	}
	.frame3 {
		display:none;
		width:480px; height:441px;
		background-size: 480px 441px;	
		position: absolute;
   		top: 0;
    	left: 0;
	}
	.frame4 {
		display:none;
		width:480px; height:441px;
		background-size: 480px 441px;	
		position: absolute;
   		top: 0;
    	left: 0;
	}
	.frame5 {
		display:none;
		width:480px; height:441px;
		background-size: 480px 441px;	
		position: absolute;
   		top: 0;
    	left: 0;
	}
	
	.noiseImage1 {
		background-image: url('../assets/images/img-noise-213x196.png'); 
		background-repeat: no-repeat; 
		width:320px; height:294px;
		background-size: 320px 294px;	
	}
	.noiseImage2 {
		background-image: url('../assets/images/img-noise-213x196_.png'); 
		background-repeat: no-repeat; 
		width:320px; height:294px;
		background-size: 320px 294px;	
	}
	.noiseImage3 {
		background-image: url('../assets/images/img-noise-213x196__.png'); 
		background-repeat: no-repeat; 
		width:320px; height:196px;
		background-size: 320px 294px;	
	}
	.noiseImage4 {
		background-image: url('../assets/images/img-noise-213x196___.png'); 
		background-repeat: no-repeat; 
		width:320px; height:294px;
		background-size: 320px 294px;	
	}




	.boxPanel2 {
		display:none;
		background-image: url('../assets/images/mainWindow.png'); 
		background-repeat: no-repeat; 
		background-size: 640px 622px;
		width: 640px;
		height:622px;
		position: absolute;
		top: 90px;
		left: 570px;
		z-index:12;
	}
	.mIconBox2 {
		background-image: url('../assets/images/popup_box.png'); 
		background-repeat: no-repeat; 
		background-size: 87px 87px;
		width: 87px;
		height:87px;
		position: absolute;
    	top: -30px;
    	left: 590px;
		z-index:12;
	}
	.mSketchBack2 {
		background-image: url(../assets/images/left-arrow.png);
		background-repeat: no-repeat;
		background-size: 69px 43px;
		width: 69px;
		height: 43px;
		position: absolute;
    	top: 570px;
    	left: 240px;
		z-index: 12;
		cursor: pointer;
		display:none;
	}
	.mSketchNext2 {
		background-image: url(../assets/images/right-arrow.png);
		background-repeat: no-repeat;
		background-size: 69px 43px;
		width: 69px;
		height: 43px;
		position: absolute;
    	top: 570px;
    	left: 320px;
		z-index: 12;
		cursor: pointer;
		display:none;
	}
	
}   


.main_container {
	width:100%;
	height:100%;
}

.center {
    margin: auto;
    width: 50%;
    border: 3px solid green;
    padding: 10px;
}

.d-none {
	display:none;
}

.border-dashed {
		border: 1px #E18223 dashed;
}