html,body,#main-container {
	margin:0;
	width:100%;
	height:100%;
	overflow:hidden
}

#front {
	position:absolute;
	width:200px;
	background-color:#00000003;
	background-color:rgba(0,0,0,0.30);
	height:auto;
	padding:0 20px;
	right:80px;
	top:0;
	overflow:auto
}

#logo {
	max-width:150px;
	max-height:150px;
	margin:auto;
	padding-top:20px
}

#contact {
	padding-bottom:35px
}

#contact > * {
	margin-top:25px;
	width:177px;
	margin-left:auto;
	margin-right:auto;
	background-color:#fff;
	display:block;
	border:solid 2px #d80404;
	box-shadow:0 8px 5px -3px rgba(53,53,53,1)
}

#contact a {
	color:#fff;
	text-decoration:none
}

.btn {
	line-height:100%;
	padding:8px 17px;
	max-width:142px;
	text-align:center;
	font-family:arial;
	cursor:pointer;
	z-index: 9999999999;
}

.btn-success {
	background-color:#d80404!important;
	color:#fff;
	font-weight:700;
}

.btn-success:hover {
	background-color:#df1d1d!important;
}

.splash {
	background-color:rgba(0,0,0,0.30);
	padding:20px;
	position:absolute;
/*right: 10%; */
	right:37px;
	bottom:10%;
	text-align:center;
}

.splash h2 {
	color:#fff;
	font-family:arial
}

#photosphere {
	background-image:url(hotel.jpg);
	background-size:cover;
	background-color:#000;
	width:100%;
	height:100%;
	cursor:-webkit-grab
}

#legend {
	position:absolute;
	bottom:0;
	right:10px;
	color:#fff;
	text-align:right;
	background-color:rgba(0,0,0,0.3);
	padding:2px 10px
}

#main-container.no #photosphere {
	cursor:default!important
}

#photosphere #load,#main-container.no #loading,#main-container.no #legend {
	display:none
}

#loading {
	text-align:center
}

#loading > * {
	margin-left:auto;
	margin-right:auto
}

#main-container.no #load {
	display:block
}

#photosphere.grabbing {
	cursor:-webkit-grabbing
}

#contact-form {
	display:none;
	position:absolute;
	width:100%;
	top:0;
	height:100%;
	background-color:rgba(0,0,0,0.7);
	z-index:1
}

#contact-form.show {
	display:block
}

#contact-form #close-cta {
	float:right;
	width:15px;
	height:20px;
	padding:1px 0 2px 8px;
	border-radius:100%;
	background-color:#fff;
	color:red;
	margin-top:-34px;
	margin-right:-20px;
	cursor:pointer
}

#contact-form input[type="submit"] {
	float:right
}

#contact-form form {
	margin:auto;
	position:relative;
	width:300px;
/*	height:300px;*/
	top:25%;
	background-color:#131313;
	padding:45px 30px 13px;
	color:#fff;
	font-family:Helvetica,Arial;
	border:solid 2px red
}

#contact-form input,#contact-form textarea,#contact-form label,#contact-form .label {
	margin:10px 0;
	border-radius:0
}

#contact-form .label {
	width:85px;
	text-align:right;
	float:left
}

#contact-form input {
	width:100%;
	margin-left:.5%;
	padding: 10px;
}

#contact-form .full-width {
	width:100%;
	float:none;
	clear:both
}

#slider {
	position:absolute;
	top:10%;
/*right: 0px; 
				background-color: rgba(0,0,0,0.3); background-color: rgba(0,0,0,0.3); */
	right:25px;
	text-shadow:2px 2px 1px #000;
	color:#fff;
	text-align:right;
	padding:2px 10px;
	overflow:hidden;
	font-family:Verdana,Arial
}

#slider,#slider .slide {
	width:300px;
	height:150px
}

#slider .slide {
/*float:left;*/
	position:absolute
}

#slider h2 {
	margin-bottom:5px
}

#slider h3 {
	margin-top:5px
}

#slider h2,h3 {
	text-shadow:2px 2px 1px #df1d1d;
	line-height:20px
}

#social-links {
	display:none
}

#social-links table {
	width:100%;
	text-align:center
}

@media screen and (max-height: 500px) {
	#contact .fb_iframe_widget,#contact .sp_gpBadge {
		display:none!important
	}

	#social-links {display:block}

	#loading > * {
		float:left;
		margin:0 10px
	}

	#loading > img {
		height:34px;
		width:34px
	}

	#loading > br {display:none }

	#splash {width:initial}
}

@media screen and (max-width: 1024px) {

}

@media screen and (max-width: 768px) {
	#legend {
		font-size:70%;
		white-space:nowrap
	}
}

@media screen and (max-width: 768px) and (max-height: 500px) {
	#loading h2 {
		display:none!important
	}
	#contact-form form{	
		top: 20px;
	}
	.vf_form {min-height: 100% !important;
	}
}

@media screen and (max-width: 600px){
	#contact .fb_iframe_widget,#contact .sp_gpBadge {
		display:none!important
	}

	#social-links {
		display:block
	}

	#slider,#slider .slide {
		width:180px;
		height:130px;
		text-align:center;
		bottom: 0;
	}

	#slider,h3 {
		font-size:80%
	}

	#slider {
		position:relative;
		float:left;
		margin-top:-210px;
		left:20px;
		font-size:80%;
		line-height:15px
	}

	#loading > * {
		float:left;
		margin:0 10px;
	}

	#loading > img {
		height:34px;
		width:34px
	}

	#loading > br {
		display:none
	}

	#loading h2 {
		display:none!important;
	}

	#logo,#logo > img {
		height:80px;
		width:80px
	}

	#splash {
		left:0;
		right:inherit;
		bottom:148px;
		background-color:transparent;
		width:175px;
		padding:5px 0;
		margin-left:29px
	}

	#slider h2 {
		margin-bottom:2px;
		margin-top:10px
	}

	#slider h3 {
		margin-top:2px
	}
	#contact {
		padding-bottom: 15px;
	}
	.vf_form {
		min-width: 80% !important;
		width: 80% !important;
	}
	.vf_form textarea{
		min-width: 80% !important;
		width: 80% !important;
		overflow: auto;
	}
}

@media screen and (min-width: 450px) and (max-height: 470px){
	#splash {
		right:0!important;
		left:initial;
		bottom: 30px;
	}

	#slider {
		right:0!important;
		left: 47%;
		top: -1px;
	}
}
@media screen and (max-width: 449px) and (max-height: 469px) and (min-width: 320px) and (min-height: 320px){
	#slider{display:none;}
	#splash{bottom: 20px;}
	#social-links img{ width:60px; height:60px;} 
	
}
@media screen and (max-width: 319px) and (max-height: 479px){
	html,body,#main-container {
		width:1366px!important;
		height:768px!important;
		overflow:auto;
	}	
}
@media screen and (max-height: 319px) and (max-width: 479px){
	html,body,#main-container {
		width:1366px!important;
		height:768px!important;
		overflow:auto
	}
	#splash {
		right: 0;
	} 
}
                            
                            
                            
#slider {
    background: rgba(0,0,0,0.5);
    position:relative;
    float:left;
    margin-top: -270px;
    left: 0;
    font-size:80%;
    line-height:15px;
    text-align:center;
}

@media screen and (max-width: 600px){
	#slider {
	    display: none !important;
	    background: rgba(0,0,0,0.5);
		position:relative;
		float:left;
		margin-top: -270px;
		left: 50%;
		font-size:80%;
		transform: translate3d(-50%,0,0);
	}
   #front {
        left: 50%;
        top: 100px;
        transform: translate3d(-50%,0,0);
    } 
}

@media screen and (max-width: 540px){
	#slider {
	    display: none !important;
	}
}