.img-comp-container {
    position: relative;
    height: 400px; /* Ajusta según tus imágenes */
    width: 900px;  /* Fija el ancho para que sea consistente */
    margin: 0 auto; 
    box-sizing: border-box;
}

.img-comp-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%; 
    height: 100%; 
    overflow: hidden;
    margin: 0; 
    padding: 0;
}

.img-comp-slider::before {
    content: "\f07e";
    font-family: "Font Awesome 6 Free"; 
    font-weight: 900; 
    font-size: 20px; 
    pointer-events: none; 
}
  .img-comp-img img {
    width: 900px; /* Ancho deseado */
    height: 400px; /* Alto deseado */
    object-fit: cover; /* Asegura que la imagen se ajuste bien */
    display: block;
}
  
.img-comp-slider {
    position: absolute;
    z-index: 10;
    cursor: ew-resize;
    width: 40px;
    height: 40px;
    background-color: rgba(170, 175, 96, 0.512);
    opacity: 0.9;
    border-radius: 50%;
    display: flex; 
    justify-content: center; 
    align-items: center; 
    color: rgb(255, 251, 251); 
    font-size: 20px; 
}
  .parent-container {
    display: flex;
    justify-content: center; 
    align-items: center;    
    width: 100%;          
    height: auto;          
    margin: 0 auto;         
    box-sizing: border-box; 
}
@media (max-width: 768px) {
    .img-comp-container {
        position: relative;
        height: 250px; /* Ajusta según tus imágenes */
        width: 300px;  /* Fija el ancho para que sea consistente */
        margin: 0 auto; 
        box-sizing: border-box;
    }
    .img-comp-img img {
        width: 300px; /* Ancho deseado */
        height: 300px; /* Alto deseado */
        object-fit: cover; /* Asegura que la imagen se ajuste bien */
        display: block;
    }
    
}