utopia-ui/src/Components/Map/UtopiaMap.css

.leaflet-container {
    text-align: left;
    background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' stroke='%23000' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cstyle%3E.spinner_V8m1%7Btransform-origin:center;animation:spinner_zKoa 2s linear infinite%7D.spinner_V8m1 circle%7Bstroke-linecap:round;animation:spinner_YpZS 1.5s ease-out infinite%7D%40keyframes spinner_zKoa%7B100%25%7Btransform:rotate(360deg)%7D%7D%40keyframes spinner_YpZS%7B0%25%7Bstroke-dasharray:0 150;stroke-dashoffset:0%7D47.5%25%7Bstroke-dasharray:42 150;stroke-dashoffset:-16%7D95%25%2C100%25%7Bstroke-dasharray:42 150;stroke-dashoffset:-59%7D%7D%3C%2Fstyle%3E%3Cg class='spinner_V8m1'%3E%3Ccircle cx='12' cy='12' r='9.5' fill='none' stroke-width='3'%3E%3C%2Fcircle%3E%3C%2Fg%3E%3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: 50% 80%; 
  }
  
  input {
    box-sizing: border-box;
  }
  
  textarea {
    box-sizing: border-box;
  }
  
  .leaflet-control-attribution {
    display: none;
   }
  
  .leaflet-control-locate {
    display: none;
  }

  .leaflet-data-marker {
  
    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACMAAAAQCAYAAACcN8ZaAAAB3klEQVR42s3U4UdDURzG8czMXJnJ1Vwzc6VJZjaZJdlMlpQsKdmUFNOUspRSSqUolfQfr+fF98Vx5mwv9qbDx7LdznnO7/7Omej3+/+Ga0QMUYkhbvBgmhzCQxwxibIGrGEF8CQhU+LLtKQkQNqScUgjxRxTBIxbgfgD/BgnhM8kM5KTeclLQYqGkkMRBckzR8ic/mAgd5BAZplsUaqyIg2sDtHg2brUZJk5SmwopErJUWE8SpmTMhNvya60Zd/SNrR4bkeaskG4uiwRZk6yrJEYFibGAxn+scECHTmTnuVCzvmty3PHciB7bGKN6lQkzysPqIrHmpFhYbKUtckC1/Ioz4ZHuZdbuSLYiRxRpSZVWXZVxAzC0R4Ik5SQsu6w8yd5l2/5kg95I9SdXMoZQfYIUjeqEUrgOkXGPeN4TYRhxy8E+ZUf+eS7B7miIoeybVSjKDnm8u3+gH3pDTYwu1igATvs/pXqvBKiR4i2bNJfi1ZfUAnjgrOG8wY2quNzBKuU/ZS+uSFEl5O0xRGuUIlZCcw7xG5QPkeHYUSNV5WXGou2sC3rBC0LjenqCXGO0WEiTJa0Lr4KixdHBrDGuGGiRqCUpFk8pGIpQtCU7p4YPwxYxEMCk1aAMQZh8Ac8PfbIzYPJOwAAAABJRU5ErkJggg==') no-repeat;
    background-position: 6px 32px;
  }
  
  .crosshair-cursor-enabled {
    cursor: crosshair;
  }
  
  .leaflet-container {
    cursor: inherit;
  }
  
  .calendar-icon {
    position: relative;
    top: -35px;
    left: 10px;
    width: 13px;
  }
  
  .user-icon {
    position: relative;
    top: -36px;
    left: 10px;
    width: 13px;
  }

  .circle-icon {
    position: relative;
    top: -33px;
    left: 10px;
    width: 13px;
  }

  .fire-icon {
    position: relative;
    top: -36px;
    left: 10px;
    width: 13px;
  }

  .tree-icon {
    position: relative;
    top: -38px;
    left: 4px;
    width: 24px;
  }

  .music-icon {
    position: relative;
    top: -35px;
    left: 4px;
    width: 24px;
  }

  .quest-icon {
    position: relative;
    top: -34px;
    left: 4px;
    width: 24px;
  }

  .drum-icon {
    position: relative;
    top: -38px;
    left: 4px;
    width: 24px;
  }

  
  .compass-icon {
    position: relative;
    top: -36.5px;
    left: 4px;
    width: 24px;
  }

  .group-icon {
    position: relative;
    top: -37px;
    left: 4px;
    width: 24px;
  }

  .liebevoll-jetzt-icon{
    position: relative;
    top: -35px;
    left: 4px;
    width: 24px;
  }

  .staff-snake-icon {
    position: relative;
    top: -36px;
    left: 4px;
    width: 24px;
  }
  
  .leaflet-popup-scrolled {
    overflow-x: hidden;
  }

  .leaflet-popup-content-wrapper, .leaflet-popup-tip{
    background-color: theme('colors.base-100');
    color: theme('colors.base-content');

  }

  .leaflet-tooltip {
    background-color: theme('colors.base-100');
    color: theme('colors.base-content');
    border-width: 0px;
  }

  .leaflet-tooltip {
    border-radius: 1em;
    transition: opacity 500ms;
    transition-delay: 50ms;

  }

  .leaflet-tooltip-top::before {
    border-top-color: theme('colors.base-100');
  }

  .marker-cluster span {
    color: #000;
  }