body {
  background: url('https://www.transparenttextures.com/patterns/black-linen.png');
  background-size: cover;
  position: relative;
  overflow-x: hidden;
}

header {
  padding: 60px 0;
}

.bubble {
  position: absolute;
  border-radius: 50%;
  opacity: 0.4;
  background: #fff;
  animation: float 10s infinite;
}

.bubble:nth-child(1) { width: 40px; height: 40px; left: 20%; animation-delay: 0s; }
.bubble:nth-child(2) { width: 60px; height: 60px; left: 50%; animation-delay: 2s; }
.bubble:nth-child(3) { width: 30px; height: 30px; left: 80%; animation-delay: 4s; }
.bubble:nth-child(4) { width: 50px; height: 50px; left: 10%; animation-delay: 6s; }
.bubble:nth-child(5) { width: 20px; height: 20px; left: 70%; animation-delay: 8s; }

@keyframes float {
  0% { bottom: -100px; }
  100% { bottom: 100vh; }
}

footer {
  background-color: #333;
  color: white;
  padding: 20px;
  text-align: center;
  margin-top: 40px;
}