/*
THEME COLORS -----------------------

    base neutral = #555

    theme = #e552e5

    negative color = #fff

    border = #888

---*/





/*--- RESET ------------------------------------------------------------*/
html, body, div, header, footer, main, section, article, nav, aside, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, p, span, a, strong, em, img, iframe, details, br, hr, sub, sup, time, pre, code, blockquote, q, cite, address, summary, form, label, fieldset, legend, input, textarea, select, option, button, table, caption, thead, tbody, tfoot, th, tr, td, figure, figcaption, video, audio, canvas {margin:0;padding:0;border:0;text-decoration:none}
header, footer, section, nav, article, aside, main, details, summary, figure, figcaption {display:block}
ul, ol {list-style:none}
input, textarea, select, option, button, label, legend {font-family:inherit;color:inherit;font-size:inherit;font-weight:inherit}
button {cursor:pointer;background:none;line-height:inherit}
button::-moz-focus-inner {border:0;padding:0}
address, cite {font-style:normal}
table {border-collapse:separate;border-spacing:0;word-wrap:break-word}
html {text-size-adjust:100%;-webkit-text-size-adjust:100%;font-size:1.25em}
body {min-width:300px;max-width:1200px;background:#fff;font-family:'Poppins', sans-serif;color:#555;line-height:1;margin:0 auto}


    /*---headings---*/
    h1, h2, h3, h4, h5, h6 {padding:0 0 1em;letter-spacing:.1em;line-height:1.2;text-transform:uppercase;font-weight:normal}
        h1 {font-size:1.2em}
            h1:first-child {display:table;padding:.4em .6em;background:#555;font-size:.9em;color:#fff;margin:0 0 2em}
        h2 {font-size:1em}
        h3 {font-size:.9em}
        h4 {font-size:.8em}

    /*---links---*/
    a {color:#e552e5}
        a:hover, a:focus {color:#de26de}


    /*---paragraph text---*/
    p {padding:0 0 1rem;font-size:.8em;line-height:1.4}
        p a {font-weight:bold;word-wrap:break-word}


    /*---sub/superscript---*/
    sup, sub {font-size:.6em}


    /*---images---*/
    img {display:block;max-width:100%;height:auto}


    /*---images---*/
    hr {display:block;width:auto;height:1px;background-color:#888;margin:0 0 1em}


    /*---form reset---*/
    textarea {-webkit-appearance:none;-webkit-overflow-scrolling:touch}
    input[type="search"], input[type="text"], input[type="email"], input[type="password"], input[type="tel"], input[type="date"] {-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;-webkit-appearance:none}
    input[type="number"] {-webkit-appearance:textfield;-moz-appearance:textfield}
    input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button {-moz-appearance:none;-webkit-appearance:none}
    input[type="button"], input[type="submit"]  {-webkit-appearance:none}
    input::-webkit-search-decoration, input::-webkit-search-cancel-button, input::-webkit-search-results-button, input::-webkit-search-results-decoration {display:none}
    input::-ms-clear {display:none}
    :focus::-webkit-input-placeholder {opacity:0;transition:opacity 0.2s 0.2s ease}
    :focus::-moz-placeholder {opacity:0;transition:opacity 0.2s 0.2s ease}
    :focus::input-placeholder {opacity:0;transition:opacity 0.2s 0.2s ease}
    ::-webkit-input-placeholder {color:#888}
    ::-moz-placeholder {color:#888;opacity:1}
    :-ms-input-placeholder {color:#888}
    ::input-placeholder {color:#888}








/*--- GENERAL FORMS -----------------------------------------------------*/
input, textarea, select, fieldset, legend, label, button {display:block}
label {display:table;border-collapse:separate;padding:0 0 .5em;font-size:.8em;letter-spacing:.1em;text-transform:uppercase}

    /*---fieldsets---*/
    fieldset {min-width:inherit;padding:0 0 .5em}
    legend {padding:0 0 1em;font-size:.8em;letter-spacing:.1em;text-transform:uppercase}

    /*---inputs-------------*/
    input, textarea, select {box-sizing:border-box;max-width:100%;padding:.3em .4em;background-color:#fff;border:1px solid #888;border-radius:0;font-size:.8em;margin:0 0 1.2em;text-overflow:ellipsis;transition:background-color .2s, color .2s, border-color .2s}
        textarea {overflow:auto}
        input:focus, textarea:focus, select:focus {border-color:#e552e5}


    /*---optional fancy select box buttons (wrap <select> with <div class="select-container"><div>...)--------*/
    .select-container > div {box-sizing:border-box;display:inline-block;max-width:100%;position:relative;margin:0 0 1.2em}

        /*---faux dropdown button---*/
        .select-container > div:before {box-sizing:border-box;display:block;width:1.8em;background-color:#e552e5;border-radius:0;border-top-left-radius:0;border-bottom-left-radius:0;position:absolute;top:0;bottom:0;right:0;pointer-events:none;content:"";transition:background-color .2s}

        /*---down arrow---*/
        .select-container > div:after {display:block;width:0;height:0;border:0 solid transparent;border-width:.3em .3em 0 .3em;border-top-color:#fff;position:absolute;top:.85em;right:.6em;pointer-events:none;content:""}

        .select-container > div:hover:before {background-color:#de26de}
        .select-container > div select {padding-right:2.6em;margin-bottom:0;-webkit-appearance:none}


    /*---checkbox/radio inputs------------------*/
    input[type='checkbox'], input[type='radio'] {float:left;clear:left;width:auto;padding:0;border:none;box-shadow:none;background:transparent;margin:0;position:relative;top:.05rem;left:.15rem} /*---resets some styles from <input>---*/
    input[type='checkbox'] + label, input[type='radio'] + label {padding:0 .3em 1em .8em;position:relative}
    input[type='checkbox'] + label:hover, input[type='radio']:not(:checked) + label:hover {color:#e552e5}

        /*---<input>s inside <label>---*/
        label input[type='checkbox'], label input[type='radio'] {margin-right:.8em}

        /*---<label>s inside <fieldset>---*/
        fieldset input[type='checkbox'] + label, fieldset input[type='radio'] + label {font-weight:normal}


        /*---custom checkbox/radio selectors---*/
        input[type='checkbox'] + label:before, input[type='radio'] + label:before {box-sizing:border-box;display:block;width:1em;height:1em;background-color:#bbb;font-size:.8rem;position:absolute;top:0;left:-.6rem;content:""}
        input[type='radio'] + label:before {border-radius:50%}

            /*---checked state---*/
            input[type='checkbox']:checked + label:before, input[type='radio']:checked + label:before {background-color:#e552e5}

            /*---labels without for="" attribute---*/
            input[type='checkbox'] + label:not([for]):hover, input[type='radio'] + label:not([for]):hover {color:#e552e5}
            input[type='checkbox'] + label:not([for]):before, input[type='radio'] + label:not([for]):before {display:none;pointer-events:none}







/*--- GENERAL BUTTONS --------------------------------------------*/
.button, button, input[type="button"], input[type="submit"], .tags li a {background-color:#e552e5;padding:.625em .8em;border-radius:0;font-size:.8em;letter-spacing:.1em;text-transform:uppercase;color:#fff;margin:0 0 1em;cursor:pointer}
    .button:hover, button:hover, input[type="button"]:hover, input[type="submit"]:hover, .button:focus, button:focus, input[type="button"]:focus, input[type="submit"]:focus, .tags li a:hover, .tags li a:focus {background-color:#de26de;color:#fff}

    /*---optional icon---*/
    .button:after, button:after, input[type="button"]:after, input[type="submit"]:after {display:none;vertical-align:middle;width:1em;height:1em;background:url(images/icon-sprite.svg) no-repeat -18em center;background-size:auto 100%;font-size:.6rem;position:relative;top:-.1rem;margin:0 0 0 .8em;content:""}

    /*--- link version ---*/
    a.button {display:block;width:fit-content}

    /*---extra reset for button-styled <input>s---*/
    input[type="button"], input[type="submit"] {line-height:1;white-space:normal;border:none;transition:background-color .2s, color .2s}









/*--- COMMON -----------------------------------------------------------------*/


    /*---soft hover---------------------------------*/
    a, a:before, a:after, button, button:before, button:after, label {transition:color .2s, background-color .2s, border-color .2s}


    /*---basic bullet list------------------------------------------*/
    ul.bullet-list, main > ul:not([class]), .item > ul:not([class]) {max-width:50rem;padding:0 0 1em;overflow:hidden}
        ul.bullet-list li, main > ul:not([class]) li, .item > ul:not([class]) li {padding:0 0 .5em .8em;font-size:.8em;line-height:1.4;position:relative}
            ul.bullet-list li:before, main > ul:not([class]) li:before, .item > ul:not([class]) li:before {display:block;width:.3rem;height:.3rem;background-color:#555;border-radius:50%;position:absolute;top:.4em;left:.1em;content:""}

        /*--- links ---*/
        ul.bullet-list a, main > ul:not([class]) a, .item > ul:not([class]) a {font-weight:bold}



    /*---content image floats/alignment----------------------------------------*/
    .content-image {clear:both;display:table;max-height:30em;margin:.5em auto 1em} /*---center default---*/
        .content-image img {max-height:30em}


        @media (min-width:800px) {
            .content-image {display:block} /*---center default---*/
            .content-image.left {clear:left;float:left;max-width:40%;margin-right:1.5em}
            .content-image.right {clear:right;float:right;max-width:40%;margin-left:1.5em}

            /*---if immediately after heading or first element in content area---*/
            h1 + .content-image, h2 + .content-image, h3 + .content-image, main > .content-image:first-child {margin-top:0}
        }



    /*---tags---------------------------------------------------------------------------------------*/
    .tags {padding:0 0 1em;overflow:hidden}
        .tags li {float:left;margin:.2em .2em 0 0}
            .tags li:last-child {margin-right:0}

        .tags li a, .tags li button {padding-top:.5em;padding-bottom:.45em;font-size:.6em;background-color:#555}
            .tags li a:hover, .tags li button:hover, .tags li a:focus, .tags li button:focus {background-color:#e552e5}

            .tags a {display:table}






/*--- social links ------------------------*/
.social-links {display:grid;grid-template-columns:repeat(auto-fill, minmax(6.5em, 1fr));gap:1.5em 1em;margin:0 0 2rem}
    .social-links li {}
        .social-links a {display:flex;align-items:center;gap:.75rem;width:fit-content;padding:0 1em 0 0;font-size:.8em}

            /*--- icon ---*/
            .social-links a::before {box-sizing:border-box;width:1em;height:1em;padding:.2em;background:url('images/social-icons-sprite.svg') no-repeat calc(-1.2em * var(--social-icon-position, 0)) center / auto 100%, var(--social-icon-gradient, none), linear-gradient(var(--social-icon-color, #444), var(--social-icon-color, #444));background-clip:content-box, border-box, border-box;background-origin:content-box, border-box, border-box;border-radius:var(--common-radius);font-size:2em;position:relative;overflow:hidden;cursor:pointer;transition:filter .2s;content:""}

            /*--- icons ---*/
            .social-links .facebook a::before {--social-icon-color:#3b5998;padding-bottom:0;padding-top:.3em}
            .social-links .bluesky a::before {--social-icon-color:#1185fe;--social-icon-position:1}
            .social-links .linkedin a::before {--social-icon-color:#0077b5;--social-icon-position:2}
            .social-links .instagram a::before {--social-icon-position:3;--social-icon-gradient:radial-gradient(circle farthest-corner at 32% 106%, rgb(255, 225, 125) 0%, rgb(255, 205, 105) 10%, rgb(250, 145, 55) 28%, rgb(235, 65, 65) 42%, transparent 82%), linear-gradient(135deg, rgb(35, 75, 215) 12%, rgb(195, 60, 190) 58%)}
            .social-links .youtube a::before {--social-icon-color:#cd201f;--social-icon-position:4}
            .social-links .pinterest a::before {--social-icon-color:#bd081c;--social-icon-position:5}
            .social-links .vimeo a::before {--social-icon-color:#1ab7ea;--social-icon-position:6}
            .social-links .pixelfed a::before {--social-icon-color:#d438af;--social-icon-position:7;/*--social-icon-gradient:conic-gradient(#ffa10a, #0de552, #00c2f8, #d332ac, #f32848, #ffa10a)*/}
            .social-links .mastodon a::before {--social-icon-color:#615FF8;--social-icon-position:8}












/*---HEADER-----------------------------------------------------*/
header.site {position:relative;z-index:1000}
    header.site:after {display:block;clear:both;content:""}


    /*---logo/link---------------------------------------*/
    header.site > a {display:block;float:left;padding:.5em;font-size:1em;letter-spacing:.3em;text-transform:uppercase;color:#555;margin:0 0 0 .2rem}
        header.site > a span {display:table;padding:.416666666666em .6em .3333333333333em .8em;background-color:#555;text-align:center;font-size:.6em;letter-spacing:.2em;color:#fff;margin:.5em auto 0;transition:background-color .2s}
            header.site > a:hover span, header.site > a:focus span {background-color:#e552e5}


        @media (min-width:500px) {
            header.site > a {padding:1.2em .5em 1em;margin-left:.5rem}
                header.site > a span {display:inline-block;vertical-align:top;margin:0}
        }



    /*---menu toggle-----------------------------*/
    .main-menu-toggle {display:block;float:right;width:1em;height:1em;padding:0;background-color:transparent;border:1px solid #888;border-color:transparent;border-radius:0;font-size:2em;color:#fff;position:relative;margin:.4em .2rem 0 0;overflow:hidden;transition:opacity .2s}
        .main-menu-toggle:before {display:block;height:200%;content:""}
        .main-menu-toggle:after {display:block;width:1em;height:1em;background:url(images/icon-sprite.svg) no-repeat center;background-size:auto 100%;position:absolute;top:0;bottom:0;left:0;right:0;font-size:1.5rem;margin:auto;content:""}
        .main-menu-toggle:hover, .main-menu-toggle:focus {opacity:.7}

        /*---open state---*/
        .main-menu-toggle.open {border-color:#888}


        @media (min-width:500px) {
            .main-menu-toggle {margin-right:.5rem}
        }

        @media (min-width:900px) {
            .main-menu-toggle {display:none}
        }




    /*---main menu-------------------------------------------------------*/
    .main-menu {visibility:hidden;height:0;clear:both;position:relative;transition:visibility 0s .2s, height .2s;overflow:hidden}
        .main-menu:after {display:block;clear:both;content:""}

        /*---open state----*/
        .main-menu.open {visibility:visible;height:auto;transition-delay:0s, 0s}


        /*---top-level items---------------------------*/
        .main-menu li {}
            .main-menu a {display:block;padding:.6em .6em;background:#555;border-bottom:1px solid #888;font-size:.8em;text-transform:uppercase;line-height:1.2;letter-spacing:.3em;color:#fff;cursor:pointer}
                .main-menu a:hover, .main-menu a:focus {background-color:#646464}


        @media (min-width:900px) {
            .main-menu {visibility:visible;clear:none;float:right;height:auto;padding:.5em 0 0}
                .main-menu li {float:left}
                    .main-menu a {padding:1em .8em;background-color:transparent;border:none;color:#555}
                        .main-menu a:hover, .main-menu a:focus {background-color:transparent;color:#e552e5}


                    /*---active item---*/
                    .main-menu li.active a {color:#e552e5}
        }

        @media (min-width:1000px) {
            .main-menu a {padding-left:1.5em;padding-right:1.5em}
        }









/*---CONTENT AREA----------------------------------------------------*/
main {clear:both;padding:2rem .5rem}
    main:after {display:block;clear:both;content:""}


    @media (min-width:800px) {
        main {padding-left:1rem;padding-right:1rem}
    }


    /*---top-level content area sections---*/
    main> section {clear:both;padding:0 0 2em}







/*---FOOTER-----------------------------------------------*/
footer.site {display:flex;flex-flow:column;gap:.5em;padding:1em .5em;font-size:.6em;letter-spacing:.05em;text-align:center;text-transform:uppercase}

    /*--- links ---*/
    footer.site ul {display:flex;flex-wrap:wrap;justify-content:center;gap:0em 1em}
        footer.site li {}
            footer.site a {display:block;padding:.5em}

    /*--- notes ---*/
    footer.site div {}




/*--- CATEGORY LISTING --------------------------------------------------*/
.category-listing {clear:both;display:grid;grid-template-columns:repeat(auto-fill, minmax(min(100%/3, max(12em, 100%/4)), 1fr));gap:1.5em .5em;margin:0 0 2em}
    .category-listing li {}
        .category-listing a {display:block;color:#555}

            /*--- image ---*/
            .category-listing a img {margin:0 0 .5em}

            /*--- title ---*/
            .category-listing a h2, .category-listing a h3 {padding:0;font-size:.8em;font-size:clamp(.8em, 4vw, 1em);letter-spacing:.1em;text-transform:uppercase;overflow:hidden;transition:color .2s}
                .category-listing a:hover h2, .category-listing a:focus h2, .category-listing a:hover h3, .category-listing a:focus h3 {color:#e552e5}

    @media (min-width:800px) {
        .category-listing {gap:1.5em 1em}
    }




/*--- ITEM LISTING --------------------------------------*/
.item-listing {clear:both;display:grid;grid-template-columns:repeat(auto-fill, minmax(min(100%/3, max(10em, 100%/5)), 1fr));gap:1.5em .5em;margin:0 0 2em}
    .item-listing li {}
        .item-listing a {display:block;color:#555}

            /*--- image ---*/
            .item-listing a > span {display:block;padding:100% 0 0;position:relative;margin:0 0 .5em}
                .item-listing img {width:auto;max-height:100%;position:absolute;top:0;bottom:0;left:0;right:0;margin:auto}

            /*--- title ---*/
            .item-listing h2, .item-listing h3 {padding:0;font-size:.8em;font-size:.8em;letter-spacing:.1em;text-transform:uppercase;overflow:hidden;transition:color .2s}
                .item-listing a:hover h2, .item-listing a:focus h2, .item-listing a:hover h3, .item-listing a:focus h3 {color:#e552e5}


    /*--- alternate version (bio page) -------------*/
    .item-listing.alt {grid-template-columns:repeat(auto-fill, minmax(min(100%/3, max(7em, 100%/5)), 1fr) minmax(min(100%/3, max(7em, 100%/5)), 1fr));gap:.5em}
        .item-listing.alt img {width:100%}


    @media (min-width:800px) {
        .item-listing {gap:1.5em 1em}

            /*--- alternate version ---*/
            .item-listing.alt {gap:1em}
    }




/*--- VIDEOS ---------------------------------------*/
.content-video {display:block;clear:both;max-width:1000px;margin:0 auto 2em;position:relative;overflow:hidden}
	.content-video:before {display:block;padding:56.25% 0 0;content:""} /*---padding sets video proportion---*/
	.content-video iframe {display:block;width:100%;height:100%;position:absolute;top:0;bottom:0;left:0;right:0}



    /*---JW player----------------------*/
    #video-player {clear:both !important;max-width:800px;margin:1em auto .5em !important}


    /*--- on-demand video --------------------------------*/
    .embedded-video {clear:both;max-width:1000px;background-color:#000;border:1px solid #888;position:relative;margin:0 auto 1em}
        .embedded-video::before {display:block;padding-top:56.25%;content:""}

        /*--- square proportion ---*/
        .embedded-video.square {max-width:563px}
            .embedded-video.square::before {padding-top:98.9%}

        /*--- 4:3 proportion ---*/
        .embedded-video.standard {max-width:750px}
            .embedded-video.standard::before {padding-top:75%}

        /*--- link and iframe ---*/
        .embedded-video a, .embedded-video iframe {display:block;width:100%;height:100%;position:absolute;top:0}
            .embedded-video iframe {border:0}

            /*--- play button ---*/
            .embedded-video a::before {box-sizing:border-box;display:block;height:1em;width:1em;background-color:#e552e5;border:.05em solid #fff;border-radius:50%;box-shadow:0 0 .1em 0 rgba(0,0,0,0.6);position:absolute;top:50%;left:50%;z-index:1;font-size:3em;margin:-.5em 0 0 -.5em;opacity:.8;transition:opacity .2s;content:""} /*--- circle ---*/
            .embedded-video a::after {display:block;width:0;height:0;border:0 solid transparent;border-width:.2em 0 .2em .3em;border-left-color:#fff;position:absolute;top:50%;left:50%;z-index:1;font-size:3em;margin:-.2em 0 0 -.1em;content:""} /*--- triangle ---*/

                 /*--- hover/focus state ---*/
                .embedded-video a:hover::before, .embedded-video a:focus::before {opacity:1}

            /*--- image ---*/
            .embedded-video img {object-fit:cover;height:100%;width:100%}

            /*--- duration ---*/
            .embedded-video time {display:block;padding:.1em .2em .15em;background-color:rgba(0,0,0,.6);border-radius:.1em;font-size:.8em;text-shadow:0 0 .1em rgba(0,0,0,.6);color:#fff;position:absolute;bottom:.5em;right:.5em;margin:auto}








/*--- INSTAGRAM EMBED ---------------------------------------*/
iframe.instagram-media, iframe [class^="instagram"] {margin:0 auto 2rem !important}









/*--- ITEM PAGE --------------------------------------------------------------*/
.item {}


    /*--- image gallery (item and blog pages) -----------------------------------*/
    .image-gallery {max-width:500px;margin:0 auto 1em;overflow:hidden}
        .image-gallery ul {margin:0 0 0 -.5em}
            .image-gallery li {box-sizing:border-box;float:left;width:20%;padding:0 0 .5em .5em}
                .image-gallery a {display:block;/*background:url() center;background-size:cover*/;border:1px solid #888;border-color:transparent;position:relative}
                    .image-gallery a:before {display:block;padding:100% 0 0;content:""}
                    .image-gallery a:hover {border-color:#e552e5}

                    .image-gallery img {display:block;width:auto;max-height:100%;position:absolute;top:0;bottom:0;left:0;right:0;margin:auto}

        /*--- main image ----------------*/
        .image-gallery .main-image {clear:both;position:relative;margin:0 0 .5em}
            .image-gallery .main-image::before {display:block;padding:100% 0 0;content:""}
            .image-gallery .main-image img {}

            /*--- only 1 image ---*/
            .image-gallery .main-image + ul li:only-child {display:none}


        /*--- active item/thumbnail ---*/
        .image-gallery .active a {border-color:#e552e5;pointer-events:none}

        @media (min-width:800px) {
            .image-gallery {float:right;width:50%;padding-left:1em}
        }




/*--- HOMEPAGE --------------------------------------------------------------*/
.home {max-width:800px;margin:0 auto 2em}

    .home h1 {display:block;padding:0;background-color:transparent;font-size:1.4em;font-size:clamp(1.3em, 4vw, 1.5em);letter-spacing:.3em;text-align:center;color:#555;margin:0 0 1.5rem}
        .home h1 span {display:inline-block}



/*---BLOG LISTING--------------------------------------------------------------*/
.blog-listing {padding:0 0 1em;overflow:hidden}
    .blog-listing li {padding:0 0 1em}
        .blog-listing a {display:block;padding:.3em;border:1px solid #888;border-color:#d5d5d5;color:#555;margin:0;overflow:hidden}

            /*---image---*/
            .blog-listing a > span {display:block;float:left;width:4em;margin:0 .4em 0 0;position:relative}
                .blog-listing a > span:before {display:block;padding:100% 0 0;content:""}
                .blog-listing a > span img {display:block;width:auto;max-height:100%;position:absolute;top:0;bottom:0;left:0;right:0;margin:auto}

            /*--- heading ---*/
            .blog-listing h2, .blog-listing h3 {padding:0 0 .2em;font-size:.9em;line-height:1;font-weight:normal;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;transition:color .2s}
                .blog-listing a:hover h2, .blog-listing a:focus h2, .blog-listing a:hover h3, .blog-listing a:focus h3 {color:#e552e5}

            /*--- text ---*/
            .blog-listing p {display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;text-overflow:ellipsis;padding:0;line-height:1.2;overflow:hidden}


    @media (min-width:800px) {
        .blog-listing {margin-left:-1em}
            .blog-listing li {box-sizing:border-box;float:left;width:50%;padding-left:1em}
    }

        @media (min-width:800px) and (max-width:1199px) {

             /*---optional full rows------------------------------*/
            .blog-listing.full-rows {}
                /*---all but first 2 when <4 items (1 row)---*/
                .blog-listing.full-rows li:nth-last-child(-n+3):first-child ~ li:nth-child(n+3),

                /*---all but first 4 when <6 items (2 row)---*/
                .blog-listing.full-rows li:nth-last-child(-n+5):first-child ~ li:nth-child(n+5),

                /*---all but first 6 when <8 items (3 rows)---*/
                .blog-listing.full-rows li:nth-last-child(-n+7):first-child ~ li:nth-child(n+7),

                /*---all but first 8 when <10 items (4 rows)---*/
                .blog-listing.full-rows li:nth-last-child(-n+9):first-child ~ li:nth-child(n+9),

                /*---limit to 4 rows---*/
                .blog-listing.full-rows li:nth-child(n+9) {display:none}
        }


    @media (min-width:1200px) {
        .blog-listing li {width:33.333333333%}

         /*---optional full rows-------------------------------*/
        .blog-listing.full-rows {}
            /*---all but first 3 when <6 items (1 row)---*/
            .blog-listing.full-rows li:nth-last-child(-n+5):first-child ~ li:nth-child(n+4),

            /*---all but first 6 when <9 items (2 row)---*/
            .blog-listing.full-rows li:nth-last-child(-n+8):first-child ~ li:nth-child(n+7),

            /*---all but first 6 when <12 items (3 rows)---*/
            .blog-listing.full-rows li:nth-last-child(-n+11):first-child ~ li:nth-child(n+10),

            /*---all but first 9 when <15 items (4 rows)---*/
            .blog-listing.full-rows li:nth-last-child(-n+14):first-child ~ li:nth-child(n+13),

            /*---limit to 4 rows---*/
            .blog-listing.full-rows li:nth-child(n+13) {display:none}
    }











/*---BLOG POST---------------------------------------------------*/
.blog-post {padding:0 0 1em;overflow:hidden}

    /*---header group---*/
    .blog-post header {overflow:hidden}
        .blog-post header h1 {margin-bottom:.7em}
        .blog-post header time {display:block;padding:0 0 .5em;font-size:.8em;font-style:italic}


        @media (min-width:800px) {
            .blog-post header {}
                .blog-post header time {float:left}
                .blog-post header .tags {float:right;padding-left:1em;margin-top:-.5rem}
        }










/*---CONTACT---------------------------------------------------------------------------*/
.contact {}

    /*---street address---*/
    .contact > div {padding:0 0 1em;line-height:1.2}
        .contact > div div:first-child {padding:0 0 .5em;text-transform:uppercase;letter-spacing:.1em}


    /*---links---*/
    .contact a.button:last-of-type {margin-bottom:2rem}