.dbb-proximity-search { background-color:var(--contentGreen); color:#fff; padding: 2.2em 1.4em 3em; font-size: clamp(.65em,2vw,1em); margin-bottom: 2.6em;}
.dbb-proximity-search h4 { color:#fff; font-size: 1.7em; padding:0 0 40px 47px; }
.dbb-proximity-search h4::before { font-size:2em; font-weight:200; margin-right:.56em; }

.dbb-proximity-search .map { display: none;  }
.dbb-proximity-search .dbb-ps-input { display: flex;  }

.dbb-proximity-search .dbb-ps-input button { border: unset; background-color: #fff; width: 50px }
.dbb-proximity-search .dbb-ps-input button::before { content: '\f054'; color: var(--contentGreenDark); font: 1em var(--fontAwesome); }

@media (min-width: 768px) {
    .dbb-proximity-search { padding-bottom: 1.8em; margin-bottom: 0; }
    .dbb-proximity-search .map-wrap {display: grid; grid-template-columns: repeat(2,auto);}
    .dbb-proximity-search .map {display:block; height:600px; width:420px; grid-area: 1/1/2/2; }
    .dbb-proximity-search canvas { width: 60% !important; }
    .dbb-proximity-search .dbb-ps-search { grid-area: 1/1/2/-1; z-index: 1; justify-self: flex-end; width: 38.6%;}
    .dbb-proximity-search .dbb-ps-results { font-size: .8em; }
}

@media (min-width: 992px) {
    .dbb-proximity-search canvas { width: 76% !important; }
    .dbb-proximity-search .dbb-ps-results { font-size: .85em; }
}

@media (min-width: 1200px) {
    .dbb-proximity-search canvas { width: 100% !important; }
    .dbb-proximity-search .map { grid-column: unset}
    .dbb-proximity-search .dbb-ps-search { grid-area: unset; width: unset; margin-left: 15px; }
}
