*,*::before,*::after {box-sizing:border-box}
html {margin:0;padding:0}
body {font-family:'Gotham A','Gotham B',segoe ui,verdana,helvetica,arial,sans-serif;font-weight:300;width:90vw;max-width:1200px;margin:0 auto;}
a{color:#666;text-decoration:none}
a:hover{text-decoration:underline}

hr {width:90%;border:0 solid #666;border-top-width:1px;margin:2em auto}
h2 {font-weight:700;margin:.2em 0;padding:0}

section.box {
    border: 1px solid #ddd;
    padding: 2px;
}
    section.box header, .header {
        background-color: #ab8fb3;
        color: #fff;
        font-size: 1.4em;
        font-weight: 700;
        padding: .4rem;
        text-align: center
    }
    section.box main {
        padding: 1rem
    }
    section.box footer {
        background-color: #f7f7f7;
        padding: 1rem;
        text-align:center
    }
    section.box + section.box {
        margin-top:1rem;
    }

.tac{text-align:center}
.ib{display:inline-block}
.db{display:block}
.ma{margin:0 auto}
.vat{vertical-align:top}
.vam{vertical-align:middle}
.vab{vertical-align:bottom}

.i {font-style:italic}
.b {font-weight:bold}

.f{display:flex}
.f1 {flex:1}
.w25 {width:25%}
.w50 {width:50%}
.w75 {width:75%}

.fs75 {font-size:.75em}

.fw1{font-weight:100}
.fw4{font-weight:400}
.fw5 {font-weight:500}

.p5{padding:5px !important}
.p10{padding:10px !important}
.p15{padding:15px !important}

#h_title {
font-size:2.8em;
color:#7c5088;
text-align:center;
font-weight:500
}
#n {
border-width:1px 0;
border-color:#666;
border-style:solid;
padding:.5em 0;
text-align:center;
}
#n a {font-size:1.2em}

#n[data-key='home'] #link-home,
#n[data-key='flowers'] #link-flowers,
#n[data-key='about'] #link-about,
#n[data-key='contact'] #link-contact {
text-decoration:none;
cursor:default;
font-weight:500;
color:#7c5088;
}

#content {
padding:.9em .5em;
}
/* The runtime's filter toggle sets .filter on the [data-list] container; sold cards carry .filter. */
[data-list].filter .filter {
display:none
}

.navsub {
color:#ddd;
margin:.5rem;
text-align:right
}
.navsub a::before {
content:attr(data-toggle-off);
}
.navsub a.toggle::before {
content:attr(data-toggle-on);
}
.navsub a + a {
margin-left:.5em;
}
.navsub a {cursor:pointer}
.navsub label {
color:#9673a0;
font-size:.9em;
margin-right:.5em
}

.thumbnail_tile {
display:flex;
flex-wrap:wrap;
align-content:center;
align-items:center;
justify-content:center
}
/* The card is an article with a real img (object-fit cover) instead of the legacy background-image. */
.thumbnail {
height:20em;
width:calc(25% - .4em);
margin:0 .2em .4em;
display:flex;
align-items:flex-end;
justify-content:flex-end;
position:relative;
overflow:hidden
}
.thumbnail img {
position:absolute;
top:0;left:0;
width:100%;height:100%;
object-fit:cover;
object-position:50% 50%;
}
.thumbnail:hover {
cursor:pointer;
opacity:.7
}
.thumbnail a {
background-color:rgba(50,50,50,.6);
color:#fff;
font-size:1.6em;
padding:.25em 0;
display:block;
text-align:center;
width:100%;
position:relative
}
.thumbnail .badge.none {display:none}
.thumbnail .sold {
background-color:rgba(124,81,137,.75);
color:#fff;
display:block;
font-size:1.5em;
padding:1em 0;
position:absolute;top:0;right:0;
text-align:center;
width:50%;
}

/* Modal sub-page (the site runtime's .mn-modal, adapted from the legacy vo-modal). */
.mn-modal {
display:flex;
width:100vw;
height:100vh;
position:fixed;
top:0;left:0;
margin:0;padding:0;
z-index:99;
background-color:rgba(125,125,125,.2);
justify-content:center;
align-items:center;
}
.mn-modal-panel {
position:relative;
background-color:#fff;
z-index:100;
overflow:auto;
width:1200px;
max-width:100vw;
max-height:100vh;
min-height:200px;
display:flex;
flex-direction:column;
}
.mn-modal-panel figure {
margin:0;
flex:1;
display:flex;
flex-direction:column;
min-height:0;
}
.mn-modal-panel img {
width:100%;
height:80vh;
object-fit:contain;
background-color:#000;
display:block;
}
.mn-modal-panel figcaption {
background-color:rgba(50,50,50,.6);
color:#fff;
padding:10px 12px;
order:-1;
}
.mn-modal-close {
position:absolute;
top:0;right:0;
color:#fff;
padding:10px 12px;
cursor:pointer;
}
.mn-modal-close:hover {
background-color:rgba(0,0,0,.3);
}
body.mn-modal-open {overflow:hidden}