/* body{
    background-image:  linear-gradient(to bottom,
    #dcdcdc 50%,
    #e9e9e9 50% );
} */
main{
    box-shadow: 0px 30px 30px #5555;
}
main .temperature svg{
    filter: drop-shadow(0 10px 5px #000);
}
main .description{
    padding:10px 0 30px;
}
main li{
background-image: 
linear-gradient(to bottom,
transparent 50%,
#0005 50%
);
color:white;
}
.temperature img{
    margin:0 auto;
}
main{
    animation: errorEffect 0.3s linear 1;
}

@keyframes errorEffect{
    0%{
        transform: translate(10px ,5px);
    
    }
    20%{
        transform: translate(-5px ,0);
    }

    50%{
        transform: translate(8px,2px);
    }

    75%{
        transform: translate(-2px ,5px);
    }
    100%{
        transform: translate(0,0);
    }
}

.body{
    place-content: center;
         min-height: 100vh;
        font-family:sans-serif;
        background-image: 
        linear-gradient(to bottom,#dcdcdc 50%,#e9e9e9 50% );
    }
          .circle{
            width: 50px;
            height: 50px;
            border-radius:50% ;
            border: 3px solid #0f0f0f24;
            border-top-color: #b56291;
            animation: spin 1s linear infinite;
            place-self: center;
        }
        
        @keyframes spin{
           to{
            transform: rotate(360deg);
           } 
        }
    .loader2{
        margin-top: 1rem;
        display: flex;
        justify-content: center;
        gap: 10px;
     align-items: center;
     color: #b56291;
    }
    .w-logo{ 
     justify-self: center;
    }
    .line{
        width:4rem;
        height: 2px;
        background-color: #b56291;
    }