/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */

/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html,
button,
input,
select,
textarea {
    color: #222;
}

html {
    font-size: 1em;
    line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

/*
 * Remove the gap between images, videos, audio and canvas and the bottom of
 * their containers: h5bp.com/i/440
 */

audio,
canvas,
img,
video {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Browse Happy prompt
   ========================================================================== */

.browsehappy {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */
/* FONTS */

@font-face {
  font-family: 'mandalay-icon-font';
  src: url('fonts/mandalay-icon-font.eot?79950125');
  src: url('fonts/mandalay-icon-font.eot?79950125#iefix') format('embedded-opentype'),
       url('fonts/mandalay-icon-font.woff?79950125') format('woff'),
       url('fonts/mandalay-icon-font.ttf?79950125') format('truetype'),
       url('fonts/mandalay-icon-font.svg?79950125#mandalay-icon-font') format('svg');
  font-weight: normal;
  font-style: normal;
}
/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
    font-family: 'mandalay-icon-font';
    src: url('../font/mandalay-icon-font.svg?79950125#mandalay-icon-font') format('svg');
  }
}
*/

/* weather icons */
@font-face {
  font-family: 'weathericons';
  src: url('fonts/weathericons-regular-webfont.eot');
  src: url('fonts/weathericons-regular-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/weathericons-regular-webfont.woff') format('woff'), url('fonts/weathericons-regular-webfont.ttf') format('truetype'), url('fonts/weathericons-regular-webfont.svg#weathericons-regular-webfontRg') format('svg');
  font-weight: normal;
  font-style: normal;
}
.weather-icon.wicon-0:before { content: "\f056"; } /*tornado*/
.weather-icon.wicon-1:before { content: "\f00e"; } /*tropical storm*/
.weather-icon.wicon-2:before { content: "\f073"; } /*hurricane*/
.weather-icon.wicon-3:before { content: "\f01e"; } /*severe thunderstorms*/
.weather-icon.wicon-4:before { content: "\f010"; } /*thunderstorms*/
.weather-icon.wicon-5:before { content: "\f06b"; } /*rain and snow*/
.weather-icon.wicon-6:before { content: "\f068"; } /*rain and sleet*/
.weather-icon.wicon-7:before { content: "\f06b"; } /*snow and sleet*/
.weather-icon.wicon-8:before { content: "\f006"; } /*freezing drizzle*/
.weather-icon.wicon-9:before { content: "\f01c"; } /*drizzle*/
.weather-icon.wicon-10:before { content: "\f017"; } /*freezing rain*/ 
.weather-icon.wicon-11:before { content: "\f01a"; } /*showers*/
.weather-icon.wicon-12:before { content: "\f01a"; } /*showers*/
.weather-icon.wicon-13:before { content: "\f076"; } /*snow flurries*/
.weather-icon.wicon-14:before { content: "\f065"; } /*light snow showers*/
.weather-icon.wicon-15:before { content: "\f064"; } /*blowing snow*/
.weather-icon.wicon-16:before { content: "\f01b"; } /*snow*/
.weather-icon.wicon-17:before { content: "\f015"; } /*hail*/
.weather-icon.wicon-18:before { content: "\f068"; } /*sleet*/
.weather-icon.wicon-19:before { content: "\f063"; } /*dust*/
.weather-icon.wicon-20:before { content: "\f003"; } /*foggy*/
.weather-icon.wicon-21:before { content: "\f003"; } /*haze*/
.weather-icon.wicon-22:before { content: "\f003"; } /*smoky*/
.weather-icon.wicon-23:before { content: "\f012"; } /*blustery*/
.weather-icon.wicon-24:before { content: "\f012"; } /*windy*/
.weather-icon.wicon-25:before { content: "\f076"; } /*cold*/
.weather-icon.wicon-26:before { content: "\f002"; } /*cloudy*/
.weather-icon.wicon-27:before { content: "\f031"; } /*night cloudy*/ 
.weather-icon.wicon-28:before { content: "\f002"; } /*day cloudy*/
.weather-icon.wicon-29:before { content: "\f083"; } /*partly cloudy night*/
.weather-icon.wicon-30:before { content: "\f013"; } /*partly cloudy day*/
.weather-icon.wicon-31:before { content: "\f02e"; } /*night clear*/
.weather-icon.wicon-32:before { content: "\f00d"; } /*sunny*/
.weather-icon.wicon-33:before { content: "\f02e"; } /*fair - night */
.weather-icon.wicon-34:before { content: "\f00d"; } /*fair (day)*/
.weather-icon.wicon-35:before { content: "\f006"; } /*rain/hail */
.weather-icon.wicon-36:before { content: "\f00d"; } /*hot*/
.weather-icon.wicon-37:before { content: "\f01e"; } /*thunderstorms */
.weather-icon.wicon-38:before { content: "\f01e"; } /*thunderstorms */
.weather-icon.wicon-39:before { content: "\f01e"; } /*thunderstorms */
.weather-icon.wicon-36:before { content: "\f072"; } /*hot */
.weather-icon.wicon-40:before { content: "\f009"; } /*scattered showers */
.weather-icon.wicon-41:before { content: "\f01b"; } /*heavy snow */
.weather-icon.wicon-42:before { content: "\f00a"; } /*scattered snow showers*/
.weather-icon.wicon-43:before { content: "\f01b"; } /*heavy snow*/
.weather-icon.wicon-44:before { content: "\f002"; } /*partly cloudy*/
.weather-icon.wicon-45:before { content: "\f010"; } /*thundershowers */
.weather-icon.wicon-46:before { content: "\f01b"; } /*snow snowers*/
.weather-icon.wicon-47:before { content: "\f010"; } /*isolated thundershowers*/
.weather-icon.wicon-3200:before { content: " ";   } /* Service not available */


 
 [class^="icon-"]:before, [class*=" icon-"]:before {
  font-family: "mandalay-icon-font";
  font-style: normal;
  font-weight: normal;
  speak: none;
 
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: .2em;
  text-align: center;
  /* opacity: .8; */
 
  /* For safety - reset parent styles, that can break glyph codes*/
  font-variant: normal;
  text-transform: none;
     
  /* fix buttons height, for twitter bootstrap */
  line-height: 1em;
 
  /* Animation center compensation - margins should be symmetric */
  /* remove if not needed */
  margin-left: .2em;
 
  /* you can be more comfortable with increased icons size */
  /* font-size: 120%; */
 
  /* Uncomment for 3D effect */
  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}

.weather-symbol .weather-icon {display: inline-block; font-family: 'weathericons'; font-size: 0.9em; color: #fff;}/*was display: inline-block; font-family: 'weathericons'; font-size: 1.071em; color: #fff;*/


/* to stop accessiblity errors */
.hidden-text { position: absolute; text-indent: -9999px; }

.icon-navicon:before { content: '\e800'; } /* '' */
.icon-door-hanger:before { content: '\e801'; } /* '' */
.icon-knife-fork:before { content: '\e802'; } /* '' */
.icon-wine-glass:before { content: '\e803'; } /* '' */
.icon-pin:before { content: '\e804'; } /* '' */


h1,h2 { text-transform: uppercase; color: #000; font-weight: normal; }
h1 { font-size: 28px; margin: 15px 0; }
h2 { font-size: 24px; }
ul, p { color: #666666; font-size: 14px; }
h1 + p { font-size: 15px; }
ul { padding: 0 0 0 16px; }
p a, ul a { color: #02A78C; }

ul#sitemap { margin: 2em 0 3em; }

.button { display: inline-block; background: #00A08D; color: #fff; text-decoration: none; padding: 5px 10px 2px; font-size: 14px; border: 0; }

.dark-circle { border-radius: 50%; background: rgba(0,0,0,0.8); width: 200px;  height: 200px; -moz-background-clip: padding; -webkit-background-clip: padding; background-clip: padding-box; border: 4px solid rgba(0,0,0,0.3); }
html.lt-ie9 .dark-circle, html.lt-ie9 {background: transparent;-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#CC000000,endColorstr=#CC000000)";filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#CC000000,endColorstr=#CC000000);zoom: 1;}

.dark-square { background: rgba(0,0,0,0.65); -moz-background-clip: padding; -webkit-background-clip: padding; background-clip: padding-box; border: 4px solid rgba(0,0,0,0.3); }
html.lt-ie9 .dark-square , html.lt-ie9 .close.side-draw-toggle {background: transparent;-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#CC000000,endColorstr=#CC000000)";filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#CC000000,endColorstr=#CC000000);zoom: 1; }

.central-content { position: relative; max-width: 1024px; width: 100%; margin: 0 auto; }
.max-width { max-width: 1480px; margin: 0 auto; }
html.lt-ie9 .max-width { min-width: 1024px; } /* it's not responsive */

.spritesheet { background: url(../img/spritesheet.png) no-repeat; }
html.backgroundsize .spritesheet { -webkit-background-size: 250px auto; -moz-background-size: 250px auto; -o-background-size: 250px auto; background-size: 250px auto; }

.turquoise { color: #02A78C; }
.error { color: red; }

.brown-gradient {
background: #dcdacf; /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2RjZGFjZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iI2Y3ZjZmNCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNkY2RhY2YiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(left,  #dcdacf 0%, #f7f6f4 50%, #dcdacf 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%,#dcdacf), color-stop(50%,#f7f6f4), color-stop(100%,#dcdacf)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(left,  #dcdacf 0%,#f7f6f4 50%,#dcdacf 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left,  #dcdacf 0%,#f7f6f4 50%,#dcdacf 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(left,  #dcdacf 0%,#f7f6f4 50%,#dcdacf 100%); /* IE10+ */
background: linear-gradient(to right,  #dcdacf 0%,#f7f6f4 50%,#dcdacf 100%); /* W3C */
overflow: auto;
}
.breadcrumb { padding: 0; margin: 0; text-transform: uppercase; font-size: 13px; text-transform: uppercase; }
.breadcrumb li { display: inline-block; }
html.lt-ie8 .breadcrumb li { float: left; }
.breadcrumb li a { color: #666; text-decoration: none; }
.breadcrumb li.currentCrumb a { color: #02A78C; }
.breadcrumb .delimiter { margin: 0 5px; }

html.lt-ie9 .brown-gradient { background: transparent; filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dcdacf', endColorstr='#dcdacf',GradientType=1 ); /* IE6-8 */ }

img { max-width: 100%; }

body { font-family:'DIN Next W01', arial, helvetica, sans-serif; }

#weather{height: 20px; background-color: #00a18e; top: 0; text-align: right; color: #fff;}/*for the new masthead weather feature*/

#main-header { background: #E2DBCE; border-bottom: 10px solid #E2DBCE; border-bottom-color: rgba(226, 219, 206, 0.75); height: 90px; overflow: visible;   -moz-background-clip: padding; -webkit-background-clip: padding; background-clip: padding-box; margin-bottom: -10px; position: relative; z-index: 1000; }

#main-header { position: fixed; width: 100%; top: 0; }/*top was originally 0*/
body>article { padding-top: 90px; background: #fff; }
html.lt-ie9 body>article { min-width: 1024px; }
    
    #main-header .navicon { font-size: 30px; line-height: 60px; padding: 0 24px 10px; color: #191919; display: none;  }
    #main-header .navicon.active { color: #FFF; background: #000; }

    #main-header nav { position: relative; width: 50%; height: 90px; float: left; padding-right: 89px; -moz-box-sizing: border-box; box-sizing: border-box; z-index: 20; }
        #main-header nav ul { margin: 0; padding: 0; position: relative; }
        #main-header nav a { text-decoration: none; color: #fff; }
        /* level 0 */
        #main-header nav .main-nav-level-0>li { float: left; margin: 0 0 0 9%; }
        #main-header nav .main-nav-level-0>li>a { position: relative; z-index: 1; padding: 14px 10px 0; display: block; text-decoration: none; color: #000; font-size: 18px; border-top: 4px transparent solid; }
        #main-header nav .main-nav-level-0>li:hover>a { border-top: 4px #00A18E solid; }
        #main-header nav .main-nav-level-0>li:hover>a:after { width: 0; border-color: #E2DBCE transparent transparent transparent; content: ' '; height: 0; overflow: hidden; display: block; margin: 17px auto 0; border-style: solid; border-width: 20px 11px 0 11px; }
        /* level 1 */
        #main-header nav .main-nav-level-1 { display: none; background: #000; background: rgba(0,0,0,0.9); position: absolute; top: 70px; left: 0; right: 0; padding: 20px 20px 10px; }
        #main-header nav .main-nav-level-0>li:hover>.main-nav-level-1 { display: block; }
        #main-header nav .main-nav-level-1>li { font-size: 14px; text-transform: uppercase; margin: 0 0 15px; width: 50%; float: left; }
        /* level 2 */
        #main-header nav .main-nav-level-2 li { margin: 15px 0 0 15px; text-transform: none; }

        #main-header .mobile-menu-toggle.close { display: none; }

    #logo { z-index: 100; display:block; text-decoration: none; position: absolute; width: 150px; height: 82px; top: 0; left: 50%;  margin-left: -89px; background: #00A18E; padding: 14px; text-align: center;}
        #logo img { max-width: 100%; height: 100%}

    #main-header .spritesheet { height: 37px; width: 37px; display: block; position: absolute; z-index: 21; overflow: hidden; }
    #main-header .spritesheet.gallery  { right: 35.5%; top: 10px; background-position: -20px 0; }//*originally right:34.5, background-position originally 0 0*/
    html.backgroundsize #main-header .spritesheet.gallery { background-position: -20px 0; }
    #main-header .spritesheet.map  { right: 31%; top: 10px; background-position: 0 -77px; }/*originally right:28.5*/
    html.backgroundsize #main-header .spritesheet.map { background-position: -20px -76px; }
  #main-header .spritesheet.contact  { height: 35px; width: 37px; right: 26.5%; top: 10px; /*background-position: 0 -77px;*/ }/*originally -7*/


    #booking-widget { position: absolute; right: 0; color: #fff; }
        #booking-widget .rate { cursor: pointer; height: 50px; background: #000; padding: 10px 15px; width: 220px; letter-spacing: 1px; line-height: 1.2; position: relative; z-index: 10; }
        #booking-widget .title { font-size: 19px; }
        #booking-widget .label { font-size: 14px; }
        #booking-widget .label strong { font-weight: 100; font-size: 22px; color: #01A68B; }
        #booking-widget .toggle { border-style: solid; border-width: 6px 6px 0px 6px; border-color: white transparent transparent transparent; width: 0; height: 0; float: right; margin-top: -10px; }
        #booking-widget .toggle.open { border-width: 0 6px 6px 6px; border-color: transparent transparent white; }
        /* form */
        #booking-widget form { position: absolute; left: 0; right: 0; top:-420px; background: #222; background: rgba(0,0,0,0.75); }
        	#booking-widget .form-fields { padding: 10px 15px 8px; width: 220px; margin: 0 auto; }
            #booking-widget input[type="text"], #booking-widget select { border: 0; background: #000; background: rgba(255,255,255,0.1); color: #fff; font-size: 10px; padding: 5px; display: block; }
            #booking-widget option { background: #000; }
            #booking-widget select { width: 50px; }
            #booking-widget .date-field { width: 50%; float: left; margin-bottom: 5px; position: relative; }
            #booking-widget .select-field { width: 33.3%; float: left; margin-bottom: 15px; }
            #booking-widget label { font-size: 11px; }
            #booking-widget .date-field input[type="text"] { width: 80px; display: block; width: 90px; padding: 5px 20px 5px 5px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
            #booking-widget .day { font-size: 11px; color: #7F7F7F; }
            #booking-widget .best-rates { color: #fff; font-size: 10px; float:left; }
            #booking-widget .book-now { float: right; }
            #booking-widget .ui-datepicker-trigger { position: absolute; top: 26px; right: 24px; cursor: pointer; }
    #booking-widget.open form { top: 70px; }


#masthead-title { position: absolute; z-index: 10; color: #fff; font-size: 26px; text-transform: uppercase; padding: 15px; top: 130px; }

.no-masthead { margin-top: 35px; }

#masthead { z-index: 1; }

/* general pager styles */
#masthead-pager { text-align: center; margin-top: -50px; height: 50px; z-index: 200; }
#masthead-pager .cycle-pager { margin: 0 14px; }
#homepager .pager, #masthead-pager .cycle-pager>span { display: inline-block;  width: 14px; height: 14px; background: #fff; background: rgba(255,255,255,0.75); margin-left: 14px; cursor: pointer; vertical-align: top; margin-top: 3px; }
#masthead-pager .cycle-pager>span:first-child { margin-left: 0; }
#homepager .pager.active, #masthead-pager .cycle-pager>span.cycle-pager-active { background: #fff; border: 1px solid #02A78C; width: 12px; height: 12px; }
#homepager .pager {display: block;margin: 12px;}

#masthead-prev, #masthead-next { display: inline-block; width: 0; height: 0; content: ' '; border-style: solid; cursor: pointer; }
#masthead-prev { border-color: transparent rgba(255,255,255,0.5) transparent transparent; border-width: 10px 13px 10px 0;  }
#masthead-prev:hover, html.norgba #masthead-prev, html.lt-ie9 #masthead-prev { border-color: transparent white transparent transparent; }
#masthead-next { border-color: transparent transparent transparent rgba(255,255,255,0.5); border-width: 10px 0 10px 13px;  }
#masthead-next:hover, html.norgba #masthead-next, html.lt-ie9 #masthead-next { border-color: transparent transparent transparent white; }

#homepager .arrow { display: block; width: 0; height: 0; content: ' '; border-style: solid; cursor: pointer; margin: 0 auto;  }
#homepager .arrow.up { border-color: transparent transparent rgba(255,255,255,0.5) transparent; border-width: 0 10px 13px 10px;  }
#homepager .arrow.up:hover, html.norgba #homepager .arrow.up, html.lt-ie9 #homepager .arrow.up { border-color: transparent transparent white transparent; }
#homepager .arrow.down { border-color: rgba(255,255,255,0.5) transparent transparent transparent; border-width: 13px 10px 0 10px;  }
#homepager .arrow.down:hover, html.norgba #homepager .arrow.down, html.lt-ie9 #homepager .arrow.down { border-color: white transparent transparent transparent; }

/*section.main-content{margin-top: 30px;}*/

#main-footer { position: relative; padding: 20px 0; z-index: 999; }

#main-footer nav { display: flex; }
#main-footer nav .quarter { display: inline-block; width: 25%; height: 190px; border-left: 2px solid #E1DACD; padding: 0px 3%; vertical-align: top; -moz-box-sizing: border-box; box-sizing: border-box; }
html.lt-ie8 #main-footer nav .quarter { float: left; width: 18%; }
html.flexbox #main-footer nav .quarter { height: auto; }
#main-footer nav .quarter:first-child { border-left: none; }
#main-footer nav ul { margin: 0; padding: 0; }
#main-footer .sub-nav ul {  float: left; }
#main-footer nav li a, #main-footer nav h2 { color: #656565; font-size: 14px; }

#main-footer .footer-contact { text-align: center; font-size: 13px; color: #656565; border-bottom: 2px solid #E1DACD; border-top: 2px solid #E1DACD; padding: 25px 0; margin-top: 40px; }
.social.spritesheet {  background: url(../img/new_spritesheet.png) no-repeat; width: 37px; height: 37px; display: block; float: left; margin-right: 5px; }
.social.spritesheet.facebook { background-position: -116px 0; }
html.backgroundsize .social.spritesheet.facebook { background-position: -77px 0; }
.spritesheet.twitter { background-position: -116px -76px; }
html.backgroundsize .social.spritesheet.twitter { background-position: -77px -38px; }
.social.spritesheet.pinterest { background-position: -228px 0; }
html.backgroundsize .social.spritesheet.pinterest { background-position: -133px 0; }
.social.spritesheet.instagram { background-position: -228px -76px; }
html.backgroundsize .social.spritesheet.instagram { background-position: -133px -38px; }
#main-footer .sub-nav { margin: 20px 0; display: block; }
#main-footer .sub-nav li { float: left; }
#main-footer .sub-nav li a { font-size: 12px; }
#main-footer .sub-nav li:before { content: "|"; margin: 0 15px; }/*was 0 20px*/
#main-footer .sub-nav li:first-child:before { content: ""; margin: 0; }
#main-footer .legal { font-size: 12px; color: #656565; }
#main-footer .hhonor-logo { width: 210px; margin-top: 20px; }
#main-footer .tel, #main-footer .address { color: inherit; text-decoration: inherit; }
.adchoices-link{background: url('../img/adchoiceslogo.png') right center no-repeat;padding-right: 15px;}

/* home page */

.homepage-item { position: relative; }
.homepage-item:after { position: absolute; bottom: 0; left: 0; right: 0; border-bottom: 10px solid rgba(255, 255, 255, 0.25); display: block; content: ' '; }
.homepage-item .background-image { width:100%; background-position: center; padding-bottom: 60.4%; -webkit-background-size: cover; -moz-background-size: cover; background-size: cover; background-repeat: no-repeat; -ms-behavior: url(/assets/js/backgroundsize.min.htc); }
.homepage-item .item-content { position: absolute; top: 0; left: 0; right: 0; bottom: 0; padding-top: 3%; }

.homepage-item.intro:after { content: none; }
.homepage-item.intro .intro-heading { position: absolute; top: 5%; left: 0; right: 0; text-align: center; }
.homepage-item.intro .intro-heading h1 { letter-spacing: 2px; font-size: 34px; color: #FFF; /*width: 520px;*/ width:602px; margin: 0 auto; text-shadow: 1px 1px 15px rgba(0,0,0,0.5); border-bottom: 2px solid; overflow: hidden; }
.homepage-item.intro .intro-heading h1 .subheading { position: relative; font-size: 0.55em; }
.homepage-item.intro .intro-heading h1 .subheading:before, .homepage-item.intro .intro-heading h1 .subheading:after { content: ' '; position: absolute; width: 50%; border-bottom: 2px solid; top: 8px; }
.homepage-item.intro .intro-heading h1 .subheading:before { left: -56%; }
.homepage-item.intro .intro-heading h1 .subheading:after { right: -56%; }

#page-intro { padding: 15px 0; background: #F0EDE6; border-top: 10px solid #FFF; border-top-color: rgba(255, 255, 255, 0.25); margin-top: -10px; position: relative; -moz-background-clip: padding; -webkit-background-clip: padding; background-clip: padding-box; z-index: 2; }

.homepage-item .footer { /*position: absolute; bottom: 0; left: 0; right: 0;*/ background: #FFF; background: rgba(255,255,255,0.95); text-align: center; padding: 20px 0; }
.homepage-item .footer .icon-item { white-space: nowrap; }
.homepage-item .footer .icon { color:#02A78C; font-size: 36px; -webkit-font-smoothing: antialiased; vertical-align: middle; }
.homepage-item .footer p { margin: 0; font-size: 11px; }
.homepage-item .dark-circle { color: #FFF; text-align: center; width: 280px; height: 240px; padding: 40px 20px; display: table-cell; vertical-align: middle; }
.homepage-item.odd .circle-container { direction: ltr; }
.homepage-item.even .circle-container { direction: rtl; }
.homepage-item.even .circle-container>* { direction: ltr; }
.homepage-item .dark-circle h2, .homepage-item .dark-circle p { color:#FFF; margin: auto; width: 88%; line-height: 1.2; }

.homepage-item .dark-circle p { font-size: 15px; margin: 10px auto; }

#header-offers { /*position: absolute; bottom: 20%; left: 0; right: 0;*/ }
.side-drawer { float: left; color: #FFF; width: auto; height: 229px; padding: 7px; position: relative; background: rgba(255,255,255,0.75); }
html.lt-ie9 .side-drawer { background: transparent; -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#BFFFFFFF,endColorstr=#BFFFFFFF)"; /* IE8 */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#BFFFFFFF,endColorstr=#BFFFFFFF);   /* IE6 & 7 */ zoom: 1; }
.side-drawer .title { width: 229px; height: 45px; letter-spacing: 2px; text-decoration: none; color:#fff; text-align: center; line-height: 48px; background: #02A78C; -moz-transform: rotate(-90deg); -moz-transform-origin: left bottom 0; -webkit-transform: rotate(-90deg); -webkit-transform-origin: left bottom 0; transform: rotate(-90deg); transform-origin: left bottom 0; font-size: 20px; float: left; position: absolute; bottom: 7px; left: 52px; }
html.lt-ie9 .side-drawer .title { zoom: 1\9; writing-mode: tb-rl\9; filter: flipv fliph; width: 45px; height: 229px; left: 7px; top: 7px; bottom: 7px; font-size: 14px; }
.side-drawer .side-drawer-content { height: 100%; margin-left: 45px; padding-left: 3px; width: 457px; transition: 1s all linear; }
    .side-drawer.closed .side-drawer-content { width: 0; padding-left: 0; }
.side-drawer .item { width: 50%; background: url(../img/Play/Dining/breakfast-900x450.jpg) no-repeat center; -moz-background-size: cover; -webkit-background-size: cover; background-size: cover; float: left; text-decoration: none; color:#FFF; overflow: hidden; }
.side-drawer .third-item, .side-drawer .second-item { height: 50%; }
.side-drawer .first-item { height: 100%; }

.side-drawer .item .circle {  position: relative; border-radius: 50%; background: rgba(0,0,0,0.6); text-align: center; margin: auto; transition: background 0.1s linear; }
.side-drawer .item:hover .circle { background: #02A78C; }
html.lt-ie9 .side-drawer .item .circle { background: transparent; -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000,endColorstr=#99000000)"; /* IE8 */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000,endColorstr=#99000000);   /* IE6 & 7 */ zoom: 1; }
.side-drawer .item .circle .content { display: table-cell; vertical-align: middle; width: 100%; height: 100%; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
.side-drawer .item.first-item .circle { margin-top: 32px; height: 165px; width: 165px; }
.side-drawer .item.first-item .circle .content { width: 165px; height: 165px; font-size: 25px; padding: 25px; }
.side-drawer .item.second-item .circle, .side-drawer .item.third-item .circle { margin-top: 12px; height: 93px; width: 93px; }
.side-drawer .item.second-item .circle .content, .side-drawer .item.third-item .circle .content { width: 93px; height: 93px; font-size: 14px; padding: 14px; }
.side-drawer .close { position: absolute; right: -42px; top: 7px; width: 40px; height: 40px; background: rgba(0,0,0,0.75); color: #fff; text-align: center; text-decoration: none; font-size: 24px; line-height: 40px; visibility: visible; opacity: 1;  -webkit-transition: 1s all linear; transition: 1s all linear; }
.side-drawer.closed .close { visibility: hidden; opacity: 0; }

/* SWITCHING HEADER OFFERS */

#header-offers { position: relative; margin-top: 15px;background-color:#f5f5f5;}
#header-offers .side-drawer  { float: none; padding: 0; }
#header-offers .side-drawer-toggle { display: none; }
#header-offers .side-drawer .side-drawer-content { margin: 0; padding: 0; }
#header-offers .side-drawer .side-drawer-content { width: auto; }


.homepage-item.map { height: 400px; }
#homepage-map { position: absolute; top: 0; bottom: 0; left: 0; right: 0; }
#homepage-map img { width: auto; max-width: none; }

#homepager { position: fixed; right: 0; top: 50%; z-index: 1150; width: 38px; }

.back-to-top { background: #fff; background: rgba(255,255,255,0.75); text-decoration: none; color: #000; position: absolute; bottom: 10px; left: 50%; padding: 5px 20px; margin-left: -58px; }

/* template-1  */
.template-1-page-item { position: relative; overflow: hidden; }
    .template-1-page-item .central-content { min-height: 400px; }
    .template-1-page-item .item-image { position: absolute; top: 0; bottom: 0;  -webkit-background-size: cover; -moz-background-size: cover; background-size: cover; background-position: center; -ms-behavior: url(/assets/js/backgroundsize.min.htc); }
    .template-1-page-item.odd .item-image { left: 0; right: 50%; }
    .template-1-page-item.even .item-image { left: 50%; right: 0; }
    .template-1-page-item .item-content { width: 42%; padding: 4%; }
    .template-1-page-item .item-content h2 { margin-top: 0; }
    .template-1-page-item.odd .item-content { float: right; }
    .template-1-page-item.even .item-content { float: left; }
/*
    .template-1-page-item .central-content:before { display: block; position: absolute; top: 0; bottom: 0;  width: 100%; background: rgba(255,255,255,0.15); }
    .template-1-page-item.odd .central-content:before { left: -100%;  right: auto; }
    .template-1-page-item.even .central-content:before { left: auto;  right: -100%; }
*/
    .template-1-page-item .button { margin: 14px 0 0; float: left; clear: both; }

    .template-1-page-item.odd .dark-circle.rates { position: absolute; bottom: 8%; left: 35%;  }
    .template-1-page-item.even .dark-circle.rates { position: absolute; bottom: 8%; right: 35%;  }

    .dark-circle.rates { text-align: center; color: #fff; font-size: 16px; line-height: 1.1; }
    .dark-circle.rates strong { display: block; color: #02A78C; font-weight: normal; font-size: 1.75em; margin-top: 16%; }
    .dark-circle.rates .price { font-size: 3.65em; margin-top: 10px; }
    .dark-circle.rates .price .currency { font-size: 0.53em; }

/* template-2-3 */


.template-2-3-page-item h2 { font-size: 16px; margin: 20px 0; }
.template-2-3-page-item .button { float: left; clear: both; margin: 5px 0; }

.template-3-main .template-2-3-page-item { padding: 0 2%; margin: 4% 0; width: 46%; display: inline-block; vertical-align: top; /*border-top: 1px dotted #E2DBCE;*/ }

.template-2-main .template-2-3-page-item.third { margin-right: 0; }
.template-2-main .template-2-3-page-item { width: 32.68%; display: inline-block; vertical-align: top; margin: 35px 0.98% 35px 0; }

.suite-amenities { background: #F8F6F3; }
.suite-amenities h1 { margin: 30px 0; }
.suite-amenities ul { list-style: none; padding: 0; -moz-column-count: 3; -moz-column-gap: 30px;  -webkit-column-count: 3; -webkit-column-gap: 30px; column-count: 3; column-gap: 30px; margin: 35px 0; } 
.suite-amenities li { position: relative; padding-left: 15px; }
.suite-amenities li:before { content: '\2022'; color: #02A78C; font-size: 1.5em; line-height: 1em; position: absolute; left: 0; top: 0; }

/* Gallery */

.gallery-categories { background: #02A78C; }
.gallery-categories a { color: #fff; text-decoration: none; font-size: 17px; padding: 17px; display: inline-block; text-transform: uppercase; }
.gallery-categories a.active, .gallery-categories a:hover { background: #158D77; }

.gallery-grid { text-align: center; line-height: 0; margin-top: 50px; margin-bottom: 50px; }
.gallery-item { width: 250px; max-height: 220px; display: inline-block; margin: 3px; vertical-align: top; position: relative; }
.gallery-item .caption { position: absolute; transition: opacity 0.2s; opacity: 0; left: 0; right: 0; bottom: 0; background:rgba(0,0,0,0.75); text-align: center; font-size: 13px; color: #fff; text-decoration: none; padding: 10px; line-height: 1.4; }
.gallery-item:hover .caption { opacity: 1; }

/* Contact Us */
.contact-us { margin: 50px auto; }
.contact-us-form { float: left; max-width: 540px; width: 100%; }
.contact-us-form fieldset { margin: 10px 0; }
.contact-us-form label { color: #666666; font-size: 14px; width: 130px; display: inline-block; text-align: left; }
.contact-us-form label .error { font-size: 12px; }
.contact-us-form input, .contact-us-form textarea, .contact-us-form select { background: #F2F2F2; border: 1px solid #B3B3B3; font-size: 14px; padding: 9px; -moz-box-sizing: border-box; box-sizing: border-box; max-width: 400px; width: 100%; }
.contact-us-form input[type="checkbox"] { width: auto; }
.contact-us-form input[type="submit"] { background: #00A08D; border: none; }
.contact-us-form .terms p { max-width: 406px; float: right; width: 100%; }
.contact-us-side { float: right; width: 25%; }
.contact-us-side h2 { color: #02A78C; font-weight: normal; font-size: 22px; }
.contact-us-side .social.spritesheet { float: none; display: inline-block; }


/* Events Calendar */
/* styles the calendar categories menu */
/*
#calendar-categories {float: right; margin-bottom: 30px; margin-top: 30px;}
#calendar-categories li {list-style-type: none!important; display: inline-block; margin: 0 7px;}
*/
/* calbody - styles the div holding the actual calendar days plus h2 tag, prev - next buttons */
/*
#calbody {clear: both; margin-bottom: 30px;}
*/
/* styles of table holding the days */
/*
#Sat {width: 100%;}
#Sat td {width: 14.285%;}
*/

#calbody {margin-bottom: 130px; margin-top: 10px;}

#calbody table {width: 100%; margin-top: 20px;}
#calbody td {width: 14.285%; height: 150px; border: 1px solid #ccc; vertical-align: top;}
.mxcdow {height: auto!important; border: none!important;}
.datestamp {margin-bottom: 5px;}
.event {margin-left: 10px;}

#mxcprevlnk {margin-bottom: 20px;}
.today {background-color: #eaeaea;}

/* styles taken from BOCARESORT calendar */

.eventsCalendarTemplate .section1 {
  position: relative;
  width: 900px;
  max-width: 100%;
  margin: 0 auto; }

#event-detail {
  margin: 0 2em; }

#calbody td .event .title a:hover {
  color: #121212 !important; }


.event div[class^="s"] a, .event div[class*=" s"] a {color: #06A191;}

.event div[class^="r"] a, .event div[class*=" r"] a {color: #7C7C7C;}

  
  /*
    #mxccategories {font-size:1em; line-height: 1.3em; text-align: right; margin-top: 1em;}
    #mxccategories ul {margin: 0; padding: 0;}
      #mxccategories ul li {display:inline-block; margin:0 .5em; list-style: none;}
*/

@media only screen and (max-width: 800px) {
  #calbody table, #calbody thead, #calbody tbody, #calbody th, #calbody td, #calbody tr {
    display: block; }
/* 
  #mxccategories {text-align: center;}
    #mxccategories ul li {display:block;}
      #mxccategories ul li.delimiter {display:none;}
      #mxccategories ul li.catTitle {font-size:1.2em;}
*/ 
  .calendarDayNav {margin-bottom: 50px;}/*holds the Today, next and prev buttons*/
  
  #calbody {
    padding: 1em 1.8em;
    width: auto !important; }

  #calbody table tr:first-child {
    position: absolute;
    top: -9999px;
    left: -9999px; }

  #calbody td {
    border: none !important;
    border-bottom: 1px solid #eee;
    position: relative;
    width: auto !important;
    height: auto;
    /*min-height: 150px !important;*/
    margin: .4em 0!important;
    padding: 0 !important;}

  #calbody td:before {
    position: absolute;
    top: 6px !important;
    left: 6px !important;
    width: 45%!important;
    padding-right: 10px !important;
    white-space: nowrap; }

  #calbody td.noEvents {
    display: none; }

  #calbody td .datestamp {
    background-color: #3f3f3f;
    color: white !important;
    padding: 0.5em !important;
    font-size: 1.2em; }

  #calbody td a {
    font-size: 1.2em; }

  #calbody td:nth-of-type(1) .datestamp:before {
    content: "Sunday "; }

  #calbody td:nth-of-type(2) .datestamp:before {
    content: "Monday "; }

  #calbody td:nth-of-type(3) .datestamp:before {
    content: "Tuesday "; }

  #calbody td:nth-of-type(4) .datestamp:before {
    content: "Wednesday "; }

  #calbody td:nth-of-type(5) .datestamp:before {
    content: "Thursday "; }

  #calbody td:nth-of-type(6) .datestamp:before {
    content: "Friday "; }

  #calbody td:nth-of-type(7) .datestamp:before {
    content: "Saturday "; }
  }


/* Map Directions */

#map-directions-map { height: 600px; }
#map-directions-map img { max-width: none; }
.map-pin-icon { font-size: 30px; text-shadow: 1px 1px 4px rgba(0,0,0,0.7); }
.map-pin-icon.hotel { font-size: 48px; color: #158D77; }

.map-cat-toggle { float: left; color: #808080; font-size: 12px; text-transform: uppercase; line-height: 30px; margin-right: 20px; min-width: 220px; margin-bottom: 10px; }
.map-cat-toggle::selection {
  background: transparent; /* WebKit/Blink Browsers */
}
.map-cat-toggle::-moz-selection {
  background: transparent; /* Gecko Browsers */
}
.map-cat-toggle:last-child  { margin-right: 0; }
.toggle-switch { cursor: pointer; width: 64px; height: 22px; line-height: 22px; margin-left: 8px; display: inline-block; background: #FFF; box-shadow: inset 1px 1px 5px rgba(0,0,0,0.5); float: right; margin-top: 4px; }
.toggle-switch .state { width: 32px; text-align: center; display: inline-block; }
.toggle-switch.off .state { background-color: #000; color: #FFF; }
.toggle-switch.off .state:after { content: 'off'; }
.toggle-switch.on .state { background-color: #02A78C; color: #FFF; margin-left: 50%; }
.toggle-switch.on .state:after { content: 'on'; }
.map-cat-toggle .map-pin-icon { float: left; margin-right: 5px; text-shadow: none; }
.map-cat-toggle .map-pin-icon:before { margin: 0; }

#map-cat-toggles { margin: 15px 0; }

.right-50 { float: right; max-width: 50%; }
.left-50 { float: left; max-width: 50%; }

/* BLOG */

.blog-post { background: #F8F6F3; width: 31.3%; margin: 0 1% 35px; display: inline-block; vertical-align: top; text-align: left; }
.blog-post .title a { color: #02A78C; text-decoration: none; }
.blog-post .entry { padding: 20px; }
.blog-post .post-info { font-weight: 600; }
.blog-post .readmore { background: #02A78C; color: #fff; text-decoration: none; text-transform: uppercase; text-align: center; display: block; padding: 10px; }

#blog-content { margin: 35px 0 0; }
#blog-content .pageList { padding: 0; margin: 0 0 35px; text-align: center; }
#blog-content .pageList li { display: inline-block; }
#blog-content .pageList li.control a { display: inline-block; border-style: solid; vertical-align: middle; }
#blog-content .pageList li.control.prev a {  margin-right: 7px; border-width: 7px 7px 7px 0; border-color: transparent #02A78C transparent transparent; }
#blog-content .pageList li.control.next a {  margin-left: 7px; border-width: 7px 0 7px 7px; border-color: transparent transparent transparent #02A78C; }
#blog-content .pageList li.pageNo { background-color: #F8F6F3; }
#blog-content .pageList li.pageNo a { color: #666; text-decoration: none; display: block; padding: 5px; }
#blog-content .pageList li.pageNo.active a { text-decoration: underline; }
#blog-content .pageList .first, #blog-content .pageList .last { display: none; }

#blog-post-content { margin: 50px 0; }
#blog-post-content .main-content { width: 65%; float: left; }
#blog-post-content .blog-post-hero-image { width: 100%; }
#blog-post-content .post-copy { background: #F8F6F3; }
#blog-post-content .post-copy { padding: 20px; }
#blog-post-content .post-copy h2 { color: #02A78C; font-size: 30px; }

.prev-next-container { margin: 50px 0; }
.prev-blog-post, .next-blog-post { font-size: 18px; color: #fff; text-decoration: none; line-height: 46px; }
.prev-blog-post span, .next-blog-post span { background: #02A78C; padding: 0px 16px; display: inline-block; vertical-align: top; }
.prev-blog-post .arrow, .next-blog-post .arrow { font-size: 1.5em; }
.prev-blog-post { float: left; }
.next-blog-post { float: right; }

.blog-sidebar { float: right; width: 30%; }
.blog-sidebar .sidebar-block { background: #F8F6F3; padding: 20px; margin-bottom: 20px; }
.blog-sidebar h2 { color: #02A78C; font-size: 20px; border-bottom: 1px dotted #666; }

.tl-tag { font-size: 12px; background: #DFDDDA; color: #666; padding: 5px 15px; line-height: 12px; white-space: nowrap; display: inline-block; margin-bottom: 4px; }
.tl-tag a { color:inherit; text-decoration: none; }
.prev-blog-post .arrow { margin-right: 2px; }
.next-blog-post .arrow { margin-left: 2px; }

.all-blog-tags h2 { color: #02A78C; font-size: 18px; margin: 26px 0 16px; }

/* IE FIXES */
html.lt-ie9 .homepage-item:after { display: none; }
html.lt-ie9 .close.side-draw-toggle {background: transparent;-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#CC000000,endColorstr=#CC000000)";filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#CC000000,endColorstr=#CC000000);zoom: 1;}

/* MEDIA QUERIES */
/*
@media only screen and (max-width: 1200px) {

  #main-header .spritesheet.contact {right: 62%;}
}
*/

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

    #main-header { position: relative; }
    body>article { padding-top: 0px; }

	.central-content { max-width: 100%; width: auto; margin: 0 20px; }
	.central-content.no-margin { margin: 0 auto; }
    .central-content.no-masthead { margin-top: 80px; }
    #page-intro .central-content.no-masthead { margin-top: 50px; }

    .template-1-page-item .central-content:before { top: auto; bottom: auto; background: transparent; }
}

@media only screen and (max-width: 960px) {
    #main-header .spritesheet.map { right: 64.5%; }
    #main-header .spritesheet.gallery { right: 71.5%; }
    #main-header .spritesheet.contact {right: 78.5%;}

    /* nav */
    #main-header .navicon { display: inline-block; }
    #main-header .navicon + ul { display: none; }
    #main-header .navicon.active + ul { display: block; }
    #main-header nav {  }
    #main-header nav ul { background: #000; }
    #main-header nav .main-nav-level-0>li { float: none; margin: 0; }
    #main-header nav .main-nav-level-0>li:hover>.main-nav-level-1 { display: none; }
    #main-header nav .main-nav-level-0>li.active>.main-nav-level-1 { display: block; }
    #main-header nav>ul a { display: block; border-bottom: 1px solid #575757; padding: 10px; margin: 0 5px; }
    #main-header nav .main-nav-level-0>li>a { border-top: none; color: #FFF; text-transform: uppercase; font-size: 14px; padding: 15px; border-bottom: 1px solid #575757; }
    #main-header nav .main-nav-level-0>li:hover>a:after, #main-header nav .main-nav-level-0>li.active>a:after, #main-header nav .main-nav-level-0>li>a:after { content: '+'; font-size: 26px; display: inline-block; margin: 0; border: none; width: auto; height: auto; float: right; line-height: 0.6; }
    #main-header nav .main-nav-level-0>li.active>a:after { content:'-'; }
    #main-header nav .main-nav-level-0>li:hover>a, #main-header nav .main-nav-level-0>li.active>a { border-top: none; }
    #main-header nav .main-nav-level-1 { position: relative; top: auto; right: auto; left: auto; padding: 0; background: #262626; }
    #main-header nav .main-nav-level-1>li>a { padding: 10px 15px; }
    #main-header nav .main-nav-level-1>li { float: none; width: auto; margin: 0; }
    #main-header nav .main-nav-level-2 li { margin: 0; }
    #main-header ul.main-nav-level-2>li>a { padding-left: 35px; }
    #main-header .mobile-menu-toggle.close { display: block; font-size: 14px; text-align: center; margin: 10px 0; border-bottom: none; }
    #main-header .mobile-menu-toggle.close:after, #main-header .mobile-menu-toggle.close:hover:after, #main-header .mobile-menu-toggle.active:after { content: ''; display: none!important; }

    /*footer*/
    #main-footer nav .quarter { border: none; }
    #main-footer .spritesheet:nth-child(2n) { clear: left; margin-bottom: 10px; margin-right: 10px; }
    #main-footer .sub-nav ul { max-width: 50%; }
	#main-footer .sub-nav ul li { float: none; display: block; }
	#main-footer .sub-nav ul li:before { content: ""; display: none; }

}

@media only screen and (max-width: 900px) {
    .homepage-item .footer { position: relative; }

    .template-1-page-item .central-content { min-height: auto; }
    .template-1-page-item.even .item-image, .template-1-page-item.odd .item-image { position: relative; padding-bottom: 50%; width: 100%; right: 0; left: 0; }
    .template-1-page-item.even .item-content, .template-1-page-item.odd .item-content { float: none; width: 100%; padding: 14px 0; }
    .template-1-page-item.even .dark-circle.rates, .template-1-page-item.odd .dark-circle.rates { bottom: 8%; left: 8%; right: auto; }

    .template-2-main .template-2-3-page-item { width: 49.5%; margin: 35px 0 35px 1%; }
    .template-2-main .template-2-3-page-item.odd { margin-left: 0; }

    .contact-us-form, .contact-us-side { text-align: center; display: inline-block; max-width: 100%; width: 100%; float: none; }
    .contact-us-side .block { width: 47%; margin-right: 2%; display: inline-block; }
    .contact-us-form .terms p { max-width: none; float: none; }

    .right-50, .left-50 { float: none; max-width: none; }
    .blog-post { width: 48%; }

    #blog-post-content .main-content, .blog-sidebar { width: 100%; float: none; }

}

@media only screen and (max-width: 800px) {
    #masthead-title { display: none; }
    .suite-amenities ul { padding: 0; -moz-column-count: 2; -webkit-column-count: 2; column-count: 2; } 

}

@media only screen and (max-width: 700px) {
    #logo { width: 105px; height: 50px; margin-left:-62px; padding: 10px; }

    #booking-widget { top: 70px; }
    #booking-widget.open form { top: 50px; }
    #booking-widget .rate { text-align: center; height: 30px; width: auto; }
    #booking-widget .rate>* { display: inline-block; float: none; }
    #booking-widget .title { font-size: 16px; }
	#main-header .spritesheet.gallery { right: 70px; }
	#main-header .spritesheet.map { right: 20px; }
  #main-header .spritesheet.contact {right: 18.5%;}

    .homepage-item.intro .intro-heading { top: 70px; }
    .homepage-item.intro .intro-heading h1 { font-size: 20px; width: 320px; }

    .homepage-item .item-content { top: 0; }
    .homepage-item .central-content.circle-container { position: absolute; margin: 0; top: 0; bottom: 0; left: 0; right: 0; }
    .homepage-item .dark-circle { position: absolute; top: 0; bottom: 10px; border-radius: 0; width: auto; height: auto; border: 0; width: 33%; background: rgba(0,0,0,0.6) }
    .homepage-item.odd .dark-circle { left: 0; }
    .homepage-item.even .dark-circle { right: 0; }
    .homepage-item .dark-circle h2 { font-size: 18px; }
    .homepage-item .dark-circle p { font-size: 13px; }
    .homepage-item .button { font-size: 11px; margin-top: 10px; padding: 5px 15px; }

    .blog-post { width: 100%; margin-left: 0; margin-right: 0; }
    
}

@media only screen and (max-width: 660px) {
  #main-header .spritesheet.contact {left: 90px;}
}

@media only screen and (max-width: 600px) {
	#main-header nav { width: 100%; padding: 0; }
  #main-footer nav { display: block; }

	#main-footer nav .quarter { width: 50%; }

    .homepage-item .dark-circle p { display: none; }

    .contact-us-form label { display: block; }

    .template-3-main .template-2-3-page-item { padding: 0; width: 100%; margin: 25px 0; }

    .template-2-main .template-2-3-page-item { width: 100%; margin: 35px 0; }

}

@media only screen and (max-width: 500px) {
	#main-footer .sub-nav ul { max-width: 100%; margin-bottom: 20px; text-align: center; width: 100%; }
	#main-footer .hhonor-logo { display: block; margin: 0 auto; float: none; }

    .template-1-page-item .dark-circle.rates { width: 130px; height: 130px; font-size: 10px; }

    .suite-amenities ul { -moz-column-count: 1; -webkit-column-count: 1; column-count: 1; }

    .contact-us-side .block { width: 100%; margin: none; display: block; }

    .prev-blog-post, .next-blog-post { font-size: 12px; }
}

@media only screen and (max-width: 400px) {
	#logo { margin-left: 0; left: auto; right: 0; }
	#booking-widget { left: 0px; }
	#booking-widget form { background: #1A1A1A; }
	#booking-widget .title,	#booking-widget .label { font-size: 10px; }
	#main-header { margin-bottom: 50px; }
	#main-header .spritesheet.gallery { right: 170px; }
	#main-header .spritesheet.map { right: 130px; }

    #homepager { display: none; }

    .homepage-item.intro .intro-heading { top: 10px; }
    .homepage-item.intro .footer { font-style: 13px; }
    .homepage-item.intro .icon { font-size: 24px; }
    .homepage-item .icon-item { display: block; }
    .homepage-item .dark-circle h2 { font-size: 14px; }

    #header-offers .side-drawer  { height: auto; }
    #header-offers .side-drawer .item { width: 100%; height: 100%; }
    #header-offers .side-drawer .item .circle { margin: 15px auto; height: 93px; width: 93px; }
    #header-offers .side-drawer .item .circle .content { width: 93px; height: 93px; font-size: 14px; padding: 14px; }

    .spritesheet.contact { left: auto; right: 212px; }
    #main-header .navicon { font-size: 24px; }


}



/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Image replacement
 */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

.hidden {
    display: none !important;
    visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
    *zoom: 1;
}


/* ==========================================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}

/* Photoswipe */

.pswp__caption__center { max-width: 720px!important; }
.pswp__caption__center .copy { float: left; line-height: 25px;  }
.pswp__caption__center .book-now { float: right; margin-left: 10px;  }

/*recaptcha*/
.recaptcha-div{margin-left: 22%;}
@media only screen and (max-width: 600px) {
  .recaptcha-div{margin-left: 5%;}
}
@media only screen and (max-width: 500px) {
  .recaptcha-div{margin-left: -3%;}
}
@media only screen and (max-width: 400px) {
  .recaptcha-div{margin-left: -6%;}
}

/* EB styles - Feb 2017 */
#main-footer .hhonor-logo{width: 190px;}

/* Abtest template */
@media only screen and (min-width:901px) {
.cp-abtest{position:relative;}
  .cp-abtest #booking-widget{width: 100%;right: auto;bottom: 50%;left:50%;display: -webkit-box;display: -moz-box;display: -ms-flexbox; display: -webkit-flex;display: flex;-webkit-box-pack: center;-moz-box-pack: center;-webkit-justify-content: center;-ms-flex-pack: center;justify-content: center;max-width: 703px;transform:translate(-50%,50%);-webkit-transform:translate(-50%,50%);-moz-transform:translate(-50%,50%);-ms-transform:translate(-50%,50%);-o-transform:translate(-50%,50%);max-height: 100px;}
      .cp-abtest #booking-widget form{position: relative;top: 0;}
      .cp-abtest #booking-widget .toggle{display:none;}
      .cp-abtest #booking-widget .rate{width: 215px;height: 100px;box-sizing: border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;-ms-box-sizing: border-box;-o-box-sizing: border-box;display: -webkit-box;display: -moz-box;display: -ms-flexbox; display: -webkit-flex;display: flex;-webkit-box-pack: center;-moz-box-pack: center;-webkit-justify-content: center;-ms-flex-pack: center;justify-content: center;    -webkit-box-direction: normal;-moz-box-direction: normal;-webkit-box-orient: vertical;-moz-box-orient: vertical;-webkit-flex-direction: column;-ms-flex-direction: column;flex-direction: column;}
      .cp-abtest #booking-widget .form-fields{display: -webkit-box;display: -moz-box;display: -ms-flexbox;display: -webkit-flex;display: flex;width: 460px;height: 100px;box-sizing: border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;-ms-box-sizing: border-box;-o-box-sizing: border-box;}
        .cp-abtest #booking-widget .form-fields > div:first-child{width:85%;}
}

@media only screen and (min-width:961px) {
  .page-55 #main-header .spritesheet.gallery{right: 25.5%;}
  .page-55 #main-header .spritesheet.map{right: 21%;}
  .page-55 #main-header .spritesheet.contact{right: 16.5%;}
}

@media only screen and (max-width:1220px) and (min-width:901px){
  .cp-abtest #booking-widget{bottom:30%;}
}

@media only screen and (max-width:900px) {
  .cp-abtest #booking-widget{position: relative;top:auto;margin-top: 30px;}
    .cp-abtest #booking-widget form{position:relative;top: 0;max-width: 250px;margin: 0px auto;}
    .cp-abtest #booking-widget .rate{margin: 10px auto 0;width:220px;height:50px;text-align:left;}
    .cp-abtest #booking-widget .toggle{display:none;}
}

#teconsent {text-decoration: underline;}