body {
  margin: 0;
  padding: 0;
  font-family: Arial, sans-serif;
/*  background: url('images/background.jpg') repeat-x; */
  background-size: auto 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  height: 100vh;
  overflow: hidden;
	margin-top: 30px;
	margin-bottom: 20px;	
}

.container {
	position: relative;
  width: 1366px;
  height: 768px;
  background-image: url('images/index.jpg');
  background-size: cover;    /* Dopasowuje obrazek do kontenera */
  background-position: center;
  background-repeat: no-repeat;
  box-shadow: 0 0px 20px rgba(0,0,0,0.2), 0 0px 60px rgba(0,0,0,0.1);
}

.click-area {
  position: absolute;
  width: 35px;
  height: 35px;
  background-size: cover;
  background-repeat: no-repeat;
  cursor: pointer;
  transition: background-image 0.3s ease;
}

/* Ikony w wersji czarnej (domyślne) */
.facebook {
  background-image: url('images/fb_bw.png');
}
.instagram {
  background-image: url('images/insta_bw.png');
}
.etsy {
  background-image: url('images/etsy_bw.png');
}
.allegro {
  background-image: url('images/allegro_bw.png');
}

/* Po najechaniu myszą zmiana na wersje kolorowe */
.facebook:hover {
  background-image: url('images/fb_color.png');
}
.instagram:hover {
  background-image: url('images/insta_color.png');
}
.etsy:hover {
  background-image: url('images/etsy_color.png');
}
.allegro:hover {
  background-image: url('images/allegro_color.png');
}