body {
  .oswald-<uniquifier > {
    font-family: "Oswald", sans-serif;
    font-optical-sizing: auto;
    font-weight: <weight>;
    font-style: normal;
  }
  background-image: url("https://static.vecteezy.com/system/resources/thumbnails/042/193/640/small/ai-generated-overcast-sky-background-free-photo.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  margin: 0 auto;
  font-size: 20px;
}
header {
  text-align: center;
  font-weight: 700px;
  font-size: 50px;
  margin-top: 40px;
}
form {
  display: flex;
  justify-content: center;
  margin-top: 20px;
  padding: 15px 20px;
}
.form-input {
  width: 50%;
  font-size: 20px;
  background: #f8f8faf5;
  border: none;
  padding: 5px 10px;
}

.form-button {
  font-size: 20px;
  background: rgb(119, 119, 185);
  border-radius: 4px;
  border: none;
  color: white;
}

.box {
  background: rgb(141, 182, 196);
  max-width: 600px;
  margin: 20px auto;
  padding: 30px;
  border-radius: 15px;
  box-shadow: 0 30px 50px rgba(65, 50, 100, 0.08);
}
footer {
  text-align: center;
  
}
strong {
  color: rgb(184, 4, 34);
}

.temperature-container {
  display: flex;
  justify-content: flex-end;
  margin-top: -80px;
}
.temp-emoji {
  margin-top: -20px;
}
.temp-value {
  font-weight: 900;
  font-size: 60px;
  margin-bottom: -10px;
}
.temp-unit {
  font-weight: 500;
  font-size: 25px;
}
ul {
  display: flex;
  list-style: none;
  gap: 55px;
  padding: 0;
  margin-top: 35px;
  
}
.temps {
  color: rgb(184, 4, 34);
}
.icon {
  width:50px;

margin-left:-10px;
}