html {
	height:100%;
}
body {
	background-color:#ffffff;
	margin:0;
	height:100%;
	font-family: 'Lato', sans-serif;
}



#mapWrapper{
	background-color:#000000;
	margin:auto;
	position:absolute;
	top:0;
	width:2160px;
	height:2880px;
	overflow:hidden;
}
.flipped #mapWrapper{
	top:960px;
}
.panel{
	position:absolute;
	left:1277.222px;
	top:893.702px;
	/*
	width:311.901px;
	height:544.274px;
	*/
	width:618px;
	height:1090px;
	z-index:10;
}

#atoz{
	background:#000000;
}
#atoz ol{
	margin:0;
	padding:0;
}	
#atoz ol li{
	display:block;
	float:left;
	width:150px;
	height:150.6px;
	background:#222222;
	color:#000000;
	font-size:60px;
	line-height:150px;
	font-weight:600;
	text-align:center;
	margin:0 6px 6px 0;
	cursor:pointer;
	color:#444444;
}
#atoz ol li.active{
	color:lightgrey;
}
#atoz ol li:nth-child(4n){
	margin:0 0 6px 0;
}
#atoz ol li.active:active{
	background:#333333;
	color:#ffffff;
}
#atoz ol li.active:hover{
	background:#333333;
	color:#ffffff;
}

#atozList{
	background:#ffffff;
	display:none;
}
#atozList .close{
	position: absolute;
    top: 0;
    right: 0;
    padding: 6px 16px;
    font-size: 40px;
    font-weight: 600;
    background: lightgrey;
    color: white;
	cursor:pointer;
}
#atozList ul{
	padding:30px;
	margin:40px 0;
	list-style-type: none;
}
#atozList ul li{
	margin:0 0 1em 0;
	line-height:1.3em;
	font-size:34px;
	font-weight:600;
	cursor:pointer;
	display:none;
}
#atozList ul li:active{
	opacity:0.8;
}

.info{
	background:#ffffff;
	display:none;
}
.info .inner{
	padding:30px;
}
.info .inner img{
	width:100%;
	margin:20px 0 40px 0;
}
.info .inner .logo{
	text-align:center;
}
.info .inner .logo img{
	width:auto;
	height:auto;
	margin:0;
    max-height: 160px;
    max-width: 100%;
}
.info p{
	margin:0 2px 1em 2px;
	line-height:1.3em;
	font-size:28px;
}
.info ul {
	margin:0;
	padding:0 0 0 50px;
}
.info li{
	margin:0 0 0.25em 0;
	line-height:1.3em;
	font-size:24px;
}
.info li a{
	cursor:pointer;
}
.info .close{
	position: absolute;
    top: 0;
    right: 0;
    padding: 6px 16px;
    font-size: 40px;
    font-weight: 600;
    background: lightgrey;
    color: white;
	cursor:pointer;
}
.info h1{
    margin: 0;
    height: 160px;
    line-height: 1.3em;
    font-size: 58px;
    text-align: center;
    vertical-align: middle;
    display: table-cell;
    width: 1000px;
}


/*
.panel p{
	color:black;
}
*/

.room{
	cursor:pointer;
	z-index:1;
}
.room-route{
	display:none;
	z-index:3;
}

.office{
	cursor:pointer;
	z-index: 1; 
}	
.office .logoWrapper{
	position:absolute;
}
.office .logoWrapper img{
	width:140px;
	height:140px;
	z-index:20;
	position:absolute;
}
#office-1 .logoWrapper img{
	margin:20px 0 0 60px;
}
#office-2 .logoWrapper img{
	margin:26px 0 0 60px;
}
#office-3 .logoWrapper img{
	margin:20px 0 0 60px;
}
#office-4 .logoWrapper img{
	margin:26px 0 0 60px;
}
#office-5 .logoWrapper img{
	margin:20px 0 0 60px;
}
#office-6 .logoWrapper img{
	margin:20px 0 0 60px;
}
#office-7 .logoWrapper img{
	margin:26px 0 0 60px;
}
#office-8 .logoWrapper img{
	margin:126px 0 0 152px;
}
#office-9 .logoWrapper img{
	margin:120px 0 0 144px;
}
#office-10 .logoWrapper img{
	margin:120px 0 0 144px;
}
#office-11 .logoWrapper img{
	margin:60px 0 0 134px;
}
#office-12 .logoWrapper img{
	margin:15px 0 0 60px;
}



.office .logoWrapper img.logoColour{
	display:none;
}
	
.mapElements{
	position: absolute; 
	top: 0px; 
	left: 0px; 
	width: 100%; 
	height: 100%; 
	pointer-events: none; 
	z-index: 1;
}
.mapElements  div{
	pointer-events: auto; 
	position: absolute; 
	background-repeat: no-repeat; 
	overflow: visible; 
	background-size: 100% 100%; 
	
	/*display: inline;*/
	transform-origin: 50% 50% 0px; 		
}
.mapElements  div div{
	width:100%;
	height:100%;
}

#overlay{
	position: absolute; 
	top: 0px; 
	left: 0px; 
	width: 100%; 
	height: 100%;
	z-index:0;
	background:#000000;
	opacity:0.4;
}
.roomOverlay{
	position: absolute; 
	top: 0px; 
	left: 0px; 
	width: 100%; 
	height: 100%;
	z-index:0;
	background:#000000;
	opacity:0.4;
	display:none;
	cursor:default;
}





#baseMap{
	background-image: url(resources/baseMap-v2.svg); 
	width: 2160px; 
	height: 2880px; 
	transform: translateX(0px) translateY(0px) rotateY(0deg);
	z-index:1;
}
#watersEdgeLogo{
	position:absolute;
	background-image: url(resources/watersEdgeLogo.svg); 
	background-repeat: no-repeat; 
	width: 623.592px; 
	height: 329.688px; 
	transform: translateX(1277.328px) translateY(221.808px) rotateY(0deg);
	z-index:2;	
}



#office-1{
	width: 262.352px; 
	height: 181.44px; 
	transform: translateX(255.47px) translateY(1042.174px) rotateY(0deg);
}
#office-1-route{
	width: 41.32px; 
	height: 939.34px;
	transform: translateX(522px) translateY(1139.66px) rotateY(0deg);
	background-image: url(resources/office-1-route.svg);
}

#office-2{
	width: 262.352px; 
	height: 192.676px;
	transform: translateX(255.47px) translateY(1211.614px) rotateY(0deg);
	
}
#office-2-route{
	width: 40.82px; 
	height: 759.34px;
	transform: translateX(522px) translateY(1299.66px) rotateY(0deg);
	background-image: url(resources/office-2-route.svg);
}

#office-3{
	width: 262.352px; 
	height: 171.736px;
	transform: translateX(255.47px) translateY(1392.292px) rotateY(0deg);
	
}
#office-3-route{
	width: 40.3px; 
	height: 579.34px;
	transform: translateX(522px) translateY(1475.66px) rotateY(0deg);
	background-image: url(resources/office-3-route.svg);
}

#office-4{
	width: 262.352px; 
	height: 185.86px;
	transform: translateX(255.47px) translateY(1552.026px) rotateY(0deg);
	
}
#office-4-route{
	width: 39.84px; 
	height: 419.34px;
	transform: translateX(522px) translateY(1637.66px) rotateY(0deg);
	background-image: url(resources/office-4-route.svg);
}

#office-5{
	width: 262.352px; 
	height: 178.486px;
	transform: translateX(255.47px) translateY(1725.886px) rotateY(0deg);
	
}
#office-5-route{
	width: 39.32px; 
	height: 239.34px;
	transform: translateX(522px) translateY(1815.66px) rotateY(0deg);
	background-image: url(resources/office-5-route.svg);
}

#office-6{
	width: 262.352px; 
	height: 173.906px; 
	transform: translateX(255.47px) translateY(1892.372px) rotateY(0deg);
	
}
#office-6-route{
	width: 38.86px;
	height: 79.34px;
	transform: translateX(522px) translateY(1975.66px) rotateY(0deg);
	background-image: url(resources/office-6-route.svg);
}

#office-7{
	width: 262.352px; 
	height: 184.168px; 
	transform: translateX(255.47px) translateY(2054.278px) rotateY(0deg);
	
}
#office-7-route{
	width: 41px;
	height: 20.834px;
	transform: translateX(522px) translateY(2149px) rotateY(0deg);
	background-image: url(resources/office-7-route.svg);
}

#office-8{
	width: 334.88px; 
	height: 394.814px; 
	transform: translateX(757.968px) translateY(1979.58px) rotateY(0deg);
	
}
#office-8-route{
	width: 186.66px; 
	height: 65px;
	transform: translateX(558.32px) translateY(2013px) rotateY(0deg);
	background-image: url(resources/office-8-route.svg);
}


#office-9{
	width: 334.88px; 
	height: 388.494px; 
	transform: translateX(757.968px) translateY(1603.086px) rotateY(0deg);
	
}
#office-9-route{
	width: 186.68px; 
	height: 323.98px;
	transform: translateX(558.32px) translateY(1754.02px) rotateY(0deg);
	background-image: url(resources/office-9-route.svg);
}


#office-10{
	width: 334.88px; 
	height: 380.584px; 
	transform: translateX(757.968px) translateY(1234.502px) rotateY(0deg);
	
}

#office-10-route{
	width: 186.68px; 
	height: 624px;
	transform: translateX(558.32px) translateY(1454px) rotateY(0deg);
	background-image: url(resources/office-10-route.svg);
}


#office-11{
	width: 415.596px; 
	height: 277.06px; 
	transform: translateX(677.25px) translateY(883.612px) rotateY(0deg);
	
}
#office-11-route{
	width: 187.514px; 
	height: 921.314px;
	transform: translateX(558.32px) translateY(1156.686px) rotateY(0deg);
	background-image: url(resources/office-11-route.svg);
}
#office-12{
	width: 262.352px; 
	height: 170.562px;
	transform: translateX(255.47px) translateY(883.63px) rotateY(0deg);
}
#office-12-route{
	width: 37.42px; 
    height: 1076px;
    transform: translateX(526.96px) translateY(975px) rotateY(0deg);
    background-image: url(resources/office-12-route.svg);

}





#office-1 .grey{
	background-image: url(resources/office-1-grey.svg);
	z-index:2;
}
#office-1 .white{
	background-image: url(resources/office-1-white.svg);
	z-index:1;
}

#office-2 .grey{
	background-image: url(resources/office-2-grey.svg);
	z-index:2;
}
#office-2 .white{
	background-image: url(resources/office-2-white.svg);
	z-index:1;
}	

#office-3 .grey{
	background-image: url(resources/office-3-grey.svg);
	z-index:2;
}
#office-3 .white{
	background-image: url(resources/office-3-white.svg);
	z-index:1;
}

#office-4 .grey{
	background-image: url(resources/office-4-grey.svg);
	z-index:2;
}
#office-4 .white{
	background-image: url(resources/office-4-white.svg);
	z-index:1;
}

#office-5 .grey{
	background-image: url(resources/office-5-grey.svg);
	z-index:2;
}
#office-5 .white{
	background-image: url(resources/office-5-white.svg);
	z-index:1;
}

#office-6 .grey{
	background-image: url(resources/office-6-grey.svg);
	z-index:2;
}
#office-6 .white{
	background-image: url(resources/office-6-white.svg);
	z-index:1;
}

#office-7 .grey{
	background-image: url(resources/office-7-grey.svg);
	z-index:2;
}
#office-7 .white{
	background-image: url(resources/office-7-white.svg);
	z-index:1;
}

#office-8 .grey{
	background-image: url(resources/office-8-grey.svg);
	z-index:2;
}
#office-8 .white{
	background-image: url(resources/office-8-white.svg);
	z-index:1;
}

#office-9 .grey{
	background-image: url(resources/office-9-grey.svg);
	z-index:2;
}
#office-9 .white{
	background-image: url(resources/office-9-white.svg);
	z-index:1;
}	

#office-10 .grey{
	background-image: url(resources/office-10-grey.svg);
	z-index:2;
}
#office-10 .white{
	background-image: url(resources/office-10-white.svg);
	z-index:1;
}	

#office-11 .grey{
	background-image: url(resources/office-11-grey.svg);
	z-index:2;
}
#office-11 .white{
	background-image: url(resources/office-11-white.svg);
	z-index:1;
}
#office-12 .grey{
	background-image: url(resources/office-12-grey.svg);
	z-index:2;
}
#office-12 .white{
	background-image: url(resources/office-12-white.svg);
	z-index:1;
}	


#green-room{
	width: 105.842px; 
	height: 170.074px;
	transform: translateX(624.846px) translateY(1821.506px) rotateY(0deg);
	background-image: url(resources/green-room.svg);
}
#green-room-route{
	width: 187px; 
	height: 165px;
	transform: translateX(558px) translateY(1914px) rotateY(0deg);
	background-image: url(resources/green-room-route.svg);
}

#magenta-room{
	width: 105.842px;
	height: 206.716px;
	transform: translateX(624.846px) translateY(1496.58px) rotateY(0deg);
	background-image: url(resources/magenta-room.svg);
}
#magento-room-route{
	width: 186.68px; 
	height: 484px;
	transform: translateX(558.32px) translateY(1594px) rotateY(0deg);
	background-image: url(resources/magento-room-route.svg);
}


#blue-room{
	width: 105.842px; 
	height: 169.472px;
	transform: translateX(624.846px) translateY(1234.502px) rotateY(0deg);
	background-image: url(resources/blue-room.svg);
}
#blue-room-route{
	width: 186.68px; 
	height: 763.98px;
	transform: translateX(558.32px) translateY(1314.02px) rotateY(0deg);
	background-image: url(resources/blue-room-route.svg);
}



#amber-room{
	width: 105.842px; 
	height: 169.472px;
	transform: translateX(757.968px) translateY(1234.502px) rotateY(0deg);
	background-image: url(resources/amber-room.svg);
}
#amber-room-route{
	width: 187.66px; 
	height: 895.96px;
	transform: translateX(558.38px) translateY(1167.04px) rotateY(0deg);
	background-image: url(resources/amber-room-route.svg);
}


#cyan-room{
	width: 105.842px; 
	height: 206.716px;
	transform: translateX(757.968px) translateY(1496.58px) rotateY(0deg);
	background-image: url(resources/cyan-room.svg);
}	
#cyan-room-route{
	width: 187.66px; 
	height: 895.96px;
	transform: translateX(558.38px) translateY(1167.04px) rotateY(0deg);
	background-image: url(resources/cyan-room-route.svg);
}

#indigo-room{
	width: 105.842px; 
	height: 170.074px;
	transform: translateX(758.398px) translateY(1821.506px) rotateY(0deg);
	background-image: url(resources/indigo-room.svg);
}
#indigo-room-route{
	width: 187.66px; 
	height: 895.96px;
	transform: translateX(558.38px) translateY(1167.04px) rotateY(0deg);
	background-image: url(resources/indigo-room-route.svg);
}

#red-room{
	width: 128.422px; 
	height: 177.15px;
	transform: translateX(757.968px) translateY(2054.046px) rotateY(0deg);
	background-image: url(resources/red-room-detail.svg);
}
#red-room.white{
	background-image: url(resources/red-room-white.svg);
}

#red-room-route{
	width: 187.66px; 
	height: 977.72px;
	transform: translateX(558.38px) translateY(1167.04px) rotateY(0deg);
	background-image: url(resources/red-room-route.svg);
}
#red-room p{
	margin:40px 0px 0px 0px;
	padding: 10px;
	text-align: center;
	color:#ffffff;
	font-size: 22px;
	line-height: 24px;
}	
#red-room img{
	width: 90px;
    margin: 50px 0 0 19px	
}	
#red-room img.logoColour{
	display:none;
}	

#you-are-here{
	width: 76.836px; 
	height: 76.836px;
	transform: translateX(522.954px) translateY(2068.058px) rotateY(0deg);
	background-image: url(resources/you-are-here.svg);
	z-index:5;
}	
#lift-up{
	width: 64.404px; 
	height: 90.056px;
	transform: translateX(624.846px) translateY(1052.96px) rotateY(0deg);
	background-image: url(resources/lift-up.svg);
	z-index:5;
	display:none;
}




#advertWrapper{
	background-color:#000000;
	margin:auto;
	position:absolute;
	top:2880px;
	width:2160px;
	height:960px;
	overflow:hidden;
}
.flipped #advertWrapper{
	top:0;
}
#owl-demo .item img{
    display: block;
    width: 100%;
    height: auto;
}

#access{
	position:absolute;
	left:1370px;
	top:2460px;
	z-index:10;
	
	cursor:pointer;
	text-align:center;
}
#access p{
	font-size:70px;
	color:#ffffff;
	margin:0;
	
}
#access i{
	font-size:140px;
	color:#ffffff;
}



#access p.up{
	display:none;
}
.flipped #access p.up{
	display:block;
}
.flipped #access p.down{
	display:none;
}



#the-big-real {
    z-index: 2;
    width: 200px;
    height: 200px;
    transform: translateX(600px) translateY(620px) rotateY(0deg);
}
#the-big-real img{
	width:100%;
}












@media (max-width: 1080px) {

html {
	height:100%;
}
body {
	background-color:#ffffff;
	margin:0;
	height:100%;
	font-family: 'Lato', sans-serif;
}



#mapWrapper{
	background-color:#000000;
	margin:auto;
	position:absolute;
	top:0;
	width:1080px;
	height:1440px;
	overflow:hidden;
}
.flipped #mapWrapper{
	top:480px;
}


.panel{
	position:absolute;
	left:638.611px;
	top:446.851px;
	/*
	width:311.901px;
	height:544.274px;
	*/
	width:309px;
	height:545px;
	z-index:10;
}

#atoz{
	background:#000000;
}
#atoz ol{
	margin:0;
	padding:0;
}	
#atoz ol li{
	display:block;
	float:left;
	width:75px;
	height:75.3px;
	background:#222222;
	color:#000000;
	font-size:30px;
	line-height:75px;
	font-weight:600;
	text-align:center;
	margin:0 3px 3px 0;
	cursor:pointer;
	color:#444444;
}
#atoz ol li.active{
	color:lightgrey;
}
#atoz ol li:nth-child(4n){
	margin:0 0 3px 0;
}
#atoz ol li.active:active{
	background:#333333;
	color:#ffffff;
}
#atoz ol li.active:hover{
	background:#333333;
	color:#ffffff;
}

#atozList{
	background:#ffffff;
	display:none;
}
#atozList .close{
	position: absolute;
    top: 0;
    right: 0;
    padding: 3px 8px;
    font-size: 20px;
    font-weight: 600;
    background: lightgrey;
    color: white;
	cursor:pointer;
}
#atozList ul{
	padding:15px;
	margin:20px 0;
	list-style-type: none;
}
#atozList ul li{
	margin:0 0 1em 0;
	line-height:1.3em;
	font-size:17px;
	font-weight:600;
	cursor:pointer;
	display:none;
}
#atozList ul li:active{
	opacity:0.8;
}

.info{
	background:#ffffff;
	display:none;
}
.info .inner{
	padding:15px;
}
.info .inner img{
	width:100%;
	margin:10px 0 20px 0;
}
.info .inner .logo{
	text-align:center;
}
.info .inner .logo img{
	width:auto;
	height:auto;
	margin:0;
    max-height: 80px;
    max-width: 100%;
}
.info p{
	margin:0 2px 1em 2px;
	line-height:1.3em;
	font-size:14px;
}
.info ul {
	margin:0;
	padding:0 0 0 25px;
}
.info li{
	margin:0 0 0.25em 0;
	line-height:1.3em;
	font-size:12px;
}
.info li a{
	cursor:pointer;
}
.info .close{
	position: absolute;
    top: 0;
    right: 0;
    padding: 3px 8px;
    font-size: 20px;
    font-weight: 600;
    background: lightgrey;
    color: white;
	cursor:pointer;
}
.info h1{
    margin: 0;
    height: 80px;
    line-height: 1.3em;
    font-size: 29px;
    text-align: center;
    vertical-align: middle;
    display: table-cell;
    width: 500px;
}


/*
.panel p{
	color:black;
}
*/

.room{
	cursor:pointer;
	z-index:1;
}
.room-route{
	display:none;
	z-index:3;
}

.office{
	cursor:pointer;
	z-index: 1; 
}	
.office .logoWrapper{
	position:absolute;
}
.office .logoWrapper img{
	width:70px;
	height:70px;
	z-index:20;
	position:absolute;
}
#office-1 .logoWrapper img{
	margin:10px 0 0 30px;
}
#office-2 .logoWrapper img{
	margin:13px 0 0 30px;
}
#office-3 .logoWrapper img{
	margin:10px 0 0 30px;
}
#office-4 .logoWrapper img{
	margin:13px 0 0 30px;
}
#office-5 .logoWrapper img{
	margin:10px 0 0 30px;
}
#office-6 .logoWrapper img{
	margin:10px 0 0 30px;
}
#office-7 .logoWrapper img{
	margin:13px 0 0 30px;
}
#office-8 .logoWrapper img{
	margin:63px 0 0 76px;
}
#office-9 .logoWrapper img{
	margin:60px 0 0 72px;
}
#office-10 .logoWrapper img{
	margin:60px 0 0 72px;
}
#office-11 .logoWrapper img{
	margin:30px 0 0 67px;
}
#office-12 .logoWrapper img{
	margin:7px 0 0 30px;
}







.office .logoWrapper img.logoColour{
	display:none;
}
	
.mapElements{
	position: absolute; 
	top: 0px; 
	left: 0px; 
	width: 100%; 
	height: 100%; 
	pointer-events: none; 
	z-index: 1;
}
.mapElements  div{
	pointer-events: auto; 
	position: absolute; 
	background-repeat: no-repeat; 
	overflow: visible; 
	background-size: 100% 100%; 
	
	/*display: inline;*/
	transform-origin: 50% 50% 0px; 		
}
.mapElements  div div{
	width:100%;
	height:100%;
}

#overlay{
	position: absolute; 
	top: 0px; 
	left: 0px; 
	width: 100%; 
	height: 100%;
	z-index:0;
	background:#000000;
	opacity:0.4;
}
.roomOverlay{
	position: absolute; 
	top: 0px; 
	left: 0px; 
	width: 100%; 
	height: 100%;
	z-index:0;
	background:#000000;
	opacity:0.4;
	display:none;
}





#baseMap{
	background-image: url(resources/baseMap-v2.svg); 
	width: 1080px; 
	height: 1440px; 
	transform: translateX(0px) translateY(0px) rotateY(0deg);
	z-index:1;
}
#watersEdgeLogo{
	position:absolute;
	background-image: url(resources/watersEdgeLogo.svg); 
	background-repeat: no-repeat; 
	width: 311.796px; 
	height: 164.844px; 
	transform: translateX(638.664px) translateY(110.904px) rotateY(0deg);
	z-index:2;	
}



#office-1{
	width: 131.176px; 
	height: 90.72px; 
	transform: translateX(127.735px) translateY(521.087px) rotateY(0deg);
}
#office-1-route{
	width: 20.66px; 
	height: 469.67px;
	transform: translateX(261px) translateY(569.83px) rotateY(0deg);
	background-image: url(resources/office-1-route.svg);
}


#office-2{
	width: 131.176px; 
	height: 96.338px;
	transform: translateX(127.735px) translateY(605.807px) rotateY(0deg);
	
}
#office-2-route{
	width: 20.41px; 
	height: 379.67px;
	transform: translateX(261px) translateY(649.83px) rotateY(0deg);
	background-image: url(resources/office-2-route.svg);
}

#office-3{
	width: 131.176px; 
	height: 85.868px;
	transform: translateX(127.735px) translateY(696.146px) rotateY(0deg);
	
}
#office-3-route{
	width: 20.15px; 
	height: 289.67px;
	transform: translateX(261px) translateY(737.83px) rotateY(0deg);
	background-image: url(resources/office-3-route.svg);
}

#office-4{
	width: 131.176px; 
	height: 92.93px;
	transform: translateX(127.735px) translateY(776.013px) rotateY(0deg);
	
}
#office-4-route{
	width: 19.92px; 
	height: 209.67px;
	transform: translateX(261px) translateY(818.83px) rotateY(0deg);
	background-image: url(resources/office-4-route.svg);
}


#office-5{
	width: 131.176px; 
	height: 89.243px;
	transform: translateX(127.735px) translateY(862.943px) rotateY(0deg);
	
}
#office-5-route{
	width: 19.66px; 
	height: 119.67px;
	transform: translateX(261px) translateY(907.83px) rotateY(0deg);
	background-image: url(resources/office-5-route.svg);
}

#office-6{
	width: 131.176px; 
	height: 86.953px; 
	transform: translateX(127.735px) translateY(946.186px) rotateY(0deg);
	
}
#office-6-route{
	width: 19.43px;
	height: 39.67px;
	transform: translateX(261px) translateY(987.83px) rotateY(0deg);
	background-image: url(resources/office-6-route.svg);
}

#office-7{
	width: 131.176px; 
	height: 92.084px; 
	transform: translateX(127.735px) translateY(1027.139px) rotateY(0deg);
	
}
#office-7-route{
	width: 20.5px;
	height: 10.417px;
	transform: translateX(261px) translateY(1074.5px) rotateY(0deg);
	background-image: url(resources/office-7-route.svg);
}


#office-8{
	width: 167.44px; 
	height: 197.407px; 
	transform: translateX(378.984px) translateY(989.79px) rotateY(0deg);
	
}
#office-8-route{
	width: 93.33px; 
	height: 32.5px;
	transform: translateX(279.16px) translateY(1006.5px) rotateY(0deg);
	background-image: url(resources/office-8-route.svg);
}

#office-9{
	width: 167.44px; 
	height: 194.247px; 
	transform: translateX(378.984px) translateY(801.543px) rotateY(0deg);
	
}
#office-9-route{
	width: 93.34px; 
	height: 161.99px;
	transform: translateX(279.16px) translateY(877.01px) rotateY(0deg);
	background-image: url(resources/office-9-route.svg);
}

#office-10{
	width: 167.44px; 
	height: 190.292px; 
	transform: translateX(378.984px) translateY(617.251px) rotateY(0deg);
	
}
#office-10-route{
	width: 93.34px; 
	height: 312px;
	transform: translateX(279.16px) translateY(727px) rotateY(0deg);
	background-image: url(resources/office-10-route.svg);
}


#office-11{
	width: 207.798px; 
	height: 138.53px; 
	transform: translateX(338.625px) translateY(441.806px) rotateY(0deg);
	
}
#office-11-route{
	width: 93.757px; 
	height: 460.657px;
	transform: translateX(279.16px) translateY(578.343px) rotateY(0deg);
	background-image: url(resources/office-11-route.svg);
}

#office-12{
	width: 131.176px; 
	height: 85.281px;
	transform: translateX(127.735px) translateY(441.81px) rotateY(0deg);
}
#office-12-route{
	width: 18.71px; 
    height: 538px;
    transform: translateX(263.48px) translateY(487.5px) rotateY(0deg);
    background-image: url(resources/office-12-route.svg);

}






#office-1 .grey{
	background-image: url(resources/office-1-grey.svg);
	z-index:2;
}
#office-1 .white{
	background-image: url(resources/office-1-white.svg);
	z-index:1;
}

#office-2 .grey{
	background-image: url(resources/office-2-grey.svg);
	z-index:2;
}
#office-2 .white{
	background-image: url(resources/office-2-white.svg);
	z-index:1;
}	

#office-3 .grey{
	background-image: url(resources/office-3-grey.svg);
	z-index:2;
}
#office-3 .white{
	background-image: url(resources/office-3-white.svg);
	z-index:1;
}

#office-4 .grey{
	background-image: url(resources/office-4-grey.svg);
	z-index:2;
}
#office-4 .white{
	background-image: url(resources/office-4-white.svg);
	z-index:1;
}

#office-5 .grey{
	background-image: url(resources/office-5-grey.svg);
	z-index:2;
}
#office-5 .white{
	background-image: url(resources/office-5-white.svg);
	z-index:1;
}

#office-6 .grey{
	background-image: url(resources/office-6-grey.svg);
	z-index:2;
}
#office-6 .white{
	background-image: url(resources/office-6-white.svg);
	z-index:1;
}

#office-7 .grey{
	background-image: url(resources/office-7-grey.svg);
	z-index:2;
}
#office-7 .white{
	background-image: url(resources/office-7-white.svg);
	z-index:1;
}

#office-8 .grey{
	background-image: url(resources/office-8-grey.svg);
	z-index:2;
}
#office-8 .white{
	background-image: url(resources/office-8-white.svg);
	z-index:1;
}

#office-9 .grey{
	background-image: url(resources/office-9-grey.svg);
	z-index:2;
}
#office-9 .white{
	background-image: url(resources/office-9-white.svg);
	z-index:1;
}	

#office-10 .grey{
	background-image: url(resources/office-10-grey.svg);
	z-index:2;
}
#office-10 .white{
	background-image: url(resources/office-10-white.svg);
	z-index:1;
}	

#office-11 .grey{
	background-image: url(resources/office-11-grey.svg);
	z-index:2;
}
#office-11 .white{
	background-image: url(resources/office-11-white.svg);
	z-index:1;
}	
#office-12 .grey{
	background-image: url(resources/office-12-grey.svg);
	z-index:2;
}
#office-12 .white{
	background-image: url(resources/office-12-white.svg);
	z-index:1;
}


#green-room{
	width: 52.921px; 
	height: 85.037px;
	transform: translateX(312.423px) translateY(910.753px) rotateY(0deg);
	background-image: url(resources/green-room.svg);
}
#green-room-route{
	width: 93.5px; 
	height: 82.5px;
	transform: translateX(279px) translateY(957px) rotateY(0deg);
	background-image: url(resources/green-room-route.svg);
}

#magenta-room{
	width: 52.921px;
	height: 103.358px;
	transform: translateX(312.423px) translateY(748.29px) rotateY(0deg);
	background-image: url(resources/magenta-room.svg);
}
#magento-room-route{
	width: 93.34px; 
	height: 242px;
	transform: translateX(279.16px) translateY(797px) rotateY(0deg);
	background-image: url(resources/magento-room-route.svg);
}

#blue-room{
	width: 52.921px; 
	height: 84.736px;
	transform: translateX(312.423px) translateY(617.251px) rotateY(0deg);
	background-image: url(resources/blue-room.svg);
}
#blue-room-route{
	width: 93.34px; 
	height: 381.99px;
	transform: translateX(279.16px) translateY(657.01px) rotateY(0deg);
	background-image: url(resources/blue-room-route.svg);
}

#amber-room{
	width: 52.921px; 
	height: 84.736px;
	transform: translateX(378.984px) translateY(617.251px) rotateY(0deg);
	background-image: url(resources/amber-room.svg);
}
#amber-room-route{
	width: 93.83px; 
	height: 447.98px;
	transform: translateX(279.19px) translateY(583.52px) rotateY(0deg);
	background-image: url(resources/amber-room-route.svg);
}


#cyan-room{
	width: 52.921px; 
	height: 103.358px;
	transform: translateX(378.984px) translateY(748.29px) rotateY(0deg);
	background-image: url(resources/cyan-room.svg);
}	
#cyan-room-route{
	width: 93.83px; 
	height: 447.98px;
	transform: translateX(279.19px) translateY(583.52px) rotateY(0deg);
	background-image: url(resources/cyan-room-route.svg);
}

#indigo-room{
	width: 52.921px; 
	height: 85.037px;
	transform: translateX(379.199px) translateY(910.753px) rotateY(0deg);
	background-image: url(resources/indigo-room.svg);
}
#indigo-room-route{
	width: 93.83px; 
	height: 447.98px;
	transform: translateX(279.19px) translateY(583.52px) rotateY(0deg);
	background-image: url(resources/indigo-room-route.svg);
}

#red-room{
	width: 64.211px; 
	height: 88.575px;
	transform: translateX(378.984px) translateY(1027.023px) rotateY(0deg);
	background-image: url(resources/red-room.svg);
}
#red-room-route{
	width: 93.83px; 
	height: 488.86px;
	transform: translateX(279.19px) translateY(583.52px) rotateY(0deg);
	background-image: url(resources/red-room-route.svg);
}	
#red-room p{
	margin:20px 0px 0px 0px;
	padding: 5px;
	text-align: center;
	color:#ffffff;
	font-size: 11px;
	line-height: 12px;
}
#red-room img{
	width: 45px;
    margin: 25px 0 0 9px	
}	

#you-are-here{
	width: 38.418px; 
	height: 38.418px;
	transform: translateX(261.477px) translateY(1034.029px) rotateY(0deg);
	background-image: url(resources/you-are-here.svg);
	z-index:5;
}	
#lift-up{
	width: 32.202px; 
	height: 45.028px;
	transform: translateX(312.423px) translateY(526.483px) rotateY(0deg);
	background-image: url(resources/lift-up.svg);
	z-index:5;
	display:none;
}




#advertWrapper{
	background-color:#000000;
	margin:auto;
	position:relative;
	width:1080px;
	height:480px;
	overflow:hidden;
}
#advertWrapper{
	background-color:#000000;
	margin:auto;
	position:absolute;
	top:1440px;
	width:1080px;
	height:480px;
	overflow:hidden;
}
.flipped #advertWrapper{
	top:0;
}


#owl-demo .item img{
    display: block;
    width: 100%;
    height: auto;
}


#access{
	position:absolute;
	left:685px;
	top:1230px;
	z-index:10;

	cursor:pointer;
	text-align:center;
}
#access p{
	font-size:35px;
	color:#ffffff;
	margin:0;
	
}
#access i{
	font-size:70px;
	color:#ffffff;
}


#the-big-real {
    z-index: 2;
    width: 100px;
    height: 100px;
    transform: translateX(300px) translateY(310px) rotateY(0deg);
}
#the-big-real img{
	width:100%;
}




}


