/* Minification failed. Returning unminified contents.
(48,26): run-time error CSS1039: Token not allowed after unary operator: '-image'
(50,26): run-time error CSS1039: Token not allowed after unary operator: '-image'
(133,22): run-time error CSS1039: Token not allowed after unary operator: '-bs-border-width'
(133,45): run-time error CSS1039: Token not allowed after unary operator: '-bs-border-style'
(133,68): run-time error CSS1039: Token not allowed after unary operator: '-bs-border-color'
(145,24): run-time error CSS1039: Token not allowed after unary operator: '-bs-border-width'
(145,47): run-time error CSS1039: Token not allowed after unary operator: '-bs-border-style'
(145,70): run-time error CSS1039: Token not allowed after unary operator: '-bs-border-color'
(178,12): run-time error CSS1038: Expected hex color, found '#ffff'
(205,12): run-time error CSS1038: Expected hex color, found '#ffff'
(255,12): run-time error CSS1038: Expected hex color, found '#ffff'
(294,12): run-time error CSS1038: Expected hex color, found '#ffff'
(314,12): run-time error CSS1038: Expected hex color, found '#ffff'
(475,12): run-time error CSS1038: Expected hex color, found '#ffff'
(576,1): run-time error CSS1035: Expected colon, found '}'
(729,28): run-time error CSS1039: Token not allowed after unary operator: '-bs-border-width'
(729,51): run-time error CSS1039: Token not allowed after unary operator: '-bs-border-style'
(729,74): run-time error CSS1039: Token not allowed after unary operator: '-bs-border-color'
(738,26): run-time error CSS1039: Token not allowed after unary operator: '-bs-border-width'
(738,49): run-time error CSS1039: Token not allowed after unary operator: '-bs-border-style'
(738,72): run-time error CSS1039: Token not allowed after unary operator: '-bs-border-color'
(823,1): run-time error CSS1019: Unexpected token, found '}'
(830,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(831,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(833,34): run-time error CSS1039: Token not allowed after unary operator: '-bs-gutter-x'
(834,33): run-time error CSS1039: Token not allowed after unary operator: '-bs-gutter-x'
(884,1): run-time error CSS1019: Unexpected token, found '}'
(939,23): run-time error CSS1038: Expected hex color, found '#ffff'
 */
* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

body {
    background-color: rgb(255, 255, 255);
}
/*custom clases*/
.custom-black-btn{
    background-color:black;
    color: white;
    border:none !important;
    border-radius:15px;
    cursor:pointer;
}
.custom-black-btn:hover {
    background-color: white;
    color: black;
    border: solid 1px black !important;
    border-radius: 15px;
}
.bg-gray-ligther {
    background-color: #cbcbd5;
}
.titles {
    font-size: 2.5rem;
    font-weight: 700;
}
/*Custom Effects*/
/*scale efect*/
@keyframes scaleEffectShow {
    from {
        
        scale: 85%;
        
    }

    to {
        
        scale: 100%;
    }
}


.scaleEffect {
    view-timeline-name: --image;
    view-timeline-axis: block;
    animation-timeline: --image;
    animation-name: scaleEffectShow;
}
/*floating scroll*/
.parallax-image {
    transition: transform 0.3s ease-out; /* Suaviza la transición */
}
/*flotting effect*/
.floating-element {
    /* Inicializa la animación */
    animation: float 3s ease-in-out infinite;
}

@keyframes float {
    0% {
        transform: translateY(0); /* Posición inicial */
    }

    50% {
        transform: translateY(-20px); /* Desplazamiento hacia arriba */
    }

    100% {
        transform: translateY(0); /* Vuelve a la posición inicial */
    }
}
/*typing effect cursor*/
.cursor {
    font-weight: bold;
    font-size: 2rem;
    color: white;
    animation: blink 0.75s step-end infinite;
}

@keyframes blink {
    50% {
        opacity: 0;
    }
}
/* Barra de navegacion */
/*estilos para el nuevo menu movil*/
.navbar-float-movile {
    z-index: 3 !important;
    position: absolute;
    width: 100% !important;
    text-align: center !important;
    top: -8px !important;
    background: rgb(13,13,13);
    background: linear-gradient(180deg, rgba(13,13,13,1) 0%, rgba(69,69,69,0.6643032212885154) 64%, rgba(79,79,79,0) 100%);
}
.navbar-brand img {
    max-width: 83px;
    height: auto;
}
.general-container-movil {
    position: relative;
}

.general-container-movil::before {
    content: '';
    position: absolute;
    box-shadow: 0 5px 5px #ddd;
    width: calc(100% - 158px);
    height: 10px;
    top: 46px;
    left: 0;
}
.contacto-navbar-container-movil {
    margin-top: 1.2rem !important;
}
.custom-shadow-movil {
    box-shadow: 4px 4px 4px #ddd !important;
}

.custom-shadow-inset-movil {
    box-shadow: 2px 5px 4px #ddd inset !important;
}
.contactanos-navbar-movil {
    padding-bottom: 0px;
    height: 100% !important;
    -webkit-border-top-left-radius: 21px;
    -moz-border-radius-topleft: 21px;
    border-top-left-radius: 21px;
    border-top: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
    margin: 0 0 0.5rem 0 !important;
    padding: 0.5rem 0.5rem 0 0.5rem !important;
    display: flex;
    justify-content: center;
    align-items: center;
}
.contacto-navbar-movil {
    height: 100% !important;
    -webkit-border-bottom-right-radius: 39px;
    -moz-border-radius-bottomright: 39px;
    border-bottom-right-radius: 21px;
    border-right: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
}
/*estilos para el nuevo menu movil*/

.general-container {
    /*position: relative;*/
}


.navbar {
    background-color: white;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .1);
    
}

.navbar-nav .nav-link {
    color:white;
    transition: font-weight 0.3s ease;
}

.navbar-nav .nav-link:hover {
    font-weight: bold;
}

.navbar-nav {
    margin-left: auto;
}

.nav-item {
    margin-left: 15px;
}

.especial a {
    color: #ffff;
    border-radius: 20px;
    background-color: #000000;
}

.especial a:hover {
    color: white;
}

/* footer */
.footicon {
    cursor: pointer;
    transition: transform 0.3s ease;
}
.footicon:hover {
    transform: scale(1.2);
}

.footlink:hover{
    font-weight:bold;
}
footer {
    background-color: #f4f4f4;
}


footer button {
    color: #ffff !important;
    border-radius: 20px !important;
    background-color: #000000 !important;
    border: none !important;
}

/* hero-section */
.text-third-card {
    font-size: 1.25rem !important;
}
.circle-loading {
    height: 10px;
    width: 10px;
    background-color:lightgray;
    margin-right: 5px;
    border-radius: 50rem;
}
.circle-loading-active {
    height: 10px;
    width: 20px;
    background-color: white;
    margin-right: 10px;
    border-radius: 50rem;
}
.columna-izquierda {
    padding: 0 15px;
}

.columna-izquierda .row {
    margin-bottom: 15px;
}

.columna-derecha {
    padding: 0 15px;
}
.columnaderechaimagen {
    background-image: url(../images/Banners/img-principal.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 40px !important;
    height: 450px;
}
.imagen2{
    background-image: url(../images/imagen2.png);
    background-size: cover;
    background-position: top;
    background-repeat: no-repeat;
    overflow: hidden;
    border-radius: 30px !important;
    color: #ffff;
    display: flex;
    flex-direction: column;
    justify-content:flex-end;
    font-size: x-large;
}
.imagen3{
    background-image: url(../images/software-developers-standing-near-vertical-screen-2023-11-27-05-21-49-utc.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    overflow: hidden;
}
.imagen4{
    background-image: url(../images/imag-2.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.imagen5{
    background-image: url(../images/imag-3.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

}
.imagen6{
    background-image: url(../images/imagen4.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.imagen7 {
    background-image: url(../images/imagen7.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    overflow: hidden;
    border-radius: 30px !important;
    color: #ffff;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    font-size: x-large;
}
.contenedor2{
    border-radius: 30px; 
    border: none;
    background-color: #ededf2;
    font-weight:400;
    overflow: hidden;
}
.flecha {
    top: 1%;
    left: 37%;
    position: absolute;
}
.flecha:hover,.btn-handle-slide:hover,.btn-categories:hover{
    background-color: #000000 !important;
    color: #ffff;
}
.columna-derecha .texto {
    top: 0%;
    right: -14px;
    font-size: 1rem;
    font-weight: 700;
    position: absolute;
}

.secon-section h1{
    font-size: 3.5rem;
    font-weight: 700;
}
.container-slide {
    width: 350px !important;
}
.circle-carrousel {
    padding-left: 5px;
    height: 80px;
    width: 80px;
    background-color: black;
    border-radius: 50rem;
    display:flex;
    align-items:center;
    justify-content:center;
}
.circle-carrousel img {
    height: 40px;
}


.blur-effect{
    position: relative;
}

.blur-effect::before,
.blur-effect::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    width: 50px; /* Ajusta el ancho del degradado según tus necesidades */
    pointer-events: none; /* Para que no interfieran con los eventos del mouse */
    z-index: 1; /* Asegura que el degradado esté sobre el contenido de la card */
}

.blur-effect::before {
    left: 0;
    background: linear-gradient(to right, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
}

.blur-effect::after {
    right: 0;
    background: linear-gradient(to left, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
}

.capacity{
    background-color: lightgray;
    border-radius:50rem;
    max-width:250px;
    display:flex;
    gap:10px;
}


.four-section h1 {
    font-size: 3rem;
    font-weight: 700;
}
.cards-fours-container {
    overflow-x: scroll !important
}
.cards-fours-container::-webkit-scrollbar {
    display: none;
}


/*-------*/
.slider {
    width: 100%;
    overflow: hidden;
    position: relative;
}
.slide-track {
    
    animation: scroll 20s linear infinite;
     -webkit-animation: scroll 20s linear infinite;
     display:flex;
}

@keyframes scroll {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    100% {
        -webkit-transform: translateX(calc(-200px * 5)); /* Ajustar la distancia de la animación */
    }
}

.slide {
    min-width: 260px;
    height: 367px;
    margin: 0 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.5em;
}
/*--------*/
.input-container {
    width: 80% !important;
    display: flex;
    background-color: #E8EBEE;
    border-radius: 8px;
    padding: 8px 5px 8px 5px;
}
.input-four-section {
    width:95%;
    background-color: transparent;
    border: none;
}
.input-four-section:focus {
     outline: none; 
     box-shadow: none; 
     border-color: initial; 
}
.btn-handle-slide {
    position: absolute;
    transform: translate(-50%, -50%);    
}
#rightBtn {
    top: 50%;
    left: 100%;
}
#leftBtn {
    top: 50%;
    left: 0;
}
.card-demo-img {
    width: 100% !important;
    height: 100% !important;
}
.btn-handle-slide, .btn-categories {
    cursor: pointer !important;
}

.grupobotones {
    gap: 5px !important;
}

.grupobotones button{
    border-radius: 20px !important;
    padding: 5px;
    color: #000000 !important;
    background-color: transparent !important;
}

.grupobotones button:hover{
    color: #ffff !important;
    background-color: #000000 !important;
}


.five-section{
    background-color: #f4f4f4;
    border-radius: 40px;
    border: none;
}
.five-section h1{
    font-size: 2rem;
    font-weight: 700;
}

.five-section-small-img-1, .five-section-small-img-2 {
    border: 7px solid white !important;
}
.five-section-small-img-1 {
    width:60%; 
}
.five-section-small-img-2 {
    width: 35%;
}

.tooltip-container {
    position: relative;
    display: inline-block;
}

.tooltip-text {
    visibility: visible;
    width: 120px;
    background-color: white;
    color: black;
    text-align: center;
    border-radius: 50rem;
    padding: 5px;
    position: absolute;
    z-index: 1;
    bottom: 125%; 
    left: 50%;
    margin-left: -60px; 
    opacity: 1;
    transition: opacity 0.3s;
}

    /* Flecha del tooltip */
.tooltip-text::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: white transparent transparent transparent;
}
.lead {
    font-size: 1em !important;
    font-weight: 300;
}
/* carrusel */
.tre-section .carousel-inner .carousel-item .card {
    background-color: #cbcbd5;
    border-radius: 50px;
    border: none;
    width: 95%;
    height: 80%;
}
.tre-section .carousel-inner .carousel-item .card .card-body{
    display: flex;
    flex-direction: row;
}
.tre-section-imgs{
    height:390px;
}
.tre-section-imgs-title {
    position: absolute;
    left: 16%;
    top: 0 !important;
    font-size: calc(1.1rem + 0.3vw) !important;
    font-weight: 700 !important;
    max-width: 250px;
}
/*four section*/
.carousel-logo{
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 40px;
    height: 40px
}
.carousel-img {
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}
/*clients section*/
.client-img{
    width
}
/*BOOTSTRAP BREAKPOINTS */
@media (min-width: 534px) {
    .tre-section-imgs-title {
        left: 29%;
    }

}
/*Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
    .flecha {
        top: 1%;
        left: 42%;
        position: absolute;
    }

    .columna-derecha .texto {
        top: 8%;
        right: 5px;
        font-size: 1rem;
        font-weight: 700;
        position: absolute;
    }
    /*cuarta section*/
    .slide {
        min-width: 324px;
        height: 401px;
    }

    .five-section-small-img-1 {
        width: 60%;
    }

    .five-section-small-img-2 {
        width: 35%;
    }

    .tre-section-imgs {
        height: 500px;
    }
    .container-slide {
        width: 400px !important;
    }
}
/*Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
    .titles {
        font-size: 3rem;
        font-weight: 700;
    }
    .imagen6 {
        min-width: 100%;
        min-height: 100%;
    }
    .flecha {
        top: 4%;
        left: 47%;
    }
    .columna-derecha .texto {
        top: 9%;
        right: 29px;
    }
    .text-third-card {
        font-size: 2rem !important;
    }
    .flecha {
        top: 1%;
        left: 47%;
    }
    .columna-derecha .texto {
        top: 6%;
        right: 88px;
    }
    .five-section-small-img-1 {
        width: 90%;
    }
    .tre-section-imgs {
        height: 630px;
    }
    .tre-section-imgs-title {
        font-size: calc(1.7rem + 0.3vw) !important;
        
    }
    .linksFooter{
        min-width:445px;
    }
    
    
}
@media (min-width: 816px) {
    .columnaderechaimagen {
        height: 530px;
    }
}
@media (min-width: 903px){
    .btn-handle-slide {
        position: static;
        transform: none;
    }

}
/*Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
    /*custom classes*/
    .fs-lg-5 {
        font-size: 1.25rem !important;
    }
    /*navbar*/
    .navbar-nav .nav-link {
        color: black;
        transition: font-weight 0.3s ease;
    }

    .navbar-float-movile {
        z-index: 3 !important;
        position: static;
        width: auto !important;
        text-align: center !important;
        background: linear-gradient(to bottom, white 0%, white 100%);
    }

    .navbar-brand img {
        max-width: 140px;
        height: auto;
    }

    .shadow-none-custom {
        box-shadow: none !important;
    }

    .general-container {
        position: relative;
    }

    .general-container-movil::before {
        content: '';
        position: absolute;
        box-shadow: 0 5px 5px #ddd;
        width: calc(100% - 158px);
        height: 10px;
        top: 63px;
        left: 0;
    }

    .contacto-navbar-container {
        margin-top: 1.2rem !important;
    }

    .contacto-navbar {
        height: 100% !important;
        -webkit-border-bottom-right-radius: 39px;
        -moz-border-radius-bottomright: 39px;
        border-bottom-right-radius: 21px;
        border-right: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
    }

    .contactanos-navbar {
        padding-bottom: 0px;
        height: 100% !important;
        -webkit-border-top-left-radius: 21px;
        -moz-border-radius-topleft: 21px;
        border-top-left-radius: 21px;
        border-top: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
        margin: 0 0 0.5rem 0 !important;
        padding: 0.5rem 0.5rem 0 0.5rem !important;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .navbar-nav .nav-link-nohover:hover {
        font-weight: normal;
    }

    .shadow-normal-custom {
        box-shadow: 0px 0px 4px #ddd !important;
    }

    .custom-shadow {
        box-shadow: 4px 4px 4px #ddd !important;
    }

    .custom-shadow-inset {
        box-shadow: 2px 5px 4px #ddd inset !important;
    }

    /*navbar*/
    
    @keyframes scroll {
        0% {
            -webkit-transform: translateX(0);
            transform: translateX(0);
        }

        100% {
            -webkit-transform: translateX(calc(-250px * 5)); /* Ajustar la distancia de la animación */
        }
    }

    .slide {
        min-width: 363px;
        height: 465px;
    }
    .secon-section h2 {
        font-size: 3rem;
        font-weight: 700;
    }

    .five-section h1 {
        font-size: 2rem;
    }

    .lead {
        font-size: 1.25rem !important;
    }

    

    .columna-derecha {
        width: 80%;
    }

    .columnaderechaimagen {
        height: 650px;
        width: 100%;
    }

    .columna-derecha .texto {
        top: 1%;
        right: -20px;
    }

    .flecha {
        top: 4%;
        left: 36%;
    }

    .input-container {
        width: 40% !important;
    }
    .tre-section-imgs-title {
        left: 14%;
    }
    .linksFooter {
        min-width: 586px;
    }

}
/*X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    .p-lg-6 {
        padding: 4rem !important;
    }
    .container-xl-fluid {
        --bs-gutter-x: 1.5rem !important;
        --bs-gutter-y: 0 !important;
        width: 100% !important;
        padding-right: calc(var(--bs-gutter-x)* 0.5) !important;
        padding-left: calc(var(--bs-gutter-x)* 0.5);
        margin-right: auto !important;
        margin-left: auto !important;
    }
    .imagen6 {
        min-width: 720px;
        min-height: 483px;
    }
    
    @keyframes scroll {
        0% {
            -webkit-transform: translateX(0);
            transform: translateX(0);
        }

        100% {
            -webkit-transform: translateX(calc(-330px * 5)); /* Ajustar la distancia de la animación */
        }
    }

    .slide {
        width: 470px;
        height: 453px;
    }
    .flecha {
        top: 4%;
        left: 45%;
    }
    .columnaderechaimagen {
        height: 80vh;
        width: 100%;
    }
    .columna-derecha .texto {
        top: 1%;
        right: -6px;
    }
    .imagen2 {
        border-radius: 40px !important;
        
    }
    .contenedor2 {
        border-radius: 40px;
    }
    .tre-section-imgs {
        height: 690px;
    }
    .tre-section-imgs-title {
        left: 17%;
    }
    
}
    
/* XX-Large devices (larger desktops, 1400px and up)*/
@media (min-width: 1400px) {
    
    .imagen6 {
        min-width: 634px;
        min-height: 485px;
    }
    .five-section h1 {
        font-size: 3rem;
    }
    .columna-derecha .texto {
        top: 13%;
        right: -8px;
    }
    .columnaderechaimagen {
        height: 80vh;
    }
    .tre-section-imgs-title {
        left: 23%;
    }
    
}
@media (min-width: 1526px) {
    .columna-derecha .texto {
        top: 13%;
        right: 36px;
    }
}
@media (min-width: 1600px) {
    .flecha {
        top: 4%;
        left: 49%;
    }
    .columna-derecha .texto {
        top: 11%;
        right: 93px;
    }
}
.iconos img{
    width: 50px;
    height: 50px;
}

/* contactanos */
.contactanos_principal{
    border: none;
}
.contactanos{
    border-radius: 1px !important;
    background-color: #eef3f6;
    border: none !important;
}
.contactanos_form{
    background-color: #ffff;
}
.contactanos_principal h3{
    font-weight: 700;
}
/*Banners carrousel*/
.bg-me {
    background: url('../images/banners/Banner-ME.png');
    background-repeat: no-repeat;
    background-position:left;
    background-size:cover;
}