.wrapper {background-image: url('images/bg.jpg')}
	main {width:1024px;height:605px;margin:15px auto 0;overflow:hidden;position:relative;}

		.elements {position:absolute;top:32px;right:0;bottom:0;left:480px;width:473px;height:473px;}
		.boxes {position:absolute;top:30px;right:0;bottom:0;left:240px;width:473px;height:473px;border:1px solid #91A2A6;}

		.elements > *, .boxes > * {float:left;width:163px;height:163px;}

		.boxes {background: white; left:4px;border:1px solid #91A2A6;}
		.boxes:after {position:absolute;top:50%;left:50%;content:attr(data-info);width:150px;color:#D5D5D5;font-size: 15px; text-align:center;margin:-10px 0 0 -75px;z-index:5;}
			.boxes .ok {position:relative;z-index:10;}

		.elements {right:10px;}

		.turn0 .element_1 {background:url(images/puzzle1.png); z-index: 200;}
                .turn0 .element_2 {background:url(images/puzzle2.png); z-index: 200;}
                .turn0 .element_3 {background:url(images/puzzle3.png); z-index: 200;}
                .turn0 .element_4 {background:url(images/puzzle4.png); z-index: 200;}
                .turn0 .element_5 {background:url(images/puzzle5.png); z-index: 200;}
                .turn0 .element_6 {background:url(images/puzzle6.png); z-index: 200;}
                .turn0 .element_7 {background:url(images/puzzle7.png); z-index: 200;}
                .turn0 .element_8 {background:url(images/puzzle8.png); z-index: 200;}
                .turn0 .element_9 {background:url(images/puzzle9.png); z-index: 200;}
                .turn0 .element_10 {background:url(images/puzzle10.png); z-index: 200;}
                .turn0 .element_11 {background:url(images/puzzle11.png); z-index: 200;}
                .turn0 .element_12 {background:url(images/puzzle12.png); z-index: 200;}
                .turn0 .element_13 {background:url(images/puzzle13.png); z-index: 200;}
                .turn0 .element_14 {background:url(images/puzzle14.png); z-index: 200;}
                .turn0 .element_15 {background:url(images/puzzle15.png); z-index: 200;}
                .turn0 .element_16 {background:url(images/puzzle16.png); z-index: 200;}

		.turn1 .element_1 {background:url(images/turn1/puzzle1.png); z-index: 200;}
                .turn1 .element_2 {background:url(images/turn1/puzzle2.png); z-index: 200;}
                .turn1 .element_3 {background:url(images/turn1/puzzle3.png); z-index: 200;}
                .turn1 .element_4 {background:url(images/turn1/puzzle4.png); z-index: 200;}
                .turn1 .element_5 {background:url(images/turn1/puzzle5.png); z-index: 200;}
                .turn1 .element_6 {background:url(images/turn1/puzzle6.png); z-index: 200;}
                .turn1 .element_7 {background:url(images/turn1/puzzle7.png); z-index: 200;}
                .turn1 .element_8 {background:url(images/turn1/puzzle8.png); z-index: 200;}
                .turn1 .element_9 {background:url(images/turn1/puzzle9.png); z-index: 200;}
                .turn1 .element_10 {background:url(images/turn1/puzzle10.png); z-index: 200;}
                .turn1 .element_11 {background:url(images/turn1/puzzle11.png); z-index: 200;}
                .turn1 .element_12 {background:url(images/turn1/puzzle12.png); z-index: 200;}
                .turn1 .element_13 {background:url(images/turn1/puzzle13.png); z-index: 200;}
                .turn1 .element_14 {background:url(images/turn1/puzzle14.png); z-index: 200;}
                .turn1 .element_15 {background:url(images/turn1/puzzle15.png); z-index: 200;}
                .turn1 .element_16 {background:url(images/turn1/puzzle16.png); z-index: 200;}

		a.hint {position:absolute;bottom:75px;left:24%;display:block;width:185px;color:#0D7AFC; font-weight: bold;font-size: 15px;text-align:center;margin-left:-75px;z-index:250;}
		a.hint:hover {text-decoration:none;}
		.turn1 div.hint {background-image:url(images/turn1/hint.png)}
		.turn0 div.hint {background-image:url(images/hint.png)}
		div.hint {display:none;position:fixed;top:50%;left:50%;content:"";width:250px;height:250px;background:#FFF;border:1px solid #888;margin:-230px 0 0 -127px;z-index:300;}
		.description {width: auto; height: auto; position: absolute; left: 440px; top: 50px; cursor: pointer; font-size: 25px; color: #0D7AFC;}
	// turn 2
		main .turn2  {}
	
		.turn2 main {position:relative;}
		.turn2 main > * {position:absolute;}
		.natural {display:none;width:468px;height:468px;background:url(images/natural.png);left:28px;top:28px}
		.cultural {display:none;width:468px;height:468px;background:url(images/cultural.png);right:28px;top:28px}
		.dragg {display:none;left:412px;font-family:arial;font-size:19px;font-weight:bold;cursor:pointer;width:200px;height:19px;text-align:center;}
		#d0 {top:513px}
		#d1 {top:543px}
		.target {display:none;top:520px;width:240px;height:40px;background:gray;border-radius:10px;}
		#t0 {left:142px}
		#t1 {right:142px}
	@font-face { font-family: 'RobotoRegular'; src: url(./fonts/Roboto-Regular.ttf); }
.image-icon { margin-left: 10px; float: left; width: 23px; height: 18px; background: url('images/sprite.png') -10px -37px; }