
header {
    text-align: center;
    font-size: 35px;
    color: white;
    background: rgb(2,0,36);
    background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(9,9,121,1) 35%, rgba(0,212,255,1) 100%);
}

header h1 {
    padding: 15px ;
}

main {
    display: flex;
}

.sidebar{
    width: 15vw;
    height: 100vh;
    background-color: rgba(0,0,0,0.15) 
}

.report {
    width: 70%;
    padding: 15px;
}

.maininfo {
    border: 1px solid ;
    height: 50vh;
    padding: 15px;
}

.maininfo li {
    font-size: 20px;
    padding: 25px;
}

.userinput {
    padding: 15px;
}

.userinput h2 textarea button {
    padding: 5px;
}

.userinput button {
    color: white;
    background: rgb(2,0,36);
    background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(9,9,121,1) 35%, rgba(0,212,255,1) 100%);
}

.savedButton button {
    padding : 5px;
    color: white;
    width: 75%;
    background: rgb(2,0,36);
    background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(9,9,121,1) 35%, rgba(0,212,255,1) 100%);
    border-radius: 15px;
    text-transform: capitalize;
}


.savedButton{
    padding: 5px;
}

#location {
    padding-left: 40px;
    font-size: 41px;
    text-transform: capitalize;

}

ul  {
    padding-left: 15px;
}

.savedButton li {
    padding-bottom: 10px;

}

.forecast ul {
    display: flex;

}

.forecast li {
    margin: 5px;
    width: 60%;
    text-align: center;
    border-radius: 10px;
}

.forecast {
    padding-top: 25px;
}

.forecast ul {
    padding-top: 25px;
}

.forecast li {
    background :rgba(0,212,255,1);
    padding: 25px 0px ;
}

#UV {
    border-radius: 2px;
    padding: 2px ;
}

