@import url("https://fonts.googleapis.com/css2?family=Space+Grotesk&family=Sofia+Sans&family=Exo:wght@500&display=swap");

body {
  position: relative;
  background-color: #1b1b29;
  color: #cba6f7;
  margin: 0;
  padding: 0;
  font-family: "Exo", sans-serif;
  text-align: center;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
}

code {
  background-color: #11111b;
  color: #a6e3a1;
  padding: 0.2%;
}

.header {
  position: relative;
  margin: 0;
  width: 100%;
  text-align: center;
  color: #cba6f7;
  background-color: #1e1e2e;
}

.header h1 {
  font-size: 10vw;
  padding-top: 3%;
  margin: 0;
  font-family: "Sofia Sans", sans-serif;
}

.header p{
  padding-bottom: 3%;
}

h3 {
  font-family: "Space Grotesk", monospace;
  font-size: 50px;
}

.main {
  background-color: #1b1b29;
  height: 100vh;
  margin-left: 3%;
  margin-right: 3%;
  margin-bottom: 3%;
}

#particles-js {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%; /* Match width of .header */
  height: 100%; /* Match height of .header */
  padding: 0;
  z-index: -1;
  background-color: transparent;
}