html, body
{
    padding: 0;
    margin: 0;
	background-color:#e8eeee;
	color:#777;
	width: 100%;
    height: 100%;
	font-family:Arial;
}




#wr360image_wr360PlayerId {
	border-radius:40px;
}

.containertour{
      width:0px;
      height:0px;
      background-color:#FFF;
	  display:none;
	  
}

.containertour a {
	display:block;
	margin-top:5px;
	margin-bottom:5px;
	margin-left:auto;
	margin-right:auto;
	width: 36px;
	height: 36px;
	background: none;
	z-index: 2;
	background-image:url(../images/close.svg);
}

.wr360_player .container .theme_panel .toolbar {
	position: relative;
	height: 42px;
	padding: 5px 10px 5px 10px;
	margin: 0 auto 0 auto;
	box-sizing: content-box !important;
	border: none !important;
	background: rgba(255, 255, 255, 0.8) !important;
	pointer-events: none;
	border-radius:10px;
	margin-top:-15px;
}


.keybutton{
        z-index:2;
        width: 64px;
        height: 43px;
        position: fixed;
        top: 20px;
        right: 30px;
        padding: 0px;
        margin: 0px;
        overflow-x: hidden;
		overflow-y: hidden;
		display:block;
}

.key{
        z-index:99000;
        width: 350px;
        height: 100%;
        position: fixed;
        top: 0px;
        right: 0px;
        padding: 0px 20px 0 30px;
        margin: 0px;
        overflow-x: hidden;
		overflow-y: hidden;
		display:none;
		background: rgba(136, 43, 88, 0.9);	
		color:#FFF;
}

.key .closelbox {
	position: absolute;
	right:10px;
	top:10px;
	width: 36px;
	height: 36px;
	opacity: 1;
	background: none;
	cursor: pointer;
	background-image:url(../images/close-white.svg);
}

.key h2 { 
	font-size:25px;
	color:#FFF;
}

.key li{
	margin-bottom:10px;
}



.visibile {
	display:block;
}


.logo{
        z-index:2;
        width: 250px;
        height: 233px;
        position: fixed;
        top: 20px;
        left: 20px;
        padding: 0px;
        margin: 0px;
        overflow-x: hidden;
		overflow-y: hidden;
		display:block;
}

.logo img{
        width: 250px;
        height: 233px;
}

		

.fullscreeniframe {
		width: 100%;
        height: calc(100% - 53px);
        position: relative;
        top: 0px;
        left: 0;
        padding: 0px;
        margin: 0px;
        overflow-x: hidden;
}

#content
{
    width: 100%;
    height: 100%;
    margin-left:auto;
	margin-right:auto;
}

.wr360_player .closelbox {
	display:none;
}
.wr360_player .closelbox > div {
	display:none;
}


#virtualtourbutton{
	width:206px;
	height:51px;
	display:block;
	margin-left:auto;
	margin-right:auto;
	background-image:url(../images/virtual-tour.svg);
}


#wr360DynamicSpot_keybutton_wr360PlayerId {
	width:158px !important;
	height:76px !important;
}
.hotspot_cdata .menu {
	margin-left:-79px;
	margin-top:-38px;
}

.hotspot-custom-02 {
	width:200px;
	background-color:#FFF;
	padding:2px 5px 2px 5px;
	text-align:center;
}
.hotspot-custom-02 h2{
	color:#8f2d5d;
	font-weight:600;
	font-size:18px;
}





.hotspot_cdata {
	left:calc(50% - 378px);
	top:calc(50% - 337px);
}


.hotspot-custom {
	z-index:99001;
	width:700px;
	height:540px;
	background-color:#FFF;
	padding:0px 0px 0px 0px;
}

.hotspot-custom iframe {
		width:700px;
		height:540px;
}


@media screen and (max-width: 768px) {
	
	.logo{
        z-index:2;
        width: 180px;
        height: 167px;
        position: fixed;
        left:20px;
		top:20px;
        padding: 0px;
        overflow-x: hidden;
		overflow-y: hidden;
		display:block;
	}

	.logo img{
			width: 100%;
			height: 100%;
	}
	
	
	.keybutton{
        z-index:2;
        width: 40px;
        height: 27px;
        position: fixed;
        top: 100px;
        right: 30px;
        padding: 0px;
        margin: 0px;
        overflow-x: hidden;
		overflow-y: hidden;
		display:block;
	}
	.keybutton img{
        width: 100%;
		height: 100%;
	}
	
	.key{
       font-size:12px;
	}
	.key li{
		margin-bottom:6px;
	}

	
	#wr360image_wr360PlayerId {
		border-radius:20px;
	}
	
	#wr360DynamicSpot_keybutton_wr360PlayerId {
		width:79px !important;
		height:38px !important;
		margin-left:60px;
		margin-top:30px;
	}
	
	.hotspot_cdata .menu {
		margin-left:-20px;
		margin-top:-210px;
	}
	
	.hotspot_cdata .menu img{
		width:350px;
		height:533px;
	}
	
		
	.wr360_player .closelbox {
		top: 10px;
		left:330px;
	}
	
	.hotspot_cdata {
		left:calc(50% - 190px);
		top:calc(50% - 250px);
	}
	
	.hotspot-custom {
		width:380px;
		height:300px;
		padding:40px 0px 10px 0px;
	}
	.hotspot-custom iframe{
		width:380px;
		height:280px;
	}
	
}