/* =========================================================
PAGE + COLOR PALETTE
========================================================= */
.ssq-gallery-page {
–ssq-red:#E5221F;
–ssq-green:#4C8B26;
–ssq-green-dark:#376B19;
–ssq-navy:#123E70;
–ssq-light-blue:#EEF5FA;
–ssq-cream:#FFFDF8;
–ssq-white:#FFFFFF;
–ssq-text:#24313D;
–ssq-border:#E4E4DE;
width:100%;
margin:0;
padding:0;
background:var(–ssq-white);
color:var(–ssq-text);
font-family:Arial, Helvetica, sans-serif;
}
.ssq-gallery-page *,
.ssq-gallery-page *::before,
.ssq-gallery-page *::after {
box-sizing:border-box;
}
.ssq-gallery-page img {
display:block;
max-width:100%;
}
.ssq-gallery-container {
width:min(1180px, calc(100% – 40px));
margin:0 auto;
}
/* =========================================================
SHARED TYPOGRAPHY
========================================================= */
.ssq-gallery-eyebrow {
margin:0 0 10px;
color:var(–ssq-green);
font-size:13px;
font-weight:800;
letter-spacing:2px;
text-transform:uppercase;
}
.ssq-gallery-script {
color:var(–ssq-red);
font-family:”Brush Script MT”, “Segoe Script”, cursive;
font-weight:400;
}
/* =========================================================
INTRO
========================================================= */
.ssq-gallery-intro {
position:relative;
overflow:hidden;
padding:90px 0 75px;
background:var(–ssq-cream);
text-align:center;
}
/* Decorative color strip */
.ssq-gallery-intro::before {
content:””;
position:absolute;
top:0;
left:0;
right:0;
height:7px;
background:
repeating-linear-gradient(
90deg,
var(–ssq-red) 0 34px,
var(–ssq-green) 34px 68px,
var(–ssq-navy) 68px 102px
);
}
/* Subtle quilt pattern */
.ssq-gallery-intro::after {
content:””;
position:absolute;
inset:0;
opacity:.025;
pointer-events:none;
background-image:
linear-gradient(
45deg,
var(–ssq-navy) 25%,
transparent 25%
),
linear-gradient(
-45deg,
var(–ssq-navy) 25%,
transparent 25%
),
linear-gradient(
45deg,
transparent 75%,
var(–ssq-navy) 75%
),
linear-gradient(
-45deg,
transparent 75%,
var(–ssq-navy) 75%
);
background-size:40px 40px;
background-position:
0 0,
0 20px,
20px -20px,
-20px 0;
}
.ssq-gallery-intro-inner {
position:relative;
z-index:2;
max-width:780px;
margin:0 auto;
}
.ssq-gallery-intro h1 {
margin:0 0 23px;
color:var(–ssq-navy);
font-family:Georgia, “Times New Roman”, serif;
font-size:52px;
font-weight:500;
line-height:1.08;
}
.ssq-gallery-intro h1 .ssq-gallery-script {
display:block;
margin-top:4px;
font-size:1.15em;
}
.ssq-gallery-intro-copy {
max-width:680px;
margin:0 auto;
color:var(–ssq-text);
font-size:17px;
line-height:1.7;
}
/* Decorative stitch */
.ssq-gallery-stitch {
width:150px;
height:2px;
margin:25px auto 0;
background:
repeating-linear-gradient(
to right,
var(–ssq-green) 0 10px,
transparent 10px 19px
);
}
/* =========================================================
GALLERY AREA
========================================================= */
.ssq-gallery-work {
padding:80px 0 100px;
background:var(–ssq-white);
}
/* =========================================================
GALLERY GRID
========================================================= */
.ssq-gallery-grid {
display:grid;
grid-template-columns:repeat(3, minmax(0, 1fr));
gap:34px 24px;
}
.ssq-gallery-item {
margin:0;
}
/* =========================================================
GALLERY IMAGE
========================================================= */
.ssq-gallery-image-wrap {
position:relative;
overflow:hidden;
aspect-ratio:4 / 3;
background:var(–ssq-light-blue);
border:1px solid var(–ssq-border);
}
/* Small handmade corner detail */
.ssq-gallery-image-wrap::before {
content:””;
position:absolute;
z-index:2;
top:10px;
left:10px;
width:24px;
height:24px;
border-top:2px solid rgba(255,255,255,.85);
border-left:2px solid rgba(255,255,255,.85);
pointer-events:none;
}
.ssq-gallery-image-wrap::after {
content:””;
position:absolute;
z-index:2;
right:10px;
bottom:10px;
width:24px;
height:24px;
border-right:2px solid rgba(255,255,255,.85);
border-bottom:2px solid rgba(255,255,255,.85);
pointer-events:none;
}
.ssq-gallery-image-wrap img {
width:100%;
height:100%;
object-fit:cover;
transition:transform .35s ease;
}
.ssq-gallery-item:hover .ssq-gallery-image-wrap img {
transform:scale(1.025);
}
/* =========================================================
CAPTIONS
========================================================= */
.ssq-gallery-caption {
padding:17px 4px 0;
}
.ssq-gallery-category {
margin:0 0 6px;
color:var(–ssq-green);
font-size:11px;
font-weight:800;
letter-spacing:1.5px;
text-transform:uppercase;
}
.ssq-gallery-name {
margin:0;
color:var(–ssq-navy);
font-family:Georgia, “Times New Roman”, serif;
font-size:22px;
font-weight:500;
line-height:1.3;
}
/* =========================================================
MID-PAGE BRAND MESSAGE
========================================================= */
.ssq-gallery-note {
margin:85px 0 0;
padding:38px 30px;
background:var(–ssq-light-blue);
border:1px solid #D9E7F1;
text-align:center;
}
.ssq-gallery-note p {
max-width:720px;
margin:0 auto;
color:var(–ssq-navy);
font-family:Georgia, “Times New Roman”, serif;
font-size:23px;
font-style:italic;
line-height:1.5;
}
.ssq-gallery-note-heart {
margin-top:10px;
color:var(–ssq-red);
font-size:18px;
}
/* =========================================================
FINAL CTA
========================================================= */
.ssq-gallery-cta {
position:relative;
overflow:hidden;
background:var(–ssq-red);
}
.ssq-gallery-cta::before {
content:””;
position:absolute;
inset:0;
opacity:.08;
background-image:
linear-gradient(
45deg,
#fff 25%,
transparent 25%
),
linear-gradient(
-45deg,
#fff 25%,
transparent 25%
),
linear-gradient(
45deg,
transparent 75%,
#fff 75%
),
linear-gradient(
-45deg,
transparent 75%,
#fff 75%
);
background-size:36px 36px;
background-position:
0 0,
0 18px,
18px -18px,
-18px 0;
}
.ssq-gallery-cta-inner {
position:relative;
z-index:2;
min-height:170px;
display:grid;
grid-template-columns:auto 1fr auto;
gap:28px;
align-items:center;
}
.ssq-gallery-cta-logo {
width:115px;
height:115px;
padding:3px;
object-fit:contain;
border:6px solid white;
border-radius:50%;
background:white;
}
.ssq-gallery-cta h2 {
margin:0 0 8px;
color:white;
font-family:Georgia, “Times New Roman”, serif;
font-size:34px;
font-weight:500;
line-height:1.2;
}
.ssq-gallery-cta p {
margin:0;
color:white;
font-size:15px;
line-height:1.6;
}
/* =========================================================
BUTTON
========================================================= */
.ssq-gallery-btn {
display:inline-flex;
justify-content:center;
align-items:center;
min-height:46px;
padding:12px 22px;
border:2px solid white;
border-radius:4px;
background:var(–ssq-green);
color:white !important;
font-size:13px;
font-weight:800;
letter-spacing:.7px;
text-transform:uppercase;
text-decoration:none !important;
transition:
transform .2s ease,
background .2s ease;
}
.ssq-gallery-btn:hover {
transform:translateY(-2px);
background:var(–ssq-green-dark);
}
/* =========================================================
TABLET
========================================================= */
@media (max-width:900px) {
.ssq-gallery-grid {
grid-template-columns:repeat(2, minmax(0, 1fr));
}
.ssq-gallery-intro {
padding:75px 0 65px;
}
.ssq-gallery-intro h1 {
font-size:45px;
}
.ssq-gallery-cta-inner {
grid-template-columns:1fr;
justify-items:center;
padding:42px 0;
text-align:center;
}
}
/* =========================================================
MOBILE
========================================================= */
@media (max-width:600px) {
.ssq-gallery-container {
width:min(1180px, calc(100% – 28px));
}
.ssq-gallery-intro {
padding:65px 0 55px;
}
.ssq-gallery-intro h1 {
font-size:38px;
}
.ssq-gallery-intro-copy {
font-size:16px;
}
.ssq-gallery-work {
padding:55px 0 70px;
}
.ssq-gallery-grid {
grid-template-columns:1fr;
gap:38px;
}
.ssq-gallery-note {
margin-top:60px;
padding:32px 22px;
}
.ssq-gallery-note p {
font-size:20px;
}
.ssq-gallery-cta h2 {
font-size:29px;
}
}
Recent Work
Quilts made with
stories stitched in.
Every quilt that comes into my studio is different.
Some begin as a carefully pieced quilt top, others
as a stack of meaningful T-shirts, clothing, or
treasured fabrics. Here are a few of the projects
I have had the privilege of bringing to life.
Edge-to-Edge Quilting
Modern Patchwork Quilt
Memory Quilt
Rally Towel Memory Quilt
Custom Quilting
Custom Quilt Design
Quilt Restoration
A Quilt Given New Life
Edge-to-Edge Quilting
Quilting in the Details
Finished Quilt
Made to Be Loved
Memory Quilt
Memories Made Cozy
Special Project
Something One of a Kind
Custom Quilting
From Quilt Top to Finished
Every quilt is a little different.
That is exactly what makes this work so special.
♥
Ready to start your quilt story?
I’d love to hear about your project
and help bring it to life.
Get a Quote Today →
