.main{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  flex-wrap: wrap;
  background-color: #f7f9fb;
  z-index: 1000000;
  overflow: hidden;
}

#cargando{
  color: #696969;
  text-align: center;
}

.main .loader{
  display: inline-block;
  width: auto;
}
#cargando .preloader{
  display: inline-block;
  width: 70px;
  height: 70px;
  top: 0;
  left: 0;
  border: 10px solid #eeeeee;
  border-top: 10px solid #666666;
  border-radius: 50%;
  animation-duration: 1.5s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  animation-name: loading;
}
#cargando .tag{
  font-size: 16px;
  display: inline-block;
  width: 100%;
  margin-top: 8px;
}

@keyframes loading {
  0%{
    transform: rotateZ(0deg);
  }
  100%{
    transform: rotateZ(360deg);
  }
}



.bg-azul{

  background-color: rgb(209, 220, 1);

}



.bg-verde{

  background-color: rgb(30, 170, 30);

}



.bg-rojo{ 

  background-color: rgb(247, 154, 14);

}



#kt_header > .d-flex > .align-items-stretch{

  width: 100%;

  justify-content: space-between;

}

 @media (min-width: 992px){

  .header-menu .menu-nav > .menu-item > .menu-link{

    background: darkorange;

  }

  body .header .header-logo .logo-sticky{

    max-height: 200px!important;

  }

}

.subheader{

  max-width: 1290px;

  margin: 20px auto;

  background: rgba(255,255,255,0.9);

  width: 100%;

  border-radius: 5px;

  padding: 15px!important;

}

.subheader > .container{

  justify-content: center!important;

}

.subheader h2{

  color: #000000!important;

}

.card{

  background: rgba(255,255,255,0.9)!important;

}



#chart {

  max-width: 760px;

  margin: 35px auto;

  opacity: 0.9;

}



.arrow_box {

  position: relative;

}

.arrow_box:after, .arrow_box:before {

  right: 100%;

  top: 50%;

  border: solid transparent;

  content: " ";

  height: 0;

  width: 0;

  position: absolute;

  pointer-events: none;

}



.arrow_box:after {

  border-width: 10px;

  margin-top: -10px;

}

.arrow_box:before {

  border-width: 13px;

  margin-top: -13px;

}



#chart .apexcharts-tooltip {

  color: #fff;

  transform: translateX(10px) translateY(10px);

  overflow: visible !important;

  white-space: normal !important;

}



#chart .apexcharts-tooltip span {

  padding: 5px 10px;

  display: inline-block;

}