* {
  box-sizing: border-box;
}
body{background:url('/body-bg.png'); text-align:center;  margin:0 auto;}
a img, img {border:0;}

html, input, textarea{font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#000000; }
input, select { vertical-align:middle; font-weight:normal;}
input[type="radio"] {
  margin-top: -1px;
  vertical-align: middle;
}
input[type="checkbox"] {
  margin-top: -1px;
  vertical-align: middle;
}
form {
     display:inline;
     margin:0px;
     padding:0px;
}

div {
 margin:0;
 padding:0;
}

h1, h2, h3 {
 margin-top:0px;
 margin-bottom:5px;
}

.dateinput {
 width:90px;
 text-align:center;
 -webkit-border-radius: 5px 5px 5px 5px;
 -moz-border-radius: 5px 5px 5px 5px;
 border-radius: 5px 5px 5px 5px;
}

.dateinput_on {
 background-color: #deffde;
}

.datebutton	{ 
  background-color: orange;
  border:1px solid black;
  color:white;
  padding: 2px 5px 2px 5px;
  text-decoration:none;
  display: inline-block;
  font-size: 100%;
  font-weight:bold;
 -webkit-border-radius: 5px 5px 5px 5px;
 -moz-border-radius: 5px 5px 5px 5px;
 border-radius: 5px 5px 5px 5px;
 text-shadow:1px 1px 2px #000000;
 cursor:pointer;
}

.datebuttonclick {
 text-shadow:-1px -1px 2px #000000;
 background-color: #77ff77;
}

.wrapper {
 width:1000px;
 overflow:hidden;
 display: inline-block;
 background-color:white;
 -webkit-border-radius: 10px 10px 10px 10px;
 -moz-border-radius: 10px 10px 10px 10px;
 border-radius: 10px 10px 10px 10px;
}


.header {
 width:100%;
 -webkit-border-radius: 10px 10px 0px 0px;
 -moz-border-radius: 10px 10px 0px 0px;
 border-radius: 10px 10px 0px 0px;
 padding-top:10px;
 background-color:white;
 display: inline-block;
}

.header .logo {
 float:left;
 width:180px;
}
.header .logo img {
 width:100%;
}

.header .quote {
 width:60%;
 float:right; font-size:110%; font-weight:bold; text-align:left;
 padding-right:5px;
 background-color:white;
}

.sticky {
  position: fixed;
  top: 0;
  width: 1000px;
  z-index: 1000;
}

/* Add some top padding to the page content to prevent sudden quick movement (as the header gets a new position at the top of the page (position:fixed and top:0) */


.sticky + .content {
  padding-top: 37px;
}



.stickyHeader {
 margin:0;
 padding:0;
 background-color:white;
 vertical-align:middle;
}

.menu { z-index: 1000; float:left; background-color:#8ba5c6; color:white; text-shadow: 1px 1px #666666; width:100%; clear:both; text-align:left; font-size:110%; padding: 8px 0 5px 0; }
.menu a:link, .menu a:visited { color: white; text-decoration:none; padding-left:5px; padding-right:5px; margin:0; }
.menu a:hover { color:#CCD8E8;}

.menulinks {
 padding-left:5px;
 float:left;
}

.menusearch {
 float:right;
 padding-left:5px;
 padding-right:5px;
}

.menudrop {
 position: relative;
 display: inline-block;
}

.menudrop-content {
 display:none;
 position: absolute;
 background-color:#8ba5c6;
 border:1px solid white;
 border-top:0;
 min-width: 170px;
 overflow: auto;
 border-radius: 0 0 5px 5px;
 box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
 z-index: 1;
 margin-top:10px;
}

.menudrop-content a,.menudrop-content a:link, .menudrop-content a:visited, .menudrop-content a:active {
// color:#000000;
// text-shadow:1 px 1px #8ba5c6;
 border-bottom: 1px solid #6b85a6;
 padding:3px 3px 3px 8px;
 display:block;
}

#menudrop_contact {
 right:0;
}

.content {
 width:100%;
 background-color: white;
 display: inline-block;
}

/*
.content { min-height:600px; }
*/

.content a:link, .content a:visited, .content a:active {
 color:#000099; 
}

.content h2 a, .content h2 a:link, .content h2 a:visited, .content h2 a:active, .content h2 a:hover {
 color:black; text-decoration:none;
 }

.content h3 a, .content h3 a:link, .content h3 a:visited, .content h3 a:active, .content h3 a:hover {
 color:black;  text-decoration:none;
 }

.content h3 {
 border-bottom:1px solid black;
}

.colspan2 {
 width:56.4%;
 float:left;
 text-align:justify;
 padding-left:1%;
}



.colspan2 ul { list-style-type: circle; }

.col {
 text-align:left;
 width:43.6%;
// float:left;
 float:right;
 padding-left:10%;
}

.col h2 {
 padding-left:16%;
}

.col ul, .col li { list-style-type:none; }



.footer {
 width:100%; background-color:#8ba5c6; clear:both; color:#ffffff;text-align:left;padding-bottom:10px;
 -webkit-border-radius: 0px 0px 10px 10px;
 -moz-border-radius: 0px 0px 10px 10px;
 border-radius: 0px 0px 10px 10px;
}

.footer a, .footer a:link, .footer a:active, .footer a:visited {
 display: block;
 color:#ffffff;
 text-decoration:none;
 padding:2px 0 2px 0;
 margin:0;
}

.footer_col {
 float:left;
 width:33.3%;
 padding-left:1%;
 padding:right:1%;
}

.footer_head {
 font-weight: bold;
 font-size: 125%;
 border-bottom: 3px solid white;
 width: 100%;
 margin-bottom:10px;
}

.footer_copy {
 text-align:right;
 padding:5px 1% 5px 1%;
 width:100%;
 clear:both;
}

.asfeatured, .asfeatured img {
 width:100%;
}


.phone { font-size:30px; text-align:center;}

.phone-link, .phone a:link, .phone a:visited {
 color:black;
 text-decoration:none;
}

.credible {
 margin-top: 25px;
 text-align:center;
 width:100%;
}

.centerimg {
 width:100%;
 text-align:center;
 background-color:#dedede;
 font-size:75%;
 margin:10px 0px 10px 0px;
}
.centerimg img {
 width:100%; 
}

.catimg {
 float:left;
 border:1px solid blue;
 margin-right:10px;
}

.catdesc {
 width:100%;
 font-size: 110%;
}

.slidewrapper {
 position:relative;
 clear:both;
 width:900px;
 display: inline-block;
 margin-top:5px;
 box-shadow: 0px 3px 3px black, 0px 9px 7px #8ba5c6;
 margin-bottom:30px;
}

.slider {
 position: relative;
 width:100%;
 margin:0;
 padding:0;
 background-color:#000000;
}
.slider img {
 width:100%;
 margin:0;
 padding:0;
 border:0;
}

.slideback, .slidefwd  {
 position: absolute;
 height: 28px;
 width: 26px;
 top:48%;
 line-height: 25px;
 vertical-align: middle;
 opacity: 0.6;
 background-color:#333333;
 color:white;
}


.slideback {
 left:2%;
}

.slidefwd {
 left:94%;
}

.slidefwd a, .slidefwd a:visited, .slidefwd a:link,.slidefwd a:active,.slidefwd a:hover, .slideback a, .slideback a:visited, .slideback a:link,.slideback a:active,.slideback a:hover {
color:white; font-size:20px; font-family:Tahoma; font-weight:bold; text-decoration:none;
}


.slidetext {
 font-size:100%;
 margin:0;
 padding:3px 0 3px 0;
 width: 100%;
 vertical-align: bottom;
 opacity: 0.8;
 background-color:#000000;
 color:white;
 text-align:center;
}


.vspacer { clear:both; height:20px; }


.caption { text-align:center; background-color:#dedede; font-size:90%; }

.unitframe {
 position: relative;
 background-color: #E8E7FF;
 padding:5px;
 margin-bottom:10px;
 -webkit-border-radius: 5px;
 -moz-border-radius: 5px;
 border-radius: 5px;
 border:1px solid blue;
 box-shadow: 2px 2px 2px black;
// width:220px;
// height:270px;
 color: #666666;
 text-align: center;
// float:left;
 display: inline-block;
}

.unitframe img {
 margin-top:8px;
 border: 1px solid black;
 border-top:1px solid #999999;
 border-left:1px solid #999999;
 border-right:1px solid #999999;
}

.unitframe .featured {
 position: absolute;
 left:5px;
 top:13px;
 margin:0px;
 border:0px;
 width: 71px;
 height: 71px;
}

.unitdesc {
 padding-top: 3px;
}

.unitdesc hr {
 width:90%;
 color: #999999;
 background-color: #999999;
}

.unitdesc a:link, .unitdesc a:visited, .unitdesc a:active  {
 font-size:130%;
 color:#333399;
 font-weight:bold;
 text-decoration:none;
}

.unitdesc_reviews {
 width:90%;
 background-color:white;
 margin:0 5% 0 5%;
}
.unitdesc_reviews img {
 margin:0;
 border:0;
 padding:0;
}
 

.featuredbox {
 position: relative;
 width:100%;
 overflow: auto;
 border:2px solid #000099;
 padding:1%;
 margin:0;
 font-size:120%;
 text-align:center;

 display: inline-block;
}
.featuredbox img {
 float:left;
 margin-top:8px;
 border: 1px solid black;
 border-top:1px solid #999999;
 border-left:1px solid #999999;
 border-right:1px solid #999999;
}

.featuredbox .featured {
 position: absolute;
 left:5px;
 top:13px;
 margin:0px;
 border:0px;
 width: 71px;
 height: 71px;
}



/* on available units page after a check available search */

.available_wrapper, .info_wrapper {  
 width:100%;
 text-align:left;
 display: flex;
 flex-wrap: wrap;
 padding:5px 0 5px 0;
 box-shadow:0 5px 5px 0 #dedede;
 border-top:1px solid #dedede;
 margin: 20px 0 20px 0;
}

.available_wrapper:hover, .info_wrapper:hover {
 box-shadow:0 10px 10px 0px #999999;
 cursor:pointer;
}
.available_unit_img {
 position: relative;
 width:56.4%;
}
.available_unit_description {
 width:43.6%;
 padding:0 1% 0 1%;
 position: relative;
}

.available_unit_img img, .info_img img {
 width:100%;
}
.available_unit_img .featured {
 position: absolute;
 left:0;
 top:0;
 margin:0;
 border:0;
 width: 71px;
 height: 71px;
}

.available_reviews_rates {
 padding-top:20px;
 width:100%;
 clear:both;
}

.available_unit_reviews {
 position: absolute;
 bottom:0;
 left:5px;
 font-size:150%;
}
.available_unit_reviews img {
 height:100%;
}

.available_unit_rate {
 position: absolute;
 bottom:0;
 right:5px;
 font-size:150%;
}

.available_unit_title, .info_title {
 font-size:150%;
}

/* information pages layout */

.info_img {
 position: relative;
 width:30%;
}
.info_description {
 width:70%;
 padding:0 1% 0 1%;
 position: relative;
}

.youtube{
 overflow:hidden;
 padding-bottom:56.25%;
 position:relative;
 height:0;
 clear:both;
}
.youtube iframe{
 left:0;
 top:0;
 height:100%;
 width:100%;
 position:absolute;
}


/* for individual entry pages */

.unit_title {
 font-size:180%;
 font-weight:bold;
 display:inline-block;
}

/* location on individual pages of where the quote shows up */

.quoteLoc {
 width:32%;
 float:right;
 padding:5px 5px 5px 5px;
// margin-left: 10px;
// margin-bottom: 10px;
 border:1px solid #999999;
 text-align:center;
}
.stickyQuote {
 width:100%;
 font-size:15px;
 min-width:300px;
 text-align:left;
}
.quote_nightlyRate {
 font-size:170%;
 font-weight:bold;
 display:inline-block;
}
.quoteReviews {
 font-size:90%;
}
.quoteInput {
 padding: 10px 0 10px 0;
 width:100%;
 text-align:center;
}
.quoteButton {
 width:100%;
 text-align:center;
 padding: 10px 0 10px 0;
}
.quoteButton .datebutton {
 font-size: 130%;
}
.quoteInput .dateinput {
 width:100px;
 font-size:100%;
}

.quoteBox {
 width:100%;
 display:inline-block;
}

.quoteBox a {
 text-decoration:none;
}

.quoteCol {
 width:50%;
 float:left;
 padding: 10px 0 0 0;
 vertical-align:top;
}

.quoteColSmall {
 width:50%;
 float:left;
 padding:3px 0 0 0;
 vertical-align:top;
 font-size:65%;
}

.fontSmallGray {
 color:#999999;
}

.quoteDetailsBox {
 font-size:65%;
 width:50%;
 float:right;
 background-color:#efefef;
 border-top:1px dotted #9999ff;
 text-align:right;
 padding-right:25px;
 margin-top:15px;
}

.quoteDetailsHeader {
 font-size:120%;
 background-color:#8ba5c6;
 color: white;
 border-bottom: 1px solid black;
 padding: 3px 5px 3px 5px;
 margin: 5px 0 5px 0;
}

.quoteDetailsDue {
 font-weight:bold;
 color:#8ba5c6;
 text-shadow: 1px 1px 2px #ffff00, 2px 2px 2px #ffdddd;
 display: inline-block;
}



/*
 Was used by availability calendar under epoch

#availability {
 width: 225px;
 float: right;
 text-align:center;
 background-color: #ffffff;
 padding-left: 10px;
 margin-right: 0px;
 padding-right: 0px;
 padding-bottom: 10px;
}
*/

/*
 was used for col instant quote under old design

#pm_iq {
 height:0;
 visible:hidden;
 overflow:hidden;
 width:90%;
 text-align:left;
 padding-left:15px;
}
#pm_iq table {
 border:1px solid #dedede;
 width:100%;
}

#pm_iq .pm_iquote {
 font-weight:bold;
 color: white;
 background-color: #000000;
 opacity: 0.3;
 text-align:center;
 padding-top:3px;
 padding-bottom:3px;
 width:50%;
}
#pm_iq .pm_pct {
 font-size:75%;
}
#pm_iq .pm_disclaimer {
 font-size:65%;
 color: #555555;
}
#pm_iq .pm_total {
 font-weight:bold;
 border-top: 1px solid;
}
#pm_iq td {
 width:30%;
}
#pm_iq .pm_rgt, #pm_iq .pm_col2 {
 text-align:right;
 width:40%;
}
#pm_iq .pm_col2 {
 width:30%
}

*/

/* used to display reviews on unit pages */
.reviews, .reviews td { text-align:left;  font-size: 13px; font-weight: normal; }
.revname { font-weight:bold; }
.revtitle { font-size:25px; }
.revowner {background-color:#efefef;}
.revmore { background-color:#efefef; font-size:20px; font-weight:bold; text-align:center; cursor:pointer; }
.revstars { vertical-align:center; font-size:20px; font-weight:"bold"; border:0; margin:0; padding:0; }
.revstars img { float:left; padding-right:5px; }


div.socialmedia { width:100%;text-align:center;}

/* process page layouts */

.process_content {
 text-align: left;
 font-size:110%;
// display: flex;
 background-color:white;
 width:100%;
}

.process_content input[type=text], .process_content select, .process_content textarea {
 font-size:110%;
 -webkit-border-radius: 5px 5px 5px 5px;
 -moz-border-radius: 5px 5px 5px 5px;
 border-radius: 5px 5px 5px 5px;
 width:100%;
}
/*
.fpay input {
 margin:5px 0 5px 0;
}
*/


.process_content .exp_mon{
 width:100px;
}
.process_content .exp_year {
 width:75px;
}
input[type="text"].cvv {
 width:50px;
}

.process_content .datebutton {
 width:85%;
 font-size:150%;
}

.process_content .quoteButton {
 display:none;
}

.process_lcol {
 float:left;
 width:33.33%;
 padding:5px;
 
// flex:1;
}
.process_mcol {
 background-color:white;
 float:left;
 width:33.33%;
 border-right: 1px dotted black;
 border-left: 1px dotted black;
 padding:5px;
 padding-bottom:100px;
// flex:1;
}
.process_rcol {
 background-color:white;
 float:left;
 width:33.33%;
 padding:5px;
// flex:1;
}
.paymethod_wrapper {
 width:100%;
 height:300px;
}

.process_tr:after {
 content: "";
 display: table;
 clear: both;
}
.process_full {
 width:100%;
}
.process_half {
 width:50%;
}
.process_expiration {
 width:65%;
}
.process_cvv {
 width:35%;
}
.process_td {
 padding:5px;
 float:left;
}
.process_red {
 color:#ff6666;
}
.process_ast {
 font-size:90%;
}
.process_unitname {
 font-size:130%;
 font-weight:bold;
 padding-right: 30px;
}
.process_changedates {
  background-color: orange;
  border:1px solid black;
  color:white;
  padding: 2px 5px 2px 5px;
  text-decoration:none;
  display: inline-block;
  font-size: 55%;
  font-weight:bold;
 -webkit-border-radius: 5px 5px 5px 5px;
 -moz-border-radius: 5px 5px 5px 5px;
 border-radius: 5px 5px 5px 5px;
 text-shadow:1px 1px 2px #000000;
 cursor:pointer;
}



.process_unitframe {
 color: #000000;
// background-color: teal;
 text-align: center;
 -webkit-border-radius: 5px 5px 5px 5px;
 -moz-border-radius: 5px 5px 5px 5px;
 border-radius: 5px 5px 5px 5px;
 padding:5px 5px 5px 5px; 
 margin-top:5px;
}
.process_unitframe img {
 width:100%;
}

.process_quoteDetailsBox {
 font-size:80%;
}

.process_finaltotal {
 padding:10px;
 text-align:center;
 font-size:100%;
}

.process_norefund {
 font-size:60%;
// color: #ff6666;
}

.giftbox {
 background: #ffffff url('/giftbox.png') no-repeat left center;
 background-size: 20px 22px;
 width:100%;
 min-height:22px;
 font-size:65%;
 padding-left:25px;
}

.process_error {
 border-color:red;
 background-color: #ffefef;
}

/* end process layouts */

.question {
 background: url('/question_mark.png');
 background-size: 100%;
 width:15px;
 height:15px;
 display:inline-block;
 cursor:pointer;
}

.infobox {
 position:fixed;
 top:50%;
 left:50%;
 width:350px;  /* adjust as per your needs */
 height:350px;   /* adjust as per your needs */
 margin-left:-175px;   /* negative half of width above */
 margin-top:-175px;   /* negative half of height above */
 border:2px solid #8ba5c6;
 box-shadow: 0px 3px 3px black, 0px 9px 7px #8ba5c6;
 background-color:white;
 cursor:pointer;
 text-align:left;
 padding:5px;
}

.tleft { text-align:left; }
.tcenter { text-align:center; }
.tright { text-align:right; }
.nopad { padding:0; }
.rimg { float: right; margin-left: 8px; margin-bottom: 8px; }
.limg { float: left; margin-right: 8px; margin-bottom: 8px; }
.cimg { margin: 0 auto; width:100%; text-align:center; }
.fullwidth { width:100%; padding:0 1% 0 1%; margin:0; display: inline-block;}
.hidden { display:none; }
.show { display:block; }
.inline { display:inline-block; }

.spblue, .process_unitframe {
 background-color:#8ba5c6;
 color: white;
}

.invoice {
 font-size:125%;
 text-align:left;
 width:60%;
}



@media screen and (max-width: 600px) {
 .wrapper {
  width: 100%;
  border:0;
  margin:0;
  padding:0;
 }
 .process_content {
  display: block;
 }
 .process_lcol, .process_mcol, .process_rcol, .process_half, .process_full, .invoice {
  width: 100%;
  border:0;
 }
 .process_mcol {
   padding-bottom:0;
  }
 .slidewrapper {
  width:100%;
  margin-bottom:10px;
 }

 .colspan2, .col, .available_unit_img, .available_unit_description {
  float:left;
  width:100%;
  padding-left:1%;
  padding-right:1%;
 }
 .col h2 {
  padding:initial;
 }

 .unitframe {
  width: 75%;
 }
 .unitframe img {
  width: 100%;
 }
 .unitdesc_reviews img {
  width: auto;
  height:15px;
 }

 .header .quote {
  width:100%;
  float:left;
  font-size:90%;
  font-weight:bold;
  text-align:left;
  padding: 3px 1% 3px 1%;
  background-color:white;
 }
 .menu {
  text-align;center;
  font-size:100%;
 }
 .menulinks {
  text-align:center;
  float:none;
  width:100%;
  padding:0;
  padding-bottom:10px;
  border-bottom: 2px solid black;
 }
 .menusearch {
  text-align:center;
  padding-top:3px;
  width:100%;
  float:none;
 }
 .footer_col {
  width:100%;
 }

 .slidefwd {
  left:90%;
 }
 .slidetext {
  font-size:80%;
 }

 .sticky {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 1000;
 }


 .sticky + .content {
  padding-top: 70px;
 }

 .quoteLoc {
  width:100%;
  padding: 0 1% 0 1%;
  float:left;
 }

}

@media print {
 .menu, .footer {
  display:none;
 }
 a, a:link, a:hover, a:active  {
  text-decoration:none;
 }

}