@treely/strapi-slices 7.12.0 → 7.13.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (23) hide show
  1. package/dist/__mocks__/mapbox-gl.d.ts +11 -2
  2. package/dist/integrations/strapi/getPortfolioProjectsByBbox.d.ts +3 -0
  3. package/dist/models/fpm/FPMProject.d.ts +3 -0
  4. package/dist/slices/ProjectsMap/ProjectsMap.d.ts +1 -2
  5. package/dist/strapi-slices.cjs.development.js +479 -168
  6. package/dist/strapi-slices.cjs.development.js.map +1 -1
  7. package/dist/strapi-slices.cjs.production.min.js +1 -1
  8. package/dist/strapi-slices.cjs.production.min.js.map +1 -1
  9. package/dist/strapi-slices.esm.js +541 -231
  10. package/dist/strapi-slices.esm.js.map +1 -1
  11. package/package.json +2 -1
  12. package/src/components/SliceRenderer/SliceRenderer.tsx +0 -1
  13. package/src/integrations/strapi/getPortfolioProjectsByBbox.test.ts +82 -0
  14. package/src/integrations/strapi/getPortfolioProjectsByBbox.ts +86 -0
  15. package/src/models/fpm/FPMProject.ts +3 -0
  16. package/src/slices/ProjectsMap/ProjectsMap.stories.tsx +0 -48
  17. package/src/slices/ProjectsMap/ProjectsMap.test.tsx +111 -39
  18. package/src/slices/ProjectsMap/ProjectsMap.tsx +477 -91
  19. package/src/slices/TextWithCard/TextWithCard.stories.tsx +1 -0
  20. package/src/test/integrationMocks/fpmProjectMock.ts +1 -0
  21. package/dist/slices/ProjectsMap/MapMarker.d.ts +0 -12
  22. package/src/slices/ProjectsMap/MapMarker.test.tsx +0 -101
  23. package/src/slices/ProjectsMap/MapMarker.tsx +0 -102
package/dist/strapi-slices.cjs.development.js CHANGED
@@ -8,7 +8,7 @@ var axiosCacheInterceptor = require('axios-cache-interceptor');
8
8
  var React = require('react');
9
9
  var boemly = require('boemly');
10
10
  var Head = require('next/head');
11
- var Image = require('next/image');
11
+ var Image$1 = require('next/image');
12
12
  var reactUse = require('react-use');
13
13
  var react = require('@phosphor-icons/react');
14
14
  var Link = require('next/link');
@@ -20,7 +20,7 @@ var router = require('next/router');
20
20
  var styled = require('@emotion/styled');
21
21
  var framerMotion = require('framer-motion');
22
22
  var mapboxgl = require('mapbox-gl');
23
- var client = require('react-dom/client');
23
+ var debounce = require('lodash/debounce');
24
24
  var formik = require('formik');
25
25
  var useEmblaCarousel = require('embla-carousel-react');
26
26
  var AutoScroll = require('embla-carousel-auto-scroll');
@@ -32,10 +32,11 @@ var axios__default = /*#__PURE__*/_interopDefault(axios);
32
32
  var qs__default = /*#__PURE__*/_interopDefault(qs);
33
33
  var React__default = /*#__PURE__*/_interopDefault(React);
34
34
  var Head__default = /*#__PURE__*/_interopDefault(Head);
35
- var Image__default = /*#__PURE__*/_interopDefault(Image);
35
+ var Image__default = /*#__PURE__*/_interopDefault(Image$1);
36
36
  var Link__default = /*#__PURE__*/_interopDefault(Link);
37
37
  var styled__default = /*#__PURE__*/_interopDefault(styled);
38
38
  var mapboxgl__default = /*#__PURE__*/_interopDefault(mapboxgl);
39
+ var debounce__default = /*#__PURE__*/_interopDefault(debounce);
39
40
  var useEmblaCarousel__default = /*#__PURE__*/_interopDefault(useEmblaCarousel);
40
41
  var AutoScroll__default = /*#__PURE__*/_interopDefault(AutoScroll);
41
42
  var useSWRInfinite__default = /*#__PURE__*/_interopDefault(useSWRInfinite);
@@ -487,7 +488,7 @@ var fpmClient = /*#__PURE__*/axiosCacheInterceptor.setupCache(/*#__PURE__*/axios
487
488
  ttl: /*#__PURE__*/FPM_API_URI.includes('127.0.0.1') || /*#__PURE__*/FPM_API_URI.includes('localhost') ? 0 : 10 * 60 * 1000 // 10 minutes
488
489
  });
489
490
 
490
- var FALLBACK_LOCALE = 'en';
491
+ var FALLBACK_LOCALE$1 = 'en';
491
492
  var getPortfolioProjects = /*#__PURE__*/function () {
492
493
  var _ref = /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee(locale, preview) {
493
494
  var cache, params, _yield$Promise$all, fpmProjects, strapiProjectsLocalized, strapiProjectsEnglish, strapiProjects, _i, _arr, project;
@@ -515,7 +516,7 @@ var getPortfolioProjects = /*#__PURE__*/function () {
515
516
  cache: cache
516
517
  }), strapiClient.get('/projects', {
517
518
  params: _extends({}, params, {
518
- locale: FALLBACK_LOCALE
519
+ locale: FALLBACK_LOCALE$1
519
520
  }),
520
521
  cache: cache
521
522
  })]);
@@ -1320,8 +1321,8 @@ var openHubSpotChat = function openHubSpotChat() {
1320
1321
  }
1321
1322
  };
1322
1323
 
1323
- var _templateObject$9;
1324
- var GLOBAL_STYLE = /*#__PURE__*/react$1.css(_templateObject$9 || (_templateObject$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n :root {\n --default-hero-height: calc(100vh - var(--boemly-space-24));\n }\n\n a {\n text-decoration: none;\n }\n"])));
1324
+ var _templateObject$8;
1325
+ var GLOBAL_STYLE = /*#__PURE__*/react$1.css(_templateObject$8 || (_templateObject$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n :root {\n --default-hero-height: calc(100vh - var(--boemly-space-24));\n }\n\n a {\n text-decoration: none;\n }\n"])));
1325
1326
 
1326
1327
  var messagesDe$j = {
1327
1328
  'sections.comparison.backgroundShapes': 'Hintergrundformen'
@@ -2256,8 +2257,8 @@ var LogoGridWithText = function LogoGridWithText(_ref) {
2256
2257
  })))));
2257
2258
  };
2258
2259
 
2259
- var _templateObject$8, _templateObject2$5, _templateObject3$2, _templateObject4$1, _templateObject5;
2260
- var MapHeroContainer = /*#__PURE__*/styled__default.default(boemly.Box)(_templateObject$8 || (_templateObject$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n width: 100vw;\n height: var(--default-hero-height);\n min-height: var(--boemly-sizes-3xl);\n background-color: var(--boemly-colors-primary-50);\n overflow: hidden;\n z-index: var(--boemly-zIndices-base);\n\n @media screen and (max-width: ", ") {\n height: auto;\n }\n"])), BREAKPOINT_LG);
2260
+ var _templateObject$7, _templateObject2$5, _templateObject3$2, _templateObject4$1, _templateObject5;
2261
+ var MapHeroContainer = /*#__PURE__*/styled__default.default(boemly.Box)(_templateObject$7 || (_templateObject$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n width: 100vw;\n height: var(--default-hero-height);\n min-height: var(--boemly-sizes-3xl);\n background-color: var(--boemly-colors-primary-50);\n overflow: hidden;\n z-index: var(--boemly-zIndices-base);\n\n @media screen and (max-width: ", ") {\n height: auto;\n }\n"])), BREAKPOINT_LG);
2261
2262
  var MapHeroTextContainer = /*#__PURE__*/styled__default.default(boemly.Box)(_templateObject2$5 || (_templateObject2$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n width: 100vw;\n top: 56%;\n left: 0;\n transform: translateY(-50%);\n z-index: var(--boemly-zIndices-aboveBase);\n\n @media screen and (max-width: ", ") {\n position: relative;\n transform: unset;\n\n padding-top: var(--boemly-space-32);\n }\n"])), BREAKPOINT_LG);
2262
2263
  var ShapeContainer = /*#__PURE__*/styled__default.default(boemly.Box)(_templateObject3$2 || (_templateObject3$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: calc(var(--boemly-space-8) * -1);\n left: 0;\n\n width: var(--boemly-sizes-sm);\n height: var(--boemly-sizes-sm);\n\n border-top-right-radius: var(--boemly-radii-full);\n\n & span,\n div {\n border-top-right-radius: var(--boemly-radii-full);\n }\n\n @media screen and (max-width: ", ") {\n display: none;\n }\n"])), BREAKPOINT_LG);
2263
2264
  var MapContainer = /*#__PURE__*/styled__default.default(boemly.Box)(_templateObject4$1 || (_templateObject4$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n\n width: 50%;\n height: 100%;\n\n right: 0;\n top: 0;\n\n & img {\n object-fit: cover !important;\n }\n\n @media screen and (max-width: ", ") {\n width: 100%;\n height: var(--boemly-sizes-4xl);\n position: relative;\n margin-top: calc(var(--boemly-space-72) * -1);\n background-color: var(--boemly-colors-white);\n\n & img {\n object-fit: contain !important;\n }\n }\n"])), BREAKPOINT_LG);
@@ -2719,7 +2720,7 @@ var Steps = function Steps(_ref) {
2719
2720
  })))));
2720
2721
  };
2721
2722
 
2722
- var _oppositesOfCorners, _templateObject$7, _templateObject2$4;
2723
+ var _oppositesOfCorners, _templateObject$6, _templateObject2$4;
2723
2724
  var ShapePosition;
2724
2725
  (function (ShapePosition) {
2725
2726
  ShapePosition["topLeft"] = "top-left";
@@ -2822,7 +2823,7 @@ var TextCardGrid = function TextCardGrid(_ref) {
2822
2823
  borderBottomLeftRadius: oppositesOfCorners[variants[slice.variant].positionIcon(index)].includes('bottomLeft') ? 'full' : 'unset',
2823
2824
  borderTopRightRadius: oppositesOfCorners[variants[slice.variant].positionIcon(index)].includes('topRight') ? 'full' : 'unset',
2824
2825
  borderTopLeftRadius: oppositesOfCorners[variants[slice.variant].positionIcon(index)].includes('topLeft') ? 'full' : 'unset',
2825
- css: variants[slice.variant].positionIcon(index).includes('unset') ? react$1.css(_templateObject$7 || (_templateObject$7 = _taggedTemplateLiteralLoose(["\n & span,\n div,\n img {\n border-radius: var(--boemly-radii-xl);\n }\n "]))) : react$1.css(_templateObject2$4 || (_templateObject2$4 = _taggedTemplateLiteralLoose(["\n & span,\n div,\n img {\n border-", "-radius: var(--boemly-radii-full);\n }\n "])), oppositesOfCorners[variants[slice.variant].positionIcon(index)])
2826
+ css: variants[slice.variant].positionIcon(index).includes('unset') ? react$1.css(_templateObject$6 || (_templateObject$6 = _taggedTemplateLiteralLoose(["\n & span,\n div,\n img {\n border-radius: var(--boemly-radii-xl);\n }\n "]))) : react$1.css(_templateObject2$4 || (_templateObject2$4 = _taggedTemplateLiteralLoose(["\n & span,\n div,\n img {\n border-", "-radius: var(--boemly-radii-full);\n }\n "])), oppositesOfCorners[variants[slice.variant].positionIcon(index)])
2826
2827
  }, React__default.default.createElement(Image__default.default, {
2827
2828
  src: strapiMediaUrl(image.img, 'small'),
2828
2829
  alt: image.alt,
@@ -2871,8 +2872,8 @@ var TextCardGrid = function TextCardGrid(_ref) {
2871
2872
  }))));
2872
2873
  };
2873
2874
 
2874
- var _templateObject$6, _templateObject2$3, _templateObject3$1;
2875
- var CarouselContainer = /*#__PURE__*/styled__default.default(boemly.Box)(_templateObject$6 || (_templateObject$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: var(--boemly-space-6);\n padding: var(--boemly-space-8) 0;\n\n @media screen and (max-width: ", ") {\n margin-top: var(--boemly-space-4);\n width: var(--boemly-sizes-full);\n }\n\n width: var(--boemly-sizes-full);\n\n overflow-x: hidden;\n\n @media screen and (max-width: ", ") {\n overflow-x: scroll;\n }\n"])), BREAKPOINT_MD, BREAKPOINT_MD);
2875
+ var _templateObject$5, _templateObject2$3, _templateObject3$1;
2876
+ var CarouselContainer = /*#__PURE__*/styled__default.default(boemly.Box)(_templateObject$5 || (_templateObject$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: var(--boemly-space-6);\n padding: var(--boemly-space-8) 0;\n\n @media screen and (max-width: ", ") {\n margin-top: var(--boemly-space-4);\n width: var(--boemly-sizes-full);\n }\n\n width: var(--boemly-sizes-full);\n\n overflow-x: hidden;\n\n @media screen and (max-width: ", ") {\n overflow-x: scroll;\n }\n"])), BREAKPOINT_MD, BREAKPOINT_MD);
2876
2877
  var CarouselInnerContainer$1 = /*#__PURE__*/styled__default.default(framerMotion.motion.div)(_templateObject2$3 || (_templateObject2$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n gap: var(--boemly-space-6);\n justify-content: center;\n\n width: calc(\n (var(--boemly-sizes-sm) + var(--boemly-space-6)) *\n ", " +\n var(--boemly-space-6)\n );\n min-width: var(--boemly-sizes-full);\n\n @media screen and (max-width: ", ") {\n gap: var(--boemly-space-1);\n justify-content: flex-start;\n width: calc(\n (var(--boemly-sizes-2xs) + var(--boemly-space-4)) *\n ", " +\n var(--boemly-space-6)\n );\n }\n"])), function (_ref) {
2877
2878
  var numberOfItems = _ref.numberOfItems;
2878
2879
  return numberOfItems;
@@ -3533,8 +3534,8 @@ var SmallHero = function SmallHero(_ref) {
3533
3534
  })))));
3534
3535
  };
3535
3536
 
3536
- var _templateObject$5, _templateObject2$2;
3537
- var BlogItemContainer = /*#__PURE__*/styled__default.default(boemly.Link)(_templateObject$5 || (_templateObject$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-decoration: none;\n\n & div img {\n transition: transform var(--default-ease) var(--medium-transition-duration);\n }\n\n &:hover {\n text-decoration: none;\n\n & > div:first-of-type img {\n transform: scale(1.03);\n }\n }\n"])));
3537
+ var _templateObject$4, _templateObject2$2;
3538
+ var BlogItemContainer = /*#__PURE__*/styled__default.default(boemly.Link)(_templateObject$4 || (_templateObject$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-decoration: none;\n\n & div img {\n transition: transform var(--default-ease) var(--medium-transition-duration);\n }\n\n &:hover {\n text-decoration: none;\n\n & > div:first-of-type img {\n transform: scale(1.03);\n }\n }\n"])));
3538
3539
  var ImageContainer$1 = /*#__PURE__*/styled__default.default(boemly.Box)(_templateObject2$2 || (_templateObject2$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n height: var(--boemly-sizes-xs);\n position: relative;\n border-radius: var(--boemly-radii-2xl);\n\n // Fixes the flickering of borders during animation in Safari\n -webkit-mask-image: -webkit-radial-gradient(white, black);\n\n & span,\n div {\n border-radius: var(--boemly-radii-2xl);\n }\n\n @media screen and (max-width: ", ") {\n height: var(--boemly-sizes-3xs);\n }\n"])), BREAKPOINT_MD);
3539
3540
 
3540
3541
  var Blog = function Blog(_ref) {
@@ -3652,166 +3653,478 @@ var MapBoxStyle;
3652
3653
  })(MapBoxStyle || (MapBoxStyle = {}));
3653
3654
  (process.env.NEXT_PUBLIC_MAPBOX_TILES_URL || 'http://localhost:8123') + "/vectortiles/v1/plots/{z}/{x}/{y}.mvt";
3654
3655
  var MAPBOX_MAX_ZOOM = 19;
3655
- var MAPBOX_INITIAL_ZOOM = 13;
3656
-
3657
- var mergeBoundingBoxes = function mergeBoundingBoxes(boundingBoxes) {
3658
- var minLeft = 180;
3659
- var minBottom = 90;
3660
- var maxRight = -180;
3661
- var maxTop = -90;
3662
- boundingBoxes.forEach(function (_ref) {
3663
- var left = _ref[0],
3664
- bottom = _ref[1],
3665
- right = _ref[2],
3666
- top = _ref[3];
3667
- if (left < minLeft) minLeft = left;
3668
- if (bottom < minBottom) minBottom = bottom;
3669
- if (right > maxRight) maxRight = right;
3670
- if (top > maxTop) maxTop = top;
3671
- });
3672
- return [minLeft, minBottom, maxRight, maxTop];
3673
- };
3674
-
3675
- var FONT_CUSTOMIZATIONS = {
3676
- body: 'Inter',
3677
- heading: 'Inter',
3678
- display: 'GintoNord',
3679
- mono: 'SpaceMono'
3680
- };
3681
3656
 
3682
- var MinimalProviders = function MinimalProviders(_ref) {
3683
- var children = _ref.children,
3684
- locale = _ref.locale;
3685
- return React__default.default.createElement(reactIntl.IntlProvider, {
3686
- messages: getMessages(locale),
3687
- locale: locale
3688
- }, React__default.default.createElement(boemly.BoemlyThemeProvider, {
3689
- fonts: FONT_CUSTOMIZATIONS
3690
- }, children));
3691
- };
3692
-
3693
- var MapMarker = function MapMarker(_ref) {
3694
- var title = _ref.title,
3695
- projectDeveloper = _ref.projectDeveloper,
3696
- slug = _ref.slug,
3697
- creditAvailability = _ref.creditAvailability,
3698
- _ref$portfolioHost = _ref.portfolioHost,
3699
- portfolioHost = _ref$portfolioHost === void 0 ? '' : _ref$portfolioHost,
3700
- _ref$isPublic = _ref.isPublic,
3701
- isPublic = _ref$isPublic === void 0 ? false : _ref$isPublic;
3702
- var _useContext = React.useContext(IntlContext),
3703
- formatMessage = _useContext.formatMessage;
3704
- var _useDisclosure = boemly.useDisclosure(),
3705
- isOpen = _useDisclosure.isOpen,
3706
- onOpen = _useDisclosure.onOpen,
3707
- onClose = _useDisclosure.onClose;
3708
- var blue600 = boemly.useToken('colors', 'blue.600');
3709
- return React__default.default.createElement(boemly.Flex, {
3710
- position: "absolute",
3711
- gap: "4",
3712
- onMouseEnter: onOpen,
3713
- onMouseLeave: onClose,
3714
- cursor: "grab"
3715
- }, React__default.default.createElement(boemly.Box, {
3716
- as: slug ? Link__default.default : undefined,
3717
- href: slug && portfolioHost + "/portfolio/" + slug
3718
- }, React__default.default.createElement(react.MapPin, {
3719
- size: "40px",
3720
- color: blue600,
3721
- weight: "fill",
3722
- "data-testid": "mapmarker-pin",
3723
- filter: "drop-shadow(0px 0px 2px #FFF)"
3724
- })), isPublic && isOpen && React__default.default.createElement(boemly.Container, {
3725
- shadow: "md",
3726
- width: "max-content",
3727
- minWidth: "3xs",
3728
- maxWidth: ['3xs', null, null, 'sm']
3729
- }, React__default.default.createElement(boemly.Flex, {
3730
- direction: "column"
3731
- }, React__default.default.createElement(CreditsAvailableBadge, {
3732
- status: creditAvailability,
3733
- href: slug && portfolioHost + "/portfolio/" + slug
3734
- }), React__default.default.createElement(boemly.Heading, {
3735
- mt: "3",
3736
- size: "md"
3737
- }, title), projectDeveloper && React__default.default.createElement(boemly.Text, {
3738
- size: "smLowNormal",
3739
- mt: "1"
3740
- }, projectDeveloper), slug && React__default.default.createElement(boemly.Button, {
3741
- width: "fit-content",
3742
- variant: "outline",
3743
- size: "sm",
3744
- as: Link__default.default,
3745
- href: portfolioHost + "/portfolio/" + slug,
3746
- mt: "4",
3747
- whiteSpace: "nowrap"
3748
- }, formatMessage({
3749
- id: 'sections.projectsMap.link.text'
3750
- })))));
3751
- };
3657
+ var _templateObject$3;
3658
+ var mapboxStyle = /*#__PURE__*/react$1.css(_templateObject$3 || (_templateObject$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n .mapboxgl-map {\n -webkit-tap-highlight-color: rgb(0 0 0/0);\n font: 12px/20px Helvetica Neue, Arial, Helvetica, sans-serif;\n overflow: hidden;\n position: relative;\n }\n .mapboxgl-canvas {\n left: 0;\n position: absolute;\n top: 0;\n }\n .mapboxgl-map:-webkit-full-screen {\n height: 100%;\n width: 100%;\n }\n .mapboxgl-canary {\n background-color: salmon;\n }\n .mapboxgl-canvas-container.mapboxgl-interactive,\n .mapboxgl-ctrl-group button.mapboxgl-ctrl-compass {\n cursor: grab;\n -webkit-user-select: none;\n user-select: none;\n }\n .mapboxgl-canvas-container.mapboxgl-interactive.mapboxgl-track-pointer {\n cursor: pointer;\n }\n .mapboxgl-canvas-container.mapboxgl-interactive:active,\n .mapboxgl-ctrl-group button.mapboxgl-ctrl-compass:active {\n cursor: grabbing;\n }\n .mapboxgl-canvas-container.mapboxgl-touch-zoom-rotate,\n .mapboxgl-canvas-container.mapboxgl-touch-zoom-rotate .mapboxgl-canvas {\n touch-action: pan-x pan-y;\n }\n .mapboxgl-canvas-container.mapboxgl-touch-drag-pan,\n .mapboxgl-canvas-container.mapboxgl-touch-drag-pan .mapboxgl-canvas {\n touch-action: pinch-zoom;\n }\n .mapboxgl-canvas-container.mapboxgl-touch-zoom-rotate.mapboxgl-touch-drag-pan,\n .mapboxgl-canvas-container.mapboxgl-touch-zoom-rotate.mapboxgl-touch-drag-pan\n .mapboxgl-canvas {\n touch-action: none;\n }\n .mapboxgl-ctrl-bottom-left,\n .mapboxgl-ctrl-bottom-right,\n .mapboxgl-ctrl-top-left,\n .mapboxgl-ctrl-top-right {\n pointer-events: none;\n position: absolute;\n z-index: 2;\n }\n .mapboxgl-ctrl-top-left {\n left: 0;\n top: 0;\n }\n .mapboxgl-ctrl-top-right {\n right: 0;\n top: 0;\n }\n .mapboxgl-ctrl-bottom-left {\n bottom: 0;\n left: 0;\n }\n .mapboxgl-ctrl-bottom-right {\n bottom: 0;\n right: 0;\n }\n .mapboxgl-ctrl {\n clear: both;\n pointer-events: auto;\n transform: translate(0);\n }\n .mapboxgl-ctrl-top-left .mapboxgl-ctrl {\n float: left;\n margin: 10px 0 0 10px;\n }\n .mapboxgl-ctrl-top-right .mapboxgl-ctrl {\n float: right;\n margin: 10px 10px 0 0;\n }\n .mapboxgl-ctrl-bottom-left .mapboxgl-ctrl {\n float: left;\n margin: 0 0 10px 10px;\n }\n .mapboxgl-ctrl-bottom-right .mapboxgl-ctrl {\n float: right;\n margin: 0 10px 10px 0;\n }\n .mapboxgl-ctrl-group {\n background: #fff;\n border-radius: 4px;\n }\n .mapboxgl-ctrl-group:not(:empty) {\n box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.1);\n }\n @media (-ms-high-contrast: active) {\n .mapboxgl-ctrl-group:not(:empty) {\n box-shadow: 0 0 0 2px ButtonText;\n }\n }\n .mapboxgl-ctrl-group button {\n background-color: transparent;\n border: 0;\n box-sizing: border-box;\n cursor: pointer;\n display: block;\n height: 29px;\n outline: none;\n overflow: hidden;\n padding: 0;\n width: 29px;\n }\n .mapboxgl-ctrl-group button + button {\n border-top: 1px solid #ddd;\n }\n .mapboxgl-ctrl button .mapboxgl-ctrl-icon {\n background-position: 50%;\n background-repeat: no-repeat;\n display: block;\n height: 100%;\n width: 100%;\n }\n @media (-ms-high-contrast: active) {\n .mapboxgl-ctrl-icon {\n background-color: transparent;\n }\n .mapboxgl-ctrl-group button + button {\n border-top: 1px solid ButtonText;\n }\n }\n .mapboxgl-ctrl-attrib-button:focus,\n .mapboxgl-ctrl-group button:focus {\n box-shadow: 0 0 2px 2px #0096ff;\n }\n .mapboxgl-ctrl button:disabled {\n cursor: not-allowed;\n }\n .mapboxgl-ctrl button:disabled .mapboxgl-ctrl-icon {\n opacity: 0.25;\n }\n .mapboxgl-ctrl-group button:first-of-type {\n border-radius: 4px 4px 0 0;\n }\n .mapboxgl-ctrl-group button:last-of-type {\n border-radius: 0 0 4px 4px;\n }\n .mapboxgl-ctrl-group button:only-of-type {\n border-radius: inherit;\n }\n .mapboxgl-ctrl button:not(:disabled):hover {\n background-color: rgb(0 0 0/5%);\n }\n .mapboxgl-ctrl-group button:focus:focus-visible {\n box-shadow: 0 0 2px 2px #0096ff;\n }\n .mapboxgl-ctrl-group button:focus:not(:focus-visible) {\n box-shadow: none;\n }\n .mapboxgl-ctrl button.mapboxgl-ctrl-zoom-out .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23333' viewBox='0 0 29 29'%3E%3Cpath d='M10 13c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h9c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-9z'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl button.mapboxgl-ctrl-zoom-in .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23333' viewBox='0 0 29 29'%3E%3Cpath d='M14.5 8.5c-.75 0-1.5.75-1.5 1.5v3h-3c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h3v3c0 .75.75 1.5 1.5 1.5S16 19.75 16 19v-3h3c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-3v-3c0-.75-.75-1.5-1.5-1.5z'/%3E%3C/svg%3E\");\n }\n @media (-ms-high-contrast: active) {\n .mapboxgl-ctrl button.mapboxgl-ctrl-zoom-out .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 29 29'%3E%3Cpath d='M10 13c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h9c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-9z'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl button.mapboxgl-ctrl-zoom-in .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 29 29'%3E%3Cpath d='M14.5 8.5c-.75 0-1.5.75-1.5 1.5v3h-3c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h3v3c0 .75.75 1.5 1.5 1.5S16 19.75 16 19v-3h3c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-3v-3c0-.75-.75-1.5-1.5-1.5z'/%3E%3C/svg%3E\");\n }\n }\n @media (-ms-high-contrast: black-on-white) {\n .mapboxgl-ctrl button.mapboxgl-ctrl-zoom-out .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 29 29'%3E%3Cpath d='M10 13c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h9c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-9z'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl button.mapboxgl-ctrl-zoom-in .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 29 29'%3E%3Cpath d='M14.5 8.5c-.75 0-1.5.75-1.5 1.5v3h-3c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h3v3c0 .75.75 1.5 1.5 1.5S16 19.75 16 19v-3h3c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-3v-3c0-.75-.75-1.5-1.5-1.5z'/%3E%3C/svg%3E\");\n }\n }\n .mapboxgl-ctrl button.mapboxgl-ctrl-fullscreen .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23333' viewBox='0 0 29 29'%3E%3Cpath d='M24 16v5.5c0 1.75-.75 2.5-2.5 2.5H16v-1l3-1.5-4-5.5 1-1 5.5 4 1.5-3h1zM6 16l1.5 3 5.5-4 1 1-4 5.5 3 1.5v1H7.5C5.75 24 5 23.25 5 21.5V16h1zm7-11v1l-3 1.5 4 5.5-1 1-5.5-4L6 13H5V7.5C5 5.75 5.75 5 7.5 5H13zm11 2.5c0-1.75-.75-2.5-2.5-2.5H16v1l3 1.5-4 5.5 1 1 5.5-4 1.5 3h1V7.5z'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl button.mapboxgl-ctrl-shrink .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 29 29'%3E%3Cpath d='M18.5 16c-1.75 0-2.5.75-2.5 2.5V24h1l1.5-3 5.5 4 1-1-4-5.5 3-1.5v-1h-5.5zM13 18.5c0-1.75-.75-2.5-2.5-2.5H5v1l3 1.5L4 24l1 1 5.5-4 1.5 3h1v-5.5zm3-8c0 1.75.75 2.5 2.5 2.5H24v-1l-3-1.5L25 5l-1-1-5.5 4L17 5h-1v5.5zM10.5 13c1.75 0 2.5-.75 2.5-2.5V5h-1l-1.5 3L5 4 4 5l4 5.5L5 12v1h5.5z'/%3E%3C/svg%3E\");\n }\n @media (-ms-high-contrast: active) {\n .mapboxgl-ctrl button.mapboxgl-ctrl-fullscreen .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 29 29'%3E%3Cpath d='M24 16v5.5c0 1.75-.75 2.5-2.5 2.5H16v-1l3-1.5-4-5.5 1-1 5.5 4 1.5-3h1zM6 16l1.5 3 5.5-4 1 1-4 5.5 3 1.5v1H7.5C5.75 24 5 23.25 5 21.5V16h1zm7-11v1l-3 1.5 4 5.5-1 1-5.5-4L6 13H5V7.5C5 5.75 5.75 5 7.5 5H13zm11 2.5c0-1.75-.75-2.5-2.5-2.5H16v1l3 1.5-4 5.5 1 1 5.5-4 1.5 3h1V7.5z'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl button.mapboxgl-ctrl-shrink .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 29 29'%3E%3Cpath d='M18.5 16c-1.75 0-2.5.75-2.5 2.5V24h1l1.5-3 5.5 4 1-1-4-5.5 3-1.5v-1h-5.5zM13 18.5c0-1.75-.75-2.5-2.5-2.5H5v1l3 1.5L4 24l1 1 5.5-4 1.5 3h1v-5.5zm3-8c0 1.75.75 2.5 2.5 2.5H24v-1l-3-1.5L25 5l-1-1-5.5 4L17 5h-1v5.5zM10.5 13c1.75 0 2.5-.75 2.5-2.5V5h-1l-1.5 3L5 4 4 5l4 5.5L5 12v1h5.5z'/%3E%3C/svg%3E\");\n }\n }\n @media (-ms-high-contrast: black-on-white) {\n .mapboxgl-ctrl button.mapboxgl-ctrl-fullscreen .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 29 29'%3E%3Cpath d='M24 16v5.5c0 1.75-.75 2.5-2.5 2.5H16v-1l3-1.5-4-5.5 1-1 5.5 4 1.5-3h1zM6 16l1.5 3 5.5-4 1 1-4 5.5 3 1.5v1H7.5C5.75 24 5 23.25 5 21.5V16h1zm7-11v1l-3 1.5 4 5.5-1 1-5.5-4L6 13H5V7.5C5 5.75 5.75 5 7.5 5H13zm11 2.5c0-1.75-.75-2.5-2.5-2.5H16v1l3 1.5-4 5.5 1 1 5.5-4 1.5 3h1V7.5z'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl button.mapboxgl-ctrl-shrink .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 29 29'%3E%3Cpath d='M18.5 16c-1.75 0-2.5.75-2.5 2.5V24h1l1.5-3 5.5 4 1-1-4-5.5 3-1.5v-1h-5.5zM13 18.5c0-1.75-.75-2.5-2.5-2.5H5v1l3 1.5L4 24l1 1 5.5-4 1.5 3h1v-5.5zm3-8c0 1.75.75 2.5 2.5 2.5H24v-1l-3-1.5L25 5l-1-1-5.5 4L17 5h-1v5.5zM10.5 13c1.75 0 2.5-.75 2.5-2.5V5h-1l-1.5 3L5 4 4 5l4 5.5L5 12v1h5.5z'/%3E%3C/svg%3E\");\n }\n }\n .mapboxgl-ctrl button.mapboxgl-ctrl-compass .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23333' viewBox='0 0 29 29'%3E%3Cpath d='M10.5 14l4-8 4 8h-8z'/%3E%3Cpath id='south' d='M10.5 16l4 8 4-8h-8z' fill='%23ccc'/%3E%3C/svg%3E\");\n }\n @media (-ms-high-contrast: active) {\n .mapboxgl-ctrl button.mapboxgl-ctrl-compass .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 29 29'%3E%3Cpath d='M10.5 14l4-8 4 8h-8z'/%3E%3Cpath id='south' d='M10.5 16l4 8 4-8h-8z' fill='%23999'/%3E%3C/svg%3E\");\n }\n }\n @media (-ms-high-contrast: black-on-white) {\n .mapboxgl-ctrl button.mapboxgl-ctrl-compass .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 29 29'%3E%3Cpath d='M10.5 14l4-8 4 8h-8z'/%3E%3Cpath id='south' d='M10.5 16l4 8 4-8h-8z' fill='%23ccc'/%3E%3C/svg%3E\");\n }\n }\n .mapboxgl-ctrl button.mapboxgl-ctrl-geolocate .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23333'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl button.mapboxgl-ctrl-geolocate:disabled .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23aaa'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' fill='%23f00'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl\n button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-active\n .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%2333b5e5'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl\n button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-active-error\n .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23e58978'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl\n button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-background\n .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%2333b5e5'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2' display='none'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl\n button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-background-error\n .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23e54e33'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2' display='none'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl\n button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-waiting\n .mapboxgl-ctrl-icon {\n animation: mapboxgl-spin 2s linear infinite;\n }\n @media (-ms-high-contrast: active) {\n .mapboxgl-ctrl button.mapboxgl-ctrl-geolocate .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23fff'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl button.mapboxgl-ctrl-geolocate:disabled .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23999'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' fill='%23f00'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl\n button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-active\n .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%2333b5e5'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl\n button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-active-error\n .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23e58978'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl\n button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-background\n .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%2333b5e5'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2' display='none'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl\n button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-background-error\n .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23e54e33'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2' display='none'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E\");\n }\n }\n @media (-ms-high-contrast: black-on-white) {\n .mapboxgl-ctrl button.mapboxgl-ctrl-geolocate .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23000'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl button.mapboxgl-ctrl-geolocate:disabled .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23666'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' fill='%23f00'/%3E%3C/svg%3E\");\n }\n }\n @keyframes mapboxgl-spin {\n 0% {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(1turn);\n }\n }\n a.mapboxgl-ctrl-logo {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' fill-rule='evenodd' viewBox='0 0 88 23'%3E%3Cdefs%3E%3Cpath id='logo' d='M11.5 2.25c5.105 0 9.25 4.145 9.25 9.25s-4.145 9.25-9.25 9.25-9.25-4.145-9.25-9.25 4.145-9.25 9.25-9.25zM6.997 15.983c-.051-.338-.828-5.802 2.233-8.873a4.395 4.395 0 013.13-1.28c1.27 0 2.49.51 3.39 1.42.91.9 1.42 2.12 1.42 3.39 0 1.18-.449 2.301-1.28 3.13C12.72 16.93 7 16 7 16l-.003-.017zM15.3 10.5l-2 .8-.8 2-.8-2-2-.8 2-.8.8-2 .8 2 2 .8z'/%3E%3Cpath id='text' d='M50.63 8c.13 0 .23.1.23.23V9c.7-.76 1.7-1.18 2.73-1.18 2.17 0 3.95 1.85 3.95 4.17s-1.77 4.19-3.94 4.19c-1.04 0-2.03-.43-2.74-1.18v3.77c0 .13-.1.23-.23.23h-1.4c-.13 0-.23-.1-.23-.23V8.23c0-.12.1-.23.23-.23h1.4zm-3.86.01c.01 0 .01 0 .01-.01.13 0 .22.1.22.22v7.55c0 .12-.1.23-.23.23h-1.4c-.13 0-.23-.1-.23-.23V15c-.7.76-1.69 1.19-2.73 1.19-2.17 0-3.94-1.87-3.94-4.19 0-2.32 1.77-4.19 3.94-4.19 1.03 0 2.02.43 2.73 1.18v-.75c0-.12.1-.23.23-.23h1.4zm26.375-.19a4.24 4.24 0 00-4.16 3.29c-.13.59-.13 1.19 0 1.77a4.233 4.233 0 004.17 3.3c2.35 0 4.26-1.87 4.26-4.19 0-2.32-1.9-4.17-4.27-4.17zM60.63 5c.13 0 .23.1.23.23v3.76c.7-.76 1.7-1.18 2.73-1.18 1.88 0 3.45 1.4 3.84 3.28.13.59.13 1.2 0 1.8-.39 1.88-1.96 3.29-3.84 3.29-1.03 0-2.02-.43-2.73-1.18v.77c0 .12-.1.23-.23.23h-1.4c-.13 0-.23-.1-.23-.23V5.23c0-.12.1-.23.23-.23h1.4zm-34 11h-1.4c-.13 0-.23-.11-.23-.23V8.22c.01-.13.1-.22.23-.22h1.4c.13 0 .22.11.23.22v.68c.5-.68 1.3-1.09 2.16-1.1h.03c1.09 0 2.09.6 2.6 1.55.45-.95 1.4-1.55 2.44-1.56 1.62 0 2.93 1.25 2.9 2.78l.03 5.2c0 .13-.1.23-.23.23h-1.41c-.13 0-.23-.11-.23-.23v-4.59c0-.98-.74-1.71-1.62-1.71-.8 0-1.46.7-1.59 1.62l.01 4.68c0 .13-.11.23-.23.23h-1.41c-.13 0-.23-.11-.23-.23v-4.59c0-.98-.74-1.71-1.62-1.71-.85 0-1.54.79-1.6 1.8v4.5c0 .13-.1.23-.23.23zm53.615 0h-1.61c-.04 0-.08-.01-.12-.03-.09-.06-.13-.19-.06-.28l2.43-3.71-2.39-3.65a.213.213 0 01-.03-.12c0-.12.09-.21.21-.21h1.61c.13 0 .24.06.3.17l1.41 2.37 1.4-2.37a.34.34 0 01.3-.17h1.6c.04 0 .08.01.12.03.09.06.13.19.06.28l-2.37 3.65 2.43 3.7c0 .05.01.09.01.13 0 .12-.09.21-.21.21h-1.61c-.13 0-.24-.06-.3-.17l-1.44-2.42-1.44 2.42a.34.34 0 01-.3.17zm-7.12-1.49c-1.33 0-2.42-1.12-2.42-2.51 0-1.39 1.08-2.52 2.42-2.52 1.33 0 2.42 1.12 2.42 2.51 0 1.39-1.08 2.51-2.42 2.52zm-19.865 0c-1.32 0-2.39-1.11-2.42-2.48v-.07c.02-1.38 1.09-2.49 2.4-2.49 1.32 0 2.41 1.12 2.41 2.51 0 1.39-1.07 2.52-2.39 2.53zm-8.11-2.48c-.01 1.37-1.09 2.47-2.41 2.47s-2.42-1.12-2.42-2.51c0-1.39 1.08-2.52 2.4-2.52 1.33 0 2.39 1.11 2.41 2.48l.02.08zm18.12 2.47c-1.32 0-2.39-1.11-2.41-2.48v-.06c.02-1.38 1.09-2.48 2.41-2.48s2.42 1.12 2.42 2.51c0 1.39-1.09 2.51-2.42 2.51z'/%3E%3C/defs%3E%3Cmask id='clip'%3E%3Crect x='0' y='0' width='100%25' height='100%25' fill='white'/%3E%3Cuse xlink:href='%23logo'/%3E%3Cuse xlink:href='%23text'/%3E%3C/mask%3E%3Cg id='outline' opacity='0.3' stroke='%23000' stroke-width='3'%3E%3Ccircle mask='url(%23clip)' cx='11.5' cy='11.5' r='9.25'/%3E%3Cuse xlink:href='%23text' mask='url(%23clip)'/%3E%3C/g%3E%3Cg id='fill' opacity='0.9' fill='%23fff'%3E%3Cuse xlink:href='%23logo'/%3E%3Cuse xlink:href='%23text'/%3E%3C/g%3E%3C/svg%3E\");\n background-repeat: no-repeat;\n cursor: pointer;\n display: block;\n height: 23px;\n margin: 0 0 -4px -4px;\n overflow: hidden;\n width: 88px;\n }\n a.mapboxgl-ctrl-logo.mapboxgl-compact {\n width: 23px;\n }\n @media (-ms-high-contrast: active) {\n a.mapboxgl-ctrl-logo {\n background-color: transparent;\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' fill-rule='evenodd' viewBox='0 0 88 23'%3E%3Cdefs%3E%3Cpath id='logo' d='M11.5 2.25c5.105 0 9.25 4.145 9.25 9.25s-4.145 9.25-9.25 9.25-9.25-4.145-9.25-9.25 4.145-9.25 9.25-9.25zM6.997 15.983c-.051-.338-.828-5.802 2.233-8.873a4.395 4.395 0 013.13-1.28c1.27 0 2.49.51 3.39 1.42.91.9 1.42 2.12 1.42 3.39 0 1.18-.449 2.301-1.28 3.13C12.72 16.93 7 16 7 16l-.003-.017zM15.3 10.5l-2 .8-.8 2-.8-2-2-.8 2-.8.8-2 .8 2 2 .8z'/%3E%3Cpath id='text' d='M50.63 8c.13 0 .23.1.23.23V9c.7-.76 1.7-1.18 2.73-1.18 2.17 0 3.95 1.85 3.95 4.17s-1.77 4.19-3.94 4.19c-1.04 0-2.03-.43-2.74-1.18v3.77c0 .13-.1.23-.23.23h-1.4c-.13 0-.23-.1-.23-.23V8.23c0-.12.1-.23.23-.23h1.4zm-3.86.01c.01 0 .01 0 .01-.01.13 0 .22.1.22.22v7.55c0 .12-.1.23-.23.23h-1.4c-.13 0-.23-.1-.23-.23V15c-.7.76-1.69 1.19-2.73 1.19-2.17 0-3.94-1.87-3.94-4.19 0-2.32 1.77-4.19 3.94-4.19 1.03 0 2.02.43 2.73 1.18v-.75c0-.12.1-.23.23-.23h1.4zm26.375-.19a4.24 4.24 0 00-4.16 3.29c-.13.59-.13 1.19 0 1.77a4.233 4.233 0 004.17 3.3c2.35 0 4.26-1.87 4.26-4.19 0-2.32-1.9-4.17-4.27-4.17zM60.63 5c.13 0 .23.1.23.23v3.76c.7-.76 1.7-1.18 2.73-1.18 1.88 0 3.45 1.4 3.84 3.28.13.59.13 1.2 0 1.8-.39 1.88-1.96 3.29-3.84 3.29-1.03 0-2.02-.43-2.73-1.18v.77c0 .12-.1.23-.23.23h-1.4c-.13 0-.23-.1-.23-.23V5.23c0-.12.1-.23.23-.23h1.4zm-34 11h-1.4c-.13 0-.23-.11-.23-.23V8.22c.01-.13.1-.22.23-.22h1.4c.13 0 .22.11.23.22v.68c.5-.68 1.3-1.09 2.16-1.1h.03c1.09 0 2.09.6 2.6 1.55.45-.95 1.4-1.55 2.44-1.56 1.62 0 2.93 1.25 2.9 2.78l.03 5.2c0 .13-.1.23-.23.23h-1.41c-.13 0-.23-.11-.23-.23v-4.59c0-.98-.74-1.71-1.62-1.71-.8 0-1.46.7-1.59 1.62l.01 4.68c0 .13-.11.23-.23.23h-1.41c-.13 0-.23-.11-.23-.23v-4.59c0-.98-.74-1.71-1.62-1.71-.85 0-1.54.79-1.6 1.8v4.5c0 .13-.1.23-.23.23zm53.615 0h-1.61c-.04 0-.08-.01-.12-.03-.09-.06-.13-.19-.06-.28l2.43-3.71-2.39-3.65a.213.213 0 01-.03-.12c0-.12.09-.21.21-.21h1.61c.13 0 .24.06.3.17l1.41 2.37 1.4-2.37a.34.34 0 01.3-.17h1.6c.04 0 .08.01.12.03.09.06.13.19.06.28l-2.37 3.65 2.43 3.7c0 .05.01.09.01.13 0 .12-.09.21-.21.21h-1.61c-.13 0-.24-.06-.3-.17l-1.44-2.42-1.44 2.42a.34.34 0 01-.3.17zm-7.12-1.49c-1.33 0-2.42-1.12-2.42-2.51 0-1.39 1.08-2.52 2.42-2.52 1.33 0 2.42 1.12 2.42 2.51 0 1.39-1.08 2.51-2.42 2.52zm-19.865 0c-1.32 0-2.39-1.11-2.42-2.48v-.07c.02-1.38 1.09-2.49 2.4-2.49 1.32 0 2.41 1.12 2.41 2.51 0 1.39-1.07 2.52-2.39 2.53zm-8.11-2.48c-.01 1.37-1.09 2.47-2.41 2.47s-2.42-1.12-2.42-2.51c0-1.39 1.08-2.52 2.4-2.52 1.33 0 2.39 1.11 2.41 2.48l.02.08zm18.12 2.47c-1.32 0-2.39-1.11-2.41-2.48v-.06c.02-1.38 1.09-2.48 2.41-2.48s2.42 1.12 2.42 2.51c0 1.39-1.09 2.51-2.42 2.51z'/%3E%3C/defs%3E%3Cmask id='clip'%3E%3Crect x='0' y='0' width='100%25' height='100%25' fill='white'/%3E%3Cuse xlink:href='%23logo'/%3E%3Cuse xlink:href='%23text'/%3E%3C/mask%3E%3Cg id='outline' opacity='1' stroke='%23000' stroke-width='3'%3E%3Ccircle mask='url(%23clip)' cx='11.5' cy='11.5' r='9.25'/%3E%3Cuse xlink:href='%23text' mask='url(%23clip)'/%3E%3C/g%3E%3Cg id='fill' opacity='1' fill='%23fff'%3E%3Cuse xlink:href='%23logo'/%3E%3Cuse xlink:href='%23text'/%3E%3C/g%3E%3C/svg%3E\");\n }\n }\n @media (-ms-high-contrast: black-on-white) {\n a.mapboxgl-ctrl-logo {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' fill-rule='evenodd' viewBox='0 0 88 23'%3E%3Cdefs%3E%3Cpath id='logo' d='M11.5 2.25c5.105 0 9.25 4.145 9.25 9.25s-4.145 9.25-9.25 9.25-9.25-4.145-9.25-9.25 4.145-9.25 9.25-9.25zM6.997 15.983c-.051-.338-.828-5.802 2.233-8.873a4.395 4.395 0 013.13-1.28c1.27 0 2.49.51 3.39 1.42.91.9 1.42 2.12 1.42 3.39 0 1.18-.449 2.301-1.28 3.13C12.72 16.93 7 16 7 16l-.003-.017zM15.3 10.5l-2 .8-.8 2-.8-2-2-.8 2-.8.8-2 .8 2 2 .8z'/%3E%3Cpath id='text' d='M50.63 8c.13 0 .23.1.23.23V9c.7-.76 1.7-1.18 2.73-1.18 2.17 0 3.95 1.85 3.95 4.17s-1.77 4.19-3.94 4.19c-1.04 0-2.03-.43-2.74-1.18v3.77c0 .13-.1.23-.23.23h-1.4c-.13 0-.23-.1-.23-.23V8.23c0-.12.1-.23.23-.23h1.4zm-3.86.01c.01 0 .01 0 .01-.01.13 0 .22.1.22.22v7.55c0 .12-.1.23-.23.23h-1.4c-.13 0-.23-.1-.23-.23V15c-.7.76-1.69 1.19-2.73 1.19-2.17 0-3.94-1.87-3.94-4.19 0-2.32 1.77-4.19 3.94-4.19 1.03 0 2.02.43 2.73 1.18v-.75c0-.12.1-.23.23-.23h1.4zm26.375-.19a4.24 4.24 0 00-4.16 3.29c-.13.59-.13 1.19 0 1.77a4.233 4.233 0 004.17 3.3c2.35 0 4.26-1.87 4.26-4.19 0-2.32-1.9-4.17-4.27-4.17zM60.63 5c.13 0 .23.1.23.23v3.76c.7-.76 1.7-1.18 2.73-1.18 1.88 0 3.45 1.4 3.84 3.28.13.59.13 1.2 0 1.8-.39 1.88-1.96 3.29-3.84 3.29-1.03 0-2.02-.43-2.73-1.18v.77c0 .12-.1.23-.23.23h-1.4c-.13 0-.23-.1-.23-.23V5.23c0-.12.1-.23.23-.23h1.4zm-34 11h-1.4c-.13 0-.23-.11-.23-.23V8.22c.01-.13.1-.22.23-.22h1.4c.13 0 .22.11.23.22v.68c.5-.68 1.3-1.09 2.16-1.1h.03c1.09 0 2.09.6 2.6 1.55.45-.95 1.4-1.55 2.44-1.56 1.62 0 2.93 1.25 2.9 2.78l.03 5.2c0 .13-.1.23-.23.23h-1.41c-.13 0-.23-.11-.23-.23v-4.59c0-.98-.74-1.71-1.62-1.71-.8 0-1.46.7-1.59 1.62l.01 4.68c0 .13-.11.23-.23.23h-1.41c-.13 0-.23-.11-.23-.23v-4.59c0-.98-.74-1.71-1.62-1.71-.85 0-1.54.79-1.6 1.8v4.5c0 .13-.1.23-.23.23zm53.615 0h-1.61c-.04 0-.08-.01-.12-.03-.09-.06-.13-.19-.06-.28l2.43-3.71-2.39-3.65a.213.213 0 01-.03-.12c0-.12.09-.21.21-.21h1.61c.13 0 .24.06.3.17l1.41 2.37 1.4-2.37a.34.34 0 01.3-.17h1.6c.04 0 .08.01.12.03.09.06.13.19.06.28l-2.37 3.65 2.43 3.7c0 .05.01.09.01.13 0 .12-.09.21-.21.21h-1.61c-.13 0-.24-.06-.3-.17l-1.44-2.42-1.44 2.42a.34.34 0 01-.3.17zm-7.12-1.49c-1.33 0-2.42-1.12-2.42-2.51 0-1.39 1.08-2.52 2.42-2.52 1.33 0 2.42 1.12 2.42 2.51 0 1.39-1.08 2.51-2.42 2.52zm-19.865 0c-1.32 0-2.39-1.11-2.42-2.48v-.07c.02-1.38 1.09-2.49 2.4-2.49 1.32 0 2.41 1.12 2.41 2.51 0 1.39-1.07 2.52-2.39 2.53zm-8.11-2.48c-.01 1.37-1.09 2.47-2.41 2.47s-2.42-1.12-2.42-2.51c0-1.39 1.08-2.52 2.4-2.52 1.33 0 2.39 1.11 2.41 2.48l.02.08zm18.12 2.47c-1.32 0-2.39-1.11-2.41-2.48v-.06c.02-1.38 1.09-2.48 2.41-2.48s2.42 1.12 2.42 2.51c0 1.39-1.09 2.51-2.42 2.51z'/%3E%3C/defs%3E%3Cmask id='clip'%3E%3Crect x='0' y='0' width='100%25' height='100%25' fill='white'/%3E%3Cuse xlink:href='%23logo'/%3E%3Cuse xlink:href='%23text'/%3E%3C/mask%3E%3Cg id='outline' opacity='1' stroke='%23fff' stroke-width='3' fill='%23fff'%3E%3Ccircle mask='url(%23clip)' cx='11.5' cy='11.5' r='9.25'/%3E%3Cuse xlink:href='%23text' mask='url(%23clip)'/%3E%3C/g%3E%3Cg id='fill' opacity='1' fill='%23000'%3E%3Cuse xlink:href='%23logo'/%3E%3Cuse xlink:href='%23text'/%3E%3C/g%3E%3C/svg%3E\");\n }\n }\n .mapboxgl-ctrl.mapboxgl-ctrl-attrib {\n background-color: hsla(0, 0%, 100%, 0.5);\n margin: 0;\n padding: 0 5px;\n }\n @media screen {\n .mapboxgl-ctrl-attrib.mapboxgl-compact {\n background-color: #fff;\n border-radius: 12px;\n margin: 10px;\n min-height: 20px;\n padding: 2px 24px 2px 0;\n position: relative;\n }\n .mapboxgl-ctrl-attrib.mapboxgl-compact-show {\n padding: 2px 28px 2px 8px;\n visibility: visible;\n }\n .mapboxgl-ctrl-bottom-left > .mapboxgl-ctrl-attrib.mapboxgl-compact-show,\n .mapboxgl-ctrl-top-left > .mapboxgl-ctrl-attrib.mapboxgl-compact-show {\n border-radius: 12px;\n padding: 2px 8px 2px 28px;\n }\n .mapboxgl-ctrl-attrib.mapboxgl-compact .mapboxgl-ctrl-attrib-inner {\n display: none;\n }\n .mapboxgl-ctrl-attrib-button {\n background-color: hsla(0, 0%, 100%, 0.5);\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill-rule='evenodd'%3E%3Cpath d='M4 10a6 6 0 1 0 12 0 6 6 0 1 0-12 0m5-3a1 1 0 1 0 2 0 1 1 0 1 0-2 0m0 3a1 1 0 1 1 2 0v3a1 1 0 1 1-2 0'/%3E%3C/svg%3E\");\n border: 0;\n border-radius: 12px;\n box-sizing: border-box;\n cursor: pointer;\n display: none;\n height: 24px;\n outline: none;\n position: absolute;\n right: 0;\n top: 0;\n width: 24px;\n }\n .mapboxgl-ctrl-bottom-left .mapboxgl-ctrl-attrib-button,\n .mapboxgl-ctrl-top-left .mapboxgl-ctrl-attrib-button {\n left: 0;\n }\n .mapboxgl-ctrl-attrib.mapboxgl-compact .mapboxgl-ctrl-attrib-button,\n .mapboxgl-ctrl-attrib.mapboxgl-compact-show .mapboxgl-ctrl-attrib-inner {\n display: block;\n }\n .mapboxgl-ctrl-attrib.mapboxgl-compact-show .mapboxgl-ctrl-attrib-button {\n background-color: rgb(0 0 0/5%);\n }\n .mapboxgl-ctrl-bottom-right > .mapboxgl-ctrl-attrib.mapboxgl-compact:after {\n bottom: 0;\n right: 0;\n }\n .mapboxgl-ctrl-top-right > .mapboxgl-ctrl-attrib.mapboxgl-compact:after {\n right: 0;\n top: 0;\n }\n .mapboxgl-ctrl-top-left > .mapboxgl-ctrl-attrib.mapboxgl-compact:after {\n left: 0;\n top: 0;\n }\n .mapboxgl-ctrl-bottom-left > .mapboxgl-ctrl-attrib.mapboxgl-compact:after {\n bottom: 0;\n left: 0;\n }\n }\n @media screen and (-ms-high-contrast: active) {\n .mapboxgl-ctrl-attrib.mapboxgl-compact:after {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill-rule='evenodd' fill='%23fff'%3E%3Cpath d='M4 10a6 6 0 1 0 12 0 6 6 0 1 0-12 0m5-3a1 1 0 1 0 2 0 1 1 0 1 0-2 0m0 3a1 1 0 1 1 2 0v3a1 1 0 1 1-2 0'/%3E%3C/svg%3E\");\n }\n }\n @media screen and (-ms-high-contrast: black-on-white) {\n .mapboxgl-ctrl-attrib.mapboxgl-compact:after {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill-rule='evenodd'%3E%3Cpath d='M4 10a6 6 0 1 0 12 0 6 6 0 1 0-12 0m5-3a1 1 0 1 0 2 0 1 1 0 1 0-2 0m0 3a1 1 0 1 1 2 0v3a1 1 0 1 1-2 0'/%3E%3C/svg%3E\");\n }\n }\n .mapboxgl-ctrl-attrib a {\n color: rgba(0, 0, 0, 0.75);\n text-decoration: none;\n }\n .mapboxgl-ctrl-attrib a:hover {\n color: inherit;\n text-decoration: underline;\n }\n .mapboxgl-ctrl-attrib .mapbox-improve-map {\n font-weight: 700;\n margin-left: 2px;\n }\n .mapboxgl-attrib-empty {\n display: none;\n }\n .mapboxgl-ctrl-scale {\n background-color: hsla(0, 0%, 100%, 0.75);\n border: 2px solid #333;\n border-top: #333;\n box-sizing: border-box;\n color: #333;\n font-size: 10px;\n padding: 0 5px;\n white-space: nowrap;\n }\n .mapboxgl-popup {\n display: flex;\n left: 0;\n pointer-events: none;\n position: absolute;\n top: 0;\n will-change: transform;\n }\n .mapboxgl-popup-anchor-top,\n .mapboxgl-popup-anchor-top-left,\n .mapboxgl-popup-anchor-top-right {\n flex-direction: column;\n }\n .mapboxgl-popup-anchor-bottom,\n .mapboxgl-popup-anchor-bottom-left,\n .mapboxgl-popup-anchor-bottom-right {\n flex-direction: column-reverse;\n }\n .mapboxgl-popup-anchor-left {\n flex-direction: row;\n }\n .mapboxgl-popup-anchor-right {\n flex-direction: row-reverse;\n }\n .mapboxgl-popup-tip {\n border: 10px solid transparent;\n height: 0;\n width: 0;\n z-index: 1;\n }\n .mapboxgl-popup-anchor-top .mapboxgl-popup-tip {\n align-self: center;\n border-bottom-color: #fff;\n border-top: none;\n }\n .mapboxgl-popup-anchor-top-left .mapboxgl-popup-tip {\n align-self: flex-start;\n border-bottom-color: #fff;\n border-left: none;\n border-top: none;\n }\n .mapboxgl-popup-anchor-top-right .mapboxgl-popup-tip {\n align-self: flex-end;\n border-bottom-color: #fff;\n border-right: none;\n border-top: none;\n }\n .mapboxgl-popup-anchor-bottom .mapboxgl-popup-tip {\n align-self: center;\n border-bottom: none;\n border-top-color: #fff;\n }\n .mapboxgl-popup-anchor-bottom-left .mapboxgl-popup-tip {\n align-self: flex-start;\n border-bottom: none;\n border-left: none;\n border-top-color: #fff;\n }\n .mapboxgl-popup-anchor-bottom-right .mapboxgl-popup-tip {\n align-self: flex-end;\n border-bottom: none;\n border-right: none;\n border-top-color: #fff;\n }\n .mapboxgl-popup-anchor-left .mapboxgl-popup-tip {\n align-self: center;\n border-left: none;\n border-right-color: #fff;\n }\n .mapboxgl-popup-anchor-right .mapboxgl-popup-tip {\n align-self: center;\n border-left-color: #fff;\n border-right: none;\n }\n .mapboxgl-popup-close-button {\n background-color: transparent;\n border: 0;\n border-radius: 0 3px 0 0;\n cursor: pointer;\n position: absolute;\n right: 0;\n top: 0;\n }\n .mapboxgl-popup-close-button:hover {\n background-color: rgb(0 0 0/5%);\n }\n .mapboxgl-popup-content {\n background: #fff;\n border-radius: 3px;\n box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);\n padding: 10px 10px 15px;\n pointer-events: auto;\n position: relative;\n }\n .mapboxgl-popup-anchor-top-left .mapboxgl-popup-content {\n border-top-left-radius: 0;\n }\n .mapboxgl-popup-anchor-top-right .mapboxgl-popup-content {\n border-top-right-radius: 0;\n }\n .mapboxgl-popup-anchor-bottom-left .mapboxgl-popup-content {\n border-bottom-left-radius: 0;\n }\n .mapboxgl-popup-anchor-bottom-right .mapboxgl-popup-content {\n border-bottom-right-radius: 0;\n }\n .mapboxgl-popup-track-pointer {\n display: none;\n }\n .mapboxgl-popup-track-pointer * {\n pointer-events: none;\n user-select: none;\n }\n .mapboxgl-map:hover .mapboxgl-popup-track-pointer {\n display: flex;\n }\n .mapboxgl-map:active .mapboxgl-popup-track-pointer {\n display: none;\n }\n .mapboxgl-marker {\n left: 0;\n opacity: 1;\n position: absolute;\n top: 0;\n transition: opacity 0.2s;\n will-change: transform;\n }\n .mapboxgl-user-location-dot,\n .mapboxgl-user-location-dot:before {\n background-color: #1da1f2;\n border-radius: 50%;\n height: 15px;\n width: 15px;\n }\n .mapboxgl-user-location-dot:before {\n animation: mapboxgl-user-location-dot-pulse 2s infinite;\n content: '';\n position: absolute;\n }\n .mapboxgl-user-location-dot:after {\n border: 2px solid #fff;\n border-radius: 50%;\n box-shadow: 0 0 3px rgba(0, 0, 0, 0.35);\n box-sizing: border-box;\n content: '';\n height: 19px;\n left: -2px;\n position: absolute;\n top: -2px;\n width: 19px;\n }\n .mapboxgl-user-location-show-heading .mapboxgl-user-location-heading {\n height: 0;\n width: 0;\n }\n .mapboxgl-user-location-show-heading .mapboxgl-user-location-heading:after,\n .mapboxgl-user-location-show-heading .mapboxgl-user-location-heading:before {\n border-bottom: 7.5px solid #4aa1eb;\n content: '';\n position: absolute;\n }\n .mapboxgl-user-location-show-heading .mapboxgl-user-location-heading:before {\n border-left: 7.5px solid transparent;\n transform: translateY(-28px) skewY(-20deg);\n }\n .mapboxgl-user-location-show-heading .mapboxgl-user-location-heading:after {\n border-right: 7.5px solid transparent;\n transform: translate(7.5px, -28px) skewY(20deg);\n }\n @keyframes mapboxgl-user-location-dot-pulse {\n 0% {\n opacity: 1;\n transform: scale(1);\n }\n 70% {\n opacity: 0;\n transform: scale(3);\n }\n to {\n opacity: 0;\n transform: scale(1);\n }\n }\n .mapboxgl-user-location-dot-stale {\n background-color: #aaa;\n }\n .mapboxgl-user-location-dot-stale:after {\n display: none;\n }\n .mapboxgl-user-location-accuracy-circle {\n background-color: #1da1f233;\n border-radius: 100%;\n height: 1px;\n width: 1px;\n }\n .mapboxgl-crosshair,\n .mapboxgl-crosshair .mapboxgl-interactive,\n .mapboxgl-crosshair .mapboxgl-interactive:active {\n cursor: crosshair;\n }\n .mapboxgl-boxzoom {\n background: #fff;\n border: 2px dotted #202020;\n height: 0;\n left: 0;\n opacity: 0.5;\n position: absolute;\n top: 0;\n width: 0;\n }\n @media print {\n .mapbox-improve-map {\n display: none;\n }\n }\n .mapboxgl-scroll-zoom-blocker,\n .mapboxgl-touch-pan-blocker {\n align-items: center;\n background: rgba(0, 0, 0, 0.7);\n color: #fff;\n display: flex;\n font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial,\n sans-serif;\n height: 100%;\n justify-content: center;\n left: 0;\n opacity: 0;\n pointer-events: none;\n position: absolute;\n text-align: center;\n top: 0;\n transition: opacity 0.75s ease-in-out;\n transition-delay: 1s;\n width: 100%;\n }\n .mapboxgl-scroll-zoom-blocker-show,\n .mapboxgl-touch-pan-blocker-show {\n opacity: 1;\n transition: opacity 0.1s ease-in-out;\n }\n .mapboxgl-canvas-container.mapboxgl-touch-pan-blocker-override.mapboxgl-scrollable-page,\n .mapboxgl-canvas-container.mapboxgl-touch-pan-blocker-override.mapboxgl-scrollable-page\n .mapboxgl-canvas {\n touch-action: pan-x pan-y;\n }\n"])));
3752
3659
 
3753
- var _templateObject$4;
3754
- var mapboxStyle = /*#__PURE__*/react$1.css(_templateObject$4 || (_templateObject$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n .mapboxgl-map {\n -webkit-tap-highlight-color: rgb(0 0 0/0);\n font: 12px/20px Helvetica Neue, Arial, Helvetica, sans-serif;\n overflow: hidden;\n position: relative;\n }\n .mapboxgl-canvas {\n left: 0;\n position: absolute;\n top: 0;\n }\n .mapboxgl-map:-webkit-full-screen {\n height: 100%;\n width: 100%;\n }\n .mapboxgl-canary {\n background-color: salmon;\n }\n .mapboxgl-canvas-container.mapboxgl-interactive,\n .mapboxgl-ctrl-group button.mapboxgl-ctrl-compass {\n cursor: grab;\n -webkit-user-select: none;\n user-select: none;\n }\n .mapboxgl-canvas-container.mapboxgl-interactive.mapboxgl-track-pointer {\n cursor: pointer;\n }\n .mapboxgl-canvas-container.mapboxgl-interactive:active,\n .mapboxgl-ctrl-group button.mapboxgl-ctrl-compass:active {\n cursor: grabbing;\n }\n .mapboxgl-canvas-container.mapboxgl-touch-zoom-rotate,\n .mapboxgl-canvas-container.mapboxgl-touch-zoom-rotate .mapboxgl-canvas {\n touch-action: pan-x pan-y;\n }\n .mapboxgl-canvas-container.mapboxgl-touch-drag-pan,\n .mapboxgl-canvas-container.mapboxgl-touch-drag-pan .mapboxgl-canvas {\n touch-action: pinch-zoom;\n }\n .mapboxgl-canvas-container.mapboxgl-touch-zoom-rotate.mapboxgl-touch-drag-pan,\n .mapboxgl-canvas-container.mapboxgl-touch-zoom-rotate.mapboxgl-touch-drag-pan\n .mapboxgl-canvas {\n touch-action: none;\n }\n .mapboxgl-ctrl-bottom-left,\n .mapboxgl-ctrl-bottom-right,\n .mapboxgl-ctrl-top-left,\n .mapboxgl-ctrl-top-right {\n pointer-events: none;\n position: absolute;\n z-index: 2;\n }\n .mapboxgl-ctrl-top-left {\n left: 0;\n top: 0;\n }\n .mapboxgl-ctrl-top-right {\n right: 0;\n top: 0;\n }\n .mapboxgl-ctrl-bottom-left {\n bottom: 0;\n left: 0;\n }\n .mapboxgl-ctrl-bottom-right {\n bottom: 0;\n right: 0;\n }\n .mapboxgl-ctrl {\n clear: both;\n pointer-events: auto;\n transform: translate(0);\n }\n .mapboxgl-ctrl-top-left .mapboxgl-ctrl {\n float: left;\n margin: 10px 0 0 10px;\n }\n .mapboxgl-ctrl-top-right .mapboxgl-ctrl {\n float: right;\n margin: 10px 10px 0 0;\n }\n .mapboxgl-ctrl-bottom-left .mapboxgl-ctrl {\n float: left;\n margin: 0 0 10px 10px;\n }\n .mapboxgl-ctrl-bottom-right .mapboxgl-ctrl {\n float: right;\n margin: 0 10px 10px 0;\n }\n .mapboxgl-ctrl-group {\n background: #fff;\n border-radius: 4px;\n }\n .mapboxgl-ctrl-group:not(:empty) {\n box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.1);\n }\n @media (-ms-high-contrast: active) {\n .mapboxgl-ctrl-group:not(:empty) {\n box-shadow: 0 0 0 2px ButtonText;\n }\n }\n .mapboxgl-ctrl-group button {\n background-color: transparent;\n border: 0;\n box-sizing: border-box;\n cursor: pointer;\n display: block;\n height: 29px;\n outline: none;\n overflow: hidden;\n padding: 0;\n width: 29px;\n }\n .mapboxgl-ctrl-group button + button {\n border-top: 1px solid #ddd;\n }\n .mapboxgl-ctrl button .mapboxgl-ctrl-icon {\n background-position: 50%;\n background-repeat: no-repeat;\n display: block;\n height: 100%;\n width: 100%;\n }\n @media (-ms-high-contrast: active) {\n .mapboxgl-ctrl-icon {\n background-color: transparent;\n }\n .mapboxgl-ctrl-group button + button {\n border-top: 1px solid ButtonText;\n }\n }\n .mapboxgl-ctrl-attrib-button:focus,\n .mapboxgl-ctrl-group button:focus {\n box-shadow: 0 0 2px 2px #0096ff;\n }\n .mapboxgl-ctrl button:disabled {\n cursor: not-allowed;\n }\n .mapboxgl-ctrl button:disabled .mapboxgl-ctrl-icon {\n opacity: 0.25;\n }\n .mapboxgl-ctrl-group button:first-of-type {\n border-radius: 4px 4px 0 0;\n }\n .mapboxgl-ctrl-group button:last-of-type {\n border-radius: 0 0 4px 4px;\n }\n .mapboxgl-ctrl-group button:only-of-type {\n border-radius: inherit;\n }\n .mapboxgl-ctrl button:not(:disabled):hover {\n background-color: rgb(0 0 0/5%);\n }\n .mapboxgl-ctrl-group button:focus:focus-visible {\n box-shadow: 0 0 2px 2px #0096ff;\n }\n .mapboxgl-ctrl-group button:focus:not(:focus-visible) {\n box-shadow: none;\n }\n .mapboxgl-ctrl button.mapboxgl-ctrl-zoom-out .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23333' viewBox='0 0 29 29'%3E%3Cpath d='M10 13c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h9c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-9z'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl button.mapboxgl-ctrl-zoom-in .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23333' viewBox='0 0 29 29'%3E%3Cpath d='M14.5 8.5c-.75 0-1.5.75-1.5 1.5v3h-3c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h3v3c0 .75.75 1.5 1.5 1.5S16 19.75 16 19v-3h3c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-3v-3c0-.75-.75-1.5-1.5-1.5z'/%3E%3C/svg%3E\");\n }\n @media (-ms-high-contrast: active) {\n .mapboxgl-ctrl button.mapboxgl-ctrl-zoom-out .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 29 29'%3E%3Cpath d='M10 13c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h9c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-9z'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl button.mapboxgl-ctrl-zoom-in .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 29 29'%3E%3Cpath d='M14.5 8.5c-.75 0-1.5.75-1.5 1.5v3h-3c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h3v3c0 .75.75 1.5 1.5 1.5S16 19.75 16 19v-3h3c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-3v-3c0-.75-.75-1.5-1.5-1.5z'/%3E%3C/svg%3E\");\n }\n }\n @media (-ms-high-contrast: black-on-white) {\n .mapboxgl-ctrl button.mapboxgl-ctrl-zoom-out .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 29 29'%3E%3Cpath d='M10 13c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h9c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-9z'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl button.mapboxgl-ctrl-zoom-in .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 29 29'%3E%3Cpath d='M14.5 8.5c-.75 0-1.5.75-1.5 1.5v3h-3c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h3v3c0 .75.75 1.5 1.5 1.5S16 19.75 16 19v-3h3c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-3v-3c0-.75-.75-1.5-1.5-1.5z'/%3E%3C/svg%3E\");\n }\n }\n .mapboxgl-ctrl button.mapboxgl-ctrl-fullscreen .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23333' viewBox='0 0 29 29'%3E%3Cpath d='M24 16v5.5c0 1.75-.75 2.5-2.5 2.5H16v-1l3-1.5-4-5.5 1-1 5.5 4 1.5-3h1zM6 16l1.5 3 5.5-4 1 1-4 5.5 3 1.5v1H7.5C5.75 24 5 23.25 5 21.5V16h1zm7-11v1l-3 1.5 4 5.5-1 1-5.5-4L6 13H5V7.5C5 5.75 5.75 5 7.5 5H13zm11 2.5c0-1.75-.75-2.5-2.5-2.5H16v1l3 1.5-4 5.5 1 1 5.5-4 1.5 3h1V7.5z'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl button.mapboxgl-ctrl-shrink .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 29 29'%3E%3Cpath d='M18.5 16c-1.75 0-2.5.75-2.5 2.5V24h1l1.5-3 5.5 4 1-1-4-5.5 3-1.5v-1h-5.5zM13 18.5c0-1.75-.75-2.5-2.5-2.5H5v1l3 1.5L4 24l1 1 5.5-4 1.5 3h1v-5.5zm3-8c0 1.75.75 2.5 2.5 2.5H24v-1l-3-1.5L25 5l-1-1-5.5 4L17 5h-1v5.5zM10.5 13c1.75 0 2.5-.75 2.5-2.5V5h-1l-1.5 3L5 4 4 5l4 5.5L5 12v1h5.5z'/%3E%3C/svg%3E\");\n }\n @media (-ms-high-contrast: active) {\n .mapboxgl-ctrl button.mapboxgl-ctrl-fullscreen .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 29 29'%3E%3Cpath d='M24 16v5.5c0 1.75-.75 2.5-2.5 2.5H16v-1l3-1.5-4-5.5 1-1 5.5 4 1.5-3h1zM6 16l1.5 3 5.5-4 1 1-4 5.5 3 1.5v1H7.5C5.75 24 5 23.25 5 21.5V16h1zm7-11v1l-3 1.5 4 5.5-1 1-5.5-4L6 13H5V7.5C5 5.75 5.75 5 7.5 5H13zm11 2.5c0-1.75-.75-2.5-2.5-2.5H16v1l3 1.5-4 5.5 1 1 5.5-4 1.5 3h1V7.5z'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl button.mapboxgl-ctrl-shrink .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 29 29'%3E%3Cpath d='M18.5 16c-1.75 0-2.5.75-2.5 2.5V24h1l1.5-3 5.5 4 1-1-4-5.5 3-1.5v-1h-5.5zM13 18.5c0-1.75-.75-2.5-2.5-2.5H5v1l3 1.5L4 24l1 1 5.5-4 1.5 3h1v-5.5zm3-8c0 1.75.75 2.5 2.5 2.5H24v-1l-3-1.5L25 5l-1-1-5.5 4L17 5h-1v5.5zM10.5 13c1.75 0 2.5-.75 2.5-2.5V5h-1l-1.5 3L5 4 4 5l4 5.5L5 12v1h5.5z'/%3E%3C/svg%3E\");\n }\n }\n @media (-ms-high-contrast: black-on-white) {\n .mapboxgl-ctrl button.mapboxgl-ctrl-fullscreen .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 29 29'%3E%3Cpath d='M24 16v5.5c0 1.75-.75 2.5-2.5 2.5H16v-1l3-1.5-4-5.5 1-1 5.5 4 1.5-3h1zM6 16l1.5 3 5.5-4 1 1-4 5.5 3 1.5v1H7.5C5.75 24 5 23.25 5 21.5V16h1zm7-11v1l-3 1.5 4 5.5-1 1-5.5-4L6 13H5V7.5C5 5.75 5.75 5 7.5 5H13zm11 2.5c0-1.75-.75-2.5-2.5-2.5H16v1l3 1.5-4 5.5 1 1 5.5-4 1.5 3h1V7.5z'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl button.mapboxgl-ctrl-shrink .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 29 29'%3E%3Cpath d='M18.5 16c-1.75 0-2.5.75-2.5 2.5V24h1l1.5-3 5.5 4 1-1-4-5.5 3-1.5v-1h-5.5zM13 18.5c0-1.75-.75-2.5-2.5-2.5H5v1l3 1.5L4 24l1 1 5.5-4 1.5 3h1v-5.5zm3-8c0 1.75.75 2.5 2.5 2.5H24v-1l-3-1.5L25 5l-1-1-5.5 4L17 5h-1v5.5zM10.5 13c1.75 0 2.5-.75 2.5-2.5V5h-1l-1.5 3L5 4 4 5l4 5.5L5 12v1h5.5z'/%3E%3C/svg%3E\");\n }\n }\n .mapboxgl-ctrl button.mapboxgl-ctrl-compass .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23333' viewBox='0 0 29 29'%3E%3Cpath d='M10.5 14l4-8 4 8h-8z'/%3E%3Cpath id='south' d='M10.5 16l4 8 4-8h-8z' fill='%23ccc'/%3E%3C/svg%3E\");\n }\n @media (-ms-high-contrast: active) {\n .mapboxgl-ctrl button.mapboxgl-ctrl-compass .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 29 29'%3E%3Cpath d='M10.5 14l4-8 4 8h-8z'/%3E%3Cpath id='south' d='M10.5 16l4 8 4-8h-8z' fill='%23999'/%3E%3C/svg%3E\");\n }\n }\n @media (-ms-high-contrast: black-on-white) {\n .mapboxgl-ctrl button.mapboxgl-ctrl-compass .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 29 29'%3E%3Cpath d='M10.5 14l4-8 4 8h-8z'/%3E%3Cpath id='south' d='M10.5 16l4 8 4-8h-8z' fill='%23ccc'/%3E%3C/svg%3E\");\n }\n }\n .mapboxgl-ctrl button.mapboxgl-ctrl-geolocate .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23333'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl button.mapboxgl-ctrl-geolocate:disabled .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23aaa'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' fill='%23f00'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl\n button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-active\n .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%2333b5e5'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl\n button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-active-error\n .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23e58978'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl\n button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-background\n .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%2333b5e5'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2' display='none'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl\n button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-background-error\n .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23e54e33'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2' display='none'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl\n button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-waiting\n .mapboxgl-ctrl-icon {\n animation: mapboxgl-spin 2s linear infinite;\n }\n @media (-ms-high-contrast: active) {\n .mapboxgl-ctrl button.mapboxgl-ctrl-geolocate .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23fff'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl button.mapboxgl-ctrl-geolocate:disabled .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23999'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' fill='%23f00'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl\n button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-active\n .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%2333b5e5'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl\n button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-active-error\n .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23e58978'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl\n button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-background\n .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%2333b5e5'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2' display='none'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl\n button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-background-error\n .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23e54e33'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2' display='none'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E\");\n }\n }\n @media (-ms-high-contrast: black-on-white) {\n .mapboxgl-ctrl button.mapboxgl-ctrl-geolocate .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23000'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' display='none'/%3E%3C/svg%3E\");\n }\n .mapboxgl-ctrl button.mapboxgl-ctrl-geolocate:disabled .mapboxgl-ctrl-icon {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23666'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7z'/%3E%3Ccircle id='dot' cx='10' cy='10' r='2'/%3E%3Cpath id='stroke' d='M14 5l1 1-9 9-1-1 9-9z' fill='%23f00'/%3E%3C/svg%3E\");\n }\n }\n @keyframes mapboxgl-spin {\n 0% {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(1turn);\n }\n }\n a.mapboxgl-ctrl-logo {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' fill-rule='evenodd' viewBox='0 0 88 23'%3E%3Cdefs%3E%3Cpath id='logo' d='M11.5 2.25c5.105 0 9.25 4.145 9.25 9.25s-4.145 9.25-9.25 9.25-9.25-4.145-9.25-9.25 4.145-9.25 9.25-9.25zM6.997 15.983c-.051-.338-.828-5.802 2.233-8.873a4.395 4.395 0 013.13-1.28c1.27 0 2.49.51 3.39 1.42.91.9 1.42 2.12 1.42 3.39 0 1.18-.449 2.301-1.28 3.13C12.72 16.93 7 16 7 16l-.003-.017zM15.3 10.5l-2 .8-.8 2-.8-2-2-.8 2-.8.8-2 .8 2 2 .8z'/%3E%3Cpath id='text' d='M50.63 8c.13 0 .23.1.23.23V9c.7-.76 1.7-1.18 2.73-1.18 2.17 0 3.95 1.85 3.95 4.17s-1.77 4.19-3.94 4.19c-1.04 0-2.03-.43-2.74-1.18v3.77c0 .13-.1.23-.23.23h-1.4c-.13 0-.23-.1-.23-.23V8.23c0-.12.1-.23.23-.23h1.4zm-3.86.01c.01 0 .01 0 .01-.01.13 0 .22.1.22.22v7.55c0 .12-.1.23-.23.23h-1.4c-.13 0-.23-.1-.23-.23V15c-.7.76-1.69 1.19-2.73 1.19-2.17 0-3.94-1.87-3.94-4.19 0-2.32 1.77-4.19 3.94-4.19 1.03 0 2.02.43 2.73 1.18v-.75c0-.12.1-.23.23-.23h1.4zm26.375-.19a4.24 4.24 0 00-4.16 3.29c-.13.59-.13 1.19 0 1.77a4.233 4.233 0 004.17 3.3c2.35 0 4.26-1.87 4.26-4.19 0-2.32-1.9-4.17-4.27-4.17zM60.63 5c.13 0 .23.1.23.23v3.76c.7-.76 1.7-1.18 2.73-1.18 1.88 0 3.45 1.4 3.84 3.28.13.59.13 1.2 0 1.8-.39 1.88-1.96 3.29-3.84 3.29-1.03 0-2.02-.43-2.73-1.18v.77c0 .12-.1.23-.23.23h-1.4c-.13 0-.23-.1-.23-.23V5.23c0-.12.1-.23.23-.23h1.4zm-34 11h-1.4c-.13 0-.23-.11-.23-.23V8.22c.01-.13.1-.22.23-.22h1.4c.13 0 .22.11.23.22v.68c.5-.68 1.3-1.09 2.16-1.1h.03c1.09 0 2.09.6 2.6 1.55.45-.95 1.4-1.55 2.44-1.56 1.62 0 2.93 1.25 2.9 2.78l.03 5.2c0 .13-.1.23-.23.23h-1.41c-.13 0-.23-.11-.23-.23v-4.59c0-.98-.74-1.71-1.62-1.71-.8 0-1.46.7-1.59 1.62l.01 4.68c0 .13-.11.23-.23.23h-1.41c-.13 0-.23-.11-.23-.23v-4.59c0-.98-.74-1.71-1.62-1.71-.85 0-1.54.79-1.6 1.8v4.5c0 .13-.1.23-.23.23zm53.615 0h-1.61c-.04 0-.08-.01-.12-.03-.09-.06-.13-.19-.06-.28l2.43-3.71-2.39-3.65a.213.213 0 01-.03-.12c0-.12.09-.21.21-.21h1.61c.13 0 .24.06.3.17l1.41 2.37 1.4-2.37a.34.34 0 01.3-.17h1.6c.04 0 .08.01.12.03.09.06.13.19.06.28l-2.37 3.65 2.43 3.7c0 .05.01.09.01.13 0 .12-.09.21-.21.21h-1.61c-.13 0-.24-.06-.3-.17l-1.44-2.42-1.44 2.42a.34.34 0 01-.3.17zm-7.12-1.49c-1.33 0-2.42-1.12-2.42-2.51 0-1.39 1.08-2.52 2.42-2.52 1.33 0 2.42 1.12 2.42 2.51 0 1.39-1.08 2.51-2.42 2.52zm-19.865 0c-1.32 0-2.39-1.11-2.42-2.48v-.07c.02-1.38 1.09-2.49 2.4-2.49 1.32 0 2.41 1.12 2.41 2.51 0 1.39-1.07 2.52-2.39 2.53zm-8.11-2.48c-.01 1.37-1.09 2.47-2.41 2.47s-2.42-1.12-2.42-2.51c0-1.39 1.08-2.52 2.4-2.52 1.33 0 2.39 1.11 2.41 2.48l.02.08zm18.12 2.47c-1.32 0-2.39-1.11-2.41-2.48v-.06c.02-1.38 1.09-2.48 2.41-2.48s2.42 1.12 2.42 2.51c0 1.39-1.09 2.51-2.42 2.51z'/%3E%3C/defs%3E%3Cmask id='clip'%3E%3Crect x='0' y='0' width='100%25' height='100%25' fill='white'/%3E%3Cuse xlink:href='%23logo'/%3E%3Cuse xlink:href='%23text'/%3E%3C/mask%3E%3Cg id='outline' opacity='0.3' stroke='%23000' stroke-width='3'%3E%3Ccircle mask='url(%23clip)' cx='11.5' cy='11.5' r='9.25'/%3E%3Cuse xlink:href='%23text' mask='url(%23clip)'/%3E%3C/g%3E%3Cg id='fill' opacity='0.9' fill='%23fff'%3E%3Cuse xlink:href='%23logo'/%3E%3Cuse xlink:href='%23text'/%3E%3C/g%3E%3C/svg%3E\");\n background-repeat: no-repeat;\n cursor: pointer;\n display: block;\n height: 23px;\n margin: 0 0 -4px -4px;\n overflow: hidden;\n width: 88px;\n }\n a.mapboxgl-ctrl-logo.mapboxgl-compact {\n width: 23px;\n }\n @media (-ms-high-contrast: active) {\n a.mapboxgl-ctrl-logo {\n background-color: transparent;\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' fill-rule='evenodd' viewBox='0 0 88 23'%3E%3Cdefs%3E%3Cpath id='logo' d='M11.5 2.25c5.105 0 9.25 4.145 9.25 9.25s-4.145 9.25-9.25 9.25-9.25-4.145-9.25-9.25 4.145-9.25 9.25-9.25zM6.997 15.983c-.051-.338-.828-5.802 2.233-8.873a4.395 4.395 0 013.13-1.28c1.27 0 2.49.51 3.39 1.42.91.9 1.42 2.12 1.42 3.39 0 1.18-.449 2.301-1.28 3.13C12.72 16.93 7 16 7 16l-.003-.017zM15.3 10.5l-2 .8-.8 2-.8-2-2-.8 2-.8.8-2 .8 2 2 .8z'/%3E%3Cpath id='text' d='M50.63 8c.13 0 .23.1.23.23V9c.7-.76 1.7-1.18 2.73-1.18 2.17 0 3.95 1.85 3.95 4.17s-1.77 4.19-3.94 4.19c-1.04 0-2.03-.43-2.74-1.18v3.77c0 .13-.1.23-.23.23h-1.4c-.13 0-.23-.1-.23-.23V8.23c0-.12.1-.23.23-.23h1.4zm-3.86.01c.01 0 .01 0 .01-.01.13 0 .22.1.22.22v7.55c0 .12-.1.23-.23.23h-1.4c-.13 0-.23-.1-.23-.23V15c-.7.76-1.69 1.19-2.73 1.19-2.17 0-3.94-1.87-3.94-4.19 0-2.32 1.77-4.19 3.94-4.19 1.03 0 2.02.43 2.73 1.18v-.75c0-.12.1-.23.23-.23h1.4zm26.375-.19a4.24 4.24 0 00-4.16 3.29c-.13.59-.13 1.19 0 1.77a4.233 4.233 0 004.17 3.3c2.35 0 4.26-1.87 4.26-4.19 0-2.32-1.9-4.17-4.27-4.17zM60.63 5c.13 0 .23.1.23.23v3.76c.7-.76 1.7-1.18 2.73-1.18 1.88 0 3.45 1.4 3.84 3.28.13.59.13 1.2 0 1.8-.39 1.88-1.96 3.29-3.84 3.29-1.03 0-2.02-.43-2.73-1.18v.77c0 .12-.1.23-.23.23h-1.4c-.13 0-.23-.1-.23-.23V5.23c0-.12.1-.23.23-.23h1.4zm-34 11h-1.4c-.13 0-.23-.11-.23-.23V8.22c.01-.13.1-.22.23-.22h1.4c.13 0 .22.11.23.22v.68c.5-.68 1.3-1.09 2.16-1.1h.03c1.09 0 2.09.6 2.6 1.55.45-.95 1.4-1.55 2.44-1.56 1.62 0 2.93 1.25 2.9 2.78l.03 5.2c0 .13-.1.23-.23.23h-1.41c-.13 0-.23-.11-.23-.23v-4.59c0-.98-.74-1.71-1.62-1.71-.8 0-1.46.7-1.59 1.62l.01 4.68c0 .13-.11.23-.23.23h-1.41c-.13 0-.23-.11-.23-.23v-4.59c0-.98-.74-1.71-1.62-1.71-.85 0-1.54.79-1.6 1.8v4.5c0 .13-.1.23-.23.23zm53.615 0h-1.61c-.04 0-.08-.01-.12-.03-.09-.06-.13-.19-.06-.28l2.43-3.71-2.39-3.65a.213.213 0 01-.03-.12c0-.12.09-.21.21-.21h1.61c.13 0 .24.06.3.17l1.41 2.37 1.4-2.37a.34.34 0 01.3-.17h1.6c.04 0 .08.01.12.03.09.06.13.19.06.28l-2.37 3.65 2.43 3.7c0 .05.01.09.01.13 0 .12-.09.21-.21.21h-1.61c-.13 0-.24-.06-.3-.17l-1.44-2.42-1.44 2.42a.34.34 0 01-.3.17zm-7.12-1.49c-1.33 0-2.42-1.12-2.42-2.51 0-1.39 1.08-2.52 2.42-2.52 1.33 0 2.42 1.12 2.42 2.51 0 1.39-1.08 2.51-2.42 2.52zm-19.865 0c-1.32 0-2.39-1.11-2.42-2.48v-.07c.02-1.38 1.09-2.49 2.4-2.49 1.32 0 2.41 1.12 2.41 2.51 0 1.39-1.07 2.52-2.39 2.53zm-8.11-2.48c-.01 1.37-1.09 2.47-2.41 2.47s-2.42-1.12-2.42-2.51c0-1.39 1.08-2.52 2.4-2.52 1.33 0 2.39 1.11 2.41 2.48l.02.08zm18.12 2.47c-1.32 0-2.39-1.11-2.41-2.48v-.06c.02-1.38 1.09-2.48 2.41-2.48s2.42 1.12 2.42 2.51c0 1.39-1.09 2.51-2.42 2.51z'/%3E%3C/defs%3E%3Cmask id='clip'%3E%3Crect x='0' y='0' width='100%25' height='100%25' fill='white'/%3E%3Cuse xlink:href='%23logo'/%3E%3Cuse xlink:href='%23text'/%3E%3C/mask%3E%3Cg id='outline' opacity='1' stroke='%23000' stroke-width='3'%3E%3Ccircle mask='url(%23clip)' cx='11.5' cy='11.5' r='9.25'/%3E%3Cuse xlink:href='%23text' mask='url(%23clip)'/%3E%3C/g%3E%3Cg id='fill' opacity='1' fill='%23fff'%3E%3Cuse xlink:href='%23logo'/%3E%3Cuse xlink:href='%23text'/%3E%3C/g%3E%3C/svg%3E\");\n }\n }\n @media (-ms-high-contrast: black-on-white) {\n a.mapboxgl-ctrl-logo {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' fill-rule='evenodd' viewBox='0 0 88 23'%3E%3Cdefs%3E%3Cpath id='logo' d='M11.5 2.25c5.105 0 9.25 4.145 9.25 9.25s-4.145 9.25-9.25 9.25-9.25-4.145-9.25-9.25 4.145-9.25 9.25-9.25zM6.997 15.983c-.051-.338-.828-5.802 2.233-8.873a4.395 4.395 0 013.13-1.28c1.27 0 2.49.51 3.39 1.42.91.9 1.42 2.12 1.42 3.39 0 1.18-.449 2.301-1.28 3.13C12.72 16.93 7 16 7 16l-.003-.017zM15.3 10.5l-2 .8-.8 2-.8-2-2-.8 2-.8.8-2 .8 2 2 .8z'/%3E%3Cpath id='text' d='M50.63 8c.13 0 .23.1.23.23V9c.7-.76 1.7-1.18 2.73-1.18 2.17 0 3.95 1.85 3.95 4.17s-1.77 4.19-3.94 4.19c-1.04 0-2.03-.43-2.74-1.18v3.77c0 .13-.1.23-.23.23h-1.4c-.13 0-.23-.1-.23-.23V8.23c0-.12.1-.23.23-.23h1.4zm-3.86.01c.01 0 .01 0 .01-.01.13 0 .22.1.22.22v7.55c0 .12-.1.23-.23.23h-1.4c-.13 0-.23-.1-.23-.23V15c-.7.76-1.69 1.19-2.73 1.19-2.17 0-3.94-1.87-3.94-4.19 0-2.32 1.77-4.19 3.94-4.19 1.03 0 2.02.43 2.73 1.18v-.75c0-.12.1-.23.23-.23h1.4zm26.375-.19a4.24 4.24 0 00-4.16 3.29c-.13.59-.13 1.19 0 1.77a4.233 4.233 0 004.17 3.3c2.35 0 4.26-1.87 4.26-4.19 0-2.32-1.9-4.17-4.27-4.17zM60.63 5c.13 0 .23.1.23.23v3.76c.7-.76 1.7-1.18 2.73-1.18 1.88 0 3.45 1.4 3.84 3.28.13.59.13 1.2 0 1.8-.39 1.88-1.96 3.29-3.84 3.29-1.03 0-2.02-.43-2.73-1.18v.77c0 .12-.1.23-.23.23h-1.4c-.13 0-.23-.1-.23-.23V5.23c0-.12.1-.23.23-.23h1.4zm-34 11h-1.4c-.13 0-.23-.11-.23-.23V8.22c.01-.13.1-.22.23-.22h1.4c.13 0 .22.11.23.22v.68c.5-.68 1.3-1.09 2.16-1.1h.03c1.09 0 2.09.6 2.6 1.55.45-.95 1.4-1.55 2.44-1.56 1.62 0 2.93 1.25 2.9 2.78l.03 5.2c0 .13-.1.23-.23.23h-1.41c-.13 0-.23-.11-.23-.23v-4.59c0-.98-.74-1.71-1.62-1.71-.8 0-1.46.7-1.59 1.62l.01 4.68c0 .13-.11.23-.23.23h-1.41c-.13 0-.23-.11-.23-.23v-4.59c0-.98-.74-1.71-1.62-1.71-.85 0-1.54.79-1.6 1.8v4.5c0 .13-.1.23-.23.23zm53.615 0h-1.61c-.04 0-.08-.01-.12-.03-.09-.06-.13-.19-.06-.28l2.43-3.71-2.39-3.65a.213.213 0 01-.03-.12c0-.12.09-.21.21-.21h1.61c.13 0 .24.06.3.17l1.41 2.37 1.4-2.37a.34.34 0 01.3-.17h1.6c.04 0 .08.01.12.03.09.06.13.19.06.28l-2.37 3.65 2.43 3.7c0 .05.01.09.01.13 0 .12-.09.21-.21.21h-1.61c-.13 0-.24-.06-.3-.17l-1.44-2.42-1.44 2.42a.34.34 0 01-.3.17zm-7.12-1.49c-1.33 0-2.42-1.12-2.42-2.51 0-1.39 1.08-2.52 2.42-2.52 1.33 0 2.42 1.12 2.42 2.51 0 1.39-1.08 2.51-2.42 2.52zm-19.865 0c-1.32 0-2.39-1.11-2.42-2.48v-.07c.02-1.38 1.09-2.49 2.4-2.49 1.32 0 2.41 1.12 2.41 2.51 0 1.39-1.07 2.52-2.39 2.53zm-8.11-2.48c-.01 1.37-1.09 2.47-2.41 2.47s-2.42-1.12-2.42-2.51c0-1.39 1.08-2.52 2.4-2.52 1.33 0 2.39 1.11 2.41 2.48l.02.08zm18.12 2.47c-1.32 0-2.39-1.11-2.41-2.48v-.06c.02-1.38 1.09-2.48 2.41-2.48s2.42 1.12 2.42 2.51c0 1.39-1.09 2.51-2.42 2.51z'/%3E%3C/defs%3E%3Cmask id='clip'%3E%3Crect x='0' y='0' width='100%25' height='100%25' fill='white'/%3E%3Cuse xlink:href='%23logo'/%3E%3Cuse xlink:href='%23text'/%3E%3C/mask%3E%3Cg id='outline' opacity='1' stroke='%23fff' stroke-width='3' fill='%23fff'%3E%3Ccircle mask='url(%23clip)' cx='11.5' cy='11.5' r='9.25'/%3E%3Cuse xlink:href='%23text' mask='url(%23clip)'/%3E%3C/g%3E%3Cg id='fill' opacity='1' fill='%23000'%3E%3Cuse xlink:href='%23logo'/%3E%3Cuse xlink:href='%23text'/%3E%3C/g%3E%3C/svg%3E\");\n }\n }\n .mapboxgl-ctrl.mapboxgl-ctrl-attrib {\n background-color: hsla(0, 0%, 100%, 0.5);\n margin: 0;\n padding: 0 5px;\n }\n @media screen {\n .mapboxgl-ctrl-attrib.mapboxgl-compact {\n background-color: #fff;\n border-radius: 12px;\n margin: 10px;\n min-height: 20px;\n padding: 2px 24px 2px 0;\n position: relative;\n }\n .mapboxgl-ctrl-attrib.mapboxgl-compact-show {\n padding: 2px 28px 2px 8px;\n visibility: visible;\n }\n .mapboxgl-ctrl-bottom-left > .mapboxgl-ctrl-attrib.mapboxgl-compact-show,\n .mapboxgl-ctrl-top-left > .mapboxgl-ctrl-attrib.mapboxgl-compact-show {\n border-radius: 12px;\n padding: 2px 8px 2px 28px;\n }\n .mapboxgl-ctrl-attrib.mapboxgl-compact .mapboxgl-ctrl-attrib-inner {\n display: none;\n }\n .mapboxgl-ctrl-attrib-button {\n background-color: hsla(0, 0%, 100%, 0.5);\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill-rule='evenodd'%3E%3Cpath d='M4 10a6 6 0 1 0 12 0 6 6 0 1 0-12 0m5-3a1 1 0 1 0 2 0 1 1 0 1 0-2 0m0 3a1 1 0 1 1 2 0v3a1 1 0 1 1-2 0'/%3E%3C/svg%3E\");\n border: 0;\n border-radius: 12px;\n box-sizing: border-box;\n cursor: pointer;\n display: none;\n height: 24px;\n outline: none;\n position: absolute;\n right: 0;\n top: 0;\n width: 24px;\n }\n .mapboxgl-ctrl-bottom-left .mapboxgl-ctrl-attrib-button,\n .mapboxgl-ctrl-top-left .mapboxgl-ctrl-attrib-button {\n left: 0;\n }\n .mapboxgl-ctrl-attrib.mapboxgl-compact .mapboxgl-ctrl-attrib-button,\n .mapboxgl-ctrl-attrib.mapboxgl-compact-show .mapboxgl-ctrl-attrib-inner {\n display: block;\n }\n .mapboxgl-ctrl-attrib.mapboxgl-compact-show .mapboxgl-ctrl-attrib-button {\n background-color: rgb(0 0 0/5%);\n }\n .mapboxgl-ctrl-bottom-right > .mapboxgl-ctrl-attrib.mapboxgl-compact:after {\n bottom: 0;\n right: 0;\n }\n .mapboxgl-ctrl-top-right > .mapboxgl-ctrl-attrib.mapboxgl-compact:after {\n right: 0;\n top: 0;\n }\n .mapboxgl-ctrl-top-left > .mapboxgl-ctrl-attrib.mapboxgl-compact:after {\n left: 0;\n top: 0;\n }\n .mapboxgl-ctrl-bottom-left > .mapboxgl-ctrl-attrib.mapboxgl-compact:after {\n bottom: 0;\n left: 0;\n }\n }\n @media screen and (-ms-high-contrast: active) {\n .mapboxgl-ctrl-attrib.mapboxgl-compact:after {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill-rule='evenodd' fill='%23fff'%3E%3Cpath d='M4 10a6 6 0 1 0 12 0 6 6 0 1 0-12 0m5-3a1 1 0 1 0 2 0 1 1 0 1 0-2 0m0 3a1 1 0 1 1 2 0v3a1 1 0 1 1-2 0'/%3E%3C/svg%3E\");\n }\n }\n @media screen and (-ms-high-contrast: black-on-white) {\n .mapboxgl-ctrl-attrib.mapboxgl-compact:after {\n background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill-rule='evenodd'%3E%3Cpath d='M4 10a6 6 0 1 0 12 0 6 6 0 1 0-12 0m5-3a1 1 0 1 0 2 0 1 1 0 1 0-2 0m0 3a1 1 0 1 1 2 0v3a1 1 0 1 1-2 0'/%3E%3C/svg%3E\");\n }\n }\n .mapboxgl-ctrl-attrib a {\n color: rgba(0, 0, 0, 0.75);\n text-decoration: none;\n }\n .mapboxgl-ctrl-attrib a:hover {\n color: inherit;\n text-decoration: underline;\n }\n .mapboxgl-ctrl-attrib .mapbox-improve-map {\n font-weight: 700;\n margin-left: 2px;\n }\n .mapboxgl-attrib-empty {\n display: none;\n }\n .mapboxgl-ctrl-scale {\n background-color: hsla(0, 0%, 100%, 0.75);\n border: 2px solid #333;\n border-top: #333;\n box-sizing: border-box;\n color: #333;\n font-size: 10px;\n padding: 0 5px;\n white-space: nowrap;\n }\n .mapboxgl-popup {\n display: flex;\n left: 0;\n pointer-events: none;\n position: absolute;\n top: 0;\n will-change: transform;\n }\n .mapboxgl-popup-anchor-top,\n .mapboxgl-popup-anchor-top-left,\n .mapboxgl-popup-anchor-top-right {\n flex-direction: column;\n }\n .mapboxgl-popup-anchor-bottom,\n .mapboxgl-popup-anchor-bottom-left,\n .mapboxgl-popup-anchor-bottom-right {\n flex-direction: column-reverse;\n }\n .mapboxgl-popup-anchor-left {\n flex-direction: row;\n }\n .mapboxgl-popup-anchor-right {\n flex-direction: row-reverse;\n }\n .mapboxgl-popup-tip {\n border: 10px solid transparent;\n height: 0;\n width: 0;\n z-index: 1;\n }\n .mapboxgl-popup-anchor-top .mapboxgl-popup-tip {\n align-self: center;\n border-bottom-color: #fff;\n border-top: none;\n }\n .mapboxgl-popup-anchor-top-left .mapboxgl-popup-tip {\n align-self: flex-start;\n border-bottom-color: #fff;\n border-left: none;\n border-top: none;\n }\n .mapboxgl-popup-anchor-top-right .mapboxgl-popup-tip {\n align-self: flex-end;\n border-bottom-color: #fff;\n border-right: none;\n border-top: none;\n }\n .mapboxgl-popup-anchor-bottom .mapboxgl-popup-tip {\n align-self: center;\n border-bottom: none;\n border-top-color: #fff;\n }\n .mapboxgl-popup-anchor-bottom-left .mapboxgl-popup-tip {\n align-self: flex-start;\n border-bottom: none;\n border-left: none;\n border-top-color: #fff;\n }\n .mapboxgl-popup-anchor-bottom-right .mapboxgl-popup-tip {\n align-self: flex-end;\n border-bottom: none;\n border-right: none;\n border-top-color: #fff;\n }\n .mapboxgl-popup-anchor-left .mapboxgl-popup-tip {\n align-self: center;\n border-left: none;\n border-right-color: #fff;\n }\n .mapboxgl-popup-anchor-right .mapboxgl-popup-tip {\n align-self: center;\n border-left-color: #fff;\n border-right: none;\n }\n .mapboxgl-popup-close-button {\n background-color: transparent;\n border: 0;\n border-radius: 0 3px 0 0;\n cursor: pointer;\n position: absolute;\n right: 0;\n top: 0;\n }\n .mapboxgl-popup-close-button:hover {\n background-color: rgb(0 0 0/5%);\n }\n .mapboxgl-popup-content {\n background: #fff;\n border-radius: 3px;\n box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);\n padding: 10px 10px 15px;\n pointer-events: auto;\n position: relative;\n }\n .mapboxgl-popup-anchor-top-left .mapboxgl-popup-content {\n border-top-left-radius: 0;\n }\n .mapboxgl-popup-anchor-top-right .mapboxgl-popup-content {\n border-top-right-radius: 0;\n }\n .mapboxgl-popup-anchor-bottom-left .mapboxgl-popup-content {\n border-bottom-left-radius: 0;\n }\n .mapboxgl-popup-anchor-bottom-right .mapboxgl-popup-content {\n border-bottom-right-radius: 0;\n }\n .mapboxgl-popup-track-pointer {\n display: none;\n }\n .mapboxgl-popup-track-pointer * {\n pointer-events: none;\n user-select: none;\n }\n .mapboxgl-map:hover .mapboxgl-popup-track-pointer {\n display: flex;\n }\n .mapboxgl-map:active .mapboxgl-popup-track-pointer {\n display: none;\n }\n .mapboxgl-marker {\n left: 0;\n opacity: 1;\n position: absolute;\n top: 0;\n transition: opacity 0.2s;\n will-change: transform;\n }\n .mapboxgl-user-location-dot,\n .mapboxgl-user-location-dot:before {\n background-color: #1da1f2;\n border-radius: 50%;\n height: 15px;\n width: 15px;\n }\n .mapboxgl-user-location-dot:before {\n animation: mapboxgl-user-location-dot-pulse 2s infinite;\n content: '';\n position: absolute;\n }\n .mapboxgl-user-location-dot:after {\n border: 2px solid #fff;\n border-radius: 50%;\n box-shadow: 0 0 3px rgba(0, 0, 0, 0.35);\n box-sizing: border-box;\n content: '';\n height: 19px;\n left: -2px;\n position: absolute;\n top: -2px;\n width: 19px;\n }\n .mapboxgl-user-location-show-heading .mapboxgl-user-location-heading {\n height: 0;\n width: 0;\n }\n .mapboxgl-user-location-show-heading .mapboxgl-user-location-heading:after,\n .mapboxgl-user-location-show-heading .mapboxgl-user-location-heading:before {\n border-bottom: 7.5px solid #4aa1eb;\n content: '';\n position: absolute;\n }\n .mapboxgl-user-location-show-heading .mapboxgl-user-location-heading:before {\n border-left: 7.5px solid transparent;\n transform: translateY(-28px) skewY(-20deg);\n }\n .mapboxgl-user-location-show-heading .mapboxgl-user-location-heading:after {\n border-right: 7.5px solid transparent;\n transform: translate(7.5px, -28px) skewY(20deg);\n }\n @keyframes mapboxgl-user-location-dot-pulse {\n 0% {\n opacity: 1;\n transform: scale(1);\n }\n 70% {\n opacity: 0;\n transform: scale(3);\n }\n to {\n opacity: 0;\n transform: scale(1);\n }\n }\n .mapboxgl-user-location-dot-stale {\n background-color: #aaa;\n }\n .mapboxgl-user-location-dot-stale:after {\n display: none;\n }\n .mapboxgl-user-location-accuracy-circle {\n background-color: #1da1f233;\n border-radius: 100%;\n height: 1px;\n width: 1px;\n }\n .mapboxgl-crosshair,\n .mapboxgl-crosshair .mapboxgl-interactive,\n .mapboxgl-crosshair .mapboxgl-interactive:active {\n cursor: crosshair;\n }\n .mapboxgl-boxzoom {\n background: #fff;\n border: 2px dotted #202020;\n height: 0;\n left: 0;\n opacity: 0.5;\n position: absolute;\n top: 0;\n width: 0;\n }\n @media print {\n .mapbox-improve-map {\n display: none;\n }\n }\n .mapboxgl-scroll-zoom-blocker,\n .mapboxgl-touch-pan-blocker {\n align-items: center;\n background: rgba(0, 0, 0, 0.7);\n color: #fff;\n display: flex;\n font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial,\n sans-serif;\n height: 100%;\n justify-content: center;\n left: 0;\n opacity: 0;\n pointer-events: none;\n position: absolute;\n text-align: center;\n top: 0;\n transition: opacity 0.75s ease-in-out;\n transition-delay: 1s;\n width: 100%;\n }\n .mapboxgl-scroll-zoom-blocker-show,\n .mapboxgl-touch-pan-blocker-show {\n opacity: 1;\n transition: opacity 0.1s ease-in-out;\n }\n .mapboxgl-canvas-container.mapboxgl-touch-pan-blocker-override.mapboxgl-scrollable-page,\n .mapboxgl-canvas-container.mapboxgl-touch-pan-blocker-override.mapboxgl-scrollable-page\n .mapboxgl-canvas {\n touch-action: pan-x pan-y;\n }\n"])));
3660
+ var FALLBACK_LOCALE = 'en';
3661
+ var getPortfolioProjectsByBbox = /*#__PURE__*/function () {
3662
+ var _ref = /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee(bbox, locale, preview) {
3663
+ var _bbox$split$map, west, south, east, north, cache, strapiParams, _yield$Promise$all, fpmResponse, strapiProjectsLocalized, strapiProjectsEnglish, strapiProjects, _i, _arr, project, featureCollection;
3664
+ return _regeneratorRuntime().wrap(function _callee$(_context) {
3665
+ while (1) switch (_context.prev = _context.next) {
3666
+ case 0:
3667
+ if (locale === void 0) {
3668
+ locale = 'en';
3669
+ }
3670
+ if (preview === void 0) {
3671
+ preview = false;
3672
+ }
3673
+ _bbox$split$map = bbox.split(',').map(Number), west = _bbox$split$map[0], south = _bbox$split$map[1], east = _bbox$split$map[2], north = _bbox$split$map[3];
3674
+ cache = preview ? false : undefined;
3675
+ strapiParams = {
3676
+ pLevel: STRAPI_DEFAULT_POPULATE_DEPTH,
3677
+ locale: locale,
3678
+ 'pagination[pageSize]': STRAPI_DEFAULT_PAGE_SIZE,
3679
+ status: preview ? 'draft' : 'published'
3680
+ };
3681
+ _context.next = 7;
3682
+ return Promise.all([fpmClient.get('/public/projects', {
3683
+ params: {
3684
+ bbox: west + "," + south + "," + east + "," + north
3685
+ },
3686
+ cache: cache
3687
+ }), strapiClient.get('/projects', {
3688
+ params: strapiParams,
3689
+ cache: cache
3690
+ }), strapiClient.get('/projects', {
3691
+ params: _extends({}, strapiParams, {
3692
+ locale: FALLBACK_LOCALE
3693
+ }),
3694
+ cache: cache
3695
+ })]);
3696
+ case 7:
3697
+ _yield$Promise$all = _context.sent;
3698
+ fpmResponse = _yield$Promise$all[0];
3699
+ strapiProjectsLocalized = _yield$Promise$all[1].data;
3700
+ strapiProjectsEnglish = _yield$Promise$all[2].data;
3701
+ strapiProjects = new Map();
3702
+ for (_i = 0, _arr = [].concat(strapiProjectsEnglish.data, strapiProjectsLocalized.data); _i < _arr.length; _i++) {
3703
+ project = _arr[_i];
3704
+ if (project.attributes.fpmProjectId) {
3705
+ strapiProjects.set(project.attributes.fpmProjectId, project);
3706
+ }
3707
+ }
3708
+ featureCollection = fpmResponse.data; // Add slug and portfolioHost to each feature's properties
3709
+ featureCollection.features = featureCollection.features.map(function (feature) {
3710
+ var _feature$properties;
3711
+ var fpmProjectId = (_feature$properties = feature.properties) == null ? void 0 : _feature$properties.id;
3712
+ var strapiProject = fpmProjectId ? strapiProjects.get(fpmProjectId) : null;
3713
+ if (strapiProject) {
3714
+ var _strapiProject$attrib;
3715
+ feature.properties = _extends({}, feature.properties, {
3716
+ slug: strapiProject.attributes.slug || undefined,
3717
+ portfolioHost: ((_strapiProject$attrib = strapiProject.attributes.portfolio) == null || (_strapiProject$attrib = _strapiProject$attrib.data) == null ? void 0 : _strapiProject$attrib.attributes.host) || undefined
3718
+ });
3719
+ }
3720
+ return feature;
3721
+ });
3722
+ return _context.abrupt("return", featureCollection);
3723
+ case 16:
3724
+ case "end":
3725
+ return _context.stop();
3726
+ }
3727
+ }, _callee);
3728
+ }));
3729
+ return function getPortfolioProjectsByBbox(_x, _x2, _x3) {
3730
+ return _ref.apply(this, arguments);
3731
+ };
3732
+ }();
3755
3733
 
3756
- var _templateObject$3;
3734
+ var projectPinImage = 'https://cdn.jsdelivr.net/npm/@phosphor-icons/core@2.0.2/assets/fill/map-pin-fill.svg';
3757
3735
  mapboxgl__default.default.accessToken = MAPBOX_TOKEN;
3736
+ var FALLBACK_BBOX = '-1.9950830850086163,44.4464186384987,21.995083085002875,54.12644342419196';
3758
3737
  var ProjectsMap = function ProjectsMap(_ref) {
3759
- var slice = _ref.slice,
3760
- projects = _ref.projects;
3738
+ var slice = _ref.slice;
3761
3739
  var _useContext = React.useContext(IntlContext),
3762
- locale = _useContext.locale;
3763
- var filteredProjects = projects.filter(function (project) {
3764
- return project.geom;
3765
- });
3766
- var center = slice.defaultCenterCoordinates ? [slice.defaultCenterCoordinates.longitude, slice.defaultCenterCoordinates.latitude] : undefined;
3767
- var bounds = center ? undefined : mergeBoundingBoxes(filteredProjects.map(function (p) {
3768
- return [].concat(p.geom.coordinates.map(function (c) {
3769
- return c - 0.2;
3770
- }), p.geom.coordinates.map(function (c) {
3771
- return c + 0.2;
3772
- }));
3773
- }));
3740
+ locale = _useContext.locale,
3741
+ formatMessage = _useContext.formatMessage;
3774
3742
  var mapContainer = React.useRef(null);
3775
- React.useEffect(function () {
3776
- var map = new mapboxgl.Map({
3777
- container: mapContainer.current || '',
3778
- style: MapBoxStyle.CaliTerrain,
3779
- center: center,
3780
- zoom: slice.defaultZoomLevel || MAPBOX_INITIAL_ZOOM,
3781
- maxZoom: MAPBOX_MAX_ZOOM,
3782
- bounds: bounds
3743
+ var map = React.useRef(null);
3744
+ var animationIntervalRef = React.useRef(null);
3745
+ var _useState = React.useState(null),
3746
+ featureCollection = _useState[0],
3747
+ setFeatureCollection = _useState[1];
3748
+ var _useState2 = React.useState(false),
3749
+ isLoading = _useState2[0],
3750
+ setIsLoading = _useState2[1];
3751
+ var initialBboxRef = React.useRef(null);
3752
+ var _useState3 = React.useState(false),
3753
+ isMapReady = _useState3[0],
3754
+ setIsMapReady = _useState3[1];
3755
+ var _useState4 = React.useState(null),
3756
+ userLocation = _useState4[0],
3757
+ setUserLocation = _useState4[1];
3758
+ var isBboxContained = React.useCallback(function (innerBbox, outerBbox) {
3759
+ var _innerBbox$split$map = innerBbox.split(',').map(Number),
3760
+ innerWest = _innerBbox$split$map[0],
3761
+ innerSouth = _innerBbox$split$map[1],
3762
+ innerEast = _innerBbox$split$map[2],
3763
+ innerNorth = _innerBbox$split$map[3];
3764
+ var _outerBbox$split$map = outerBbox.split(',').map(Number),
3765
+ outerWest = _outerBbox$split$map[0],
3766
+ outerSouth = _outerBbox$split$map[1],
3767
+ outerEast = _outerBbox$split$map[2],
3768
+ outerNorth = _outerBbox$split$map[3];
3769
+ return innerWest >= outerWest && innerEast <= outerEast && innerSouth >= outerSouth && innerNorth <= outerNorth;
3770
+ }, []);
3771
+ var fetchProjectsData = React.useCallback(/*#__PURE__*/function () {
3772
+ var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee(bbox) {
3773
+ var data;
3774
+ return _regeneratorRuntime().wrap(function _callee$(_context) {
3775
+ while (1) switch (_context.prev = _context.next) {
3776
+ case 0:
3777
+ setIsLoading(true);
3778
+ _context.prev = 1;
3779
+ _context.next = 4;
3780
+ return getPortfolioProjectsByBbox(bbox);
3781
+ case 4:
3782
+ data = _context.sent;
3783
+ setFeatureCollection(data);
3784
+ _context.next = 11;
3785
+ break;
3786
+ case 8:
3787
+ _context.prev = 8;
3788
+ _context.t0 = _context["catch"](1);
3789
+ console.error('Error fetching projects:', _context.t0);
3790
+ case 11:
3791
+ _context.prev = 11;
3792
+ setIsLoading(false);
3793
+ return _context.finish(11);
3794
+ case 14:
3795
+ case "end":
3796
+ return _context.stop();
3797
+ }
3798
+ }, _callee, null, [[1, 8, 11, 14]]);
3799
+ }));
3800
+ return function (_x) {
3801
+ return _ref2.apply(this, arguments);
3802
+ };
3803
+ }(), []);
3804
+ var debouncedUpdateBbox = React.useCallback(debounce__default.default(function () {
3805
+ if (!map.current || !initialBboxRef.current) return;
3806
+ var bounds = map.current.getBounds();
3807
+ var newBbox = bounds.getWest() + "," + bounds.getSouth() + "," + bounds.getEast() + "," + bounds.getNorth();
3808
+ if (!isBboxContained(newBbox, initialBboxRef.current)) {
3809
+ fetchProjectsData(newBbox);
3810
+ initialBboxRef.current = newBbox;
3811
+ }
3812
+ }, 500), [fetchProjectsData, isBboxContained]);
3813
+ var addProjectsLayer = React.useCallback(function () {
3814
+ if (!map.current || !featureCollection || !map.current.isStyleLoaded()) {
3815
+ return;
3816
+ }
3817
+ var filteredFeatureCollection = _extends({}, featureCollection, {
3818
+ features: featureCollection.features.filter(function (feature) {
3819
+ var _feature$properties;
3820
+ return ((_feature$properties = feature.properties) == null ? void 0 : _feature$properties.isPublic) !== false;
3821
+ })
3783
3822
  });
3784
- filteredProjects
3785
- // Sort by longitude, so that the markers are rendeed form right to left
3786
- .sort(function (a, b) {
3787
- return b.geom.coordinates[0] - a.geom.coordinates[0];
3788
- }).forEach(function (project) {
3789
- var _project$projectDevel;
3790
- var ref = React.createRef();
3791
- ref.current = document.createElement('div');
3792
- client.createRoot(ref.current).render(React__default.default.createElement(MinimalProviders, {
3793
- locale: locale
3794
- }, React__default.default.createElement(MapMarker, {
3795
- title: project.friendlyName || project.title,
3796
- isPublic: project.isPublic,
3797
- portfolioHost: project.portfolioHost,
3798
- slug: project.slug,
3799
- creditAvailability: project.creditAvailability,
3800
- projectDeveloper: (_project$projectDevel = project.projectDeveloper) == null ? void 0 : _project$projectDevel.name
3801
- })));
3802
- // Offset is needed to center the marker on the coordinates
3803
- var marker = new mapboxgl.Marker(ref.current, {
3804
- offset: [-20, -40]
3823
+ var source = map.current.getSource('projects');
3824
+ if (!source) {
3825
+ map.current.addSource('projects', {
3826
+ type: 'geojson',
3827
+ data: filteredFeatureCollection,
3828
+ cluster: true,
3829
+ clusterMaxZoom: 14,
3830
+ clusterRadius: 50
3831
+ });
3832
+ map.current.addLayer({
3833
+ id: 'clusters',
3834
+ type: 'circle',
3835
+ source: 'projects',
3836
+ filter: ['has', 'point_count'],
3837
+ paint: {
3838
+ 'circle-color': ['step', ['get', 'point_count'], '#51bbd6', 2, '#2A3FBA'],
3839
+ 'circle-radius': ['step', ['get', 'point_count'], 20, 10, 30, 30, 40],
3840
+ 'circle-radius-transition': {
3841
+ duration: 300
3842
+ },
3843
+ 'circle-stroke-width': 5,
3844
+ 'circle-stroke-color': '#2A3FBA',
3845
+ 'circle-stroke-opacity': 0.4
3846
+ }
3847
+ });
3848
+ if (animationIntervalRef.current) {
3849
+ clearInterval(animationIntervalRef.current);
3850
+ }
3851
+ animationIntervalRef.current = setInterval(function () {
3852
+ if (!map.current) return;
3853
+ var now = Date.now() / 1000;
3854
+ var pulseFactor = 1 + 0.05 * Math.sin(now * 2 * Math.PI / 2.8);
3855
+ var expression = ['step', ['get', 'point_count'], 20 * pulseFactor, 10, 30 * pulseFactor, 30, 40 * pulseFactor];
3856
+ map.current.setPaintProperty('clusters', 'circle-radius', expression);
3857
+ }, 50);
3858
+ map.current.addLayer({
3859
+ id: 'cluster-count',
3860
+ type: 'symbol',
3861
+ source: 'projects',
3862
+ filter: ['has', 'point_count'],
3863
+ layout: {
3864
+ 'text-field': '{point_count_abbreviated}',
3865
+ 'text-font': ['DIN Offc Pro Medium', 'Arial Unicode MS Bold'],
3866
+ 'text-size': 12
3867
+ },
3868
+ paint: {
3869
+ 'text-color': '#fff'
3870
+ }
3871
+ });
3872
+ // Load SVG as PNG
3873
+ fetch(projectPinImage).then(function (response) {
3874
+ return response.text();
3875
+ }).then(function (svgText) {
3876
+ // Modify SVG color
3877
+ var modifiedSvg = svgText.replace(/fill="[^"]*"/, "fill=\"#2A3FBA\"");
3878
+ var img = new Image();
3879
+ img.src = "data:image/svg+xml;base64," + btoa(modifiedSvg);
3880
+ return new Promise(function (resolve, reject) {
3881
+ img.onload = function () {
3882
+ return resolve(img);
3883
+ };
3884
+ img.onerror = reject;
3885
+ });
3886
+ }).then(function (img) {
3887
+ if (!map.current) return;
3888
+ var canvas = document.createElement('canvas');
3889
+ canvas.width = 80;
3890
+ canvas.height = 80;
3891
+ var ctx = canvas.getContext('2d');
3892
+ if (!ctx) return;
3893
+ ctx.drawImage(img, 10, 10, 60, 60);
3894
+ var pngImg = new Image();
3895
+ pngImg.src = canvas.toDataURL('image/png');
3896
+ pngImg.onload = function () {
3897
+ var _map$current, _map$current2;
3898
+ (_map$current = map.current) == null || _map$current.addImage('project-pin', pngImg, {
3899
+ pixelRatio: 2
3900
+ });
3901
+ (_map$current2 = map.current) == null || _map$current2.addLayer({
3902
+ id: 'unclustered-point',
3903
+ type: 'symbol',
3904
+ source: 'projects',
3905
+ filter: ['!', ['has', 'point_count']],
3906
+ layout: {
3907
+ 'icon-image': 'project-pin'
3908
+ }
3909
+ });
3910
+ };
3911
+ })["catch"](function (error) {
3912
+ console.error('Error loading project pin image:', error);
3913
+ });
3914
+ var popup = new mapboxgl__default.default.Popup({
3915
+ closeButton: true,
3916
+ closeOnClick: false,
3917
+ className: 'custom-popup',
3918
+ offset: [0, -20]
3805
3919
  });
3806
- // No chaining here, because the mocks don't support it
3807
- marker.setLngLat(project.geom.coordinates);
3808
- marker.addTo(map);
3920
+ var style = document.createElement('style');
3921
+ style.textContent = "\n .custom-popup .mapboxgl-popup-content {\n border-radius: 8px;\n padding: 12px;\n box-shadow: 0 2px 4px rgba(0,0,0,0.2);\n background: white;\n color: #333;\n }\n .mapboxgl-popup {\n max-width: 300px !important;\n }\n .mapboxgl-popup-close-button {\n padding: 4px 8px;\n font-size: 16px;\n color: #666;\n }\n .mapboxgl-popup-close-button:hover {\n background: #f0f0f0;\n color: #333;\n }\n ";
3922
+ document.head.appendChild(style);
3923
+ map.current.on('click', 'unclustered-point', function (e) {
3924
+ if (!e.features || !e.features[0].properties) return;
3925
+ map.current.getCanvas().style.cursor = 'pointer';
3926
+ var coordinates = e.features[0].geometry.coordinates.slice();
3927
+ var _e$features$0$propert = e.features[0].properties,
3928
+ title = _e$features$0$propert.title,
3929
+ projectDeveloper = _e$features$0$propert.projectDeveloper,
3930
+ slug = _e$features$0$propert.slug,
3931
+ portfolioHost = _e$features$0$propert.portfolioHost,
3932
+ creditAvailability = _e$features$0$propert.creditAvailability;
3933
+ // Calculate if popup would go off screen at the top
3934
+ var point = map.current.project(coordinates);
3935
+ var popupHeight = 150; // Approximate height of popup
3936
+ var offset = point.y - popupHeight - 20 < 0 ? [0, 20] : [0, -20];
3937
+ var developer = 'Unknown';
3938
+ try {
3939
+ var projectDeveloperRaw = projectDeveloper;
3940
+ if (projectDeveloperRaw) {
3941
+ var _JSON$parse$name, _JSON$parse;
3942
+ developer = (_JSON$parse$name = (_JSON$parse = JSON.parse(projectDeveloperRaw)) == null ? void 0 : _JSON$parse.name) != null ? _JSON$parse$name : 'Unknown';
3943
+ }
3944
+ } catch (_unused) {
3945
+ developer = 'Unknown';
3946
+ }
3947
+ var projectUrl = slug && portfolioHost ? portfolioHost + "/portfolio/" + slug : null;
3948
+ console.log('projectUrl', projectUrl);
3949
+ console.log('slug', slug);
3950
+ console.log('portfolioHost', portfolioHost);
3951
+ var getBadgeMessage = function getBadgeMessage(status) {
3952
+ switch (status) {
3953
+ case CreditAvailability.CREDITS_AVAILABLE:
3954
+ return formatMessage({
3955
+ id: 'components.creditsAvailableBadge.text.yes'
3956
+ });
3957
+ case CreditAvailability.NO_CREDITS_AVAILABLE:
3958
+ return formatMessage({
3959
+ id: 'components.creditsAvailableBadge.text.no'
3960
+ });
3961
+ case CreditAvailability.SOME_CREDITS_AVAILABLE:
3962
+ return formatMessage({
3963
+ id: 'components.creditsAvailableBadge.text.some'
3964
+ });
3965
+ case CreditAvailability.SOON_CREDITS_AVAILABLE:
3966
+ return formatMessage({
3967
+ id: 'components.creditsAvailableBadge.text.notYet'
3968
+ });
3969
+ default:
3970
+ return '';
3971
+ }
3972
+ };
3973
+ var getBadgeColor = function getBadgeColor(status) {
3974
+ switch (status) {
3975
+ case CreditAvailability.CREDITS_AVAILABLE:
3976
+ return '#15803d';
3977
+ case CreditAvailability.NO_CREDITS_AVAILABLE:
3978
+ return '#b91c1c';
3979
+ case CreditAvailability.SOME_CREDITS_AVAILABLE:
3980
+ return '#ea580c';
3981
+ case CreditAvailability.SOON_CREDITS_AVAILABLE:
3982
+ return '#2563eb';
3983
+ default:
3984
+ return '#e0e7ff';
3985
+ }
3986
+ };
3987
+ var badgeColor = getBadgeColor(creditAvailability);
3988
+ var badgeMessage = getBadgeMessage(creditAvailability);
3989
+ var badge = projectUrl ? "<a href=\"" + projectUrl + "\" target=\"_blank\" rel=\"noopener\" style=\"text-decoration: none;\"><span style=\"display: inline-block; background: " + badgeColor + "; color: white; font-weight: 600; border-radius: 4px; padding: 2px 8px; font-size: 12px; margin-bottom: 6px; cursor: pointer;\">" + badgeMessage + "</span></a>" : "<span style=\"display: inline-block; background: " + badgeColor + "; color: white; font-weight: 600; border-radius: 4px; padding: 2px 8px; font-size: 12px; margin-bottom: 6px;\">" + badgeMessage + "</span>";
3990
+ var button = projectUrl ? "<a href=\"" + projectUrl + "\" target=\"_blank\" rel=\"noopener\" style=\"display: inline-block; margin-top: 12px; padding: 4px 8px; border: 1px solid #e2e8f0; border-radius: 4px; background: #fff; font-size: 14px; font-weight: 700; text-decoration: none;\">Show more info</a>" : '';
3991
+ var description = "\n <div style=\"padding: 2px; padding-right: 16px; min-width: 180px; max-width: 260px;\">\n " + badge + "\n <h3 style=\"font-size: 15px; font-weight: bold;\">" + title + "</h3>\n <p style=\"font-size: 15px; color: #64748b;\">" + developer + "</p>\n " + button + "\n </div>\n ";
3992
+ while (Math.abs(e.lngLat.lng - coordinates[0]) > 180) {
3993
+ coordinates[0] += e.lngLat.lng > coordinates[0] ? 360 : -360;
3994
+ }
3995
+ popup.setOffset(offset).setLngLat(coordinates).setHTML(description).addTo(map.current);
3996
+ });
3997
+ map.current.on('click', 'clusters', function (e) {
3998
+ var _map$current3, _map$current4;
3999
+ var features = (_map$current3 = map.current) == null ? void 0 : _map$current3.queryRenderedFeatures(e.point, {
4000
+ layers: ['clusters']
4001
+ });
4002
+ if (!features || !features[0].properties) return;
4003
+ var clusterId = features[0].properties.cluster_id;
4004
+ var projectSource = (_map$current4 = map.current) == null ? void 0 : _map$current4.getSource('projects');
4005
+ projectSource.getClusterExpansionZoom(clusterId, function (err, zoom) {
4006
+ if (err || !map.current) return;
4007
+ var coordinates = features[0].geometry.coordinates;
4008
+ map.current.easeTo({
4009
+ center: coordinates,
4010
+ zoom: zoom
4011
+ });
4012
+ });
4013
+ });
4014
+ map.current.on('mouseenter', 'clusters', function () {
4015
+ if (map.current) map.current.getCanvas().style.cursor = 'pointer';
4016
+ });
4017
+ map.current.on('mouseleave', 'clusters', function () {
4018
+ if (map.current) map.current.getCanvas().style.cursor = '';
4019
+ });
4020
+ map.current.on('mouseenter', 'unclustered-point', function () {
4021
+ if (map.current) map.current.getCanvas().style.cursor = 'pointer';
4022
+ });
4023
+ map.current.on('mouseleave', 'unclustered-point', function () {
4024
+ if (map.current) map.current.getCanvas().style.cursor = '';
4025
+ });
4026
+ } else {
4027
+ source.setData(filteredFeatureCollection);
4028
+ }
4029
+ }, [featureCollection, locale, formatMessage]);
4030
+ React.useEffect(function () {
4031
+ if (map.current || !mapContainer.current) return;
4032
+ var initialCenter;
4033
+ var initialZoom;
4034
+ if (slice.defaultCenterCoordinates && slice.defaultZoomLevel) {
4035
+ initialCenter = [slice.defaultCenterCoordinates.longitude, slice.defaultCenterCoordinates.latitude];
4036
+ initialZoom = slice.defaultZoomLevel;
4037
+ } else if (userLocation) {
4038
+ initialCenter = [userLocation.lon, userLocation.lat];
4039
+ initialZoom = 10;
4040
+ } else {
4041
+ var bbox = initialBboxRef.current || FALLBACK_BBOX;
4042
+ var _bbox$split$map = bbox.split(',').map(Number),
4043
+ west = _bbox$split$map[0],
4044
+ south = _bbox$split$map[1],
4045
+ east = _bbox$split$map[2],
4046
+ north = _bbox$split$map[3];
4047
+ var bounds = new mapboxgl__default.default.LngLatBounds([west, south], [east, north]);
4048
+ var center = bounds.getCenter();
4049
+ initialCenter = [center.lng, center.lat];
4050
+ initialZoom = 6;
4051
+ }
4052
+ map.current = new mapboxgl__default.default.Map({
4053
+ container: mapContainer.current,
4054
+ style: 'mapbox://styles/mapbox/streets-v12',
4055
+ center: initialCenter,
4056
+ zoom: initialZoom,
4057
+ maxZoom: MAPBOX_MAX_ZOOM
4058
+ });
4059
+ map.current.addControl(new mapboxgl__default.default.NavigationControl(), 'top-right');
4060
+ map.current.on('load', function () {
4061
+ setIsMapReady(true);
4062
+ if (!(slice.defaultCenterCoordinates && slice.defaultZoomLevel) && !userLocation) {
4063
+ var _map$current5;
4064
+ var _bbox = initialBboxRef.current || FALLBACK_BBOX;
4065
+ var _bbox$split$map2 = _bbox.split(',').map(Number),
4066
+ _west = _bbox$split$map2[0],
4067
+ _south = _bbox$split$map2[1],
4068
+ _east = _bbox$split$map2[2],
4069
+ _north = _bbox$split$map2[3];
4070
+ var _bounds = new mapboxgl__default.default.LngLatBounds([_west, _south], [_east, _north]);
4071
+ (_map$current5 = map.current) == null || _map$current5.fitBounds(_bounds, {
4072
+ padding: 20
4073
+ });
4074
+ }
4075
+ });
4076
+ map.current.on('moveend', function () {
4077
+ if (initialBboxRef.current) {
4078
+ debouncedUpdateBbox();
4079
+ }
3809
4080
  });
3810
- // Clean up on unmount
3811
4081
  return function () {
3812
- return map.remove();
4082
+ var _map$current6;
4083
+ debouncedUpdateBbox.cancel();
4084
+ if (animationIntervalRef.current) {
4085
+ clearInterval(animationIntervalRef.current);
4086
+ }
4087
+ (_map$current6 = map.current) == null || _map$current6.remove();
4088
+ map.current = null;
3813
4089
  };
3814
- }, [locale]);
4090
+ }, [slice.defaultCenterCoordinates, slice.defaultZoomLevel, userLocation, debouncedUpdateBbox]);
4091
+ React.useEffect(function () {
4092
+ if (slice.defaultCenterCoordinates && slice.defaultZoomLevel) {
4093
+ var _slice$defaultCenterC = slice.defaultCenterCoordinates,
4094
+ latitude = _slice$defaultCenterC.latitude,
4095
+ longitude = _slice$defaultCenterC.longitude;
4096
+ var buffer = 10;
4097
+ var bbox = longitude - buffer + "," + (latitude - buffer) + "," + (longitude + buffer) + "," + (latitude + buffer);
4098
+ initialBboxRef.current = bbox;
4099
+ fetchProjectsData(bbox);
4100
+ } else if (navigator.geolocation) {
4101
+ navigator.geolocation.getCurrentPosition(function (position) {
4102
+ var userLoc = {
4103
+ lat: position.coords.latitude,
4104
+ lon: position.coords.longitude
4105
+ };
4106
+ setUserLocation(userLoc);
4107
+ var buffer = 1;
4108
+ var bbox = userLoc.lon - buffer + "," + (userLoc.lat - buffer) + "," + (userLoc.lon + buffer) + "," + (userLoc.lat + buffer);
4109
+ initialBboxRef.current = bbox;
4110
+ fetchProjectsData(bbox);
4111
+ }, function () {
4112
+ setUserLocation(null);
4113
+ initialBboxRef.current = FALLBACK_BBOX;
4114
+ fetchProjectsData(FALLBACK_BBOX);
4115
+ });
4116
+ } else {
4117
+ setUserLocation(null);
4118
+ initialBboxRef.current = FALLBACK_BBOX;
4119
+ fetchProjectsData(FALLBACK_BBOX);
4120
+ }
4121
+ }, [slice.defaultCenterCoordinates, slice.defaultZoomLevel, fetchProjectsData]);
4122
+ React.useEffect(function () {
4123
+ var _map$current7;
4124
+ if (isMapReady && featureCollection && (_map$current7 = map.current) != null && _map$current7.isStyleLoaded()) {
4125
+ addProjectsLayer();
4126
+ }
4127
+ }, [isMapReady, featureCollection, addProjectsLayer]);
3815
4128
  return React__default.default.createElement(boemly.DefaultSectionContainer, null, React__default.default.createElement(boemly.Box, {
3816
4129
  css: mapboxStyle
3817
4130
  }, React__default.default.createElement(boemly.Wrapper, null, slice.title ? React__default.default.createElement(React__default.default.Fragment, null, React__default.default.createElement(boemly.DefaultSectionHeader, {
@@ -3838,9 +4151,8 @@ var ProjectsMap = function ProjectsMap(_ref) {
3838
4151
  ref: mapContainer,
3839
4152
  borderRadius: "xl",
3840
4153
  overflow: "hidden",
3841
- boxShadow: ['md', null, null, 'none'],
3842
- css: react$1.css(_templateObject$3 || (_templateObject$3 = _taggedTemplateLiteralLoose(["\n mask-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC);\n "])))
3843
- }))));
4154
+ boxShadow: ['md', null, null, 'none']
4155
+ }), React__default.default.createElement(React__default.default.Fragment, null, isLoading && React__default.default.createElement(boemly.Box, null, "Loading projects...")))));
3844
4156
  };
3845
4157
 
3846
4158
  var Video = function Video(_ref) {
@@ -6912,8 +7224,7 @@ var SliceRenderer = function SliceRenderer(_ref) {
6912
7224
  case 'sections.projects-map':
6913
7225
  return React__default.default.createElement(ProjectsMap, {
6914
7226
  key: slice.__component + "-" + slice.id,
6915
- slice: slice,
6916
- projects: projects
7227
+ slice: slice
6917
7228
  });
6918
7229
  case 'sections.video':
6919
7230
  return React__default.default.createElement(Video, {