.map { position: relative; top: 0; bottom: 0; width: 100%; height: 550px; } .listings { max-height: 480px; overflow: auto; } .listings a { color: #000000; text-decoration: none; } .listings a:hover { color: #101010; } .listings .item { display: block; border-bottom: 1px solid #eee; padding: 10px; text-decoration: none; } .listings .item:last-child { border-bottom: none; } .listings .item .title { display: block; color: #000000; } .listings .item .title small { font-weight: 400; } .listings .item.active .title, .listings .item .title:hover { color: #6d6a6a; } .listings .item.active { background-color: #f8f8f8; } .marker { border: none; cursor: pointer; height: 60px; width: 40px; } .marker.yetkili-satici { background-image: url('/asset/images/ystc.webp'); } .marker.yetkili-servis { background-image: url('/asset/images/ysrv.webp'); } /* Marker tweaks */ .mapboxgl-popup { padding-bottom: 60px; max-width: 300px !important; } .mapboxgl-popup-close-button { display: none; } .mapboxgl-popup-content { padding: 0; width: 300px; } .mapboxgl-popup-content div { padding: 10px; } .mapboxgl-popup-anchor-top > .mapboxgl-popup-tip { border-bottom-color: #c2c6c9; } .mapboxgl-popup-anchor-bottom > .mapboxgl-popup-tip{ border-top-color: #c2c6c9; } @media (max-width: 575px) { .listings { max-height: 200px; } .map { height: 400px; } }