.scrollbar-indigo::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
    background-color: #F5F5F5;
    border-radius: 10px;
}

.scrollbar-indigo::-webkit-scrollbar {
    width: 12px;
    background-color: #F5F5F5;
}

.scrollbar-indigo::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
    background-color: #3f51b5;
}

.scrollbar-indigo {
    scrollbar-color: #3f51b5 #F5F5F5;
}

.bordered-indigo::-webkit-scrollbar-track {
    -webkit-box-shadow: none;
    border: 1px solid #3f51b5;
}

.bordered-indigo::-webkit-scrollbar-thumb {
    -webkit-box-shadow: none;
}

.thin::-webkit-scrollbar {
    width: 6px;
}

.scrollbar {
    float: left;
    background: #fff;
    overflow-y: auto;
    overflow-x: hidden;
}

.my-custom-scrollbar {
    position: relative;
    max-height: 237px;
    overflow: auto;
}
/**************************/
.table-wrapper-scroll-y {
    display: block;
}

.progress-bar { /*transition: width 250ms ease-in-out;*/
    transition: width 1.5s ease-in-out;
}

.pt-3-half {
    padding-top: 1.4rem;
}

.red-gradient {
    background: linear-gradient(10deg,var(--red),#a0000f) !important;
}

.verdeTitulo {
    background-color: #9DC27F !important;
}

@-webkit-keyframes tadaInfinito {
    from {
        -webkit-transform: scale3d(1,1,1);
        transform: scale3d(1,1,1);
    }

    0%,1% {
        -webkit-transform: scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg);
        transform: scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg);
    }

    2%,4%,6%,8% {
        -webkit-transform: scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg);
        transform: scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg);
    }

    3%,5%,7% {
        -webkit-transform: scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg);
        transform: scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg);
    }

    9% {
        -webkit-transform: scale3d(1,1,1);
        transform: scale3d(1,1,1);
    }
}

@keyframes tadaInfinito {
    from {
        -webkit-transform: scale3d(1,1,1);
        transform: scale3d(1,1,1);
    }

    0%,1% {
        -webkit-transform: scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg);
        transform: scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg);
    }

    2%,4%,6%,8% {
        -webkit-transform: scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg);
        transform: scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg);
    }

    3%,5%,7% {
        -webkit-transform: scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg);
        transform: scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg);
    }

    9% {
        -webkit-transform: scale3d(1,1,1);
        transform: scale3d(1,1,1);
    }
}

/*Animación lista*/
.grow a {
    -webkit-transition: all 700ms ease;
    -moz-transition: all 700ms ease;
    -ms-transition: all 700ms ease;
    -o-transition: all 700ms ease;
    transition: all 700ms ease;
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
}

    .grow a.past {
        -webkit-transform: scale(0.01);
        -moz-transform: scale(0.01);
        -ms-transform: scale(0.01);
        -o-transform: scale(0.01);
        transform: scale(0.01);
    }

    .grow a.future {
        -webkit-transform: scale(0.01);
        -moz-transform: scale(0.01);
        -ms-transform: scale(0.01);
        -o-transform: scale(0.01);
        transform: scale(0.01);
    }

.tadaInfinito { /**/
    -webkit-animation: tadaInfinito 10s infinite;
    animation: tadaInfinito 10s infinite;
}

/* backgraund principal*/
.imgPrincipal {
    height: 60%;
    width: 100%;
}

/* botones rosas preregistro y preinscripción*/
.btn-rosa {
    background-color: #ea8bab !important;
    color: #fff;
}

.btn-circle {
    width: 30px;
    height: 30px;
    text-align: center;
    padding: 6px 0;
    font-size: 12px;
    line-height: 1.428571429;
    border-radius: 15px;
}

/* para hacer efecto de objeto deshabilitado en los divs */
.cssDeshabilita {
    pointer-events: none;
    opacity: 0.7;
    cursor: not-allowed !important;
}

/* Solución a cambios de estilo de Chrome */
@-webkit-keyframes autofill {
    to {
        color: #666;
        background: transparent;
    }
}

@keyframes autofill {
    to {
        color: #666;
        background: transparent;
    }
}

input:-webkit-autofill {
    -webkit-animation-name: autofill;
    animation-name: autofill;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

/* Texto Responsivo*/
#demo .title {
    font-size: 3rem;
    margin: 0 0 .5em;
}

@media (max-width: 1200px) {
    #demo .title {
        font-size: calc(1.525rem + 3.3vw);
    }
}

#demo .article {
    background: white;
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
    padding: 20px 25px;
}

    #demo .article:not(:first-of-type) {
        margin-top: 20px;
    }

#demo .article__title {
    font-size: 1.6875rem;
    margin: 0;
}

@media (max-width: 1200px) {
    #demo .article__title {
        font-size: calc(1.29375rem + 0.525vw);
    }
}

#demo .article__date {
    padding-top: .25em;
    font-size: 0.75rem;
    opacity: .75;
    font-style: italic;
}

#demo .article__content {
    padding-top: .75em;
    font-size: 1rem;
    margin: 0;
    line-height: 1.4;
}