/*-------------------global---------------------*/
*
{
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
    font-family:'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
}
body
{
    padding: 5px;
    background:linear-gradient(
        #1A2980,#26D0CE) ;
        background-repeat: no-repeat;
       height: 845px;
        overflow: scroll;

}
h1
{   padding: 10px;
    text-align: center;
    background: linear-gradient(to right, #e9d362, 
    #333333); 
            -webkit-text-fill-color: transparent; 
            background-clip : text; 
}
h2
{
    font-size: 30px;
    font-weight:500;
    background: linear-gradient(to right,#000428,#004e92); 
-webkit-text-fill-color: transparent; 
background-clip : text; 

}
/*------------------search----------------------*/
.searchbox
{ 

    display: flex;
    justify-content: center;
    padding: 25px 5px 15px 5px; 
    gap: 15px;

}
#search
{
    padding: 15px;
    border-radius:25px;
    width: 500px;
    text-align: center;
    border: none;
    color:linear-gradient(#FF512F,#DD2476);
    outline: 0;
    font-size: 15px;

}
#searchicon
{
    border-radius: 25px;
    background:linear-gradient(#FF512F,#F09819);
    border: none;
    width: 75px;
    cursor: pointer;
}
#searchicon img
{
    width: 45px;
}
/*-----------------error display message----------------*/
.error404
{
    background: linear-gradient(to right,#f12711,#f5af19); 
    -webkit-text-fill-color: transparent; 
    background-clip : text;
    text-align: center ;
    padding: 10px;
    display: none;
}
/*---------------------weather information--------------------*/
.info
{
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-items: center;

    
}
.sun
{
    display: flex;
    flex-wrap: wrap;
    width: 200px;

}
/*--------------------additional weather informatio--------------*/
.data
{
    display:flex;
    flex-direction: row;
    justify-content: space-between;
    width: 350px;
    overflow: hidden;
    margin-top: 25px;
}
p ,.Humidity,.wind
{
    background: linear-gradient(to right,#e9d362,#333333); 
   -webkit-text-fill-color: transparent; 
   background-clip : text; 
   text-align: center;
   font-size: 30px;


}
.addon
{  
    font-size: 25px;
    background: linear-gradient(to right,#000428,#004e92); 
    -webkit-text-fill-color: transparent; 
    background-clip : text;
}
.addon1
{
    font-size: 25px;
    background: linear-gradient(to right,#000428,#004e92); 
    -webkit-text-fill-color: transparent; 
    background-clip : text;
}
/*--------------------footer---------------------------*/
footer
{
   margin-top: 80px;
   font-size: 15px;
   background: linear-gradient(to right,#e9d362,#333333); 
   -webkit-text-fill-color: transparent; 
   background-clip : text; 
   text-align: center;
   display: none;

}