/* CSS is used to define stylistic presets for the HTML files to access. */

body {
  background-color: black;
  color: black;
  font-family: Verdana;
}

.MasterDiv {
  margin: 2.5% 5%;
  padding: 1%;
  height: auto;
  background-color: black;
  outline-color: white;
  outline-style: solid;
}

.MainPageButtonsLink {
  text-decoration: none;
  width: 7.5vw;
  height: 7.5vw;
}

.MainPageButtons {
  width: 7.5vw;
  height: 7.5vw;
  background-color: black;
  outline-color: white;
  outline-style: solid;
  display: block;
  text-decoration: none;
  font-size: 16px;
  overflow: hidden;
  color: white;
  text-align: center;
  position: relative;
  cursor:pointer;
}

.MainPageGrid {
 display: grid;
 grid-template-columns: repeat(auto-fill, minmax(7.5vw, 1fr));
 gap: 2vw;
 justify-content: center;     /* Center the grid itself */
 max-width: 50vw;         /* or any value that fits your layout */
 margin: 0 auto;
}

p {
 color: white; 
}

h2 {
 color: white; 
}

/* h1 = page main title */

h1 {
 color: white; 
 text-align: center;
 font-family: "Times New Roman", Times, serif;
}