.searchPop * {
  box-sizing: border-box;
}

.searchPop .mobile-filters-btn,
.searchPop .apply-filters {
  display: none;
}

.searchPop html,
.searchPop body,
.searchPop div,
.searchPop span,
.searchPop applet,
.searchPop object,
.searchPop iframe,
.searchPop h1, .searchPop h2, .searchPop h3, .searchPop h4, .searchPop h5, .searchPop h6, .searchPop p,
.searchPop blockquote, .searchPop pre,
.searchPop a, .searchPop abbr, .searchPop acronym, .searchPop address,
.searchPop big, .searchPop cite, .searchPop code,
.searchPop del, .searchPop dfn, .searchPop em, .searchPop img, .searchPop ins,
.searchPop kbd, .searchPop q, .searchPop s, .searchPop samp,
.searchPop small, .searchPop strike, .searchPop strong, .searchPop sub, 
.searchPop sup, .searchPop tt, .searchPop var,
.searchPop b, .searchPop u, .searchPop i, .searchPop center,
.searchPop dl, .searchPop dt, .searchPop dd, .searchPop ol, .searchPop ul, .searchPop li,
.searchPop fieldset, .searchPop form, .searchPop label, .searchPop legend,
.searchPop table, .searchPop caption, .searchPop tbody, .searchPop tfoot, .searchPop thead, .searchPop tr, .searchPop th, .searchPop td,
.searchPop article, .searchPop aside, .searchPop canvas, .searchPop details, .searchPop embed, 
.searchPop figure, .searchPop figcaption, .searchPop footer, .searchPop header, .searchPop hgroup, 
.searchPop menu, .searchPop nav, .searchPop output, .searchPop ruby, .searchPop section, .searchPop summary,
.searchPop time, .searchPop mark, .searchPop audio, .searchPop video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
.searchPop article, .searchPop aside, .searchPop details, .searchPop figcaption, .searchPop figure, 
.searchPop footer, .searchPop header, .searchPop hgroup, .searchPop menu, .searchPop nav, .searchPop section {
  display: block;
}
html.noscroll,
body.noscroll {
  position: fixed;
  overflow:hidden !important;
  width:100%;
}
.searchPop body {
  line-height: 1;
}
.searchPop ol, .searchPop ul {
  list-style: none;
}
.searchPop table {
  border-collapse: collapse;
  border-spacing: 0;
}

.searchPop em {
  font-weight: bold;
}
.overlay {
    display:block;
    visibility: hidden;
    opacity:0;
    position: fixed;
    z-index: 999;
    top: 36px;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.7);
}
.searchPop {
    display:block;
    visibility:hidden;
    opacity:0;
    position: fixed;
    top: 0;
    z-index: -1;
    width: calc(100% - 40px);
    height: 5px;
    background: #EFEFEF;
    margin: 20px;
    font-family: 'Roboto', sans-serif;
}
.overlay, .searchPop {
  display:block;
  -webkit-transition: all .5s ease;
  -moz-transition: all .5s ease;
  -o-transition: all .5s ease;
  transition: all .5s ease;
  opacity: 0;
  height: calc(100% - 40px);
}
.searchPop.active {
  visibility: visible;
  opacity: 1;
  overflow:hidden;
  z-index: 9999;
}
.overlay.active {
  visibility: visible;
  opacity:1;
}
.searchPop .header {
    background-color: #017D47;
    font-family: 'Roboto', sans-serif;
    float: left;
    width: 100%;
}

.searchPop .search-logo {
    height: 70px;
    background-image: url(https://luminous-landscape.com/wp-content/themes/luminous-landscape/assets/images/lula-logo-tagline.svg);
    background-repeat: no-repeat;
    padding: 15px;
    background-size: calc(100% - 40px);
    background-position: 20px center;
    width: calc(25% - 16px);
    margin: 10px 0 10px 10px;
}

.searchPop .fa.fa-times {
  font-size:2em;
  color:#fff;
  cursor:pointer;
  position: absolute;
  top: 30px;
  right: 25px;
}
.fa.fa-search {
  font-size:2em;
  color:#666;
  padding:8px 0;
  cursor:pointer;
}
.searchPop .section-title {
  border-bottom: solid 1px #979797;
  font-size: 1.2rem;
  padding: 5px 0;
  margin-bottom: 10px;
  color: #979797;
  font-family: 'Roboto Condensed', sans-serif;
  font-weight: 300;
}

.wVid {
  background-image:url(../assets/images/video-loading.png);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}

.searchPop #sort-by-wrapper,
.searchPop #stats {
  float: right;
}

.searchPop #stats {
  font-size: .7rem;
  color: #5A5A5A;
  line-height: 2.2rem;
  padding-right: 10px;
}

.searchPop #search-input {
  position: absolute;
  left: calc(25% + 10px);
  top: 25px;
}

.searchPop #search-input input {
  padding: 10px 20px;
  width: 300px;
  border: none;
}

.searchPop #search-input input:focus {
  outline: none;
  box-shadow: 0 0 5px rgba(0,0,0,.5);
}

.searchPop .left-column {
  width: calc(25% - 16px);
  float: left;
  background: #fff;
  padding: 20px;
  height: calc(100vh - 148px);
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
  margin: 10px 0 10px 10px;
  border: solid 1px #CCCCCC;
}

.searchPop .filter-title {
  color: #017D47;
  font-size: .8rem;
}

.searchPop .filter-title i {
  font-size: .6rem;
}

.searchPop .ais-menu--link {
  text-decoration: none;
  color: #5a5a5a;
}

.searchPop .ais-refinement-list,
.searchPop .ais-range-slider {
  margin-top: 30px;
}

.searchPop .ais-range-slider--body {
  width: 80%;
  margin-left: 20px;
  padding:15px 0;
}

.searchPop .ais-range-slider--handle {
  border:1px solid #5A5A5A;
}

.searchPop .ais-range-slider--connect {
  background:#5A5A5A;
}

.searchPop .ais-range-slider--tooltip {
  left: -14px;
}

.searchPop .ais-refinement-list--list {
  margin: 7px 0 10px;
}

.searchPop .ais-refinement-list--item  {
  font-size: .8rem;
  padding: 5px;
  text-transform: capitalize;
  position: relative;
  max-width: calc(100% - 75px);
}

.searchPop .ais-refinement-list--label {
  // width: 100%;
 
}

.searchPop .ais-refinement-list--label input {
  display: none;
}

.searchPop .ais-refinement-list--item__active {
  background-color: #ccc;
}

.searchPop .ais-refinement-list--count {
  position:absolute;
  right: -75px;
  top: 4px;
  color: #fff;
  padding: 3px 10px;
  background: #5A5A5A;
  border-radius: 20px;
  text-align: center;
  font-size: .6rem;
}

.searchPop .ais-menu--count {
  text-decoration: none;
}

.searchPop .ais-show-more {
  display: block;
  text-align: center;
  font-size: .7rem;
  margin-top: 15px;
}

.searchPop .ais-show-more__inactive:before {
  content: '+ '
}

.searchPop .ais-show-more__active:before {
  content: '- '
}

.searchPop .featured-image {
  float: left;
  width: 75px;
  margin-right: 10px;
}

.searchPop .ais-hits--item {
  float: left;
  width: 100%;
  clear: both;
  margin: 10px 0;
}

.searchPop #center-column {
  width: calc(50% - 16px);
  float: left;
  margin: 10px 0 10px 10px;
  background: #fff;
  border: solid 1px #CCCCCC;
  padding: 20px;
  height: calc(100vh - 148px);
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
}

.searchPop .ais-sort-by-selector {
  padding:0;
}

.searchPop .hit {
  position: relative;
}

.searchPop .hit-title {
  max-width: calc(100% - 150px);
  margin-bottom: 5px;
}

.searchPop .hit-title a {
  font-family: 'Roboto Condensed', sans-serif;
  color: #5A5A5A;
  text-decoration: none;
  font-weight: 700;
}

.searchPop .hit-date {
  margin-bottom: 5px;
  font-size: .6rem;
}

.searchPop .hit-type {
  font-size: .6rem;
  position: absolute;
  right: 10px;
  top: 0px;
  text-transform: capitalize;
  background-color: #5A5A5A;
  color: #fff;
  padding: 5px 15px;
  border-radius: 100px;
}

.searchPop .hit-type i:before {
  content: "\f1ea";
  margin-right: 5px;
}

.searchPop .hit-type.video {
  background-color: #017D47;
}

.searchPop .hit-type i.fa-video:before,
.searchPop .hit-type i.fa-course:before {
  content: "\f04b";
}

.searchPop .hit-type.course {
  background-color: #017D47;
}

.searchPop .hit-type.rantatorial {
  background-color: #F3C328;
}

.searchPop .hit-type i.fa-rantatorial:before {
  content: "\f075";
}

.searchPop .hit-content{
  font-family: 'Roboto Condensed', sans-serif;
  color: #5A5A5A;
  font-size: .8rem;
  line-height: 1.4;
}

.searchPop .ais-pagination--item a {
  color: #5a5a5a;
  padding: 10px 13px;
  border: solid 1px #979797;
  background-color: #EFEFEF;
  text-decoration: none;
  font-size: .7rem;
  display: inline-block;
}

.searchPop .ais-pagination--item__active a,
.searchPop .ais-pagination--item a:hover {
  border: solid 1px #5a5a5a;
  background-color: #ddd;
}

.searchPop #right-column {
  width: calc(25% - 13px);
  height: calc(100vh - 148px);
  float: left;
  margin: 10px;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
}

.searchPop #right-column img {
  width: 100%;
  margin-bottom: 20px;
}

.searchPop .capitalize {
    text-transform: capitalize;
}

.searchPop .ais-range-slider--tooltip {
    position: absolute;
    background: #FFF;
    top: 30px;
    font-size: .7em;
    width: 60px;
}

@media screen and (max-width: 768px) {
  .searchPop {
    padding: 0;
    margin: 0;
    height: 100%;
    width: 100%;
  }
  .searchPop .mobile-filters-btn {
    display: block;
  }
  .searchPop .header {
    padding: 40px 0 0;
    margin: 0;
    background-color: transparent;
  }

  .searchPop .search-logo {
    display: none;
  }
  .searchPop #search-input {
    position: relative;
    text-align: center;
    left: inherit;
    top: inherit;
  }

  .searchPop #search-input input {
    width: 100%;
  }

  .searchPop .left-column {
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    width: calc(100% - 20px);
    left: -1000px;
    position: absolute;
    z-index: 9;
  }
  .searchPop .left-column.active {
    left: 0;
    bottom: 6px;
  }

  .searchPop #center-column {
    width: calc(100% - 20px);
  }

  .searchPop .fa.fa-times,
  .searchPop .fa.fa-filter {
    top: 0;
    right: 0;
    padding: 10px;
    background: #017D47;
    color: #fff;
    position: absolute;
    font-size: 20px;
  }

  .searchPop .fa.fa-filter {
    left: 0;
  }

  .searchPop #right-column {
    display: none;
  }
  .searchPop .apply-filters {
    color: #fff;
    text-align: center;
    background: #017D47;
    padding: 10px;
    display: none;
  }

  .searchPop .apply-filters.active {
    display: block;
  }

}