@font-face {
  font-family: 'Minecraftia';
  src: url('MC_font/Minecraftia-Regular.ttf') format('truetype');
}

/* Reset */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: 'Minecraftia', sans-serif;
}

/* Body */
body {
  background-image: url('images/mc_bg.jpg');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  color: #fff;
  line-height: 1.6;
}

/* Header */
header {
  text-align: center;
  padding: 30px 20px;
  background-image: url('images/oak_planks.jpg');
  border-bottom: 4px solid #6b4c2a;
}

header h1 {
  font-size: 3rem;
  color: #fffb00;
  text-transform: uppercase;
  letter-spacing: 2px;
  position: relative;
  text-shadow: 
    2px 2px 0 #000,
    4px 4px 0 #555,
    6px 6px 0 #2c2f33;
}

header h2 {
  font-size: 1.2rem;
  color: #ccc;
}

/* Navigation */
nav {
  background-color: transparent;
  padding: 15px;
}

nav ul {
  list-style: none;
  display: flex;
  justify-content: center;
  gap: 40px;
}

nav ul li a {
  color: #000000;
  text-decoration: none;
  font-size: 1rem;
  padding: 10px 20px;
  border: 3px solid #000; 
  border-radius: 6px;
  background-color: #f1f6fa;
  box-shadow: 
    3px 3px 0 #555, 
    6px 6px 0 #2c2f33;
  transition: all 0.3s ease;
}

/* Hover effect */
nav ul li a:hover {
  color: #ffcc00;
  background-color: #444; 
  transform: translateY(-2px);
  box-shadow: 
    3px 3px 0 #000,
    6px 6px 0 #555;
}

strong {
  color: #1eff00;
}

/* Sections */
section {
  padding: 50px 20px;
  background-color: rgba(0, 0, 0, 0.6);
  margin: 30px auto;
  max-width: 1100px;
  border-radius: 12px;
}

section h2 {
  text-align: center;
  color: #ffcc00;
  margin-bottom: 20px;
}

section p {
  font-size: 18px;
  text-align: center;
}

/* Tagline */
.tagline {
  margin-top: 20px;
  font-size: 16px;
  color: #00ffcc;
  text-align: center;
  font-style: italic;
}

/* Who are we Section */
.member-grid {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 25px;
}

/* Member Rows */
.member-row {
  display: flex;
  gap: 20px;
  margin-bottom: 25px;
}

.top-row {
  justify-content: center;
  flex-wrap: nowrap;
}

.row-center {
  justify-content: center;
}

.member-card {
  flex: 0 0 auto; 
  width: 220px;
  height: auto;
  background: #000000;
  border: 4px solid #6b4c2a;
  border-radius: 12px;
  box-shadow: 4px 4px 0 #000;
  display: flex;
  flex-direction: column;
  align-items: center;
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.member-card a {
  text-decoration: none; 
  color: inherit; 
}

.member-card img {
  width: 100%;
  height: 300px;
  object-fit: cover;
  border-radius: 8px;
}

/* Name styling */
.member-name {
  margin-top: 8px;
  font-size: 1rem;
  color: #1eff00; 
  text-align: center;
}

/* Hover effect */
.member-card:hover {
  transform: scale(1.05);
  box-shadow: 0 0 15px rgba(255, 204, 0, 0.7);
  cursor: pointer;
}

.description {
  color: #00ffcc;
}