Jak zrobić na stronie responsywny obraz loga?

Czesc, witam. Jestem poczatkujacy w dziedzinie tworzenia stronek, dlatego mam pytanie do osob ktore sie na tym co nieco znaja. Chce stworzyc na stronce swoje logo, wlasciwie bedzie to zwykly obraz stworzony w photoshopie ( wlasna praca ) i chodzi o ofekt pokazany taki jak na zdjeciu:

Z jednej strony stronka jest na 100% widocznosci przy moim monitorze a druga na 25%, zdjecie wyglada tak samo. Kto wie jak zrobic takowy efekt?

background-size (ale na moje oko to na obu widokach akurat kontener na ten obrazek jest taki sam, więc w sumie nic nie trzeba robić)

Ok, dzieki za odp. Mam tez takie pytanie. Jak zrobic efekt zeby podczas zmniejszania i zwiekszania wielkosci ( rolka myszki ) strony, cala strona zostawala wysrodkowana na srodku? Aby menu u gory nie uciekalo w prawo, a zdjecie ktore wstawiam, np. w prawo, tylko zostawalo caly czas na srodku. Dzieki za dop.

Bez uzywania technologii Bootstrap. Interesuje mnie w czystym html.

margin: auto;