/*
--- LIQUID GLASS VIBE & SITE UNIFICATION ---
*/
:root {
--glass-bg: rgba(255, 255, 255, 0.7);
--glass-border: rgba(0, 60, 109, 0.15);
--cpc-blue: #003c6d;
--cpc-blue-light: #e6f0ff;
--cpc-accent: #004494;
}
.main-content {
background: linear-gradient(135deg, #f8faff 0%, #e3eaff 100%);
min-height: 100vh;
}
.glass-vibe-container {
position: relative;
padding: 40px 0;
margin: 2rem 0;
isolation: isolate;
}
/* Liquid Decorative Blobs */
.liquid-blob {
position: absolute;
border-radius: 50%;
filter: blur(60px);
z-index: -1;
opacity: 0.4;
animation: liquid-float 20s infinite alternate ease-in-out;
}
.blob-1 {
width: 300px;
height: 300px;
background: var(--cpc-blue);
top: -50px;
right: -100px;
}
.blob-2 {
width: 250px;
height: 250px;
background: var(--cpc-accent);
bottom: -50px;
left: -80px;
animation-delay: -5s;
}
@keyframes liquid-float {
0% { transform: translate(0, 0) scale(1); }
100% { transform: translate(30px, 50px) scale(1.1); }
}
/* Glassmorphic Table */
.episode-table {
width: 100%;
border-collapse: separate;
border-spacing: 0;
margin: 1.5rem 0;
background: var(--glass-bg);
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
border: 1px solid var(--glass-border);
border-radius: 16px;
overflow: hidden;
box-shadow: 0 8px 32px rgba(0, 60, 109, 0.08);
}
.episode-table thead { background: rgba(0, 60, 109, 0.8); color: #fff; }
.episode-table th {
padding: 16px 20px;
text-align: left;
font-weight: 700;
font-size: 0.95rem;
letter-spacing: 0.05em;
text-transform: uppercase;
}
.episode-table td {
padding: 18px 20px;
border-bottom: 1px solid var(--glass-border);
vertical-align: middle;
transition: background 0.3s ease;
}
.episode-table tbody tr:last-child td { border-bottom: none; }
.episode-table tbody tr:hover td { background: rgba(255, 255, 255, 0.4); }
.ep-num {
width: 32px;
height: 32px;
border-radius: 10px;
background: var(--cpc-blue);
color: #fff;
font-size: 0.9rem;
font-weight: 700;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 4px 12px rgba(0, 60, 109, 0.2);
}
.ep-title { font-weight: 600; color: #1a202c; font-size: 1.05rem; }
.ep-date { color: #475569; font-weight: 600; font-size: 0.9rem; white-space: nowrap; }
.ep-listen {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 8px 18px;
background: var(--cpc-blue);
color: #fff !important;
border-radius: 12px;
text-decoration: none;
font-size: 0.85rem;
font-weight: 700;
white-space: nowrap;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
box-shadow: 0 4px 12px rgba(0, 60, 109, 0.15);
}
.ep-listen:hover {
background: var(--cpc-accent);
transform: translateY(-2px);
box-shadow: 0 6px 16px rgba(0, 60, 109, 0.25);
}
.ep-listen::before { content: "\f04b"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 0.7rem; }
.ep-coming {
display: inline-block;
padding: 6px 14px;
background: rgba(0, 0, 0, 0.05);
border-radius: 8px;
font-size: 0.8rem;
color: #64748b;
font-weight: 500;
}
/* Mobile Responsiveness: Card Stack */
@media (max-width: 768px) {
.glass-vibe-container { padding: 20px 0; }
.episode-table, .episode-table thead, .episode-table tbody, .episode-table th, .episode-table td, .episode-table tr {
display: block;
}
.episode-table thead tr { position: absolute; top: -9999px; left: -9999px; }
.episode-table tr {
margin-bottom: 1.5rem;
background: rgba(255, 255, 255, 0.5);
border-radius: 16px;
border: 1px solid var(--glass-border);
padding: 10px;
}
.episode-table td {
border: none;
position: relative;
padding-left: 50%;
text-align: right;
min-height: 48px;
}
.episode-table td:before {
position: absolute;
left: 20px;
width: 45%;
padding-right: 10px;
white-space: nowrap;
text-align: left;
font-weight: 700;
color: var(--cpc-blue);
font-size: 0.8rem;
text-transform: uppercase;
}
.episode-table td:nth-of-type(1):before { content: "Episode"; }
.episode-table td:nth-of-type(2):before { content: "Title"; }
.episode-table td:nth-of-type(3):before { content: "Date"; }
.episode-table td:nth-of-type(4):before { content: "Link"; }
.episode-table td .ep-num { margin-left: auto; }
.episode-table td .ep-listen, .episode-table td .ep-coming { margin-top: 5px; }
}
/* Schedule list unification */
.mission-schedule { padding: 0; margin: 2rem 0; }
.mission-schedule li {
background: #fff;
margin-bottom: 1rem;
padding: 20px;
border-radius: 12px;
box-shadow: 0 2px 8px rgba(0,0,0,0.03);
border-left: 4px solid var(--cpc-blue);
line-height: 1.6;
}
π Download handout (PDF)
For more on our theology of mission, see Total Christ class #2, Missional .
Teaching Series Episodes
#
Episode
Date
1
Introduction to a Theology of Mission and Missional Living
Mar 15
Listen
2
Practices of Missional Living and Hospitality
Mar 22
Listen
3
Special Guest: Matthew Denney (Jubilee New Haven)
Apr 12
Listen
4
Colleen & Tyler Rice β Missional Practices in Neighborhood & Spheres
Apr 19
Coming soon
Where Weβre Going
March 15 β Introduction to a Theology of Mission and Missional Living
March 22 β Practices of Missional Living and Hospitality
April 12 β Special Guest: Matthew Denney
βJMattβ is a member of Trinity Baptist Church and works as Executive Director of Jubilee New Haven , an organization that exists to cultivate holistic flourishing in New Haven through community-building, spiritual formation, and housing justice.
April 19 β Colleen & Tyler Rice lead us in discussion of missional practices in their neighborhood and spheres
Last updated: March 26, 2026
Join us for worship and fellowship. Learn more
203.777.6960 | admin@cpcnewhaven.org | 135 Whitney Ave. New Haven CT 06510
Β© 2025 Christ Presbyterian Church.