/*
* Skeleton V1.1
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 8/17/2011
*/

/* Table of Contents
==================================================
01. RETINA STYLES
02. BASE STYLES (1140px)
03. #DESKTOP (960px)
04. #Tablet (Portrait)
05. #Mobile (Portrait)
06. #Mobile (Landscape)
07. TESTING TEXT
*/



/*
=============================================== 01. RETINA STYLES ===============================================
*/
@media screen and (-webkit-min-device-pixel-ratio: 1.5) {
	#anchor-check-in select {background-image: url(../images/select-arrow2@2x.png), -webkit-linear-gradient(#ffffff, #f7f7f7 40%, #f7f7f7); background-position: center right; background-repeat: no-repeat; background-size:contain;}
	#anchor-check-in input {
		background-image: url(../images/date-icon@2x.png),  -webkit-linear-gradient(#ffffff, #f7f7f7 40%, #f7f7f7);
		background:url(../images/date-icon@2x.png), linear-gradient(#ffffff, #f7f7f7 40%, #f7f7f7);
		background-image: url(../images/date-icon@2x.png),-moz-linear-gradient(#ffffff, #f7f7f7 40%, #f7f7f7);
		background-position: center right; background-repeat: no-repeat;
		background-size: contain;
	}
	nav select {background-image: url(../images/select-arrow@2x.png),  -webkit-linear-gradient(#FAFAFA, #f9f9f9 40%, #e8e8e8) !important;background: linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5);
	background-image: -moz-linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5);background-position: center right; background-repeat: no-repeat; background-size:contain;}
	.searchform #s {background-image: url(../images/search-magnify@2x.png); background-size: 30px 30px; }
	.flex-direction-nav a {background-image: url(../images/slider/arrows@2x.png); background-size:68px 69px;}
	.flex-control-paging li a {background-image:url(../images/slider/bg_bullets@2x.png); background-size:20px 85px;}
	ul.checkmark li {background-image: url(../images/checkmark@2x.png); background-size: 11px 12px; }
	ul.arrow li { background-image:url(../images/sidebar-arrow@2x.png); background-size:15px 35px;}
	
	.example-retina {background-image:url(../images/example-retina@2x.png); background-size:20px 85px;}
}
@media only screen and (max-width: 767px) and (-webkit-min-device-pixel-ratio: 1.5) {
}

/* IE7-IE8 Fixes*/
.lt-ie9 ul.checkmark li {background-image: url(../images/checkmark.png);}
.lt-ie9 ul.arrow li { background-image:url(../images/sidebar-arrow.png);}
.lt-ie9 .example-retina {background-image: url(../images/example-retina.png); }
.lt-ie9 searchform #s {background-image: url(../images/search-magnify.png);  }
.lt-ie9 .flex-direction-nav a {background-image: url(../images/slider/arrows.png); }
.lt-ie9 .flex-control-paging li a {background-image:url(../images/slider/bg_bullets.png); }

}




/*
=============================================== 02. BASE STYLES (1175px) ===============================================
*/
/* Note: Design for a width of 1175px */
body:after {content: "Wider than 1175px";background-color: hsla(270,60%,40%,0.7);}/* Notify what @media browser is using, Disable above by display:none; */
html {-webkit-text-size-adjust: none;}	/* Removes webkit font resizing */ 
body {max-width:100%; width:100%;}
img {max-width:100%; height: auto;}
.width-container {-moz-transition: all .2s ease-in-out; -webkit-transition: all .2s ease-in-out; }

p img {max-width:100%;width:auto;}
.content-container-anchor table tr td img { width:99%;}


/*
=============================================== 03. #DESKTOP (960px) ===============================================
*/
/* Note: Design for a width of 960px */
@media only screen and (min-width: 959px) and (max-width: 1175px) {
body:after {content: "959px to 1139px";background-color: hsla(270,60%,40%,0.7);}/* Notify what @media browser is using, Disable above by display:none; */ 


.width-container {width:935px;} /* Default Width */
body #logo {width:25%;}
.grid4column p, ul, ol {
    font-family: Arial,Helvetica,sans-serif;
    font-size: 12px;
    margin-bottom: 14px;
}
.reservation table tr td{width:0%!important; padding:7px;}
#bx-pager img:last-child {
    margin: 0 0 0 8px;
}
.sf-menu a {padding-right:12px ; padding-left:12px;}
#contact-header-text { padding-left:18px;}
#header-search .icons {padding-right:5px;}
.genericon {margin-right:2px;}
.searchform #s, .searchform #s:focus {width:120px;}

/* Homepage Reservation Form Styles */
#anchor-check-in select {padding-left:6px; padding-right:6px; -webkit-padding-start: 10px; -webkit-padding-end: 45px; margin-right:6px;}
#anchor-check-in input { padding-right:6px; padding-left:8px; margin-right:6px; width:120px;}
body #anchor-check-in  .wufoo input.submit {padding:13px 20px; -webkit-padding-start: 20px; -webkit-padding-end: 20px; width:auto;}


/* Slider Caption Sizes */
.caption-text {  font-size:24px;}
.flex-caption h2 {   font-size:30px;  }
.flex-caption .slider-container, .flex-control-nav {bottom:59px;}


#flickr-footer ul li img {width:51px; height:51px; }


}



/*
=============================================== 04. #Tablet (Portrait) ===============================================
*/
/* Note: Design for a width of 768px */

@media only screen and (min-width: 768px) and (max-width: 959px) {
body:after {content: "768 to 959px";background-color: hsla(270,60%,40%,0.7);}/* Notify what @media browser is using, Disable above by display:none; */ 

/* Default Width */
.width-container { width: 748px; }
.content-container-anchor {padding:26px;}

.content-container-anchor table tr td img { width:99%;}
body {font-size:13px;}
body #logo {width:25%;}
.grid4column p, ul, ol {
    font-family: Arial,Helvetica,sans-serif;
    font-size: 11px;
    margin-bottom: 14px;
}
.reservation select {
    background-color: #fff;
    color: #4e4e4e;
    font-size: 11px;
	margin-right: 1px;
}
.button-anchor, body #contact-wrapper input.submit, body #reply input.submit {
    padding: 7px 9px!important;
    font-size: 11px!important;
}
.reservation table tr td{font-size: 7px;}
#bx-pager img:last-child {
    margin: 0 0 0 8px;
}
.social ul li {
    display: inline-block;
    float: left;
    margin-right: 2px;
}
.social {
    margin: 0 0 -14px;
    padding-left: 7px;
}
#mc_embed_signup input#mc-embedded-subscribe {
    background-color: #ddd;
    background-image: -moz-linear-gradient(center top , #e5e5e5, #d4d4d4);
    border-left: 1px solid #afafaf;
    border-radius: 2px;
    color: #4e4e4e;
    cursor: pointer;
    display: inline-block;
    font-size: 12px;
    left: 93px;
    padding: 7px 7px 6px;
    position: relative;
    text-decoration: none;
    top: -28px;
    width: auto;
}
/* Misc Fixes */
.sf-menu a {padding-right:0px ; padding-left:8px;}
#contact-header-text { padding-left:14px;}
#header-search .icons {padding-right:5px; display:none;}
.genericon {margin-right:2px;}
.searchform #s, .searchform #s:focus {width:100px;}

.button-anchor, body #contact-wrapper input.submit, body #reply input.submit {padding:10px 15px; font-size:12px;}
#anchor-check-in  .button-anchor { padding-top:13px; padding-bottom:13px;}
body #anchor-check-in  .wufoo input.submit {padding:12px 20px;  font-size:12px; width:auto;}


/* Slider Caption Sizes */
.caption-text {  font-size:22px;}
.flex-caption h2 {   font-size:28px;  }
.flex-caption .slider-container, .flex-control-nav {bottom:50px;}


/* Homepage Reservation Form Styles */
#anchor-check-in select {background-image: -webkit-linear-gradient(#ffffff, #f7f7f7 40%, #f7f7f7); font-size:12px; padding-left:4px; padding-right:4px; -webkit-padding-start: 8px; -webkit-padding-end: 8px; margin-right:6px;}
#anchor-check-in input {font-size:12px; padding-right:3px; padding-left:6px; margin-right:6px; width:100px;}
#anchor-check-in  .button-anchor { padding-right:13px; padding-left:13px; font-size:11px;}


#flickr-footer ul li img {width:38px; height:38px; padding:2px; }


h2.title-anchor.title-heading {font-size:26px;}
h2.title-anchor span {padding-top:0px; }


}



/*
=============================================== 05. #Mobile (Portrait) ===============================================
*/
/* Note: Design for a width of 320px */

@media only screen and (max-width: 767px) {
body:after {content: "0 to 480px"; background-color: hsla(90,60%,40%,0.7);}/* Notify what @media browser is using, Disable above by display:none; */ 
.hide_mobile {display:none;}
.show_mobile{display:block;}
.grid4column img{max-width:100%;width:93%;}
.reservation select {
    background-color: #FFF;
color: #4E4E4E;
font-size: 12px;
margin-right: 1px;
width: 70px;
margin-bottom: 1px;
border: 2px solid #4E4E4E;
}

.reservation table tbody tr td:nth-child(3){ position: relative;
    right: 74px;
    top: 37px;}
	.reservation table tbody tr td:nth-child(4){ position: relative;
    right: 74px;
    top: 0px;}
	.reservation table tbody tr td:nth-child(5){ position: relative;
right: 74px;
top: -39px;}
.reservation table tbody tr td:nth-child(6){position: relative;
right: 191px;
top: 23px;}
#mc_embed_signup input#mc-embedded-subscribe {
    text-decoration: none;
    cursor: pointer;
    display: inline-block;
    border-left: 1px solid #AFAFAF;
    padding: 7px 7px 6px;
    font-size: 12px;
    position: relative;
    left: 155px;
    top: -28px;
    width: auto;
    border-radius: 2px;
    color: #4E4E4E;
    background-color: #DDD;
    background-image: -moz-linear-gradient(center top , #E5E5E5, #D4D4D4);
}
.reservation {
  
    padding: 33px 0 12px 7px;
}
.service_box ul li {
    
    width: 78%;
   
}
.backstretch img {
  
    height: 104.25px !important;
  
}
.bx-viewport {
    width: 100%;
    overflow: hidden;
    position: relative;
    height: auto!important;
}
#bx-pager img:last-child {
    margin: 0px 0px 3px 2px;
}
#bx-pager img {
    width: 14%;
    border: 1px solid #FFF;
    
}
#bx-pager {
    margin-top: -50px;
}
.reservation .AccessCode {
    width: 81%;
    padding: 5px 1px;
    border: 2px solid #4E4E4E;
}
.reservation table tr td {
    font-size: 7px;
    width: 14% !important;
	vertical-align: top;
}
/* Default Width */
.width-container { width: 300px; }
.content-container-anchor {padding:20px;}

/* Default Grid */
#content-container, #sidebar, .grid2column, .grid3column, .grid3columnbig, .grid4column, .grid4columnbig {width:100%; margin-bottom:20px;}
footer #copyright, footer #copyright .icons {text-align:center;}
body .grid4column.room-list-side {padding-top:0px; margin-top:-20px; padding-bottom:0px; border:none;}

/* Font Sizes */
body {font-size:12px;}
h1 {font-size:30px;   }
h2 {font-size:18px;  }
h2.title-anchor.title-heading {font-size:22px;}
h3 {font-size:16px;}
h4 {font-size:15px; }
h5 {font-size:14px; }
h6 {font-size:14px; margin-bottom:6px; }
h6.post-type-header {font-size:15px;}

h2.title-anchor span {padding-top:0px; font-size:15px; display:block; float:none;}

.commentlist {width:95%; left:-10px;}
.commentlist .children li.comment .comment-meta {margin-left:0px;}
.commentlist .avatar, .commentlist > li:before {display:none;}

.button-anchor, body #contact-wrapper input.submit, body #reply input.submit {padding:5px; font-size:11px;margin-top:2px;}
.progression-tab a { font-size:12px; padding-right: 30px; padding-left:15px; padding-top:10px; padding-bottom:10px; }
.progression-tab-container .progression-div {padding:15px;}

/* Slider Caption Sizes */
.caption-text {  font-size:12px; margin-bottom:-2px;}
.flex-caption h2 { font-size:15px; }
.flex-caption .slider-container, .flex-control-nav {bottom:25px;}
.flex-control-nav {display:none;}
.overlay-container-anchor {top:0px;}

#page-title-page {height:100px;}

/* Homepage Reservation Form Styles */
#anchor-check-in select {display:block; margin-bottom:7px; float:none; font-size:12px; }
#anchor-check-in input {display:block; margin-bottom:7px; float:none;  font-size:12px; width:160px;}
#anchor-check-in  .button-anchor,  body #anchor-check-in  .wufoo input.submit { padding-right:13px; padding-left:13px; font-size:11px;}


/* HEADER Fixes */
body #logo {float:none; position:static; text-align:center; margin:0 auto 15px auto;}
#contact-header-text { padding-left:0px; text-align:center; margin-left:0px; font-size:12px;}
#header-search {float:none; text-align:center;}
#header-search .searchform {float:none; margin:0px auto; padding:15px 0px 20px 0px; }
#header-search .icons {position:static; padding:0px; text-align:center; display:block; float:none; margin:0 auto;}

/* Select Menu */
nav ul { display: none; }  
nav select option {font-size:12px; background:#fff; color:#888;}
header nav {float:none; text-align:center; z-index:0; margin-left:0px;}
nav select { text-transform:none; display:block; margin:0px auto 20px auto; width:300px; min-width: 150px; max-width: 100%; -webkit-appearance: none; -moz-appearance: normal; appearance: normal;
-webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
 -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1); box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
-webkit-padding-end: 20px; -webkit-padding-start: 2px; -webkit-user-select: none;-moz-user-select: none;
background-image: url(../images/select-arrow.png),  -webkit-linear-gradient(#FAFAFA, #f9f9f9 40%, #e8e8e8);
background: linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5);
background-image: -moz-linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5);
background-position: center right; background-repeat: no-repeat;
font-size:13px;
border: 1px solid #aaaaaa;
color: #555555;
padding:7px 5px 7px 10px;}

/* prettyPhoto styling for small screens */
.pp_pic_holder.pp_default { width: 100%!important; left: 0!important; overflow: hidden; }
div.pp_default .pp_content_container .pp_left { padding-left: 0!important; }
div.pp_default .pp_content_container .pp_right { padding-right: 0!important; }
.pp_content { width: 100%!important; height: auto!important; }
.pp_fade { width: 100%!important; height: 100%!important; }
a.pp_expand, a.pp_contract, .pp_hoverContainer, .pp_gallery, .pp_top, .pp_bottom { display: none!important; }
#pp_full_res img { width: 100%!important; height: auto!important; }
.pp_details { width: 94%!important; padding-left: 3%; padding-right: 4%; padding-top: 10px; padding-bottom: 10px; background-color: #fff; margin-top: -2px!important; }
a.pp_close { right: 10px!important; top: 10px!important; }


}


/*
=============================================== 06. #Mobile (Landscape) ===============================================
*/
/* Note: Design for a width of 480px */

@media only screen and (min-width: 480px) and (max-width: 767px) {
body:after { content: "480 to 767px"; background-color: hsla(150,50%,40%,0.7);}/* Notify what @media browser is using, Disable above by display:none; */
.backstretch img {
  
    height: 124.25px !important;
  
}
.bx-viewport {
    width: 100%;
    overflow: hidden;
    position: relative;
    height: auto!important;
}
.service_box ul li {
    
    width: 78%;
   
}
.reservation {
    padding: 29px 0px 12px 28px;
}
.reservation table tbody tr td:nth-child(6) {
    position: relative;
    right: 52px;
    top: -3px;
}
#bx-pager img:last-child {
    margin: 0px 0px 3px 2px;
}
#bx-pager img {
    width: 14%;
    border: 1px solid #FFF;
    
}
#bx-pager {
    margin-top: -50px;
}
/* Default Width */
.width-container { width: 420px; }
.reservation select {
    background-color: #FFF;
color: #4E4E4E;
font-size: 12px;
margin-right: 1px;
width: 70px;
margin-bottom: 1px;
border: 2px solid #4E4E4E;
}
.reservation .AccessCode {
    width: 100%;
    padding: 5px 1px;
    border: 2px solid #4E4E4E;
}
.reservation table tr td {
    font-size: 7px;
    width: 14% !important;
	vertical-align: top;
}
.reservation table tr td:last-child { position:relative;top:20px; right:230px}
#mc_embed_signup input#mc-embedded-subscribe {
    text-decoration: none;
    cursor: pointer;
    display: inline-block;
    border-left: 1px solid #AFAFAF;
    padding: 7px 7px 6px;
    font-size: 12px;
    position: relative;
    left: 150px;
    top: -28px;
    width: auto;
    border-radius: 2px;
    color: #4E4E4E;
    background-color: #DDD;
    background-image: -moz-linear-gradient(center top , #E5E5E5, #D4D4D4);
}
.hide_mobile {display:none;}
.show_mobile{display:block;}
.grid4column img{max-width:100%;width:50%;}

}



/*
=============================================== 07. TESTING TEXT ===============================================
*/
body:after {position:relative; z-index:55; content: "less than 320px";font-size: 300%;font-weight: bold;position: fixed;bottom: 60px;width: 100%;text-align: center;background-color: hsla(1,60%,40%,0.7);color: #fff;
display:none !important; /* -------------------- ADD OR REMOVE display:none !important; to display testing text -------------------- */}