.images-container {
    background-image: url('https://www.shutterstock.com/image-illustration/dynamic-stadium-large-modern-filled-600nw-2472452971.jpg');
    background-size: cover;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    height: 100px;
    position: relative;
}


.color-side {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    flex: 1;
}

.color-left{
    background-color: rgba(22, 24, 52, 0.5);
}
.color-right {
    background-color: rgba(255,145,77, 0.4);
}

.image {
    width: 50%; /* Ajuste o tamanho da imagem */
    object-fit: contain;
}

.divider {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}

.triangle-up,
.triangle-down {
    background-image: url('https://st4.depositphotos.com/11634452/24646/i/450/depositphotos_246463674-stock-photo-green-grass-field-background-soccer.jpg');
    background-size: cover;
    background-position: center;
    width: 40px; /* Largura ajustável */
    height: 50px; /* Altura ajustável */
    position: relative;
}

.triangle-up {
    clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
}

.triangle-down {
    clip-path: polygon(50% 100%, 0% 0%, 100% 0%);
}

.middle-image {
    position: absolute;
    top: 50%; /* Centralizado em relação à altura */
    left: 50%; /* Centralizado em relação à largura */
    transform: translate(-50%, -50%);
    z-index: 2; /* Sobre os triângulos */
    width: 40px; /* Ajuste o tamanho da imagem do meio */
     height: auto; /* Mantém a proporção da imagem */
image-rendering: -webkit-optimize-contrast; /* Melhora a nitidez no Chrome/Safari */
image-rendering: crisp-edges; /* Otimiza a nitidez para imagens com bordas definidas */
image-rendering: pixelated; /* Deixa os pixels nítidos (opcional para imagens pixel art) */

object-fit: cover; /* Ajusta como a imagem se encaixa no espaço */

    object-fit: contain;
}

@media (max-width: 330px) {

    .images-container {height: 70px; }
    .middle-image {height: 30px;}
}