diff --git a/css/styles.css b/css/styles.css index 582b3d7..551730b 100644 --- a/css/styles.css +++ b/css/styles.css @@ -241,7 +241,33 @@ section { padding: 64px 0; } justify-content: center; } .hero-image img { width: 100%; height: 100%; object-fit: cover; } -.hero-headshot img { object-position: center top; } + +.hero-montage { + display: grid; + grid-template-columns: 1.25fr .9fr; + grid-template-rows: 1fr 1fr; + gap: 8px; + aspect-ratio: 4 / 3; + overflow: hidden; + border: 1px solid var(--rule); + border-radius: 3px; + background: #10283d; + padding: 8px; +} + +.hero-montage img { + width: 100%; + height: 100%; + object-fit: cover; + display: block; + border: 1px solid rgba(255,255,255,.10); +} + +.hero-montage .montage-main { + grid-row: 1 / 3; + object-fit: contain; + background: #10283d; +} .image-placeholder { width: 100%; height: 100%; @@ -457,13 +483,9 @@ section { padding: 64px 0; } /* ---------- About ---------- */ .about-grid { display: grid; - grid-template-columns: 1fr; + grid-template-columns: .9fr 1.45fr 1fr; gap: 24px; - align-items: start; -} - -.about-text { - max-width: 900px; + align-items: stretch; } .about-photo { background: #e9edf1; @@ -480,25 +502,40 @@ section { padding: 64px 0; } padding: 22px 24px; } .about-text h3 { font-size: 19px; margin-bottom: 12px; } -.pull-quote { + +.about-focus { background: #eef2f6; border: 1px solid var(--rule); - border-left: 3px solid var(--steel); - border-radius: 3px; - padding: 20px 22px; - font-style: italic; - color: var(--text); - font-size: 14.5px; + border-top: 3px solid var(--steel); + border-radius: 4px; + padding: 22px 24px; +} + +.about-focus h3 { + font-size: 18px; + margin-bottom: 12px; +} + +.about-focus ul { + margin: 0; + padding-left: 19px; + color: var(--muted-2); + font-size: 14px; line-height: 1.6; } -.pull-quote .mark { - font-family: Georgia, serif; - font-size: 34px; - color: var(--steel); - line-height: 0; - position: relative; - top: 10px; - margin-right: 4px; + +.about-links { + display: flex; + flex-wrap: wrap; + gap: 12px; + margin-top: 18px; + padding-top: 14px; + border-top: 1px solid var(--rule); +} + +.about-links a { + font-size: 13.5px; + font-weight: 600; } /* ---------- Education / Experience ---------- */ diff --git a/index.html b/index.html index 9cbe6a3..add5af9 100644 --- a/index.html +++ b/index.html @@ -67,8 +67,14 @@ Download Resume -
- Keith Casko +
+ ByteGeist Active Directory homelab topology + ByteGeist infrastructure monitoring dashboard + ByteGeist Support Lab application
@@ -278,6 +284,12 @@
+
+ Keith Casko +
+

Keith Casko — Kalamazoo, Michigan

@@ -295,6 +307,21 @@ problem-solving under pressure.

+ +