body {
}
/*
=====================================
Personalizamos el mapa
=====================================
*/
/*
#map{
    width: 100%;
    height: 100%;
    margin:0px;
}

body,html{
    height:100%;
    overflow:hidden;
    margin:0px;
}
*/

/*
=====================================
Personalizamos el mapa de referencia
=====================================
*/
.ol-custom-overviewmap{
    left: 8px; 
    top: 70px;
    right: auto;
    bottom: auto; 

}
.ol-custom-overviewmap .ol-overviewmap-map {
    width: 300px;
}
.ol-custom-overviewmap .ol-overviewmap-box {
    border: 2px solid red;
}


/*
=====================================
Personalizamos el layerSwitcher
=====================================
*/
.layer-switcher {
    top: 40px;
    right: 5px;
}
.layer-switcher ul {
    padding-left: 0em;
}

.layer-switcher li.group {
    padding-left: 15px;
}
.layer-switcher li.group > label {
    font-family: 'Arial';
    font-size: 14px;
    color: rgba(0,60,136,.8);
}
.layer-switcher li.layer label, .layer-switcher li.layer input {
    font-family: 'Arial';
    font-size: 12px;   
    padding-left: 5px;
}

/*
=====================================
Personalizamos el mouse-position
=====================================
*/
#mouse-position{
    
    background: rgba(0,60,136,.4);
    top: 8px;
    right: 40px;
    padding: 1px;
    position: absolute;    
    border: 2px solid #eee;
    border-radius: 3px;    
    
    width: 180px;
    height: 25px;
    
    font-family: 'Arial';
    z-index: 999;
    font-size: 14px;
    color:white;
    text-align: center;
}



/*
=====================================
Personalizamos el scale-line
=====================================
*/
.ol-scale-line {
    padding: 1px;
    background: rgba(0,60,136,.4);
    border: 2px solid #eee;
    border-radius: 3px;      
}
.ol-scale-line-inner {
    border: 1px solid black;
    border-top: none;
    color: white;
    font-family: 'Arial';
    font-size: 12px;
}

/*
=====================================
Personalizamos el popup
=====================================
*/
.ol-popup {
    position: absolute;
    background-color: white;
    -webkit-filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0..2));
    filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0..2));
    padding: 15px;
    border-radius: 10px;
    border: 1px solid #cccccc;
    bottom: 12px;
    left: -250px;
    width: 500px;
    height: 525px;
}
.ol-popup:after, .ol-popup:before {
    top: 100%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}
.ol-popup:after {
    border-top-color: white;
    border-width: 10px;
    left: 250px;
    margin-left: -10px;
}
.ol-popup:before {
    border-top-color: #cccccc;
    border-width: 11px;
    left: 250px;
    margin-left: -11px;
}
div#popup {
    padding: 0px;
    background-color: #fff;
}    

/* Afegit */
#map{
    position: relative;
}

#BtnAgrupar{
    position: absolute;
    bottom: 10rem;
    right: 0.6rem;
    z-index: 999;
}

#info{
    position: absolute;
    bottom: 0.5rem;
    z-index: 999;
    right: 0.6rem;
}