body {
  font-family:'Helvetica Neue',Arial,sans-serif;
  margin:0;
  padding:0;
  background-color:#f4f4f9;
  

  background-image:linear-gradient
  (rgba(255,255,255,0.8)
  rgba(255,255,255,0.8))
  url('images/background.jpg');

  background-size: cover;
  background-attachment:fixed;
  color:#333;
}

main {
  max-width:1200px;
  margin:0 auto;
  padding:20px;
}

.main-nav {
  background-color:#2c3e50;
  padding:1rem;
}

.main-nav ul {
  list-style-type:none;
  margin:0;
  padding:0;
  display:flex;
  justify-content:center;
  gap:20px;
}

.main-nav a {
  color:white;
  text-decoration:none;
  font-weight:bold;
  font-size:1.1rem;
}

.main-nav a :hover {
  color:#3498db;

}

.item-list {
  display:flex;
  flex-direction:column;
  gap:20px;
  align-items:center
}

.item-card {
  background:white;
  border-radius:8px;
  padding:20px;
  box-shadow:0 4px 6px rgba(0,0,0,0.1);
  text-align:center;
  width:90%;
  max-width:350px;

}


.item-card img {
  border-radius :4px;
  max-width:100%;
  height:auto;

}


@media (min-width:768px) {
  .item-list{
    flex-direction:row;
    flex-wrap:wrap;
    justify-content:space-around;
  }
}


.btn, .btn-back {
  display:inline-block;
  background-color:#3498db;
  color:white;
  padding:10px 20px;
  text-decoration:none;
  border-radius:5px;
  margin-top:15px;

}

.btn:hover,.btn-back:hover {
  background-color:#2980b9;
}