/* Font Family */
@font-face {
  font-family: Verdana;
  /* src: url("placeholder.ttf") format("truetype"); /* Path to your .ttf file */
  font-weight: normal;
  font-style: normal;
}

/* Colors */
:root {
  --primary-color: #000000;
  --secondary-color: #000000;
  --tridary-color: #000000;
  --background-color: #000000;
}

html {
  font-family: Verdana;

  margin: 0;
  padding: 0;
}

body {
  background-color: var(--background-color);
  /* background-image: url('placeholder');
  background-attachment: fixed;
  background-repeat: repeat;
  background-position: center;
  background-size: auto; */

  margin: 0;
  padding: 0;
}

#container {
  color: black;
  text-align: center;
  
  min-height: 100vh !important;

  /* width: 980px;
  max-width: 980px; */

  margin-left: auto;
  margin-right: auto;
}

/* ________________________________ Nav Bar ________________________________ */
#nav-grid {
  display: grid;

  grid-template-columns: auto max-content;

  /* background-color: rgb(20,20,20); */

  height: 50px;
}

.nav-link {
  margin: 5px;

  padding-top: 6px;

  font-size: 29px;

  background-color: var(--primary-color);
}

#nav-grid ul {
  cursor: default;

  padding: 0px;

  margin: 0px;

  width: fit-content;
  width: -moz-fit-content;

  margin-left: auto;

  margin-right: auto;
}

#nav-grid li {
  text-decoration: none;
  display: inline-block;
  margin-left: 35px;
}

#nav-grid a {
  cursor: pointer;

  color: rgb(30,30,30) !important;
  text-decoration: none;
}

#nav-grid a:hover {
  text-decoration: underline;
}

#nav-grid li:first-of-type {
  margin-left: 0px;
}

/* ________________________________ Main Content ________________________________ */
#main-grid {
  display: grid;

  grid-template-columns: auto;

  min-height: 500px;

  /* background-color: rgb(35,35,35); */

  font-size: 29px;
}

.main-content {
  position: relative;
  
  min-height: 500px;

  padding-bottom: 100px;

  margin: 5px;

  /* border-radius: 10px; */

  margin-bottom: 100px;

  background-color: var(--primary-color);
  background-attachment: local;
  background-repeat: repeat;
  background-position: center;
  background-size: auto;
}

.text {
	color: white;
	font-size: 50px;
	text-align: center;
}

.logo {
	width: auto;
	
	margin-left: auto;
	margin-right: auto;
}