:root {
    --search-icon: url("data:image/svg+xml,%3Csvg width='64' height='64' version='1.1' viewBox='0 0 64 64' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m0 0h64v64h-64z' fill='none' stroke-width='2.67'/%3E%3Cpath d='m41.3 37.3h-2.11l-0.747-0.72c2.61-3.04 4.19-6.99 4.19-11.3 0-9.57-7.76-17.3-17.3-17.3-9.57 0-17.3 7.76-17.3 17.3 0 9.57 7.76 17.3 17.3 17.3 4.29 0 8.24-1.57 11.3-4.19l0.72 0.747v2.11l13.3 13.3 3.97-3.97zm-16 0c-6.64 0-12-5.36-12-12s5.36-12 12-12 12 5.36 12 12-5.36 12-12 12z' stroke-width='2.67'/%3E%3C/svg%3E");
    
    --reset-icon: url("data:image/svg+xml,%3Csvg width='64' height='64' enable-background='new 0 0 24 24' version='1.1' viewBox='0 0 64 64' xmlns='http://www.w3.org/2000/svg'%3E%3Cg transform='scale(1.33)' stroke-width='2.01' aria-label='Reset'%3E%3Cpath d='m0 0h48.1v48.1h-48.1z' fill='none'/%3E%3Cpath d='m24.1 10v-4.51l-8.02 6.52 8.02 6.52v-4.51c6.64 0 12 5.39 12 12 0 5.95-4.35 10.9-10 11.8v4.05c7.92-0.982 14-7.72 14-15.9 0-8.86-7.18-16-16-16z'/%3E%3Cpath d='m12 26.1c0-3.31 1.34-6.32 3.53-8.5l-2.85-2.85c-2.89 2.91-4.69 6.92-4.69 11.3 0 8.18 6.12 14.9 14 15.9v-4.05c-5.67-0.962-10-5.89-10-11.8z'/%3E%3C/g%3E%3C/svg%3E");

    --map-marker-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath d='M172.268 501.67C26.97 291.031 0 269.413 0 192 0 85.961 85.961 0 192 0s192 85.961 192 192c0 77.413-26.97 99.031-172.268 309.67-9.535 13.774-29.93 13.773-39.464 0zM192 272c44.183 0 80-35.817 80-80s-35.817-80-80-80-80 35.817-80 80 35.817 80 80 80z'/%3E%3C/svg%3E");
}

    #map-container {
        opacity: 0;
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background-color: rgba(0,0,0,0.25);
        padding: 20px;
        z-index: -1;
    }
    #map-container > .container {
        background-color: #ffffff;
        height: 100%;
    }
    #map-container.show {
        display: block;
        z-index: 99999;
        opacity: 1;
    }
    
    #map-container.show .leaflet-map-pane {
        transform: translatey(20px);
    }
    
    @media (min-width: 1200px) {
    	#map-container .theme-sidebar {
    		width: 400px;
    	}
    	#map-container .theme-main {
    		width: calc(100% - 400px);
    	}
    }
    
    .map-close {
      position: absolute;
      top: -32px;
      right: -18px;
      width: 36px;
      height: 36px;
      cursor: pointer;
      z-index: 100040;
      background-image: url(/wp-content/plugins/easy-fancybox/fancybox/2.2.0/fancybox_sprite@2x.png);
      background-size: 44px 152px;
    }

@media (min-width: 769px) {
    #map-container > .container {
		max-width: calc(100% - 60px);
    }

    #map-container #map {
        height: 720px;
        max-height: 100%;
    }
    #map-container .theme-sidebar {
        overflow: scroll;
        height: 720px;
        max-height: 100%;
    }
 
    .listing {
        max-width: 800px;
        width: 100%;
    }
    
    #listing > .listing {
        max-width: 100%;
    }
}

@media (max-width: 768px) {
    #map-container > .container {
		max-width: 100%;
    }

    #map-container .row {
        display: flex;
        flex-direction: column;
    }
    #map-container .theme-main {
        order: 1;
        flex-basis: calc(100% - 200px);
    }
    #map-container .theme-sidebar {
        overflow: scroll;
        height: 200px !important;
        flex-basis: 200px;
        order: 2;
    }
    
    .listing {
        display: flex;
        flex-direction: column;
        width: 100%;
    }
    
    .listing-details {
        width: 100%;
    }
    
    .listing-content {
        width: 100%;
        margin-left: 0;
        float: none;
    }
}


    .leaflet-overlay-pane {
        filter: grayscale(25%);
    }

    .leaflet-touch .leaflet-bar a {
        width: 44px;
        height: 44px;
        line-height: 44px;
    }
    .leaflet-touch .leaflet-control-zoom-in, .leaflet-touch .leaflet-control-zoom-out {
        font-size: 30px;
    }
    .leaflet-control-locate a .leaflet-control-locate-location-arrow {
        width: 20px;
        height: 20px;
        margin: 13px;
    }
    .leaflet-touch .geocoder-control {
        width: 48px;
        height: 48px;
    }
    .leaflet-touch .reset-control > a {
        background-position: center;
        background-size: 32px;
        background-image: var(--reset-icon);
    }
    .leaflet-touch .geocoder-control-input {
        height: 48px;
        line-height: 48px;
        background-position: center center;
        background-repeat: no-repeat;
        background-size: 32px;
        background-image: var(--search-icon);
    }
    .leaflet-touch .geocoder-control-input:focus {
        background-position: center right;
    }
    .leaflet-touch .leaflet-control-layers.leaflet-control-layers-expanded {
        background: rgba(255,255,255,0);
        border: 2px solid rgba(0,0,0,0.2);
        padding: 0;
        width: 220px;
    }
    
    .leaflet-touch .leaflet-control-layers.leaflet-control-layers-expanded .leaflet-control-layers-list {
        background: rgba(255,255,255,0.8);
        padding: 6px 5px 6px 10px;
    }
    
    .leaflet-touch .leaflet-control-layers.leaflet-control-layers-expanded .leaflet-control-layers-list small {
        display: block;
        font-size: 12px;
        margin-left: 49px;
    }

    .leaflet-touch .leaflet-bar.info-control {
        border-top: 0;
        border-radius: 0 0 5px 5px;
        font: 16px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
        margin-top: 0;
        width: 220px;
    }
    
    .leaflet-touch .leaflet-bar.info-control a,
    .leaflet-touch .leaflet-bar.info-control a:hover {
        background: rgba(255,255,255,0.8);
        text-decoration: underline;
        width: 100%;
    }

    .leaflet-popup-content h4 {
        margin: 0;
    }
    .leaflet-popup-content p {
        margin-top: 0;
    }
    .legend {
        text-align: left;
        line-height: 18px;
        color: #555;
    }
    .legend i {
        width: 18px;
        height: 18px;
        float: left;
        margin-right: 8px;
        opacity: 0.7;
    }
    
    .leaflet-div-icon {
        background: transparent;
        border: 0;
    }
    .region-label {
        font-size:20px;
        text-shadow: 0 0 12px #fff, 0 0 12px #fff;
        white-space: nowrap;
    }
    .marker-cluster-large,
    .marker-cluster-medium,
    .marker-cluster-small {
        background-color: rgba(241, 211, 87, 0.6);
    }
    .marker-cluster-large div,
    .marker-cluster-medium div,
    .marker-cluster-small div {
        background-color: rgba(240, 194, 12, 0.6);
    }
    .leaflet-control-layers-overlays {
        font: 16px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
    }
    .leaflet-control-locate a .leaflet-control-locate-location-arrow {
        -webkit-mask-image: var(--map-marker-icon);
        mask-image: var(--map-marker-icon);
        width: 28px;
        height: 28px;
        margin: 8px;
    }
    
    input[type="checkbox"], input[type="radio"] {
        height: 1.4rem;
        width: 1.4rem;
    }


.view-listing {
    cursor: pointer;
}

@-webkit-keyframes bounce {
 0%,
 100% {
  top:inherit
 }
 20%,
 80% {
  top:-0.4em
 }
 40%,
 60% {
  top:-0.8em
 }
 50% {
  top:-1.0em
 }
}
@-moz-keyframes bounce {
 0%,
 100% {
  top:inherit
 }
 20%,
 80% {
  top:-0.4em
 }
 40%,
 60% {
  top:-0.8em
 }
 50% {
  top:-1.0em
 }
}
@keyframes bounce {
 0%,
 100% {
  top:inherit
 }
 20%,
 80% {
  top:-0.4em
 }
 40%,
 60% {
  top:-0.8em
 }
 50% {
  top:-1.0em
 }
}
.marker-bounce {
 -webkit-animation:bounce .6s infinite;
 -moz-animation:bounce .6s infinite;
 -o-animation:bounce .6s infinite;
 animation:bounce .6s infinite
}

#show-map {
    width: 200px;
    height: 48px;
    border-radius: 4px;
    border: 1px solid #000000;
    background-image: url(/wp-content/uploads/map_bg.jpg);
    background-size: cover;
    float: right;
    display: none;
}
#show-map.show {
    display: block;
}

#show-map > span {
    background: #ffffff;
    padding: 10px 20px;
    border-radius: 4px;
    border: 1px solid #000000;
    font-weight: 900;
    color: #000000; 
}

.search-error {
    font-size: 16px;
}

.listing-content table {
    margin-top: 20px;
}

#banner-container img {
    width: 100%;
}