.heading{font-size:24px;text-align:center}.heading h1{padding:15px;height:10vh}.flag-icon{width:24px;height:16px;margin-right:5px}@media (max-width: 900px){.heading{font-size:18px}}@media (max-width: 475px){.heading{font-size:12px}}img{z-index:-1;position:absolute;background-repeat:no-repeat;object-fit:cover;height:80vh;width:80vw;border-radius:25px}.main-body{display:flex;align-items:center;justify-content:center;height:80vh;width:80vw;border-radius:20px;margin-left:auto;margin-right:auto;flex-direction:column;background-repeat:no-repeat;background-size:cover;position:relative}.city-display{font-size:39px;margin:2%}.city-display p#city-name-display{background-color:#783592;color:#fff;height:5vh}.hero{position:absolute;top:10px;right:4px}.hero p{width:fit-content;color:#fff;background-color:#783592}.main-body input{padding:10px;border:5px solid #783592;border-radius:30px;background-color:var(--primary-color);color:var(--secondary-color)}.main-body input:focus{outline:none}.main-body-heading{display:flex}.city-name{margin:1%;display:flex;flex-wrap:wrap;justify-content:space-around;width:100%}.city-name button{padding:10px 25px;background-color:#783592;color:#fff;box-shadow:none;border-radius:5px;margin:3%;border:none;height:30px;width:120px;text-align:center}.result-display{height:40%;width:70%;background-color:#783592;margin:3%;display:flex;justify-content:space-around;align-items:center;font-size:34px;color:#fff;border-radius:10px;position:relative}.result-display select{position:absolute;top:3%;left:1%;border-radius:13px;background-color:var(--primary-color);color:var(--secondary-color)}.result-display select:focus{border:none}.result-display select:active{border:none}.result-display p#temp{margin-left:10px;margin-right:auto}.result-display p#desc{margin-right:10px}.future-display{display:flex;flex-wrap:wrap;width:70%;align-items:center;justify-content:center}.future-time{background-color:#783592;margin:2%;color:#fff;height:15vh;width:15vh;display:flex;align-items:center;justify-content:center;border-radius:10px}.future-time p{text-align:center}@media (max-width: 900px){.result-display{font-size:24px}.future-time{width:10vh;height:10vh;font-size:10px}.city-name button{padding:7px 20px}.city-display{font-size:28px;margin:2%}.city-display p#city-name-display{background-color:#783592;color:#fff;height:4vh}}@media (max-width: 400px){.result-display{font-size:18px}.city-display{font-size:23px;margin:2%}}.footer{background-color:#783592;position:absolute;bottom:0;width:100%;text-align:center;color:#fff;padding-top:5px;height:3vh}*{margin:0;padding:0;box-sizing:border-box}:root{--primary-color: rgba(255, 255, 255, .87);--secondary-color: #242424;color-scheme:dark light;color:var(--secondary-color);background-color:var(--primary-color)}