@font-face {
  font-family: 'Terbaang';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(font/terbaang.woff2) format('woff2');
}

body {
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: center;
  background-size: cover;
  background-image: url(index.jpg);
}

.header-container header {
  margin-top: 10px;
  border-radius: 20px;
  background: rgba(0, 0, 0, 0.7);
}

@media (min-width: 768px) {
  .header-container header {
    padding: 0 20px;
  }
}

.logo {
  font-family: 'Terbaang', sans-serif;
  font-style: italic;
  font-size: 2rem;
  color: white;
}

.logo .color-red {
  color: red;
}

.nav-link {
  color: white;
}

.nav-link:focus, .nav-link:hover {
  color: red;
}

.bg-body-tertiary {
  background: rgba(0, 0, 0, 0.7) !important;
  color: white;
}

/* Galeria */
.grid-row {
  margin-left: -5px;
  margin-right: -5px;
}
.grid-row > * {
  padding-right: 0;
  padding-left: 0;
}
.grid-item {
  overflow: hidden;
  float: left;
  padding: 5px 5px;
}
.grid-item img {
  display: block;
  max-width: 100%;
  height: auto;
}