ul.logos {display: flex; flex-wrap: wrap;align-items: center;  width: calc(100% + 32px);
    position: relative; left: -16px; padding: 0;margin:24px 0 0; }

ul.logos li { width: 50%;   list-style: none; margin: 0; padding: 0 16px 16px; }
ul.logos li picture { display: block;  width: 100%; height: 0; padding-bottom: 100%;
    position: relative; }
ul.logos li picture img {
    position: absolute; left: 50%; top: 50%; transform:translate(-50%,-50%); display: block; width: 100%; height: 100%; object-fit: contain; }

@media (min-width: 768px) {

    ul.logos li { width: 33.33%; }
}

@media (min-width: 1024px) {

    ul.logos li { width: 25%; }
}