body{
	overflow:hidden;
	font-family: "Inter", sans-serif;
	margin:0;
	padding:0;
}

.tooltip .tooltip-inner {
    font-size: 11px;
}

/* Header */

#header-1{
	display:flex;
	align-items:center;
	justify-content:right;
	position:absolute;
	top:0;
	right:0;
	left:0;
	height:50px;
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.dev/svgjs' width='1440' height='560' preserveAspectRatio='none' viewBox='0 0 1440 560'%3e%3cg mask='url(%26quot%3b%23SvgjsMask1014%26quot%3b)' fill='none'%3e%3crect width='1440' height='560' x='0' y='0' fill='rgba(96%2c 186%2c 32%2c 1)'%3e%3c/rect%3e%3cpath d='M1440 0L990.35 0L1440 69.23z' fill='rgba(255%2c 255%2c 255%2c .1)'%3e%3c/path%3e%3cpath d='M990.35 0L1440 69.23L1440 81.99000000000001L681.99 0z' fill='rgba(255%2c 255%2c 255%2c .075)'%3e%3c/path%3e%3cpath d='M681.99 0L1440 81.99000000000001L1440 298.88L670.53 0z' fill='rgba(255%2c 255%2c 255%2c .05)'%3e%3c/path%3e%3cpath d='M670.53 0L1440 298.88L1440 408.11L519.1999999999999 0z' fill='rgba(255%2c 255%2c 255%2c .025)'%3e%3c/path%3e%3cpath d='M0 560L198.87 560L0 285.99z' fill='rgba(0%2c 0%2c 0%2c .1)'%3e%3c/path%3e%3cpath d='M0 285.99L198.87 560L796.27 560L0 137.22z' fill='rgba(0%2c 0%2c 0%2c .075)'%3e%3c/path%3e%3cpath d='M0 137.22000000000003L796.27 560L1061.34 560L0 91.80000000000003z' fill='rgba(0%2c 0%2c 0%2c .05)'%3e%3c/path%3e%3cpath d='M0 91.80000000000001L1061.34 560L1132 560L0 32.22000000000001z' fill='rgba(0%2c 0%2c 0%2c .025)'%3e%3c/path%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask1014'%3e%3crect width='1440' height='560' fill='white'%3e%3c/rect%3e%3c/mask%3e%3c/defs%3e%3c/svg%3e");background-size: cover; 
    background-position: center; 
    background-repeat: no-repeat;  
	z-index:50;
}

#button-menu{
	position:absolute;
	left:0;
    color:#FFFFFF;
    text-decoration:none;
    cursor:pointer;
    font-size:18px;
    font-weight:300;
    padding-left:15px;
    padding-right:15px;
}

#title-1{
	display:flex;
	align-items:center;
	position:absolute;
	margin:0;
	padding:0;
	left:70px;
	color:#FFFFFF;
	font-weight:700;
	font-size:15px;
}

#small-title{
	font-size:11px;
	font-weight:600;
	margin-top:4px;
	margin-left:5px;
}

/* Map */

#map{
	position:absolute;
	top:50px;
	left:0;
	right:0;
	bottom:0;

	z-index:1;
}

/* Control */

#control-right{
	position:absolute;
	bottom:45px;
	right:3px;
	z-index:10;
}

.button-control{
	display:flex;
	align-items:center;
	justify-content:center;
	height:35px;
	width:35px;
	background:rgb(22,26,29,0.8);
	border:0;
	font-size:18px;
	font-weight:300;
	color:#FFFFFF;
	transition:0.1s;
	margin-top:1px;
	border-radius:3px;
	transition:0.1s;
}

.button-control:hover{
	background:rgb(22,26,29,1);
}

#lat-lon{
	display:flex;
	align-items:center;
	justify-content:right;
	position:absolute;
	right:2px;
	bottom:1px;
	z-index:4;
}

#lbl-lat,
#lbl-lon{
	display:flex;
	align-items:center;
	justify-content:center;
	height:22px;
	width:150px;
	background:rgb(28,28,28,0.9);
	font-size:11px;
	color:#FFFFFF;
	margin-left:1px;
}

#scaleline{
	display:flex;
	align-items:center;
	justify-content:center;
	height:22px;
	width:150px;
	background:rgb(28,28,28,0.9);
	font-size:11px;
	color:#FFFFFF;
	margin-left:1px;
}

.ol-scale-line {
  left: 0;
  bottom: 0;
  background: rgb(26, 26, 26, 00);
  color: #ffffff;
  font-size:11px;
}

.ol-scale-line-inner {
  color: #ffffff;
  border: 1px solid #ffffff;
  font-family: "Inter", sans-serif;
  border-top: 0;
}

#level-button{
  font-size:13px;
  cursor:context-menu;
}

/* Nav */

#nav-1{
	position:absolute;
	top:50px;
	left:0;
	bottom:0;
	width:47px;
	background:#161a1d;
	z-index:10;
}

#nav-container-1{
	position:absolute;
	top:0;
	right:0;
	left:0;
	bottom:45px;
	overflow-y:auto;
	overflow-x:hidden;
	padding-top:10px;
}

.button-menu{
	display:flex;
	align-items:center;
	height:37px;
	width:37px;
	margin:2px 5px;
	border-radius:3px;
	padding-left:10px;
	color:#FFFFFF;
	font-size:13px;
	text-decoration:none;
	cursor:pointer;
	border:1px solid #161a1d;
	/*transition:0.1s;*/
}

.button-menu i{
	font-size:16px;
	font-weight:300;
	margin-right:35px;
}

.button-menu:hover{
	border-color:#333943;
	background:#282c32;
}

.button-active{
	background-color:#60ba20;
	border-color:#60ba20;
	color:#161a1d;
}

.button-active:hover{
	background-color:#60ba20;
	border-color:#60ba20;
	color:#161a1d;
}

#line-menu{
	padding:0;
	margin:10px 5px;
	border-bottom:1px solid #333943;
}

#nav-container-2{
	position:absolute;
	bottom:0;
	right:0;
	left:0;
	overflow:hidden;
	height:45px;
	border-top:1px solid #2b2f33;
}

/* Container Elements */

.header-container{
	position:absolute;
	top:0;
	right:0;
	left:0;
	height:40px;
	border-bottom:1px solid #e1e4e6;
	display:flex;
	align-items:center;
	padding-left:15px;
}

.title-container{
	margin:0;
	padding:0;
	color:#000000;
	font-size:13px;
	font-weight:600;
}

.close-panel{
	position:absolute;
	right:10px;
	text-decoration:none;
	cursor:pointer;
	color:#000000;
	font-size:16px;
}

.body-container{
	position:absolute;
	top:40px;
	left:0;
	right:0;
	bottom:40px;
	overflow-y:auto;
	overflow-x:hidden;
}

/* Capas */

#panel-menu-1{
   position:absolute;
   top:50px;
   left:47px;
   /*left:250px;*/
   bottom:0;
   width:375px;
   background:#FFFFFF;
   border-right:1px solid #e1e4e6;
   z-index:11;

   display:none;
}

.collapse-1{
	display:flex;
	align-items:center;
	color:#000000;
	font-size: 13px;
	font-weight:600;
	text-decoration:none;
	cursor:pointer;
	height:33px;
	padding-left:15px;
	background:#f7f9fc;
	border-bottom:1px solid #e1e4e6;
}

.collapse-1 i{
	font-size:20px;
	margin:0;
	padding:0;
	margin-right:10px;
	font-weight:300;
}

.collapse-1:hover{
	border-color:#a0aaba;
	background:#edf0f5;
}

.collapse-content-1{
	padding:10px 0 10px 18px;
	display:none;
	border-bottom:1px solid #e1e4e6;
}

.collapse-content-2{
	padding:5px 0 5px 15px;
	display:none;
}


.collapse-2{
	display:flex;
	align-items:center;
	color:#000000;
	font-size: 13px;
	font-weight:600;
	padding:0px 0 0px 0;
	text-decoration:none;
	cursor:pointer;
	transition:0.1s;
}

.collapse-2 i{
	font-size:16px;
	font-weight:300;
	margin:0;
	padding:0;
	margin-right:10px;
}

.collapse-2:hover{
	color:#1a2d46;
}

.container-layer{
	border:1px solid #d9dde4;
	margin:1px 2px;
	border-radius:3px;
}

.container-check{
	position:relative;
	display:flex;
	align-items:center;
	padding:5px 0 5px 15px;

	/*border:1px solid #e1e4e6;
	margin:1px 2px;*/
}

.check-l,
.container-check input{
	margin:0;
	padding:0;
	border:2px solid;
}

.check-l:checked,
.container-check input:checked{
	background-color:#60ba20;
	border-color:#60ba20;
}

.check-l:focus,
.container-check input:focus{
	border-color:#60ba20;
}

.check-l{
	margin:0;
	padding:0;
	border:1px solid;
}

.check-l:checked{
	background-color:#60ba20;
	border-color:#60ba20;
}

.check-l:focus{
	border-color:#60ba20;
}

.label-l,
.label-check{
	display:block;
	color:#37414f;
	font-size:12px;
	margin-left:10px;
	width:80%;
}

.tool-layer{
	position:absolute;
	right:10px;
	text-decoration:none;
	cursor:pointer;
	color:#000000;
	transition:0.1s;
	display:flex;
	align-items:center;
	justify-content:center;
	height:22px;
	width:22px;
	border-radius:50px;
}

.tool-layer:hover{
	background:#f7f9fc;
}

.tool-container{
	margin:5px 5px 5px 37px;
	padding-top:10px;
	padding-right:5px;
	border-top:1px solid #d9dde4;
	display:none;
}

.title-tool{
	font-size:12px;
	color:#23262d;
	font-weight:600;
	margin-bottom:5px;
}

.action-tool{
	display:flex;
	align-items:center;
	font-size:12px;
	color:#23262d;
	text-decoration:none;
	cursor:pointer;
	transition:0.1s;
}

.action-tool i{
	font-size:15px;
	margin-right:10px;
	font-weight:300;
}

.action-tool:hover{
	color:#000000;
}

.tool-divider{
	padding:0;
	margin:10px 0;
	border-bottom:1px solid #bbc2ce;
}

.content-check{
	position:relative;
	display:flex;
	align-items:center;
}

/* Elemento rangde de capas */

.form-range {
    -webkit-appearance: none; /* Elimina el estilo predeterminado en WebKit */
    width: 100%; /* Ajusta el ancho del control deslizante */
    height: 8px; /* Ajusta la altura de la pista */
    background: #ddd; /* Color de la pista del control deslizante */
    border-radius: 5px; /* Bordes redondeados para la pista */
    outline: none; /* Elimina el borde por defecto al enfocar */
    opacity: 0.7; /* Opcional: Ajusta la opacidad del control deslizante */
    transition: opacity .2s; /* Opcional: Transición suave en la opacidad */
}

/* Estilo para el círculo (thumb) del control deslizante */

.form-range::-webkit-slider-thumb {
    -webkit-appearance: none; /* Elimina el estilo predeterminado en WebKit */
    width: 15px; /* Ancho del círculo */
    height: 15px; /* Altura del círculo */
    background: #FFFFFF; /* Color del círculo */
    border-color:#23262d;
    border:1px solid;
    cursor: pointer; /* Cambia el cursor cuando se pasa sobre el círculo */
    border-radius: 50%; /* Hace que el círculo sea redondeado */
}

/* Estilo para el círculo en Firefox */

.form-range::-moz-range-thumb {
    width: 15px; /* Ancho del círculo */
    height: 15px; /* Altura del círculo */
    background: #FFFFFF; /* Color del círculo */
    border-color:#23262d;
    border:1px solid;
    cursor: pointer; /* Cambia el cursor cuando se pasa sobre el círculo */
    border-radius: 50%; /* Hace que el círculo sea redondeado */
}

/* Estilo para el círculo en otros navegadores */

.form-range::-ms-thumb {
    width: 15px; /* Ancho del círculo */
    height: 15px; /* Altura del círculo */
    background: #FFFFFF; /* Color del círculo */
    border-color:#23262d;
    border:1px solid;
    cursor: pointer; /* Cambia el cursor cuando se pasa sobre el círculo */
    border-radius: 50%; /* Hace que el círculo sea redondeado */
}

/* Mapas base */

#panel-menu-2{
   position:absolute;
   top:50px;
   left:47px;
   /*left:250px;*/
   bottom:0;
   width:350px;
   background:#FFFFFF;
   border-right:1px solid #e1e4e6;
   z-index:11;

   display:none;
}

.b-map{
	display:flex;
	align-items:center;
	padding:5px 15px 5px 11px;
	font-size:13px;
	color:#656f7e;
	font-weight:400;
	text-decoration:none;
	cursor:pointer;
	border-bottom:1px solid #e1e4e6;
	border-left:4px solid #FFFFFF;
	transition:0.1s;
}

.b-map:hover{
	background:#f7f9fc;
	border-left:4px solid #f7f9fc;
	color:#23262d;
}

#img-map{
	width:90px;
	margin-right:35px;
}

.b-map-a{
	border-left:4px solid #60ba20;
	background:#f7f9fc;
	color:#23262d;
	font-weight:600;
}

.b-map-a:hover{
	border-left:4px solid #60ba20;
	background:#f7f9fc;
	color:#23262d;
	font-weight:600;
}

/* Simbología */

#panel-menu-3{
   position:absolute;
   top:50px;
   left:47px;
   /*left:250px;*/
   bottom:0;
   width:350px;
   background:#FFFFFF;
   border-right:1px solid #e1e4e6;
   z-index:11;

   display:none;
}

.content-sim{
    margin-bottom:15px;
}

#title-sim{
	font-size:13px;
	margin-bottom:5px;
	font-weight:600;
}

.simb-list{
	display:flex;
	align-items:center;
	font-size:12px;
	color:#23262d;
}

#icn-simb{
	font-size:18px;
	margin-right:15px;
}

#div-simb{
	border-bottom:2px solid;
	width:50px;
	margin-right:10px;
}

.simb-list-2{
	display:flex;
	align-items:center;
	font-size:12px;
	color:#23262d;
}

.simb-list-2 i{
	font-size:20px;
	margin:0;
	margin-right:10px;
	font-weight:300;
	padding:0;
}

#append-simbol{
	padding:15px;
}

/* Ayuda */

#panel-menu-6{
   position:absolute;
   top:50px;
   left:47px;
   /*left:250px;*/
   bottom:0;
   width:350px;
   background:#FFFFFF;
   border-right:1px solid #e1e4e6;
   z-index:11;

   display:none;
}

/* Informacion */

#panel-informacion{
   position:absolute;
   top:50px;
   /*right:0;*/
   left:250px;
   bottom:0;
   width:350px;
   background:#FFFFFF;
   border-right:1px solid #e1e4e6;
   z-index:12;

   display:none;
}

#sin_inf{
	display:block;
	color:#37414f;
	font-size:13px;
	padding:10px 15px;
}

.table-container{
	padding:20px 15px 5px 15px;
	border-bottom:1px solid #e1e4e6;
}

#title-capa{
	font-size:11px;
    color:#000000;
    font-weight:700;
    margin-bottom:10px;
    padding-left:3px;
}

#th-i,
#th-inf{
	font-size:12px;
	color:#23262d;
}

#td-i,
#td-inf{
	font-size:12px;
	color:#566171;
}

/* Analisis */

.content-analisis{
	border:1px solid #bbc2ce;
	border-radius:3px;
	padding:20px 10px 0 15px;
	margin:10px 15px 0px 15px;
}

#title-analisis{
    font-size:11px;
    color:#000000;
    font-weight:700;
    margin-bottom:10px;
    padding-left:3px;
}

/* Medicion */


#panel-menu-4{
	position:absolute;
	top:55px;
	left:52px;
	width:270px;
	background:#FFFFFF;
	border:1px solid #e0e0e0;
	z-index:11;

	display:none;
}

#header-lat{
	position:relative;
	display:flex;
	align-items:center;
	height:40px;
	padding-left:10px;
	border-bottom:1px solid #e0e0e0;
}

#title-lat{
	margin:0;
	padding:0;
	color:#000000;
	font-size:12px;
	font-weight:600;
}

#cl-lat{
	position:absolute;
	right:10px;
	color:#5e6065;
	text-decoration:none;
	cursor:pointer;
}

#type{
	box-shadow:none;
	border-radius:0;
	border:0;
	font-size:13px;
	padding:4px 10px;
	margin:0px 10px 0px 10px;
	width:250px;
	color:#000000;
	border-radius:4px;
	background-color:#f7f9fc;
	border:1px solid #a0aaba;
	margin-bottom:15px;
}

.form-check{
	display:flex;
	align-items:center;
	margin:5px 10px;
}

.form-check input{
	border-radius:0;
	margin:0;
	margin-right:7px;
	border:2px solid;
}

.form-check input:checked{
	background-color:#60ba20;
	border-color:#60ba20;
}

.form-check input:focus{
	border-color:#60ba20;
}

.form-check label{
	margin:0;
	padding:0;
	font-size:13px;
	color:#23262d;
}

#n-med{
	display:flex;
	align-items:center;
	justify-content:center;
	margin:0px 10px 0px 10px;
	padding:6px 0;
	font-size:13px;
	background:#191e1e;
	color:#FFFFFF;
	text-decoration:none;
	cursor:pointer;
	transition:0.1s;
}

#n-med:hover{
	background:#60ba20;
	color:#191e1e;
}

#body-lat-1{
	padding-bottom:10px;
	padding-top:10px;
}

/* Analisis */

#panel-menu-5{
	position:absolute;
	top:55px;
	left:52px;
	width:270px;
	background:#FFFFFF;
	border:1px solid #e0e0e0;
	z-index:11;

	display:none;
}

#typeAnalisis,
#typeDenMan{
	box-shadow:none;
	border:0;
	font-size:13px;
	padding:4px 10px;
	margin:0px 10px 0px 10px;
	width:250px;
	color:#000000;
	border-radius:4px;
	background-color:#f7f9fc;
	border:1px solid #a0aaba;
}

#para_circulo{
	margin:15px 10px 0px 10px;
	padding:10px;
	background:#FFFFFF;
	border:1px solid #d5dae2;
	border-radius:4px;

	display:none;
}

#label-check{
	font-size:13px;
}

#radio_cir{
	box-shadow:none;
	border-radius:0;
	border:0;
	font-size:13px;
	padding:4px 10px;
	color:#000000;
	border-radius:4px;
	background-color:#f7f9fc;
	border:1px solid #a0aaba;
}

#btn-ap{
	display:flex;
	align-items:center;
	justify-content:center;
	padding:6px 0;
	font-size:13px;
	background:#191e1e;
	color:#FFFFFF;
	text-decoration:none;
	cursor:pointer;
	transition:0.1s;
}

#btn-ap:hover{
	background:#60ba20;
	color:#191e1e;
}

#body-lat-2{
	padding-bottom:10px;
	padding-top:10px;
}

#label-panel{
	display:block;
	font-size:13px;
	color:#566171;
	padding-left:10px;
	padding-bottom:0px;
	margin-bottom:4px;
	font-weight:500;
}

/* Buscar unidad */

#busq_unidad{
	position:absolute;
	bottom:5px;
	z-index:20;
	width:300px;
    left: 0;
    right: 0;
    margin: auto;
    font-size:13px;

    display:none;
}

#busq_unidad:focus{
	border:2px solid #60ba20;
}