/* Last-Modified: Sat, 1 Jan 2000 10:00:30 GMT [ver: ] */
/* Current-Time:Tue, 27 Oct 2026 06:24:10 -0500*/
/*! HTML5 Boilerplate v5.1.0 | MIT License | https://html5boilerplate.com/ */

/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html {
    color: #222;
    font-size: 1em;
    line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */

audio,
canvas,
iframe,
img,
svg,
video {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/*
 * apply a natural box layout model to all elements
 */

*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}

/* ==========================================================================
   General
   ========================================================================== */

body {
    margin: 0;
    padding: 0;
    height: 100%;
    width: 100%;
    font: 16px/26px 'Quicksand', sans-serif;
    font-weight: 400;
    color: #444444;
    -webkit-font-smoothing: antialiased; /* Fix for webkit rendering */
    -webkit-text-size-adjust: 100%;
    background: #F0F0F0;
}

img {
    max-width: 100%;
    height: auto;
    border: 1px solid #E1E1E1;
    -webkit-filter: grayscale(0);
            filter: grayscale(0);
    -webkit-transition:0.2s linear;
            transition:0.2s linear;
}

.img-left {
    float: left;
    margin-right: 40px;
    margin-bottom: 25px;
}

.img-right {
    float: right;
    margin-left: 40px;
    margin-bottom: 25px;
}

img.enlarge {
    -webkit-transition: -webkit-transform 0.35s;
            transition: transform 0.35s;
    -webkit-transform: perspective(1000px) translate3d(0,0,0);
            transform: perspective(1000px) translate3d(0,0,0);
}

img.enlarge:hover {
    -webkit-transform: perspective(1000px) translate3d(0,0,21px);
            transform: perspective(1000px) translate3d(0,0,21px);
}

img.lazyload, img.lazyloading {
    opacity: 0;
}

img.lazyloaded {
    opacity: 1;
}

.shadow {
    -webkit-box-shadow: 5px 5px 0px 0px rgba(0,0,0,0.15);
       -moz-box-shadow: 5px 5px 0px 0px rgba(0,0,0,0.15);
            box-shadow: 5px 5px 0px 0px rgba(0,0,0,0.15);
}

.float-right { float: right !important; }
.float-left { float: left !important; }
.float-none { float: none !important; }
.block { display: block !important; }

.margin-none { margin: 0 !important;}
.margin-top { margin-top: 30px !important; }
.margin-bottom { margin-bottom: 30px !important; }
.margin-bottom-dbl { margin-bottom: 60px !important; }
.margin-bottom-half { margin-bottom: 15px !important; }
.margin-bottom-mobile { margin-bottom: 0px !important; }

.padding-none { padding: 0 !important; }
.padding-top { padding-top: 30px !important; }
.padding-bottom { padding-bottom: 30px !important; }
.padding-bottom-dbl { padding-bottom: 60px !important; }
.padding-bottom-half { padding-bottom: 15px !important; }

.table {
    display: table;
}

.table-cell {
    display: table-cell;
    vertical-align: middle;
}

hr {
    margin-top: 50px;
    margin-bottom: 50px;
    border-top: 1px solid #E1E1E1;
    height: 1px;
    clear: both;
    position: relative;
}

hr.margin-half {
    margin-top: 25px;
    margin-bottom: 25px;
}

.overflow-visible {
    overflow: visible !important;
}

/* ==========================================================================
   Typography
   ========================================================================== */

h1, h2, h3, h4, h5, h6 {
    font-family: 'Quicksand', sans-serif;
    font-weight: 400;
    font-style: normal;
    line-height: normal;
    text-transform: lowercase;
    letter-spacing: 1px;
    color: #444444;
    margin-bottom: 30px;
    margin-top: 0px;
}

h1, .h1 { font-size: 32px; }
h2, .h2 { font-size: 28px; }
h3, .h3 { font-size: 24px; }
h4, .h4 { font-size: 20px; }
h5, .h5 { font-size: 18px; }
h6, .h6 { font-size: 14px; }

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    font-family: 'Quicksand', sans-serif;
    font-weight: 400;
    font-style: normal;
    line-height: normal;
    text-decoration: none;
    color: #444444;
}

h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover { color: #999999; }

p { margin: 0 0 30px 0; }
.faso-user-p { margin: 0; padding: 0; }
em { font-style: italic; }
strong, b { font-weight: 700; }
small, .txt-small { font-size: 85%; }
.txt-large { font-size: 120%; }

.text-center { text-align: center; }
.text-left, .text-left-center { text-align: left; }
.text-right, .text-right-center, .text-right-left { text-align: right; }
.uppercase { text-transform: uppercase; }

@font-face {
    font-family: 'boldbrush';
    src: url('//www.amandazirzow.com/styles/shared/fonts/boldbrush-webfont.eot');
    src: url('//www.amandazirzow.com/styles/shared/fonts/boldbrush-webfont.eot?#iefix') format('embedded-opentype'),
         url('//www.amandazirzow.com/styles/shared/fonts/boldbrush-webfont.woff2') format('woff2'),
         url('//www.amandazirzow.com/styles/shared/fonts/boldbrush-webfont.woff') format('woff'),
         url('//www.amandazirzow.com/styles/shared/fonts/boldbrush-webfont.ttf') format('truetype'),
         url('//www.amandazirzow.com/styles/shared/fonts/boldbrush-webfont.svg#new_fontregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

.fleur:before {
    content: 'F';
    font-family: 'boldbrush';
    font-size: 24px;
    font-style: normal;
    font-weight: normal;
    position: relative;
    top: 4px;
    left: 0;
    margin-right: 5px;
}

.fleur { color: #ED2024; }

.enso:before {
    content: 'B';
    font-family: 'boldbrush';
    font-size: 28px;
    font-style: normal;
    position: relative;
    top: 4px;
    left: 0;
    margin-right: 5px;
}

.dpw {
    position: relative;
    width: 35px;
    height: 16px;
    display: inline-block;
}

.dpw:before {
    content: 'D';
    font-family: 'boldbrush';
    font-size: 58px;
    font-style: normal;
    font-weight: normal;
    line-height: 0;
    position: absolute;
    top: 10px;
    left: 0;
}

.boldbrush {
    font-family: 'boldbrush';
    font-size: 28px !important;
    font-style: normal;
    position: relative;
    top: 2px;
    left: 0;
}

/* ==========================================================================
   Links
   ========================================================================== */

a {
    font-family: 'Quicksand', sans-serif;
    font-weight: 700;
    color: #000000;
    text-decoration: none;
    outline: 0;
    -webkit-transition: 0.2s color linear;
            transition: 0.2s color linear;
}

a:hover { color: #6E6E6E; }
a:hover, a:active, a:focus { outline: 0; }

/* ==========================================================================
   Lists
   ========================================================================== */

.inline-list, .social-list, .subnav, .artist-list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: inline-block;
}

.inline-list li {
    display: inline;
    margin: 0 10px;
}

.social-list li {
    float: left;
    margin: 0 10px;
}

.inline-list li:first-child, .social-list li:first-child, .subnav li:first-child {
    margin-left: 0px;
}

.inline-list li:last-child, .social-list li:last-child, .subnav li:last-child {
    margin-right: 0px;
}

.circle-list, .related-posts ul {
    margin: 0 0 30px;
    padding: 0;
    list-style: none;
}

.circle-list li, .related-posts ul li {
    position: relative;
    padding-left: 25px;
}

.circle-list li:before, .related-posts ul li:before {
    content: '\f10c';
    position: absolute;
    top: 3px;
    left: 2px;
    font-family: 'FontAwesome';
    font-size: 12px;
    line-height: 20px;
    width: 20px;
    height: 20px;
}

.subnav {
    margin-bottom: 25px;
}

.subnav li {
    display: inline;
    margin-right: 20px;
    position: relative;
}

.subnav li:after {
    content: "|";
    position: absolute;
    top: -4px;
    right: -15px;
}

.subnav li:last-child:after {
    content: "";
}

.artist-list li {
    margin-bottom: 10px;
}

.artist-list li a {
    font-size: 22px;
    font-weight: 400;
}

/* ==========================================================================
   Header
   ========================================================================== */

.header {
    width: 100%;
    background: #FFFFFF;
    border-bottom: 1px solid #E1E1E1;
    text-align: right;
    padding: 25px 0 40px;
}

.site-title {
    display: block;
    margin-bottom: 20px;
}

.site-title a {
    font-family: 'Quicksand', sans-serif;
    font-weight: 300;
    font-style: normal;
    font-size: 48px;
    line-height: normal;
    text-transform: lowercase;
    letter-spacing: 2px;
    color: #333333;
}

/* ==========================================================================
   Main Nav
   ========================================================================== */

/*** ESSENTIAL STYLES ***/

.sf-menu, .sf-menu * {
    margin: 0;
    padding: 0;
    list-style: none;
}

.sf-menu li {
    position: relative;
}

.sf-menu ul {
    position: absolute;
    display: none;
    top: 100%;
    /*left: 0;*/
    z-index: 99;
}

.sf-menu > li {
    display: inline-block;
}

.sf-menu li:hover > ul,
.sf-menu li.sfHover > ul {
    display: block;
}

.sf-menu a {
    display: block;
    position: relative;
}

.sf-menu ul ul {
    top: 0;
    left: 100%;
}

/*** SKIN ***/

.main-nav {
    position: relative;
    display: block;
    margin-right: 5px;
}

.sf-menu {
    position: relative;
}

.sf-menu ul {
    min-width: 10em; /* allow long menu items to determine submenu width */
    *width: 10em; /* no auto sub width for IE7, see white-space comment below */
    right: -15px;
    top: 30px;
    background: #FFFFFF;
    border: 1px solid #E1E1E1;
    padding-top: 6px;
    padding-bottom: 10px;
}

.sf-menu a {
    font-family: 'Quicksand', sans-serif;
    font-size: 16px;
    font-weight: 400;
    font-style: normal;
    text-transform: lowercase;
    color: #333333;
    text-decoration: none;
    display: inline-block;
    position: relative;
}

.sf-menu li {
    white-space: nowrap; /* no need for Supersubs plugin */
    *white-space: normal; /* ...unless you support IE7 (let it wrap) */
    -webkit-transition: background .2s;
            transition: background .2s;
}

.sf-menu > li {
    padding-left: 30px;
}

.sf-menu li:hover > a, .sf-menu li > a:hover {
    color: #999999;
}

.sf-menu li li a {
    font-size: 16px;
    padding-left: 15px;
    padding-right: 15px;
    color: #333333;
}

.sf-menu li li a:hover {
    color: #999999;
}

.sf-menu li li.selectednavlink a {
    font-weight: 700;
}

.sf-menu > .selectednavlink > a {
    font-weight: 700; !important;
}

.sf-menu ul .selectednavlink a {
    font-weight: 700; !important;
}

.sf-menu .emptynavlink {
    display: none !important;
    visibility: hidden;
}

/* ==========================================================================
   Mobile Nav
   ========================================================================== */

.overlay {
    display: none;
    position: fixed;
    top: 0;
    height: 100%;
    width: 100%;
    background: #F0F0F0;
    overflow: auto;
    z-index: 99999;
}

.nav-wrapper {
    text-align: left;
    width: 100%;
    padding-left: 25px;
    padding-right: 25px;
    position: relative;
}

.mobile-nav {
    padding: 25px 0px;
}

.mobile-nav ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.mobile-nav ul ul {
    margin-left: 40px;
}

.mobile-nav > ul > li {
    margin: 0 0 20px;
}

.mobile-nav ul li a {
    font-family: 'Quicksand', sans-serif;
    font-size: 24px;
    font-weight: 400;
    font-style: normal;
    color: #000000;
    text-transform: lowercase;
    text-decoration: none;
    letter-spacing: 1px;
    display: inline-block;
    padding-bottom: 5px;
}

.mobile-nav ul li a:hover {
    color: #6E6E6E    ;
}

.mobile-nav ul li li {
    position: relative;
}

.mobile-nav ul li li:before {
    content: '\f10c';
    position: absolute;
    top: 5px;
    left: -19px;
    font-family: 'FontAwesome';
    font-size: 12px;
    line-height: 20px;
    width: 20px;
    height: 20px;
}

.mobile-nav ul li li a {
    font-size: 18px;
}

.mobile-nav .selectednavlink > a {
    font-weight: 700;
}

.mobile-nav .emptynavlink {
    display: none !important;
    visibility: hidden;
}

.nav-wrapper .close {
    cursor: pointer;
    position: absolute;
    right: 25px;
    top: 25px;
}

.nav-wrapper .close i {
    font-size: 24px;
    color: #000000  ;
    -webkit-transition:0.2s color linear;
            transition:0.2s color linear;
}

.nav-wrapper .close i:hover {
    color: #6E6E6E    ;
}

.hamburger {
    display: none;
    cursor: pointer;
    font-family: 'Quicksand', sans-serif;
    font-size: 16px;
    font-weight: 400;
    color: #000000  ;
    text-transform: lowercase;
    letter-spacing: .5px;
    -webkit-transition: 0.2s all linear;
            transition: 0.2s all linear;
}

.hamburger:hover {
    color: #6E6E6E    ;
}

.hamburger i {
    font-size: 22px;
}

/* ==========================================================================
   Content
   ========================================================================== */

.content {
    width: 100%;
    padding-top: 50px;
    padding-bottom: 50px;
    background: #F0F0F0;
}

.page-title {
    text-align: right;
}

.page-title h1 {
    margin-bottom: 50px;
}

.spacer {
    padding-bottom: 50px;
}

.callout {
    padding: 30px 0;
    color: #444444    ;
    background: #999999;
    border-top: 1px solid #E1E1E1;
}

.callout a {
    font-weight: 400;
    font-size: 18px;
    text-transform: lowercase;
    letter-spacing: 2px;
    color: #444444    ;
}

/* ==========================================================================
   Gallery Artists
   ========================================================================== */
   
.gallery-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    grid-gap: 30px;
}

.artist-item {
    position: relative;
    text-align: left;
}

.artist-item a {
    text-decoration: none;
}

.artist-item a:hover, .artist-item a img:hover {
    opacity: 1;
}

.artist-item h2 {
    font-size: 18px;
    line-height: 20px;
    margin-bottom: 0px;
}

.artist-item img {
    margin-bottom: 15px;
    -webkit-filter: none;
            filter: none;
    -webkit-transition: 0.2s opacity linear;
            transition: 0.2s opacity linear;
}

.artist-image {
    position: absolute;
    top: 0;
    left: 0;
    margin-bottom: 0px;
    opacity: 0;
    -webkit-transition: 0.2s opacity linear;
            transition: 0.2s opacity linear;
}

.artist-item:hover .artist-image {
    opacity: 1;
}

/* ==========================================================================
   Footer
   ========================================================================== */

.footer {
    width: 100%;
    position: relative;
    font-size: 13px;
    color: #6E6E6E;
    padding: 25px 0;
    background: #F0F0F0;
    border-top: 1px solid #E1E1E1;
}

.footer a {
    color: #333333;
}

.footer a:hover {
    color: #999999;
}

.boldbrush-tagline {
    display: block;
}

/* ==========================================================================
   Blog
   ========================================================================== */

#blog-topical-nav, #blog-archive-nav {
    display: none;
}

.post-comment {
    margin-bottom: 10px;
    padding: 20px;
}

.post-comment .avatar {
    margin-right: 12px;
    float: left;
}

.post-comment .post-message {
    margin-bottom: 20px;
}

.post-comment .post-meta {
    font-size: 13px;
    line-height: normal;
    font-weight: bold;
}

.post-comment .post-body {
    overflow: hidden;
}

.post-message p:last-child {
    margin-bottom: 0px;
}

.blog-comment-odd {
    background: #F0F0F0;
}

.blog-comment-even {
    background: none;
}

.social-buttons {
    display: block;
    overflow: hidden;
    margin-bottom: 25px;
}

.social-buttons ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.social-buttons li {
    line-height: normal;
    margin: 0;
    float: left;
    padding: 6px 10px;
}

.social-buttons li a {
    font-size: 25px;
    line-height: normal;
}

.post-nav {
    list-style: none;
    margin: 0 0 25px;
    padding: 0;
    overflow: hidden;
    display: inline-block;
    font-size: 12px;
    text-transform: lowercase;
}

.post-nav li {
    float: left;
    margin-left: 10px;
    margin-right: 10px;
}

.social-helper {
    display: inline-block;
}

.share-buttons {
    width: 100%;
    text-align: center;
    margin-bottom: 25px;
}

.share-buttons table {
    margin: 0 auto;
}

.related-posts {
    margin-bottom: 50px;
}

.related-posts ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.related-posts ul li {
    margin-bottom: 10px;
}

.caption {
    display: inline-block;
    font-size: 14px;
    font-style: italic;
    margin-top: 10px;
}

.success_message {
    font: 14px/24px 'Quicksand', sans-serif !important;
    font-weight: 400 !important;
    padding: 20px;
    color: #444444;
    background-color: #999999 !important;
}

.success_message h2 {
    font-size: 20px !important;
}

.success_message .blog_comment {
    border-bottom: none !important;
}

.follow-link {
    text-align: left;
    margin-top: 10px;
}

.follow-link a, .follow-link i {
    font-size: 14px;
    text-decoration: none;
}

.follow-link i {
    margin-right: 5px;
}

.blog-topics {
    text-align: right;
}

.faso-sidebar-blog-topical, .faso-sidebar-blog-archives {
    position: relative;
    display: inline-block;
    padding: 0;
    margin: 0;
    border: none;
    width: 130px;
    overflow: hidden;
    background-color: #DDDDDD;
}

.faso-sidebar-blog-topical:after, .faso-sidebar-blog-archives:after {
    content: "\f107";
    font-family: 'FontAwesome';
    color: #444444;
    font-size: 16px;
    width: 25px;
    height: 25px;
    position: absolute;
    top: 1px;
    right: 7px;
    z-index: 5;
}

.faso-sidebar-blog-topical select, .faso-sidebar-blog-archives select {
    position: relative;
    display: inline-block;
    font-size: 13px;
    color: #444444;
    line-height: normal;
    padding: 5px 8px;
    width: 130px;
    cursor: pointer;
    border: none;
    z-index: 10;
    box-shadow: none;
    background-color: transparent;
    background-image: none;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    -webkit-border-radius: 0px;
            border-radius: 0;
}

/* ==========================================================================
   Buttons
   ========================================================================== */

.btn, button, input[type='submit'],
.bbav .bbav-button .btn {
    font-family: 'Quicksand', sans-serif;
    font-weight: 700;
    line-height: 18px;
    font-size: 14px;
    font-style: normal;
    text-align: center;
    text-decoration: none;
    text-transform: lowercase;
    color: #666666;
    display: inline-block;
    cursor: pointer;
    position: relative;
    background: #DDDDDD;
    border: 1px solid #DDDDDD;
    padding: 10px 50px;
    max-width: 100%;
    -webkit-transition: 0.2s all linear;
            transition: 0.2s all linear;
}

.btn:hover, button:hover, input[type='submit']:hover,
.bbav .bbav-button .btn:hover {
    color: #666666;
    background: #FFFFFF;
    border: 1px solid #FFFFFF;
}

/* ==========================================================================
   Pagination
   ========================================================================== */

.pagination {
    text-align: center;
    padding-bottom: 25px;
    clear: both;
}

.pagination ul {
    display: inline-block;
    margin: 0;
    padding: 0;
}

.pagination ul li {
    float: left;
    list-style: none;
}

.pagination ul li a {
    text-decoration: none;
    padding: 10px 15px;
    color: #333333;
}

.pagination ul li a.current {
    font-weight: 700;
    color: #333333 !important;
    background: #F0F0F0;
    border: 1px solid #F0F0F0;
}

/* ==========================================================================
   Forms
   ========================================================================== */

::-webkit-input-placeholder {
   color: #444444;
}

:-moz-placeholder { /* Firefox 18- */
   color: #444444;
}

::-moz-placeholder {  /* Firefox 19+ */
   color: #444444;
}

:-ms-input-placeholder {
   color: #444444;
}

textarea:focus, input:focus, button:focus, select:focus {
    outline: 0 !important;
}

input[type="text"], textarea {
    font: 16px/24px 'Quicksand', sans-serif;
    font-weight: 400;
    color: #444444;
    width: 100%;
    padding: 10px 15px;
    margin: 0;
    border: 1px solid #FFFFFF;
    background: #DDDDDD;

    -webkit-appearance: none;
    -webkit-border-radius: 0px;
    border-radius: 0;

    -webkit-transition:0.2s background linear;
            transition:0.2s background linear;
}

input[type="text"]:focus, textarea:focus {
    background: #DDDDDD;
}

input[type="text"] {
    height: 44px;
}

textarea {
    height: 235px;
}

input[type="submit"] {
    display: block;
    -webkit-appearance: none;
    -webkit-border-radius: 0px;
    border-radius: 0;

    input[type="submit"]::-moz-focus-inner {border:0;} /* ff specific stuff, yuck*/
    input[type="submit"]:focus {background:#DDDDDD;} /* change accordingly depending on your button bg color, this fixes the focus problem when using keyboard to move betweenform elements */
}

.select {
    color: black;
}

.form-item {
    margin-bottom: 25px;
}

.form-item label {
    text-transform: lowercase;
}

.form-item.error input, .form-item.error textarea {
    border: 1px solid #ff0000;
}

.form-item.error label {
    color: #ff0000;
}

.radio-group {
    display: block;
    margin-bottom: 20px;
}

input[type='radio'] {
    margin-right: 5px;
}

.alert {
    margin-bottom: 20px;
    display: block;
}

.alert label {
    color: #ff0000;
    display: block;
}

/*.signup-form {
    position: relative;
    display: inline-block;
    margin-bottom: 25px;
}

.signup-form input[type='text'] {
    width: 350px;
    margin-right: 5px;
    margin-bottom: 0px;
}

.signup-form .form-item {
    display: inline;
}*/

.signup-form {
    position: relative;
    display: none;
}

.signup-form h2 {
    font-size: 18px;
  display: block;
    margin-bottom: 10px;
}

.signup-form input[type='text'] {
    width: 250px;
    margin-right: 5px;
    margin-bottom: 10px;
}

.signup-form .form-item {
    margin-bottom: 0px;
    display: flex;
  flex-flow: row wrap;
  align-items: center;
}

.signup-form input[type='submit'] {
    padding: 12px 30px;
    margin-bottom: 10px;
}

.signup-form input[type='text'].error {
    border: 1px solid #ff0000;
}

.signup-form .alert label {
    font-size: 14px;
}

.signup-link {
    display: block;
    text-align: right;
}

.select-field {
    display: block;
    position: relative;
  overflow: hidden;
  font: 16px/24px 'Quicksand', sans-serif;
    font-weight: 400;
    color: #444444;
    width: 100%;
  margin: 0;
    border: 1px solid #FFFFFF;
    background: #DDDDDD;
    -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
    -webkit-border-radius: 0px;
                border-radius: 0px;
  width: 100%;
  height: 44px;
  cursor: pointer;
}

.select-field:after {
    content: "\f107";
    font-family: "FontAwesome";
    color: #444444;
  font-size: 16px;
  position: absolute;
  top: 10px;
  right: 15px;
  z-index: 1;
}

.select-field select {
    position: relative;
    display: inline-block;
    font: 16px/24px 'Quicksand', sans-serif;
    font-weight: 400;
    color: #444444;
  width: 100%;
  cursor: pointer;
  border: none;
    padding: 10px 15px;
    height: 42px;
  z-index: 2;
  box-shadow: none;
  background-color: transparent;
  background-image: none;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
    -webkit-border-radius: 0px;
                    border-radius: 0px;
}

.select-field select:focus {
    outline: 0 !important;
    border: none !important;
}

/* ==========================================================================
   Works
   ========================================================================== */

.work-nav {
    padding: 0;
    list-style: none;
    overflow: hidden;
    margin: 0 0 30px;
    font-size: 12px;
    text-transform: lowercase;
}

.work-nav li {
    float: left;
    width: 33.33333%;
    text-align: center;
}

.work-nav li:first-child {
    text-align: left;
}

.work-nav li:last-child {
    text-align: right;
}

.works-details span {
    display: block;
}

.works-details .works-price-currency-name {
    display: inline;
}

.price-boxes {
    text-align: center;
}

.price-boxes .box {
    display: inline-block;
    width: 49%;
    padding: 0 5px;
}

.price-boxes.faso-art-unframed-show, .price-boxes.faso-art-framed-show {
    margin-bottom: 30px;
}

.price-box {
    text-align: center;
    line-height: 22px;
    padding: 20px;
    background: #F0F0F0;
}

.price-box span {
    display: block;
}

.price-box span span {
    display: inline-block;
}

.price-box .note {
    font-weight: 700;
}

.price-box .shipping {
    font-size: 11px;
}

.price-box .cart-form {
    margin-top: 10px;
}

.price-box .cart-form input[type="submit"], .faso-workszoom-link-contact.btn, .user-cta .btn {
    font-size: 14px;
    font-weight: 700;
    text-align: center;
    padding: 10px 20px;
    color: #666666;
    background: #DDDDDD;
    max-width: 100%;
    -webkit-transition: 0.25s all linear;
            transition: 0.25s all linear;
}

.price-box .cart-form input[type="submit"]:hover, .faso-workszoom-link-contact.btn:hover, .user-cta .btn:hover {
    color: #666666;
    background: #FFFFFF;
}

.user-cta {
    margin-bottom: 30px;
}

.faso-workszoom-link-contact {
    display: inline-block;
    line-height: 22px;
}

/* ==========================================================================
   Works Thumbnails
   ========================================================================== */

figure.hover-effect {
    position: relative;
    overflow: hidden;
    margin: 0;
    cursor: pointer;
    z-index: auto;
    overflow: visible;
}

figure.hover-effect:before {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    width: 100%;
    height: 100%;
    content: '';
    -webkit-transition: opacity 0.35s;
    transition: opacity 0.35s;
}

figure.hover-effect:before {
    box-shadow: 0 3px 30px rgba(0,0,0,0.8);
    opacity: 0;
}

figure.hover-effect figcaption {
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
    z-index: 1;
}

figure.hover-effect figcaption::before,
figure.hover-effect figcaption::after {
    pointer-events: none;
}

figure.hover-effect figcaption h2 { font-size: 20px; }

figure.hover-effect img {
    position: relative;
    display: block;
    max-width: 100%;
    margin-bottom: 10px;
    opacity: 1;
    -webkit-transition: -webkit-transform 0.35s;
            transition: transform 0.35s;
    -webkit-transform: perspective(1000px) translate3d(0,0,0);
            transform: perspective(1000px) translate3d(0,0,0);
}

figure.hover-effect:hover:before {
    opacity: 1;
}

figure.hover-effect:hover img {
    -webkit-transform: perspective(1000px) translate3d(0,0,21px);
            transform: perspective(1000px) translate3d(0,0,21px);
}

/* ==========================================================================
   Blockquotes
   ========================================================================== */

blockquote {
    margin: 0 0 50px;
}

blockquote p {
    font-family: 'Quicksand', sans-serif;
    font-weight: 400;
    font-style: italic;
    font-size: 20px;
    line-height: 28px;
    margin-bottom: 25px !important;
}

blockquote cite {
    font-family: 'Quicksand', sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: 14px;
    line-height: 18px;
    text-align: right;
    display: block;
}

/* ==========================================================================
   Grid
   ========================================================================== */

.row {
    max-width: 1170px;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
}

.row .row {
    width: auto;
    margin: 0 -15px !important;
}

*[class*='col-'] {
    float: left;
    padding: 0 15px;
    position: relative;
    overflow: hidden;
}

.col-1-1 { width: 100%; float: none; }
.col-1-2 { width: 50%; }
.col-1-3 { width: 33.33333%; }
.col-2-3 { width: 66.66666%; }
.col-1-4 { width: 25%; }
.col-3-4 { width: 75%; }
.col-1-5 { width: 20%; }
.col-2-5 { width: 40%; }
.col-3-5 { width: 60%; }
.col-4-5 { width: 80%; }

.cell { padding: 25px; position: relative; }
.centered { margin: 0 auto; position: relative; float: none; }

.grid { overflow: hidden; margin: 0; padding: 0; list-style: none; }
.grid-item { padding: 15px; margin: 0; float: left; }
.grid-item img { width: 100%; }
.grid-item h2 { font-size: 20px; }
.grid-item a small {
    font-weight: 400;
}

.flex-grid {
    display: flex;
    flex-flow: row wrap;
}

.flex-item {
    flex-basis: 25%;
    padding: 15px;
}

.row-grid {
    width: 100%;
    overflow: hidden;
}

.row-item {
    float: left;
    margin-bottom: 10px;
    position: relative;
}

.contained {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 30px;
}

.square-item {
    position: relative;
    overflow: hidden;
    background: #F0F0F0;
}

.square-item::before {
    content: '';
    display: block;
    padding-top: 100%;
}

.square-item .hover-effect {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    margin-bottom: 0;
}

.square-item .hover-effect img {
    max-width: 100%;
    max-height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

.square-item .works-info, .row-item .works-info {
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 9;
    padding: 15px;
    margin: 0;
    opacity: 0;
    background: #F0F0F0;
    -webkit-transition: .2s opacity linear;
            transition: .2s opacity linear;
}

.square-item:hover .works-info, .row-item:hover .works-info {
    opacity: 1;
}

.row-item figure.hover-effect:hover img, .square-item figure.hover-effect:hover img {
    -webkit-transform: none;
            transform: none;
}

/* ==========================================================================
   lightGallery Overrides
   ========================================================================== */

@font-face {
  font-family: 'lg';
  src: url("//www.amandazirzow.com/styles/shared/fonts/lg.eot?n1z373");
  src: url("//www.amandazirzow.com/styles/shared/fonts/lg.eot?#iefixn1z373") format("embedded-opentype"), url("//www.amandazirzow.com/styles/shared/fonts/lg.woff?n1z373") format("woff"), url("//www.amandazirzow.com/styles/shared/fonts/lg.ttf?n1z373") format("truetype"), url("//www.amandazirzow.com/styles/shared/fonts/lg.svg?n1z373#lg") format("svg");
  font-weight: normal;
  font-style: normal;
}

.lg-sub-html {
    font-family: 'Quicksand', sans-serif;
    font-weight: 400;
    color: #fff;
    font-size: 16px;
    width: 100%;
    white-space: normal;
    padding: 10px 50px;
    background-color: #202020;
    background-color: rgba(0, 0, 0, 0.85);
}

.lg-sub-html a {
    color: #fff;
    text-decoration: underline;
}

.lg-sub-html a:hover {
    color: #fff;
}

.lg-outer .lg-thumb-item {
    border-radius: 0px;
}

#lg-counter {
    padding-left: 50px;
}

#lg-counter:before {
    content: 'F';
    font-family: 'boldbrush';
    font-size: 24px;
    font-style: normal;
    position: absolute;
    top: 12px;
    left: 20px;
}

/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Hide visually and from screen readers:
 */

.hidden {
    display: none !important;
}

/*
 * Hide only visually, but have it available for screen readers:
 * http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element
 * to be focusable when navigated to via the keyboard:
 * https://www.drupal.org/node/897638
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screen readers, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/* ==========================================================================
   workszoom/worksdetail
   ========================================================================== */
#artwork-viewer {
    display: block;
    margin: 0 auto 25px auto;
}
#artwork-viewer.portrait .faso-workszoom-data-image,
#artwork-viewer.landscape .faso-workszoom-data-image {
    width: 100%;
    display: block;
}
#artwork-viewer.portrait{
    max-width: 500px;
}
#artwork-viewer.landscape {
    max-width: 750px;
}
#artwork-viewer .lazyload,
#artwork-viewer .lazyloading,
#artwork-viewer .lazyloaded {
    transition: opacity 300ms linear;
}
#artwork-viewer .lazyload {
    opacity: 0.5;
    -webkit-filter: blur(5px);
    filter: blur(5px);
}
#artwork-viewer .lazyloading,
#artwork-viewer .lazyloaded {
    opacity: 1;
}

/* ==========================================================================
   Videos
   ========================================================================== */
   
.video-grid {
    margin: 0 -10px;
}

.isotope-item {
    position: relative;
    float: left;
    width: 25%;
    padding: 0 10px 50px;
}

.videos {
    min-width: 0;
}

.video-image {
    position: relative;
    margin-bottom: 10px;
    background: #000;
}

.video-meta {
    font-size: 13px;
    line-height: 20px;
}

.video-title {
    font-size: 20px;
    line-height: 20px;
    margin-bottom: 5px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.video-length {
    position: absolute;
    bottom: 5px;
    right: 5px;
    font-size: 12px;
    font-weight: 700;
    line-height: normal;
    color: #fff;
    background: #000;
    padding: 2px 3px 1px;
    border-radius: 2px;
    z-index: 2;
}

.video-buy-btn {
    display: none;
}

.faso-video-paid-hide { display:none; }

/* ==========================================================================
   Filter
   ========================================================================== */

.filters {
    display: flex;
}

.filters > div {
    flex: 1;
}

.filter {
    display: inline-block;
}

.filter ul {
    list-style: none;
    padding: 0;
    margin: 0;
    
}

.filter ul li {
    float: left;
    position: relative;
    padding-right: 25px;
}

.filter > ul > li {
    margin-right: 30px;
    cursor: pointer;
    color: #000000;
    -webkit-transition: 0.2s color linear;
                    transition: 0.2s color linear;
}

.filter > ul > li:hover {
    color: #6E6E6E;
}

.filter > ul > li:after {
    content: "\f107";
    font-family: "FontAwesome";
    font-size: 20px;
    color: #000000;
    position: absolute;
    top: 0px;
    right: 0px;
}

.filter ul li:first-child {
    margin-left: 0px;
}

.filter ul li:last-child {
    margin-right: 0px;
}

.filter ul ul {
    display: none;
    position: absolute;
    top: 25px;
    left: 50%;
    -webkit-transform: translateX(-50%);
       -moz-transform: translateX(-50%);
                    transform: translateX(-50%);
    margin: 0;
    padding: 20px;
    background: #F0F0F0;
    text-align: left;
    min-width: 18em; /* allow long menu items to determine submenu width */
    *width: 18em; /* no auto sub width for IE7, see white-space comment below */
    z-index: 999;
    -webkit-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.1);
     -moz-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.1);
                    box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.1);
}

.filter ul ul li {
    float: none;
    margin: 0;
    padding: 0 0 8px;
}

.filter ul ul li:last-child {
    padding-bottom: 0px;
}

.filter ul ul li:after {
    content: '';
}

.filter ul ul li a {
    display: block;
    font-weight: 400;
    color: #000000;
    text-transform: none;
    -webkit-transition: 0.2s color linear;
                    transition: 0.2s color linear;
}

.filter ul ul li a:hover, .filter a.selected {
    color: #6E6E6E;
}

.filter hr {
    margin: 5px 0;
}

.isotope-reset {
    text-align: right;
    color: #000000;
    display: inline-block;
    cursor: pointer;
    -webkit-transition: 0.2s color linear;
            transition: 0.2s color linear;
}

.isotope-reset:hover {
    color: #6E6E6E;
}

.filter-container {
    text-align: center;
}

/* ==========================================================================
   Media Queries
   ========================================================================== */

@media only screen and (min-width : 993px) {

    .grid-item {
        width: 33.33333%;
    }

    .grid-item-2 {
        width: 50%;
    }

    .grid-item-4 {
        width: 25%;
    }
    
    .flex-item {
        flex-basis: 33.33333%;
    }

}

@media only screen and (max-width : 992px) {

    .grid-item {
        width: 33.33333%;
    }

    .grid-item-4 {
        width: 25%;
    }
    
    .flex-item {
        flex-basis: 33.33333%;
    }
    
    .gallery-grid {
        grid-template-columns: 1fr 1fr 1fr 1fr;
    }
    
    .isotope-item {
        width: 33.33333%;
    }

}

@media only screen and (max-width : 850px) {

    .main-nav ul {
        display: none;
    }

    .hamburger {
        display: inline-block;
        margin-right: 5px;
    }

}

@media only screen and (max-width : 768px) {

    .grid-item {
        width: 50%;
    }
    
    .flex-item {
        flex-basis: 50%;
    }
    
    .contained {
        grid-template-columns: 1fr 1fr;
    }
    
    .gallery-grid {
        grid-template-columns: 1fr 1fr 1fr;
    }
    
    .isotope-item {
        width: 50%;
    }
    
    .filters {
        flex-direction: column;
    }
    
    .filter > ul > li {
        margin-right: 10px;
        margin-left: 5px;
    }
    
    .isotope-reset, .filter-display {
        text-align: center;
    }
    
    .filter-container {
        order: 1;
        margin-bottom: 15px;
    }
    
    .filter-display {
        order: 2;
    }
    
    .isotope-reset {
        order: 3;
    }

}

@media only screen and (max-width: 640px) {

    *[class*='col-'] {
        float: none;
        width: 100%;
    }

    .text-right-center, .text-left-center {
        text-align: center;
    }

    .text-right-left {
        text-align: left;
    }

    .margin-bottom-mobile { margin-bottom: 15px !important; }

    .footer .newsletter h2 {
        padding-top: 0px;
    }

    blockquote {
        margin-left: 0px;
    }

    .module {
        margin-bottom: 30px;
    }

    .page-title {
        text-align: left;
    }

    .social {
        position: static;
        margin-right: 5px;
    }

    .header {
        text-align: center;

        padding: 15px 0 25px;
    }

    .site-title {
        margin-bottom: 10px;
    }

    .follow-link {
        text-align: center;
    }

    .blog-topics {
        text-align: center;
    }
    
    .gallery-grid {
        grid-template-columns: 1fr 1fr;
    }
    
    .signup-form h2, .signup-form .alert label {
        text-align: center;
    }
    
    .signup-form input[type='text'] {
        width: 100%;
        margin-right: 0px;
    }
    
    .signup-form .form-item {
        justify-content: center;
    }
    
    .signup-link {
        text-align: center;
    }
    
    .signup-link i {
        display: block;
        text-align: center;
    }

}

@media only screen and (max-width : 480px) {

    .grid-item {
        width: 100%;
    }

    .btn, input[type='submit'] {
        width: 100%;
    }
    
    .flex-item {
        flex-basis: 100%;
    }
    
    .contained, .gallery-grid {
        grid-template-columns: 1fr;
    }
    
    .price-boxes .box {
        display: block;
        width: 100%;
        padding: 0;
        margin-bottom: 10px;
    }
    
    .isotope-item {
        width: 100%;
    }

}

@media screen and (min-width: 400px) {

    img.faso-about-image-biopicture1, img.faso-about-image-biopicture2 {
        max-width: 350px;
    }

}

/* ==========================================================================
   Print styles.
   Inlined to avoid the additional HTTP request:
   http://www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */

@media print {
    *,
    *:before,
    *:after {
        background: transparent !important;
        color: #000 !important; /* Black prints faster:
                                   http://www.sanbeiji.com/archives/953 */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links that are fragment identifiers,
     * or use the `javascript:` pseudo protocol
     */

    a[href^="#"]:after,
    a[href^="javascript:"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    /*
     * Printing Tables:
     * http://css-discuss.incutio.com/wiki/Printing_Tables
     */

    thead {
        display: table-header-group;
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}

.artistContent {
  overflow: visible;
}

.slider {
    height: 100%;
    margin-bottom: 30px;
}
.slideshow {
    height: 500px;
}
.slideshow .slick-list, .slideshow .slick-track {
    height: 100%;
}
.image img{
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center center !important;
    border: none;
}
.image--cover img{
    -webkit-background-size: cover !important;
    -moz-background-size: cover !important;
    -o-background-size: cover !important;
    background-size: cover !important;
}
.image--contain img{
    -webkit-background-size: contain !important;
    -moz-background-size: contain !important;
    -o-background-size: contain !important;
    background-size: contain !important;
}
.image--cover.image--valign-top img{
    background-position: center top !important;
}
.slider .slick-prev, .slider .slick-next{
  z-index: 1;
  top: 50%;
}
.slider .slick-prev:hover, .slider .slick-next:hover {
    border: none;
}
.slider .slick-prev:hover:before, .slider .slick-next:hover:before {
    color: #000;
}
.slider .slick-prev:before {
  content: '\f104';
}
.slider .slick-next:before {
  content: '\f105';
}
.slider .slick-prev:before,
.slider .slick-next:before
{
  font-family: 'FontAwesome';
  font-size: 40px;
  color: #262626;
}
.slick-dots {
    bottom: unset;
}
@media screen and (max-width: 736px) {
    .slideshow {
        height: 300px;
    }
}
@media screen and (max-width: 768px) {
  .artistContent {
    padding: 0 25px;
  }
}

/* ==========================================================================
   Social media icons (v2 component)
   ========================================================================== */

.social-icons-wrapper {
    margin-bottom: 20px;
    text-align: left;
    position: absolute;
    top: -15px;
    left: 15px;
}

.social-media-icons__list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    padding: 0;
    list-style: none;
    margin: 0;
}

.social-media-icons__item {
    flex: 0 0 auto;
}

.social-media-icons__link {
    line-height: normal;
    color: #333333;
}

.social-media-icons__link:hover {
    color: #999999;
}

.social-media-icons__svg {
    display: inline-block;
    width: 20px;
    height: 20px;
    vertical-align: middle;
}/* =========================================================
   ZIRZOW GALLERY — FULL CUSTOM CSS
   COMPLETE CLEAN REWRITE
   ---------------------------------------------------------
   PURPOSE
   1) Hide unwanted FASO defaults/branding
   2) Refine header, logo, navigation, and page width
   3) Preserve natural capitalization
   4) Style contact form buttons
   5) Control About page layout
   6) Create a larger works / collections grid
   7) Customize LightGallery branding/captions
   8) Refine article detail and collector guide pages
   9) Move social icons into footer and center on mobile
   10) Fix blog listing and single post layouts
   11) Refine artwork/product detail pages
   12) Make the homepage slider full-width safely
   ========================================================= */



/* =========================================================
   1) HIDE FASO BRANDING / EXTRA DEFAULT ELEMENTS
   ========================================================= */

/* Hide FASO footer branding */
.faso-bug a,
.faso-tagline,
.tagline {
  display: none !important;
}

/* Hide injected homepage heading block if FASO outputs one */
.faso-main-data-mainpageheading {
  display: none !important;
}

/* Hide About page title area only on About page */
body:has(.selectednavlink a[href*="/about"]) .page-title,
body.about .page-title,
body.about .page-title h1 {
  display: none !important;
}

/* Hide duplicate first selected nav item if FASO outputs one */
.selectednavlink:first-child {
  display: none !important;
}



/* =========================================================
   2) TYPOGRAPHY NORMALIZATION
   ========================================================= */

/* Preserve typed capitalization everywhere */
body,
h1, h2, h3, h4, h5, h6,
p, a, li, span, div,
label, input, textarea, button {
  text-transform: none !important;
}

/* Keep headings left aligned by default */
h1, h2, h3, h4, h5, h6 {
  text-align: left !important;
}



/* =========================================================
   3) GLOBAL CONTENT WIDTH / SPACING
   ========================================================= */

.content {
  max-width: 1360px !important;
  margin: 0 auto !important;
  padding: 0 40px !important;
  box-sizing: border-box !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
}

@media (max-width: 768px) {
  .content {
    padding: 0 24px !important;
  }
}



/* =========================================================
   4) HEADER / LOGO / NAVIGATION
   ========================================================= */

/* Logo image cleanup */
.faso-image-logo-url {
  border: none !important;
  box-shadow: none !important;
  max-width: 320px !important;
  width: auto !important;
  height: auto !important;
  display: block !important;
}

/* Logo container */
.site-title {
  text-align: left !important;
  margin: 0 !important;
  padding: 0 !important;
}

.site-title a {
  display: inline-block !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Base header row alignment */
.faso-header .row {
  justify-content: flex-start !important;
}

/* Desktop header layout */
@media (min-width: 769px) {
  .faso-header .row {
    display: flex !important;
    align-items: flex-end !important;
    justify-content: space-between !important;
  }

  .faso-header,
  .faso-header .row,
  .faso-header .col-1-1,
  .site-title,
  .main-nav,
  .main-nav.faso-nav {
    min-height: 0 !important;
    height: auto !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 6px !important;
    position: static !important;
    top: auto !important;
  }

  .main-nav {
    margin: 0 !important;
    padding-bottom: 8px !important;
  }

  .faso-main-data-mainpageheading,
  .faso-main-data-mainpagetext {
    padding-top: 16px !important;
  }

  /* Slight visual drop for logo */
  .faso-image-logo-url {
    position: relative !important;
    top: 40px !important;
  }
}

/* Mobile header alignment */
@media (max-width: 768px) {
  .site-title,
  header .col-1-1 {
    text-align: center !important;
  }

  .site-title a {
    display: inline-block !important;
    margin: 0 auto !important;
  }

  .faso-image-logo-url {
    max-width: 340px !important;
    top: 0 !important;
  }
}



/* =========================================================
   5) CONTACT FORM BUTTON
   ========================================================= */

input.faso-contact-input-submit {
  background-color: transparent !important;
  border: 1px solid #8a7a6a !important;
  color: #5d5147 !important;
  padding: 14px 34px !important;
  min-width: 140px !important;
  font-size: 16px !important;
  letter-spacing: 0.03em !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition:
    background-color 0.25s ease,
    color 0.25s ease,
    border-color 0.25s ease !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

input.faso-contact-input-submit:hover,
input.faso-contact-input-submit:focus {
  background-color: #1f3b63 !important;
  border-color: #1f3b63 !important;
  color: #ffffff !important;
  opacity: 1 !important;
}



/* =========================================================
   6) ABOUT PAGE LAYOUT
   Scoped only to About
   ========================================================= */

.row.faso-about-section-about .col-2-3.centered {
  width: 92% !important;
  max-width: 1180px !important;
  margin-left: 4vw !important;
  margin-right: 4vw !important;
  text-align: left !important;
  display: block !important;
}

/* Float first centered paragraph block left so image sits beside text */
.faso-about-section-about p.text-center:first-of-type {
  float: left !important;
  width: 320px !important;
  margin: 0 60px 25px 0 !important;
  text-align: left !important;
}

/* About image */
.faso-about-section-about .faso-about-image-biopicture1 {
  display: block !important;
  width: 320px !important;
  max-width: 320px !important;
  height: auto !important;
  margin: 0 !important;
}

/* Push text content beside image */
.faso-about-section-about .faso-about-data-bioheading,
.faso-about-section-about .faso-about-data-biotagline,
.faso-about-section-about .faso-about-section-bio {
  margin-left: 380px !important;
  margin-right: 0 !important;
  max-width: 960px !important;
  text-align: left !important;
}

.faso-about-section-about .faso-about-data-bioheading {
  margin-top: 6px !important;
  margin-bottom: 18px !important;
  line-height: 1.2 !important;
}

.faso-about-section-about .faso-about-data-biotagline {
  margin-bottom: 22px !important;
  line-height: 1.5 !important;
}

.faso-about-section-about .faso-about-section-bio {
  line-height: 1.75 !important;
}

.row.faso-about-section-about p:not(.text-center) {
  text-align: left !important;
}

.faso-about-section-about .faso-about-section-bio::after {
  content: "";
  display: block;
  clear: both;
}

@media (max-width: 900px) {
  .row.faso-about-section-about .col-2-3.centered {
    width: 94% !important;
    max-width: none !important;
  }

  .faso-about-section-about p.text-center:first-of-type {
    float: none !important;
    width: 100% !important;
    margin: 0 0 20px 0 !important;
  }

  .faso-about-section-about .faso-about-image-biopicture1 {
    width: min(380px, 100%) !important;
    max-width: 100% !important;
    margin: 0 auto !important;
  }

  .faso-about-section-about .faso-about-data-bioheading,
  .faso-about-section-about .faso-about-data-biotagline,
  .faso-about-section-about .faso-about-section-bio {
    margin-left: 0 !important;
    max-width: 100% !important;
  }
}



/* =========================================================
   7) WORKS / COLLECTIONS GRID
   ========================================================= */

.row:has(.faso-collections-section-collection) .col-2-3.centered {
  width: 100% !important;
  max-width: 1320px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 42px !important;
  align-items: start !important;
}

.row:has(.faso-collections-section-collection) .faso-collections-section-collection {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  position: relative !important;
}

.row:has(.faso-collections-section-collection) .faso-collections-section-collection > a {
  display: block !important;
  position: relative !important;
  overflow: hidden !important;
  margin: 0 !important;
}

.row:has(.faso-collections-section-collection) .faso-collections-image-collectionpicture {
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
  min-height: 360px !important;
  object-fit: cover !important;
  display: block !important;
  margin: 0 !important;
  transition: transform 0.25s ease !important;
}

/* Hide collection descriptions in grid */
.row:has(.faso-collections-section-collection) .faso-collections-data-collectiondescription,
.row:has(.faso-collections-section-collection) .faso-collections-data-collectiondescription p,
.row:has(.faso-collections-section-collection) .faso-user-p {
  display: none !important;
}

/* Always show collection title below image */
.row:has(.faso-collections-section-collection) .faso-collections-collectionname {
  position: static !important;
  display: block !important;
  margin: 14px 0 0 0 !important;
  padding: 0 !important;
  font-size: 1.08rem !important;
  line-height: 1.3 !important;
  font-weight: 400 !important;
  background: none !important;
  color: inherit !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  text-shadow: none !important;
  pointer-events: auto !important;
}

.row:has(.faso-collections-section-collection) .faso-collections-collectionname a {
  display: inline-block !important;
  color: inherit !important;
  text-decoration: none !important;
  font-weight: 400 !important;
  transition: font-weight 0.2s ease, opacity 0.2s ease !important;
}

.row:has(.faso-collections-section-collection) .faso-collections-section-collection:hover .faso-collections-collectionname a {
  font-weight: 700 !important;
  opacity: 1 !important;
}

.row:has(.faso-collections-section-collection) .faso-collections-section-collection:hover .faso-collections-image-collectionpicture {
  transform: scale(1.01) !important;
}

@media (max-width: 1024px) {
  .row:has(.faso-collections-section-collection) .col-2-3.centered {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 32px !important;
  }

  .row:has(.faso-collections-section-collection) .faso-collections-image-collectionpicture {
    min-height: 320px !important;
  }
}

@media (max-width: 680px) {
  .row:has(.faso-collections-section-collection) .col-2-3.centered {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  .row:has(.faso-collections-section-collection) .faso-collections-image-collectionpicture {
    min-height: 260px !important;
  }
}

/* Hide archived works button */
a.btn.faso-works-link-archived-works {
  display: none !important;
}



/* =========================================================
   8) PORTFOLIO VIEWER (LIGHTGALLERY)
   ========================================================= */

.lg-outer #lg-counter::before {
  content: none !important;
  display: none !important;
  background: none !important;
  background-image: none !important;
}

.lg-outer #lg-counter {
  position: relative !important;
  padding-left: 120px !important;
}

.lg-outer #lg-counter::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  left: 6px !important;
  top: 60% !important;
  transform: translateY(-50%) !important;
  width: 100px !important;
  height: 100px !important;
  background: url("https://faso.artfulcdn.com/123759/6475304m.png") center center / contain no-repeat !important;
}



/* =========================================================
   9) ARTICLE DETAIL PAGE
   ========================================================= */

.faso-articledetail-section-articledetail .faso-articledetail-data-article-text .grid {
  position: static !important;
  height: auto !important;
  display: grid !important;
  gap: 24px !important;
}

.faso-articledetail-section-articledetail .faso-articledetail-data-article-text .grid > * {
  position: relative !important;
  top: auto !important;
  left: auto !important;
}

.faso-articledetail-section-articledetail .col-1-3.text-right-left {
  display: none !important;
}

.faso-articledetail-section-articledetail .col-2-3 {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
  margin: 0 !important;
  float: none !important;
}



/* =========================================================
   10) SOCIAL ICONS IN FOOTER
   ========================================================= */

footer.faso-footer {
  position: relative !important;
}

/* Do not position icons in header */
header .social-icons-wrapper {
  position: static !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  transform: none !important;
}

/* Position social icons in footer */
.social-icons-wrapper {
  position: absolute !important;
  left: 0 !important;
  bottom: 28px !important;
  top: auto !important;
  right: auto !important;
  transform: none !important;
  margin: 0 !important;
  padding: 0 !important;
  z-index: 20 !important;
  width: auto !important;
}

.social-media-icons__list {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.social-media-icons__item {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.social-media-icons__link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
}

.social-media-icons__link:hover {
  opacity: 0.8 !important;
}

/* Center icons on mobile */
@media only screen and (max-width: 768px) {
  .social-icons-wrapper {
    position: static !important;
    width: 100% !important;
    margin: 16px 0 0 0 !important;
    text-align: center !important;
  }

  ul.social-media-icons__list {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    width: 100% !important;
    padding-left: 0 !important;
  }

  .social-media-icons__item {
    display: inline-flex !important;
    margin: 0 8px !important;
  }
}



/* =========================================================
   11) COLLECTOR GUIDE / ARTICLE LISTING PAGE
   ========================================================= */

.content h1 {
  font-size: 48px !important;
  line-height: 1.1 !important;
  margin: 0 0 42px 0 !important;
}

.faso-articles-section-article {
  padding: 34px 0 !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
}

.faso-articles-section-article hr {
  display: none !important;
}

.faso-articles-section-article .row,
.faso-articles-section-article .col-1-1,
.faso-articles-section-article .col-1-2 {
  box-sizing: border-box !important;
}

/* Full-width title row */
.faso-articles-section-article > .row:first-child .col-1-2 {
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Hide empty spacer column in second row */
.faso-articles-section-article > .row:nth-child(2) > .col-1-2:first-child {
  display: none !important;
}

/* Excerpt + button row */
.faso-articles-section-article > .row:nth-child(2) > .col-1-2:last-child {
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 28px !important;
}

.faso-articles-section-article h2 {
  margin: 0 0 14px 0 !important;
}

.faso-articles-link-article,
.faso-articles-section-article h2 a {
  display: inline-block !important;
  font-size: 28px !important;
  line-height: 1.25 !important;
  font-weight: 400 !important;
  text-decoration: none !important;
}

.faso-articles-section-article .margin-bottom {
  flex: 1 1 auto !important;
  margin: 0 !important;
  font-size: 16px !important;
  line-height: 1.8 !important;
  text-align: left !important;
  min-width: 0 !important;
}

.faso-articles-section-article a.btn,
.faso-articles-section-article a.btn:link,
.faso-articles-section-article a.btn:visited {
  flex: 0 0 auto !important;
  display: inline-block !important;
  margin: 0 !important;
  padding: 14px 30px !important;
  white-space: nowrap !important;
  line-height: 1 !important;
  font-size: 15px !important;
  text-decoration: none !important;
  border: none !important;
  box-shadow: none !important;
  background: #e9e7e2 !important;
  color: #6b6b6b !important;
  transition: background 0.25s ease, color 0.25s ease !important;
}

.faso-articles-section-article a.btn:hover,
.faso-articles-section-article a.btn:focus,
.faso-articles-section-article a.btn:active {
  background: #d6d2c8 !important;
  color: #222 !important;
  text-decoration: none !important;
}

.faso-articles-section-article .margin-bottom-mobile {
  margin-bottom: 0 !important;
}

@media only screen and (max-width: 768px) {
  .content h1 {
    font-size: 38px !important;
    margin-bottom: 28px !important;
  }

  .faso-articles-section-article {
    padding: 26px 0 !important;
  }

  .faso-articles-link-article,
  .faso-articles-section-article h2 a {
    font-size: 24px !important;
  }

  .faso-articles-section-article > .row:nth-child(2) > .col-1-2:last-child {
    display: block !important;
  }

  .faso-articles-section-article .margin-bottom {
    margin: 0 0 16px 0 !important;
  }

  .faso-articles-section-article a.btn,
  .faso-articles-section-article a.btn:link,
  .faso-articles-section-article a.btn:visited {
    display: inline-block !important;
  }
}



/* =========================================================
   12) BLOG — SINGLE POST PAGE
   ========================================================= */

/* Make single post title row full width */
.content .faso-blog-post > .row:first-of-type {
  display: block !important;
}

.content .faso-blog-post > .row:first-of-type > .col-1-3.text-right-left {
  float: none !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 18px 0 !important;
}

/* Single post title styling */
.content .faso-blog-post h2.faso-blog-data-entry-title {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  font-size: 32px !important;
  line-height: 1.2 !important;
  text-align: left !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.10) !important;
}

/* Two-column single post layout */
.content .faso-blog-post > .row:nth-of-type(2) {
  display: block !important;
}

.content .faso-blog-post > .row:nth-of-type(2) > .col-1-3.text-right-left {
  float: left !important;
  display: block !important;
  width: 33.333% !important;
  max-width: 33.333% !important;
}

.content .faso-blog-post > .row:nth-of-type(2) > .col-2-3 {
  float: left !important;
  display: block !important;
  width: 66.666% !important;
  max-width: 66.666% !important;
}

/* Single post image sizing */
.content .faso-blog-post .faso-blogfront-section-image,
.content .faso-blog-post img.faso-blogfront-section-image,
.content .faso-blog-post img {
  width: 100% !important;
  max-width: 300px !important;
  height: auto !important;
  display: block !important;
}

/* Normalize text wrapper */
.content .faso-blog-post .faso-blog-data-entry-text {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: visible !important;
}

.content .faso-blog-post .faso-blog-data-entry-text p {
  display: block !important;
  width: 100% !important;
  margin-top: 0 !important;
}

/* Clear floats */
.content .faso-blog-post > .row:nth-of-type(2)::after {
  content: "" !important;
  display: table !important;
  clear: both !important;
}



/* =========================================================
   13) BLOG — MAIN LISTING PAGE
   COMPLETE FIX
   ---------------------------------------------------------
   The old issue was that FASO still let the left column behave
   too wide because of its byline paragraph and image wrapper.
   This section uses an explicit CSS GRID layout for row 2 and
   resets the byline/image wrappers so the right text column
   starts much closer to the image.
   ========================================================= */

/* Title row full width */
.content .faso-blogfront-section-post > .row:first-of-type {
  display: block !important;
}

.content .faso-blogfront-section-post > .row:first-of-type > .col-1-2.text-right-left,
.content .faso-blogfront-section-post > .row:first-of-type > .col-1-2 {
  float: none !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 14px 0 !important;
  padding: 0 !important;
}

/* Listing title */
.content .faso-blogfront-data-entry-title {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  font-size: 30px !important;
  line-height: 1.2 !important;
  text-align: left !important;
}

.content .faso-blogfront-data-entry-title a {
  display: inline !important;
}

/* SECOND ROW:
   Use grid instead of flex so FASO column widths cannot fight us */
.content .faso-blogfront-section-post > .row:nth-of-type(2) {
  display: grid !important;
  grid-template-columns: 300px minmax(0, 1fr) !important; /* hard image column + fluid text column */
  column-gap: 26px !important;
  align-items: start !important;
}

/* LEFT COLUMN:
   Force left side to exact image-width behavior */
.content .faso-blogfront-section-post > .row:nth-of-type(2) > .col-1-2.text-right-left {
  float: none !important;
  width: 300px !important;
  max-width: 300px !important;
  min-width: 300px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  box-sizing: border-box !important;
}

/* Reset byline so it does not stretch the column */
.content .faso-blogfront-section-post .faso-blogfront-section-byline,
.content .faso-blogfront-section-post p.small.faso-blogfront-section-byline {
  display: block !important;
  width: 100% !important;
  max-width: 300px !important;
  margin: 0 0 10px 0 !important;
  padding: 0 !important;
  text-align: left !important;
  box-sizing: border-box !important;
}

/* Reset the paragraph wrapper around the image */
.content .faso-blogfront-section-post > .row:nth-of-type(2) > .col-1-2.text-right-left > p {
  width: 100% !important;
  max-width: 300px !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Preview image */
.content .faso-blogfront-section-post .faso-blogfront-section-image {
  display: block !important;
  width: 300px !important;
  max-width: 300px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* RIGHT COLUMN:
   Remove every inherited offset/padding/margin */
.content .faso-blogfront-section-post > .row:nth-of-type(2) > .col-1-2:not(.text-right-left) {
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  box-sizing: border-box !important;
}

/* Inner excerpt wrapper */
.content .faso-blogfront-section-post .faso-blogfront-data-entry-text {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

/* Kill any leftover left spacing from inner text */
.content .faso-blogfront-section-post .faso-blogfront-data-entry-text h3,
.content .faso-blogfront-section-post .faso-blogfront-data-entry-text p,
.content .faso-blogfront-section-post .faso-blogfront-data-entry-text ul,
.content .faso-blogfront-section-post .faso-blogfront-data-entry-text ol,
.content .faso-blogfront-section-post .faso-blogfront-data-entry-text li,
.content .faso-blogfront-section-post .faso-blogfront-data-entry-text span,
.content .faso-blogfront-section-post .faso-blogfront-data-entry-text strong {
  margin-left: 0 !important;
  padding-left: 0 !important;
  text-indent: 0 !important;
}

/* Keep paragraphs tidy */
.content .faso-blogfront-section-post .faso-blogfront-data-entry-text p {
  margin-top: 0 !important;
}

/* Read More button */
.content .faso-blogfront-section-post .btn {
  margin-top: 10px !important;
  margin-left: 0 !important;
  display: inline-block !important;
}



/* =========================================================
   14) BLOG — MOBILE / TABLET STACKING
   ========================================================= */

@media (max-width: 768px) {
  /* Single post page */
  .content .faso-blog-post > .row:nth-of-type(2) > .col-1-3.text-right-left,
  .content .faso-blog-post > .row:nth-of-type(2) > .col-2-3 {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .content .faso-blog-post h2.faso-blog-data-entry-title {
    font-size: 28px !important;
  }

  /* Blog listing page stacks again */
  .content .faso-blogfront-section-post > .row:nth-of-type(2) {
    display: block !important;
  }

  .content .faso-blogfront-section-post > .row:nth-of-type(2) > .col-1-2.text-right-left,
  .content .faso-blogfront-section-post > .row:nth-of-type(2) > .col-1-2:not(.text-right-left) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .content .faso-blogfront-section-post .faso-blogfront-section-byline,
  .content .faso-blogfront-section-post p.small.faso-blogfront-section-byline,
  .content .faso-blogfront-section-post > .row:nth-of-type(2) > .col-1-2.text-right-left > p,
  .content .faso-blogfront-section-post .faso-blogfront-section-image {
    width: 100% !important;
    max-width: 100% !important;
  }

  .content .faso-blogfront-data-entry-title {
    font-size: 26px !important;
  }
}


/* Hide price + availability ONLY in collection grid */
.flex-grid .faso-works-expanded-section-price,
.flex-grid .faso-works-expanded-section-availability {
    display: none !important;
}

/* Style "Make an offer" link */
.make-an-offer-wrapper a {
    font-weight: 400 !important;   /* remove bold */
    font-style: italic;            /* make italic */
    font-size: 12px;               /* smaller text */
    letter-spacing: 0.5px;         /* subtle refinement */
    opacity: 0.8;                  /* softer look */
}

/* Hide separator text nodes like dashes */
.lg-sub-html {
    font-size: 0 !important;
}

/* Restore visible caption text */
.lg-sub-html .artwork-summary-title,
.lg-sub-html .artwork-summary-medium,
.lg-sub-html .artwork-summary-substrate,
.lg-sub-html .artwork-summary-size,
.lg-sub-html .artwork-summary-info-link {
    font-size: 16px !important;
}

/* Hide availability and price */
.lg-sub-html .artwork-summary-availability,
.lg-sub-html .artwork-summary-retailPrice {
    display: none !important;
}

/* Add clean spacing between elements */
.lg-sub-html span,
.lg-sub-html a {
    margin-right: 6px;
}

/* Add space BEFORE the link (fixes dash crowding) */
.lg-sub-html .artwork-summary-info-link {
    margin-left: 6px;
}


/* =========================================================
   15) WORK ZOOM PAGE (ARTWORK TO BUY) LAYOUT ONLY
   This targets the individual artwork page layout and does
   not change your global site layout.
   ========================================================= */

/* =========================================================
   16) PRODUCT / WORK ZOOM PAGE — SINGLE FINAL SYSTEM
   ---------------------------------------------------------
   PURPOSE
   - One clean product-page layout system only
   - Image left
   - Title / medium / size / status / price / buy button right
   - Long narrative text below in one full-width row
   - Replace "Sold" with "Original Sold"
   - Add "Select prints available now" under sold status
   - Keep rest of site untouched
   ========================================================= */


/* =========================================================
   1) PAGE-SPECIFIC PRODUCT WRAPPER
   ---------------------------------------------------------
   This only applies on pages that contain the artwork/product
   section .faso-workszoom-section-data.
   ========================================================= */
.content:has(.faso-workszoom-section-data) {
  --product-max-width: 1320px;      /* overall width cap for artwork page */
  --product-side-pad: 24px;         /* left/right padding inside product area */
  --product-left-col: 56%;          /* image column width */
  --product-right-col: 34%;         /* details column width */
  --product-gap: 10%;               /* space between columns */
}


/* =========================================================
   2) PRODUCT TITLE ROW
   ---------------------------------------------------------
   Styles only the artwork page title row.
   Keeps title aligned above the right column.
   ========================================================= */
.content:has(.faso-workszoom-section-data) > .row:has(> .page-title) {
  max-width: var(--product-max-width) !important;
  margin: 10px auto 6px auto !important;
  padding: 0 var(--product-side-pad) !important;
  box-sizing: border-box !important;
}

.content:has(.faso-workszoom-section-data) > .row:has(> .page-title) > .page-title {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

.content:has(.faso-workszoom-section-data) > .row:has(> .page-title) > .page-title h1 {
  width: var(--product-right-col) !important;                           /* title width matches right column */
  margin: 0 0 0 calc(100% - var(--product-right-col)) !important;      /* shifts title to right side */
  text-align: left !important;
  font-size: 2.2rem !important;
  line-height: 1.02 !important;
  letter-spacing: 0 !important;
}


/* =========================================================
   3) MAIN PRODUCT SECTION WRAPPER
   ---------------------------------------------------------
   Centers the artwork/detail area below the title.
   ========================================================= */
.content:has(.faso-workszoom-section-data) .faso-workszoom-section-data {
  max-width: var(--product-max-width) !important;
  margin: 0 auto 44px auto !important;
  padding: 0 var(--product-side-pad) !important;
  box-sizing: border-box !important;
}


/* =========================================================
   4) TOP PRODUCT GRID
   ---------------------------------------------------------
   Layout structure:
   - Row 1 left  = image
   - Row 1 right = medium / size / status
   - Row 2 right = price / buy area
   - Row 3 full  = long description and extra content
   ========================================================= */
.content:has(.faso-workszoom-section-data) .faso-workszoom-section-data > .col-2-3.centered.text-center {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  float: none !important;
  display: grid !important;
  grid-template-columns: minmax(0, var(--product-left-col)) minmax(300px, var(--product-right-col)) !important;
  grid-template-rows: min-content min-content auto !important;
  column-gap: var(--product-gap) !important;
  row-gap: 18px !important;
  align-items: start !important;
  text-align: left !important;
}


/* =========================================================
   5) IMAGE BLOCK
   ---------------------------------------------------------
   Keeps artwork image on the left and spanning the top
   content area.
   ========================================================= */
.content:has(.faso-workszoom-section-data) .bb-artwork-viewer {
  grid-column: 1 !important;
  grid-row: 1 / span 2 !important;      /* image spans details + price rows */
  width: 100% !important;
  margin: 0 !important;
  text-align: center !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  align-self: start !important;
}


/* =========================================================
   6) IMAGE WRAPPER CLEANUP
   ---------------------------------------------------------
   Removes FASO wrapper padding / width caps.
   ========================================================= */
.content:has(.faso-workszoom-section-data) #artwork-viewer,
.content:has(.faso-workszoom-section-data) .ArtworkDetails__innerContainer,
.content:has(.faso-workszoom-section-data) .ArtworkDetails__artworkImage,
.content:has(.faso-workszoom-section-data) .ArtworkDetails__artworkImage .slot {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}


/* =========================================================
   7) ACTUAL ARTWORK IMAGE
   ---------------------------------------------------------
   Responsive image with finished shadow.
   ========================================================= */
.content:has(.faso-workszoom-section-data) .ArtworkDetails__artworkImage img,
.content:has(.faso-workszoom-section-data) img.faso-workszoom-data-image {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 auto !important;
  background: transparent !important;
  border-radius: 1px !important;
  box-shadow:
    0 18px 32px rgba(0,0,0,0.26),
    0 8px 18px rgba(0,0,0,0.16),
    0 0 20px rgba(0,0,0,0.07) !important;
}


/* =========================================================
   8) BUTTONS UNDER IMAGE
   ---------------------------------------------------------
   Keeps zoom / room / prints buttons centered beneath image.
   ========================================================= */
.content:has(.faso-workszoom-section-data) #faso-pov-button {
  text-align: center !important;
  margin: 18px 0 8px 0 !important;
}

.content:has(.faso-workszoom-section-data) #faso-pov-button .btn,
.content:has(.faso-workszoom-section-data) #faso-pov-button a {
  display: inline-block !important;
  min-width: 210px !important;
  padding: 12px 22px !important;
}


/* =========================================================
   9) DETAILS BLOCK
   ---------------------------------------------------------
   Medium / size / status stay together in the right column.
   ========================================================= */
.content:has(.faso-workszoom-section-data) .works-details {
  grid-column: 2 !important;
  grid-row: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
  line-height: 1.45 !important;
}

.content:has(.faso-workszoom-section-data) .works-details span {
  display: block !important;
  margin: 0 0 8px 0 !important;
  font-size: 1.02rem !important;
}


/* =========================================================
   10) SOLD STATUS TEXT REWRITE — HIDE ORIGINAL SOLD TEXT
   ---------------------------------------------------------
   This hides the original FASO availability text so a custom
   status label can be added later if desired.
   ========================================================= */

/* Availability text container */
.content:has(.faso-workszoom-section-data) .faso-workszoom-data-availibility {
  position: relative !important;
  min-height: 3.2em !important;
}

/* hide ALL original text inside that status area */
.content:has(.faso-workszoom-section-data) .faso-workszoom-data-availibility,
.content:has(.faso-workszoom-section-data) .faso-workszoom-data-availibility * {
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
}



/* =========================================================
   11) PRICE / CART BLOCK
   ---------------------------------------------------------
   Sits directly below the details block.
   ========================================================= */
.content:has(.faso-workszoom-section-data) .price-boxes {
  grid-column: 2 !important;
  grid-row: 2 !important;
  align-self: start !important;
  width: 100% !important;
  max-width: 320px !important;
  margin: 6px 0 0 0 !important;
  padding: 0 !important;
  text-align: left !important;

}

.content:has(.faso-workszoom-section-data) .price-box,
.content:has(.faso-workszoom-section-data) .box,
.content:has(.faso-workszoom-section-data) .cart-form,
.content:has(.faso-workszoom-section-data) .cart-form form,
.content:has(.faso-workszoom-section-data) .make-an-offer-wrapper {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}


/* =========================================================
   12) PRICE STYLING
   ---------------------------------------------------------
   Keeps price compact and readable.
   ========================================================= */
.content:has(.faso-workszoom-section-data) .faso-workszoom-data-retailprice {
  display: block !important;
  font-size: 2.3rem !important;
  line-height: 1.04 !important;
  margin: 0 0 14px 0 !important;
}

.content:has(.faso-workszoom-section-data) .works-price-currency-name {
  font-size: 0.56em !important;
  letter-spacing: 0.02em !important;
}


/* =========================================================
   13) ADD TO CART BUTTON
   ---------------------------------------------------------
   Keeps button directly under price.
   ========================================================= */
.content:has(.faso-workszoom-section-data) .faso-contact-input-submit {
  display: inline-block !important;
  width: 100% !important;
  max-width: 220px !important;
  margin: 0 !important;
  padding: 14px 20px !important;
  box-sizing: border-box !important;
}


/* =========================================================
   14) MAKE AN OFFER LINK
   ---------------------------------------------------------
   Small spacing below button.
   ========================================================= */
.content:has(.faso-workszoom-section-data) .make-an-offer-wrapper {
  margin-top: 12px !important;
}


/* =========================================================
   15) CONTACT LINK / CTA
   ---------------------------------------------------------
   Keep the contact callout as full-width lower content.
   ========================================================= */
.content:has(.faso-workszoom-section-data) .contact-link,
.content:has(.faso-workszoom-section-data) .contact-artist,
.content:has(.faso-workszoom-section-data) .contact-form-link,
.content:has(.faso-workszoom-section-data) .faso-workszoom-data-comments {
  grid-column: 1 / -1 !important;
  grid-row: 3 !important;
  width: 100% !important;
  max-width: 100% !important;
  text-align: left !important;
}


/* =========================================================
   16) LOWER DESCRIPTION / COMMENTS
   ---------------------------------------------------------
   Full-width row with no indent.
   ========================================================= */
.content:has(.faso-workszoom-section-data) .faso-workszoom-data-comments {
  margin: 28px 0 0 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

.content:has(.faso-workszoom-section-data) .faso-workszoom-data-comments p,
.content:has(.faso-workszoom-section-data) .faso-workszoom-data-comments .faso-user-p {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 18px 0 !important;
  padding: 0 !important;
  text-align: left !important;
  text-indent: 0 !important;
  line-height: 1.7 !important;
  float: none !important;
  clear: both !important;
}

.content:has(.faso-workszoom-section-data) .faso-workszoom-data-comments p:empty,
.content:has(.faso-workszoom-section-data) .faso-workszoom-data-comments .faso-user-p:empty {
  display: none !important;
}


/* =========================================================
   17) MOBILE / TABLET FALLBACK
   ---------------------------------------------------------
   Stack everything cleanly on smaller screens.
   ========================================================= */
@media (max-width: 980px) {
  .content:has(.faso-workszoom-section-data) > .row:has(> .page-title) > .page-title h1 {
    width: 100% !important;
    margin: 0 !important;
    text-align: center !important;
    font-size: 2rem !important;
    line-height: 1.08 !important;
  }

  .content:has(.faso-workszoom-section-data) .faso-workszoom-section-data > .col-2-3.centered.text-center {
    display: block !important;
  }

  .content:has(.faso-workszoom-section-data) .works-details,
  .content:has(.faso-workszoom-section-data) .price-boxes,
  .content:has(.faso-workszoom-section-data) .price-box,
  .content:has(.faso-workszoom-section-data) .box,
  .content:has(.faso-workszoom-section-data) .cart-form,
  .content:has(.faso-workszoom-section-data) .cart-form form,
  .content:has(.faso-workszoom-section-data) .make-an-offer-wrapper,
  .content:has(.faso-workszoom-section-data) .faso-workszoom-data-comments,
  .content:has(.faso-workszoom-section-data) .faso-workszoom-data-comments p,
  .content:has(.faso-workszoom-section-data) .faso-workszoom-data-comments .faso-user-p {
    text-align: center !important;
  }

  .content:has(.faso-workszoom-section-data) .faso-contact-input-submit {
    margin: 0 auto !important;
  }

  .content:has(.faso-workszoom-section-data) .faso-workszoom-data-availibility::after {
    margin-top: 6px !important;
  }
}

/* =========================================================
   17) HOME SLIDER / HERO — FULL-WIDTH SAFE VERSION
   ---------------------------------------------------------
   PURPOSE:
   - Make the homepage slider span the full browser width
   - Keep the original FASO/Slick slider working
   - Avoid hiding the image
   - Avoid breaking Slick's internal slide calculations

   IMPORTANT:
   - Do NOT force .slick-track to width: 100%
   - Slick calculates .slick-track width dynamically
   - Forcing that width can make images disappear
   ========================================================= */


/* ---------------------------------------------------------
   1) PREVENT HORIZONTAL SCROLL
   ---------------------------------------------------------
   Full-width sections often use 100vw.
   This prevents the browser from creating a tiny side-scroll.
   --------------------------------------------------------- 

html,
body {
  overflow-x: hidden !important;
}

*/
/* ---------------------------------------------------------
   2) FULL-BLEED SLIDER WRAPPER
   ---------------------------------------------------------
   This is the main fix.

   Your site content is inside a centered .content container.
   This makes only the slider break out of that container and
   stretch edge-to-edge across the browser window.
   --------------------------------------------------------- */

#slider-wrapper {
  position: relative !important;

  /* Make slider the full browser width */
  width: 100vw !important;
  max-width: 100vw !important;

  /* Pull the slider outside the centered content container */
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;

  /* Remove any inherited spacing */
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;

  /* Keep arrows/images contained visually */
  overflow: hidden !important;

  box-sizing: border-box !important;
}


/* ---------------------------------------------------------
   3) LET THE HOME PAGE SECTION EXPAND
   ---------------------------------------------------------
   Your current CSS limits these wrappers to 92% and 1400px.
   These rules remove that limit only when the slider is present.
   --------------------------------------------------------- */

.content:has(#slider-wrapper) .artistContent.col-3-4.centered,
.content:has(#slider-wrapper) .faso-main-section-main {
  width: 100% !important;
  max-width: none !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  overflow: visible !important;
}


/* ---------------------------------------------------------
   4) SLIDESHOW CONTAINERS
   ---------------------------------------------------------
   These can safely be 100%.

   Notice that .slick-track is NOT included here.
   Slick needs to control .slick-track itself.
   --------------------------------------------------------- */

#slider-wrapper .slideshow,
#slider-wrapper .slick-slider,
#slider-wrapper .slick-list {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}


/* ---------------------------------------------------------
   5) DO NOT BREAK SLICK TRACK
   ---------------------------------------------------------
   This is intentionally minimal.

   We are NOT setting:
   width: 100%;

   Slick calculates the track width based on the number of
   slides. If we override it, the slider can disappear.
   --------------------------------------------------------- */

/*#slider-wrapper .slick-track {
  max-width: none !important;
}*/


/* ---------------------------------------------------------
   6) SLIDE ITEMS
   ---------------------------------------------------------
   Make each visible slide fill the slider area without forcing
   Slick's track math to change.
   --------------------------------------------------------- */

#slider-wrapper .slick-slide {
  box-sizing: border-box !important;
}

#slider-wrapper .slick-slide > div {
  width: 100% !important;
  box-sizing: border-box !important;
}


/* ---------------------------------------------------------
   7) IMAGE CONTAINERS
   ---------------------------------------------------------
   Some FASO slider images may sit inside .image containers.
   These rules keep those containers visible and full-width.
   --------------------------------------------------------- */

#slider-wrapper .image,
#slider-wrapper .image.image--cover,
#slider-wrapper .image.image--valign-center,
#slider-wrapper .image.image--cover.image--valign-center {
  display: block !important;
  /* width: 100% !important;      <-- REMOVE (this is the bug) */
  /* max-width: 100% !important;  <-- REMOVE */
  min-height: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 1 !important;
  visibility: visible !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}


/* ---------------------------------------------------------
   8) ACTUAL SLIDER IMAGES
   ---------------------------------------------------------
   This keeps the images visible.

   The image should be width: 100%, not width: 100vw.
   The wrapper is already 100vw, so the image fills it safely.
   --------------------------------------------------------- */

#slider-wrapper img,
#slider-wrapper .image img,
#slider-wrapper .slick-slide img,
#slider-wrapper img[data-src] {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 1 !important;
  visibility: visible !important;
  object-position: center center !important;
}


/* ---------------------------------------------------------
   9) DESKTOP HERO HEIGHT
   ---------------------------------------------------------
   This gives the homepage slider a strong hero look.

   Change 620px if you want it taller or shorter.
   --------------------------------------------------------- */

@media only screen and (min-width: 1025px) {
  #slider-wrapper img,
  #slider-wrapper .image img,
  #slider-wrapper .slick-slide img,
  #slider-wrapper img[data-src] {
    height: 620px !important;
    object-fit: cover !important;
  }
}


/* ---------------------------------------------------------
   10) TABLET HERO HEIGHT
   ---------------------------------------------------------
   Slightly shorter than desktop.
   --------------------------------------------------------- */

@media only screen and (min-width: 769px) and (max-width: 1024px) {
  #slider-wrapper img,
  #slider-wrapper .image img,
  #slider-wrapper .slick-slide img,
  #slider-wrapper img[data-src] {
    height: 480px !important;
    object-fit: cover !important;
  }
}


/* ---------------------------------------------------------
   11) MOBILE HERO HEIGHT
   ---------------------------------------------------------
   On mobile, contain is safer because it avoids cropping too
   aggressively. Use cover instead if you want edge-to-edge crop.
   --------------------------------------------------------- */

@media only screen and (max-width: 768px) {
  #slider-wrapper {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
  }

  #slider-wrapper img,
  #slider-wrapper .image img,
  #slider-wrapper .slick-slide img,
  #slider-wrapper img[data-src] {
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
  }
}


/* ---------------------------------------------------------
   12) SLIDER ARROWS
   ---------------------------------------------------------
   Keeps the arrows visible and inside the full-width slider.
   --------------------------------------------------------- */

#slider-wrapper .slick-prev,
#slider-wrapper .slick-next {
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  z-index: 50 !important;

  width: 56px !important;
  height: 56px !important;

  border: 0 !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.78) !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.16) !important;

  padding: 0 !important;
  margin: 0 !important;

  font-size: 0 !important;
  line-height: 1 !important;
  cursor: pointer !important;
}


/* Left arrow */
#slider-wrapper .slick-prev {
  left: 24px !important;
}


/* Right arrow */
#slider-wrapper .slick-next {
  right: 24px !important;
}


/* Hide default Slick arrow symbols */
#slider-wrapper .slick-prev:before,
#slider-wrapper .slick-next:before {
  content: "" !important;
  display: none !important;
}


/* Add clean custom arrow symbols */
#slider-wrapper .slick-prev:after,
#slider-wrapper .slick-next:after {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;

  transform: translate(-50%, -50%) !important;

  font-family: Arial, sans-serif !important;
  font-size: 42px !important;
  line-height: 1 !important;
  font-weight: 400 !important;

  color: #555 !important;
}


/* Custom arrow characters */
#slider-wrapper .slick-prev:after {
  content: "‹" !important;
}

#slider-wrapper .slick-next:after {
  content: "›" !important;
}


/* ---------------------------------------------------------
   13) MOBILE ARROWS
   ---------------------------------------------------------
   Smaller arrows on phones.
   --------------------------------------------------------- */

@media only screen and (max-width: 768px) {
  #slider-wrapper .slick-prev,
  #slider-wrapper .slick-next {
    width: 42px !important;
    height: 42px !important;
  }

  #slider-wrapper .slick-prev {
    left: 12px !important;
  }

  #slider-wrapper .slick-next {
    right: 12px !important;
  }

  #slider-wrapper .slick-prev:after,
  #slider-wrapper .slick-next:after {
    font-size: 32px !important;
  }
}