.ol-control{
    padding: 0px;
    background-color: var(--vcolor-main);
    color: white;
    background-color: var(--vcolor-main);
}

.ol-control:hover {
    background-color:  var(--vcolor-main);
}

.ol-mouse-position-custom {
	bottom: 8px;
    left: 160px;
    height:18px;
	color: white;
    background-color: var(--vcolor-main);
	position:absolute;
	border-radius: 4px;
}

.ol-control button, .ol-control button:focus, .ol-zoom .ol-zoom-out, .ol-zoom .ol-zoom-in {
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	margin: 4px;
	font-size: 18px;
	border-radius: 4px;
	background: var(--vcolor-main);
	color: white;
}

.ol-mouse-position-custom, .ol-scale-line {
	background: var(--vcolor-main);
	font-weight: bold;	
}


.ol-mouse-position-custom {
	left: 8px;
}

.ol-control button:hover {
	color: var(--vcolor-main);
	background: white;
}

.ol-attribution:not(.ol-collapsed) {
    background: rgba(255, 255, 255, .7);
}

.ol-custom-control {
	right: 8px;
	top: 52px;
}

.ol-action-control {
	left: 8px;
	bottom: 8px;
	background: white;
}

.ol-action-control:hover {
	background: white;
}

.ol-action-control-item {
	display: none !important;
	width: calc(100% - 8px) !important;
	background: white !important;
	color: var(--secondary-color) !important;
	font-size: 1rem !important;
	padding-left: 8px !important;
	justify-content: start !important;
}

.ol-action-control-item:hover {
	background: var(--secondary-color) !important;
	color: white !important;
}

.ol-layer-control {
	left: 8px;
	top: 84px;
}

.ol-cobertura-control2G {
	left: 8px;
	top: 160px;
}

.ol-cobertura-control2G button {
	display: none;
	vertical-align: middle;
}

.ol-cobertura-control2G button:not(:first-child) {
	color: var(--vcolor-main);
	background: white;
}

.ol-cobertura-control2G button:not(:first-child):hover {
	background: #AAAAAA;
}

.ol-cobertura-control4G {
	left: 8px;
	top: 192px;
}

.ol-cobertura-control4G button {
	display: none;
	vertical-align: middle;
}

.ol-cobertura-control4G button:not(:first-child) {
	color: var(--vcolor-main);
	background: white;
}

.ol-cobertura-control4G button:not(:first-child):hover {
	background: #AAAAAA;
}

.popover{
    position:absolute;
    top:0;
    left:0;
    z-index:1060;
    display:none;
    max-width:400px;
/*     padding:1px; */
/*     font-style:normal; */
/*     font-weight:400; */
/*     line-height:1.42857143; */
/*     line-break:auto; */
/*     text-align:left; */
/*     text-align:start; */
/*     text-decoration:none; */
/*     text-shadow:none; */
/*     text-transform:none; */
/*     letter-spacing:normal; */
/*     word-break:normal; */
/*     word-spacing:normal; */
/*     word-wrap:normal; */
/*     white-space:normal; */
/*     font-size:14px; */
    background-color:#fff;
/*     background-clip:padding-box; */
/*     border:1px solid #ccc; */
/*     border:1px solid rgba(0,0,0,.2); */
    border-radius:6px;
    box-shadow:0 5px 10px rgba(0,0,0,.2);
    padding:8px;
}
.popover.top{
    margin-top:-10px
}
.popover.right{
    margin-left:10px
}
.popover.bottom{
    margin-top:10px
}
.popover.left{
    margin-left:-10px
}
.popover>.arrow{
    border-width:11px
}
.popover>.arrow,.popover>.arrow:after{
    position:absolute;
    display:block;
    width:0;
    height:0;
    border-color:transparent;
    border-style:solid
}
.popover>.arrow:after{
    content:"";
    border-width:10px
}
.popover.top>.arrow{
    bottom:-11px;
    left:50%;
    margin-left:-11px;
    border-top-color:#999;
    border-top-color:rgba(0,0,0,.25);
    border-bottom-width:0
}
.popover.top>.arrow:after{
    bottom:1px;
    margin-left:-10px;
    content:" ";
    border-top-color:#fff;
    border-bottom-width:0
}
.popover.right>.arrow{
    top:50%;
    left:-11px;
    margin-top:-11px;
    border-right-color:#999;
    border-right-color:rgba(0,0,0,.25);
    border-left-width:0
}
.popover.right>.arrow:after{
    bottom:-10px;
    left:1px;
    content:" ";
    border-right-color:#fff;
    border-left-width:0
}
.popover.bottom>.arrow{
    top:-11px;
    left:50%;
    margin-left:-11px;
    border-top-width:0;
    border-bottom-color:#999;
    border-bottom-color:rgba(0,0,0,.25)
}
.popover.bottom>.arrow:after{
    top:1px;
    margin-left:-10px;
    content:" ";
    border-top-width:0;
    border-bottom-color:#fff
}
.popover.left>.arrow{
    top:50%;
    right:-11px;
    margin-top:-11px;
    border-right-width:0;
    border-left-color:#999;
    border-left-color:rgba(0,0,0,.25)
}
.popover.left>.arrow:after{
    right:1px;
    bottom:-10px;
    content:" ";
    border-right-width:0;
    border-left-color:#fff
}
.popover-title{
	padding:8px 8px;
    margin:0;
    font-weight: 600;
    font-size: 1rem;
    line-height: 1.5rem;
    color: white;
    border-radius:4px 4px;
    background-image: linear-gradient(to right, var(--tw-gradient-stops));
    --tw-gradient-from: var(--primary-color) var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
    --tw-gradient-to: var(--secondary-color) var(--tw-gradient-to-position);
}

.popover-content{
	padding: 8px;
	font-size: 12px !important;
}

.popover-item {
	display: block;	
}
.popover-item-label {
	display: inline-block;
	width: 80px;
	color: var(--text-color-placeholder);
}

.popover-item-value {
	display: inline-block;
	font-weight: 700;
}

.fade{
    opacity:0;
    -webkit-transition:opacity .15s linear;
    -o-transition:opacity .15s linear;
    transition:opacity .15s linear
}
.fade.in{
    opacity:1
}