@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap";*{margin:0;padding:0;box-sizing:border-box;font-family:Inter,sans-serif;color:#0065f2;list-style:none}a{text-decoration:none}input,li{border-radius:10px;outline:none;border:none}body{background:no-repeat url(./img/pluie-fond.svg) -425px -250px;background-color:#ebf3fe}header{text-align:center;padding:20px}header h1{text-transform:uppercase;font-size:3rem;font-weight:600;padding:20px}header h1 span{font-weight:900}main{display:flex;flex-wrap:wrap;justify-content:center}.side-bar,.weather-side{background:white;margin:10px;border-radius:15px;padding:20px;min-width:320px}.side-bar #form{display:grid;grid-template-columns:calc(70% - 5px) 30%;gap:5px;margin:15px 0}.side-bar #form input{padding:15px}.side-bar #form input:first-child{background:#ebf3fe}.side-bar #form input:first-child::placeholder{color:#025fe0}.side-bar #form input:last-child{background:rgb(0,101,242);color:#fff;cursor:pointer;transition:.2s;font-size:1rem}.side-bar #form input:last-child:hover{background:rgb(2,95,224)}.side-bar .location{display:flex;flex-direction:column}.side-bar .location li{padding:20px;margin:20px 0;background:#ebf3fe;color:#0065f2;font-weight:600;display:flex;justify-content:space-between;cursor:pointer}.side-bar .location li .deleteButton{cursor:pointer;height:25px;width:25px}.side-bar .location li .deleteButton img{width:100%;height:100%}.side-bar .location li .deleteButton:hover{scale:1.5}.side-bar .location li:hover{background:rgb(0,101,242)}.side-bar .location li:hover a{color:#fff}.weather-side{display:none}.weather-side h2{position:relative;margin:20px 10px 50px}.weather-side h2:after{content:"";top:50px;left:0;position:absolute;background:rgb(2,95,224);height:1px;width:100%}.weather-side .day-weather{display:grid;grid-template-columns:50% 50%;align-items:center;justify-items:center;border-radius:10px;margin:25px 10px;box-shadow:3px 2px 12px #0000003b;overflow:hidden}.weather-side .day-weather div:first-child{background:#ebf3fe}.weather-side .day-weather div:last-child{margin:0 auto}.weather-side .day-weather>*{width:100%;height:100%;padding:40px;border-radius:10px;display:flex;flex-direction:column;justify-content:center;text-align:center}.weather-week{display:flex;margin:25px 10px;justify-content:space-between}.weather-week_item{background:#ebf3fe;border-radius:10px;padding:30px;text-align:center;box-shadow:inset -1px 0 9px #0065f238}
