/* set some global styles */

* {

  margin: 0;

  padding: 0;

  box-sizing: border-box;

  font-family: 'Helvetica Neue', sans-serif;

  font-size: 16px;

}

/* style the header and navigation */

header {

  background-color: #333;

  color: #fff;

  padding: 20px;

}

nav ul {

  list-style: none;

  display: flex;

}

nav li {

  margin: 0 10px;

}

nav a {

  color: #fff;

  text-decoration: none;

  font-weight: bold;

  transition: color 0.2s ease-in-out;

}

nav a:hover {

  color: #f1c40f;

}

/* style the hero section */

#hero {

  height: 500px;

  background-image: url('hero-bg.jpg');

  background-position: center;

  background-size: cover;

  display: flex;

  justify-content: center;

  align-items: center;

}

.hero-text {

  text-align: center;

  color: #fff;

}

.hero-text h1 {

  font-size: 72px;

  margin-bottom: 20px;

}

.hero-text h2 {

  font-size: 36px;

  font-weight: normal;

}

/* style the main content sections */

section {

  padding: 50px 0;

}

section h2 {

  font-size: 36px;

  margin-bottom: 20px;

}

section p {

  font-size: 18px;

  line-height: 1.5;

  margin-bottom: 20px;

}

.album {

  margin