@charset "UTF-8";
/* CSS Document */

/*
MAP
*/
#brooklyn-map {
    background: #2A3030;
    position: relative;
    z-index: 23;
}

.map-container {
    min-height: 50vh;
    height: 50vh;
    width: 100%;
    position: relative;
    z-index: 31;
}

#map {
  width: 100%;
  min-height: 50vh;
  height: 50vh;
}

@media(min-width: 576px){
    .map-container {
        min-height: calc(100vh - 109px);
        height: calc(100vh - 109px);
        width: 100%;
        position: relative;
        z-index: 31;
    }

    #map {
      width: 100%;
      min-height: calc(100vh - 109px);
      height: calc(100vh - 109px);
    }
}

.mapboxgl-popup-content {    
    padding: 15px 20px 15px 20px !important;
}

.mapboxgl-popup-close-button {
    color: #000 !important;
    background-color: transparent !important;
    padding: 2px 5px 0 0 !important;
    font-size: 14px !important;
    border: none !important;
    outline: none !important;
}

.mapboxgl-popup-close-button:focus-visible,.mapboxgl-popup-close-button:focus{
    border:none !important;
    outline: none !important;
}

.popup p {
    color: #000;
    font-family:"Ghino-Book";
    font-size: 13px;
    line-height: 16px;
}

[type="button"], [type="reset"], [type="submit"], button {
	-webkit-appearance: none;
}

[type="button"]:focus-visible {
    border: none !important;
    outline: none !important;
}

#legend {
    color: #fff;
    padding: 20px;
}

#legend ol {
    font-size: 13px;
    margin: 0 20px 0 34px;
    padding: 0;
}

.accordion-item {
	color: #fff;
	background-color: transparent;
	border: none;
}

.accordion-item:first-of-type .accordion-button {
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}

#legend h1{
    cursor: pointer;
    font-size: 16px;
    margin: 0;
}

#legend h1::before{
    content: '';
    position: absolute;
    left: 0;
    top:15px;
    height: 12px;
    width: 12px;
    border: 1px solid #fff;
    background: #fff;
}

#legend h1.bullet-1::before{
    background: #00a9ff;
}

#legend h1.bullet-2::before{
    background: #000;
}

#legend h1.bullet-3::before{
    background: #df6d36;
}

#legend h1.bullet-4::before{
    background: #008748;
}

#legend h1.bullet-5::before{
    background: #ccc;
}

.accordion-button {
	position: relative;
	display: flex;
	align-items: center;
	width: 100%;
	padding: 10px 20px 10px 20px;
	font-size: 16px;
	color: #fff;
	text-align: left;
	background-color: transparent;
	border: 0;
	border-radius: 0;
    line-height: 1;
	overflow-anchor: none;
    text-transform: uppercase;
	transition: var(--bs-accordion-transition);
}

.accordion-button:not(.collapsed) {
	color: #fff;
	background-color: transparent;
	box-shadow: 0 0 0 0 transparent;
}

.accordion-button:not(.collapsed)::after {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e");
	transform: var(--bs-accordion-btn-icon-transform);
}

.accordion-button::after {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e");
}

#legend li {
    cursor: pointer;
    transition: all .25s ease-in-out;
}

#legend li:hover {
    opacity: .5;
}

#legend li.selected {
    
    font-family:"Ghino-Bold";
}