﻿body {
	background: #37322c;
}

img {
	border: none;
}

.png {/*filter:expression(fixPNG(this));*/}

/* GLOBAL */
#izometry {
	background: url(isometry_bg.png) no-repeat;
	height: 248px;
	position: relative;
	width: 163px;
	margin-left:20%;
	--overflow-y: hidden;
}

#izometry .roof {
	left: 22px;
	position: absolute;
	z-index: 3;
}
#izometry .roof, #izometry .roof img {
	width: 136px;
	height: 112px;
}

#izometry img.map, #izometry .active, #izometry .hover {
	position: absolute;
	overflow: hidden;
}

#izometry img.floor {
	position: absolute;
	top: -1px;
}

#izometry .floor_canvas {
	position: absolute;
	top: -1px;
	visibility: hidden;
}

#izometry .active canvas, #izometry .active div.ictinus {
	top: -200%;
}
#izometry .hover canvas, #izometry .hover div.ictinus {
	top: -100%;
}

#izometry .map {
	position: absolute;
	z-index: 10;
}

.not_display {
	visibility: hidden;
}


/* Floor 0 */
#izometry.floor_0 .floor, #izometry.floor_0 img.map, #izometry.floor_0 .active, #izometry.floor_0 .hover {
	left: 37px;
	top: 129px;
}
#izometry.floor_0 img.floor {
	clip: rect(0 103px 96px 0);
	width: 103px;
	height: 288px;
}
#izometry.floor_0 img.map, #izometry.floor_0 .active, #izometry.floor_0 .hover {
	height: 96px;
	width: 103px;
}

/* Floor 1 */
#izometry.floor_1 .floor, #izometry.floor_1 img.map, #izometry.floor_1 .active, #izometry.floor_1 .hover {
	left: 37px;
	top: 120px;
}
#izometry.floor_1 .active, #izometry.floor_1 .hover {
	--top: 118px;
}

#izometry.floor_1 img.floor {
	clip: rect(0 104px 105px 0);
	width: 104px;
	height: 315px;
}
#izometry.floor_1 img.map, #izometry.floor_1 .active, #izometry.floor_1 .hover {
	height: 105px;
	width: 104px;
}

/* Floor 2 */
#izometry.floor_2 .floor, #izometry.floor_2 img.map, #izometry.floor_2 .active, #izometry.floor_2 .hover {
	left: 35px;
	top: 108px;
}
#izometry.floor_2 .active, #izometry.floor_2 .hover {
	--top:106px;
}
#izometry.floor_2 img.floor {
	clip: rect(0 107px 117px 0);
	width: 107px;
	height: 351px;
}
#izometry.floor_2 img.map, #izometry.floor_2 .active, #izometry.floor_2 .hover {
	height: 117px;
	width: 107px;
}

/* Floor 3 */
#izometry.floor_3 .floor, #izometry.floor_3 img.map, #izometry.floor_3 .active, #izometry.floor_3 .hover {
	left: 33px;
	top: 93px;
}
#izometry.floor_3 .active, #izometry.floor_3 .hover {
	--top:92px;
}
#izometry.floor_3 img.floor {
	clip: rect(0 112px 132px 0);
	width: 112px;
	height: 396px;
}
#izometry.floor_3 img.map, #izometry.floor_3 .active, #izometry.floor_3 .hover {
	height: 132px;
	width: 112px;
}

/* Floor 4 */
#izometry.floor_4 .floor, #izometry.floor_4 img.map, #izometry.floor_4 .active, #izometry.floor_4 .hover {
	left: 31px;
	top: 78px;
}
#izometry.floor_4 .active {
	--top:76px;
}
#izometry.floor_4 .hover {
	--top:76px;
}
#izometry.floor_4 img.floor {
	clip: rect(0 117px 147px 0);
	width: 117px;
	height: 441px;
}
#izometry.floor_4 img.map, #izometry.floor_4 .active, #izometry.floor_4 .hover {
	height: 147px;
	width: 117px;
}

/* Floor 5 */
#izometry.floor_5 .floor, #izometry.floor_5 img.map, #izometry.floor_5 .active, #izometry.floor_5 .hover {
	left: 29px;
	top: 66px;
}
#izometry.floor_5 .hover {
	--top: 65px;
}
#izometry.floor_5 .active {
	--top:64px;
}
#izometry.floor_5 img.floor {
	clip: rect(0 124px 159px 0);
	width: 124px;
	height: 477px;
}
#izometry.floor_5 img.map, #izometry.floor_5 .active, #izometry.floor_5 .hover {
	height: 159px;
	width: 124px;
}


/* Floor numbers */
#numbers, #numbers li {
	margin: 0;
	padding: 0;
}

#numbers {
	left: 15px;
	position: absolute;
	top: 73px;
}

#numbers li {
	clear: both;
	height: 16px;
	list-style: none;
	margin-bottom: 8px;
	//margin-bottom: 2px;
	overflow: hidden;
	position: relative;
}

#numbers li a, #numbers li strong {
	background: url("floor_numbers.png") -1000px 0 no-repeat;
	display: block;
	height: 20px;
	width: 20px;
	overflow: hidden;
	position: relative;
	text-align: center;
}

#numbers li a:hover {
	background-position: 0 -140px !important;
}

#numbers li.selected a, #numbers li.selected strong {
	background-position: 0 -120px;
	cursor: auto;
}

#numbers li a span, #numbers li strong span {
	background: url("floor_numbers.png") 0 0 no-repeat;
	cursor: pointer;
	height: 0;
	left: 0;
	width: 20px;
	overflow: hidden;
	padding-top: 20px;
	position: absolute;
	top: 4px;
}

#numbers li strong span {
	cursor: auto;
}

#numbers .floor_5 {left: -25px;}
#numbers .floor_5 a span, #numbers .floor_5 strong span {top: 3px;}

#numbers .floor_4 {left: -20px;}
#numbers .floor_4 a span, #numbers .floor_4 strong span {background-position: 0 -20px;}

#numbers .floor_3 {left: -15px;}
#numbers .floor_3 a span, #numbers .floor_3 strong span {background-position: 0 -40px;}

#numbers .floor_2 {left: -10px;}
#numbers .floor_2 a span, #numbers .floor_2 strong span {background-position: 0 -60px;}

#numbers .floor_1 {left: -5px;}
#numbers .floor_1 a span, #numbers .floor_1 strong span {background-position: 0 -80px;}

#numbers .floor_0 a span, #numbers .floor_0 strong span {background-position: 0 -100px;}


.address {
	color: #9b9996;
	font-style: italic;
	font-size: 75%;
	left: -10px;
	position: absolute;
	top: 220px;
}
.address .number span {
	padding: 0 0.15em;
}