* {
  color: white;
  font-family: Bree Serif, Helvetica, sans-serif;
}
body {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
  background-color: black;
  height: 98vh;
}
.image {
  /* border: solid 1px; */
  min-width: 250px;
  max-height: 700px;
  display: flex;
  justify-content: center;
  align-items: center;
}
img {
  max-height: 450px;
  max-width: 450px;
  min-height: 100px;
  min-width: 100px;
}
.details {
  /* border: solid 1px; */
  min-height: 30em;
  min-width: 15em;
  max-width: 700px;
  max-height: 700px;
  display: flex;
  justify-content: center;
  align-items: center;
}

span {
  --s: 0.1em; /* the thickness of the line */
  --c: aqua; /* the color */

  color: transparent;
  padding-bottom: var(--s);
  background: linear-gradient(90deg, var(--c) 50%, transparent 0)
      calc(100% - var(--_p, 0%)) / 200% 100%,
    linear-gradient(var(--c) 0 0) 0% 100% / var(--_p, 0%) var(--s) no-repeat;
  -webkit-background-clip: text, padding-box;
  background-clip: text, padding-box;
  transition: 0.5s;
}
.span {
  --_p: 100%;
}

H3,
H1,
H2 {
  margin: 1px;
}

button {
  background-color: aquamarine;
  border-radius: 5px;
  border: solid 1px;
  color: black;
  width: 120px;
  height: 35px;
  box-shadow: aquamarine 0px 5px 15px;
}
button:hover {
  box-shadow: antiquewhite 0px 5px 15px;
  box-shadow: none;
}
a {
  color: black;
  text-decoration: none;
}
