body{
        background-color:aliceblue;
        font-family:Mulish;
    }
    .container{
        background-color:white;
        margin:100px auto; 
        min-width:400px;
        max-width:600px;
        padding:40px;
        border-radius:10px;
       box-shadow: rgba(65, 50, 100, 0.08) 0px 30px 50px 0px;
    }
    .input{
        display:flex;
        gap:1rem;
    }
    .text-input{
        background-color: aliceblue;
        width:500px;
        padding:10px;
        font-size:20px;
        border-radius:5px;
        border:none;
    }
    .text-input :hover{
        border:1px solid black;
    }
    .submit-input{
        background-color:rgb(136, 93, 241);
        font-size:17px;
        width:100px;
        border-radius:10px;
        border:none;
        color:white;
    }
    h1{
        font-size:35px;
        
    }
    .data{
        display:flex;
        justify-content:space-between;
    }
    .current-weather{
        font-weight:100;
    }
    .weather{
        display:flex;
    }
    .icon{
        width:50px;
           
    }
    .number{
        font-size:80px;
        margin-top:-40px;
        
    }
    .degree{
        margin-top:-25px;
    }

    .percent{
        color:red;
        font-weight:bold;
    }
    .Kilo{
        color:red;
        font-weight:bold;
    }
    .forecast{
        display: flex;
        justify-content: space-around;
        padding-top: 20px;
        line-height:25px;
    }
    .weather-forcast{
        margin-left:30px;
    }
    
    .weather-icon img {
        text-align:center;
        margin-right:10px;
        width:50%;
    }
    .weather-degree{
        display:flex;
        color:red;
        gap:10px;
    }
    .weather-degreess{
        font-weight:100;
    }
    .bottom{        
        text-align:justify;
        padding-top:40px;
        font-size:14px;
        font-weight:100;
    }