.fondo-obscuro {
  background-color: #3C1642;
}

.fondo-claro {
  background-color: #F1EBFF;
}

.titulo-obscuro {
  background-color: #00074D;
}

.subtitulos {
  background-color: #FFB6C1;
}


    /*LE DA ESTILO A LOS TOOLTIP DE ERRORES*/

    /*input:invalid ,select:invalid {
         border: 5px solid;
      border-color: #FF0000;
    }*/

    input.parsley-success,
    select.parsley-success,
    textarea.parsley-success {
        color: #000000;
        background-color: #ffffff;
        border: .25rem solid #00FFD8;
    }

    input.parsley-error,
    select.parsley-error,
    textarea.parsley-error {
        color: #C94A48;
        background-color: #F2DEDE;
        border: .5rem solid #FF0000;
    }

    .parsley-errors-list {
        margin: 2px 0 3px;
        padding: 0;
        list-style-type: none;
        font-size: 1em;
        line-height: 1em;
        opacity: 0;
        color: red;
        font-weight: bold;


        transition: all .3s ease-in;
        -o-transition: all .3s ease-in;
        -moz-transition: all .3s ease-in;
        -webkit-transition: all .3s ease-in;
    }

    .parsley-errors-list.filled {
        opacity: 1;
    }

    .form-section {
        display: none;
    }
    .form-section.current {
        display: inherit;
    }

    collapse{
        border: 1rem !important;
    }
    
    
    
/*<!--LOADER-->*/ 
    th{width:120rem;}
    .custom-tooltip {
      --bs-tooltip-bg: var(--bs-primary);
    }
#overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.75);
  display: none;
  align-items: center;
  justify-content: center;
  
}

.loader{
    position: relative;
    width: 6.25rem;
    height: 6.25rem;
}
.loader span{
    position: absolute;
    width: 100%;
    height: 100%;
    transform: rotate(calc(18deg * var(--i)));
}
.loader span::before{
    content: '';
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    background-color: #FFF;
    position: absolute;
    top: 0;
    left: 0;
	filter: blur(.75px);
    transform: scale(0);
    animation: load 2s linear infinite;
    animation-delay: calc(0.1s * var(--i));
}
@keyframes load {
    0%{
        transform: scale(0);
		opacity: 0;
    }   
    10%{
        transform: scale(1.2);
		opacity: 1;
    }
    80%,100%{
        transform: scale(0);
		opacity: 0;
    }
}
.plane{
    position: absolute;
    top: 0;
    left: 0;
    width: 6.25rem;
    height: 6.25rem;
    animation: rotate 2s linear infinite;
    animation-delay: -1.5s;
    
}
@keyframes rotate {
    0%{
        transform: rotate(0deg);
    }100%{
        transform: rotate(360deg);
    }
}
.plane .icon{
    font-size: 3rem;
    color: #FFF;
    position: absolute;
    top:  .3rem;
    left: 5rem;
    transform: rotate(45deg);
}