/*------------------------------------*\ 
    #PAGES:SRP-LISTINGS-MAP (Search Results Page for Listings - Map View)
\*------------------------------------*/
/*
    Certain styles are needed to address an issue where you are able to scroll
    the map search page if you swipe with your finger starting on the header or
    sticky footer buttons (see Defect 201-00-819823). To address this issue...

    1.  We're basically disabling scrolling for mobile sizes on this page since
        you're not supposed to scroll the page anyway.
        a.  We usually try to follow Bootstrap's "mobile first" mentality, so
            mobile-size styles are declared first and followed by styles for
            other breakpoints. So, we need to undo some of these styles for
            non-mobile screen sizes.
*/
html, body {
  height: 100%;
  /* [1] */
  width: 100%;
  /* [1] */
  overflow: hidden;
  /* [1] */
}
@media (min-width: 768px) {
  html, body {
    height: auto;
    /* [1a] */
    width: auto;
    /* [1a] */
    overflow: auto;
    /* [1a] */
  }
}

html {
  margin: 0;
  /* [1] */
  padding: 0;
  /* [1] */
}

body {
  position: relative;
  /* [1] */
}
@media (min-width: 768px) {
  body {
    position: static;
    /* [1a] */
  }
}

/*
    NOTE: The following selectors have styles applied in the CDN and therefore
    shouldn't be changed:

    .interactive-map-body-container
    .list-display
    .map-display
*/
.interactive-map-body-container .list-display {
  width: 100%;
  z-index: 1029;
  /* Less than the header + search area but more than the map */
  /*.k-pager-wrap*/
}
@media (max-width: 767px) {
  .interactive-map-body-container .list-display.k-rpanel-expanded {
    height: -webkit-calc(100% - 67px - 40px);
    height: calc(100% - 67px - 40px);
  }
}
.interactive-map-body-container .list-display .interactive-map-pager {
  z-index: 1;
  /* Dropdowns inside pager might not display right without this */
  border: none;
  background-color: transparent;
  box-shadow: none;
}
@media (max-width: 1199px) {
  .interactive-map-body-container .list-display .interactive-map-pager.k-pager-wrap-breakpoint-md {
    display: inline-block;
    /* so that the pager can be centered nicely */
  }
  .interactive-map-body-container .list-display .interactive-map-pager.k-pager-wrap-breakpoint-md .k-pager-info {
    float: none;
    display: block;
    clear: both;
    text-align: center;
  }
}

@media (min-width: 768px) {
  .interactive-map-body-container .list-display, .search-options .options-left {
    width: 333px;
    /* One card wide on sm screens */
  }
}
@media (min-width: 1200px) {
  .interactive-map-body-container .list-display, .search-options .options-left {
    width: 666px;
    /* Two cards wide on large screens */
  }
}

@media (min-width: 768px) {
  .search-options .options-right {
    width: -webkit-calc(100% - 333px);
    width: calc(100% - 333px);
    left: 333px;
  }
}
@media (min-width: 1200px) {
  .search-options .options-right {
    width: -webkit-calc(100% - 666px);
    width: calc(100% - 666px);
    left: 666px;
  }
}

.map-bubble a, .map-bubble a:link, .map-bubble a:visited, .map-bubble a:active {
  color: #000;
  text-decoration: none;
}

.listing-bubble *, .map-key * {
  box-sizing: border-box;
  /* Everything inside map bubble body or map key is OK to have bootstrap box sizing */
}
/*# sourceMappingURL=srp-listings-map.css.map */
