*{
    padding: 0px;
    margin: 0px;
    box-sizing: border-box;

}

body{
    background: #222;
}

.wether{
    background: linear-gradient(35deg, #00feba,#8675f7);
    width: 20rem;
    padding:1rem ;
    /* margin:100px; */
   margin: 1rem;
    border-radius: 50px;
}

.search_area{
    display: flex;
    justify-content: space-evenly;
    background-color: red;
    background-color:hsl(0, 42%, 95%);
    border-radius: 15px;
}

.search_area input{
height:2rem;
width: 180px;
border: none;
outline: none;
font-size: larger;
text-align: center;
background: transparent;
}

button{
    height:2rem;
    width:5rem;
   cursor: pointer;
   border-top-right-radius: 1rem;
   border-bottom-right-radius: 1rem;
   border: none;
   background: transparent;
   background-color: coral;
   position: relative;
   left: 0.6rem;
 
}

button img{
    width: 1.5rem;
    position: relative;
    top: 5px;
}

h1{
    color:hwb(0 100% 0%);
}

.cloud{
    text-align: center;
   padding: 1rem;
}

.airspeed{
    display: flex;
    margin-top: 20px;
} 
.airmsg{
    height: 50px;
    width:90px;
    position: relative;
    top: 7px;
  
}

.wind{
    display: flex;
    justify-content: space-around;
    align-items: center;
    position: relative;
    top: 5px;
}


.environment{
    display: flex;
    justify-content: space-around;
    margin-top: 30px;
  gap:2rem;
  color: rgb(8, 8, 90);
  font-weight: bold;
}

.environment img{
    height: 2rem;
    width: 2rem;
    margin-right: 15px;
  
}

.image{
    height: 250px;
    width: 250px;

}

button:active{
    background-color:gold;
}