.scroll-down-btn {
    display: inline-block;
    text-decoration: none;
}

    .scroll-down-btn p {
        margin-top: 1.25rem;
        color: white;
        font-size: .875rem;
        font-weight: 500;
        letter-spacing: .375rem;
        text-indent: .375rem;
        animation: colorText 5s ease-out infinite, nudgeText 5s ease-out infinite;
    }

.mouse {
    background: #2c333e linear-gradient(transparent 0%, transparent 50%, white 50%, white 100%);
    position: relative;
    width: 38px;
    height: 65px;
    margin: 0 auto;
    border-radius: 6rem;
    background-size: 100% 200%;
    animation: colorSlide 5s linear infinite, nudgeMouse 5s ease-out infinite;
}

    .mouse:before, .mouse:after {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        margin: auto;
    }

    .mouse:before {
        width: 34px;
        height: 61px;
        background-color: #121519;
        border-radius: 6rem;
    }

    .mouse:after {
        background-color: white;
        width: .375rem;
        height: .375rem;
        border-radius: 100%;
        animation: trackBallSlide 5s linear infinite;
    }

@keyframes colorSlide {
    0% {
        background-position: 0% 100%;
    }

    20% {
        background-position: 0% 0%;
    }

    21% {
        background-color: #2c333e;
    }

    29.99% {
        background-color: white;
        background-position: 0% 0%;
    }

    30% {
        background-color: #2c333e;
        background-position: 0% 100%;
    }

    50% {
        background-position: 0% 0%;
    }

    51% {
        background-color: #2c333e;
    }

    59% {
        background-color: white;
        background-position: 0% 0%;
    }

    60% {
        background-color: #2c333e;
        background-position: 0% 100%;
    }

    80% {
        background-position: 0% 0%;
    }

    81% {
        background-color: #2c333e;
    }

    90%, 100% {
        background-color: white;
    }
}

@keyframes trackBallSlide {
    0% {
        opacity: 1;
        transform: scale(1) translateY(-20px);
    }

    6% {
        opacity: 1;
        transform: scale(0.9) translateY(5px);
    }

    14% {
        opacity: 0;
        transform: scale(0.4) translateY(40px);
    }

    15%, 19% {
        opacity: 0;
        transform: scale(0.4) translateY(-20px);
    }

    28%, 29.99% {
        opacity: 1;
        transform: scale(1) translateY(-20px);
    }

    30% {
        opacity: 1;
        transform: scale(1) translateY(-20px);
    }

    36% {
        opacity: 1;
        transform: scale(0.9) translateY(5px);
    }

    44% {
        opacity: 0;
        transform: scale(0.4) translateY(40px);
    }

    45%, 49% {
        opacity: 0;
        transform: scale(0.4) translateY(-20px);
    }

    58%, 59.99% {
        opacity: 1;
        transform: scale(1) translateY(-20px);
    }

    60% {
        opacity: 1;
        transform: scale(1) translateY(-20px);
    }

    66% {
        opacity: 1;
        transform: scale(0.9) translateY(5px);
    }

    74% {
        opacity: 0;
        transform: scale(0.4) translateY(40px);
    }

    75%, 79% {
        opacity: 0;
        transform: scale(0.4) translateY(-20px);
    }

    88%, 100% {
        opacity: 1;
        transform: scale(1) translateY(-20px);
    }
}

@keyframes nudgeMouse {
    0%, 30%, 60%, 90% {
        transform: translateY(0);
    }

    20%, 50%, 80% {
        transform: translateY(8px);
    }
}

@keyframes nudgeText {
    0%, 30%, 60%, 90% {
        transform: translateY(0);
    }

    20%, 50%, 80% {
        transform: translateY(2px);
    }
}

@keyframes colorText {
    21%, 51%, 81% {
        color: #2c333e;
    }

    30%, 60%, 90% {
        color: white;
    }
}


.bg-primary {
   
    background-color: rgb(0 126 222) !important;
}
.card-hover-primary:hover {
    background-color: rgb(0 126 222) !important;
    border-color: rgb(0 126 222) !important;
}
.btn-primary {
    --ar-btn-hover-color: #fff;
    --ar-btn-active-color: #fff;
    --ar-btn-hover-bg: #026ab9;
    --ar-btn-active-bg: #026ab9;
    --ar-btn-hover-border-color: #026ab9;
    --ar-btn-active-border-color: #026ab9;
    --ar-btn-disabled-color: #fff
}
.btn-primary {
    --ar-btn-bg: #007ede;
    --ar-btn-border-color: #007ede;
}
[data-bs-theme=dark] .card-hover-primary:hover {
    background-color: #056ebe !important;
    border-color: #056ebe !important;
}
.bg-main {
    background: #f0ece3 !important;
}
.bg-main-2 {
    background: #006ec1 !important;
}
.bg-main-3 {
    background: #ede8df  !important;
}
        .navbar-nav .nav-link.active, .navbar-nav .nav-link.show {
    color: #007ede !important
}
.nav-link:hover, .nav-link:focus,
.dropdown-menu li:hover > .dropdown-item,
.dropdown-menu .dropdown-item.show,
.navbar .nav-item:hover > .nav-link:not(.disabled), .navbar .nav-item .nav-link.show:not(.disabled),
.nav-link.active, .breadcrumb-item.active,
h1 > a:hover, .h1 > a:hover, h2 > a:hover, .h2 > a:hover, h3 > a:hover, .h3 > a:hover, h4 > a:hover, .h4 > a:hover, h5 > a:hover, .h5 > a:hover, h6 > a:hover, .h6 > a:hover {
    color: #007ede !important;
}
.text-primary {
    
    color: rgb(0 126 222) !important;
}
.swiper-pagination-bullet-active {
    background-color: #007ede !important;
    border-color: #007ede !important;
}
.swiper-pagination-bullet {
   
    border: var(--ar-carousel-pagination-bullet-border-width) solid #007ede;
}
.btn:hover {
    color: var(--ar-btn-hover-color);
    background-color: #007ede;
    border-color: #007ede;
}
.btn-outline-primary {
    --ar-btn-color: #007ede;
    --ar-btn-border-color: #007ede;
    --ar-btn-hover-color: #fff;
    --ar-btn-hover-bg: #007ede;
    --ar-btn-hover-border-color: #007ede;
    --ar-btn-focus-shadow-rgb: 68, 140, 116;
    --ar-btn-active-color: #fff;
    --ar-btn-active-bg: #007ede;
   
}

@media (max-width: 991.98px) {
    .offcanvas-lg {
        background-color: #f0ece3;
    }
}
@media (max-width: 720px) {
    .wa-asesoria {
        right: -80px!important;
    }
     
}
@media (max-width: 420px) {
    .wa-asesoria {
        right: -90px !important;
    }
}
@media (max-width: 375px) {
    .wa-asesoria {
        right: -90px !important;
    }
}