/*
Theme Name: Rook Family Farm Theme
Version: 0.1
*/

:root {
  --primary-color: #333;
  --primary-color-rgb: 51, 51, 51;
  --primary-accent: #575757;
  --primary-accent-rgb: 87, 87, 87;
  --secondary-color: red;
  --secondary-color-rgb: 255, 0, 0;
  --secondary-accent: blue;
  --secondary-accent-rgb: 0, 0, 255;

  --main-color: white;
  --max-viewport-width: 1600px;
}

body {
  font-family: Arial, sans-serif;
  margin: 0;
  background-color: var(--primary-accent);
  margin: auto;
}

main {
  margin: 0 auto;
  background-color: var(--main-color);
  min-height: 100vh;
}

h1 {
  margin-top: 0;
}

.container {
  /* max-width: var(--max-viewport-width); */
  margin: 0 auto;
}
.project-container {
  /* max-width: var(--max-viewport-width); */
  position: relative;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.project-container::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.3);
  z-index: 0;
}

.project-overlay {
  position: absolute;
  inset: 0;
  cursor: pointer;
  z-index: 1;
}

/* make content readable above background */
.project-content,
h1 {
  position: relative;
  z-index: 2;
  color: white; /* optional depending on image */
}

.project-content {
  /* width: 80vw;
  height: 80vh; */
  margin: auto;
  pointer-events: none;
}