.spinner-wrapper {
  -webkit-transition: all 3s cubic-bezier(1.000, -0.530, 0.405, 1.425);
  -moz-transition: all 3s cubic-bezier(1.000, -0.530, 0.405, 1.425);
  -o-transition: all 3s cubic-bezier(1.000, -0.530, 0.405, 1.425);
  transition: all 3s cubic-bezier(1.000, -0.530, 0.405, 1.425);

  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity:.9;
  background-color: rgba(223, 132, 54, .01);
  z-index: 1000000;
  align-content: center;
  background:rgba(223, 132, 54, 1) url(../css/images/7axmWhiteSm.png) repeat center center; 
  /* background-size: 100%; */
  }
 
  .spinner-wrapper.hide {
    top: 50%;
    /* left: 50%;
    right: 50%; */
    bottom: 50%;
    opacity:0;
    
    background-color: rgba(223, 132, 54, .01);
    z-index: 1000000;
    align-content: center;
    background:rgba(223, 132, 54, 1) url(../css/images/7axmWhiteSm.png) repeat center center; 
    /* background-size: 100%; */
    /*border-radius: 100%;*/
    }
  
  #loadImg {
    -webkit-transition: all 5s ease-in;
  -moz-transition: all 5s ease-in;
  -o-transition: all 5s ease-in;
  transition: all 5s ease-in;
    position:fixed;
    /*float:unset;*/
	  /* top:50%;
    right:50%;  */
    width:100%;
	  height:100%;
	  border-radius:10px 10px 10px 10px;
	  opacity:1;
    display:flex;
    background:url(../css/images/wait.svg) no-repeat center center;
    z-index:999998;
    } 
    #loadImg.hide {
      height: 0px;
      } 
.map {
    height:-webkit-fill-available ;
    /* width: 100%; */
    left: 0%;
}

.cardChr{
    height: 120px !important;
    /*width: 200px !important; */
}
.wrapper {
  padding-right: 0;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
#wrapper.toggled {
  padding-right: -280px !important ;
}
#menu-toggle{
  color:white;
  position: absolute;
  top: 46px;
  right:  225px;
  transform: rotate(270deg);
  background: black;
  z-index: 1;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
  }
  #menu-toggle.toggled{
    right:  0px;
    top: 0px;
    transform: rotate(360deg);
    }
.sidebar-container {
    z-index: 1000;
    position: fixed;
    width: 280px;
    height: 100%;
    right: 0px;
    /* overflow-x: hidden; */
    /* overflow-y: auto; */
    /* background: #1a1a1a; */
    background: rgba(0, 0, 0, .5);
    color: #fff;
    -webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
transition: all 0.5s ease;
  }

.sidebar-container.toggled {
  right: -280px;
}
  
  .content-container {
    padding-top: 0px;
  }
  
  .sidebar-logo {
    padding: 10px 15px 10px 30px;
    font-size: 20px;
    background-color: #fff;
    color: #e98436;
  }
  
  .sidebar-navigation {
    padding: 0;
    margin: 0;
    list-style-type: none;
    position: relative;
  }
  
  .sidebar-navigation li {
    background-color: transparent;
    position: relative;
    display: inline-block;
    width: 100%;
    line-height: 20px;
  }
  
  .sidebar-navigation li a {
    padding: 10px 15px 10px 30px;
    display: block;
    color: #fff;
  }
  
  .sidebar-navigation li .fa {
    margin-right: 10px;
  }
  
  .sidebar-navigation li a:active,
  .sidebar-navigation li a:hover,
  .sidebar-navigation li a:focus {
    text-decoration: none;
    outline: none;
  }

  .sidebar-navigation li::before {
    background-color: rgba(233, 132, 54, .7) ;
    position: absolute;
    content: '';
    height: 100%;
    left: 0;
    top: 0;
    -webkit-transition: width 0.2s ease-in;
    transition: width 0.2s ease-in;
    width: 3px;
    z-index: -1;
  }
  
  .sidebar-navigation li:hover::before {
    width: 100%;
  }
  
  .sidebar-navigation .header {
    font-size: 16px;
    text-transform: uppercase;
    background-color: #e98436;
    padding: 10px 15px 10px 30px;
  }
  
  .sidebar-navigation .header::before {
    background-color: transparent;
  }
  
  .content-container {
    padding-left: 0px;
  }
  #pnlGraficas {
    /* z-index: 1001; */
    bottom: -400px;
    position: absolute;
    z-index: 1;
    background: rgba(0, 0, 0, .5);
    padding: 10px;
    width: 100%;
    align-content: center;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    display: none;
    overflow-x: hidden; 
    overflow-y: auto; 
    height: 0;
}
#pnlGraficas.toggled {
  display: flex;
  bottom: 0px;
  height: max-content;
}
.tarjetaEsta{
  border-color: black;
    border-width: 1px;
    border-radius: 25px;
}
.btnCerrar{
  -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
  display: none;
  /* right: 10px; */
  position: absolute;
  /* top: 10px; */
  bottom: -100px;
  background: black;
  color:white;
  box-shadow: 2px 2px 4px rgba(0, 0, 0,.5);
}
.btnCerrar:hover{
  background: black;
}

.btnCerrar.toggled{
  display: initial;
  bottom: 248px;
  
}

.pnlMenu{
  padding: 10px;
  font-size: 12px;
  color: white;
}
.btnFocus{
  
  background:rgba(223, 132, 54, .9);
  color:white;
  /* box-shadow: 2px 2px 4px rgb(223, 181, 22); */
}
.btnFocus:hover{
  background: rgba(223, 132, 54, 1);;
}
  
.ol-popup {
  /*font-size:1.6em;*/
  /*line-height:1em; */ 
  font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; 
	/*color:black;*/
	/*text-align: center;*/
  width:max-content;
  height:auto;
  position: absolute;
  background-color: white;
  border: 2px solid #949494;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  -webkit-box-shadow: 2px 2px 4px #888;
  -moz-box-shadow: 2px 2px 4px #888;
  box-shadow: 2px 2px 3px #888;
  padding: 0px;
  /*padding-top:2em;*/
  bottom: 50px;
  left: -60px;
  min-width: 280px;
  background-color: rgba(00,0,0,0.7);
}
.ol-popup:before {
  content: ' ';
  position: absolute;
  width: 0;
  height: 0;
  left: 30px;
  top: 100%;
  border: 10px solid;
  border-color: #949494 transparent transparent #949494;
 
}
.ol-popup:after {
  content: ' ';
  position: absolute;
  width: 0;
  height: 0;
  left: 32px;
  top: 100%;
  border: 8px solid;
  border-color: rgba(0, 0, 0, .7) transparent transparent rgba(0, 0, 0, .7) ;
 
}
td.tdPopUp {
  padding: 5px;
}
th.thPopUp{
  background-color: #000000;
}     
.bootstrap-iso .form-group button,
 .bootstrap-iso div a,
 .bootstrap-iso form input.form-control,
 .bootstrap-iso form textarea.form-control,
 .bootstrap-iso form select.form-control,
 .bootstrap-iso form .form-group-lg input.form-control,
 .bootstrap-iso form .form-group-lg textarea.form-control,
 .bootstrap-iso form .form-group-lg select.form-control,
 .bootstrap-iso form .form-group-sm input.form-control,
 .bootstrap-iso form .form-group-sm textarea.form-control,
 .bootstrap-iso form .form-group-sm select.form-control {
     -webkit-border-radius: 20px;
     -moz-border-radius: 20px;
     border-radius: 20px;
 }
 .bootstrap-iso .formden_header h2,
 .bootstrap-iso .formden_header p,
 .bootstrap-iso form {
     font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
     color: #555555
 }
 
 .bootstrap-iso form button,
 .bootstrap-iso form button:hover {
     color: #555555 !important;
 }
 .nav-link.active{
  background-color: #e98436 !important;
  color: white;
  font-size: 12px;
 }
 .nav-link {
  color: #e98436;
  font-size: 12px;
 }

 .nav-link.active.exito{
  background-color: #17d033 !important;
  color: white;
  font-size: 12px;
 
 }
 .nav-link.exito {
  color: #17d033;
  font-size: 12px;
  border-block-color: #17d033,
 }

 .nav-link.active.incom{
  background-color: #ffde0d !important;
  color: white;
  font-size: 12px;
 }
 .nav-link.incom {
  color: #ffde0d;
  font-size: 12px;
  border-color: #ffde0d,
 }
 .nav-link.active.fail{
  background-color: #ff2407 !important;
  color: white;
  font-size: 12px;
 }
 .nav-link.fail {
  color: #ff2407;
  font-size: 12px;
  border-block-color: #ff2407,
 }

 .panel-heading{
   background-color: white !important;
   border-radius: 10px;
 }
 .panel-body{
   padding: 8px;
 }
 .titleDlg {
  color: white;
  background-color:  #e98436 !important;
  border-radius: 7px;
  padding: 7px;
}
.titleDlg.exito {
  color: white;
  background-color:  #17d033 !important;
}
.titleDlg.incom {
  color: white;
  background-color:  #ffde0d !important;
}
.titleDlg.fail {
  color: white;
  background-color:  #ff2407 !important;
}
.btnClosePop{
  color: white !important;
  padding-right: 5px !important;
  /* padding-bottom: 5px !important; */
  /* padding-left: 5px !important; */
  
}
.btnClosePop:after{
  background-color: black !important;
  border-radius: 100%;
}
.ol-viewport>.ol-unselectable{
  height:  100% !important;
  height: -moz-available !important;          /* WebKit-based browsers will ignore this. */
  height: -webkit-fill-available !important;  /* Mozilla-based browsers will ignore this. */
  height: fill-available !important;
}

#snackbar {
  visibility: hidden;
  /*opacity: 0.7;*/
  min-width: 250px;
  margin-left: -125px;
  background-color: #333;
  color: #fff;
  text-align: center;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
  padding: 16px;
  position: fixed;
  z-index: 999;
  left: 50%;
  bottom: 30px;
  font-size: 20px;
}

#snackbar.show {
  visibility: visible;
  -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
  animation: fadein 0.5s, fadeout 0.5s 2.5s;
}

@-webkit-keyframes fadein {
  from {
      bottom: 0;
      opacity: 0;
  }
  to {
      bottom: 30px;
      opacity: 1;
  }
}

@keyframes fadein {
  from {
      bottom: 0;
      opacity: 0;
  }
  to {
      bottom: 30px;
      opacity: 1;
  }
}

@-webkit-keyframes fadeout {
  from {
      bottom: 30px;
      opacity: 1;
  }
  to {
      bottom: 0;
      opacity: 0;
  }
}

@keyframes fadeout {
  from {
      bottom: 30px;
      opacity: 1;
  }
  to {
      bottom: 0;
      opacity: 0;
  }
}