.bg_aliceblue{
  background-color: aliceblue !important;
}

.bg_tbl_acti{
  background-color: #c7ccd1 !important;
}

.card-primary.card-outline-tabs>.card-header a.active {
    border-top: 3px solid #007bff !important;
    background-color: #4777ab !important;
    color: white !important;
}

.hidden{ display:none !important; }

.pointer{ cursor:pointer; }
.pointer_default{ cursor:default; }

.circulo-rojo {
  border:0.5px solid red;
  border-radius: 50%;
  width: 20px !important;
  height: 20px !important;
  background: red;
}

.circulo-naranja {
  border:0.5px solid orange;
  border-radius: 50%;
  width: 20px !important;
  height: 20px !important;
  background: orange;
}

.circulo-verde {
  border:0.5px solid green;
  border-radius: 50%;
  width: 20px !important;
  height: 20px !important;
  background: green;
}

.circulo-amarillo {
  border:0.5px solid yellow;
  border-radius: 50%;
  width: 20px !important;
  height: 20px !important;
  background: yellow;
}

.switch {
  position: relative;
  display: inline-block;
  width: 50px;
  height: 24px;
  margin-top: 8px;
}

.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 16px;
  width: 16px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #52f421;
}

input:focus + .slider {
  box-shadow: 0 0 1px #52f421;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}

.parpadea {
  
  animation-name: parpadeo;
  animation-duration: 1s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;

  -webkit-animation-name:parpadeo;
  -webkit-animation-duration: 1s;
  -webkit-animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
}

@-moz-keyframes parpadeo{  
  0% { opacity: 1.0; }
  50% { opacity: 0.0; }
  100% { opacity: 1.0; }
}

@-webkit-keyframes parpadeo {  
  0% { opacity: 1.0; }
  50% { opacity: 0.0; }
   100% { opacity: 1.0; }
}

@keyframes parpadeo {  
  0% { opacity: 1.0; }
   50% { opacity: 0.0; }
  100% { opacity: 1.0; }
}

.grafico {
  position: relative; /* IE is dumb */
  border: 1px solid #B1D632;
  width: 100%;
  padding: 1px;
}

.grafico .barra {
  display: block;
  position: relative;
  text-align: center;
  color: #333;
  height: 1em;
  line-height: 2em;
}

.grafico .barra span {
  position: absolute; left: 1em;
}

.gf_rojo{
  background: red;
}

.gf_verde{
  background: green;
}

.gf_azul{
  background: blue;
}

.btn_fon{
  background: cadetblue;
}

.no-wrap{
  white-space: nowrap;
}

/* Estilo para el FIELDSET */
.custom-fieldset {
  /* El borde es lo que ves como la lÃ­nea alrededor */
  border: 1px solid #ccc; /* Un borde gris claro, puedes ajustarlo */
  padding: 10px; /* Espacio interior */
  margin-bottom: 20px; /* Espacio debajo del grupo */
  border-radius: 4px; /* Bordes ligeramente redondeados (opcional) */
}

/* Estilo para el LEGEND */
.custom-fieldset legend {
  /* Importante: AÃ±adimos padding para que la lÃ­nea no pase por debajo del texto */
  padding: 0 10px; 
  
  /* Importante: Quitamos el border-bottom (algunos navegadores lo aÃ±aden) */
  border-bottom: none; 
  
  /* El background puede ser Ãºtil si quieres que el texto cubra completamente el borde */
  background-color: #fff; /* Fondo blanco para que tape la lÃ­nea detrÃ¡s (ajusta si tu fondo no es blanco) */
  
  /* Opcional: Estilos para el texto */
  font-size: 1.1em;
  font-weight: bold;
  color: #333;
}