diff --git a/index.html b/index.html index befb04d..fd18a43 100644 --- a/index.html +++ b/index.html @@ -12,118 +12,315 @@ } body { - font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; + font-family: 'Garamond', 'Georgia', serif; line-height: 1.6; - color: #333; - background: #98D8A8; + color: #2a2a2a; + background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%); min-height: 100vh; padding: 20px; + display: flex; + justify-content: center; + align-items: center; + } + + .border-wrapper { + position: relative; + width: fit-content; + } + + .corner-circle { + position: absolute; + width: 60px; + height: 60px; + background-color: #ffd700; + border-radius: 50%; + z-index: 100; + } + + .corner-circle::after { + content: ''; + position: absolute; + width: 60px; + height: 60px; + background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%); + border-radius: 50%; + } + + .top-left { + top: -14px; + left: -14px; + } + + .top-left::after { + top: -10px; + left: -10px; + } + + .top-right { + top: -14px; + right: -14px; + } + + .top-right::after { + top: -10px; + right: -10px; + } + + .bottom-left { + bottom: -14px; + left: -14px; + } + + .bottom-left::after { + bottom: -10px; + left: -10px; + } + + .bottom-right { + bottom: -14px; + right: -14px; + } + + .bottom-right::after { + bottom: -10px; + right: -10px; } .container { max-width: 800px; - margin: 0 auto; - background: white; - border-radius: 15px; - border: 4px solid white; - box-shadow: 0 10px 30px rgba(0,0,0,0.15); - overflow: hidden; + background: #f5f1e8; + border-radius: 0; + border: 8px solid #ffd700; + box-shadow: 0 20px 60px rgba(0,0,0,0.4); + overflow: visible; + position: relative; + } + + .inner-border { + position: absolute; + top: 8px; + left: 8px; + right: 8px; + bottom: 8px; + border: 8px solid #ffd700; + pointer-events: none; + } + + /* Geometric pattern accent */ + .container::before { + content: ''; + position: absolute; + top: 0; + left: 0; + right: 0; + height: 3px; + background: repeating-linear-gradient( + 90deg, + #ffd700 0px, + #ffd700 2px, + #1a3a52 2px, + #1a3a52 4px + ); + z-index: 50; } .header { - #background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%); - background: #0c1b33; - color: white; - padding: 40px; + background: linear-gradient(135deg, #1a3a52 0%, #0f2540 100%); + color: #f5f1e8; + padding: 50px 40px; text-align: center; + position: relative; + overflow: hidden; + } + + /* Art deco diagonal stripe pattern in header */ + .header::before { + content: ''; + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + background-image: + repeating-linear-gradient( + 45deg, + transparent, + transparent 35px, + rgba(255, 215, 0, 0.03) 35px, + rgba(255, 215, 0, 0.03) 70px + ); + pointer-events: none; + } + + .header-content { + position: relative; + z-index: 2; } .header h1 { - font-size: 2.5em; - margin-bottom: 10px; - font-weight: 300; + font-size: 3em; + margin-bottom: 5px; + font-weight: 400; + letter-spacing: 3px; + text-transform: uppercase; } .header .title { - font-size: 1.2em; - opacity: 0.9; - margin-bottom: 20px; + font-size: 1em; + opacity: 0.95; + margin-bottom: 25px; + letter-spacing: 2px; + text-transform: uppercase; + font-weight: 300; + } + + .title-divider { + width: 60px; + height: 2px; + background: #ffd700; + margin: 15px auto; } .contact-info { display: flex; justify-content: center; - gap: 20px; + gap: 30px; flex-wrap: wrap; + font-size: 0.95em; + letter-spacing: 1px; } .contact-info span { display: flex; align-items: center; - gap: 5px; + gap: 8px; } .content { - padding: 40px; + padding: 50px 40px; + background: #f5f1e8; } .section { - margin-bottom: 40px; + margin-bottom: 45px; } .section h2 { - color: #2c3e50; - border-bottom: 2px solid #0c1b33; - padding-bottom: 10px; + color: #1a3a52; + font-size: 1.3em; + margin-bottom: 5px; + letter-spacing: 2px; + text-transform: uppercase; + font-weight: 400; + } + + .section h2::before { + content: '◆ '; + color: #ffd700; + margin-right: 10px; + } + + .section-divider { + width: 80px; + height: 2px; + background: linear-gradient(90deg, #ffd700 0%, #1a3a52 100%); margin-bottom: 20px; - font-size: 1.4em; } .experience-item, .education-item { - margin-bottom: 25px; - padding-left: 20px; - border-left: 3px solid #0c1b33; + margin-bottom: 30px; + padding-left: 25px; + border-left: 3px solid #ffd700; + position: relative; + } + + .experience-item::before { + content: '►'; + position: absolute; + left: -13px; + color: #ffd700; + font-size: 0.8em; } .experience-item h3, .education-item h3 { - color: #2c3e50; - margin-bottom: 5px; + color: #1a3a52; + margin-bottom: 3px; + font-size: 1.1em; + font-weight: 600; } .job-meta, .edu-meta { - color: #7f8c8d; + color: #666; font-style: italic; - margin-bottom: 10px; + margin-bottom: 12px; + font-size: 0.95em; + } + + .experience-item ul { + list-style: none; + padding: 0; + } + + .experience-item li { + margin-bottom: 8px; + padding-left: 15px; + position: relative; + } + + .experience-item li::before { + content: '▪'; + position: absolute; + left: 0; + color: #ffd700; } .skills { display: flex; flex-wrap: wrap; - gap: 10px; + gap: 12px; } .skill-tag { - background: #E6AF2E; - color: white; - padding: 5px 15px; - border-radius: 20px; + background: linear-gradient(135deg, #1a3a52 0%, #0f2540 100%); + color: #ffd700; + padding: 8px 18px; + border: 1px solid #ffd700; + border-radius: 0; font-size: 0.9em; + letter-spacing: 1px; + text-transform: uppercase; + font-weight: 500; } .summary { - background: #f8f9fa; - padding: 20px; - border-radius: 8px; - border-left: 4px solid #0c1b33; + background: rgba(26, 58, 82, 0.05); + padding: 25px 20px; + border-left: 4px solid #ffd700; + border-right: 2px solid #ffd700; + position: relative; + } + + .summary::before { + content: '◆'; + position: absolute; + top: -12px; + left: 20px; + color: #ffd700; + font-size: 1.2em; + } + + .summary p { + color: #2a2a2a; + line-height: 1.8; } @media (max-width: 600px) { .header { - padding: 30px 20px; + padding: 40px 20px; } .header h1 { - font-size: 2em; + font-size: 2.2em; } .content { @@ -133,71 +330,110 @@ .contact-info { flex-direction: column; align-items: center; - gap: 10px; + gap: 15px; + } + + .corner-circle { + width: 40px; + height: 40px; + } + + .corner-circle::after { + width: 40px; + height: 40px; + } + + .top-left, .top-right { + top: -10px; + } + + .bottom-left, .bottom-right { + bottom: -10px; + } + + .top-left, .bottom-left { + left: -10px; + } + + .top-right, .bottom-right { + right: -10px; } } -
-
-

Eric Steen

-
Site Reliability Engineer / Devops
-
- 📧 eric@steen.run - 🌍 Grand Forks, ND -
-
+
+
+
+
+
-
-
-

Professional Summary

-
-

I bring experience from hardware repair to cloud infrastructure. I've worked across the full stack from hardware debugging to kubernetes orchestration. When systems break, I can troubleshoot at any layer.

+
+
+
+
+

Eric Steen

+
+
Site Reliability Engineer / Devops
+
+ 📧 eric@steen.run + 🌍 Grand Forks, ND +
-
+ -
-

Experience

- -
-

Site Reliability Engineer

-
Core Scientific • Grand Forks • Sep 2024 - Jun 2025
-
    -
  • Set up systems to collect and organize log files from different applications. Grafana Loki Prometheus
    • -
  • Tested new software before it went live, helping other departments connect their tools. Kubernetes Terraform Github Actions
    • -
  • Found new methods of error tracking to detect possible future incidents. Datadog
    • -
  • Fixed internal tools that were notoriously difficult to work with and maintain. Bash Unix Docker
    • -
-
+
+
+

Professional Summary

+
+
+

I bring experience from hardware repair to cloud infrastructure. I've worked across the full stack from hardware debugging to kubernetes orchestration. When systems break, I can troubleshoot at any layer.

+
+
-
-

Hardware Engineer

-
Core Scientific • Grand Forks • Feb 2021 - Sep 2024
-
    -
  • Wrote software to automate boring, repetative tasks, which cut downtime by 20%
    • -
  • Led several projects involving dozens of people to upgrade old systems, and did it under budget and ahead of schedule
    • -
  • Successfully scrapped legacy systems in favor of modern and more reliable systems
    • -
  • Record holder for most repairs in a shift, while also doing all the heavy lifting myself.
    • -
-
-
+
+

Experience

+
+ +
+

Site Reliability Engineer

+
Core Scientific • Grand Forks • Sep 2024 - Jun 2025
+
    +
  • Set up systems to collect and organize log files from different applications. Grafana Loki Prometheus
    • +
  • Tested new software before it went live, helping other departments connect their tools. Kubernetes Terraform Github Actions
    • +
  • Found new methods of error tracking to detect possible future incidents. Datadog
    • +
  • Fixed internal tools that were notoriously difficult to work with and maintain. Bash Unix Docker
    • +
+
-
-

Skills

-
- Kubernetes - Docker - CI/CD - Trace Repair - Soldering - Circuit Analysis - Embedded Programming - Cloud Services -
-
+
+

Hardware Engineer

+
Core Scientific • Grand Forks • Feb 2021 - Sep 2024
+
    +
  • Wrote software to automate boring, repetative tasks, which cut downtime by 20%
    • +
  • Led several projects involving dozens of people to upgrade old systems, and did it under budget and ahead of schedule
    • +
  • Successfully scrapped legacy systems in favor of modern and more reliable systems
    • +
  • Record holder for most repairs in a shift, while also doing all the heavy lifting myself.
    • +
+
+
-
+
+

Skills

+
+
+ Kubernetes + Docker + CI/CD + Trace Repair + Soldering + Circuit Analysis + Embedded Programming + Cloud Services +
+
+ +