Niepoprawne pozycjonowanie ikon na stronie przy mniejszych rozdzielczościach

Dzień dobry.

Mam następujący problem. Tworzę stronę internetową, która musi działać dobrze na różnych rozdzielczościach. Problem jest taki, że nie mogę do tego użyć bootstrapa. Jedynie HTML, CSS, JS/jQuery. Chciałbym aby ikony marek wyglądały cały czas jak na zdjęciu numer 1, a nie przesuwały się i wjeżdżały na siebie jak na zdjęciu numer 2.

Zdjęcie 1: https://imgur.com/AMAPCEP
Zdjęcie 2: https://imgur.com/a/HUniKrK

Próbowałem już

html{
min-height:100%;
    min-width:100%;
}
@media only screen and (max-width: 1000px) {
 body .background .foodini-logo img{
        width:15%;
        height:15%;
        margin-top: 10%
        margin-left:12%;
   }
 }

jednak to nie jest żadne rozwiązanie, bo dla każdego logo, właściwie co 100px musiałbym to ustawiać poprawnie.

A tak wygląda kod obecnie:

html{
   height:100%;
    width:100%;
}
body {
    background: url("../img/bg.png") no-repeat center center fixed;
    background-size: cover;
    background-color:rgb(178,212,238);

}
.
.
.
body .background .foodini-logo{
        margin-top:15%;
        margin-left:17%;

}
body .background a {
        display: inline-block;
        position: absolute;
        
    }
body .background .haps-logo {
        margin-top: 35%;
        margin-left: 23%;
}

Po prostu chciałbym, aby wszystkie ikony wyglądały cały czas tak, jak na zdjęciu 1. To znaczy nie wjeżdżały na siebie, ani nie zmieniały pozycji względem mapy, bez względu na rozdzielczość monitora.

Bez bootstrapa możesz wykorzystać proste grid'y rwd, które można znaleźć w sieci (lub się na nich wzorować) mają kilka linii i proste @media ważą 2-3kb, więc tyle co nic.
https://github.com/zachacole/Simple-Grid/blob/master/simple-grid.css
https://github.com/ThisIsDallas/Simple-Grid/blob/master/simplegrid.css
zobacz jak to jest stworzone i na tej podstawie zbuduj szkielet strony.

Ew. grid layout:
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout
Flexbox:
https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Trochę mętnie to opisujesz, ale sugeruję pozycjonowanie absolutne względem kontenera:
https://www.w3schools.com/css/tryit.asp?filename=trycss_position_absolute
wyrażone w % i podobnie w % wyrażone rozmiary ikon.