
.wrapper {background-image: url('images/bg.jpg');font-family: RobotoRegular;}
	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;}

			.element_1 {background:url(images/puzzle1.png); z-index: 200;}
                        .element_2 {background:url(images/puzzle2.png); z-index: 200;}
                        .element_3 {background:url(images/puzzle3.png); z-index: 200;}
                        .element_4 {background:url(images/puzzle4.png); z-index: 200;}
                        .element_5 {background:url(images/puzzle5.png); z-index: 200;}
                        .element_6 {background:url(images/puzzle6.png); z-index: 200;}
                        .element_7 {background:url(images/puzzle7.png); z-index: 200;}
                        .element_8 {background:url(images/puzzle8.png); z-index: 200;}
                        .element_9 {background:url(images/puzzle9.png); z-index: 200;}
                        .element_10 {background:url(images/puzzle10.png); z-index: 200;}
                        .element_11 {background:url(images/puzzle11.png); z-index: 200;}
                        .element_12 {background:url(images/puzzle12.png); z-index: 200;}
                        .element_13 {background:url(images/puzzle13.png); z-index: 200;}
                        .element_14 {background:url(images/puzzle14.png); z-index: 200;}
                        .element_15 {background:url(images/puzzle15.png); z-index: 200;}
                        .element_16 {background:url(images/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;}
		div.hint {display:none;position:fixed;top:50%;left:50%;content:"";width:250px;height:250px;background:#FFF url(images/hint.png);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;}
	@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; }