body {
  background: url("images/background-gif-2.gif");
  cursor: url("cursor/Aero%20Arrow.cur"), auto;
  font-family: "lato", verdana, arial;
  font-size: 10px;
  color: #727070;
  display: flex;
  align-items: center;
  flex-direction: column;
  letter-spacing: 1px;
  line-height: 10px;
  gap: 5px;
}

.buttons-n-blinkers-border {
  display: flex;
  transform: translateX(1px);
  align-items: center;
  justify-content: center;
  background-size: 100% 100%;
}

.buttons-n-blinkers {
  /*(c) solielios*/
  width: 195px;
  transform: translateX(-1px);

  position: relative;
  overflow: hidden;
  background-clip: padding-box;
  display: flex;
  white-space: nowrap;
  flex-direction: column;
}

@keyframes bnb-marquee {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-85%);
  }
}

.track {
  animation-play-state: running; /* always playing by default */
  display: inline-flex;
  white-space: nowrap;
  animation: bnb-marquee 15s linear -6s infinite;
  width: max-content;
}

.phone-frame {
  width: 275px;
  height: 250px;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: absolute;
  overflow: hidden;
  background-size: 100% 100%;
}
.homietitle {
  font-size: 15px;
  font-family: "nokia", Verdana, Geneva, Tahoma, sans-serif;
  margin-top: 30px;
  color: white;
  position: absolute;
}
.homie {
  width: 64px;
}
.homies-container {
  margin-right: 5px;
  display: grid;
  position: absolute;
  grid-template-columns: repeat(2, 1fr);
  margin-top: 45px;
}

.tv-frame {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 150px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2; /* Front layer */
  pointer-events: none;
  overflow: hidden;
}
.tv-vid {
  position: absolute;
  top: 45%;
  left: 58%;

  transform: skew(3deg, -4deg) translate(-50%, -50%);

  /* These ensure the image covers the "hole" behind the frame */
  width: 97px;
  height: 112px;
  object-fit: cover;

  z-index: 1; /* Back layer */
}
.weatherforecast {
  position: relative;
  width: 318px;
  transform: translateY(56px) scale(1);
  z-index: 10;
  transition: transform 0.15s ease;
}
.weatherforecast:hover{
cursor: url("cursor/Aero%20Link.cur"), pointer;
}