
/* INICIAL */

body {
    margin: 0;
    margin:0 auto;
    overflow:hidden;
    width:100%; 
    background:#FFFFFF;
    font-family: 'Rubik', sans-serif;                                           
}

h1,
h2,
h3,
h4,
h5,
h6{
    padding:0;
    margin:0;
}

input, a, select, label, button,. .btn{
    padding: 0;
    margin:0;
}

.btn:active,
.btn:focus,
.btn.active,
.btn:active:focus,
.tform,
.form-control,
.form-control:focus:active,
.form-check-input:focus,
.form-control-sm,
.form-control-sm:focus:active,
.txt_bx:focus,
.accordion-button,
.accordion-button:active:focus,
.accordion-header,
.accordion-header:active:focus,
#i_busq,
#bus_gl{
    outline: 0;
    -webkit-box-shadow:none;
    box-shadow: none;
}

/* TOAST */

#toast-gen{
    position: absolute; 
    left: 0; 
    right: 0; 
    margin-left: auto; 
    margin-right: auto; 
    bottom:10px; 
    width:360px;
    border-radius:4px;
    background:#091e42;
    display:flex;
    align-items:center;
    justify-content:center;
    height:35px;
    z-index:50;

    display:none;
}

#lbl-toast{
    color:#FFFFFF;
    font-size:12px;
    display:flex;
    align-items:center;
}

#icn-t1{
    color:#4c99fd;
    font-size:16px;
    margin-right:10px;
}

#icn-t2{
    color:#55d6a2;
    font-size:16px;
    margin-right:10px;
}

#icn-t3{
    color:#ffc400;
    font-size:16px;
    margin-right:10px;
}

#icn-t4{
    color:#fd5430;
    font-size:16px;
    margin-right:10px;
}

/* SPINNER */

#loc_loader{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    z-index:12;

    display:none;
}

.spinner {
   width: 70px;
   height: 70px;
   display: grid;
   border: 3px solid #0000;
   border-radius: 50%;
   border-color: #dbdcef #0000;
   animation: spinner-e04l1k 1s infinite linear;
}

.spinner::before,
.spinner::after {
   content: "";
   grid-area: 1/1;
   margin: 2.2px;
   border: inherit;
   border-radius: 50%;
}

.spinner::before {
   border-color: #6cfe00 #0000;
   animation: inherit;
   animation-duration: 0.5s;
   animation-direction: reverse;
}

.spinner::after {
   margin: 8.9px;
}

@keyframes spinner-e04l1k {
   100% {
      transform: rotate(1turn);
   }
}

/* TOOLTIPS */

.tooltip{
    font-size: 11px;
}

/* INDICACIONES */

#b-indic{
    position:absolute;
    top:0;
    right:0;
    left:0;
    bottom:0;
    background:rgb(22, 27, 34, 0.6);
    /*cursor:progress;*/
    z-index:110;

    /*display:none;*/
}

#line-b-1{
    position:absolute;
    top:42px;
    left:23px;
    height:15px;
    width:310px;
    border:2px solid #FFFFFF;
    border-right:0;
    border-top:0;
    border-style:dashed;
}

#ci-1{
    position:absolute;
    top:40px;
    left:330px;
    width:180px;
    padding:5px 15px 5px 15px;
    color:#FFFFFF;
    font-size:10px;
    font-weight:400;
    width:200px;
    background:#54ba09;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    text-transform: uppercase;
}

#line-b-2{
    position:absolute;
    top:102px;
    left:20px;
    height:10px;
    width:100px;
    border:0;
    border-left:2px solid #FFFFFF;
    border-bottom:2px solid #FFFFFF;
    border-style:dashed;
    /*display:none;*/
}

#ci-2,
#ci-3,
#ci-4,
#ci-5,
#ci-6{
    position:absolute;
    top:90px;
    left:126px;
    width:203px;
    padding:5px 15px 5px 15px;
    color:#FFFFFF;
    font-size:10px;
    font-weight:400;
    background:#54ba09;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    text-transform:uppercase;
}

#line-b-3{
    position:absolute;
    top:167px;
    left:20px;
    height:10px;
    width:100px;
    border:0;
    border-left:2px solid #FFFFFF;
    border-bottom:2px solid #FFFFFF;
    border-style:dashed;
    /*display:none;*/
}

#ci-3{top:160px;}

#line-b-4{
    position:absolute;
    top:203px;
    left:20px;
    height:10px;
    width:100px;
    border:0;
    border-left:2px solid #FFFFFF;
    border-bottom:2px solid #FFFFFF;
    border-style:dashed;
}

#ci-4{top:198px;width:203px;}

#line-b-5{
    position:absolute;
    top:239px;
    left:20px;
    height:10px;
    width:100px;
    border:0;
    border-left:2px solid #FFFFFF;
    border-bottom:2px solid #FFFFFF;
    border-style:dashed;
}

#ci-5{top:235px;}

#line-b-6{
    position:absolute;
    top:312px;
    left:20px;
    height:10px;
    width:100px;
    border:0;
    border-left:2px solid #FFFFFF;
    border-bottom:2px solid #FFFFFF;
    border-style:dashed;
    /*display:none;*/
}

#ci-6{top:307px;}

#line-b-7,
#line-b-8{
    position:absolute;
    bottom:90px;
    left:80px;
    width:20px;
    border:0;
    border-bottom:2px solid #FFFFFF;
    border-style:dashed;
    /*display:none;*/
}

#ci-7,
#ci-8{
    position:absolute;
    bottom:70px;
    left:106px;
    width:200px;
    padding:5px 15px 5px 15px;
    color:#FFFFFF;
    font-size:10px;
    font-weight:400;
    background:#54ba09;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    text-transform:uppercase;
}

#line-b-7{left:182px;bottom:15px;}
#ci-8{left:210px;bottom:5px;width:140px;}

#line-b-9,
#line-b-10,
#line-b-11,
#line-b-12,
#line-b-13{
    position:absolute;
    bottom:15px;
    right:330px;
    width:25px;
    border:0;
    border-bottom:2px solid #FFFFFF;
    border-style:dashed;
}

#ci-9,
#ci-10,
#ci-11,
#ci-12,
#ci-13{
    position:absolute;
    bottom:5px;
    right:360px;
    width:250px;
    padding:5px 15px 5px 15px;
    color:#FFFFFF;
    font-size:10px;
    font-weight:400;
    background:#54ba09;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    text-transform:uppercase;
}

#line-b-10{right:50px;bottom:55px;width:90px;}
#ci-10{right:145px;bottom:44px;width:200px;}

#line-b-11{right:50px;bottom:91px;width:90px;}
#ci-11{right:145px;bottom:80px;width:200px;}

#line-b-12{right:50px;bottom:136px;width:90px;}
#ci-12{right:145px;bottom:126px;width:200px;}

#line-b-13{right:50px;bottom:179px;width:90px;}
#ci-13{right:145px;bottom:169px;width:200px;}

#line-b-14{
    position:absolute;
    top:76px;
    right:50px;
    width:90px;
    border:0;
    border-bottom:2px solid #FFFFFF;
    border-style:dashed;
}

#ci-14{
    position:absolute;
    top:60px;
    right:145px;
    width:250px;
    padding:5px 15px 5px 15px;
    color:#FFFFFF;
    font-size:10px;
    font-weight:400;
    background:#54ba09;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    text-transform:uppercase;
}


#aviso-principal{
    position: absolute; 
    left: 0; 
    right: 0; 
    margin-left: auto; 
    margin-right: auto; 
    top:125px;
    width:520px;
    border:1px solid #8a929a;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}

#header-av{
    display:flex;
    align-items:center;
    height:50px;
    background:#0d1117;
    padding-left:30px;
}

#b-av{
    font-weight:600;
    color:#FFFFFF;
    font-size:1.5em;
}

#content-av{
    padding:40px 30px 40px 30px;
    background:#161b22;
}

#p-av{
    font-size:13px;
    font-weight:400;
    color:#d3d8e0;
    margin-bottom:15px;
    width:375px;
}

#footer-av{
    display:flex;
    align-items:center;
    height:50px;
    background:#0d1117;
    padding-left:30px;
}

#btn-av{
    border:2px solid #FFFFFF;
    border-radius:0;
    font-size:11px;
    font-weight:400;
    color:#FFFFFF;
    transition:0.1s;
    padding-left:20px;
    padding-right:20px;
    margin-left:5px;
}

#btn-av:hover{
    background:#FFFFFF;
    color:#1b1f23;
}


/* HEADER */

#header{
	position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 48px;
    background: #0d1117;
    display: flex;
    align-items:center;
    z-index: 100;
}

#btn-mn{
    float: left;
    font-size: 20px;
    color: #FFFFFF;
    text-decoration:none;
    cursor: pointer;
    height:48px;
    width:48px;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:0.1s;
    margin-right:20px;
}

#btn-mn:hover{
    color: #7d8590;
}

#ttl-1{
    font-weight:600;
    color:#FFFFFF;
    font-size:1.1em;
    margin-right:5px;
    color:#54ba09;
}

#ttl-2{
    font-weight:600;
    color:#FFFFFF;
    font-size:1.1em;
}

/* MENU */

#menu{
    position: absolute;
    top: 48px;
    left: 0;
    bottom: 0;
    width:48px;
    /*width:300px;*/
    background: #0d1117;
    transition: 0.1s;
    border-top:1px solid #30363d;
    z-index: 10;
}

#menu-c-1{
    position:absolute;
    top:0;
    right:0;
    left:0;
    bottom:0;
    overflow-y: auto;
    overflow-x: hidden;
    padding-top: 15px;
    padding-bottom: 15px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#menu-c-2{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    height:60px;
    background:#262a2d;
    display:flex;
    align-items:center;
    padding-left:15px;
    padding-right:15px;

    display:none;
}

#lbl-ft-m{
    display:block;
    font-size:10px;
    color:#b9bcbf;
    font-weight:400;
    font-family: 'Inter', sans-serif;
}

#btn_mn1,
#btn_mn2,
#btn_mn3,
#btn_mn4,
#btn_mn5,
#btn_mn6,
#btn_mn7,
#btn_mn8,
#btn_mn9{
    display: block;
    padding: 6px 15px 6px 15px;
    width: 320px;
    font-size: 13px;
    color: #FFFFFF;
    font-weight: 400;
    display: flex;
    align-items: center;
    background: #0d1117;
    border-radius: 0;
    border:1px solid #0d1117;
    cursor: pointer;
    text-decoration: none;
    white-space: nowrap;
    /*text-overflow: ellipsis;*/
    transition:0.1s;
}

#btn_mn1:hover,
#btn_mn2:hover,
#btn_mn3:hover,
#btn_mn4:hover,
#btn_mn5:hover,
#btn_mn6:hover,
#btn_mn7:hover,
#btn_mn8:hover,
#btn_mn9:hover{
    /*background: #161b22;*/
    border-left:1px solid #54ba09;
    color: #54ba09;
}

#btn_mn1.btn_mnA,
#btn_mn2.btn_mnA,
#btn_mn3.btn_mnA,
#btn_mn4.btn_mnA,
#btn_mn5.btn_mnA,
#btn_mn6.btn_mnA,
#btn_mn7.btn_mnA,
#btn_mn8.btn_mnA,
#btn_mn9.btn_mnA{
    background: #54ba09;
    color: #FFFFFF;
    border-color:#54ba09;
    pointer-events: none;
}

#icn_mn{
    font-size: 16px;
    margin-right: 35px;
}

#ln_mn{
    padding: 0;
    /*border-bottom: 1px solid #4a5053;*/
    margin:20px;
}

#btn_cont{
    position: absolute;
    left: 50px;
    bottom: 70px;
    background: #1b1f23;
    color: #FFFFFF;
    padding: 8px 5px 8px 5px;
    border-left: 1px solid #4a5053;
    cursor: pointer;
    transition: 0.1s;
    z-index: 8;
}

#btn_cont:hover{
    background: #262a2d;
}

/* MAPA */

#map{
    position: absolute;
    top: 48px;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
}

#lbl_lon{
    display: flex;
    align-items: center;
    position: absolute;
    right: 5px;
    bottom: 5px;
    font-size: 10px;
    width: 140px;
    background: #FFFFFF;
    padding: 0px 10px 0px 10px;
    height: 22px;
    background: rgb(38, 42, 45, 0.7);
    color: #FFFFFF;
    font-weight:400;
    z-index: 10;
}

#lbl_lat{
    display: flex;
    align-items: center;
    position: absolute;
    right: 146px;
    bottom: 5px;
    font-size: 10px;
    width: 140px;
    background: #FFFFFF;
    padding: 0px 10px 0px 10px;
    height: 22px;
    background: rgb(38, 42, 45, 0.7);
    color: #FFFFFF;
    font-weight:400;
    z-index: 10;
}

#lbl_wrl{
    position: absolute;
    right: 287px;
    bottom: 5px;
    display: flex;
    align-items: center;
    background: rgb(43, 43, 43, 0.7);
    color: #FFFFFF;
    height: 22px;
    padding: 0px 10px 0px 10px;
    font-size:16px;
    z-index: 10;
}

.ol-scale-line { 
    position: absolute;
    bottom:5px;
    font-family: 'Inter', sans-serif;
    border-radius:3px;
    left:60px;
    transition: 0.1s;
    z-index: 10;
} 

#btn_geoc{
    position: absolute;
    top:60px;
    right: 10px;
    height:35px;
    width:35px;
    display:flex;
    align-items:center;
    justify-content:center;
    border: 0;
    background:rgb(38,42,45,0.7);
    border-radius:3px;
    color: #FFFFFF;
    font-size: 20px;
    cursor: pointer;
    transition:0.1s;
    text-decoration:none;
    z-index: 10;
}

#btn_minus,
#btn_more,
#btn_ini,
#btn_loc{
    position: absolute;
    bottom:40px;
    right: 10px;
    height:35px;
    width:35px;
    display:flex;
    align-items:center;
    justify-content:center;
    border: 0;
    background:rgb(38,42,45,0.7);
    border-radius:3px;
    color: #FFFFFF;
    font-size: 20px;
    cursor: pointer;
    transition:0.1s;
    text-decoration:none;
    z-index: 10;
}

#btn_loc{bottom: 164px;}
#btn_ini{bottom: 120px;}
#btn_more{bottom: 76px;}

#btn_minus:hover,
#btn_more:hover,
#btn_ini:hover,
#btn_loc:hover,
#btn_geoc:hover{
    background:rgb(38,42,45,1);
}

#btn_loc.btn-ctrA,
#btn_geoc.btn-ctrA{
    background:#629f3b;
}

#lbl_nivel{
    display: flex;
    align-items: center;
    position: absolute;
    right: 290px;
    bottom: 5px;
    font-size: 11px;
    font-weight:400;
    width: 80px;
    background: #FFFFFF;
    padding: 0px 10px 0px 10px;
    height: 22px;
    background: rgb(38, 42, 45, 0.7);
    color: #FFFFFF;
    z-index: 10;
}

/* GEOLOCALIZACION */

#cnt-geoc{
    position:absolute;
    top:60px;
    right:55px;
    background:#FFFFFF;
    width:300px;
    z-index:10;

    display:none;
}

#bus_gl{
    font-size:13px;
}

#bus_gl:focus{
    border-color:#000000;
}

#btn_gl_1,
#btn_gl_2{
    font-size:18px;
    border:1px solid #dce8e8;
    background:#FFFFFF;
    color:#adbbc2;
    transition:0.1s;
}

#btn_gl_1:hover,
#btn_gl_2:hover{
    color:#000000;
}

#btn_gl_2{display:none;}

/* CAPAS */

#cl_cap{
    position: absolute;
    right: 15px;
    color: #000000;
    font-size: 16px;
    cursor: pointer;
    transition:0.1s;
}

#cl_cap:hover{
    color:#161b22;
}

#capas{
    position: absolute;
    top: 48px;
    bottom: 0;
    width: 350px;
    background: #FFFFFF;
    border-right:1px solid #ebf2f2; 
    transition: 0.1s;
    z-index: 9;

    left: -353px;
    /*left:47px;*/
}

#ttl_capas{
    height: 45px;
    font-size:15px;
    font-weight:600;
    color: #000000;
    display: flex;
    align-items: center;
    padding-left: 15px;
    background:#f0f2f8;
}

#switch_capas{
    display:flex;
    align-items:center;
    position:absolute;
    top:45px;
    left:0;
    right:0;
    height:45px;
    border-bottom:1px solid #f0f2f8;
}

.btn-sw{
    display:flex;
    align-items:center;
    justify-content:center;
    height:44px;
    font-size:10px;
    text-decoration:none;
    cursor:pointer;
    font-weight:500;
    border-radius:0;
    border:1px solid #FFFFFF;
    color:#000000;
}

.btn-swA{
    color:#54ba09;
    border-bottom:1px solid #54ba09;
}

.btn-swA:hover{
    color:#54ba09;
    border-bottom:1px solid #54ba09;
}

#content_capas,
#content_capas2,
#content_capas3{
    position: absolute;
    top: 90px;
    left: 0;
    right: 0;
    bottom: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding-top: 15px;
    padding-bottom: 15px;
}

#content_capas2,
#content_capas3{display:none;}

#a_cp{
    position: relative;
    padding:4px 20px 4px 12px;
    font-size: 14px;
    color: #6e6e6e;
    display: flex;
    align-items: center;
    border-left: 3px solid #FFFFFF;
    cursor: pointer;
    margin-bottom: 1px;
}

#a_cp:hover{
    color: #151515;
    background: #f3f2f1;
    border-left: 3px solid #f3f2f1;
}

#a_cp.a_cp{
    color: #60a003;
    font-weight: 600;
    background: #d4e6b2;
    border-left: 3px solid #60a003;
}

#icn_cp{
    font-size: 20px;
    margin-right: 20px;
}

#adj_cp1,
#adj_cp2,
#adj_cp3,
#adj_cp4,
#adj_cp5,
#adj_cp6,
#adj_cp7,
#adj_cp8,
#adj_cp9,
#adj_cp10,
#adj_cp11,
#adj_cp12,
#adj_cp13,
#adj_cp14,
#adj_cp15,
#adj_cp16,
#adj_cp17,
#adj_cp18,
#adj_cp19,
#adj_cp20,
#adj_cp21,
#adj_cp22,
#adj_cp23,
#adj_cp24,
#adj_cp25,
#adj_cp26,
#adj_cp27{
    position: absolute;
    top: 0px;
    right: 15px;
    font-size: 18px;
    color: #adbbc2;
    cursor: pointer;
    display: none;
}

#adj_cp1:hover,
#adj_cp2:hover,
#adj_cp3:hover,
#adj_cp4:hover,
#adj_cp5:hover,
#adj_cp6:hover,
#adj_cp7:hover,
#adj_cp8:hover,
#adj_cp9:hover,
#adj_cp10:hover,
#adj_cp11:hover,
#adj_cp12:hover,
#adj_cp13:hover,
#adj_cp14:hover,
#adj_cp15:hover,
#adj_cp16:hover,
#adj_cp17:hover,
#adj_cp18:hover,
#adj_cp19:hover,
#adj_cp20:hover,
#adj_cp21:hover,
#adj_cp22:hover,
#adj_cp23:hover,
#adj_cp24:hover,
#adj_cp25:hover,
#adj_cp26:hover,
#adj_cp27:hover{
    color: #161b1d;
}

#adj_cp1.adj_cpA,
#adj_cp2.adj_cpA,
#adj_cp3.adj_cpA,
#adj_cp4.adj_cpA,
#adj_cp5.adj_cpA,
#adj_cp6.adj_cpA,
#adj_cp7.adj_cpA,
#adj_cp8.adj_cpA,
#adj_cp9.adj_cpA,
#adj_cp10.adj_cpA,
#adj_cp11.adj_cpA,
#adj_cp12.adj_cpA,
#adj_cp13.adj_cpA,
#adj_cp14.adj_cpA,
#adj_cp15.adj_cpA,
#adj_cp16.adj_cpA,
#adj_cp17.adj_cpA,
#adj_cp18.adj_cpA,
#adj_cp19.adj_cpA,
#adj_cp20.adj_cpA,
#adj_cp21.adj_cpA,
#adj_cp22.adj_cpA,
#adj_cp23.adj_cpA,
#adj_cp24.adj_cpA,
#adj_cp25.adj_cpA,
#adj_cp26.adj_cpA,
#adj_cp27.adj_cpA{
    color: #6aae3d;
}

#cnt_switch{
    position: relative;
    display: flex;
    align-items: center;
    height:35px;
    padding-left:20px;
}

#cnt_switch2{
    position: relative;
    display: flex;
    align-items: center;
    height:20px;
}

#inp-gen-1{
    margin-right:15px;
    border-color:#616975;
    height:16px;
    width:16px;
    border-radius:2px;
}

#inp-gen-1:checked{
    background-color:#54ba09;
    border-color:#54ba09;
}

#inp-gen-1:focus{
    border-color:#54ba09;
}

#inp-gen{
    margin-right:15px;
    border-color:#616975;
    height:16px;
    width:16px;
    border-radius:2px;
}

#inp-gen:checked{
    background-color:#54ba09;
    border-color:#54ba09;
}

#inp-gen:focus{
    border-color:#54ba09;
}

#inp-gen2{
    margin-right:15px;
    border-color:#616975;
    height:14px;
    width:14px;
    border-radius:2px;
}

#inp-gen2:checked{
    background-color:#54ba09;
    border-color:#54ba09;
}

#inp-gen2:focus{
    border-color:#54ba09;
}

#lbl_switch{
    font-size: 14px;
    float: left;
    width: 250px;
    font-weight: 400;
    color: #39414e;
    margin-top:2px;
}

#lbl_switch2{
    font-size: 13px;
    float: left;
    width: 250px;
    font-weight: 400;
    color: #39414e;
    margin-top:2px;
}

.s-opc{
    position:absolute;
    right:10px;
    text-decoration:none;
    cursor:pointer;
    color:#39414e;
}

#s-opc-1,
#s-opc-2,
#s-opc-3,
#s-opc-4,
#s-opc-5,
#s-opc-6,
#s-opc-7,
#s-opc-8,
#s-opc-9,
#s-opc-10,
#s-opc-11,
#s-opc-12,
#s-opc-13,
#s-opc-14,
#s-opc-15,
#s-opc-16,
#s-opc-17,
#s-opc-18,
#s-opc-19,
#s-opc-20,
#s-opc-21,
#s-opc-22,
#s-opc-23,
#s-opc-24,
#s-opc-25,
#s-opc-mostestatal{
    display:none;
}

#drop-opc{
    width:270px;
}

#cont-opc{
    padding:5px 15px 5px 15px;
    margin-bottom:10px;
}

#ttl-opc{
    font-size:13px;
    color:#000000;
    margin-bottom:5px;
}

#opac18{
    width:100%;
    color:red;
}







.switch {
    position: relative;
    display: inline-block;
    width: 28px;
    height: 15px;
    float: left;
    margin-right: 15px;
}

.switch input { 
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #adbbc2;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 11px;
  width: 11px;
  left: 2px;
  bottom: 2px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #54ba09;
}

input:focus + .slider {
  box-shadow: 0 0 1px #6aae3d;
}

input:checked + .slider:before {
  -webkit-transform: translateX(13px);
  -ms-transform: translateX(13px);
  transform: translateX(13px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 17px;
}

.slider.round:before {
  border-radius: 50%;
}

/* Subcapas */

#sub_capas1,
#sub_capas2,
#sub_capas3,
#sub_capas4{
    padding: 5px 10px 5px 45px;
    display: none;
}

#a_scp{
    padding:4px 5px 4px 5px;
    font-size: 13px;
    color: #6e6e6e;
    display: flex;
    align-items: center;
    border-left: 3px solid #FFFFFF;
    cursor: pointer;
    margin-bottom: 1px;
}

#a_scp:hover{
    color: #151515;
    background: #f3f2f1;
    border-left: 3px solid #f3f2f1;
}

#a_scp.a_scpA{
    color: #60a003;
    font-weight: 600;
    background: #d4e6b2;
    border-left: 1px solid #60a003;
}

/* Transparencias capas */

#opacity_1,
#opacity_2,
#opacity_3,
#opacity_4,
#opacity_5,
#opacity_6,
#opacity_7,
#opacity_8,
#opacity_9,
#opacity_10,
#opacity_11,
#opacity_12,
#opacity_13,
#opacity_14,
#opacity_15,
#opacity_16,
#opacity_17,
#opacity_18,
#opacity_19,
#opacity_20,
#opacity_21,
#opacity_22,
#opacity_23{
    padding: 5px 10px 5px 45px;
    display: none;
}

/* POPUP */

.ol-popup {
    position: absolute;
    background-color: white;
    box-shadow: 0 1px 4px rgba(0,0,0,0.2);
    border-radius: 0px;
    border: 1px solid #cccccc;
    bottom: 12px;
    left: -50px;
    min-width: 280px;
    padding-bottom: 10px;
}

.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: 48px;
    margin-left: -10px;
}

.ol-popup:before {
    border-top-color: #cccccc;
    border-width: 11px;
    left: 48px;
    margin-left: -11px;
}

.ol-popup-closer {
    text-decoration: none;
    position: absolute;
    top: 2px;
    right: 8px;
}

.ol-popup-closer:after {
    content: "✖";
}

#ttl_pop{
    position:relative;
    height: 40px;
    display: flex;
    align-items: center;
    padding-left: 10px;
    border-bottom: 1px solid #edebe9;
    color:#000000;
}

#ttl_p{
    color: #000000;
    float: left;
    font-size:14px;
    font-weight:600;
    font-family: 'Inter', sans-serif;
}

#cl_p{
    position: absolute;
    right: 10px;
    font-size: 20px;
    color: #adbbc2;
    cursor: pointer;
    transition:0.1s;
}

#call_inf{
    position: absolute;
    right: 35px;
    font-size: 20px;
    color: #adbbc2;
    cursor: pointer;
    transition:0.1s; 
}

#cl_p:hover,
#call_inf:hover{
    color:#000000;
}

#cnt_colonia,
#cnt_uso_suelo,
#cnt_zonasr,
#cnt_ciclov,
#cnt_curvasn,
#cnt_fallas,
#cnt_corr_urb,
#cnt_limcentro,
#cnt_politic,
#cnt_redvial,
#cnt_corrientes,
#cnt_local,
#cnt_most,
#cnt_most_estatal{
    margin: 5px;
    /*padding-left: 5px;
    padding-right: 5px;
    border-left: 2px solid #60a003;*/
    margin-bottom: 2px;
}

#lbl_tema{
    display: block;
    font-weight: 500;
    color: #60a003;
    padding-left: 10px;
    font-size: 12px;
    margin-bottom: 10px;
    font-family: 'Inter', sans-serif;
}

/* Accordion popup */

.accordion {
    background-color: #e2e7e9;
    color: #444;
    cursor: pointer;
    padding: 4px 10px 4px 10px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 11px;
    color: #000000;
    transition: 0.4s;
    font-family: 'Inter', sans-serif;
    font-weight:600;
}

.active, .accordion:hover {
    background-color: #6aae3d; 
    color: #FFFFFF;
}

.panel {
    padding: 5px 10px 5px 10px;
    display: none;
    background-color: white;
    overflow: hidden;
}

#th_p{
    font-size: 11px;
    color: #151515;
    text-align: left;
    font-family: 'Inter', sans-serif;
}

#td_p{
    font-size: 11px;
    color: #6a6a6a;
    text-align: left;
    font-family: 'Inter', sans-serif;
}

/* MAPAS BASE */

#mapas_base{
    position: absolute;
    top: 48px;
    /*left: 47px;*/
    bottom: 0;
    width: 350px;
    background: #FFFFFF;
    border-right: 1px solid #ebf2f2;
    transition: 0.1s;
    z-index: 9;

    left: -353px;
}

#ttl_mapbas{
    height: 45px;
    font-size:15px;
    font-weight:600;
    color: #000000;
    display: flex;
    align-items: center;
    padding-left: 15px;
    background:#f0f2f8;
}

#cl_mb{
    position: absolute;
    right: 15px;
    color: #000000;
    font-size: 16px;
    cursor: pointer;
    transition:0.1s;
}

#cl_mb:hover{
    color:#161b22;
}

#content_mapbas{
    position: absolute;
    top: 45px;
    left: 0;
    right: 0;
    bottom: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding-top: 15px;
    padding-bottom: 15px;
}

#btn_mb{
    display: flex;
    align-items: center;
    font-size: 14px;
    margin:3px 10px 3px 10px;
    height:55px;
    text-decoration:none;
    color:#313947;
    padding-left:5px;
    cursor: pointer;
    border:1px solid #f5f6fa;
    transition:0.1s;
}

#btn_mb:hover{
    color: #000000;
    border-color: #dfe5ee; 
}

#btn_mb.btn_mbA{
    color: #54ba09;
    border-color:#dfe5ee;
    font-weight: 500;
    pointer-events: none;
}

#img_mb{
    width: 80px;
    margin-right: 15px;
    font-size: 13px;
    color: #6e6e6e;
}

/* LEYENDA */

#leyenda{
    position: absolute;
    top: 48px;
    bottom: 0;
    width: 350px;
    background: #FFFFFF;
    border-right: 1px solid #ebf2f2;
    transition: 0.1s;
    z-index: 9;

    left: -353px;
    /*left:47px;*/
}

#ttl_leyenda{
    height: 45px;
    font-size:15px;
    font-weight:600;
    color: #000000;
    display: flex;
    align-items: center;
    padding-left: 15px;
    background:#f0f2f8;
}

#cl_ley{
    position: absolute;
    right: 15px;
    color: #000000;
    font-size: 16px;
    cursor: pointer;
    transition:0.1s;
}

#cl_ley:hover{
    color:#161b22;
}

#content_leyend{
    position: absolute;
    top: 45px;
    left: 0;
    right: 0;
    bottom: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding-top: 15px;
    padding-bottom: 15px;
}

#lbl_leyend{
    display: flex;
    align-items: center;
    font-size: 13px;
    font-weight: 400;
    color: #161b1d;
    padding: 2px 15px 2px 15px;
}

#icn_ly{
    font-size: 18px;
    margin-right: 10px;
}

#ttl_leyendas{
    font-weight: 600;
    margin-bottom: 5px;
    font-size:13px;
    padding:5px 15px 5px 15px;
}

#ley_uso_suelo,
#ley_centroh,
#ley_corrurb,
#ley_ciclov,
#ley_planrector,

#ley_most,
#ley_mostEstatal{
    margin-bottom: 5px;
}

#lbl_limmun,
#lbl_colonia,
#lbl_localid,
#lbl_politic,
#lbl_redcar,
#lbl_most,
#lbl_ferrof,
#lbl_zonri,
#lbl_curvni,
#lbl_riosarr,
#lbl_riolaj,
#lbl_canrie,
#lbl_corine,
#lbl_pemex,
#lbl_fallas,
#lbl_rios_urbanos,
#lbl_cfe,
#lbl_vias_ferreas,
#lbl_most,
#lbl_most_estatal{
    display: flex;
    align-items: center;
    font-size: 13px;
    font-weight: 600;
    padding: 5px 15px 5px 15px;
}

/* SIMBOLOGIA */

#ly_limmun{
    float: left;
    width: 50px;
    padding: 0;
    border-bottom: 2px solid #03a800;
    margin-right: 15px;
}

#ly_planre{
    float: left;
    width: 50px;
    padding: 0;
    border-bottom: 2px solid #969696;
    margin-right: 15px;
}

#ly_gen{
    float: left;
    width: 50px;
    padding: 0;
    border-bottom: 2px solid;
    margin-right: 15px;
}

#ly_gen2{
    float: left;
    width: 50px;
    padding: 0;
    border-bottom: 1px solid;
    margin-right: 15px;
}

#ly_col{
    float: left;
    width: 50px;
    padding: 0;
    border-style: dashed;
    border-width: 1px;
    border-color: #273746;
    margin-right: 15px;
}

#ly_cicl1{
    float: left;
    width: 50px;
    padding: 0;
    border-bottom: 2px dashed #FF5100;
    margin-right: 15px;
}

#ly_cicl2{
    float: left;
    width: 50px;
    padding: 0;
    border-bottom: 2px solid #023bfc;
    margin-right: 15px;
}

#ly_cicl3{
    float: left;
    width: 50px;
    padding: 0;
    border-bottom: 2px solid #1ccbff;
    margin-right: 15px;
}

#ly_cicl4{
    float: left;
    width: 50px;
    padding: 0;
    border-bottom: 2px dashed #ff0000;
    margin-right: 15px;
}

/* Plan rector vial */

#ly_plrec1{
    float: left;
    width: 70px;
    padding: 0;
    border-bottom: 2px dashed #ff9830;
    margin-right: 15px;
}

#ly_plrec2{
    float: left;
    width: 70px;
    padding: 0;
    border-bottom: 2px dashed #0000ff;
    margin-right: 15px;
}

#ly_plrec3{
    float: left;
    width: 70px;
    padding: 0;
    border-bottom: 2px solid #00ff00;
    margin-right: 15px;
}

#ly_plrec4{
    float: left;
    width: 70px;
    padding: 0;
    border-bottom: 2px dashed #00ff00;
    margin-right: 15px;
}

#ly_plrec5{
    float: left;
    width: 70px;
    padding: 0;
    border-bottom: 2px solid #808080;
    margin-right: 15px;
}

#ly_plrec6{
    float: left;
    width: 70px;
    padding: 0;
    border-bottom: 2px dashed #00ffff;
    margin-right: 15px;
}

#ly_plrec7{
    float: left;
    width: 70px;
    padding: 0;
    border-bottom: 2px dashed #ff7040;
    margin-right: 15px;
}

#ly_plrec8{
    float: left;
    width: 70px;
    padding: 0;
    border-bottom: 3px solid #ff7040;
    margin-right: 15px;
}

#ly_plrec9{
    float: left;
    width: 70px;
    padding: 0;
    border-bottom: 2px solid #ff0000;
    margin-right: 15px;
}

#ly_plrec10{
    float: left;
    width: 70px;
    padding: 0;
    border-bottom: 2px dashed #ff0000;
    margin-right: 15px;
}

#ly_plrec11{
    float: left;
    width: 70px;
    padding: 0;
    border-bottom: 2px dashed #808000;
    margin-right: 15px;
}

#ly_plrec12{
    float: left;
    width: 70px;
    padding: 0;
    border-bottom: 2px dashed #ff00ff;
    margin-right: 15px;
}

#ly_plrec13{
    float: left;
    width: 70px;
    padding: 0;
    border-bottom: 2px solid #0000ff;
    margin-right: 15px;
}

#ly_plrec14{
    float: left;
    width: 70px;
    padding: 0;
    border-bottom: 2px solid #ff00ff;
    margin-right: 15px;
}

/* TOOLTIPS */

/*#toolt_1,
#toolt_2,
#toolt_3,
#toolt_4,
#toolt_5,
#toolt_6,
#toolt_7,
#toolt_8,
#toolt_9{
    position: absolute;
    top: 63px;
    left: 50px;
    padding: 3px 10px 3px 10px;
    font-size: 11px;
    background: #191919;
    font-weight: 300;
    color: #FFFFFF;
    border-radius: 3px;
    z-index: 15;
    display: none;
}

#toolt_2{top: 94px;}
#toolt_3{top: 125px;}

#toolt_4{top: 168px;}
#toolt_5{top: 198px;}
#toolt_6{top: 228px;}
#toolt_7{top: 258px;}
#toolt_8{top: 288px;}
#toolt_9{top: 318px;}*/

/* DOCUMENTACION */

#documentacion{
    position: absolute;
    top: 48px;
    bottom: 0;
    width: 350px;
    background: #FFFFFF;
    border-right: 1px solid #ebf2f2;
    transition: 0.1s;
    z-index: 9;

    left: -353px;
    /*left:47px;*/
}

#ttl_docum{
    height: 45px;
    font-size:15px;
    font-weight:600;
    color: #000000;
    display: flex;
    align-items: center;
    padding-left: 15px;
    background:#f0f2f8;
}

#cl_doc{
    position: absolute;
    right: 15px;
    color: #000000;
    font-size: 16px;
    cursor: pointer;
    transition:0.1s;
}

#cl_doc:hover{
    color:#161b22;
}

#content_document{
    position: absolute;
    top: 45px;
    left: 0;
    right: 0;
    bottom: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding-top: 15px;
    padding-bottom: 15px;
}

#link-docs{
    display:flex;
    align-items:center;
    border-radius:0;
    font-size:14px;
    padding:6px 15px 6px 15px;
    text-decoration:none;
    cursor:pointer;
    color:#39414e;
    transition:0.1s;
}

#link-docs:hover{
    background:#54ba09;
    color:#FFFFFF;
}

#icn-d{
    font-size:16px;
    margin-right:20px;
}

/* BUSQUEDA */

#busqueda{
    position: absolute;
    top: 48px;
    bottom: 0;
    width: 350px;
    background: #FFFFFF;
    border-right: 1px solid #ebf2f2;
    transition: 0.1s;
    z-index: 9;

    left: -353px;
    /*left:47px;*/
}

#ttl_buscar{
    height: 45px;
    font-size:15px;
    font-weight:600;
    color: #000000;
    display: flex;
    align-items: center;
    padding-left: 15px;
    background:#f0f2f8;
}

#cl_bus{
    position: absolute;
    right: 15px;
    color: #000000;
    font-size: 16px;
    cursor: pointer;
    transition:0.1s;
}

#cl_bus:hover{
    color:#161b22;
}

#content_buscar{
    position: absolute;
    top: 45px;
    left: 0;
    right: 0;
    bottom: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding-top: 15px;
    padding-bottom: 15px;
}

#c_bus{
    padding-top:5px;
    padding-bottom:5px;
    border-bottom:1px solid #ebf2f2;
}

#i_busq{
    border:0;
    float:left;
    border:0;
    font-size:13px;
    border-radius:0;
    padding-left:15px;
    color:#161b1d;
    border-right:1px solid #ebf2f2;
}

#btn_busq,
#btn_reload{
    font-size:18px;
    border-radius:0px;
    border:0;
    color:#adbbc2;
}

#btn_reload{display:none;}

#btn_busq:hover,
#btn_reload:hover{
    color:#54ba09;
}

#ttl-rs,
#ttl-rs-2{
    font-size:10px;
    color:#45565e;
    font-weight:700;
    margin-left:5px;
    margin-bottom:10px;
}

#cont-busq{
    position:absolute;
    top:91px;
    left:0;
    right:0;
    bottom:0;
    overflow-y:auto;
    overflow-x:hidden;
}

#p_result{
    padding:15px 10px 15px 10px;
    margin-bottom:15px;
    background:#f9fafb;

    display:none;
}

#act_r1{
    position:relative;
    display:flex;
    padding:3px 5px 3px 5px;
    font-size:13px;
    font-weight:500;
    color:#161b1d;
    text-decoration:none;
    cursor:pointer;
    transition:0.1s;
}

#act_r1:hover{
    background:#e2e7e9;
}

#cant_r1,
#cant_r2,
#cant_r3{
    position:absolute;
    right:5px;
    font-size:13px;
    color:#adbbc2;
}

#result_gen{
    padding:15px 10px 15px 10px;
    margin-bottom:15px;
    background:#f9fafb;

    display:none;
}

.a-loc,
#lbl-notifrs{
    position:relative;
    display:flex;
    padding:3px 5px 3px 5px;
    font-size:12px;
    font-weight:400;
    color:#161b1d;
    text-decoration:none;
    cursor:pointer;
    transition:0.1s; 
}

.a-loc:hover{
    padding-left:6px;
    color:#54ba09;
}

#icn-bsq{
    font-size:16px;
    margin-right:15px;
}

/* VENTANA DE INFORMACION */

#info_capas{
    position: absolute;
    top: 50px;
    right: -353px;
    /*right:0;*/
    width: 350px;
    bottom: 0;
    background: #FFFFFF;
    border-left:1px solid #ebf2f2;
    transition: 0.1s;
    z-index: 15;
}

#ttl_info_cap{
    position:relative;
    height: 45px;
    color: #000000;
    display: flex;
    align-items: center;
    padding-left: 15px;
    border-bottom: 2px solid #ebf2f2;
    font-size: 14px;
    font-weight:600;
}

#cl_infc{
    position: absolute;
    right: 15px;
    color: #adbbc2;
    font-size: 20px;
    cursor: pointer;
}

#cl_infc:hover{
    color:#000000;
}

#content_info_cap{
    position: absolute;
    top: 45px;
    left: 0;
    right: 0;
    bottom: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding:15px;
}