body {
  margin: 0;
  padding:25px;
  overflow: hidden;
  background: #000;
  color:#00FF41;
  font-family: "Share Tech Mono", monospace;
}

canvas {
  display: block;
}

#head{
  text-align: center;
}

#scene-container {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
}

#three-canvas {
  width: 300px;
  height: 300px;
  display: block;
  background: transparent;
}

#greeter {
  margin-top: 20px;
  font-size: 14px;
  white-space: pre-wrap;
  text-align: center;
  line-height:30px;
}

#wrapper {
  display: flex;
  justify-content: center;
  margin-top: 40px;
}

#text-content {
  transition: opacity 0.6s ease;
  opacity: 1;
}

#text-content h3 {
  margin: 0;
  padding: 0;
  line-height: 30px;
  font-weight: normal;
  font-size: 16px;
}

#text-content p {
  margin: 0;
  padding: 0;
  line-height: 30px;
  font-size: 14px;
  transition: opacity 0.6s ease;
}

.fade-out {
  opacity: 0;
}

.fade-in {
  opacity: 1;
}

h1{
	text-transform: uppercase;
	font-size: 14px;
	letter-spacing: 3px;
}

h3{
  padding:0;
  margin:0;
  letter-spacing: 3px;
}

button{
	background: none;
	border:1px solid #00FF41;
	color:#00FF41;
	font-family: "Share Tech Mono", monospace;
	font-size:14px;
}

button:hover{
	color:#000000;
  background-color:#00FF41;
}