/*CSS From page*/
#map-cont{
    height: 100%;
}
#Map{
    /*position:absolute;*/
    z-index:1;
    width:100%; height:100%;
    top:0; bottom:0;
    margin: 0px; 
    padding: 0px;
    border: 1px solid !important;
}

.ol-popup {
    position: absolute;
    background-color: white;
    -webkit-filter: drop-shadow(0 1px 4px rgba(0,0,0,0.2));
    filter: drop-shadow(0 1px 4px rgba(0,0,0,0.2));
    padding: 15px;
    border-radius: 10px;
    border: 1px solid #cccccc;
    bottom: -10px;
    left: -50px;
}
.ol-popup:after, .ol-popup:before {
    top: 100%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}
.ol-popup:after {
    border-top-color: white;
    border-width: 10px;
    left: 48px;
    margin-left: -10px;
}
.ol-popup:before {
    border-top-color: #cccccc;
    border-width: 11px;
    left: 48px;
    margin-left: -11px;
}
.ol-popup-content {
    position: relative;
    min-width: 250px;
    height: 100%;
    max-height: 250px;
    padding:2px;
    white-space: normal;        
    /*background-color: #f7f7f9;
    border: 1px solid #e1e1e8;*/
    overflow-y: auto;
    overflow-x: hidden;
}
.ol-popup-content p{
    font-size: 14px;
    padding: 2px 4px;
    color: #222;
    margin-bottom: 15px;
}
.ol-popup-content p a{
    font-size: 14px;
    padding: 2px 4px;
    color: #222;
    margin-bottom: 15px;
}
.ol-popup-closer {
    position: absolute;
    top: 5px;
    right: 10px;
    font-size: 100%;
    color: #0088cc;
    text-decoration: none;
}
a.ol-popup-closer:hover{
    color: #005580;
    text-decoration: underline;
}

/*.ol-overlay-container{
    top:106px !important;
}*/
.txt-heading a{
    font-size: 18px;
    font-weight: bold;
    color: #f35151;
}
.txt-details{
    font-size: 12px;
    color: #444343;
    padding: 5px;
}
.ol-attribution{
    display: none !important;
}


.autocomplete-items {
  top: auto;
}

.img-map-icon{
    width: 18px;
    margin-top: -3px;
}

/*ends*/

.findmap-menu{margin-bottom: 15px; }
.map-data{ border: 1px solid #ccc; border-radius: 4px;overflow: hidden;}
.map-data a{color: #f84525;}
.map-data a:hover{color:1562a0;}
.list-view{width: 38%;float: left;padding: 20px 40px 20px 30px;}
.locationdata ul li{margin-bottom: 20px;}
.locationdata ul li:last-child{margin-bottom: 0px;}
.map-view{width: 62%; float: left;}
.locationdata .card .mapimg{height: 208px; overflow: hidden;}
.locationdata .card .mapimg img{height: auto; width: 100%; }
.locationdata .card h5{font-size: 1em; margin-bottom: 5px;}
.locationdata .card p{line-height: 20px;font-size: 0.9em;}
.locationdata .card{box-shadow: 0px 0px 2px #ccc;}
.slimScrollBar, .slimScrollRail{right: -23px !important;width: 7px !important;}
.slimScrollBar{height: 80px !important;background:#929292 !important; opacity: 1 !important;}
.slimScrollDiv{overflow: inherit !important;}
.mapview, .listview{float: left;padding: 5px 12px;}
.findmap-menu .scrtabs-tabs-fixed-container ul.nav-tabs{height: auto;}
.findmap-menu .navbar-expand-lg .navbar-nav .nav-link{/*padding: 6px 20px;*/position: relative;font-size: 0.9em;}
.findmap-menu .navbar-expand-lg .navbar-nav .nav-link.active{    background: #2778ba; color: #fff;}
.findmap-menu .navbar-expand-lg .navbar-nav .nav-link i{margin-right: 5px;}
.findmap-menu .navbar-expand-lg .navbar-nav .nav-link:hover{background: #2778ba;color: #fff;}
.findmap-menu .navbar-expand-lg .navbar-nav .nav-link:after{content: '|';position: absolute;right: -4px;}
.findmap-menu .navbar-expand-lg .navbar-nav .nav-link:last-child:after{display: none;}
.listview{display: none;}
#searchbar #sliding-panel-outer{ display: inline-block; overflow: hidden;position: absolute;top: 0;right: 0px; width: 100%; transition: width 0.4s ease; background: #fff}
#searchbar #sliding-panel-inner{width: 100%;}
#searchbar .search-label .fa-times,#searchbar.collapsed .search-label .fa-search{display: inline-block; padding: 9px 38px;}
.search-label{position: relative;z-index: 9;}
#searchbar .search-label .fa-search,#searchbar.collapsed .search-label .fa-times{ display: none;}
#searchbar.collapsed #sliding-panel-outer{ width: 0px;}
#search-box input[type="text"]{border: 1px solid #ccc;outline: 0; padding: 5px 10px;margin-right: 15px; width: 70%;}
.map-list-btn{width: 10%;float: left;}
.scrtabs-tab-container{width: 88%;float: right;border: 1px solid #ccc;padding: 0;margin: 0;border-radius: 4px;height: 36px;overflow: hidden;}
.scrtabs-tabs-fixed-container, .scrtabs-tab-container{}
.findmap .nav-tabs { border-bottom: 0px;}
.findmap .nav-tabs li a{padding: 5px 25px; display: block;}
.scrtabs-tabs-fixed-container ul.nav-tabs > li a.active{color: #fff;background: #2778ba;}
.search-map{margin: 30px 0px;}
/*Search Start*/
.search-input {
    position: relative;
    padding: 1rem 0 1.5rem 0;
    width: 100%;
}

.search-input input {
    border: none;
    border: 1px solid #ccc;
    display: block;
    font-size: 1rem;
    line-height: 1rem;
    margin: 0;
    width: 100%;
    text-align: left;
    background-color: transparent;
    color: black;
    border-radius: 4px;
    padding: 12px 44px 10px 20px;
    height: 45px;
}

.search-input input:focus {
    outline: none;
}

.search-input label {
    position: absolute;
    left: 5px;
    top: 27px;
    width: 100%;
    color: rgba(0, 0, 0, 0.3);
    font-size: 1rem;
    line-height: 1rem;
    font-weight: normal;
    pointer-events: none;
    transition: 0.2s ease all;
    -moz-transition: 0.2s ease all;
    -webkit-transition: 0.2s ease all;
    padding: 3px 8px;
    width: fit-content;
    background: #fff;
}

.search-input input:focus ~ label {
    top: 3px;
    font-size: 0.75rem;
    color: black;
}

.search-input label.not-empty {
    top: 0;
    font-size: 0.75rem;
}

.search-input span:nth-of-type(3) {
    position: absolute;
    color: black;
    left: 94%;
    top: 27px;
    font-size: 1rem;
    transition: 0.2s ease all;
    -moz-transition: 0.2s ease all;
    -webkit-transition: 0.2s ease all;
}

.search-input input:focus ~ span:nth-of-type(3) {
    left: 101%;
    top: 1.625rem;
    color: black;
    background: #2778ba;
    padding: 11px 17px;
    border-radius: 4px;
    top: 16px;
    height: 45px;
}
.search-input input:focus ~ span:nth-of-type(3) a, .search-input span:nth-of-type(3).not-empty a{color: #fff;}
.search-input span:nth-of-type(3).not-empty {
    left: 101% !important;
    top: 17px !important;
    color: black;
    background: #2778ba;
    padding: 11px 17px;
    border-radius: 4px;
    height: 45px;
}

.search-input span:nth-of-type(4) {
    left: 94%;
    position: absolute;
    color: red;
    right: 6%;
    top: 30px;
    font-size: 1rem;
    opacity: 0;
    transition: 0.2s ease all;
    -moz-transition: 0.2s ease all;
    -webkit-transition: 0.2s ease all;
}

.search-input input:focus ~ span:nth-of-type(4) {
    color: red;
    opacity: 1;
    cursor: pointer;
}

.search-input span:nth-of-type(4).not-empty {
    opacity: 1 !important;
}

.search-input .bar {
    display: none;
}

.search-input input:focus ~ .bar {
    opacity: 1;
    width: 100%;
    margin-left: 0;
}

/* Searh End*/
.map-list-btn .btn-outline-danger{color: #f84525;border-color: #f84525;}
.map-list-btn .btn-outline-danger:hover{background-color: #f84525; border-color: #f84525; color: #fff;}
    .searchwhere{font-size: 1.3em;color: #000000;}
    .searchwhere span{font-size: 1.1em;font-weight: 500;}
@media (max-width:768px){
    .list-view, .map-view{width: 100% !important; float: none;}
    .map-view{height: auto; overflow: auto;}
    .map-data{height: auto; overflow: auto;}
    .locationdetailsdiv, .slimScrollDiv{height: auto !important;}
    .list-view .slimScrollRail{display: none !important;}
    .list-view{padding: 20px 30px 20px 30px;}
    .findmap-menu .navbar {border: 0; border-radius: 0; float: right; position: static; }
    .findmap-menu .navbar-collapse{position: absolute; left: 0;right: 0; width: 100%;top: 50px; background: #fff;border: 1px solid #ccc; border-radius: 4px;}
    .findmap-menu { position: relative;}
    .findmap-menu .navbar-expand-lg .navbar-nav .nav-link{border-bottom: 1px solid #ccc;padding: 8px 20px;}
    .search-label{display: none;}
    #searchbar #sliding-panel-outer{position: relative; display: block !important;}
    #searchbar.collapsed #sliding-panel-outer {width: 100%;    padding-left: 20px;}
    #searchbar{width: 100%;}
    .map-list-btn{width:auto; float: none; margin-right: 0;    margin-bottom: 15px;display: flex;}
    .scrtabs-tab-container{width: 100%;float: none;border: 1px solid #ccc;padding: 0;margin: 0;border-radius: 4px;display: flex;}
    .scrtabs-js-tab-scroll-arrow-right{position: absolute; right: 16px;}
    .search-input input:focus ~ span:nth-of-type(3) { left: 90%;top: 66px;}
    .search-input span:nth-of-type(3).not-empty {left: 90% !important; top: 66px !important;}
    .findmap-menu .scrtabs-tab-scroll-arrow{top: 0px;}
    .findmap-menu .scrtabs-tab-scroll-arrow .fa-angle-left, .findmap-menu .scrtabs-tab-scroll-arrow .fa-angle-right{    display: table-cell;}
}
@media (max-width:425px){
    .search-input span:nth-of-type(3), .search-input span:nth-of-type(4) {left: 92%;}
}
@media (max-width:375px){
    .findmap-menu .navbar-collapse{top: 44px;}
    .search-input input:focus ~ span:nth-of-type(3) {left: 84%;}
}
@media (max-width:320px){
    #search-box input[type="text"]{width: 60%;}
    .search-input input:focus ~ span:nth-of-type(3) {left: 82%;}
}