#map

{

    position: relative;

    height: var(--heightmap);

    width: var(--widthmap);

    margin: auto;

}







#map *

{



    color: black;

}





#map .custom-controlsmap

{

    position: absolute;

    top: 0;

    right: 0;

    display: flex;

    flex-direction: column;

    z-index:2;

    background-color: rgba(50, 50, 50, 0.5);

    padding: 5px;

    text-align: center;

}



#map .custom-controlsmap div.custom-zoom

{

    display: flex;

    flex-direction: column;

    margin-top: 3px;

}

#map #centercoordinate,

#map .custom-controlsmap div.custom-zoom button

{

    margin-bottom: 3px;

}

#map .custom-controlsmap .custom-scaleline,

#map .custom-controlsmap .custom-scaleline div.custom-scaleline-inner

{

    width: max-content!important;

    margin: 0 auto;



}



#map .ol-attribution

{

   

    position: absolute;

    bottom: -24px;

    right: 0;



    

}



#map .ol-attribution button

{

    display: none;

}



#map .ol-attribution ul

{

    list-style: none;

    background-color: rgba(255,255,255,0.5);

    padding: 0 3px;

    width: max-content;

}