/* this file is loaded by index.html and styles the page */
@import url("https://fonts.googleapis.com/css2?family=Share+Tech+Mono&display=swap");
* {
  box-sizing: border-box;
}
/* Create two unequal columns that floats next to each other */
.column {
  float: left;
}

.left {
  width: 30%;
}

.right {
  width: 70%;
}

img {
  max-width: 75%;
  max-height: 75%;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

.vertical-center {
  margin: auto;
  width: 80%;
  height: 80vh; /* or another fixed height */
  border: 3px solid #585123;
  background-color: #b1d19e;
  box-shadow: -10px 10px 5px #585123;

  display: flex;
  justify-content: center; /* horizontal center */
  align-items: center;     /* vertical center */
  text-align: center;      /* optional, center text inside */
}

body {
  font-family: "Share Tech Mono", monospace;
  margin: 2em 1em;
  line-height: 1.5em;
  background-color: #718355;
  color: #685044;
}

.center {
  margin: auto;
  width: 80%;
  border: 3px solid;
  border-color: #585123;
  background-color: #b1d19e;
  box-shadow: -10px 10px 5px #585123;
}
.container {
  display: flex;
  flex-direction: row;
  justify-content: center;
  flex-wrap: wrap;
}

.indent {
  padding-left: 5%;
  padding-bottom: 5%;
  padding-right: 5%;
}

a.header:link {
  color: #685044;
  text-decoration: none;
  font-size: 50%;
}
a.header:visited {
  color: #685044;
  text-decoration: none;
  font-size: 50%;
}
a.header:hover {
  color: #8b85c1;
  text-decoration: none;
  font-size: 50%;
}

a.text:link {
  color: #e56b6f;
  text-decoration: none;
}

a.text:visited {
  color: #e56b6f;
  text-decoration: none;
}

a.text:hover {
  color: #8b85c1;
  text-decoration: none;
}

a.animal:link {
  text-decoration: none;
}
a.animal:visited {
  text-decoration: none;
}
a.animal:hover {
  text-decoration: none;
}

a.forest-link:link {
  text-decoration: none;
  font-size: 70%;

}
a.forest-link:visited {
  text-decoration: none;
  font-size: 70%;

}
a.forest-link:hover {
  text-decoration: none;
  font-size: 150%;

}
h1 {
  font-family: "Share Tech Mono", monospace;
  font-size: 50px;
  color: #685044;
}

project-header {
  font-family: "Share Tech Mono", monospace;
  font-size: 80px;
  font-weight: bold;
  color: #685044;
  padding-bottom: 5px;
}

list-header {
  font-family: "Share Tech Mono", monospace;
  font-size: 24px;
  font-weight: bold;
  color: #685044;
  padding-bottom: 5px;
}

.trees {
  width: 45px;
  height: 45px;
  border: 0px;
  padding: 0px 0px 0px 10px;
}

.foot {
  padding: 20%;
}