@font-face {
  font-family: "InterTight Bold";
  src: url(../../assets/font/Inter_Tight/static/InterTight-Bold.ttf) format("woff2");
}
@font-face {
  font-family: "InterTight Medium";
  src: url(../../assets/font/Inter_Tight/static/InterTight-Medium.ttf) format("woff2");
}
@font-face {
  font-family: "InterTight Thin";
  src: url(../../assets/font/Inter_Tight/static/InterTight-Thin.ttf) format("woff2");
}
.content_wrapper main #searched_city_container {
  margin: 50px auto;
  width: 90%;
  max-width: 1920px;
}

.content_wrapper main #searched_city_container {
  background-color: rgba(255, 255, 255, 0.1058823529);
  border-radius: 20px;
  padding: 1px;
  box-shadow: 0px 20px 50px 5px rgba(0, 0, 0, 0.358);
}
.content_wrapper main #searched_city_container .city_container {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  margin: 20px auto;
  width: 100%;
}
.content_wrapper main #searched_city_container .city_container .searched_city {
  display: flex;
  justify-content: center;
  align-items: center;
}
.content_wrapper main #searched_city_container .city_container .searched_city #city {
  width: 100%;
  text-align: center;
  font-size: clamp(50px, 8vw, 70px);
  margin-bottom: 20px;
}
.content_wrapper main #searched_city_container .city_container .searched_city #country_code {
  width: 100%;
  text-align: center;
  font-size: clamp(50px, 8vw, 70px);
  margin-bottom: 20px;
}
.content_wrapper main #searched_city_container .city_container .city_temperature {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5px;
  font-size: clamp(40px, 6.6vw, 60px);
}
.content_wrapper main #searched_city_container .city_container .city_temperature .city_weather {
  width: 70px;
  height: 70px;
}
.content_wrapper main #searched_city_container .city_container .city_temperature .city_weather img {
  width: 100%;
  height: 100%;
}
.content_wrapper main #searched_city_container .city_container .city_temperature .temperature {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-direction: column;
}
.content_wrapper main #searched_city_container .city_container .city_temperature .temperature .degrees {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 5px;
}
.content_wrapper main #searched_city_container .city_container .city_temperature .temperature .degrees #temperature_degrees {
  color: #ffffff;
}
.content_wrapper main #searched_city_container .city_container .city_temperature .temperature #temperature_info {
  font-family: "InterTight Thin";
  font-size: clamp(16px, 2.5vw, 20px);
}
.content_wrapper main #searched_city_container .whether_info {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  justify-items: center;
  width: 100%;
  margin: 20px auto 40px auto;
}
.content_wrapper main #searched_city_container .whether_info .index_cont {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  font-size: clamp(16px, 2vw, 20px);
  background-color: rgba(255, 255, 255, 0.1058823529);
  width: clamp(120px, 17vw, 150px);
  height: clamp(120px, 17vw, 150px);
  padding: 5px;
  border-radius: 15px;
  cursor: pointer;
  transition: background 0.3s ease-in-out, transform 0.3s ease-in-out;
}
.content_wrapper main #searched_city_container .whether_info .index_cont img {
  width: clamp(70px, 10vw, 90px);
  height: clamp(70px, 10vw, 90px);
}
.content_wrapper main #searched_city_container .whether_info .index_cont #humidity_index,
.content_wrapper main #searched_city_container .whether_info .index_cont #wind_speed_index,
.content_wrapper main #searched_city_container .whether_info .index_cont #pressure_index {
  font-size: clamp(16px, 2vw, 18px);
}
.content_wrapper main #searched_city_container .whether_info .index_cont:hover {
  background-color: rgba(255, 255, 255, 0.4352941176);
  transform: scale(1.05);
}
.content_wrapper main #searched_city_container .sunrise_sunset_container {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  margin: 20px auto 40px auto;
  gap: 50px;
}
.content_wrapper main #searched_city_container .sunrise_sunset_container .sunrise_container,
.content_wrapper main #searched_city_container .sunrise_sunset_container .sunset_container {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 5px;
  background-color: rgba(255, 255, 255, 0.1058823529);
  width: clamp(120px, 35vw, 200px);
  height: clamp(120px, 17vw, 150px);
  padding: 5px;
  border-radius: 15px;
  cursor: pointer;
  transition: background 0.3s ease-in-out, transform 0.3s ease-in-out;
}
.content_wrapper main #searched_city_container .sunrise_sunset_container .sunrise_container img,
.content_wrapper main #searched_city_container .sunrise_sunset_container .sunset_container img {
  width: clamp(70px, 10vw, 90px);
  height: clamp(70px, 10vw, 90px);
}
.content_wrapper main #searched_city_container .sunrise_sunset_container .sunrise_container #sunrise,
.content_wrapper main #searched_city_container .sunrise_sunset_container .sunrise_container #sunset,
.content_wrapper main #searched_city_container .sunrise_sunset_container .sunset_container #sunrise,
.content_wrapper main #searched_city_container .sunrise_sunset_container .sunset_container #sunset {
  font-size: clamp(16px, 2vw, 18px);
}
.content_wrapper main #searched_city_container .sunrise_sunset_container .sunrise_container:hover,
.content_wrapper main #searched_city_container .sunrise_sunset_container .sunset_container:hover {
  background-color: rgba(255, 255, 255, 0.4352941176);
  transform: scale(1.05);
}

@media screen and (max-width: 900px) {
  .content_wrapper main #searched_city_container .whether_info {
    grid-template-columns: repeat(3, 1fr);
    row-gap: 20px;
  }
}
@media screen and (max-width: 450px) {
  .content_wrapper main #searched_city_container .whether_info {
    grid-template-columns: repeat(2, 1fr);
  }
}/*# sourceMappingURL=searchedCity.css.map */