/* 
Theme Name: RealIntegration 
Author: RealTech Services, Inc. 
Author URI: https://www.rtservices.net 
Description: RNS API Integrated Theme
Version: 5.0.0
*/
 *, *:before, *:after {
     -moz-box-sizing: border-box;
     -webkit-box-sizing: border-box;
     box-sizing: border-box;
}
 body {
     background: #000;
     margin:0;
}
 .site-wrap {
     background: #FFF;
}
 img {
     max-width: 100%;
     height: auto;
}
 iframe {
     max-width: 100%;
}
 html {
     font-size: 100%;
    font-family: 'Source Sans Pro', sans-serif;
}
/*for RNS template*/
.page-id-88 .ft-top {display:none; }

.banner-image { width: 100%;min-height:300px;position: relative; }


/* 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: 'rt-font';
    src: url('../font/rt-font.svg?4761947#rt-font') format('svg');
  }
}
*/
 
 [class^="icon-"]:before, [class*=" icon-"]:before {
  font-family: "rt-font", sans-serif;
  font-style: normal;
  font-weight: normal;
 
  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%; */
 
  /* Font smoothing. That was taken from TWBS */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
 
  /* Uncomment for 3D effect */
  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}
 

 
.icon-plus-circled:before { content: '\21'; } /* '!' */
.icon-star:before { content: '\22'; } /* '&quot;' */
.icon-share:before { content: '\23'; } /* '#' */
.icon-reply-all:before { content: '\24'; } /* '$' */
.icon-comment:before { content: '\25'; } /* '%' */
.icon-export-1:before { content: '\26'; } /* '&amp;' */
.icon-basket:before { content: '\27'; } /* ''' */
.icon-heart-circled:before { content: '\28'; } /* '(' */
.icon-cancel:before { content: '\29'; } /* ')' */
.icon-th:before { content: '\2a'; } /* '*' */
.icon-cancel-circled-outline:before { content: '\2b'; } /* '+' */
.icon-eye:before { content: '\2c'; } /* ',' */
.icon-toggle-off:before { content: '\2d'; } /* '-' */
.icon-toggle-on:before { content: '\2e'; } /* '.' */
.icon-balance-scale:before { content: '\31'; } /* '1' */
.icon-location:before { content: '\32'; } /* '2' */
.icon-direction:before { content: '\33'; } /* '3' */
.icon-lightbulb:before { content: '\34'; } /* '4' */
.icon-paper-plane-empty:before { content: '\35'; } /* '5' */
.icon-paper-plane:before { content: '\36'; } /* '6' */
.icon-lightbulb-alt:before { content: '\37'; } /* '7' */
.icon-ok-circled:before { content: '\38'; } /* '8' */
.icon-ok:before { content: '\39'; } /* '9' */
.icon-users:before { content: '\3a'; } /* ':' */
.icon-sliders:before { content: '\3c'; } /* '&lt;' */
.icon-bed:before { content: '\3d'; } /* '=' */
.icon-bath:before { content: '\3e'; } /* '&gt;' */
.icon-guidedog:before { content: '\3f'; } /* '?' */
.icon-paw:before { content: '\40'; } /* '@' */
.icon-swimming:before { content: '\41'; } /* 'A' */
.icon-shower:before { content: '\42'; } /* 'B' */
.icon-wheelchair:before { content: '\43'; } /* 'C' */
.icon-wifi:before { content: '\44'; } /* 'D' */
.icon-signal:before { content: '\45'; } /* 'E' */
.icon-desktop:before { content: '\46'; } /* 'F' */
.icon-toilet:before { content: '\48'; } /* 'H' */
.icon-cafe:before { content: '\49'; } /* 'I' */
.icon-lodging:before { content: '\4a'; } /* 'J' */
.icon-hot-tub:before { content: '\4b'; } /* 'K' */
.icon-tennis:before { content: '\4c'; } /* 'L' */
.icon-bbq:before { content: '\4d'; } /* 'M' */
.icon-linens:before { content: '\4e'; } /* 'N' */
.icon-heart-empty:before { content: '\4f'; } /* 'O' */
.icon-picture:before { content: '\50'; } /* 'P' */
.icon-minus-circled-1:before { content: '\51'; } /* 'Q' */
.icon-attention-circled:before { content: '\52'; } /* 'R' */
.icon-calendar:before { content: '\53'; } /* 'S' */
.icon-help-circled:before { content: '\54'; } /* 'T' */
.icon-cancel-circled-1:before { content: '\55'; } /* 'U' */
.icon-calendar-2:before { content: '\56'; } /* 'V' */
.icon-info-circled-1:before { content: ''; } /* '' */
.icon-globe:before { content: ''; } /* '' */
.icon-group:before { content: ''; } /* '' */
.icon-print:before { content: ''; } /* '' */
.icon-users-1:before { content: ''; } /* '' */
.icon-heart:before { content: ''; } /* '' */
.icon-export-alt:before { content: ''; } /* '' */
.icon-th-list:before { content: ''; } /* '' */
.icon-th-1:before { content: ''; } /* '' */
.icon-reply-all-1:before { content: ''; } /* '' */
.icon-list:before { content: ''; } /* '' */
.icon-home:before { content: ''; } /* '' */
.icon-search:before { content: ''; } /* '' */
.icon-info-circled:before { content: ''; } /* '' */
.icon-search-1:before { content: ''; } /* '' */
.icon-search-2:before { content: ''; } /* '' */
.icon-commerical-building:before { content: ''; } /* '' */
.icon-ok-circle:before { content: ''; } /* '' */
.icon-warehouse:before { content: ''; } /* '' */
/*end fontello*/
/*heading styles*/
 h1 {
     font-size:36px;
     line-height:1.25;
}
 h2 {
    font-size:30pt;
     line-height:1.25;
}
 h3 {
    font-size: 24px;
     line-height:1.25;
}
 p {
    font-size:18px;
    line-height:1.8;
	font-family: 'Source Sans Pro', sans-serif;
	letter-spacing:1px;
	
}
.home .entry p {max-width: 1275px;margin:0 auto;padding-bottom: 70px;}

h1, h2 {font-family: 'Kaushan Script', cursive; color: #0a70be;}
h3, h4 {font-family: 'Niramit', sans-serif;color: #0a70be;}
.nav {font-family: 'Niramit', sans-serif; }
.home h1 {text-align:center; }

/*top alert message*/
 @media (max-width:40em) {
    .hide24 {
        font-size:12pt !important;
    }
}
 .hide24 {
    color:#888;
     background-color:rgba(255,255,255,.9);
     height:200px;
     width:80%;
     position:absolute;
     top:100px;
     left:0;
     right:0;
     z-index:500;
     box-shadow:0px 0px 15px rgba(0,0,0,.3);
     font-size:18pt;
     padding:25px;
     margin:0 auto;
}
 .hide24 h3 {
    margin: 0 auto;
     color: #000;
}
 .alert-box-close {
     position: absolute;
     top: 10px;
     right: 20px;
     cursor: pointer;
}
 .hidden {
    display:none;
}
/* end alert css */

 .footerleft {
     float:left;
}
 .footerright {
     float:right;
}
 .footerleft, .footerright {
     padding:.325em 0;
}
 .logo {
     float: left;
     width: auto;
     padding: 10px 0;
}
 .logo-smaller {
     transition:.2s all;
     padding: 5px 0;
     display:none;
}
 .sidebar {
     float: right;
     margin-left: 1%;
     max-width: 29%;
     width: auto;
     padding: 0.625em;
     border-left: 1px solid #f0f0f3;
}
	
/* complex page */
.complexes {display: flex;
    flex-wrap: wrap;
	flex:100%;
	justify-content:space-around; 
}
.complexes .property {min-width:350px; text-align:center;    margin-bottom:20px; padding: 10px;
    background: linear-gradient(#fff, #dbdbdb);
    box-shadow: 0px 4px 10px rgba(0,0,0,.3);
}

/*if parallax*/
 .parallax-home {
     min-height:500px;
     z-index:1;
}
/* some blog stuff */
 .widget {
     position: relative;
     margin-bottom:20px;
     background: #f4f4f4;
     border-width: 0px;
     padding: 5px 30px 30px;
	 box-shadow: 0px -4px 6px -4px black;
}
 .content-left {
     float:left;
     max-width:67%;
     padding-right:20px;
}
 .featuredimage {
     width: 350px;
     height: 200px;
     overflow: hidden;
}
 .post-prev-img {
     float: left;
     padding-right: 10px;

}
 .article-container {
     background-color: #fff;
     padding: 20px;
     line-height: 1.5;
	 overflow: hidden;
	 outline: 2px solid #dbdbdb;
	 outline-offset: -10px;
	 border:2px solid #dbdbdb;
	 width:95%;
	 margin:20px auto;
	 transition: all .3s;
}
span.avail {display:block; font-style:italic; color:red;    font-size: 20px;    margin-bottom: 10px;}
/*end blog*/
/*new mobile menu*/
 ul.clearfix.hide-nav {
     display:inline-block;
}
 .menu-primary-container {
     display:inline-block;
}
 .content-wrap {
     -webkit-transition: -webkit-transform 0.3s;
     transition: transform 0.3s;
}
 .menu-primary-container li:last-child .sub-menu {
     right:0;
}
 .c-menu {
     position: fixed;
     z-index: 200;
     background-color: #dbdbdb;
     transition: transform 0.3s;
	 
}
 .c-menu__items {
     list-style: none;
     margin: 0;
     padding: 0;
}
/** * Close button. */
 .c-menu__close {
     color: #fff;
     background-color: #383838;
     font-size: 12px;
     border: none;
     box-shadow: none;
     border-radius: none;
     -webkit-appearance: none;
     -moz-appearance: none;
     appearance: none;
     cursor: pointer;
}
/** * Close button resets. */
 .c-menu__close:focus {
     outline: none;
}
/** * Body states. * * When a menu is active, we want to hide the overflows on the body to prevent * awkward document scrolling. */
 body.has-active-menu {
     overflow: hidden;
}
/** * Mask component */
 .content-mask {
     position: fixed;
     z-index: 100;
     top: 0;
     left: 0;
     overflow: hidden;
     width: 0;
     height: 0;
     background-color: #000;
     opacity: 0;
     transition: opacity 0.3s, width 0s 0.3s, height 0s 0.3s;
}
 .content-mask.is-active {
     width: 100%;
     height: 100%;
     opacity: 0.7;
     transition: opacity 0.3s;
}
/*actual menu stuff*/
 .c-menu--push-left {
     width: 100%;
     height: 100%;
     overflow-y: scroll;
}
 .content-wrap.is-active {
     width: 100%;
     height: 100%;
     opacity: .7;
     -webkit-transition: opacity .3s;
     transition: opacity .3s;
}
 .content-wrap.has-push-left {
     -webkit-transform: translateX(300px);
     -ms-transform: translateX(300px);
     transform: translateX(300px);
}
 .c-menu--push-left .c-menu__close {
     display: block;
     padding: 12px 24px;
     width: 100%;
}
 .c-menu--push-left.is-active {
     transform: translateX(0);
     -webkit-transform: translateX(0);
     -ms-transform: translateX(0);
}
 .c-menu--push-left {
     top: 0;
     left: 0;
     transform: translateX(-100%);
     -webkit-transform: translateX(-100%);
     -ms-transform: translateX(-100%);
}
 @media (min-width: 320px) {
     .c-menu--push-left {
         transform: translateX(-300px);
         width:300px;
    }
}
 .navclass li {
     list-style-type: none;
     line-height: 40px;
}
 .navclass li ul {
     display: none;
     position: absolute;
     top: 100%;
}
 .navclass li ul {
     position: static;
     padding: 20px;
    /* 20 */
     padding-top: 0;
}
/*end menu*/
/*video full screen styling*/
 .video-section .buttonBar{
     display:none;
}
 .player {
     font-size: 1px;
}
 .pattern-overlay {
     padding: 110px 0 32px;
     height: 700px;
     overflow: hidden;
}
 @media (max-width: 1350px) and (min-width: 1150px) {
     .pattern-overlay {
         height: 600px;
         overflow: hidden;
    }
}
 @media (max-width: 1150px) and (min-width: 768px) {
     .pattern-overlay {
         height: 500px;
         overflow: hidden;
    }
     .headerimage {
         overflow: hidden;
    }
     .mbYTP_wrapper {
         width: 900px!important;
    }
}
 @media (max-width: 767px) and (min-width: 0px) {
     .pattern-overlay {
         height: 400px;
         overflow: hidden;
    }
     .headerimage {
         overflow: hidden;
    }
     .mbYTP_wrapper {
         width: 900px!important;
    }
}
/*end video*/
 .clear {
     clear: both;
}
 .no-mar {
     margin-right:0px;
}
 .headerright {
     display: block;
     float:right;
     text-decoration: none;
     text-align: right;
     padding: 0 .625em;
     line-height: 2em;
     color: #fff;
     letter-spacing: .01em;
     font-size: 19px;
     margin-top: 0px;
	 font-family: 'Niramit', sans-serif;
}
.headerright a {color:#fff; }

 .contained {
     max-width: 1500px;
     margin: 0 auto;
     width: 100%;
     padding: .3125em .6125em;
}

/* above 1601px fix*/
@media (min-width: 1601px) { 
 .contained {  max-width: 1800px;}
}

.gform_wrapper .gform_footer input.button, .gform_wrapper .gform_footer input[type=submit], .gform_wrapper .gform_page_footer input.button, .gform_wrapper .gform_page_footer input[type=submit] {width:95% !important; padding:15px;}

.sidebar li p { font-size: 14px; }
.sidebar .gform_wrapper ul li.gfield {margin-top:0; }
.sidebar .ginput_container_textarea {max-height:250px; }
.sidebar #field_3_11 {margin-top:10px; }
.sidebar .gform_wrapper li.hidden_label input {margin-top:0; }
/*shrink header*/
/*CHANGE HEIGHT of header-main-wrapper class below. Assign min-height based on header height so the content pushes down;
 you may need to remove this on home page or set as 0px for homepage if you use a photo or slideshow and set it as relative -- this is mostly for the secondary pages if they don't have anything there that's relatively positioned */
 .header-main-wrapper {
     position: relative;
     min-height: 100px;
     max-height: 900px;
    overflow: hidden;
	
}

 header {
     width: 100%;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#131313+0,4c4c4c+99&1+0,0+100 */
background: linear-gradient(to bottom, rgba(19,19,19,.4) 0%, rgba(76,76,76,0) 100%);

     overflow: visible;
     position: fixed;
     top: 0;
     z-index: 30;
     left: 0;
     -webkit-transition: height 0.3s ease;
     -moz-transition: height 0.3s ease;
     -ms-transition: height 0.3s ease;
     -o-transition: height 0.3s ease;
     transition: height 0.3s ease;
     /* height: 100px; */
    /*important so the height transition is smooth to smaller header */
}
 header.smaller {
     /* height: 75px; */
     padding-top: 0px;
	 background:none;
     background-color: rgba(255, 255, 255, 1);
     -webkit-transition: all 0.3s ease;
     -moz-transition: all 0.3s ease;
     -ms-transition: all 0.3s ease;
     -o-transition: all 0.3s ease;
     transition: all 0.3s ease;
     -moz-box-shadow: 0 2px 3px 0px rgba(0, 0, 0, 0.16);
     -webkit-box-shadow: 0 2px 3px 0px rgba(0, 0, 0, 0.16);
     box-shadow: 0 2px 3px 0px rgba(0, 0, 0, 0.16);
}

.logo img {
    -webkit-transition: height .6s ease;
    -moz-transition: height .6s ease;
    -ms-transition: height .6s ease;
    -o-transition: height .6s ease;
    transition: height .6s ease;
}
header .logo img {
    height: 81px;
}
header.smaller .logo img {
    height: 50px;
	filter: contrast(0);
}

header.smaller .logo {	padding: 12px 0 5px;}
 header.smaller .nav, header.smaller .nav ul.menu {
     margin-top: 0px;
     -webkit-transition: all 0.3s;
     -moz-transition: all 0.3s;
     -ms-transition: all 0.3s;
     -o-transition: all 0.3s;
     transition: all 0.3s;
}
	header.smaller .nav ul.menu li a { color:#464646;transition: all 0.3s;}
	header.smaller .navclass .menu-item-has-children > a:after {    border-top-color:#464646;transition: all 0.3s;}

	header.smaller .headerright a { color:#464646;margin-top:5px;transition: all 0.3s;}
/*end header*/
 .header-wrap {
     width: 100%;
}
/* featured rentals */
.featuredwrapper { text-align: center; margin: 0px auto; background:#fafafa;padding: 20px 0 60px; width:100%; justify-content:space-evenly}
.wrapper-item { margin:15px; max-width:400px; display:inline-block; vertical-align:top; background:#fff;box-shadow: 0px 0px 10px 0px rgba(18, 18, 18, 0.24);}
.featuredslider-item {  position:relative; overflow:hidden; height:267px; }
.featuredslider-item:hover { cursor:pointer; }
.featuredwrapper .caption { position:relative; color:#777; margin:10px;min-height:125px; }
.featuredwrapper .caption span:first-child { font-size: 1.6em;color:#0a70be;  margin:20px auto 15px;
    display: block;}
.featuredwrapper .caption span:nth-child(2n) { font-size: 1.2em;display: block;font-weight:bold; }
.featuredwrapper .caption span:last-child { font-size: 1.2em;display: block;font-weight:lighter;margin:10px auto; }
.featuredslider-item .img-hover-zoom { transition: transform .6s, filter .6s ease-in-out; height:267px; }
.wrapper-item:hover img { filter: blur(2px) brightness(50%); transform: scale(1.1); }
/* end featured rentals */

/* shortcuts */
.home-cuts-wrap-wrap {margin-top:60px; }
.shortcuts-wrapper.flex-container {justify-content:center; }
.home-cuts-wrap-wrap .flex-item { overflow: hidden;filter:brightness(95%);position:relative;max-width:400px;margin:15px;transition:all .3s ease-in-out; }
.home-cuts-wrap-wrap h3 {position:absolute; bottom:0; width:100%; text-align:Center;font-weight:400; background: linear-gradient(360deg, #000, transparent);padding:20px; color:#fff; text-transform:uppercase;font-family: 'Source Sans Pro', sans-serif;margin-block-end: 0;}

.home-cuts-wrap-wrap .flex-item:hover {filter:brightness(115%);transition:all .3s ease-in-out; }
.home-cuts-wrap-wrap .flex-item img {transition:all .3s ease-in-out; }
.home-cuts-wrap-wrap .flex-item:hover img {transform:scale(1.1);transition:all .3s ease-in-out; }
/* list with us */
.list-with-us h1 {color:#fff; font-weight:300; font-family:"Niramit", sans-serif; }
.list-with-us p {max-width:930px; margin:0 auto; font-size: 24px;font-family:"Niramit", sans-serif; font-weight:lighter;}

.hidden-gallery {display:none!important; }
.donate-gallery figure{outline: 6px solid #fff; outline-offset:-40px;transition:all .3s ease-in-out; }
.donate-gallery figure:hover {filter:brightness(110%); outline: 6px solid #0a70be; transition:all .3s ease-in-out; }
.donate-gallery figure:after { padding:20px; font-family: 'Kaushan Script', cursive;font-style:italic;position:absolute;content:'The Best of Ponce Inlet Realty'; background:#fff; bottom:10px;color:#383838;font-size:24px;transition:all .3s ease-in-out;}
.donate-gallery figure:hover:after {background: #0a70be;color:#fff;transition:all .3s ease-in-out;}
.content {
     width: 100%;
     margin: 0 auto;
     position: relative;
	 background: linear-gradient(to bottom, #fff 0, #fff 55%, #f2eded 95%, #f2eded 100%);
}
.home .content {background:#fff;}
 .content-full {
     color: #333;
}
 .footer-wrap {
     width: 100%;
     background: #dbdbdb;
     color: #383838;
	 font-size:16px;
	 min-height:55px;
	 line-height: 2;
}
 .footer-wrap a {
 color: #383838; font-size:16px;
}

 .sidebar {
     padding: .625em;
}
 .sidebar h2 {
     font-size: 1.1em;
     margin: .83em 0 .3125em 0;
}
 .sidebar ul {
     list-style-type: none;
     margin: 0.3125em 0 0.625em 0.625em;
     padding-left: 0;
}
 .sidebar li li {
     list-style-type: none;
     margin-left: .95em;
     padding-left: 0;
}
 .ft-top {
     background: #fff;
     width: 100%;
     padding: 1px 0;
     margin: 0;
	 color:#383838;
	 font-family: 'Niramit', sans-serif;
	 font-size:18px;
}
.ft-top a img {transition:all .3s ease-in-out; }
.ft-top a img:hover {filter:brightness(75%);transition:all .3s ease-in-out; }
.ft-top ul li a:hover {color:#dbdbdb;}
.ft-top ul {list-style-type:none; padding-inline-start:0; }
.ft-top h3 {color:#383838; font-weight: 300;}
/* front page */
.maptime { position:relative;margin-bottom:-10px;}
.maptime h3 {position:absolute; top: 10px; left:10%; padding:25px 30px; background: rgba(70,70,70,.5);color:#fff;font-weight:300;}
 .threecol h4 {
     margin: 0 0 5px 0;
     color: #333;
}
 .threecol h4 a {
     color: #6d4b70;
     text-decoration: none;
}
 .threecol h4 a:hover {
     text-decoration: underline;
}
/*flexbox designed for 4 footer columns, but can also be used for infinite # of columns/rows*/
 .flex-wrapper {
     margin-bottom: 1em;
     line-height: 1.5;
}
 .flex-fill {
     flex: 1;
     width: 100%;
}
/*whenever you need something to take over the whole width of the row/column, aka "fill" the current column it's in, so that you can nest multiple columns underneath it in the same column, don't close it out until the end of the whole column if there are vertical columns underneath*/
/*flex columns are the two vertical columns with nav links*/
 .flex-column {
     flex-direction: column;
}
/*flex-direction:column is for items that should be displayed vertically, not in a horizontal row, like two vertical columns of links side by side*/
/*flex:auto makes it so the space between the columns is removed, assuming there is space*/
 .flex-item {
     display: flex;
     flex-direction: row;
     -webkit-justify-content: space-around;
     justify-content: space-around;
     flex: 1;
    /*this means each column will take up equal space*/
    /*flex: auto;
     */
    /*uncomment if you want the columns to be auto-sized based on natural width*/
    /*flex-wrap:wrap;
     */
    /*uncomment if you want the auto-sized columns to also wrap based on width, which can make them more responsive*/
     margin-right: 20px;
}
 .flex-item:last-child {
     margin-right: 0px;
}
 .flex-container {
     display: flex;
     flex-direction: row;
     -webkit-align-items: flex-start;
     align-items: flex-start;
    /*pushes to the top, like vertical-align:top -- can center if preferable*/
     -webkit-justify-content: space-between;
     justify-content: space-between;
    /*alt option is "space-around"*/
     flex-wrap: wrap;
    /*makes items auto-wrap which sort of works as auto-responsiveness, but can be turned off it it makes things funky*/
     flex: 1;
    /*shorthand for flex-grow which means each row/column is of the same width -- can also be auto*/
}
/*if using images next to address/phone number, see below. could probably use flex, but inline-block is easier :D */
 .icon {
     display: inline-block;
     vertical-align: top;
     margin-right: 10px;
     max-width: 10%;
}
/*max-width keeps the address from wrapping under the icon*/
 .info-block {
     display: inline-block;
     vertical-align: top;
     max-width: 83%;
}
/*the end of icon images*/
 hr {
     height: 1px;
     background: #f0f0f3;
     border: none;
}
/* links */
 a {
     color: #333;
     text-decoration: none;
     transition: .3s all;
}
 a:hover {
     text-decoration: none;
     color: #000;
}
 .content a {
     text-decoration: none;
     transition: .3s all;
}
 .content a:hover {
     color: #333;
}
 .sidebar a {
     color: #222;
}
 .sidebar a:hover {
     color: #333;
}
 .content a.readmore {
     font-style:italic;
	 transition:all .3s;
	 font-weight:initial;
}
.article-container:hover{ transition:all .3s; box-shadow: 0 0 16px -7px #666;}
 .article-container:hover a.readmore{
     color: #000;
	 transition:all .3s;
}
 input[type=submit] {
     background: #f74022;
     color: #FFF;
     padding: .1875em .4375em;
     margin: 0.625em 0;
     border: 0;
     transition: .3s all;
}
 input[type=submit]:hover {
     background: #0a70be;
     color: #FFF;
}

.button2 {height:60px; background:#464646; border: 2px solid #fff; text-align:center; max-width:300px;width:100%; color:#fff; display: block; margin: 0 auto;transition: all .3s ease-in-out; }
.button2:hover { background:#dbdbdb; color:#464646;transition: all .3s ease-in-out;border: 2px solid #464646;}

.button3 { height:60px;background:#0a70be; text-align:center; max-width:230px;width:100%; color:#fff; display: block;transition: all .3s ease-in-out; }
.button3:hover { background:#dbdbdb; transition: all .3s ease-in-out;color:#383838;}

 div.entry {
     position: relative;
}

 .alignleft {
     float: left;
}
 .alignright {
     float: right;
}
 .aligncenter {
     display: block;
     margin-left: auto;
     margin-right: auto;
}
 img.alignleft {
     margin: 0 0.625em 0.625em 0;
}
 img.alignright {
     margin: 0 0 0.625em 0.625em;
}
 img.aligncenter {
     margin: 0 auto 0.625em;
}
 .wp-caption {
     margin-bottom: 24px;
     max-width:100%;
     color: #767676;
}
 .wp-caption img[class*="wp-image-"] {
     display: block;
     margin: 0;
}
 .wp-caption-text {
     font-size: 0.75em;
     font-style: italic;
     line-height: 1.5em;
     margin: 0.55em 0;
     padding-right: 0.625em;
}
 .wp-smiley {
     border: 0;
     margin-bottom: 0;
     margin-top: 0;
     padding: 0;
}
 img.wp-post-image {
     border: 1px solid #dbdbdb;
     padding: 2px;
	 outline: 1px solid #dbdbdb;
	 outline-offset: -10px;
}
.reviewdisplay { border-bottom: 1px solid #DDD; margin-top: 5px; }
.reviewdisplay:last-child { border-bottom: 0px solid #DDD; }

/*menu for above 1023*/
 @media (min-width: 1024px) {
     .navclass ul {
         -webkit-padding-start: 0px;
         -webkit-margin-before: 0;
         -webkit-margin-after: 0;
         margin:0;
    }
     .navclass li {
         position: relative;
    }
     .navclass li a {
         display: block;
    }
     .navclass ul.sub-menu {
         padding:10px 0px!important;
         background:linear-gradient(#fff, #dbdbdb);
         box-shadow:0px 4px 10px rgba(0,0,0,.3);
    }
    /*this adds the arrow that points down in the main navigation if there's a submenu -- you may need to add again under mobile sizing and change the color*/
     .navclass .menu-item-has-children > a:after {
         width: 0;
         height: 0;
         border: 0.313em solid transparent;
         border-bottom: none;
         border-top-color: #fff;
        /*change depending on arrow color needed*/
         content: '';
         vertical-align: middle;
         display: inline-block;
         position: relative;
         right: -0.313em;
    }
     .nav {
         clear: right;
         float:right;
    }
     .nav ul.menu > a {
         display: none;
    }
     .nav ul.menu {
         width: auto;
         margin: 12px auto 0;
         position: relative;
         z-index: 1;
         padding: 0;
         text-align: center;
    }
     .nav ul.menu li {
         list-style-type: none;
         position: relative;
         display: inline-block;
    }
     .nav ul.menu li a {
         display: block;
         text-decoration: none;
         text-align: center;
         padding: 0 .825em;
         line-height: 30px;
         color: #fff;
         letter-spacing: .01em;
         font-size: 16px;
    }
     .nav ul.menu li > a {
         position: relative;
    }
     .nav ul.menu li ul li > a {
         position: relative;
         margin-bottom:0px;
    }
     .nav ul.menu li ul li > a:hover:before {
         visibility: hidden;
    }
     .nav ul.menu li > a:hover:before {
         visibility: visible;
         -webkit-transform: scaleX(1);
         transform: scaleX(1);
    }
    /* second level */
     .nav ul.menu li ul {
		 display:block;
         visibility: hidden;
		 opacity:0;
         position: absolute;
         top: 300%;
         padding: 0;
         margin: 0;
		 transition: all .4s;
		 
    }
     .nav ul.menu li:hover > ul.sub-menu {
         visibility: visible;
		 opacity:1;
		 top:121%;
		 transition: all .5s;
    }
     .nav ul.menu li ul li {
         white-space: nowrap;
         display: block;
    }
     .nav ul.menu li ul li a {
         text-align: left;
         padding: 0 1.2em;
        /* background: rgba(0, 0, 0, .5);
         */
        /*background color for dropdown links*/
         width: 230px;
         text-transform:none;
         line-height: 30px;
         letter-spacing:.5px;
         font-size:15px;
         color: #343434;
    }
     .nav ul.menu li ul li a:hover {
         background:#464646;
		 color:#fff;
        /*background hover color*/
    }
    /*more levels*/
     .nav ul.menu li ul li {
         white-space: nowrap;
         display: block;
    }
    /*this is the arrow/triangle that points to the right for submenu items with another submenu - you may need to change the color, and also the margin to adjust where it lands. If you want it next to the menu item, change float:right to display:inline-block and remove the margin-top */
     .nav ul.menu li ul li.menu-item-has-children > a:after {
         border: solid #383838;
         border-width: 0 2px 2px 0;
         float:right;
         margin-top:10px;
        /*may need to change*/
         padding: 3px;
         transform: rotate(-45deg);
         -webkit-transform: rotate(-45deg);
		 transition: all .3s ease-in-out;
    }
	.nav ul.menu li ul li a:hover:after {border-color:#fff;right:-15px;transition: all .3s ease-in-out;}
	
     .nav ul.menu ul ul {
         margin-top: -40px;
         left: 100%;
         display: block;
    }

}
/* cell phones/small tablets (1023px) */
 @media (max-width: 1023px) {

    /*menu mobile*/
     ul.clearfix.hide-nav {
         display:none;
    }
     header.smaller .navclass .menu-item-has-children > a:after {
         border-top-color: #fff !important;
    }
     .navclass li {
         font-size:19px;
		 padding-left: 20px;
    }
     .navclass li a {
         color:#383838;
    }
     #nav-acc > ul > li.has-sub.active > a:after {
         content: '';
         vertical-align: middle;
         position: relative;
         right: -8px;
         bottom: 0em;
         border: solid #383838;
         border-width: 0 2px 2px 0;
         display: inline-block;
         padding: 3px;
         transform: rotate(225deg);
         -webkit-transform: rotate(225deg);
         transition:.2s all;
    }
     #nav-acc > ul > li > ul > li.has-sub.active > a:after {
         content: '';
         vertical-align: middle;
         position: relative;
         right: -8px;
         bottom: 0px;
         border: solid #383838;
         border-width: 0 2px 2px 0;
         display: inline-block;
         padding: 3px;
         transform: rotate(225deg);
         -webkit-transform: rotate(225deg);
         transition:.2s all;
    }
     .navclass .menu-item-has-children > a:after {
         content: '';
         vertical-align: middle;
         position: relative;
         right: -8px;
         bottom: 1px;
         border: solid #383838;
         border-width: 0 2px 2px 0;
         display: inline-block;
         padding: 3px;
         transform: rotate(45deg);
         -webkit-transform: rotate(45deg);
    }
    /*end menu*/
    /*add this section for nav sub-menu down arrow if your nav colors change so you can change the arrow color*/
     #nav .menu-item-has-children > a:after {
         width: 0;
         height: 0;
         border: 4px solid transparent;
         border-bottom: none;
         border-top-color: #fff;
         content: '';
         vertical-align: middle;
         display: inline-block;
         position: relative;
         right: -4px;
    }
    /*toggle applies to the hamburger menu button*/
     .toggle-spot {
         position: absolute;
         width:30px;
         height:30px;
         right:10px;
         top:30px;
		 transition: all .3s;
    }
	header.smaller .toggle-spot { top:0px; }
    /*where do you want hamburger to show up? */
     #toggle {
         display: block;
         width: 60px;
         height: 50px;
         margin: 0;
         position: absolute;
         top: 30px;
         right: 0px;
         cursor:pointer;
    }
     #toggle span:after, #toggle span:before {
         content: "";
         position: absolute;
         left: 0;
         top: -9px;
    }
     #toggle span:after {
         top: 9px;
    }
     #toggle span {
         position: relative;
         display: block;
    }
     #toggle span, #toggle span:after, #toggle span:before {
         width: 100%;
         height: 4px;
         background-color: #fff;
         transition: all 0.3s;
         backface-visibility: hidden;
         border-radius: 20px;
    }
	header.smaller #toggle span, header.smaller #toggle span:after, header.smaller #toggle span:before {background-color: #dbdbdb; }
	
    /*header sizes on mobile*/
     header.smaller .logo-smaller {
         display: inline-block;
         text-align: left;
         padding-left: 10px;
         width: auto;
    }
     header.smaller .headerright {
         display: none;
    }

    /*IMPORTANT: Change the header wrapper height on mobile below so that the content starts at the appropriate place & not under the header */
     .header-main-wrapper {
         min-height: 139px;
    }
     .nav ul.menu li a {
         color: #fff;
         text-decoration: none;
         text-transform: uppercase;
         text-align: left;
         font-size: 16px;
         margin-right: 8%;
    }
     .nav ul.menu li a:hover {
         color: #ccc;
         text-decoration: none;
    }
     .menu {
         -webkit-padding-start: 0;
         margin-left: 25px;
         margin-right: 25px;
    }
     .navclass {
         position: absolute;
         top: 19%;
         right: 0;
         -webkit-padding-start: 0px;
         z-index: 500;
         width: 100%;
    }
     .navclass li {
         list-style-type: none;
         line-height: 40px;
    }
     .navclass > ul {
         height: auto;
         display: none;
         position: absolute;
         left: 0;
         right: 0;
         top: 60px;
         -webkit-margin-before: 0px;
         -webkit-padding-start: 0px;
    }
     .navclass li ul {
         display: none;
         position: absolute;
         top: 100%;
    }
     .navclass li ul {
         position: static;
         padding: 1.25em;
         padding-top: 0;
    }
    .twocol { display: inline-block; width: 99%; margin: 10px auto; }
	.navclass li ul {padding-inline-start: 10px;}
}
/*flexbox break for smaller screens*/
 @media (min-width: 40em) and (max-width: 60em) {
     .flex-item {
         flex: 2 0 50%;
         margin-right:0px;
    }
     .flex-column {
         padding: 0 10px;
    }
	.logo {display:block;  width: 100%;  float: none; text-align: center; }
	
	.headerright {float:none;text-align: center;    width: 100%; }
	
	.headerright a { display: inline-block; }
	.rv:after {content: "|";padding:0 20px; }
}

 /* 1100 and under for logo / nav fix */
 @media (max-width: 1100px) {
		header .logo img {height:75px; }
 }
 
/* 1024px/64em and under for ipad and under */
 @media (max-width: 63.999em) {
		header .logo img {height:65px; }
 }

 
 /* over 1024px/64em for desktop */
  @media (min-width: 64em) {
  
  .twocol { display: inline-block; width: 49.6%; vertical-align: top; }
  
 }
 
 /* 40em/ 640px and under for ipad and under */
 @media (max-width: 640px) {
	 .donate-gallery figure {outline:none; }
	 .donate-gallery figure:hover {outline:none; }
	 .rv {display:none; }
	 
	 .flex-item .button3 {margin:0 auto; display:block; }
	 .maptime h3 {display:none; }
	 .list-with-us p {font-size:16px; }
    /*headings*/
     h1 {
         font-size:32px;
         line-height:1.25;
    }
     h2 {
        font-size:26pt;
         line-height:1.25;
    }
     h3 {
        font-size: 22px;
         line-height:1.25;
    }
     p {
        font-size:15px;
         line-height:1.6;
    }
     .header, .footer {
         padding: 0 0.31em;
    }
     .logo, .headerright {
         float: none;
         text-align: center;
         width: 100%;
    }
    .logo img { max-width: 70%; height: auto !important; }
    .headerright a { display: block; }
     .footerleft, .footerright {
         float:none;
         text-align:center;
    }
    /*flexbox stuff*/
     .content-left, .sidebar {
         float:none;
         max-width:100%;
         padding:0px;
         border:0px;
    }
     .flex-item {
         flex: 0 0 100%;
         flex-wrap: wrap;
         margin: 5px auto;
         text-align: center;
    }
     .flex-column {
         flex: 0 0 50% !important;
         align-items: center !important;
    }
    /*if you prefer the nav links to take up 100% width and not be in two columns for mobile, delete this and do flex-column {
         margin:0 auto !important;
    }
     */
    /*end flex*/
 }
 /* for print only */
@media print {

    .headerright img, .rv, .qswrap, #reviews, .detailsec h2 span, #carousel, .flex-direction-nav, #locationbox { display: none; }
    .header-wrap { border-top: 0; border-bottom: 1px solid #FF5A01; }
    header, header.smaller { box-shadow: none; position: relative; }
    #nav, .rtbreadcrumbs { display: none; }
    ul, li { list-style-type: none; margin: 0; padding: 0; line-height: 1.15; }
    .stripe { background: #FFFFFF!important; }
    .pricescol { border-bottom: 1px solid #EEEEEE; }
    .pdwrap { display: block; width: 55%; float: left; }
    .calsec { display: block; width: 45%; float: right; min-width: 45%; }
    .ratechart { background: #FFFFFF; }
    h1 { font-size: 1.4em; }
    h2 { font-size: 1em; }
    .receipt { width: 100%!important; }
    .rtitle { color:#000!important; line-height: normal!important; white-space: nowrap; background: #EEE; border-right:0!important; height: 14px!important; }
    .rcolumn { width: auto!important; border-bottom: 1px solid #AAA!important; display: block; margin: 0!important; }
    .rcolumn div { width: 40%; display: inline-block; line-height: 16px!important; height: 18px!important; }
    .pdwrap .introslide-overlay, .calendar-layout, .ft-top .flex-item, .banner-image { display: none; }
    .pdwrap .introslide img, .ft-top .flex-item:first-child { display: block; }
    #amenities .detailsec-content, .ratechart { line-height: 1.15; font-size: 12px; }
    .amen-left, .amen-right { text-align: left!important; padding: 0; }
    .amen-wrap { width: 49%; display: inline-block; }
    .header-main-wrapper { min-height: 0; }
    div.ssbuttons, .calsec h2, .legend-booked, .legend-selected, .calsec .button { display: none!important; }
    header.smaller .headerright { display: block; }
}







.btn-wrap {display: flex;}
.qswrap, #idxqs {  padding: 10px 50px;}
.doubleqs-wrap-inner {background: rgba(0, 0,0, .35); min-height:110px;position:relative;}
#rentalbtn {background: rgba(0, 0,0, .35);font-size: 25px;}
#idxbtn {background: rgba(0, 0,0, .7);margin-left: 3px;font-size: 25px;color:#c6c6c6;}
#idxqs {display:none; }
.idxqs-inner {    margin-top: 15px;}
.doubleqs-wrap	{position: absolute; bottom:0px; width:100%; margin:0 auto; }
.home .doubleqs-wrap	{bottom:4px;}
.qsinput img { margin-left: -35px; vertical-align: middle; }
.qsinput { width: 200px; display: inline-block; margin: 5px 5px;   }
.qsinput input { border: none; width: 100%; line-height: 2em; padding: 10px; min-height:55px;box-shadow: 0px 1px 4px 0px rgba(18, 18, 18, 0.38); }
.qsinput.sub input { margin: 0;min-height:55px; width: 160px;box-shadow: 0px 1px 4px 0px rgba(18, 18, 18, 0.38); text-transform:uppercase;letter-spacing:1px;}
.qswrap #ui-datepicker-div { z-index: 2 !important; }
.qscenter {text-align: left;    margin-top: 15px;}
.caly {position:absolute; top:20px;right:70px; display: inline-flex;}
.caly a { display: inline-flex;}
.caly p {line-height: normal;font-size:22px;padding-top:10px!important;}
.caly img {margin-right: 10px;}
.caly span { font-size:14px;text-transform: initial;}
.doubleqs-wrap p{ text-align:Center; max-width:315px; margin-block-start: 0em;    margin-block-end: 0em; min-height:75px; text-transform:uppercase;padding-top:15px;color:#fff;margin: unset;cursor:pointer; display:inline-block;width:100%;}

/* above 1601px fix*/
@media (min-width: 1601px) {
   .home .doubleqs-wrap	{bottom:0px;}
}


/* under ipad size 1024px */
@media (max-width: 63.9375em) {
	.caly {display:none; }
    .qsinput input { border: 1px solid #DDD; }
    .qswrap { position: relative; top: 2px; }
	.doubleqs-wrap p { min-height:30px;    padding-top: 5px;}
}

/* under sm ipad size 768px */
@media (max-width: 768px) {

	.qscenter, #IDX-quicksearch-12141 {text-align: center!important; }
    .caly {display:none;  }
	.doubleqs-wrap {    position: relative;}
#rentalbtn span, #idxbtn span{display:none;}
#rentalbtn , #idxbtn {width:50%;box-sizing:border-box;margin-left:0;max-width:unset;}
.doubleqs-wrap-inner {min-height:185px }

}
/* cell phones (640px) */
@media (max-width: 640px) {
	.doubleqs-wrap-inner {min-height:250px }
    .qsinput { display: block; margin: 20px auto;width:100%!important; }
	.qsinput.sub input {width:100%!important;  }
	#IDX-quicksearchForm-12141 .IDX-qsInput {width:100%!important; }
	#IDX-quicksearchForm-12141 > .IDX-qsFieldWrap {display:block!important;width:100%!important; }
	#IDX-qsCityListLabel-12141, #IDX-qsIdxIDWrap-12141.IDX-qsFieldWrap {    display: none!important;}
	#IDX-quicksearchForm-12141 {    display: block!important;}
    .qsinput img { margin-right: 4px;}

}


.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
    background: none !important;
}

@media (max-width: 1023px) {
    #toggle {
        display: none;
    }}