:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#background-video{position:fixed;top:0;left:0;width:100%;height:100%;object-fit:cover;z-index:-1}.App{text-align:center;font-family:Arial,sans-serif;padding:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;color:#fff}.weather-container{display:flex;flex-direction:column;align-items:center;gap:20px;margin-top:20px}.weather-card{border:1px solid #ccc;border-radius:8px;padding:20px;width:100%;max-width:300px;box-shadow:1px 1px 8px red;transition:transform .2s;background-color:#00000080}.weather-card:hover{transform:scale(1.05)}.weather-card h3{margin:0;font-size:1.2em}.weather-card p{margin:5px 0}form{margin-top:20px;display:flex;flex-direction:column;align-items:center;gap:10px;width:100%;max-width:300px}input,button{padding:10px;font-size:1em;border:1px solid #ccc;border-radius:4px;margin-bottom:10px;width:100%;max-width:300px;box-sizing:border-box}button{background-color:#007bff;color:#fff;cursor:pointer;transition:background-color .2s;border:none}button:hover{background-color:#0056b3}.weather-card{position:relative;color:#fff;padding:20px;border-radius:8px;overflow:hidden}.weather-card:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:#00000080;z-index:1}.weather-card h3,.weather-card p{position:relative;z-index:2}.weather-card.sunny{background-image:url(https://cdn.pixabay.com/photo/2016/10/03/19/40/sunset-1712625_640.jpg);background-size:cover}.weather-card.rainy{background-image:url(https://cdn.pixabay.com/photo/2018/03/11/12/14/raindrops-3216607_1280.jpg);background-size:cover}.weather-card.cloudy{background-image:url(https://cdn.pixabay.com/photo/2016/09/05/07/44/cloudy-1645868_1280.jpg);background-size:cover}.weather-card.foggy{background-image:url(https://cdn.pixabay.com/video/2018/05/11/16160-269534741_tiny.mp4);background-size:cover}.weather-card.showerrain{background-image:url(https://pixabay.com/es/photos/niebla-neblinoso-bosque-%C3%A1rboles-7547298/);background-size:cover}.weather-card.snow{background-image:url(https://pixabay.com/es/illustrations/copos-de-nieve-nieve-nevada-nevando-554635/);background-size:cover}@media (max-width: 768px){.weather-card{width:80%}form{width:90%}}@media (max-width: 480px){.weather-card{width:100%}form{width:90%}}