* { 
    -moz-box-sizing: border-box; 
    -webkit-box-sizing: border-box; 
     box-sizing: border-box; 
}

body {
	font-size: 14px;
	font-family: 'Montserrat', sans-serif;
	color: #42474D;
	overscroll-behavior: contain;
}

.iframes-container {
	position: absolute;
	top:0;
	left:0;
	width:100%;
	height: 100%;
	overflow: hidden;
}

.iframes-container iframe {
	position: absolute;
	top:0;
	left:0;
	width:100%;
	height: 100%;
	border:0px none;
}

.iframes-container .old-iframe {
	z-index: 5;
}

.iframes-container .new-iframe {
	z-index: 4;
}

.iframepano-container {
	position: absolute;
	top:0;
	left:0;
	width:100%;
	height: 100%;
}

.iframe3d-container {
	width: 100%;
	height: 100%;
	padding-bottom: 0;
	object-fit: cover;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	position: absolute;
}

.identify-arrows {
	display: none;
	position: absolute;
	z-index: 9;
	cursor: pointer;
	border: 0px none;
	font-size: 0;
}

.identify-arrows.rotate-left, .identify-arrows.rotate-right {
  width: 34px;
  height: 38px;
  background: rgba(255, 255, 255, 0.7);
  opacity: 1;
  transition: background 0.2s;
  border-radius: 2px;
}

.identify-arrows.rotate-left {
	bottom: 91px;
	right:142px;
}

.identify-arrows.rotate-right {
	bottom: 91px;
	right: 49px;
}

.identify-arrows.rotate-left::before, .identify-arrows.rotate-right::before {
	content: '';
	border: solid #42474D;
	  border-top-width: medium;
	  border-right-width: medium;
	  border-bottom-width: medium;
	  border-left-width: medium;
	border-width: 0 1px 1px 0;
	display: inline-block;
	padding: 7px;
	color: #42474D;
	position: absolute;
	top: 12px;
}

.identify-arrows.rotate-left::before {
	transform: rotate(135deg);
	-webkit-transform: rotate(135deg);
	left: 15px;
}

.identify-arrows.rotate-right::before {
	transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	left: 4px;
}

.identify-arrows.rotate-left::after, .identify-arrows.rotate-right::after {
	content: '';
	position: absolute;
	top:0;
	height: 38px;
	transition: border-color 0.2s;
}

.identify-arrows.rotate-left::after {
	right:0;
	transform: translateX(100%);
	width: 0; 
	height: 0; 
	border-top: 19px solid transparent;
	border-bottom: 19px solid transparent;

	border-left: 10px solid rgba(255,255,255,0.7);
}

.identify-arrows.rotate-right::after {
	left:0;
    transform: translateX(-100%);
	width: 0; 
	height: 0; 
	border-top: 19px solid transparent;
	border-bottom: 19px solid transparent;

	border-right: 10px solid rgba(255,255,255,0.7);
}

.identify-arrows.rotate-left:hover,
.identify-arrows.rotate-right:hover {
	background: rgba(255, 255, 255, 0.9);
}

.identify-arrows.rotate-left:hover:after {
	border-left-color: rgba(255, 255, 255, 0.9);
}

.identify-arrows.rotate-right:hover:after {
	border-right-color: rgba(255, 255, 255, 0.9);
}

.preview-rotate-desktop {
	display:none;
	position: absolute;
	z-index: 7;
	background: rgba(255, 255, 255, 0.2);
	border: 1px solid rgba(255, 255, 255, 0.2);
	backdrop-filter: blur(10px);
	padding:31px 30px 18px;
	text-align: center;
	width:420px;
	transition: bottom 0.3s;
	
	top:50%;
	left:50%;
	transform:translate(-50%, -50%);
}

.preview-rotate-desktop .close-preview-rotate {
	position: absolute;
	top:6px;
	right:4px;
	width:24px;
	height: 24px;
	background:transparent;
	border: 0px none;
	cursor: pointer;
	display:none;;
}

.preview-rotate-desktop .close-preview-rotate:before,
.preview-rotate-desktop .close-preview-rotate:after {
	content:'';
	width:1px;
	height: 16px;
	background:#FFF;
	position: absolute;
	top:3px;
}

.preview-rotate-desktop .close-preview-rotate:before {
	transform:rotate(45deg);
}

.preview-rotate-desktop .close-preview-rotate:after {
	transform:rotate(-45deg);
}

.preview-rotate-desktop .preview-rotate-icon {
	background-image:url('/images/desktop_move_mouse.svg');
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
	width: 130px;
	height: 120px;
	display:block;
	margin:0 auto;
}

.preview-rotate-desktop .preview-rotate-text {
	font-weight: 600;
	font-size: 20px;
	line-height: 24px;
	text-align: center;
	color:#FFF;
	margin:36px auto 28px;
	max-width: 186px;
}

.preview-rotate-desktop .accept-preview-rotate {
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 2px;
	color:#FFF;
	background:transparent;
	margin:0 auto;
	display:inline-block;
	cursor: pointer;
	font-size: 20px;
	font-weight: 600;
	padding:16px 20px;
}

.preview-rotate-desktop .presentation-illustration-text {
	color:#FFF;
	padding-top: 15px;
	font-size: 14px;
}


.preview-rotate {
	display:none;
	width:240px;
	height: auto;
	background: rgba(255, 255, 255, 0.2);
	border: 1px solid rgba(255, 255, 255, 0.2);
	backdrop-filter: blur(10px);
	position: absolute;
	z-index: 7;
	top:50%;
	left:50%;
	transform: translate(-50%, -50%);
	color:#FFF;
	flex-flow: wrap;
}

.preview-rotate .preview-rotate-zoom,
.preview-rotate .preview-rotate-rotate {
	width:50%;
	padding:30px 10px 24px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.preview-rotate .preview-rotate-rotate {
	border-right: 1px solid rgba(255, 255, 255, 0.2);
}

.preview-rotate .preview-rotate-zoom .image-container,
.preview-rotate .preview-rotate-rotate .image-container {

}

.preview-rotate .preview-rotate-zoom .image-container .image,
.preview-rotate .preview-rotate-rotate .image-container .image {
	display:block;
	width:50px;
	height: 50px;
	margin:0 auto;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
}

.preview-rotate .preview-rotate-zoom .image-container .image {
	background-image:url(/images/mobile-zoom-white.svg);
}

.preview-rotate .preview-rotate-rotate .image-container .image {
	background-image:url(/images/mobile-rotation-white.svg);
}

.preview-rotate .preview-rotate-zoom .text,
.preview-rotate .preview-rotate-rotate .text {
	color:#FFF;
	font-weight: 600;
	font-size: 12px;
	line-height: 15px;
	text-align: center;
	padding-top: 1px;
}

.preview-rotate .accept-preview-rotate-mobile {
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 2px;
	color: #FFF;
	padding: 9px 8px;
	background: transparent;
	margin: 0 auto;
	display: inline-block;
	cursor: pointer;
	font-size: 14px;
	font-weight: 600;
	padding: 10px 12px;
	margin-top: 10px;
	margin-bottom: 5px;
}

.preview-rotate .presentation-illustration-text {
	height: auto;
	text-align: center;
	font-size: 12px;
	padding:5px 10px;
}

.right-top-buttons {
	position: absolute;
	top: 12px;
	right: 12px;
	width: auto;
	height: 0;
	overflow: visible;
	z-index: 6;
}

.right-top-buttons .bitem {
	height: 34px;
	width:38px;
	background-color:rgba(255,255,255,0.7);
	border-radius: 2px;
	border: 0;
	padding: 0;
	cursor: pointer;
	overflow: hidden;
	margin-bottom: 10px;
	display: table;
	margin-left: auto;
	margin-right: 0;
	position: relative;
	padding: 13px 15px 12px 15px;
	white-space: nowrap;
	text-transform: uppercase;
	font-size: 10px;
	font-weight: 700;
	text-decoration: none;
	color: #42474d;
	transition: background 0.2s;
}

.right-top-buttons .bitem:hover {
	background-color:rgba(255,255,255,0.9);
}

.right-top-buttons .bitem.button-type-up,
.right-top-buttons .bitem.button-type-down {
	height: 34px;
	width:38px;
	right:93px;
	position: fixed;
	overflow: visible;
}

.right-top-buttons .bitem.button-type-up {
	bottom:139px;
	margin-bottom: 0;
}

.right-top-buttons .bitem.button-type-down {
	bottom:46px;
	margin-bottom: 0;
}

.right-top-buttons .bitem.button-type-up::before,
.right-top-buttons .bitem.button-type-down::before {
	content: '';
	border: solid #42474D;
	  border-top-width: medium;
	  border-right-width: medium;
	  border-bottom-width: medium;
	  border-left-width: medium;
	border-width: 0 1px 1px 0;
	display: inline-block;
	padding: 7px;
	color: #42474D;
	position: absolute;
	left: 12px;
}

.right-top-buttons .bitem.button-type-up::before {
	transform: rotate(-135deg);
	-webkit-transform: rotate(-135deg);
	top:16px;
}

.right-top-buttons .bitem.button-type-down::before {
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	
	bottom:16px;
}

.right-top-buttons .bitem.button-type-up::after,
.right-top-buttons .bitem.button-type-down::after {
	content: '';
	position: absolute;
	left:0;
	height: 38px;
	transition:border-color 0.2s;
}

.right-top-buttons .bitem.button-type-up::after {
	transform: translateY(100%);
	bottom:0;
	width: 0; 
	height: 0; 
	border-left: 19px solid transparent;
	border-right: 19px solid transparent;

	border-top: 10px solid rgba(255,255,255,0.7);
}

.right-top-buttons .bitem.button-type-up:hover:after {
	border-top-color: rgba(255,255,255,0.9);
}

.right-top-buttons .bitem.button-type-down::after {
	transform: translateY(-100%);
	bottom:0;
	top:0;
	width: 0; 
	height: 0; 
	border-left: 19px solid transparent;
	border-right: 19px solid transparent;

	border-bottom: 10px solid rgba(255,255,255,0.7);
}

.right-top-buttons .bitem.button-type-down:hover:after {
	border-bottom-color: rgba(255,255,255,0.9);
}

.right-top-buttons .bitem.button-type-pano {
	font-size: 16px;
	font-weight: 500;
	line-height: 1em;
	text-align: left;
	text-underline-position: from-font;
	text-decoration-skip-ink: none;
	position: relative;
	padding-left:42px;
	text-transform: none;
	padding-top: 12px;
    vertical-align: top;
    height: 40px;
}

.right-top-buttons .bitem.button-type-pano:before {
	content:'';
	position: absolute;
	background-image:url(/images/binoculars.svg);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
	width:24px;
	height: 24px;
	top:7px;
	left:8px;
}

.right-top-buttons .bitem.button-type-shback {
	background-color:none;
	border-radius: 0;
	width:191px;
	height: 40px;
	background-image:url(/images/mainview.svg);
	font-size: 0;
	text-indent: -9999px;
	opacity:0.8;
}

.right-top-buttons .bitem.button-type-shback:hover {
	background-image:url(/images/mainview_h.svg);
	opacity:1.0;
}

.right-top-buttons .bitem.button-type-back {
	padding-top: 14px;
	background-color:rgba(255,255,255,0.7);
	backdrop-filter: blur(17px);
	font-size: 15px;
	font-weight: 500;
	line-height: 1em;
	/*top:10px;
	left:10px;
	position: fixed;*/
	text-transform: none;
	padding-right:40px;
	vertical-align:top;
	height:42px;
	border-radius: 0;
}

.right-top-buttons .bitem.button-type-back:hover {
	background-color:rgba(255,255,255,0.9);
}

.right-top-buttons .bitem.button-type-back:before {
	content: '';
	border: solid #42474D;
	  border-top-width: medium;
	  border-right-width: medium;
	  border-bottom-width: medium;
	  border-left-width: medium;
	border-width: 0 1px 1px 0;
	display: inline-block;
	padding: 6px;
	color: #42474D;
	position: absolute;
	top: 14px;
	transform: rotate(-44deg);
	right: 12px;
}

.minimap {
	display:none;
	position: fixed;
	left:20px;
	bottom:20px;
	width:280px;
	height: 280px;
	border:2px solid #b1d236;
	border-radius: 6px;
	overflow: hidden;
	z-index: 5;
	transition: width 0.5s, height 0.5s;
	z-index: 11;
	cursor: all-scroll;
}

/*.minimap:hover {
	width:360px;
	height: 360px;
}*/

.minimap-full {
	width:2000px;
	height:2000px;
	background-image: url(/uploads/topdown_map_resized.jpg);
	
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
	
	position: absolute;
	top:20px;
	left:-80px;
	transform:translate(-50%, -50%);
	margin-top: 138px;
	margin-left: 138px;
	transition: margin-top 0.5s, margin-left 0.5s, top 0.5s, left 0.5s;
}

.noanimate.minimap .minimap-full {
	transition:none;
}

/*.minimap:hover .minimap-full {
	margin-top: 178px;
	margin-left: 178px;
}*/

.minimap .fov-direction {
	position: absolute;
	
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 68px 31.5px 0 31.5px;
	border-color: rgba(177,210,54,0.6) transparent transparent transparent;
	transform: translate(-50%, -100%) rotate(0deg);
	transform-origin: center bottom;
}

.expand-icon,
.collapse-icon {
	position: absolute;
	display:block;
	bottom:0;
	left:0;
	width:35px;
	height: 35px;
	border-radius: 0 4px 0 0;
	z-index: 1;
	background:rgba(177,210,54,1);
	cursor: pointer;
}

.expand-icon span,
.collapse-icon span {
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
	width:24px;
	height: 24px;
	position: absolute;
	display:block;
	top:6px;
	left:5px;
}

.expand-icon span {
	background-image: url(/images/expand-solid.svg);
}

.collapse-icon span {
	background-image: url(/images/compress-solid.svg);	
}

.pano-point {
	display:block;
	position: absolute;
	transform:translate(-50%, -50%);
	background:rgba(177,210,54,1);
	width:14px;
	height: 14px;
	border-radius: 50%;
	top:0;
	left:0;
	border:2px solid #FFF;
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.flat-type-list {
	position: fixed;
	bottom:258px;
	right:21px;
	z-index: 6;
	overflow: hidden;
}

.flat-type-list .item {
	border-width: 1px 0px 0px 0px;
	border-style: solid;
	border-color: rgba(255, 255, 255, 1);
	backdrop-filter: blur(4px);
	color:#FFF;
	text-decoration: none;
	display:block;
	padding:6px 10px 9px 10px;
	transition: background 0.2s, color 0.2s;
	background-color:transparent;
}

.flat-type-list .item:hover,
.flat-type-list .item.active {
	background-color:rgba(255, 255, 255, 1);
	color:rgba(64, 64, 64, 1);
}

.flat-type-list .item:last-child {
	border-width: 1px 0px 1px 0px;
}

.flat-type-list .item .name {
	text-align: center;
	display:block;
	font-size: 16px;
	font-weight: 400;
	line-height: 19.2px;
	text-underline-position: from-font;
	text-decoration-skip-ink: none;
}

.flat-type-list .item .info {
	text-align: center;
	display:block;
	font-size: 12px;
	font-weight: 400;
	line-height: 14.4px;
	text-underline-position: from-font;
	text-decoration-skip-ink: none;
	padding-top: 2px;
}

.flat-type-help {
	color: #FFF;
	text-decoration: none;
	display: block;
	padding: 8px 14px 8px 14px;
	font-size: 16px;
	margin-bottom: 40px;
	max-width: 210px;
	background: rgba(255, 255, 255, 0.0);
	border: 1px solid rgba(255, 255, 255, 0.2);
	backdrop-filter: blur(4px);
	text-align: center;
	pointer-events: none;
	position: relative;
}

.flat-type-help:after,
.flat-type-help:before {
	top: 100%;
	left: 50%;
	border: solid transparent;
	content: "";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba( 100, 100, 100, 0 );
	
}

.flat-type-help:after {
	border-top-color: rgba( 255, 255, 255, 0.1 );
	border-width: 15px;
	margin-left: -15px;
}

.flat-type-help:before {
	border-top-color: rgba( 255, 255, 255, 0.7 );
	border-width: 16px;
	margin-left: -16px;	
}

.flat-type-select-help {
	position: fixed;
	bottom:140px;
	left:50%;
	transform:translateX(-50%);
	color: #FFF;
	text-decoration: none;
	display: block;
	padding: 16px 20px 16px 20px;
	font-size: 26px;
	background: rgba(255, 255, 255, 0.0);
	border: 1px solid rgba(255, 255, 255, 0.2);
	backdrop-filter: blur(4px);
	text-align: center;
	z-index: 6;
	pointer-events: none;
}

.pano-dot-help {
	position: fixed;
	bottom:50px;
	right:50px;
	color: #FFF;
	text-decoration: none;
	display: block;
	padding: 16px 20px 16px 20px;
	font-size: 26px;
	background: rgba(255, 255, 255, 0.0);
	border: 1px solid rgba(255, 255, 255, 0.2);
	backdrop-filter: blur(4px);
	text-align: center;
	z-index: 6;
	pointer-events: none;
	width: 420px;
	text-align: left;
	display:none;
}

@media screen and (max-width:979px) {
	.minimap {
		width:180px;
		height: 180px;
	}
	
	.minimap .minimap-full {
		margin-top: 88px;
		margin-left: 88px;
	}
	
	.right-top-buttons {
		top:10px;
		right:10px;
	}
	
	.right-top-buttons .bitem.button-type-pano {
		font-size: 12px;
		padding-left:34px;
		padding-top: 11px;
		padding-bottom: 9px;
		height: 36px;
		padding-right:10px;
	}
	
	.right-top-buttons .bitem.button-type-pano::before {
		top:5px;
		left:6px;
	}
	
	.right-top-buttons .bitem.button-type-back {
		height: 36px;
		font-size:12px;
		padding: 11px 10px 8px 30px
	}
	
	.right-top-buttons .bitem.button-type-back::before {
		top:14px;
		left:15px;
	}
	
	.identify-arrows.rotate-right {
		right:25px;
		bottom:67px;
	}
	
	.identify-arrows.rotate-left {
		right:110px;
		bottom:67px;
	}
	
	.right-top-buttons .bitem.button-type-up {
		bottom:111px;
		right:65px;
	}
	
	.right-top-buttons .bitem.button-type-down {
		bottom:26px;
		right:65px;
	}
	
	.flat-type-list {
		left:10px;
		top:10px;
		right:auto;
	}
	
	.flat-type-list .item {
		padding: 4px 4px 6px 4px
	}
	
	.flat-type-list .item .name {
		font-size:12px;
	}
	
	.flat-type-list .item .info {
		font-size:11px;
		padding-top: 1px;
	}
	
	.flat-type-help {
		max-width: 180px;
		font-size: 14px;
	}
	
	.flat-type-select-help {
		left:20px;
		transform:none;
		bottom:26px;
		font-size:12px;
		width:200px;
	}

	.pano-dot-help { 
		max-width: calc(100% - 20px);
		right:10px;
		bottom:10px;
		font-size: 16px;
		text-align: center;
	}
}