estilos.css

/* Estilos generales */
body {
 font-family: Arial, sans-serif;
 margin: 0;
 padding: 0;
}

h1, h2 {
 text-align: center;
 color: green;
}

nav ul {
 list-style: none;
 margin: 0;
 padding: 0;
 display: flex;
 justify-content: center;
}

nav li {
 margin: 0 10px;
}

nav a {
 color: #333;
 text-decoration: none;
 font-weight: bold;
}

/* Estilos para el header */
header {
 background-color: #f2f2f2;
 padding: 20px;
 box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

/* Estilos para el main */
main {
 max-width: 1200px;
 margin: 0 auto;
 padding: 20px;
 display: grid;
 grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
 grid-gap: 20px;
}

section {
 background-color: #fff;
 padding: 20px;
 box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

/* Estilos para el footer */
footer {
 background-color: #333;
 color: #fff;
 padding: 20px;
 text-align: center;
}

/* Estilos específicos para cada sección */
.pronostico {
 background-color: #f7f7f7;
}

.radar {
 background-color: #e6e6e6;
}

.satelite {
 background-color: #f2f2f2;
}