/* FONTS */

/* Galix Mono Regular
font-family: "galix-mono", sans-serif;
font-weight: 400;
font-style: normal;

Galix Mono Bold
font-family: "galix-mono", sans-serif;
font-weight: 700;
font-style: normal;

Galix Mono Ultra Light
font-family: "galix-mono-thin", sans-serif;
font-weight: 200;
font-style: normal;

Galix Mono Ultra Light Italic
font-family: "galix-mono-thin", sans-serif;
font-weight: 200;
font-style: italic; */


html {
    background-color:  rgb(222, 240, 206);

}
body {
    font-family: "galix-mono-thin", sans-serif;
    font-weight: 200;
    font-style: normal;
    text-align: center;
}

h1 {
    color: rgb(54, 48, 39);
}

h3 {
    color: rgb(54, 48, 39);
}

h4 {
    color: rgb(54, 48, 39);
    font-family: "galix-mono-thin",sans-serif;
    font-weight: 200;
    font-style: italic;
}

h5 {
    font-family: "galix-mono", sans-serif;
    font-weight: 700;
    font-style: normal;
    background-color: rgb(255, 250, 244);
    font-size: 10px;
    padding: 5px;
    margin-left: 40%;
    margin-right: 40%;
    border-radius: 10px;


}


.collection {
    display: flex;
    justify-content: center;
    gap: 20px;
    padding: 10px;
}

.plant {
    padding: 15px;
    width: 200px;
}

img {
    width: 100%;
}

img:hover {
    z-index: -1;
}

/* .hover {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
  background-color: rgb(54, 48, 39);
}
.container:hover .hover {
  opacity: 1;
} */

.plant:hover {
        background-color: rgba(143, 151, 132, 0.611);
}