Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Dr. James Hollis - Jungian Analyst & Author</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <link rel="preconnect" href="https://fonts.googleapis.com"> | |
| <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> | |
| <link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;600;700&family=Source+Sans+Pro:wght@300;400;600&display=swap" rel="stylesheet"> | |
| <style> | |
| /* Custom CSS */ | |
| :root { | |
| --primary-color: #2C3A47; | |
| --secondary-color: #58667E; | |
| --accent-color: #8B6B61; | |
| --background-color: #F8F9FA; | |
| } | |
| body { | |
| font-family: 'Source Sans Pro', sans-serif; | |
| color: var(--primary-color); | |
| background-color: var(--background-color); | |
| } | |
| h1, h2, h3 { | |
| font-family: 'Cormorant Garamond', serif; | |
| } | |
| .bio-container { | |
| max-width: 1000px; | |
| margin: 0 auto; | |
| padding: 2rem; | |
| } | |
| .profile-image-container { | |
| width: 220px; | |
| height: 220px; | |
| border-radius: 50%; | |
| padding: 4px; | |
| background: linear-gradient(145deg, var(--secondary-color), var(--primary-color)); | |
| box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); | |
| } | |
| .profile-image { | |
| width: 100%; | |
| height: 100%; | |
| object-fit: cover; | |
| border-radius: 50%; | |
| border: 3px solid white; | |
| } | |
| .timeline-item { | |
| position: relative; | |
| padding-left: 1.5rem; | |
| border-left: 3px solid var(--accent-color); | |
| margin-bottom: 1.5rem; | |
| transition: border-color 0.3s ease; | |
| } | |
| .timeline-item:hover { | |
| border-left-color: var(--secondary-color); | |
| } | |
| .quote-block { | |
| font-family: 'Cormorant Garamond', serif; | |
| font-style: italic; | |
| border-left: 4px solid var(--accent-color); | |
| padding: 1rem 0 1rem 1.5rem; | |
| margin: 2rem 0; | |
| } | |
| .section-card { | |
| background: white; | |
| border-radius: 8px; | |
| box-shadow: 0 2px 4px rgba(0,0,0,0.05); | |
| transition: transform 0.2s ease, box-shadow 0.2s ease; | |
| } | |
| .section-card:hover { | |
| transform: translateY(-2px); | |
| box-shadow: 0 4px 8px rgba(0,0,0,0.1); | |
| } | |
| .video-container { | |
| position: relative; | |
| max-width: 300px; | |
| margin: 0 auto; | |
| background: var(--background-color); | |
| padding: 8px; | |
| border-radius: 12px; | |
| box-shadow: 0 4px 6px rgba(0,0,0,0.1); | |
| } | |
| .tech-banner { | |
| background: linear-gradient(to right, rgba(255,255,255,0.9), rgba(255,255,255,0.95)); | |
| border: 1px solid rgba(0,0,0,0.1); | |
| } | |
| </style> | |
| </head> | |
| <body class="min-h-screen"> | |
| <div class="bio-container"> | |
| <!-- Header Section --> | |
| <header class="text-center mb-16"> | |
| <h1 class="text-5xl font-bold mb-4 tracking-tight">Dr. James Hollis</h1> | |
| <p class="text-2xl text-gray-600 font-light">Jungian Analyst, Author, & Educator</p> | |
| <div class="profile-image-container mx-auto my-8"> | |
| <img src="hollis-profile.jpg" alt="Dr. James Hollis" class="profile-image"> | |
| </div> | |
| <div class="w-24 h-1 bg-gray-800 mx-auto mt-8 mb-4"></div> | |
| <p class="text-xl text-gray-600 italic">"Finding Meaning in the Second Half of Life"</p> | |
| </header> | |
| <!-- AI Experience Banner --> | |
| <div class="tech-banner section-card p-6 mb-12"> | |
| <div class="flex flex-col gap-4"> | |
| <div class="text-center"> | |
| <h2 class="text-2xl font-cormorant mb-2">Interactive Dialogue Experience</h2> | |
| <div class="w-16 h-1 bg-gray-800/20 mx-auto"></div> | |
| </div> | |
| <div class="grid md:grid-cols-2 gap-6 mt-4"> | |
| <div class="flex items-start gap-4"> | |
| <div class="flex-shrink-0 w-10 h-10 rounded-full bg-gray-100 flex items-center justify-center"> | |
| <svg class="w-5 h-5 text-gray-700" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 10l4.553-2.276A1 1 0 0121 8.618v6.764a1 1 0 01-1.447.894L15 14M5 18h8a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v8a2 2 0 002 2z" /> | |
| </svg> | |
| </div> | |
| <div> | |
| <h3 class="font-semibold text-gray-900 mb-1">Philosophical Discourse</h3> | |
| <p class="text-gray-600 text-sm leading-relaxed">Engage with Dr. Hollis's insights on personal growth, meaning, and the journey of individuation.</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start gap-4"> | |
| <div class="flex-shrink-0 w-10 h-10 rounded-full bg-gray-100 flex items-center justify-center"> | |
| <svg class="w-5 h-5 text-gray-700" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 11a7 7 0 01-7 7m0 0a7 7 0 01-7-7m7 7v4m0 0H8m4 0h4m-4-8a3 3 0 01-3-3V5a3 3 0 116 0v6a3 3 0 01-3 3z" /> | |
| </svg> | |
| </div> | |
| <div> | |
| <h3 class="font-semibold text-gray-900 mb-1">Interactive Voice Conversations</h3> | |
| <p class="text-gray-600 text-sm leading-relaxed">Experience meaningful dialogue through AI-powered conversations exploring depth psychology.</p> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="text-center text-sm text-gray-500 mt-2"> | |
| <p>Explore Jungian concepts and personal development through modern AI technology.</p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Video and Quote Section --> | |
| <div class="section-card p-8 mb-12"> | |
| <div class="flex flex-col md:flex-row gap-8 items-center"> | |
| <div class="md:w-1/3"> | |
| <div class="video-container"> | |
| <video | |
| class="rounded-lg w-full h-full object-cover shadow-lg" | |
| controls | |
| preload="metadata" | |
| poster="hollis-profile.jpg" | |
| playsinline> | |
| <source src="hollis-video.mp4" type="video/mp4"> | |
| Your browser does not support the video tag. | |
| </video> | |
| </div> | |
| </div> | |
| <div class="md:w-2/3"> | |
| <div class="quote-block text-xl h-full flex flex-col justify-center"> | |
| <svg class="w-8 h-8 text-gray-400 mb-4" fill="currentColor" viewBox="0 0 24 24"> | |
| <path d="M14.017 21v-7.391c0-5.704 3.731-9.57 8.983-10.609l.995 2.151c-2.432.917-3.995 3.638-3.995 5.849h4v10h-9.983zm-14.017 0v-7.391c0-5.704 3.748-9.57 9-10.609l.996 2.151c-2.433.917-3.996 3.638-3.996 5.849h3.983v10h-9.983z"/> | |
| </svg> | |
| "What does the soul want? Truth in the inward parts..." | |
| <div class="text-sm mt-2 text-gray-600"> | |
| - From "Finding Meaning in the Second Half of Life" | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Quick Facts --> | |
| <section class="section-card p-8 mb-12"> | |
| <h2 class="text-3xl font-semibold mb-6">Career Highlights</h2> | |
| <div class="grid md:grid-cols-2 gap-6"> | |
| <div class="space-y-3"> | |
| <p><span class="font-semibold">Education:</span> Ph.D. in Psychology</p> | |
| <p><span class="font-semibold">Training:</span> Jung Institute of Zurich, Switzerland</p> | |
| <p><span class="font-semibold">Experience:</span> Licensed Jungian Analyst</p> | |
| </div> | |
| <div class="space-y-3"> | |
| <p><span class="font-semibold">Publications:</span> Author of 16 books</p> | |
| <p><span class="font-semibold">Leadership:</span> Former Executive Director, Jung Educational Center</p> | |
| <p><span class="font-semibold">Teaching:</span> Professor of Jungian Studies, Saybrook University</p> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Publications --> | |
| <section class="section-card p-8 mb-12"> | |
| <h2 class="text-3xl font-semibold mb-6">Notable Works</h2> | |
| <div class="space-y-4 leading-relaxed"> | |
| <div class="timeline-item"> | |
| <h3 class="font-semibold text-xl">Finding Meaning in the Second Half of Life</h3> | |
| <p class="text-gray-600">Exploring the journey of personal transformation and individuation.</p> | |
| </div> | |
| <div class="timeline-item"> | |
| <h3 class="font-semibold text-xl">The Middle Passage</h3> | |
| <p class="text-gray-600">From Misery to Meaning in Midlife</p> | |
| </div> | |
| <div class="timeline-item"> | |
| <h3 class="font-semibold text-xl">Why Good People Do Bad Things</h3> | |
| <p class="text-gray-600">Understanding Our Darker Selves</p> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Areas of Expertise --> | |
| <section class="section-card p-8"> | |
| <h2 class="text-3xl font-semibold mb-6">Areas of Expertise</h2> | |
| <div class="grid md:grid-cols-2 gap-6"> | |
| <div> | |
| <h3 class="text-xl font-semibold mb-4">Clinical Practice</h3> | |
| <ul class="list-disc pl-5 space-y-2"> | |
| <li>Depth Psychology</li> | |
| <li>Jungian Analysis</li> | |
| <li>Dream Interpretation</li> | |
| <li>Midlife Transitions</li> | |
| <li>Personal Mythology</li> | |
| </ul> | |
| </div> | |
| <div> | |
| <h3 class="text-xl font-semibold mb-4">Academic Focus</h3> | |
| <ul class="list-disc pl-5 space-y-2"> | |
| <li>Archetypal Psychology</li> | |
| <li>Psychological Development</li> | |
| <li>Shadow Work</li> | |
| <li>Meaning and Purpose</li> | |
| <li>Personal Growth</li> | |
| </ul> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Footer --> | |
| <footer class="text-center mt-12 text-gray-600 text-sm"> | |
| <p>Dr. James Hollis</p> | |
| <p class="mt-2">Executive Director Emeritus, Jung Society of Washington</p> | |
| </footer> | |
| </div> | |
| <elevenlabs-convai agent-id="6reG5PXeLKPMkH6rn0jR"></elevenlabs-convai><script src="https://elevenlabs.io/convai-widget/index.js" async type="text/javascript"></script> | |
| </body> | |
| </html> |