.container-experiencias {
    width: 100%;
    height: 454px;
    position: relative;
    background: var(--Color-Surface-General-Inverse, #00402A);
}

.container-relativo{
        position: relative;
        margin-left: calc(50% - 360px / 2);
}

.container-info-experiencias {
    width: 319px; /*328*/
    left: calc(50% - 319px / 2);
    top: 163px;
    position: absolute;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    gap: 32px;
    display: inline-flex;
}

.contaniner-text-experiencias {
    align-self: stretch;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 16px;
    display: flex;
}

.container-experiencias .xs\:title_s,
.container-experiencias .lg\:title_m,
.container-experiencias .xl\:title_xl {
    align-self: stretch;
    text-align: center;
    color: var(--Color-Content-General-Inverse, white);
    /* font-size: 24px;
    font-family: IberPangea;
    font-weight: 600;
    line-height: 32px;
    word-wrap: break-word; */
}

.xs\:title_s {
    font-family: var(--font-family-1-smbold);
    font-size: var(--size-font-175);
    line-height: var(--size-font-line-height-xl);
    font-style: var(--font-style-normal);
}

.container-experiencias .xs\:body_regular_l,
.container-experiencias .lg\:body_regular_xl {
    align-self: stretch;
    text-align: center;
    color: var(--Color-Content-General-Inverse, white);
    /* font-size: 18px;
    font-family: IberPangea;
    font-weight: 400;
    line-height: 24px;
    word-wrap: break-word; */
}

.xs\:body_regular_l {
    font-family: var(--font-family-1-regular);
    font-size: var(--size-font-125);
    line-height: var(--size-font-line-height-m);
    font-style: var(--font-style-normal);
}

/* .container-imgs {
    width: 429px;
    height: 330px;
    left: 0px;
    top: 0px;
    position: relative;
  } */

.img-1 {
    width: 86px;
    height: 113px;
    left: 0px;
    top: 304.7px;
    position: absolute;
    border-radius: 8px;
}

.img-2 {
    width: 96px;
    height: 122px;
    left: 24px;
    top: 29px;
    position: absolute;
    border-radius: 8px;
}

.img-3 {
    width: 107px;
    height: 58px;
    left: 130px;
    top: 319.7px;
    position: absolute;
    border-radius: 8px;
}

.img-4 {
    width: 100px;
    height: 51px;
    left: 237px;
    top: 83px;
    position: absolute;
    border-radius: 8px;
}

.img-5 {
    width: 94px;
    height: 108px;
    left: 284px;
    top: 323.7px;
    position: absolute;
    border-radius: 8px;
}

.img-6,
.img-7 {
    display: none;
}

.container-experiencias,
    .container-imgs {
        position: relative;
    }
    
    .container-imgs img {
        position: absolute;
        transition: transform 1s ease;
    }

    .container-experiencias:hover .container-imgs .img-1 {
    transform: translate(-50px, -50px);
}

.container-experiencias:hover .container-imgs .img-2 {
    transform: translate(50px, -30px);
}

.container-experiencias:hover .container-imgs .img-3 {
    transform: translate(30px, 50px);
}

.container-experiencias:hover .container-imgs .img-4 {
    transform: translate(60px, -40px);
}

.container-experiencias:hover .container-imgs .img-5 {
    transform: translate(40px, 70px);
}

@media(min-width: 576px) {
    .container-experiencias {
        height: 514px;
    } 
    .container-relativo{
        position: relative;
        margin-left: calc(50% - 576px / 2);
    }
    .container-info-experiencias {
        width: 400px;
        left: calc(50% - 400px / 2);
        top: 209px;
        padding: var(--size-space-0);
    }

    /* .container-imgs {
      width: 100%;
      height: 330px;
      left: 0px;
      top: 0px;
    } */

    .img-1 {
        width: 117px;
        height: 153.73px;
        left: 17px;
        top: 345px;
    }

    .img-2 {
        width: 119.08px;
        height: 151.33px;
        left: 74px;
        top: 16px;
    }

    .img-3 {
        width: 107px;
        height: 58px;
        left: 221px;
        top: 405px;
    }

    .img-4 {
        width: 133.39px;
        height: 72.03px;
        left: 368px;
        top: 86px;
    }

    .img-5 {
        width: 129px;
        height: 148.21px;
        left: 447px;
        top: 366px;
    }
}

@media(min-width: 768px) {
    .container-experiencias {
        height: 582px;
        flex-shrink: 0;
    }

    .container-relativo{
        position: relative;
        margin-left: calc(50% - 768px / 2);
    }
    
    .container-info-experiencias {
        width: 400px;
        left: calc(50% - 400px / 2);
        top: 243px;
    }

    .container-experiencias .md\:body_regular_xl {
        font-family: var(--font-family-1-regular);
        font-size: var(--size-font-175);
        line-height: var(--size-font-line-height-xl);
        font-style: var(--font-style-normal);
    }

    .img-1 {
        width: 193px;
        height: 244px;
        left: -41px;
        top: 44px;
    }

    .img-2 {
        width: 116px;
        height: 146.653px;
        left: 258px;
        top: 41px;
    }

    .img-3 {
        width: 192px;
        height: 104px;
        left: 323px;
        top: 394px;
    }

    .img-4 {
        width: 192px;
        height: 104px;
        left: 549px;
        top: 62px;
    }

    .img-5 {
        width: 192px;
        height: 242px;
        left: 645px;
        top: 363px;
    }

    .img-6 {
        display: flex;
        width: 192px;
        height: 105px;
        left: 0px;
        top: 477px;
        position: absolute;
        border-radius: 8px;
    }

.container-experiencias:hover .container-imgs .img-6 {
    transform: translate(-30px, 20px);
}
}

@media(min-width: 992px) {
    .container-experiencias {
        height: 512px;
    }

    .container-relativo{
        position: relative;
        margin-left: calc(50% - 992px / 2);
    }
    .container-info-experiencias {
        width: 550px;
        left: calc(50% - 550px / 2);
        top: 210px;
    }

    .contaniner-text-experiencias {
        gap: 8px;
    }

    .container-experiencias .lg\:title_m {
        font-family: var(--font-family-1-smbold);
        font-size: var(--size-font-200);
        line-height: var(--size-font-line-height-2xl);
        font-style: var(--font-style-normal);
    }

    .img-1 {
        left: -64px;
        top: 22px;
    }

    .img-2 {
        width: 193px;
        height: 244px;
        left: 249px;
        top: -82px;
    }

    .img-3 {
        left: 400px;
        top: 364px;
    }

    .img-4 {
        left: 674px;
        top: 40px;
    }

    .img-5 {
        left: 896px;
        top: 145px;
    }

    .img-6 {
        left: 65px;
        top: 443px;
    }

    .img-7 {
        display: flex;
        position: absolute;
        border-radius: 8px;
        width: 192px;
        height: 105px;
        left: 770px;
        top: 443px;
    }

    .container-experiencias:hover .container-imgs .img-7 {
        transform: translate(30px, 70px);
    }
}

@media(min-width: 1200px) {

    .container-relativo{
        position: relative;
        margin-left: calc(50% - 1200px / 2);
    }
    
    .container-info-experiencias {
        width: 800px;
        left: calc(50% - 800px / 2);
        top: 229px;
        padding: var(--size-space-0) var(--size-space-0);
    }

    .container-experiencias .xl\:title_xl {
        font-family: var(--font-family-1-smbold);
        font-size: var(--size-font-250);
        line-height: var(--size-font-line-height-4xl);
        font-style: var(--font-style-normal);
    }

    .img-1 {
        left: -25px;
        top: 62px;
    }

    .img-2 {
        left: 249px;
        top: -60px;
    }

    .img-3 {
        left: 428px;
        top: 461px;
    }

    .img-4 {
        left: 749px;
        top: 80px;
    }

    .img-5 {
        left: 1017px;
        top: 168px;
    }

    .img-6 {
        left: 72px;
        top: 428px;
    }

    .img-7 {
        left: 964px;
        top: 444px;
    }
}

@media(min-width: 1920px) {

    .container-relativo{
        margin-left: 0;
    }
    .container-experiencias {
        max-width: 1920px;
    }
    .container-info-experiencias {
        width: 800px;
        left: 560px;
        top: 229.1px;
        padding: var(--size-space-0) var(--size-space-0);
    }
    
    .img-1 {
        left: 303px;
        top: 107.1px;
    }

    .img-2 {
        width: 150.61px;
        height: 190.4px;
        left: 733px;
        top: 21.1px;
    }

    .img-3 {
        left: 788px;
        top: 461px;
    }

    .img-4 {
        left: 1109px;
        top: 80px;
    }

    .img-5 {
        left: 1424px;
        top: 164.1px;
    }

    .img-6 {
        left: 432px;
        top: 428px;
    }

    .img-7 {
        left: 1324px;
        top: 444px;
    }
}