{"id":22,"date":"2019-11-05T20:34:58","date_gmt":"2019-11-05T20:34:58","guid":{"rendered":"http:\/\/pern.local\/?page_id=22"},"modified":"2019-11-05T20:41:23","modified_gmt":"2019-11-05T20:41:23","slug":"patterns","status":"publish","type":"page","link":"https:\/\/dev6-perennialsandsutherland.dev-v2.perennials-development.com\/about\/patterns\/","title":{"rendered":"Patterns"},"content":{"rendered":"\n<div class=\"patterns__container\">\n    <div class=\"patterns__section\">\n        <h2 class=\"styles__secondary-heading\">Colors<\/h2>\n        <div class=\"patterns__content\">\n            <div class=\"grid__lg-row grid__med-row grid__sm-row\">\n                <div class=\"grid__lg-full grid__med-full grid__sm-full\">\n                    <h3 class=\"styles__quaternary-heading\">Primary<\/h3>\n                <\/div>\n                                    <div class=\"grid__lg-quarter grid__md-quarter grid__sm-half\">\n                        <figure class=\"patterns__swatch\n                            background__midnight-garden\"\n                        >\n                            <figcaption class=\"patterns__swatch-caption\n                                hierarchy__columbian-text\n                                styles__heebo-medium\"\n                            >\n                                Midnight Garden &#8211; #0F1002                            <\/figcaption>\n                        <\/figure>\n                    <\/div>\n                                    <div class=\"grid__lg-quarter grid__md-quarter grid__sm-half\">\n                        <figure class=\"patterns__swatch\n                            background__fresh-juniper\"\n                        >\n                            <figcaption class=\"patterns__swatch-caption\n                                hierarchy__columbian-text\n                                styles__heebo-medium\"\n                            >\n                                Fresh Juniper &#8211; #2E301D                            <\/figcaption>\n                        <\/figure>\n                    <\/div>\n                                    <div class=\"grid__lg-quarter grid__md-quarter grid__sm-half\">\n                        <figure class=\"patterns__swatch\n                            background__perennials-green\"\n                        >\n                            <figcaption class=\"patterns__swatch-caption\n                                hierarchy__columbian-text\n                                styles__heebo-medium\"\n                            >\n                                Perennials Green &#8211; #535909                            <\/figcaption>\n                        <\/figure>\n                    <\/div>\n                                    <div class=\"grid__lg-quarter grid__md-quarter grid__sm-half\">\n                        <figure class=\"patterns__swatch\n                            background__calming-gray\"\n                        >\n                            <figcaption class=\"patterns__swatch-caption\n                                hierarchy__columbian-text\n                                styles__heebo-medium\"\n                            >\n                                Calming Gray &#8211; #F6F6F4                            <\/figcaption>\n                        <\/figure>\n                    <\/div>\n                                    <div class=\"grid__lg-quarter grid__md-quarter grid__sm-half\">\n                        <figure class=\"patterns__swatch\n                            background__rosewood\"\n                        >\n                            <figcaption class=\"patterns__swatch-caption\n                                hierarchy__columbian-text\n                                styles__heebo-medium\"\n                            >\n                                Rosewood &#8211; #3E1B2A                            <\/figcaption>\n                        <\/figure>\n                    <\/div>\n                                    <div class=\"grid__lg-quarter grid__md-quarter grid__sm-half\">\n                        <figure class=\"patterns__swatch\n                            background__afterglow-blue\"\n                        >\n                            <figcaption class=\"patterns__swatch-caption\n                                hierarchy__columbian-text\n                                styles__heebo-medium\"\n                            >\n                                Afterglow Blue &#8211; #222740                            <\/figcaption>\n                        <\/figure>\n                    <\/div>\n                            <\/div>\n            <div class=\"grid__lg-row grid__med-row grid__sm-row\">\n                <div class=\"grid__lg-full grid__med-full grid__sm-full\">\n                    <h3 class=\"styles__quaternary-heading\">Secondary<\/h3>\n                <\/div>\n                                    <div class=\"grid__lg-quarter grid__md-quarter grid__sm-half\">\n                        <figure class=\"patterns__swatch\n                            background__gathering-moss\"\n                        >\n                            <figcaption class=\"patterns__swatch-caption\n                                hierarchy__columbian-text\n                                styles__heebo-medium\"\n                            >\n                                Gathering Moss &#8211; #C5C7A7                            <\/figcaption>\n                        <\/figure>\n                    <\/div>\n                                    <div class=\"grid__lg-quarter grid__md-quarter grid__sm-half\">\n                        <figure class=\"patterns__swatch\n                            background__drizzle-grey\"\n                        >\n                            <figcaption class=\"patterns__swatch-caption\n                                hierarchy__columbian-text\n                                styles__heebo-medium\"\n                            >\n                                Drizzle Grey &#8211; #767676                            <\/figcaption>\n                        <\/figure>\n                    <\/div>\n                            <\/div>\n        <\/div>\n    <\/div>\n\n    <div class=\"patterns__section\">\n        <h2 class=\"styles__secondary-heading\">Typographic Scale<\/h2>\n        <div class=\"patterns__content\">\n            <p class=\"hierarchy__inch-text\">Inch 68px<\/p>\n            <p class=\"hierarchy__canon-text\">Canon 48px<\/p>\n            <p class=\"hierarchy__meridian-text\">Meridian 36px<\/p>\n            <p class=\"hierarchy__tertia-text\">Tertia 28px<\/p>\n            <p class=\"hierarchy__paragon-text\">Paragon 24px<\/p>\n            <p class=\"hierarchy__columbian-text\">Columbian 18px<\/p>\n            <p class=\"hierarchy__normal-text\">Normal 16px<\/p>\n            <p class=\"hierarchy__primer-text\">Primer 14px<\/p>\n            <p class=\"hierarchy__petite-text\">Petite 12px<\/p>\n            <p class=\"hierarchy__minion-text\">Minion 10px<\/p>\n        <\/div>\n    <\/div>\n\n    <div class=\"patterns__section\">\n        <h2 class=\"styles__secondary-heading\">Header Styles<\/h2>\n        <div class=\"patterns__content\">\n            <h1 class=\"styles__primary-heading\">Primary Heading<\/h1>\n            <h2 class=\"styles__secondary-heading\">Secondary Heading<\/h2>\n            <h3 class=\"styles__tertiary-heading\">Tertiary Heading<\/h3>\n            <h4 class=\"styles__quaternary-heading\">Quaternary Heading<\/h4>\n            <h5 class=\"styles__quinary-heading\">Quinary Heading<\/h5>\n            <h6 class=\"styles__senary-heading\">Senary Heading<\/h6>\n        <\/div>\n    <\/div>\n\n    <div class=\"patterns__section\">\n        <h2 class=\"styles__secondary-heading\">Text Styles<\/h2>\n        <div class=\"patterns__content\">\n            <div class=\"patterns__text-block\">\n                <div class=\"hierarchy__petite-text\">Paragraph Large<\/div>\n                <p class=\"styles__paragraph-text--large\">You\u2019re about to be handed a dazzling array of tools to bring our immersive brand to life in a consistent and consistently inspiring way. This document isn\u2019t just a set of rules. Far from it. Instead, its purpose is to provide structure to your creativity and a platform for your imagination.<\/p>\n            <\/div>\n            <div class=\"patterns__text-block\">\n                <div class=\"hierarchy__petite-text\">Body Text<\/div>\n                <p class=\"styles__body-text\">You\u2019re about to be handed a dazzling array of tools to bring our immersive brand to life in a consistent and consistently inspiring way. This document isn\u2019t just a set of rules. Far from it. Instead, its purpose is to provide structure to your creativity and a platform for your imagination.<\/p>\n            <\/div>\n            <div class=\"patterns__text-block\">\n                <div class=\"hierarchy__petite-text\">Paragraph Small<\/div>\n                <p class=\"styles__paragraph-text--small\">You\u2019re about to be handed a dazzling array of tools to bring our immersive brand to life in a consistent and consistently inspiring way. This document isn\u2019t just a set of rules. Far from it. Instead, its purpose is to provide structure to your creativity and a platform for your imagination.<\/p>\n            <\/div>\n            <div class=\"patterns__text-block\">\n                <div class=\"hierarchy__petite-text\">Paragraph Caption<\/div>\n                <p class=\"styles__paragraph-text--caption\">You\u2019re about to be handed a dazzling array of tools to bring our immersive brand to life in a consistent and consistently inspiring way. This document isn\u2019t just a set of rules. Far from it. Instead, its purpose is to provide structure to your creativity and a platform for your imagination.<\/p>\n            <\/div>\n        <\/div>\n    <\/div>\n\n    <div class=\"patterns__section\">\n        <h2 class=\"styles__secondary-heading\">Buttons<\/h2>\n        <div class=\"patterns__content\">\n            <div class=\"grid__lg-row grid__med-row grid__sm-row\">\n                <div class=\"grid__lg-quarter grid__med-quarter grid__sm-full\">\n                    <h3 class=\"styles__quaternary-heading\">Primary<\/h3>\n                    <button class=\"button__primary spacing__mtm\" type=\"button\">Learn More<\/button>\n                    <div class=\"hierarchy__petite-text\">Regular<\/div>\n                    <button class=\"button__primary spacing__mtm\" type=\"button\" disabled>Learn More<\/button>\n                    <div class=\"hierarchy__petite-text\">Disabled<\/div>\n                <\/div>\n                <div class=\"grid__lg-quarter grid__med-quarter grid__sm-full\">\n                    <h3 class=\"styles__quaternary-heading\">Secondary<\/h3>\n                    <button class=\"button__secondary spacing__mtm\" type=\"button\">Register<\/button>\n                    <div class=\"hierarchy__petite-text\">Regular<\/div>\n                    <button class=\"button__secondary spacing__mtm\" type=\"button\" disabled>Register<\/button>\n                    <div class=\"hierarchy__petite-text\">Disabled<\/div>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n\n    <div class=\"patterns__section\">\n        <h2 class=\"styles__secondary-heading\">Links<\/h2>\n        <div class=\"patterns__content\">\n            <a class=\"links__link\" href=\"#\">Primary Link<\/a>\n        <\/div>\n    <\/div>\n\n    <div class=\"patterns__section\">\n        <h2 class=\"styles__secondary-heading\">Icons<\/h2>\n        <div class=\"patterns__content patterns__icons\">\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#info\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        info                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#asterisk\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        asterisk                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#calendar-icon\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        calendar-icon                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#wand\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        wand                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-check-circle\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-check-circle                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-cube\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-cube                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#minus\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        minus                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#edit_pencil\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        edit_pencil                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#mail-icon\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        mail-icon                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#flickr\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        flickr                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#cart\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        cart                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#nav-right\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        nav-right                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#clock-icon\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        clock-icon                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#marker\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        marker                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-video\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-video                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-quickship\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-quickship                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-ruler\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-ruler                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#location\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        location                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#carrot-left\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        carrot-left                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#calendar\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        calendar                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-swatch-sample\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-swatch-sample                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#nav-down\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        nav-down                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-pen-tool\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-pen-tool                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#nav-left\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        nav-left                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#carrot-down-green\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        carrot-down-green                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#arrow-down\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        arrow-down                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#camera\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        camera                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-zoom\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-zoom                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#star-outline\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        star-outline                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#play\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        play                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#pern-show-icon\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        pern-show-icon                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#heart_outline2\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        heart_outline2                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-cylindo-360\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-cylindo-360                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#image\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        image                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#check-circle\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        check-circle                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#pinterest\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        pinterest                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#heart-outline\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        heart-outline                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#save\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        save                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#tumblr\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        tumblr                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-share\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-share                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#pern-hide-icon\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        pern-hide-icon                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#carrot-up-green\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        carrot-up-green                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-binoculars\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-binoculars                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-search\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-search                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#account\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        account                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#carrot-down\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        carrot-down                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#alert\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        alert                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#chat\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        chat                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#home\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        home                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#dropdown\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        dropdown                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#wordpress\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        wordpress                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#plus\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        plus                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-fabric-roll\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-fabric-roll                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#vimeo\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        vimeo                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#filter\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        filter                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-user\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-user                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#arrow-left\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        arrow-left                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-question-circle\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-question-circle                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#vine\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        vine                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-phone\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-phone                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#warning-circle\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        warning-circle                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#map-pin\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        map-pin                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#check-circle-dashed\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        check-circle-dashed                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#check\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        check                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#close-circle\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        close-circle                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-fullscreen\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-fullscreen                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#arrow-right-light\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        arrow-right-light                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#nav-up\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        nav-up                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#refresh\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        refresh                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#facebook\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        facebook                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#carrot-down-white\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        carrot-down-white                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-clock\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-clock                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#share\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        share                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#rotate-cylindo\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        rotate-cylindo                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#plus-icon\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        plus-icon                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-download-tearsheet\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-download-tearsheet                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-close\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-close                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-menu\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-menu                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#arrow-right\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        arrow-right                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#carrot-right\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        carrot-right                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#mail\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        mail                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#twitter\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        twitter                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#delete\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        delete                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#caret-right-grey-brown\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        caret-right-grey-brown                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#rss\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        rss                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#instagram\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        instagram                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-download-large\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-download-large                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-calendar\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-calendar                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#google-plus\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        google-plus                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#trash\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        trash                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#couch\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        couch                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#clock\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        clock                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-quote\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-quote                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#caret-left-grey-brown\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        caret-left-grey-brown                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-ruler-pencil\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-ruler-pencil                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#navigation-icon\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        navigation-icon                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#linkedin-sq\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        linkedin-sq                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#roll\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        roll                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#settings\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        settings                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#search\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        search                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-price-tag\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-price-tag                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#location-icon\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        location-icon                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#arrow-up\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        arrow-up                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#facebook-sq\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        facebook-sq                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#carrot-up\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        carrot-up                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-warning-circle\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-warning-circle                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#search-icon\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        search-icon                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-cart\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-cart                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#arrow-right-dark\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        arrow-right-dark                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#checkmark\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        checkmark                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#edit_pencil_2\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        edit_pencil_2                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#heart-fill\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        heart-fill                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-heart\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-heart                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#linkedin\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        linkedin                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-logout\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-logout                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-arrow-right\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-arrow-right                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#list\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        list                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#star-fill\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        star-fill                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#pom\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        pom                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#edit\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        edit                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#heart_outline\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        heart_outline                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#close\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        close                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-add-to-cart\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-add-to-cart                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-mail\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-mail                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#suth-check\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        suth-check                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#trash-green\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        trash-green                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#minus-icon\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        minus-icon                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#rows\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        rows                    <\/div>\n                <\/div>\n                            <div class=\"patterns__icon\">\n                    <svg class=\"icons__icon\">\n                        <use xlink:href=\"#youtube\"><\/use>\n                    <\/svg>\n                    <div class=\"hierarchy__minion-text\">\n                        youtube                    <\/div>\n                <\/div>\n                    <\/div>      \n    <\/div>\n\n    <div class=\"patterns__section\">\n        <h2 class=\"styles__secondary-heading\">Forms<\/h2>\n        <div class=\"patterns__content\">\n            <div class=\"grid__lg-row\">\n                <div class=\"grid__lg-third\">\n                    <form class=\"js-gauntlet\">\n                        \n<label class=\"input__label  \">\n\n    <input\n                class=\"input__field js-input-filled  \"\n                type=\"email\"\n        name=\"email\"\n        tabindex=\"\"\n        step=\"\"\n        value=\"\"\n        min=\"0\"\n        placeholder=\"Ex: name@example.com\"        required                    >\n        \n            <span class=\"input__label-text\">\n            Email Address        <\/span>\n        <svg class=\"input__validation-icon--success\" aria-hidden=\"true\">\n        <use xlink:href=\"#check-circle\"><\/use>\n    <\/svg>\n\n    <svg class=\"input__validation-icon--error\" aria-hidden=\"true\">\n        <use xlink:href=\"#warning-circle\"><\/use>\n    <\/svg>\n\n    <span class=\"input__alert\"\n        aria-live=\"assertive\"\n        aria-relevant=\"additions removals\"\n    ><\/span>\n<\/label>\n                        <button class=\"form__submit spacing__mtm\" type=\"submit\">Submit<\/button>\n                    <\/form>\n                <\/div>\n            <\/div>\n        <\/div>\n        <div class=\"grid__lg-row\">\n            <div class=\"grid__lg-full\">\n                <div class=\"spacing__mtl\">\n                    <label class=\"radio__label \">\n    <input\n        class=\"radio__input \"\n        type=\"radio\"\n        name=\"colors[]\"\n        value=\"reds\"\n                                    >\n    <span class=\"radio__psuedo\"><\/span>\n            <span class=\"radio__label-text\">\n            Reds        <\/span>\n    <\/label>\n                    <label class=\"radio__label \">\n    <input\n        class=\"radio__input \"\n        type=\"radio\"\n        name=\"colors[]\"\n        value=\"oranges\"\n                                    >\n    <span class=\"radio__psuedo\"><\/span>\n            <span class=\"radio__label-text\">\n            Oranges        <\/span>\n    <\/label>\n                    <label class=\"radio__label \">\n    <input\n        class=\"radio__input \"\n        type=\"radio\"\n        name=\"colors[]\"\n        value=\"blues\"\n                                    >\n    <span class=\"radio__psuedo\"><\/span>\n            <span class=\"radio__label-text\">\n            Blues        <\/span>\n    <\/label>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_relevanssi_hide_post":"","_relevanssi_hide_content":"","_relevanssi_pin_for_all":"","_relevanssi_pin_keywords":"","_relevanssi_unpin_keywords":"","_relevanssi_related_keywords":"","_relevanssi_related_include_ids":"","_relevanssi_related_exclude_ids":"","_relevanssi_related_no_append":"","_relevanssi_related_not_related":"","_relevanssi_related_posts":"","_relevanssi_noindex_reason":""},"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v20.3 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Patterns | Perennials and Sutherland<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.perennialsfabrics.com\/patterns\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Patterns | Perennials Fabrics\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.perennialsfabrics.com\/patterns\/\" \/>\n<meta property=\"og:site_name\" content=\"Perennials Fabrics\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/perennialsfabrics\/\" \/>\n<meta property=\"article:modified_time\" content=\"2019-11-05T20:41:23+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/perennials.imgix.net\/wp-content\/uploads\/2019\/11\/15220349\/logo-green.png\" \/>\n\t<meta property=\"og:image:width\" content=\"286\" \/>\n\t<meta property=\"og:image:height\" content=\"18\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:site\" content=\"@PerennialsFabs\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.perennialsfabrics.com\/patterns\/\",\"url\":\"https:\/\/www.perennialsfabrics.com\/patterns\/\",\"name\":\"Patterns | Perennials Fabrics\",\"isPartOf\":{\"@id\":\"https:\/\/www.perennialsandsutherland.com\/#website\"},\"datePublished\":\"2019-11-05T20:34:58+00:00\",\"dateModified\":\"2019-11-05T20:41:23+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.perennialsfabrics.com\/patterns\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.perennialsfabrics.com\/patterns\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.perennialsfabrics.com\/patterns\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.perennialsfabrics.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Patterns\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.perennialsandsutherland.com\/#website\",\"url\":\"https:\/\/www.perennialsandsutherland.com\/\",\"name\":\"Perennials Fabrics\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/www.perennialsandsutherland.com\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.perennialsandsutherland.com\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.perennialsandsutherland.com\/#organization\",\"name\":\"Perennials Fabrics\",\"url\":\"https:\/\/www.perennialsandsutherland.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.perennialsandsutherland.com\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/perennials.imgix.net\/wp-content\/uploads\/2019\/11\/15220349\/logo-green.png\",\"contentUrl\":\"https:\/\/perennials.imgix.net\/wp-content\/uploads\/2019\/11\/15220349\/logo-green.png\",\"width\":286,\"height\":18,\"caption\":\"Perennials Fabrics\"},\"image\":{\"@id\":\"https:\/\/www.perennialsandsutherland.com\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/perennialsfabrics\/\",\"https:\/\/twitter.com\/PerennialsFabs\",\"http:\/\/instagram.com\/perennialsfabrics\",\"https:\/\/www.linkedin.com\/company\/3492712\/\",\"http:\/\/www.pinterest.com\/perennialsfab\/\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Patterns | Perennials and Sutherland","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.perennialsfabrics.com\/patterns\/","og_locale":"en_US","og_type":"article","og_title":"Patterns | Perennials Fabrics","og_url":"https:\/\/www.perennialsfabrics.com\/patterns\/","og_site_name":"Perennials Fabrics","article_publisher":"https:\/\/www.facebook.com\/perennialsfabrics\/","article_modified_time":"2019-11-05T20:41:23+00:00","og_image":[{"width":286,"height":18,"url":"https:\/\/perennials.imgix.net\/wp-content\/uploads\/2019\/11\/15220349\/logo-green.png","type":"image\/png"}],"twitter_card":"summary_large_image","twitter_site":"@PerennialsFabs","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.perennialsfabrics.com\/patterns\/","url":"https:\/\/www.perennialsfabrics.com\/patterns\/","name":"Patterns | Perennials Fabrics","isPartOf":{"@id":"https:\/\/www.perennialsandsutherland.com\/#website"},"datePublished":"2019-11-05T20:34:58+00:00","dateModified":"2019-11-05T20:41:23+00:00","breadcrumb":{"@id":"https:\/\/www.perennialsfabrics.com\/patterns\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.perennialsfabrics.com\/patterns\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.perennialsfabrics.com\/patterns\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.perennialsfabrics.com\/"},{"@type":"ListItem","position":2,"name":"Patterns"}]},{"@type":"WebSite","@id":"https:\/\/www.perennialsandsutherland.com\/#website","url":"https:\/\/www.perennialsandsutherland.com\/","name":"Perennials Fabrics","description":"","publisher":{"@id":"https:\/\/www.perennialsandsutherland.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.perennialsandsutherland.com\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.perennialsandsutherland.com\/#organization","name":"Perennials Fabrics","url":"https:\/\/www.perennialsandsutherland.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.perennialsandsutherland.com\/#\/schema\/logo\/image\/","url":"https:\/\/perennials.imgix.net\/wp-content\/uploads\/2019\/11\/15220349\/logo-green.png","contentUrl":"https:\/\/perennials.imgix.net\/wp-content\/uploads\/2019\/11\/15220349\/logo-green.png","width":286,"height":18,"caption":"Perennials Fabrics"},"image":{"@id":"https:\/\/www.perennialsandsutherland.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/perennialsfabrics\/","https:\/\/twitter.com\/PerennialsFabs","http:\/\/instagram.com\/perennialsfabrics","https:\/\/www.linkedin.com\/company\/3492712\/","http:\/\/www.pinterest.com\/perennialsfab\/"]}]}},"_links":{"self":[{"href":"https:\/\/dev6-perennialsandsutherland.dev-v2.perennials-development.com\/about\/wp-json\/wp\/v2\/pages\/22"}],"collection":[{"href":"https:\/\/dev6-perennialsandsutherland.dev-v2.perennials-development.com\/about\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/dev6-perennialsandsutherland.dev-v2.perennials-development.com\/about\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/dev6-perennialsandsutherland.dev-v2.perennials-development.com\/about\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/dev6-perennialsandsutherland.dev-v2.perennials-development.com\/about\/wp-json\/wp\/v2\/comments?post=22"}],"version-history":[{"count":2,"href":"https:\/\/dev6-perennialsandsutherland.dev-v2.perennials-development.com\/about\/wp-json\/wp\/v2\/pages\/22\/revisions"}],"predecessor-version":[{"id":26,"href":"https:\/\/dev6-perennialsandsutherland.dev-v2.perennials-development.com\/about\/wp-json\/wp\/v2\/pages\/22\/revisions\/26"}],"wp:attachment":[{"href":"https:\/\/dev6-perennialsandsutherland.dev-v2.perennials-development.com\/about\/wp-json\/wp\/v2\/media?parent=22"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}