@charset "utf-8";

/* CSS Document */



#getintouch {scroll-margin: 200px; display: block;}

#bodyBody ol {}

#bodyBody ol li {list-style-position: outside; text-align: left !important; margin: 0 2% 0 8%; padding-left: 2px;}

#panoHelperClose {display: none}



::-webkit-scrollbar{width:12px; max-width:12px !important; background:rgba(255,255,255,.2);}
::-webkit-scrollbar-track{ background: rgba(0,0,0,.8)}
::-webkit-scrollbar-thumb{ background: rgba(86, 113, 60, .8); border:2px solid rgb(255,255,255); border-right:0 !important}
::-webkit-scrollbar-thumb:hover{background: rgba(86, 113, 60, 1); border:2px solid rgb(255,255,255); border-right:0 !important}
#ex3::-webkit-scrollbar-thumb:active{background-color:#41590e; border:1px solid rgba(250,225,0,.9);}	


@media print {
	* {color:#000}
}

@media screen and (max-width:1600px) {
  #categoryListOpen li a div ul li {font-size: 14px}
  #categoryListOpen li:hover div {bottom: 3%; left: 3%; right: 3%;}
}

@media screen and (max-width:1500px) {

  #categoryListOpen li {width:32.6% !important; margin: 0.25vw}

  #categoryListOpen li:hover a div li {width:96% !important; font-size: 16px}

  #categoryListOpen li:nth-child(-n+2) {width:49.25% !important}
  #categoryListOpen li:nth-child(-n+2) a img {width:65%; float: left}
  #categoryListOpen li:nth-child(-n+2) a div {width:62%; left:32%; right: 3%; bottom: 28%; border:6px solid #345c45; background: #FFF}
  #categoryListOpen li:nth-child(-n+2):hover a img {width:100%; filter: blur(3px) grayscale(100)}
  #categoryListOpen li:nth-child(-n+2):hover a div {width:86%; left:7%; right: 7%; bottom: auto; top:12%; background: inherit}
  #categoryListOpen li:nth-child(-n+2):hover a div span {font-size: 32px}
  #categoryListOpen li:nth-child(-n+2):hover a div li {width:96% !important; font-size: 16px}

}



@media screen and (max-width:1400px) {

  

  #header.smallheader #logo {padding-top: 0 !important}

  

  #header #contactbar {width:50vw}
  #header #contactbar p#headtext .morphext {font-size:38px}

  #pageHome #photoPanel {height: 75vh !important}
  #pageHome #photoPanel #bannerPhoto {filter:blur(1px); background-size: 123%}


  #messagePanel {width:75%}

  #pagesGrid .cell3 .image, #pagesGrid .cell4 .image {width: 220px}
  #pagesGrid .cell3 .block, #pagesGrid .cell4 .block {width: calc(100% - 220px)}
}



@media screen and (max-width:1320px) {
  #categoryListOpen li:hover a div {left:3%; right: 3%; bottom:5%}
  #categoryListOpen li a div span {font-size: 24px}
  #categoryListOpen li a div li {font-size: 14px}
}

@media screen and (max-width:1240px) {
  h1, h2, #mainBlock h1, #mainBlock h2 {font-size: 42px; line-height: 1.2em;}

  #header #logo a img.icon {height: auto; width: 100%}

  #header #contactbar {width:50%; padding: 2px 0 12px !important}
  #header #contactbar p#headtext, #header #contactbar p#headtext *, #header.smallheader #contactbar p#headtext a, #header #contactbar p#headtext .morphext {font-size:28px}
  #header #contactbar p#headtext {padding-bottom: 2px; margin: 10px}

  #messagePanel {position:relative; width:80%; text-align:center; z-index:360; padding:16px 0 12px; background:rgba(255,255,255,.6); top:-50%}
  #messagePanel p {margin: 12px 32px 0 !important}

  #pageHome #messagePanel {position: absolute; top:60%; width:86%; text-align:center; z-index:360; padding:12px 0 16px; background:rgba(255,255,255,0);}

  #photoPanel {height:40vh !important}

  #messagePanel p.subheading {display: none;}
  #messagePanel p.googleQuote {margin: 12px 32px}

	#header #icon img.icon {height:85px !important}
	#header #iconname img.icon {height:auto !important; width:85%; display: block; margin: 0 auto;}

	

	#header .content {width:100vw; margin:0 auto; position:relative; padding: 0 !important; text-align: justify}
  #header #logo a {width:100%}

  .abCal-calendars {width:148px !important}
  .abCal-dates {width:calc(100% - 148px) !important}

  

  #highlights {margin: 14px auto 0 !important; opacity: 1}
  #highlights li {text-transform: uppercase; font-size: 16px; line-height: 2em}

  ul#properties li .block span.title {font-size: 16px !important}
  ul#properties li .block span.sleeps {font-size: 12px !important}

  nav.isFixed .container {margin: 8px 6px 0}
  nav.isFixed a.btn {margin-top: 0 !important; padding: 6px 6px 7px 6px !important; width: calc(50% - 21px); text-align: center !important}
  nav.isFixed a.btn i {margin:10px; display:inline-block !important; font-size: 20px}
  nav.isFixed a.btn span {display:inline-block !important; vertical-align: top; padding-top: 12px }

  nav.isFixed #singler {padding:0; width:100%}
  nav.isFixed #singler li {width:calc(97.75% / 5);  margin: 0 0px 10px 0}
  nav.isFixed #singler li a {text-align: center; display: block; width: 100%; padding: 6px 0 !important}
  nav.isFixed #singler li a i, nav.isFixed #singler li a i {font-size: 32px; display: block; text-align: center; margin: 10px auto;}


  .abWrapper .abMenuNav a, .abWrapper .abMenuNav a i, .abWrapper .abMenuNav a span {font-size:14px !important; text-transform: uppercase; line-height: 2em}

  #abWrapper_1 td.abCalendarMonth {font-size:16px}

  

  #pagesGrid .cell3 .image, #pagesGrid .cell4 .image {width: 100%; display: block}
  #pagesGrid .cell3 .block, #pagesGrid .cell4 .block {width: 100%; display: block}

  #contactForm {width:100% !important; display:block; padding:15px 0 !important}
  
}

@media screen and (max-width:1100px) {

  .mw90 {max-width:96% !important; }

  #topline li {width:32%}

  

  a span.label {display: none !important}

  a span.labelMobile {display: inline-block !important}

  

  

  #pageHome #photoPanel {height: 80vh !important}

  #pageHome #photoPanel #bannerPhoto {filter:blur(0); background-size: cover; height: 80vh;}

  

  #categoryListOpen li {width:49.25% !important}

  #categoryListOpen li:hover a div {left:3%; right: 3%; bottom:auto; top:7% !important}



  #categoryListOpen li a div span {font-size: 20px !important}

  #categoryListOpen li a div li {font-size: 14px !important}

      

}





@media screen and (max-width:1024px) and (orientation:portrait) {

  #pageHome #photoPanel {height: 52vh !important}

  #messagePanel {top:-50% !important}

  

	#topline li {width:25%; font-size:14px}

	#topline li.dash {display:none}

  

  #logoGSV {max-width: 400px; width: 30%; float: left; margin: 10px 0 0 20px;}

  #messagePanel h1 {font-size: 60px; letter-spacing: 2px; display: inline-block; width: 60%; vertical-align: top; text-shadow: none; margin: 15px 0 0;}

  #messagePanel h1 span {font-size: 29px; margin: 0 0 2px; letter-spacing: 1px;}

  #basebase {background: radial-gradient(rgb(51, 51, 51), #111);}

  #messagePanel p#messageFootnotes, #messagePanel p#messageFootnotes * {font-size:16px}

}

@media screen and (max-width:1024px) and (orientation:landscape) {

  #pageHome #photoPanel, #pageHome #photoPanel #bannerPhoto {height: 70vh !important}

}



@media screen and (max-width:1024px) {

  #header #contactbar p#headtext, #header #contactbar p#headtext *, #header.smallheader #contactbar p#headtext a {font-size: 24px}



  .contactContact, #contactInfo {width:calc(98% - 10px) !important; display: block; float: none !important; padding: 0 1%; margin: 0 auto !important;}

  #contactus #contactForm .row.row_submit input#frmSubmit {background: #41590e !important; color: #FFF !important;}

  

  #toTheTop {padding: 11px; border-width: 2px;}

  #toTheTop i {font-size: 24px; width:24px; height:24px;}

  

  #pjWrapper .pjBlPost .pjBlPostContent .pjBlPostTitle.pull-right, #pjWrapper .pjBlPost .pjBlPostContent .pjBlPostTitle.pull-right:hover {border-radius:12px !important; background: #345c45; float: left !important; clear: both; padding: 0; margin: 0 0 6px 6px;}

  #pjWrapper .pjBlPost .pjBlPostContent .pjBlPostTitle.pull-right span {color:#FFF !important}

 

  #topline ul#headerLine li#headerSocials a span {display: none}

  

  #availability_grid {width:98%; padding: 1%}

  #ticklist li {width:50%}

  

  #pagesGrid {width:98% !important}

}



@media screen and (max-width:1023px) {

  #pjWrapper .pjBlCommentsCounter, #pjWrapper .pjBlPost .pjBlPostContent .pjBlPostTitle .pjBlCommentsCounter {font-size: 14px; padding: 5px 16px 6px 16px}

  #pjWrapper .pjBlCommentsCounter, #pjWrapper .pjBlPost .pjBlPostContent .pjBlPostTitle .pjBlCommentsCounter {font-size: 14px; padding: 5px 16px 6px 16px}

  #pjWrapper .pjBlPost .pjBlPostContent .pjBlPostTitle .pjBlCommentsCounter {font-size: 14px !important}

  #messagePanel p#messageFootnotes, #messagePanel p#messageFootnotes * {font-size:16px}

  

  nav li a i, nav a i {font-size: 32px; display: block !important; text-align: center; margin: 10px auto;}





  #header #contactbar a {margin: 5px 5px 5px 0; padding-top: 6px}

  #header #contactbar a i {font-size: 28px}

  

  #header.smallheader #contactbar {color: #FFF !important; text-align: center; margin: 0 auto; float: none !important; display: block;}

  #header.smallheader #contactbar span {font-size: 14px;}

  

  

  nav.isFixed #singler li {width:calc(96.75% / 5);  margin: 0 0px 10px 0}

  #ticklist li {width:100% !important; font-size: 18px}

  

  #fieldBlock {display:none !important}

}



@media screen and (max-width:900px) {

  #pageHome #photoPanel {height: 62vh !important}

  

  #topline ul#headerLine {width:100% !important}

  #topline ul#headerLine li {display: none}

  #topline ul#headerLine li#toplinetext {display: block !important; text-align: center; width:100%; padding: 1px 0 3px}

  

  #header #logo a img#logoLogo {}

  #header #logo a img#logoSlim {/*display:block !important; */ padding: 0 10px; margin: 0 auto}



  #nav ul.navnav li:not(:last-child) {display: none !important}

  #nav ul.navnav li#openclose {float: right; text-align:center; display: block !important; font-size:48px; width:100% !important }



  #nav ul.navnav.responsive {position: relative; background: rgba(60,4,68,.9) repeat center center; background-image: url(../images/bg_header-text__EDIT.png); padding: 6px 0 12px 0}

  #nav ul.navnav.responsive li, #nav .content li.icon, * #nav ul li.icon {float: none !important; display: block !important; width:99% !important}

	

  #nav ul.navnav.responsive li a span {color:#FFF}

  #nav ul.navnav.responsive li:hover a span {color:#FAE100}

  #nav ul.navnav.responsive li a {display: block; text-align: left;}

	#nav ul.navnav.responsive li a img {display:none}

  

  #nav ul#menunav li * {color:#FFF}

	#nav ul#menunav li:hover * {color:#FAE100}

	#nav ul#menunav li img {display: none !important}



  #pageHome #nav .content {padding: 8px 0 0;}



    

  #messagePanel {top:-50%; width:100vw !important}

  #messagePanel h1, #photoPanel:hover #messagePanel h1 {font-size: 32px !important;}

  #messagePanel h1 span {font-size: 28px; margin: 0 0 2px}

  

  

  #header #contactbar a * {background: none !important; color: #41590e !important;}

  #header #contactbar a, #header.smallheader #contactbar a, #header.smallheader #contactbar * {display: inline-block; background: #FFF; color: #41590e !important; border-radius: 14px; text-decoration: none !important}

  #header.smallheader #contactbar a, #header.smallheader #contactbar * {border-radius:4px !important; }

  #header #contactbar a i {font-size:21px; color:#41590e !important}

  #header #contactbar a.btn-reviews span.label{padding: 2px 4px 0 4px; font-weight: bold;}



  nav li a span {font-size: 12px !important}

  #photos a {width:calc(98.25% / 4)}

  

}



@media screen and (max-width:850px) and (orientation:landscape) {

  #header, #header.subPage {top:0 !important}

  #header #contactbar {padding: 0 0 8px}

  #messagePanel p.subheading {font-size: 28px}
  
  #pagesList a .block .showIcon {display: none}

}





@media screen and (max-width:850px) {

  #messagePanel {top:-50% !important}

	#topline li {width:33%; font-size:14px}

	#topline li.dash {display:none}

  

  #logoGSV {max-width: 400px; width: 30%; float: left; margin: 10px 0 0 20px;}

  #messagePanel h1 {font-size: 60px; letter-spacing: 2px; display: inline-block; width: 60%; vertical-align: top; text-shadow: none !important; margin: 10px 0 0;}

  #messagePanel h1 span {font-size: 29px; margin: 0 0 2px; letter-spacing: 1px;}

  .skdslider .slide-inner > h2, h2.nopline span {font-size:24px !important; line-height: 1.36em; }

}



@media screen and (max-width:850px) and (orientation:landscape) {

}



@media screen and (max-width:768px) {

  #categoryListOpen li, #categoryListOpen li:nth-child(-n+2) {width: 100% !important; margin: 0 0 1vw;}

  #categoryListOpen li a img {width:100% !important; height: 32vw !important; float:left}

  #categoryListOpen li a div:before {height: 1%}

  

  #categoryListOpen li a div, #categoryListOpen li:nth-child(-n+2) a div {left:auto !important; right: 3.25% !important; bottom:auto !important; top:9% !important; width: 64vw !important; background: #FFF !important;}

  

  #categoryListOpen li:hover div * {color:#345c45 !important}



  #categoryListOpen li a div span {font-size: 22px !important}

  #categoryListOpen li a div .extras {display: block !important}

  #categoryListOpen li a div li {font-size: 14px !important}  

  

  #basebase #footerReviews, #basebase #footerLogo {width:90%; margin: 0 auto; display: block}

  #basebase #footerLogo {margin: 0 auto; width:auto; padding: 0 10px }

  #basebase #footerLogo img {max-width:500px; }

  

  .abWrapper .abValue, .abWrapper .abSelect {float:right !important}

  .abDialog {width:calc(100vw - 30px) !important}

  .abWrapper .abButtonDefault {background:#345c45 !important}

  

  #mainHeadline, #mainHeadline *{font-size: 18px}

  #info-strap #straptop h1 {font-size: 18px; position: relative; top: auto; color: #41590e !important; font-weight: 900; text-shadow: none; padding: 10px 0;}

  

  #pagesGrid {width:100% !important}

  #pagesGrid .cell {width: calc(50% - 12px) !important; padding: 4px; margin: 0; vertical-align: top;}

  #pagesGrid .cell .image, #pagesGrid .cell .block {width:100%}

  #pagesGrid .cell .block {padding: 10px !important;

    width: calc(100% - 20px) !important;}

  #pagesGrid .cell .block span.title, .owl-carousel .item .block span.title {font-size:20px !important}

  #pagesGrid .cell .block span.sleeps, .owl-carousel .item .block span.sleeps {font-size:16px !important}

  #pagesGrid .cell .block p, .owl-carousel .item .block p {font-size:14px !important; width: 90%; margin: 0 auto;}

  

  

}





@media screen and (max-width:500px) and (orientation:portrait) {
  #bodyBody{width:96% !important}
  #pageHome #header {position: fixed !important; height: 77vh; display: block; background: none}

  

  #info-strap #straptop h2 {font-size:24px}

  #info-strap #straptop p, #info-strap #straptop p * {font-size: 16px}



  #header #logo {width:90% !important; left: 50%; transform: translate(-50%, 0); position: relative}

  #header, #header.subPage {top:0 !important}

  #header #contactbar {width:100% !important; margin: 0 !important}

  #header.smallheader {background: #FFF !important; height: auto !important;}



  

  #photoPanel #bannerPhoto, #photoPanel #bannerPhotoSwap {background-size: contain !important;}

  .skdslider .slide-desc {top: 100% !important; width:85% !important;}

  .skdslider .slide-inner a {padding: 28px 8px;}


  #WhyChooseUs {width:80% !important}
  

  

  #guestbook a {width:calc(97.2% / 3)}

  .abWrapper {width:95%}

  #map_fields {background: rgb(52, 92, 69);}

  #map_fields #map_from a#submit {display: block; margin: 10px auto 0}

  

  #contactBlock #contactForm .row.col0 {width:calc(100% - 3px)}

  #contactBlock #contactForm .row.col1, #contactBlock #contactForm .row.col2 {width:calc(100% - 7px) !important}

  #contactBlock #contactForm .row.col0 input.txt {width: calc(95% - 7px) !important}

  #contactBlock #contactForm .row textarea {width:calc(100% - 30px) !important; padding: 7px !important}

  #contactBlock #contactForm .row.rowM {width:calc(97% - 7px) !important}

  #contactBlock #contactForm .row.rowM input.txt {width:calc(96% - 11px) !important}

  

  #contactBlock #contactForm .row.col1 input {width: calc(98% - 20px) !important;}

  #contactBlock #contactForm .row.col2 .txt {width: calc(94% - 12px) !important;}

  

  

  #pageCms #header #contactbar {width:40px !important; opacity: 1; padding: 0; display: none !important}

  #pageCms #header #contactbar a {padding: 3px; margin: 3px; background: rgba(255, 255, 255, 0.75) !important}

  #pageCms #header #contactbar a i {display: block}



  

  #pageHome #messagePanel {top: -30% !important; width: 90%;}

  #messagePanel p.subheading {font-size: 26px !important; line-height: 1.36em; letter-spacing: 0;}

  

  #messageButtons {margin: 4px 0 2px 0;}

  #messageButtons a {font-size: 18px !important; display: inline-block; margin: 4px; padding: 4px 15px 5px 15px !important}



  #pageHome #photoPanel, #pageHome #photoPanel #bannerPhoto, .skdslider ul.slides li img {height:80vh !important}

  #pageHome #messagePanel {top:-30% !important; width:90%; position: relative}

  #messagePanel p {margin: 10px auto 0 !important; padding: 5px 0;}

  #messagePanel p.googleQuote, #messagePanel p.googleQuote * {text-align: justify; font-size: 14px !important}

  

  #messagePanel p.subheading {margin: 8px 32px 5px 32px; color: #345c45 !important; font-size: 24px !important;}

  

  #messagePanel p#messageFootnotes, #messagePanel p#messageFootnotes * {font-size: 12px !important; width: 80%; margin: 0 auto !important;}

  

  #mainHeadline, #mainHeadline * {font-size: 42px !important}

  #mainHeadline span { font-style: italic; color:rgb(25,25,25) !important}

  #info-strap #straptop {padding: 2px 10px}

  

  #contactBlock {padding: 12px 0 0 !important}

  

  #header.smallheader #logo {display:none !important}

  #header.smallheader #contactbar {padding: 5px 0 !important; display: block; float: none !important; width: 100%; text-align: center; position: relative; top: 0; transform: none;}

  

  #header #contactbar a {display: inline-block !important; background: rgba(255, 255, 255, 1) !important; margin: 0 3px !important; padding: 0px 4px 10px; width: calc(21% - 1px); text-align: center}

  #header #contactbar a *{display: block}
  #header #contactbar a i {font-size: 22px !important; margin: 0 10px}
  #header #contactbar a span {font-size: 18px !important; line-height: 1em; text-transform: uppercase;}

  #header.smallheader #contactbar a.btn-book {background:#41590E !important}
  #header.smallheader #contactbar a.btn-book * {color:#FFF !important}
  
  #header.smallheader #contactbar a span {font-size: 14px !important;}

  #header #logo a img.icon {width: 96%; min-width: 260px; margin: 0 auto;}

  

  #basebase ul li {display: block !important; line-height: 1.5em; width: 100% !important; font-weight: bold;}
  #basebase ul li i {display: none !important}
    

    

  [id^=pjWrapper] .col-lg-1, [id^=pjWrapper] .col-lg-10, [id^=pjWrapper] .col-lg-11, [id^=pjWrapper] .col-lg-12, [id^=pjWrapper] .col-lg-2, [id^=pjWrapper] .col-lg-3, [id^=pjWrapper] .col-lg-4, [id^=pjWrapper] .col-lg-5, [id^=pjWrapper] .col-lg-6, [id^=pjWrapper] .col-lg-7, [id^=pjWrapper] .col-lg-8, [id^=pjWrapper] .col-lg-9, [id^=pjWrapper] .col-md-1, [id^=pjWrapper] .col-md-10, [id^=pjWrapper] .col-md-11, [id^=pjWrapper] .col-md-12, [id^=pjWrapper] .col-md-2, [id^=pjWrapper] .col-md-3, [id^=pjWrapper] .col-md-4, [id^=pjWrapper] .col-md-5, [id^=pjWrapper] .col-md-6, [id^=pjWrapper] .col-md-7, [id^=pjWrapper] .col-md-8, [id^=pjWrapper] .col-md-9, [id^=pjWrapper] .col-sm-1, [id^=pjWrapper] .col-sm-10, [id^=pjWrapper] .col-sm-11, [id^=pjWrapper] .col-sm-12, [id^=pjWrapper] .col-sm-2, [id^=pjWrapper] .col-sm-3, [id^=pjWrapper] .col-sm-4, [id^=pjWrapper] .col-sm-5, [id^=pjWrapper] .col-sm-6, [id^=pjWrapper] .col-sm-7, [id^=pjWrapper] .col-sm-8, [id^=pjWrapper] .col-sm-9, [id^=pjWrapper] .col-xs-1, [id^=pjWrapper] .col-xs-10, [id^=pjWrapper] .col-xs-11, [id^=pjWrapper] .col-xs-12, [id^=pjWrapper] .col-xs-2, [id^=pjWrapper] .col-xs-3, [id^=pjWrapper] .col-xs-4, [id^=pjWrapper] .col-xs-5, [id^=pjWrapper] .col-xs-6, [id^=pjWrapper] .col-xs-7, [id^=pjWrapper] .col-xs-8, [id^=pjWrapper] .col-xs-9 {padding-right: 0px !important; padding-left: 0px !important;}



  #pjWrapperAppScheduler_1 .pjAsServiceMeta dt{width: 50% !important; text-align: center !important;}

  #pjWrapperAppScheduler_1 h2, h2.pjAsListElementTitle {font-size: 16px !important; text-align: center !important}

  #main .content #contactus {width:90% !important; padding-top: 20px !important; background: #56713c !important}  

  

  .asEmployeeInfo {display: block; margin-top: 10px;}





}

@media screen and (max-width:420px) {

  #header #logo, #header #contactbar {display: block !important; position: relative !important}

  #header #logo {top: 0 !important; width: auto;}

  #header #logo img {max-width: 200px; width: 90%; margin: 0 auto }

  

  #header #contactbar, #header.smallheader #contactbar {width:100% !important; position: relative !important; top:0; right: 0; text-align: center}
  

  

  #header #contactbar p#headtext, #header #contactbar p#headtext *, #header.smallheader #contactbar p#headtext a {font-size: 22px; text-align: center}



  #header.smallheader #logo {display: none !important}

  

  #categoryPhotos a:nth-of-type(1n+3){display: none !important;}

  

  .skdslider .slide-inner > h2 {font-size: 20px !important; }

  

  #singler {width:100%; padding: 0 !important}

  #singler li {width:calc(93.5% / 5) !important; text-align: center; margin: 0 1px 0 0 !important}

  #singler a:link, #singler a:visited, #singler a:active, #singler a:focus, #singler a:hover, nav a.btn {margin: 2px 0 !important; padding: 4px 0; width:100%}

  

  nav a.btn, nav.isFixed a.btn {display: inline-block !important; vertical-align: top; margin: 0 0 5px !important; float: none !important; padding: 0 2px 0 0 !important; width: 99% !important; text-align: center }

  nav a.btn.navAllProps {display: block !important; margin-top: 8px; float: none !important; padding: 0px 2px 0 7px !important; width: auto !important; }

  

  nav li a i, nav a i {display:inline-block !important; font-size:25px}

  nav a.btn i {font-size: 16px !important}

  nav li a span {display: none !important}

  nav a.btn span, nav.isFixed a.btn span {vertical-align: top; margin: 10px 6px 0 10px; display: inline-block; padding: 0}

  

  section p {text-align: justify; margin:0 auto 15px}

  ul#popupProps li {width: calc(100% - 10px)}

  ul#popupProps li .block {margin: 14% 0 0}

  ul#popupProps li a img {height:24vh}

  

  #photos a {width: calc(98.8% / 3);}

  .fancybox-caption {padding: 5px 0 !important}

  

  

  #panoHelperMobile h2 {font-size: 21px !important}

  #panoHelperMobile h3 {font-size: 18px !important; margin: 4px 0 1px 0;}

  #panoHelperMobile p#pawList {margin: 2px 2px 10px 2px !important;}

}















@media screen and (max-width: 1200px) {

pre {display:none;}



	#header {padding-top:0}



	

	#header #contact {width:100%; padding:10px 0}

	#header #contact * {text-align:center; font-size:18px; padding-top:0 !important}

	#header #contact a {overflow:hidden; width:30%; display:inline-block;}

	#header #contact a span.label {display:none}

	#header #contact a span.data {display:block; width:100% !important}

	#header #contact a.contactAddr span {font-size:16px}

	#header #facebookLink {width:12%; position:absolute; top:0; right:0; min-width:48px; max-width:132px}



  

  

  .skdslider .slide-desc > h2, .skdslider .slide-desc > h2 span {font-size:32px}

  .skdslider .slide-desc > p {font-size: 16px; line-height: 1.4em; width:90%; display: block; margin: 0 auto}



  

  .content {width:96%;}

	#nav .content {width:100%; padding-top:0 !important}

	#nav .content li.icon {width:20% !important; margin-top:0}

	#nav .content li.link {width:33% !important; padding:6px 0 0 !important}



	#nav .content li.icon a img {height:64px !important}



	#nav ul#menunav li {margin: 4px 0 !important; padding: 15px 0}

	#nav ul#menunav li * {text-align: center !important}

  

  #nav ul#menunav:hover li {}

  #nav ul#menunav li:hover {}

  

  

  #pageHome #nav ul li.icon span {padding:0}

	

  

	#contact_form {float:none; display:block; width:auto; margin-right: 0; margin-bottom:12px; padding:3px 3px 10px 6px; background:rgba(0,173,236,.3)}

	#contact_form div {display:inline-block; width:49%; margin:0; padding:0;}

	#contact_form div label {display:block; color:#000; font-size:14px; line-height:1em; width:100%; padding:8px 0 0;}

	#contact_form form input, #contact_form form select, #contact_form form textarea {width:95%; padding:3px 5px; display:block; margin:0 auto; background:rgba(255,255,255,0.85)}

	#contact_form form select {width:97%}

	#contact_form div.message {width: 98%}

	#contact_form div.message textarea {width:97%}

	#contact_form div.submit {width: 98%}

	#contact_form div.submit textarea {width:97%}

	#gmap_canvas {display:block; width:100%; height:320px;}

  

  #photos a i {color:rgb(255 255 255 / 48%); display:block !important; text-shadow: 0 0 10px #616161;}





}



@media screen and (max-width: 900px) {



	#serviceTypes li {width:33%}

	h1, #messagePanel h1 {font-size:32px;}

	h2, h2 i {font-size:28px !important; text-align: center !important}

	#main .content {padding:3px 4px; width:auto}
  
  #main .content #contactus h2 {color: #FFF !important; text-transform: uppercase;}

	

	#nav .content li.link {width:50% !important; padding-top:4px !important}

  ul#properties li {width:50% !important}

	

	

	#header #contact a {width:49%}

	#header #contact a {font-size:24px}

	#header #contact a.contactAddr {width:100%}

  



  body#pageHome #photoPanel:hover #glassPanel {background:rgba(60,4,68,.2)}

  body#pageHome #photoPanel:hover .skdslider ul.slides li img {filter: blur(0) !important}

  





    

}

@media screen and (max-width: 825px){





}

@media screen and (max-width: 768px){

	#serviceTypes li {width:33%}

	#header #contact {padding:10px 0 0}

	

	#messagePanel {top:18%; border-radius: 0; background: rgb(52 92 69 / 84%) !important; padding: 0 0 12px;}

	#messagePanel *, #messagePanel:hover * {font-size:22px !important; text-shadow: none !important}

  #messagePanel h1 {margin: 10px 0 0; color: #FFF !important;}

  #messagePanel p * {color:#FFFFFF !important}



}

@media screen and (max-width: 700px){

	#topline {display:none}



	#main {padding:0}

	#pagehome #main {padding:5px 0 15px}

  #quotebutton {float:none; display:block; margin:2px auto 6px; text-align:center; padding:8px 0 1px; font-size:14px}

}

@media screen and (max-width: 600px) {

	#topline li {width:50%}

  .content {width:94%;}

	#header #contact a {width:100%}

	#header #contact a * {font-size:18px; letter-spacing:1px}



	#header #contact a.contactAddr {display:none}

  

	#messagePanel {top:-18% !important; background: none !important; background: rgb(52 92 69 / 84%) !important; border-radius: 0; padding-top:0}

	body#pageHome #messagePanel {top:6%}

	#messagePanel *, #messagePanel:hover * {font-size:16px !important; text-shadow: none !important;}

	#messagePanel h1, #messagePanel:hover h1 {font-size:24px !important; color:#FFF !important; text-shadow: none !important; width:96%}





  #nav .content li:first-child.icon a img {display:none !important}

	#nav .content li.icon {width:50% !important; margin-top:0; padding-top:0}

	#nav .content li.link {width:50% !important; padding:8px 0 0 !important}



	#nav .content li.icon a {position:relative; text-align: center}

	#nav .content li.icon a span {font-size:16px !important; width:100%; font-weight:bold}

	#nav .content li.icon a img {height:48px !important; opacity:.1}

  

  #nav .content li a {text-align: center !important}



	

	#quotebuttonBottom {width:90%; max-width:275px}

	

	#serviceTypes li {width:48%; padding-left:7px}

}

@media screen and (max-width: 480px){

  #contact_form div {display:block; width:99%}

	#nav .content li.link {width:100% !important; padding:8px 0 0 !important}

  #panoHelper {top: 84% !important; }

}







#panoHelper {width: 100%; display:none !important; position: absolute; top: 50%; z-index: 999; text-align: center; transform: translate(50%, -50%); right: 50%;}

#panoHelper div {background-color: rgb(52 50 48 / 90%); background: rgba(52,50, 48, 0.7);  color: #FFF; padding: 18px 28px; margin: 0 0 0 auto; z-index: 720; border-radius: 18px;}

#panoHelper p {color:#FFF; text-align: left}

p#pawList {font-size: 16px; margin: 0 18px 18px 18px; color:#FFFFFF}

p#pawList i {display:inline-block; margin-right: 12px; color:#bdbdbb}



#panoHelper p i {font-size:28px}

#panoHelper p i#down {font-size:38px; display: block; margin: 15px 0 10px}

#panoHelper p em {font-weight: bold; }



#panoHelperWide {display: block; max-width: 700px}

#panoHelperMobile {display: none; width:calc(100% - 32px); max-width: 700px; padding: 16px !important;}



#panoHelperMobile h2 {font-size: 30px; color: #a9d2f0 !important; font-weight: bold;}

#panoHelperMobile h3 {font-size: 20px; color: #bdbdbb !important; margin: 9px 0 1px 0; display:none !important}



@media screen and (max-width:1024px){

  #panoHelperWide {display: none}

  #panoHelperMobile {display: block; margin: 0 auto !important; width: 90%;}

  #panoHelperMobile p#pawList {margin:2px 6px 10px 9px; white-space: normal;}

  #panoHelperMobile p#pawList i {margin-top:6px} 

  

  #panoHelperClose {font-size: 36px; color: #41590e; background: #FFF; border-radius: 100%; padding: 3px; top: -20px; position: relative; display:inline-block !important}

  

  #header #logo {width:50%}

  #header:not(.smallheader) #contactbar a {padding: 2px 6px 2px 0px; margin: 5px !important; width: calc(47% - 23px); display: inline-block; text-align: center;}
  
  #header.smallheader #contactbar a {width: calc(21% - 3px) !important;}
  #header.smallheader #contactbar a span {font-size: 12px !important;}

  #header #logo a img#logoLogo {display: block; max-width: 420px; margin: 0 auto; }

  

  

  .skdslider .slide-desc {right: 50%; position: absolute; top: 45%; transform: translate(50%, 0%); width: 80%; max-width: 400px}

  .skdslider .slide-inner a {padding: 40px 8px; border-radius: 18px; border: 4px solid #41590e !important;}

  

  

}



@media screen and (max-width:768px){

  #panoPattern {width:80vw; height: 50% !important}

  #panoHeader div {font-size: 24px !important}

  #panoHeader div.subheader {font-size:18px !important}



  #fieldBlock {display:none !important}

  

  #pagesList a {width: calc(100% - 16px); display: block; height: 24vh; margin: 8px auto; overflow: hidden; max-height: 160px;}

  #pagesList a img {background-size: cover; background-position: center center;}

  

  #basebase .content {width:97%}

  #basebase #footerPages, #basebase #footerSocials {width: 100%;}
#basebase ul li * { font-size: 18px; text-transform: uppercase; text-align: center;}
  

  #basebase ul li {display: inline-block; line-height: 2em; width: 48%;}

  

  #container {background: #FFF !important}

}





