/* site design .: ogdsgn @ 2013 | ogdsgn[dot]com | hello[at]ogdsgn[dot]com */

/* !-------->BODY<--------*/
html{
	background-color: #000;
	font-family: my_font_light; 
	font-size:16px;
	list-style: none;
    -moz-user-select: none; 
	-webkit-user-select: none;
}
body{
	width:100%;
	height:92.5%;
	position: absolute;
	overflow: hidden;
}
body.splash{
	height:100%;
}
#content{
	background-color: #000; 
	width:100%;
	height:100%;
}
#menubar{
	background: black;
	position: fixed;
	width: 100%;
	height:7.5%;
	min-height: 40px;
	bottom:0px;
	left:0px;
	z-index: 99999;
}
#menumobile{
	visibility: hidden;
}
#tealbar{
	position: fixed;
	display: block;
	top: 0px;
	width: 100%;
	height: 5px;
	background-color: #33cccc;
	z-index: 9999;	
}

/* PIN IT */
.pinit{
	display: none;
}

/* !-------->HERO<--------*/
#hero{
	display: none;
	width:100%;
	height:100%;
	position: absolute;
	overflow: hidden;
	background-image: url(../images/EnterHero.jpg);
	opacity: 0.25; 
	filter: alpha(opacity=25);
	background-size: cover;
	background-position: center center;
	background-attachment: fixed;
	background-repeat: no-repeat;
	z-index: 9998;
	pointer-events: all;
	cursor: pointer;
}
#wrapper{
	pointer-events: none;
	display: none;
	width:445px;
	height:256px;
	position:fixed;
	top:50%;
	left:50%;
	margin-top: -112px;
	margin-left: -220px;
	z-index: 9999;
}
#logo{
	font-family: my_font_light; 
	pointer-events: none; 
}		
#logo .title{
	top: 0px;
	position:relative;
	white-space: nowrap;
	font-size: 5.5em;
	color: #33cccc;
	margin-bottom: -3px;
	margin-left: -2px;
	word-spacing: 3px;
}
#logo .intro{
	font-size: 1.1em;
	letter-spacing:5px;
	word-spacing: -3px;
	color: #FFF;
	padding-bottom: 6px;
	white-space: nowrap;
	margin-right: -2px;
}
#logo .description{	
	font-size: 12px;
	color:#b9b9b9;	
	margin-bottom: 0px;
	line-height: 18px;
	letter-spacing: 0px;
	word-spacing: -1px;
} 
#logo .description span{
	word-spacing: 1px;
}
#logo .intro, 
#logo .description, 
#logo .description span,
#logo .welcome{
/* 	-webkit-text-stroke-width: 0.5px; */
	font-family: my_font_reg; 	
}

#logo .welcome,
#logo .welcome a{	
	color: #33cccc;
	position: relative;
	text-align: right;
	pointer-events: all;
	cursor: pointer;
	margin-right: 2px;
} 
#logo .welcome a:hover{
	color: #FFF;
}

/* !-------->COMMON<--------*/
a,
#buttons-login .enter{
	color: #808080;
	-webkit-transition: color 0.3s;
	-moz-transition: color 0.3s;
	-o-transition: color 0.3s;
	transition: color 0.3s;
	cursor: pointer;
}
a:hover,
#buttons-login .enter:hover,
#social a:hover{
	color: #ffffff;
}
h1{
	font-family: my_font_reg; 
	color: #33cccc;
	font-size:1.4em;
	padding-bottom: 10px;
	margin-left: -2px;
}
h2{
	font-family: my_font_reg; 
	color: #FFF;
	font-size:.9em;
	padding-bottom: 1px;
}
p{
	color: #d9d9da;
	font-size:.75em;
	line-height: 1.2em;
	padding-bottom: 6px;
	letter-spacing: 1px;
}
#special p{
	letter-spacing: 0px;
}

/* Utilities */
.textCenter {
    text-align: center;
}
.center {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}
button{
	border: 1px solid #808080;
    padding: 8px 10px;
    background: transparent;
    color: white;
}
button a {
    letter-spacing: 1px;
    display: block;
    width: 100%;
    height: 100%;
    opacity: 1;
    font-size: 10px;
}


/* !-------->THUMBS<--------*/
#gallery{
	top: 0px;
	width:100%;
	height:100%;
}
.X1,
.X2{
	width:103%;
	height:100%;
	margin-top: 3px;
	margin-left: -1.2%;
}
.X2{
	display: none;
}
.box{
	display: inline-block;
	vertical-align: top;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;	
	text-align: center;
	width: 24%;
	height: 32.3%;	
	margin: 8px -6px 0px 12px;
}
.box span{
	background-color: black;
	position: relative;
	display: inline-block;
	color: #FFF;
	width:101%;
	height:100%;	
	opacity: 0;
}
.box span h3{
	position: relative;
	font-size: .8em;
	top: 50%;
	margin-top: -8px;
	padding: 0px 8% 0px 8%;
}
.box:hover span{
	opacity: .7;
/*
	-webkit-transition: opacity 0.3s;
	-moz-transition: opacity 0.3s;
	-o-transition: opacity 0.3s;
	transition: opacity 0.3s;
*/
}

/* !-------->THUMB ARROWS<--------*/
#arrows{
	position: absolute;
	left: 0;
	width: 100%;
	height: 100%;
}
.arrowsnav{
	background-color: black;
	opacity: .5;
	position: absolute;
	width: 6%;
	height: 150px;
	top:50%;
	margin-top: -75px;
	text-decoration: none;
	background: transparent url('blank.gif');
	-webkit-tap-highlight-color: rgba(0,0,0,0.5);
	z-index: 7777;
	padding: 0;
	border: 0;
	outline: none;
	vertical-align: top;
}
.arrowsnav span {
	position: absolute;
	top: 50%;
	width: 36px;
	height: 34px;
	margin-top: -18px;
	z-index: 9999;
	visibility: visible;
}
.arrowprev span, .arrownext span {
	background-image: url('../swipe/gallery_arrows.png');
}
.arrowprev {
	left: 0px;
}

.arrownext {
	right: 0px;
}
.arrowprev span {
	left: 10px;
	background-position: 0 -36px;
}

.arrownext span {
	right: 10px;
	background-position: 0 -72px;
}
.arrowsnav {
	opacity: .75;	
}
.arrowsnav:hover {
	opacity: 1;	
	-webkit-transition: opacity 0.3s;
	-moz-transition: opacity 0.3s;
	-o-transition: opacity 0.3s;
	transition: opacity 0.3s;	
}
#calendar .arrowprev{
	display: none;	
}

/* !CAL */
	
#datepicker{
	position: relative;
	font-family: my_font_light; 
	font-weight: normal;
	height: 420px;
	width: 700px;
	left: 50%;
	top: 50%;
	margin-top: -255px;
	margin-left: -350px;
/* 	opacity: 0.0; */
}
.ui-datepicker.ui-datepicker-multi {
/*
	left: 50%;
	top: 50%;
*/
}
#bookednote{
	position: absolute;
	bottom: 0px;
	left:0;
	font-size: 10px;
	color: #808080;
	margin-left: 15px;
}
#spinr{
	left: 50%;
	top: 50%;
	position: absolute;
	display: inline;
}
/* !MAP*/
#mapbox{
	height:108%;
	overflow: hidden;
}
#mapbox a{
	color:#33cccc;
}

/* !CONTENT */
#photo{
	float: left;	
	position: relative;
	width: 60%;
	height: 100%;
	margin-top: 4px;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: left bottom;	
	min-height: 420px;
}
.features #photo{	
	background-image: url(../images/Details_LivingRoom.jpg);
}
.booking #photo{
	background-image: url(../images/Details_HouseRules.jpg);
}
.included #photo{
	background-image: url(../images/Details_Included.jpg);
}
.remember #photo{
	background-image: url(../images/Details_Remember.jpg);
}
.specialfeatures #photo{
	background-image: url(../images/BG_Special.jpg);
	background-position: right top;
	min-height: 450px;
}
#column-details,
#column-about,
#column-special,
#column-calendar,
#column-rates{
	position: absolute;
	margin-top: 4px;
	height: 100%;
	z-index: 1;
}
#column-details{
	background-color: #161a1b;
	right: 0;
	width: 40%;
	min-width:512px;
}
#column-rates{
	background-color: #161a1b;
	right: 0;
	width: 40%;
	min-width: 512px;
}
#column-about{
	background-color: rgba(0,0,0,0.7);
	right: 0;
	width: 100%;
}
#column-special,
#column-calendar{
	background-color: rgba(0,0,0,0.8);
	width: 100%;
}
#infobox{
/* 	background-color: rgba(255,255,255,0.05); */
	position: relative;
	top: 15%;
	left: 8%;
	right: 150%;
	width: 85%;
}
#about #infobox{
	top: 19%;
	left: 62%;
	margin-top: -50px;
	width: 33%;
}
#about p{
	font-size: 1em;
	line-height: 2em;
	text-indent:30px;
	color: #d9d9d9;
}
#quoteA, #quoteB{
	background-image: url("../images/Quotes.png");
	background-position: 0 0;
	background-repeat: no-repeat;
	position: absolute;
	width: 30px;
	height: 23px;
}
#quoteB{
	background-position:-30px 0;
}
#infobox-features{
	position: relative;
	width: 340px;
	height: 440px;
	margin:auto auto;
	top: 10%;
}
#special #infobox{
	top: 50%;
	left: 50%;
	height: 120px;
	width: 340px;
	margin: -50px -160px;
}
#local #infobox{
	top: 50%;
	left: 50%;
	height: 120px;
	width: 340px;
	margin: -50px -160px;
}
#calendar #infobox{
	top: 50%;
	left: 50%;
	height: 120px;
	width: 340px;
	margin: -50px -160px;
}

/* subnav */
#subnav{
	position: absolute;
	bottom: 10px;
	left: 50%;
	width: 350px;
	font-size: .8em;
	margin-left: -172px;
	height: 25px;
	color: #707070;
	border-top: 1px solid;
	padding-top: 8px;
	white-space: nowrap;
}
#subnav a {
	padding-right: 16px;
}

/* !Features&Rates */
.featurebox,
.ratesbox,
.nightsbox{
/* 	background-color: rgba(255,255,255,0.05); */
	display: inline-block;
	vertical-align: top;
	margin-bottom: 20px;
	white-space: nowrap;
}
.specialfeatures .nightsbox{
	margin-bottom: 2px;	
}
.specialfeatures .ratesbox{
	padding-right: 10%;
}
.specialfeatures .ratesbox li{
	margin-bottom: 0px;
	padding-bottom: 0px;
	line-height: 18px;
}
.specialfeatures .ratesbox.two{
	text-align: right;
	margin-bottom: 2px;
}
.featurebox.one{
	margin-right: 13%;
	margin-bottom: 20%;
}
.specialfeatures .featurebox.one{
	margin-bottom: 20px;
}
.specialnotes {
	margin-bottom: 15%;
}
.specialnotes ul{
	padding-left: 15px;
}
.featurebox ul li,
.specialfeaturebox ul li,
.specialnotes li{
	color: #999;
	font-size:.8em;
}
.features .featurebox ul li,
.specialfeatures .featurebox ul li{
	padding-top: 8px;
	padding-left: 25px;
}
.booking .featurebox ul li,
.specialnotes li {
	padding-top: 4px;
	font-size:.75em;
	list-style-image:url('/images/square.png');
}
.booking .featurebox ul li span{
	font-size:.95em;
}
.booking .featurebox ul{
	padding-left: 15px;
	padding-bottom:20px;
}
.houserules {
	padding-top: 30px;
}

.featurebox a{
	color:#FFF;
}
.ratesbox{
	color: #999;
	font-size:.8em;
	padding-right: 6%;
}
.ratesbox.one,
.nightsbox.two{
	color: #FFF;
}
.ratesbox li{
	padding-bottom: 36px;
}
#holidays{
	font-size: .85em;
	padding-bottom: 4px;
	padding-top: 2px;
}
#holidays li{
	padding-bottom: 4px;
}
.ratesbox.two .nopad{
	padding-bottom: 6px;
}
.ratesbox.three ul{
	padding-left: 80px;
	font-size: .85em;
	margin-top: -18px;
}
.ratesbox.three li {
    margin-bottom: -5px;
}
.nightsbox{
	color: #999;
	font-size:.8em;
	padding-right: 50px;
	white-space: normal;
	width: 10px;
}
.nightsbox li{
	padding-bottom: 12px;
	line-height: 18px;
}
.nightsbox span li{
	padding-top: 46px;
}
.nightsbox.two{
	position: absolute;
	text-align: right;
}
.nightsbox.two span{
	white-space: nowrap;
}

/* !ABOUT US */
#about #content{
	background-image: url(../images/BG_About.jpg);
	background-size: cover;
	background-position: left bottom;
	background-repeat: no-repeat;
}

/* !SPECIAL */
#special #content,
#rates #content{
	background-image: url(../images/BG_Special.jpg);
	background-size: cover;
	background-position: right top;
	background-repeat: no-repeat;
}
#local #content,
#calendar #content{
	background-image: url(../images/EnterLocal.jpg);
	background-size: cover;
	background-position: right bottom;
	background-repeat: no-repeat;
}

#footer{
	display:none;
	clear:both;
}

/* !NAV */
#nav{
	display:block;
	position:relative;
	top: 50%;
	margin: -16px 0 0 0;
	height:28px;
	width: 100%;
	vertical-align: middle;
}
#logo-nav, #logo-nav a{
	color: #33cccc;
	font-size:1.3em;
	letter-spacing: 0px;
	padding-left: 10px;
	display: inline-block;
	margin-top: 1px;	
}
#global-nav{
	display: inline-block;
	position: absolute;
	white-space: nowrap;
	padding: 10px;
	left:170px;
	opacity: 1.0;
	font-size: 14px;

}
#global-nav li{
	float:left;
	display:inline;
	padding:0px 7px 0 8px;
}
#photos #global-nav li a.photos,
#details #global-nav li a.details,
#map #global-nav li a.map,
#calendar #global-nav li a.calendar,
#special #global-nav li a.special,
#about #global-nav li a.about,
#local #global-nav li a.local,
.features #subnav a.features,
.booking #subnav a.booking,
.included #subnav a.included,
.remember #subnav a.remember
{
	color: #FFF;
}

/* !FONTS */
@font-face {
	font-family: my_font_light;
	src: url('../fonts/MyFont-Light.otf');
	font-weight: normal;
}
/*@font-face {
    font-family: 'my_font_light';
    src: url('../fonts/MyFont-Light.eot');
    src: url('../fonts/MyFont-Light.ttf') format('truetype'),
         url('../fonts/MyFont-Light.svg') format('svg'); 
    font-weight: normal;
}
@font-face {
    font-family: 'my_font_reg';
    src: url('../fonts/MyFont-Regular.eot');
    src: url('../fonts/MyFont-Regular.ttf') format('truetype'),
         url('../fonts/MyFont-Regular.svg') format('svg'); 
   	font-weight: normal;
}*/
@font-face {
	font-family: my_font_reg;
	src: url('../fonts/MyFont-Regular.otf');
    font-weight: normal;
}
@font-face {
    font-family: 'social';
    src: url('../fonts/MonoSocialIconsFont-1.10.eot');
    src: url('../fonts/MonoSocialIconsFont-1.10.eot?#iefix') format('embedded-opentype'),
         url('../fonts/MonoSocialIconsFont-1.10.woff') format('woff'),
         url('../fonts/MonoSocialIconsFont-1.10.ttf') format('truetype'),
         url('../fonts/MonoSocialIconsFont-1.10.svg#MonoSocialIconsFont') format('svg');
    src: url('../fonts/MonoSocialIconsFont-1.10.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
h1,h2,#social{
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
}
#logo-nav,a,p,h1,h2,li,#social, .ps-caption-content{
	-webkit-text-rendering: optimizeLegibility;
    -moz-text-rendering: optimizeLegibility;
    -ms-text-rendering: optimizeLegibility;
    -o-text-rendering: optimizeLegibility;
    text-rendering: optimizeLegibility;
} 
.box span h3,.ps-caption-content, .rentme{
	-webkit-font-smoothing: subpixel-antialiased;
	-moz-font-smoothing: subpixel-antialiased;
	-ms-font-smoothing: subpixel-antialiased;
	-o-font-smoothing: subpixel-antialiased;
}

/* !SOCIAL */
#social{
    font-family: 'social';
	display: inline-block;
	position: absolute;
	right: 105px;
	margin-top: -1px;
	padding-right: 5px;	
}
#social a{
    color: #666;
	display: inline-block;
	padding-right: 1px;
	padding-left: 1px;
}
#social .pinterest,
#social .facebook,
#social .email{
	margin-left: -6px;	
}

#social .pinterest:before,
#social .facebook:before,
#social .email,
#social .fullscreen:before{
	font-family: 'social';
	font-size: 1.9em;
	font-style: normal;
	font-weight: normal;
	line-height: 1;
}
#social .pinterest:before {
  content: "\e064";
}
#social .facebook:before {
	content: "\e027";
}
#social .email{	
	width: 25px;
	height: 20px;
}
#social .email {opacity: 0.5;}
.ps-toolbar-close {opacity: 0.7;}
#social .email,
.ps-toolbar-close{
	-webkit-transition: opacity 0.3s;
	-moz-transition: opacity 0.3s;
	-o-transition: opacity 0.3s;
	transition: opacity 0.3s;	
}
#social .email:hover,
.ps-toolbar-close:hover{
	opacity: 1;
}
#social .fullscreen:before {
  content: "\e002";
}
.divider,
.divider a{
	color: #323232 !important;
	border-left: 1px solid;
	width: 10px;
	height: 35px;
	margin-left: 9px;
	margin-bottom: -10px;	
}

/* !BUTTONS */
#buttons,
#buttons-login{
	font-size: .75em;
	text-align: center;
	-webkit-transition: color 0.3s;
	-moz-transition: color 0.3s;
	-o-transition: color 0.3s;
	transition: color 0.3s;
}
#buttons-login,
#buttons-login .enter,
#buttons-login .password{
	display: inline-block;
	vertical-align: top;

}
#buttons-login .password{
	background-color: rgba(255,255,255,0.9);
	border: 1px solid #FFF;
	margin-top: 0px;
	width: 64px;
	height: 10px;
	padding:5px 5px 8px 5px;
}	
#buttons-login .enter{
	background-color: rgba(0,0,0,0.2);
	color: #AAA;
	border: 1px solid #AAA;
	margin-left: 3px;
	width: 50px;
	height: 25px;
	padding:4px 0px 7px 0px;
}	
#buttons-login .password{
	-webkit-border-radius: 3px;
	border-radius: 3px;
}
#buttons-login input{
	text-align: center;
}
#buttons .rentme:hover,
#buttons-login .enter:hover{
	color: #FFF;
}
#buttons .rentme{
	border: 1px solid;
	position: absolute;
	right: 15px;
	margin-top: -26px;
	width: 80px;
	height: 18px;
	padding:6px 5px 0px 5px;
	white-space: nowrap;
	letter-spacing: 0px;
}

/* !ICONS */
.features .featurebox ul li,
.specialfeatures .featurebox ul li,
#social .email,
#smiley{
	background-image: url("../images/icons.png");
	background-position: 0 0;
	background-repeat: no-repeat;
}
.featurebox ul li.bed {
	background-position: -7px 0;
}
.featurebox ul li.sleeps {	
	background-position: -7px -30px;
}
.featurebox ul li.checkin {	
	background-position: -7px -60px;
}
.featurebox ul li.checkout {
	background-position: -7px -90px;
}
.featurebox ul li.nosmoke {
	background-position: -7px -120px;
}
.featurebox ul li.nopets {
	background-position: -7px -150px;
}
.featurebox ul li.cable {
	background-position: -7px -180px;
}
.featurebox ul li.appletv {
	background-position: -7px -210px;
}
.featurebox ul li.wireless {
	background-position: -7px -240px;
}
.featurebox ul li.fire {
	background-position: -7px -270px;
}
.featurebox ul li.parking {
	background-position: -7px -300px;
}
.featurebox ul li.family {
	background-position: -7px -330px;
}
.featurebox ul li.washer {
	background-position: -7px -360px;
}
.featurebox ul li.pets {
	background-position: -7px -390px;
}
#social .email {
	background-position: 0 -483px;
}
#smiley {
	background-position: -7px -418px;
	width: 18px;
	height: 18px;
	position: absolute;
	margin-left: 2px;
}
#portrait{display: none;}

/* <-------------------- RESPONSIVE TWEAKS ---------------------> */


/* Smartphones (portrait+landscape) ----------- */
@media only screen 
	and (min-width : 2px) 
	and (max-width : 640px) {

/* !-------->iHome<--------*/
	body{
		height: 88%;
		overflow-x: hidden;
		overflow-y: scroll;
	}
	#details{
	background-color: #161a1b;
	}
	#hero{
		opacity: 0.15; 
		filter: alpha(opacity=15);
	}
	#wrapper{
		width: 280px;
		margin-top: -100px;
		margin-left: -135px;
	}	
	#logo .title{
		font-size: 3.3em;
		margin-left: 0px;
	}
	#logo .intro{
		font-size: .85em;
		letter-spacing:2px;
		word-spacing: -2px;
		margin-right: 100px;
	}
	#logo .description{	
		font-size: .7em;
		color:#b9b9b9;	
		margin-bottom: -11px;
		line-height: 15px;
	} 
/* !-------->iNav<--------*/
	#social {
		display: none;
	}
	.divider{
		display: none !important;
	}
	#global-nav{
		display: none;
	}
	#logo-nav{
		padding-left: 45px !important;
	}	
	#menubar{
		min-height: 10px;
		height: 12%;
		display: none !important;
	}
	#menumobile{
		visibility: visible;
	}
	#logo-nav, #logo-nav a{
		font-size:1em;
		padding-left: 5px;
		margin-top: 4px;	
	}
/* !-------->iTHUMBS<--------*/
	.X1{
		min-height: 310px;
		margin-top: 4px;	
		padding-bottom: 4px;	
	}
	.X1,.X2{
		margin-left: -3.0%;
	}
	.X2{
		min-height: 310px;
		margin-top: 0px;
		padding-bottom: 35px;
	}
	.X2 .box{
		height: 21.7%;	
	}
	.box{
		width: 32%;
		height: 24.5%;	
		margin: 4px -4px 0px 8px;
	}


/* !-------->DETAILS<--------*/
	#details{
		height: 100%;
	}
	h1{
		font-size: 1.3em;
		padding-bottom: 2%;
	}
	#photo {
		width: 100%;
		display: inline-block;
		position: relative;
		float: none;
	}
	#content{
		max-height: 400px;		
	}
	#subnav{
		display: none;
	}
	#column-details,
	#column-rates{
		right: 0;
		width: 100%;
		min-width: 0px;
		font-size: 90%;
		margin-top: 0px;
		position: relative;
		min-height: 430px;		
	}
	#rates #content {
	background-image: none;	
	}
	#column-special{
/* 		background-color: #161a1b; */
		min-height: 430px;		
	}
	#column-calendar{
		background-color: #161a1b; 
	}
	.featurebox.one,
	.featurebox.two {
		margin-right: 2%;
		margin-bottom: 5%;
	}
	#infobox-features{
		width: 90%;	
		top: 20px! important;
	}
	.ratesbox {
		padding-right: 4%;
	}
	.ratesbox li {
		padding-bottom: 20px;
	}
	.nightsbox{
		padding-right: 12%;
	}
	.nightsbox li {
		padding-bottom: 8px;
		line-height: 12px;	
	}
	.nightsbox span li{
		padding-top: 44px;
	}	
	.booking #infobox-features, 
	.included #infobox-features,
	.remember #infobox-features {
		width: 90%;
	}
	.featurebox,
	#rates .infobox-features{
		white-space: normal;
	}
	.houserules {
		padding-top: 10px;
	}
	#rates .ratesbox {
		padding-right: 37px;
	}
	#rates .nightsbox {
		padding-right: 30px;
	}
	#rates .nightsbox li{
		line-height: 18px;
	}
	#rates .nightsbox{
		position: relative;
	}
/*
	#rates #photo{
		display: none !important;
	}
*/
	
/* !-------->CALENDAR<--------*/
	#calendar{
/* 		min-height: 820px; */
	}
	#calendar #content{
		background-image: none;
		min-height: 840px;
		background-color: #161a1b;		
	}
	#datepicker {
		height: 100%;
		width: 100%;
		left: 0;
		top: 25px;
		margin-top: 0;
		margin-left: 0;
		font-size: 75%;
	}
	.ui-datepicker.ui-datepicker-multi {
		width: auto;
		width: 100%;
		display: inline-block;
	}
	.ui-datepicker-group {
		padding: 1% 0 0 2% !important;
		width: 150px !important;
		max-height: 125px !important;
	}	
	.ui-datepicker.ui-datepicker-multi{
		width: 100% !important;	
		position: relative;
	}
	.ui-datepicker td {
		padding: 1px !important;
	}
	.ui-datepicker th {
		padding: .4em .3em !important;		
	}
	.ui-datepicker .ui-datepicker-title {
		line-height: 1em !important;
	}
	.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
		color: #ff0000	;
	}	
	.ui-datepicker-row-break {
		display: none;
	}
	#bookednote {
		top: -15px;
		margin-left: 10px;
	}
	#bookednote span{
		font-weight: bold;
		color: white
	}
	
/* !-------->ABOUT<--------*/
	#about #infobox {
		top: 20px;
		left: 7%;
		margin-top: 0;
		width: 90%;
	}
	#about p {
		font-size: .8em;
		line-height: 1.5em;	
	}
/* !-------->SPECIAL<--------*/
	#about #infobox {
		top: 20px;
		left: 7%;
		margin-top: 0;
		width: 90%;
	}
	#special h1 {
		font-size: 1.1em;
	}
	#special #infobox {
	margin: -50px -135px;
	width: 90%;
	}
	input {
	    -webkit-appearance: none;
	}			
	
/* !-------->SOCIAL<--------*/
	#social.mobile {
		display: inline !important;
		padding-right: 15px;
	}
	#social.mobile a{
		padding-right: 10px;
		padding-left: 10px;
	}
	#buttons .rentme {
		right: -95px;
		width: 85px;			
	}
	#social.mobile .pinterest, #social.mobile .facebook, #social.mobile .email {
		margin-left: 9px;
		margin-right: 9px;
	}
	#arrows{display: none !important;}
	#desk{display: none;}	
	#portrait{display: block;}	
}

/* All Touch Devices */
@media only screen 
and (min-width : 2px) 
and (max-width : 1024px) {
	/* iGallery Controls */
	.arrows-nav.arrows-prev,
	.arrows-nav.arrows-next {
		display: none;
	}
	div.ps-toolbar {
		height: 10% !important;
		top: 0px !important;
	}
	div.ps-toolbar-close {
		margin: 14px -11px 0 0px !important;
		width: 50px;
		height: 50px;
	}
	.box:hover span {
		opacity: 0;
	}	
	.box span h3 {
		font-size: .6em;
		margin-top: -8px;
		padding: 0px 6% 0px 6%;
	}
	div.ps-caption {
		height: 35px !important;
		font-family: my_font_reg !important;
		background-color: rgba(0,0,0,.65) !important;
	}
	.gmnoprint {
		display: none !important;
	}
	/* Arrows for iphone*/
	.arrownext span{
		right: -4px;
	}
	.arrowprev span{
		left: -4px;
	}
	#photos .arrowsnav{
		opacity: 1;
	}
	#photos .arrowsnav{
		background-color: rgba(0,0,0,0.5);
		width: 28px;
		height: 70px;
		margin-top: -39px;
	}
	.arrowsnav.arrownext{
		margin-right: -2px;
	}
	.arrowsnav.arrowprev{
		margin-left: -2px;
	}	
}
	
/* Smartphones (landscape) ----------- */
@media only screen 
and (min-width : 321px) 
and (max-width : 640px) {
	body{
		height: 88%;
	}
	.X1,
	.X2{
		margin-left: -3.0%;
	}
	.box{
		width: 24%;
		height: 31% !important;	
		margin: 4px -4px 0px 8px;
	}
}

/* Smartphones (portrait) ----------- */
@media only screen 
and (min-width : 3px) 
and (max-width :320px) {
	body{
		height: 90%;	
	}
	#menubar {
		height: 10%;
		display: none;
	}
	.box{
		height: 24.5%;
	}
	div.ps-caption{
		width: 250px !important;
		overflow: visible !important;	
		margin-left: 35px !important;
	}
	#special #infobox {
	top: 43%;
	}
	.ps-carousel {
		max-height: 65% !important;
		top: 20% !important;
	}	
}

/* iPads (landscape) ----------- */
@media only screen
    and (min-width : 768px)
    and (max-width : 1024px)
    and (orientation : landscape) {
	.box {
		margin: 8px -6px 0px 12px;
	}
	#social a {
		padding-right: 10px;
	}	
}

/* iPads (portrait) ----------- */
@media only screen
    and (min-width : 768px)
    and (max-width : 1024px)
    and (orientation : portrait) {
	.box{
		width: 32.75%;
		height: 25%;	
		margin: 4px -4px 0px 8px;
	}
	body{
		height: 94%;	
	}
	#menubar {
		height: 6%;
	}
	#global-nav{
		font-size: 13px;
		left: 150px;
	}
	#global-nav li{
		padding: 0px 6px 0 8px;
	}
	#logo-nav{
		padding-left: 0px;
	}
	#buttons .rentme{
		right: 10px;
	}
	#social{
		right: 100px;
	}
	/* Arrows for ipad*/
	.arrowsnav{
		height: 108px;
	}
}

/* Desktop ----------- */
@media only screen
    and (min-width : 1025px){

	body{
		min-height: 600px !important;
		min-width: 900px !important;
	}
	#menubar{
		min-width: 900px !important;
	}
	.box {
		width: 24.1%;
		margin: 8px -4px 0px 12px;
	}		
}

/* <-------------------- MOBILE MENU ---------------------> */
.m-menu {
	background: #000000;
	position: fixed;
}
.m-menu h3 {
	color: #ffffff;
	font-size: 1.9em;
	padding: 8px 10px 8px 40px;
	margin: 0;
	font-weight: 300;
	background: #000;
}
#ilinks a {
	display: block;
	color: #fff;
	font-size: 1em;
	font-weight: 300;
	width: 100%;
	padding:.5em .5em .5em .8em;
	overflow-y: scroll;	
}
#ilinks a:hover {
	background: #292929;
}
#ilinks a:active {
	background: #747474;
	color: #ffffff;
}
.m-menu-horizontal {
	width: 100%;
	height: 310px;
	left: 0;
	z-index: 9999;
	overflow-x: hidden;
	overflow-y: scroll;
}
.m-menu-horizontal h3 {
	width: 100%;
	color: #33cccc;
/* 	border-bottom: 1px solid #454545; */
}

/* menu */
.m-menu-bottom {
	bottom: -270px;
}
.m-menu-bottom.m-menu-open {
	bottom: 0px;
}

/* Transition */
.m-menu {
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	transition: all 0.2s ease;
}
.ibox {
  	position: relative;
	padding-left: 1.25em;
}
.ibox:before {
	content: "";
	position: absolute;
	left: 12px;
	top: 15px;
	width: 22px;
	height: 0.05em;
	background: #FFF;
	box-shadow: 0 0.25em 0 0 #FFF, 0 0.5em 0 0 #FFF;
}
/* iOS SCROLLBAR */
::-webkit-scrollbar {
    width: 0px;
}





