.flexs {
    position: relative;
    height: 275px;
}
#resimcontainer {
  height: 172px;
  width: auto;
  overflow: hidden;
  position: absolute;
  left: 100%;
  z-index: 1;
  animation: slideLeft 6.2s forwards; /* Sola kaydırma animasyonu */
}

@keyframes slideLeft {
  from {
    left:100%;
  }
  to {
    left: 0%;
  }
}

#resimcontainer img{
  width: auto;
  height: 172px;
}

.red{
 position: absolute;
 right:0;
 width: calc(100% - 172px);
 height: 270px;
 z-index: 0;
 opacity: 0;
 animation: gladyus 6.2s forwards; 
 animation-delay:5s;
}
@keyframes gladyus {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}