moving to use weather as landing page

resources/css/app.css

@@ -6,3 +6,66 @@
 @theme inline {
     --font-sans: Instrument Sans, ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
 }
+
+.page-container {  display: grid;
+  grid-template-columns: 1fr;
+  grid-template-rows: 1.4fr 0.6fr;
+  gap: 2em 0em;
+  grid-auto-flow: row;
+  grid-template-areas:
+    "currentForecast"
+    "weeklyReport";
+}
+
+.currentForecast {  display: grid;
+  grid-template-columns: 1fr 1fr;
+  grid-template-rows: 1fr;
+  gap: 0px 0px;
+  grid-auto-flow: row;
+  grid-template-areas:
+    "forecast secondaryInfo";
+  grid-area: currentForecast;
+}
+
+.forecast {  display: grid;
+  grid-template-columns: 1fr;
+  grid-template-rows: 1fr 1fr 1fr;
+  gap: 0px 0px;
+  grid-auto-flow: row;
+  grid-template-areas:
+    "shortDescription"
+    "longDescription"
+    "currentTemp";
+  grid-area: forecast;
+}
+
+.shortDescription { grid-area: shortDescription; }
+
+.longDescription { grid-area: longDescription; }
+
+.currentTemp { grid-area: currentTemp; }
+
+.secondaryInfo {  display: grid;
+  grid-template-columns: 1fr;
+  grid-template-rows: 1fr 1fr;
+  gap: 0px 0px;
+  grid-auto-flow: row;
+  grid-template-areas:
+    "windContainer"
+    "solarClock";
+  grid-area: secondaryInfo;
+}
+
+.windContainer { grid-area: windContainer; }
+
+.solarClock { grid-area: solarClock; }
+
+.weeklyReport {  display: grid;
+  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
+  grid-template-rows: 1fr;
+  gap: 0px 0px;
+  grid-auto-flow: row;
+  grid-template-areas:
+    ". . . . . .";
+  grid-area: weeklyReport;
+}