* {
  margin: 0;
}

@font-face {
  font-family: "winkle";
  src: url("../font/Winkle-Regular.otf");
}

@font-face {
  font-family: "blackletter";
  src: url("../font/BLACH___.TTF");
}

@font-face {
  font-family: "garden";
  src: url("../font/garden.ttf");
}

body {
  background-image: url(../media/garden/garden.gif);
  background-repeat: repeat;
}

header {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgba(27, 46, 58, 0.8);
  box-shadow: 1px 5px 40px 20px #1b2e3a;
}

h1 {
  font-family: "garden";
  font-size: 100px;
  color: white;
  padding-top: 50px;
}

h2 {
  font-family: "winkle";
  position: relative;
  top: 200px;
  left: 110px;
}

a {
  font-family: "blackletter";
  color: white;
  text-decoration: none;
  font-size: 30px;
  margin-left: 100px;
}

a:hover {
  color: black;
  background-color: white;
  padding: 5px;
}

.gifs {
  padding: 30px 80px;
}

#middle-part {
  margin: auto;
  width: 1000px;
  background-image: url(../media/garden/cork.jpg);
  background-size: contain;
  border: 10px inset #48352f;
  display: flex;
}

.banner {
  width: 170px;
  height: 20px;
  padding-right: 10px;
}

.slider {
  overflow: hidden;
  width: 100%;
  margin-bottom: 20px;
}

.slide-track {
  display: flex;
  width: max-content;
  animation: scroll 20s linear infinite;
}

@keyframes scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

.vegetable-log:hover,
.room-plants:hover {
  transition: 0.2s;
  transform: scale(1.06);
  color: white;
}

#container-veg {
  margin-top: 50px;
}

#aubergine,
#broccoli {
  display: flex;
  align-items: center;
}

.img-veg {
  width: 100px;
  margin-right: 20px;
}

.calendar {
  display: flex;
}

.jan,
.feb,
.mar,
.apr,
.may,
.jun,
.jul,
.aug,
.sep,
.oct,
.nov,
.dec {
  width: 30px;
  height: 30px;
  margin-right: 2px;
  background-color: #d0d1c4;
  font-size: 12px;
}

.description {
  margin-top: 10px;
  margin-bottom: 30px;
}