/*
    GENERICS
*/
div,
span,
object,
iframe,
img,
table,
caption,
thead,
tbody,
tfoot,
tr,
tr,
td,
article,
aside,
canvas,
details,
figure,
hgroup,
menu,
nav,
footer,
header,
section,
summary,
mark,
audio,
video {
    border: 0;
    margin: 0;
    padding: 0;
}

.flex {
    display: flex;
}

.hide {
    display: none;
}

.half-width {
    width: 50%;
}

.blog,
.selections,
.in-use,
.templates,
.thumbnails {
    min-height: 100vh;
}

.max-w-60 {
    max-width: 60%;
    display: inline-block;
}

/**************************
    Top & Bottom Navigation
**************************/

.top-nav {
    white-space: nowrap;
}

/*FOOTER*/
/* Prevent TYPENETWORK link from getting active state */
[href="Fonts"] + [href="Fonts"] {
    background: transparent !important;
    color: var(--blue) !important;
    border-bottom: none !important;
}


/**************************
    BROWSER WINDOW OUTLINES
**************************/
.templates a.image-link,
.sites-in-use a.image-link,
.blog [data-container="page"].new a.image-link,
.blog .legacy a.pad-bottom-trick {
    position: relative;
    padding-bottom: calc(62.5% + 1.7rem) !important;
    height: 0;
    vertical-align: top;
    display: inline-block !important;
    line-height: 0;
    margin: 0;
}

.blog [data-container="page"].new a.image-link {
    padding-bottom: calc(64.5% + 1.7rem) !important;
    width: calc(100% - 32px);
}

.blog *not:([data-staff-pick-image]) .legacy a.image-link.pad-bottom-trick.half-width,
.blog *not:([data-featured-in-use]) .legacy a.image-link.pad-bottom-trick.half-width {
    padding-bottom: calc(67.5% + 3.2rem) !important;
    width: 50% !important;
    border-bottom: none !important;
    margin: 0 auto;
}

.blog bodycopy .gallery_image_caption a,
.blog span,
.blog small,
.blog a {
    border-bottom: 0 !important;
    color: inherit !important;
}

.templates a.image-link:after,
.sites-in-use a.image-link:after {
    content: '';
    position: absolute;
    left: -15px;
    right: -15px;
    bottom: -15px;
    top: -15px;
    box-shadow: 0px 0px 0px 1px var(--blue-outline);
    border-radius: 10px;
    z-index: -1;
}

/* Needs to have different border bottom due to size */
.blog [data-staff-pick-image] a.image-link:after {
    content: '';
    position: absolute;
    left: -15px;
    right: -15px;
    bottom: -14px;
    top: -15px;
    box-shadow: 0px 0px 0px 1px var(--blue-outline);
    border-radius: 10px;
    z-index: -1;
}

/* Hack for new blog Roo */
/*.blog [data-container="page"].new [staff-pick-grid] [data-staff-pick-image].new-ratio a.image-link.new_ratio {
  margin-top: -1px;
  max-width: 70%;
  padding-bottom: calc(43.8% + 1.7rem) !important;
}*/
/* Roo */
/*body.mobile .blog [data-container="page"].new [staff-pick-grid] [data-staff-pick-image].new-ratio a.image-link.new_ratio {
  margin-top: -1px;
  max-width: 70%;
  padding-bottom: calc(62.5% + 1.7rem) !important;
}*/

.templates a.image-link img,
.sites-in-use a.image-link img,
.blog [data-container="page"].new a.image-link:not(.no-border) img,
.blog .legacy a.pad-bottom-trick img,
.blog [data-in-use-grid] a img {
    padding: 0px;
    outline: 1px solid var(--blue-outline);
    outline-offset: -1px;
    margin-top: -.5px;
    max-width: 100%;
    width: 100% !important;
    height: auto !important;
}

.templates a.image-link .template_video_wrapper:after {
    content: '';
    outline: 1px solid var(--blue-outline);
    outline-offset: -1px;
    position: absolute;
    top: calc(1.7rem - .5px); 
    left: 0; right: 0; bottom: 0;
}

.templates a.image-link .template_video_wrapper:before {
    content: '';
    position: absolute;
    right: -4px;
    width: 4px;
    background: white;
    z-index: 999;
    height: 100%;
    top: 0;
}

.templates a.image-link .template_video_frame {
    position: absolute; 
    top: calc(1.7rem - .5px); 
    bottom: 0 !important; 
    height: calc(100% - 1.7rem);
    right: 0px; 
    left: 0px;
    width: calc(100%); 
    contain: strict;
    /*right: -1px; 
    left: -1px;
    width: calc(100% + 2px); */
}

.templates .iframe_wrapper,
.sites-in-use .iframe_wrapper,
.blog .iframe_wrapper {
    position: relative;
    line-height: 0;
}

.templates .iframe_wrapper:before,
.sites-in-use .iframe_wrapper:before,
.blog .iframe_wrapper:before {
    outline: 1px solid var(--blue-outline);
    outline-offset: -1px;
    line-height: 0;
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 99;
}

.site_header {
    height: 1.7rem;
    border-top: 1px solid var(--blue-outline);
    border-left: 1px solid var(--blue-outline);
    border-right: 1px solid var(--blue-outline);
    border-radius: 0;
    background: rgba(255, 255, 255, 1);
    border-bottom: none;
    z-index: -1;
    vertical-align: top;
    line-height: 0;
    padding: .3rem 0 0 3rem;
    position: relative;
}

.header_buttons>div {
    display: inline-block;
    margin-left: -2.4rem;
    width: 6rem;
    height: 6rem;
    border-radius: 100%;
    transform: scale(.15);
    transform-origin: 0 0;
    margin-right: -2.4rem;
    /* margin-top: -1em; */
    border: 6px solid var(--blue-outline);
}

body [data-page-id="8990445"] .loading_animation {
}

/**************************
    SITES IN USE 
**************************/

[data-page-id="9145893"] [data-container="page"][data-id=""] {
    height: 0;
}

[data-inuse-filter-container] .templates-list {
    max-width: 70%;
    margin: 0 auto;
}

[data-inuse-filter-container] .templates-list a {
    white-space: nowrap;
    border-radius: 10rem;
    padding: 0.05rem 1.2rem 0.1rem 1.2rem;
}

[thumbnails=grid] {
    align-items: baseline;
}

.thumbnails {
    /*height: auto !important;*/
    /*padding-bottom: 0 !important;*/
}

.thumbnails [thumbnails] {
    justify-content: center;
}

.thumbnails [thumbnails] .thumbnail>a {
    display: block;
    text-decoration: none;
}

.thumbnails .updated-url {
    cursor: pointer;
}

.thumbnail .thumb_image {
    padding-bottom: calc(71.3% + 1.7rem) !important;
    overflow: hidden;
    min-height: 200px;
}

.thumbnail .new_ratio .thumb_image {
    padding-bottom: calc(62.5% + 1.7rem) !important;
}

.thumbnail .thumb_image:after {
    content: '';
    position: absolute;
    top: calc(1.7rem - 1px);
    bottom: 0;
    left: 0;
    right: 0;
    outline-offset: -1px;
    outline: 1px solid var(--blue-outline);
}

/* In Use Browser Window */
[data-css-preset] .thumbnail[thumbnails-pad] {
    padding: calc(0.75rem + 15px) !important;
    padding-bottom: 6rem !important;
}

.thumbnails a.image-link {
    position: relative;
    height: 0;
    vertical-align: top;
    display: inline-block;
    line-height: 0;
    margin: 0;
    min-height: 200px;
}

.thumbnails .thumbnail.formatted a.image-link {
    padding-bottom: calc(71.3% + 1.7rem) !important;
}

.thumbnails .thumbnail.formatted a.image-link.new_ratio {
    padding-bottom: calc(62.5% + 1.7rem) !important;
}

/*.thumbnails .thumb_image {
  padding-bottom: calc(71.35% + 1.7rem) !important;
}
*/
.thumbnails [thumbnails] .thumbnail>a:after {
    z-index: -1;
    content: '';
    position: absolute;
    left: -15px;
    right: -15px;
    bottom: -15px;
    top: -15px;
    box-shadow: 0px 0px 0px 1px var(--blue-outline);
    border-radius: 10px;
}

.thumbnails a.image-link img {
    padding: 0px;
    /*outline: 1px solid var(--blue-outline);*/
    outline-offset: -1px;
    margin-top: -.5px;
    max-width: 100%;
    width: 100% !important;
    height: auto !important;
}

/* Featured Site Styles */

.thumbnails .featured_thumb_wrapper {
    width: 100%;
    justify-content: center;
    display: flex;
}

body:not(.mobile) .thumbnails [thumbnails] .thumbnail.featured {
    width: 50%;
}

/* In Use -- Text Positioning & Styles */

.thumbnails .title {
    display: none;
}

.thumbnails .inuse_info {
    padding-top: 16px;
    text-align: center;
}

.thumbnails .inuse_info a, 
.thumbnails .inuse_info span {
    display: block;
    color: var(--blue);
    text-decoration: none;
    font-size: 1.3rem;
    line-height: 1.4;
    font-style: normal;
    font-weight: 400;
    padding-bottom: 0;
    padding-top: 1.05em;
}


.thumbnails .inuse_info .progenitor_template a,
.thumbnails .inuse_info .progenitor_template span {
    display: inline-block;
    padding-top: 0;
    color: var(--blue);
    border-bottom: 0.0em solid var(--blue-border);
}

/**************************
    SELECTIONS
**************************/

.selections .image-gallery.initialized .gallery_card_image {
    padding-bottom: 0 !important;
    /*height: calc(25vw - .75rem) !important;*/
    height: calc(25vw - 1.875rem - 0px) !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
}

.selections .initialized .gallery_image_caption {
    opacity: 0;
    white-space: nowrap;
    overflow: hidden;
    margin-top: 0;
    margin-bottom: 0.5rem;
    padding-top: 1em;
    text-align: center;
    min-height: 3.5em;
}

.selections .initialized .gallery_image_caption.selections_format {
    opacity: 1;
}


.selections .content img {
    float: none;
    margin-bottom: 0em;
    outline: 1px solid rgba(0, 0, 0, .08);
    outline-offset: -1px;
}

.selections .seemore+[grid-row] {
    padding-top: 5rem;
}

.selections .initialized .gallery_card:hover .selection_insta {
    opacity: 1;
}

.selections .image-gallery.initialized .gallery_card {
    align-self: stretch;
}

.selections .image-gallery.initialized .gallery_card_image.portrait img {
    height: 100% !important;
    width: auto !important;
}

.selections .image-gallery.initialized {
    padding: 1.5rem .75rem !important;
    margin: -1.5rem !important;
}

.selections .image-gallery.initialized .gallery_card[image-gallery-pad] {
    padding: 1.75rem .75rem !important;
}

.selections .image-gallery.initialized .gallery_card[image-gallery-pad]:nth-child(4n+1) {
    /*padding-left: 0rem !important;*/
    /*margin-left: -.75rem;*/
}

.selections .image-gallery.initialized .gallery_card[image-gallery-pad]:nth-child(4n+4) {
    /*padding-right: 0rem !important;*/
    /*margin-right: -.75rem;*/
}

.selections .content .page_content hr {
    margin-bottom: 5rem;
}

.selections .see-more,
.selections .ext-insta {
    display: none;
}

.selections .page_container {
    position: relative;
    overflow: visible;
    width: 100%;
}

.selections .page mono a.active {
    color: rgba(0, 0, 0, .85);
    border-bottom: 0;
    opacity: 1;
}

.selections [data-predefined-style="true"] bodycopy {
    color: var(--blue);
}

.selections [data-container="page"] .initialized .gallery_image_caption a:first-child {
    max-width: 90%;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

body:not([data-adminview="content-editproject"])[data-page-id="9146424"] .selections [data-container="page"] {
    /*margin-top: -1vh;*/
    max-height: calc(100vw + 43rem);
}

body:not([data-adminview="content-editproject"])[data-page-id="9146424"] .selections [data-container="page"]:first-child {
    max-height: calc(100vw + 25rem);
}

body:not([data-adminview="content-editproject"]) .selections [data-container="page"]:first-child {
    padding-top: 0;
}

body:not([data-adminview="content-editproject"])[data-page-id="9146424"] .selections [data-container="page"]:not(:first-child) {
    padding-top: 18.5rem;
    background: white;
    z-index: 2;
    box-shadow: 0px -8px 9rem var(--blue-outline);
}

/*body:not([data-adminview="content-editproject"])[data-page-id="9146424"] .selections [data-container="page"]:last-child {
    box-shadow: none;
}
*/
body:not([data-adminview="content-editproject"]):not([data-page-id="9146424"]) .selections [data-container="page"] {
    padding-bottom: 6.5rem;
}

.selections [data-container="page"] h1 a.active {
    background: transparent;
    color: var(--blue);
}

.selections a.seemore {
    position: absolute;
    top: calc(-16.5rem + 3px);
    left: 50%;
    transform: translate(-50%, 0);
    background: transparent;
    padding: 1rem 1.5rem;
    line-height: 1;
    height: 3.5rem;
    z-index: 9999;
    /* outline: 1px solid #ddd; */
    padding-top: 2rem;
    margin-bottom: 3rem;
    font-size: var(--small);
    /*text-transform: uppercase;*/
}

body:not([data-page-id="9146424"]) a.seemore {
    display: none;
}

.selections .content .circle-instagram img {
    height: 3.5em !important;
    opacity: 1;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -25%);
    width: auto !important;
    margin-bottom: 0;
    outline: none !important;
}

[data-predefined-style="true"] .selections bodycopy .gallery_image_caption {
    line-height: 1.2;
}

[data-predefined-style="true"] .selections bodycopy .gallery_image_caption a {
    padding-bottom: 0;
}


/*STUDENTS*/
body:not(.mobile) .students,
body:not(.mobile) .nonprofits {
    min-height: 100vh;
}


/**************************
   DOMAIN SEARCH
**************************/

[local-style="9193227"] {
    min-height: 100vh;
}

#domain_wrapper_wrapper {
    margin-bottom: 4em;
    min-height: 4.5rem;
}

#domain_wrapper #search {
    max-width: 37rem;
    margin: 0 auto;
    text-align: left;
}

/*Hide things by default*/
#domain_wrapper summary,
[data-domain-search] .submit,
.admin-wrapper .text:after,
.admin-wrapper .text:before,
#domain_wrapper [data-message],
#domain_wrapper [data-destination="settings"],
#domain_wrapper [data-domain-settings],
#domain_wrapper [data-domain-settings] * {
    display: none;
}

#domain_wrapper [data-input-parent] {
    padding: 0 !important;
}

[data-domainlist-set-toggle] {
    font-size: 1.4rem;
}

#domain_wrapper input[name="query"] {
    font-size: 1.8rem;
    border: 1px solid var(--blue-outline);
    display: inline-block;
    padding: .75rem .75rem .75rem 1.5rem;
    font-family: inherit;
    line-height: 1.2;
    color: var(--blue);
    font-family: var(--main-font);
    width: 100%;
    line-height: 1.3;
}

/*#domain_wrapper [data-input-parent]:not(.placehold):after  {
    display: block;
    content: '︎Or start with a Domain...';
    position: absolute;
    top: 1px;
    left: 0;
    right: 0;
    bottom: 0;
    padding: .75rem;
    font-family: var(--main-font);
    font-weight: 400;
    letter-spacing: inherit;
    text-rendering: optimizeLegibility;
    pointer-events: none;
}*/

body.safari #domain_wrapper [data-input-parent]:not(.placehold):after,
body.safari #domain_wrapper [data-input-parent]:not(.placehold):before {
    line-height: 1.5;    
}


/*[data-id="9193227"] #domain_wrapper [data-input-parent]:not(.placehold):after {
    content: '︎Enter the domain you want...';
}*/

/*#domain_wrapper [data-input-parent]:not(.placehold):before {
    content: '|';
    position: absolute;
    top: 1px;
    left: 19ch;
    right: 0;
    bottom: 0;
    padding: .75rem;
    font-family: var(--main-font);
    font-weight: 400;
    letter-spacing: inherit;
    text-rendering: optimizeLegibility;
    pointer-events: none;
    display: block;
    animation: 1s infinite blink;
}

.domains #domain_wrapper [data-input-parent]:not(.placehold):before {
    left: 22ch;
}*/

#domain_wrapper input[type="text"]::-webkit-input-placeholder {
    font-size: 0;
    color: transparent;
}

.admin-wrapper .row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  min-height: 4rem;
  width: 100%;
}

.admin-wrapper .col {
  min-height: 4rem;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
  position: relative;
}
.admin-wrapper .col-third {
  width: 36%;
}
.admin-wrapper .col-half {
  width: 50%;
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 50%;
      -ms-flex: 0 0 50%;
          flex: 0 0 50%;
}
.admin-wrapper .col-full {
  -webkit-box-flex: 1;
  -webkit-flex: 1 0 100%;
      -ms-flex: 1 0 100%;
          flex: 1 0 100%;
}
.admin-wrapper .col-square {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 4.0rem;
      -ms-flex: 0 0 4.0rem;
          flex: 0 0 4.0rem;
}
.admin-wrapper .col-narrow {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 3rem;
      -ms-flex: 0 0 3rem;
          flex: 0 0 3rem;
}
.admin-wrapper .col-1-3 {
  -webkit-box-flex: 1;
  -webkit-flex: 1 0 33.3%;
      -ms-flex: 1 0 33.3%;
          flex: 1 0 33.3%;
}
.admin-wrapper .col-2-3 {
  -webkit-box-flex: 1;
  -webkit-flex: 1 0 66.3%;
      -ms-flex: 1 0 66.3%;
          flex: 1 0 66.3%;
}
.admin-wrapper .col-left {
  -webkit-align-self: flex-start;
      -ms-flex-item-align: start;
          align-self: flex-start;
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 auto;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
}
.admin-wrapper .col-right {
  -webkit-align-self: flex-end;
      -ms-flex-item-align: end;
          align-self: flex-end;
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 auto;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
}

.admin-wrapper .pad-small {
  padding: 0.75rem 1.5rem;
}

.admin-wrapper .pad-y-small {
  padding-bottom: 0.75rem;
  padding-top: 0.75rem;
}

.admin-wrapper .pad-x-small {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}

.admin-wrapper .pad-y-reset {
  padding-top: 0;
  padding-bottom: 0;
}
.admin-wrapper .pad-bottom-small {
  padding-bottom: 0.75rem;
}
.admin-wrapper .pad-medium {
  padding: 3rem;
}
.admin-wrapper .pad-y-medium {
  padding: 3rem 0;
}
.admin-wrapper .pad-x-medium {
  padding-left: 3rem;
  padding-right: 3rem;
}
.admin-wrapper .pad-small-medium {
  padding: 0.75rem 3rem;
}
.admin-wrapper .pad-bottom-small-medium {
  padding: 0 3rem 0.75rem 3rem;
}
.admin-wrapper .pad-medium-small-y {
  padding: 3rem 0 1.5rem 0;
}
.admin-wrapper .pad-y-smaller {
  padding: 0.75rem 0;
}
.admin-wrapper .pad-top-smaller {
  padding-top: 0.375rem;
}
.admin-wrapper .pad-bottom-smaller {
  padding-bottom: 0.375rem;
}
.admin-wrapper .pad-top-small {
  padding-top: 0.75rem;
}
.admin-wrapper .pad-top-medium {
  padding-top: 3rem;
}
.admin-wrapper .pad-bottom-medium {
  padding-bottom: 3rem;
}
.admin-wrapper .pad-top-single {
  padding-top: 1px;
}
.admin-wrapper .pad-bottom-single {
  padding-bottom: 1px;
}
.admin-wrapper .pad-single {
  padding: 1px;
}
.admin-wrapper .pad-top-reset {
  padding-top: 0;
}
.admin-wrapper .pad-left-reset {
  padding-left: 0;
}
.admin-wrapper .pad-right-reset {
  padding-right: 0;
}
.admin-wrapper .pad-bottom-reset {
  padding-bottom: 0;
}
.admin-wrapper .pad-reset {
    padding: 0;
}

.admin-wrapper .type-ellipses {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

#domain_wrapper section + section {
    margin-top: 1em;
}

#domain_wrapper .single_domain {
    border-bottom: 1px solid var(--blue-border);
    cursor: pointer;
    padding: 0 calc(1.5rem + 1px);
}

#domain_wrapper .single_domain .col {
    font-family: var(--main-font);
    color: var(--blue);
    font-size: var(--small);
    padding: .5em 0;
    line-height: 1.5;
}

#domain_wrapper .single_domain .col:nth-child(2) span {
    font-size: var(--small);
    padding: .5em 0;
    display: inline-block;
}

#domain_wrapper .single_domain:not(.available) .col {
    opacity: .4;
}

#domain_wrapper .single_domain .col:first-child {
    display: none;
}

#domain_wrapper .single_domain .col:last-child {
    padding-right: 0;
}

#domain_wrapper .next_domainlist_set {
    margin-top: .5rem;
    margin-left: calc(1.5rem - 2px);
    display: inline-block;
    background: none;
    color: var(--blue);
    padding: 0;
    text-transform: uppercase;
    font-size: var(--small);
}





/**************************
   BLOG 
**************************/
.blog .page_content .image-gallery {
    margin: calc(-8rem + 15px) !important;
    padding: 4rem !important;
}

.blog .page_content [image-gallery-pad] {
    padding: 4rem !important;
}

.blog .gallery_card_image {
    margin-bottom: calc(1em + 15px);
}

.blog .legacy .gallery_card.slick-slide .gallery_card_image:after {
  display: none;
}

.blog .gallery_card_image:after {
    box-shadow: 0px 0px 0px 1px var(--blue-outline);
    border-radius: 10px;
    padding: 15px;
    content: '';
    position: absolute;
    left: -15px;
    top: -15px;
    bottom: -15px;
    right: -15px;
}

.blog .card_img {
    position: relative;
    box-shadow: 0px 0px 0px 1px var(--blue-outline);
    border-radius: 10px;
}

.blog .card_img img {
    padding: 15px;
}

.image-filter-red:after {
    content: '';
    position: absolute;
    top: 15px; left: 15px; right: 15px; bottom: 15px;
    background: var(--blue);
    z-index: -1;
}

.image-filter-red img {
    filter: grayscale(1);
    mix-blend-mode: screen;
}


.blog .gallery_image_caption.selections_format {
    margin-bottom: 0;
    margin-top: 0;
}

.blog [data-in-use-grid] a {
    display: block;
    position: relative;
    height: 0;
    vertical-align: top;
    line-height: 0;
    margin: 0;
    padding-bottom: calc(71.3% + 1.7rem) !important;
    margin-bottom: 15px;
}

.blog .legacy [data-in-use-grid] a .border-wrapper {
    padding-bottom: calc(71.3% + 1.7rem) !important;
    position: relative;
    height: 0;
}
/*marked*/
/*body:not() .blog [data-id="9346175"] [data-in-use-grid] a .border-wrapper,
body:not() .blog [data-id="9346175"] [data-in-use-grid] a,
body.mobile:not() .blog [data-id="9346175"] [data-in-use-grid] a,
body.mobile:not() .blog [data-id="9346175"] [data-in-use-grid] a .border-wrapper,
body.mobile:not() .blog [data-container="page"].new [staff-pick-grid] [data-staff-pick-image].new-ratio a.image-link.new_ratio,
body.mobile:not() .blog [data-container="page"][data-id="9346175"].new [data-staff-pick-image] a.image-link {
    padding-bottom: calc(62.5% + 1.7rem) !important;
    width: 100%;
    max-width: initial;
}
*/
body.mobile .blog .maxmobile img {max-width: 65%; height: auto !important;}

/*marked*/
/*.blog [data-container="page"][data-id="9346175"].new [staff-pick-grid] [data-staff-pick-image] a {
body.mobile .blog [data-container="page"][data-id="9346175"].new [staff-pick-grid] [data-staff-pick-image].new-ratio a.image-link.new_ratio {
    padding-bottom: calc(44% + 1.7rem) !important;
}*/

.blog [data-container="page"].new [staff-pick-grid] [data-staff-pick-image] a {
    /*padding-bottom: calc(50% + 1.7rem) !important;*/
    margin-top: -1px;
    max-width: calc(70% + 30px);
}
.blog .gallery_image_caption:not(.selections_format) {
    margin-top: 3rem;
    margin-bottom: 0;
}

.blog .legacy .staff-pick-wrapper {
 width: 50%;
 margin: 0 auto;
}

body.mobile .blog .legacy .staff-pick-wrapper {
 width: 95%;
 margin: 0 auto;
 padding: 0 0.4rem;
}

.blog .legacy [data-staff-pick-image] a.pad-bottom-trick, 
.blog .legacy [data-featured-in-use] a.pad-bottom-trick {
    padding-bottom: calc(71.4% + 1.7rem) !important;
    width: 100%;
}

/*style="padding-bottom: calc(50% + 1.7rem) !important; margin-top: -1px; max-width: 70%;"*/
/**************************
   MOBILE BLOG 
**************************/

/* mb-border-w = 8px */
/* neg-mb-border-w = -8px */
/* border-w = 15px */
/* gallery-image-bot = 1em */
/* mb-gallery-image-bot = 0.5em */

/* This fixes Staff Pick Blue Bolt */
body.mobile [staff-pick-grid] img:first-child {
    height: 5rem;
    width: 5rem;
    max-height: 5rem;
}

body.mobile:not(.ios) .new [staff-pick-grid] img:first-child {
    max-height: initial;
}

/*More Staff Pick Specific fixes*/
body.mobile .blog [data-container="page"].new [staff-pick-grid] [data-staff-pick-image] a {
    /*padding-bottom: calc(50% + 1.7rem) !important;*/
    margin-top: -1px;
    max-width: 100%;
}

body.mobile .blog [data-container="page"].new [staff-pick-grid] [grid-col="8"][grid-pad="2"] {
    padding: calc(1.1rem + 15px) !important;
}

body.mobile .blog [data-container="page"].new [staff-pick-grid] [data-staff-pick-image] a.image-link {
    padding-bottom: cacl(65.5% + 1.7rem);
}

body.mobile [data-affections-grid] img {
    width: 60% !important;
    height: auto !important;
}

body.mobile .blog .page_content .image-gallery {
    margin: calc(-8rem + var(--mb-blog-border)) !important;
    padding: 4rem !important;
}

body.mobile .blog .page_content [image-gallery-pad] {
    padding: 4rem !important;
}

body.mobile .blog .gallery_card_image {
    margin-bottom: calc(0.5em + var(--mb-blog-border));
}

body.mobile .blog .gallery_card_image:after {
    box-shadow: 0px 0px 0px 1px var(--blue-outline);
    border-radius: 6px;
    padding: var(--mb-blog-border);
    content: '';
    position: absolute;
    /* var(--mb-blog-border) Below */
    left: -8px;
    top: -8px;
    bottom: -8px;
    right: -8px;
}

body.mobile .blog .gallery_image_caption.selections_format {
    margin-bottom: 0;
    margin-top: 0;
}

body.mobile .blog [data-container="page"].new [data-staff-pick-image] a.image-link {
    width: 100%;
    /*height: 0 auto !important;*/
    /*padding-bottom: calc(71.3% + 1.7rem) !important;*/
}

body.mobile .blog [data-in-use-grid] a {
    display: block;
    position: relative;
    height: 0;
    vertical-align: top;
    line-height: 0;
    margin: 0;
    padding-bottom: calc(71.3% + 1.7rem) !important;
    margin-bottom: var(--mb-blog-border);
}

body.mobile .blog .legacy [data-in-use-grid] a .border-wrapper {
    padding-bottom: calc(71.3% + 1.7rem) !important;
    position: relative;
    height: 0;
}

body.mobile .blog [data-in-use-grid] .border-wrapper:after,
body.mobile .blog [data-in-use-grid] [grid-col="x10"][grid-pad="4"] .border-wrapper:after, 
body.mobile .blog [data-in-use-grid] [grid-col="x10"][grid-pad="1.5"] .border-wrapper:after,
body.mobile .blog [data-in-use-grid] [grid-col="x10"][grid-pad="4"] .border-wrapper:after, 
body.mobile .blog [data-in-use-grid] [grid-col="x10"][grid-pad="1.5"] .border-wrapper:after {
    z-index: -1;
    content: '';
    position: absolute;
    /* var(--mb-blog-border) */
    left: -10px;
    right: -10px;
    bottom: -10px;
    top: -10px;
    box-shadow: 0px 0px 0px 1px var(--blue-outline);
    border-radius: 6px;
}

body.mobile .blog .legacy [data-staff-pick-image] a.pad-bottom-trick, 
body.mobile .blog .legacy [data-featured-in-use] a.pad-bottom-trick {
    padding-bottom: calc(71.4% + 1.7rem) !important;
    width: 100%;
}

.blog .legacy span.max-w-60 small {
  /*margin-top: 2rem;*/
}

body.mobile .blog [data-staff-pick-image] a.image-link:after {
    content: '';
    position: absolute;
    /* var(--mb-blog-border) Below */
    left: -10px;
    right: -10px;
    bottom: -10px;
    top: -10px;
    box-shadow: 0px 0px 0px 1px var(--blue-outline);
    border-radius: 6px;
    z-index: -1;
}

body.mobile .blog .page_content [image-gallery-row] [image-gallery-col]:nth-child(odd) [image-gallery-pad="1"] {
    padding-right: 1.7rem !important;
}

body.mobile .blog .page_content [image-gallery-row] [image-gallery-col]:nth-child(even) [image-gallery-pad="1"] {
    padding-left: 1.7rem !important;
}

[data-predefined-style="true"] body.mobile h1 {
    font-size: 3.5rem;
    line-height: 1.1;
}

body.mobile .affections-image,
body.mobile .affections-image [style="text-align: right"] {
    text-align: center !important;
}

body.mobile #domain_wrapper_wrapper {
    display: none !important;
}

body.mobile [data-container="page"].legacy bodycopy {
    margin-top: 3rem;
}

/**************************
    BLOG OVERRIDES
**************************/

.blog .edition {
    font-family: "Times New Roman", "Times New Roman", Times, serif, "Times New Roman", Icons;
    font-size: inherit !important;
}

.blog h1 b {
    font-weight: normal !important;
}

.blog .legacy hr {
    visibility: hidden;
    margin-bottom: .5em !important;
}

.blog [href="Graphic-Design"],
.blog [href="Architecture-Design"],
.blog [href="Style"],
.blog [href="Photo"],
.blog [href="Art"] {
    margin-left: -.80ch;
}

.blog .instagram-cargo {
    display: none;
}

.blog .legacy [data-in-use-grid] [grid-col] a+div {
    margin-top: calc(1em + 13px);
}

.blog .new [data-in-use-grid] [grid-col] a+div {
    margin-top: .9em;
}


.blog [data-in-use-grid] [grid-col] a + div > div {
    line-height: .9;
}

/* Instagram Icon v align */
.blog .legacy a[href="https://www.instagram.com/cargoworld"] small span,
.blog .legacy a[href="https://www.instagram.com/cargo.style/"] small span,
.blog .legacy a[href="https://www.instagram.com/cargo.arch.design/"] small span,
.blog .legacy a[href="https://www.instagram.com/cargo.art/"] small span,
.blog .legacy a[href="https://www.instagram.com/cargo.photo/"] small span {
    vertical-align: text-bottom;
}

/* Arrow placement */
.blog .legacy a[href="https://www.instagram.com/cargoworld"] sup,
.blog .legacy a[href="https://www.instagram.com/cargo.style/"] sup,
.blog .legacy a[href="https://www.instagram.com/cargo.arch.design/"] sup,
.blog .legacy a[href="https://www.instagram.com/cargo.art/"] sup,
.blog .legacy a[href="https://www.instagram.com/cargo.photo/"] sup {
    top: -0.3em;
    font-size: 1.8rem;
}

.blog .content img[data-scale="10"] {
    width: 6.5rem !important;
    height: 6.5rem !important;
    max-width: 6.5rem;
    max-height: 6.5rem;
    z-index: 2;
    position: relative;
}

body.mobile .blog img[src="//freight.cargo.site/w/1000/q/67/i/1ac9078162beea59466ff49e4dc7c6167614569a08ae8b330ea4acf12170b87e/blue-bolt.svg"],
body.mobile [data-newsletter-icon] {
    max-width: 5rem;
    max-height: 5rem;
}

body.mobile .blog .legacy [data-scale="10"] {
    height: 5rem;
    width: 5rem;
    max-height: 5rem;
    max-width: 5rem;
}

.blog .legacy [data-updates-grid] .gallery_card_image:after {
    box-shadow: none;
    border-radius: none;
    padding: none;
    position: relative;
}

.blog .legacy a.updates-image.image-link img {
    outline: none !important;
}

.blog .legacy [data-staff-pick-text] small {
    /*margin-top: 1.3em !important;*/
}

.blog div.new [data-staff-pick-text] {
    display: inline-block;
    margin-top: -1.3em;
}

.blog .legacy img[src="//freight.cargo.site/w/1552/q/67/i/135e45c24fd627fe6d2121b37bb7f8e40f949ab4862f4ce167adfee8eb286ce2/sticky.png"] {
    max-width: inherit;
    width: 36rem !important;
}

/* Some have a break */
.blog .legacy [data-in-use-grid] [grid-col] a+br+div {
    margin-top: calc(1em + 15px);
}

.blog .legacy [data-in-use-grid] [grid-col] div > a + br + small {
    margin-top: calc(1.4em + 15px);
}

/* Some don't have a break */
.blog .legacy [data-in-use-grid] [grid-col] a+div {
    margin-top: calc(1em + 15px);
}

.blog .legacy [data-in-use-grid] a.image-link:not(.half-width) {
    width: 100%;
}

/* Fixes image leaving position in affections */
.blog .legacy [data-break-mobile] .max-w-60 {
    max-width: 100%;
    width: 100%;
}

.blog .legacy [grid-row][grid-pad="0"][grid-gutter="0"][grid-responsive] [grid-col="x11"][grid-pad="0"] {
    width: 50%;
}

.blog .legacy [data-instagram-grid] div[style="text-align: left;"] small,
.blog .legacy [data-instagram-grid] div[style="text-align: left"] small {
    margin-top: 1em;
}

.blog .legacy [data-instagram-grid] a.image-link {
    padding-bottom: 0 !important;
    width: 100%;
    height: auto !important;
}

.blog .legacy [data-instagram-grid] a.image-link img {
    outline: 0 !important;
}

.blog .legacy [data-instagram-grid] a.image-link+small {
    margin-top: 1em;
}

.blog .legacy [data-instagram-grid] {
    margin: 0 0 5rem 0;
}

.blog .legacy [data-id="9146328"] .updates-image.image-link {
    padding-bottom: 20rem !important;
}

.blog .legacy [data-in-use-grid][grid-pad] {
    margin: -1.5rem !important;
    padding: 0.75rem !important;
    line-height: 0 !important;
}

.blog [data-in-use-grid] [grid-col] {
    padding: calc(0.85rem + 15px) !important;
    padding-bottom: 3rem;
}

.blog [data-in-use-grid] a.image-link {
    padding-bottom: calc(67.5% + 3.2rem) !important;
}

/*.blog .legacy [data-staff-pick-image]+br+br+.max-w-60 {
    margin-top: 1em !important;
}*/

.blog .legacy a.zero-gap {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    display: inline !important;
}

.blog .legacy [data-staff-pick-image] a.pad-bottom-trick,
.blog .legacy [data-featured-in-use] a.pad-bottom-trick {
    padding-bottom: calc(71.4% + 1.7rem) !important;
    width: 100%;
}

.blog .newsletter_icon {
    max-width: 12rem;
    margin: 0 auto;
    background: url(//freight.cargo.site/w/1000/q/67/i/1ac9078162beea59466ff49e4dc7c6167614569a08ae8b330ea4acf12170b87e/blue-bolt.svg);
    content: '';
    position: absolute;
    background-size: contain;
    position: absolute;
    background-size: contain;
    width: 5.915rem;
    height: 5.915rem;
    top: 1rem;
    left: 0;
    right: 0;
    bottom: 0;
    display: none;
}

.blog .newsletter_icon img {
    display: none;
}



body.mobile .blog .legacy [data-break-mobile] img[data-scale] {
    width: 50% !important;
    height: auto !important;
}

body.mobile .blog .legacy [data-break-mobile] div[style="text-align: right;"],
body.mobile .blog .legacy [data-break-mobile] div[style="text-align: right"],
body.mobile .blog .legacy [data-break-mobile] div[style="text-align: left"],
body.mobile .blog .legacy [data-break-mobile] div[style="text-align: left;"] {
    text-align: center !important;
}


[data-page-id="9146308"] .blog [data-container="page"]:not(:first-child) {
    padding-top: 3rem;
    margin-top: 5.5rem;
    border-top: 1px solid var(--blue-outline);
}

[data-page-id="9146308"] .blog [data-last-week-link],
body.mobile[data-page-id="9118965"] .blog [data-last-week-link] {
    display: none;
}

.blog [data-last-week-link] {
    margin: 3em 0;
    display: inline-block;
}


/* override default styles for legacy */
.legacy [data-in-use-grid] div:not(.site_header):not(.header_buttons) {
    text-align: center !important;
}

/*.blog .legacy [data-featured-in-use] a.pad-bottom-trick:after,*/
.blog .legacy [cargoworld-grid] a:after {
    content: '';
    position: absolute;
    left: -15px;
    right: -15px;
    bottom: -15px;
    top: -15px;
    box-shadow: 0px 0px 0px 1px var(--blue-outline);
    border-radius: 10px;
    z-index: -1;
}

.blog .legacy [data-featured-in-use] .half-width.pad-bottom-trick.image-link.special {
    padding-bottom: calc(31.2% + 1.7rem) !important;
    margin-top: -1.75rem;
}

.blog .legacy [data-in-use-grid] [grid-pad] a.pad-bottom-trick {
    padding-bottom: calc(71.3% + 1.7rem) !important;
    height: 0 !important;
}

body.mobile .blog .legacy [data-in-use-grid] [grid-col] a+br+div {
    margin-top: 1em;
}


/*.blog .legacy [data-featured-in-use] a.pad-bottom-trick img:after {
    content: '';
    position: absolute;
    left: -15px;
    right: -15px;
    bottom: -15px;
    top: -15px;
    box-shadow: 0px 0px 0px 1px var(--blue-outline);
    border-radius: 10px;
    z-index: -1;
}*/

.blog .legacy [data-featured-in-use] a.pad-bottom-trick:after {
    content: '';
    position: absolute;
    left: -15px;
    right: -15px;
    bottom: -15px;
    top: -15px;
    box-shadow: 0px 0px 0px 1px var(--blue-outline);
    border-radius: 10px;
    z-index: -1;
}

body.mobile .blog .legacy [data-featured-in-use] a.pad-bottom-trick:after {
    content: '';
    position: absolute;
    left: -10px;
    right: -10px;
    bottom: -10px;
    top: -10px;
    box-shadow: 0px 0px 0px 1px var(--blue-outline);
    border-radius: 6px;
    z-index: -1;
}

.blog [data-in-use-grid] [grid-col="x10"][grid-pad="4"] .border-wrapper:after,
.blog [data-in-use-grid] [grid-col="x10"][grid-pad="1.5"] .border-wrapper:after {
    z-index: -1;
    content: '';
    position: absolute;
    left: -15px;
    right: -15px;
    bottom: -15px;
    top: -15px;
    box-shadow: 0px 0px 0px 1px var(--blue-outline);
    border-radius: 10px;
}


.blog .legacy [data-instagram-grid] small {
    font-size: 1.4rem;
}

.blog .legacy [cargoworld-grid] a img {
    padding: 0px;
    outline: 1px solid var(--blue-outline);
    outline-offset: -1px;
    margin-top: -.5px;
    max-width: 100%;
    width: 100% !important;
    height: auto !important;
}

.blog .legacy [data-featured-in-use] img {
  height: 5rem !important;
  width: 5rem !important;
  margin-bottom: 1.7rem;
}


.blog .legacy [data-template-video]{
  outline: 1px solid #99bbff !important;
}

/*Redo borders for blog*/

body .blog [data-container="page"].new [data-in-use-grid] a,
body .blog [data-container="page"].new [staff-pick-grid] [data-staff-pick-image] a {
    padding: 15px;
    border: 1px solid var(--blue-outline);
    border-radius: 10px;
    position: relative;
    display: inline-block;
    margin-bottom: 0;
    
    border-bottom: 1px solid var(--blue-outline) !important;
    padding-bottom: 15px !important;
    height: auto !important;
}

body.mobile .blog [data-container="page"].new [data-in-use-grid] a,
body.mobile .blog [data-container="page"].new [staff-pick-grid] [data-staff-pick-image] a {
    padding: 8px;
    padding-bottom: 8px !important;
}

body .blog [data-container="page"].new [staff-pick-grid] [data-staff-pick-image] a {
    margin-top: -23px;
}


body.safari .blog [data-container="page"].new [staff-pick-grid] [data-staff-pick-image] a {
    margin-top: -17px;
}

/*body .blog [data-container="page"].new [staff-pick-grid] [data-staff-pick-image]:after {
    content: '';
    z-index: -1;
    top: -47px;
    width: 6.5rem;
    height: 30px;
    background: white;
    position: absolute;
}*/

body.mobile .blog [data-container="page"].new [staff-pick-grid] [data-staff-pick-image] a {
    margin-top: -10px;
}

body.mobile .blog [data-container="page"].new [data-in-use-grid] a .border-wrapper {
    outline: 0;
    padding-bottom: auto;

}

body .blog [data-container="page"].new [data-in-use-grid] a.image-link:after,
body .blog [data-container="page"].new [staff-pick-grid] [data-staff-pick-image] a.image-link:after,
body .blog [data-container="page"].new [data-staff-pick-image] a.image-link:after,
body .blog [data-container="page"].new [data-in-use-grid] [grid-col="x10"][grid-pad="4"] .border-wrapper:after, 
body .blog [data-container="page"].new [data-in-use-grid] [grid-col="x10"][grid-pad="1.5"] .border-wrapper:after {
    display: none;
}

body.mobile .blog .legacy [data-in-use-grid] a .border-wrapper {
    padding-bottom: 0 !important;
    height: auto !important;
}

.blog .new [data-in-use-grid] a {
    margin: -15px;
}

.blog.mobile .new [data-in-use-grid] a  {
    margin: -8px;
}


/**************************
    TEMPLATES
**************************/

.templates .template_list {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -.75rem;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
}

/*SIES IN USE FIX*/
[data-page-id="9145893"] .content_container,
.template_list {
    min-height: 100vh;
}

.template {
    flex: 0 0 33.3333%;
    width: 33.3333%;
    padding: calc(.75rem + 15px);
    padding-bottom: 6rem;
    text-align: center;
     position: relative;
    /*text-transform: uppercase;*/
}

.template small {
    display: block !important;
    padding-top: .25em;
}

.template a,
.template small>span,
.template a:after {
    cursor: pointer;
    z-index: auto !important;
}

.template a:active,
/*.template a:active + br + br + small > span,*/
.template small>span:active {
    opacity: .7;
}

.template img {
    max-width: 100%;
}

.templates a.image-link img:not([src]),
.templates a.image-link img[src=''],
.templates a.image-link .new_ratio {
    width: 1000px !important;
    padding-bottom: 62.5% !important;
    height: 0 !important;
}

.templates .page .header a:not(.active) {
    padding: 0.05rem 1.2rem 0.1rem 1.2rem !important;
    border-radius: 10rem;
    background: transparent;
}

/*.template[data-order="4"],
.template[data-order="14"],
.template[data-order="24"],
.template[data-order="34"],
.template[data-order="44"],
.template[data-order="54"],
.template[data-order="64"],
.template[data-order="74"],
.template[data-order="84"],
.template[data-order="94"],
.template[data-order="5"],
.template[data-order="15"],
.template[data-order="25"],
.template[data-order="35"],
.template[data-order="45"],
.template[data-order="55"],
.template[data-order="65"],
.template[data-order="75"],
.template[data-order="85"],
.template[data-order="95"],
.template[data-order="9"],
.template[data-order="19"],
.template[data-order="29"],
.template[data-order="39"],
.template[data-order="49"],
.template[data-order="59"],
.template[data-order="69"],
.template[data-order="79"],
.template[data-order="89"],
.template[data-order="99"],
.template[data-order="10"],
.template[data-order="20"],
.template[data-order="30"],
.template[data-order="40"],
.template[data-order="50"],
.template[data-order="60"],
.template[data-order="70"],
.template[data-order="80"],
.template[data-order="90"],
.template[data-order="100"] {
    width: 50%;
    flex: 0 0 50%;
}*/

.template[data-order="100"] {
    display: none;
}

/**************************
    SIGNUP WINDOW PREVIEW
**************************/

.signup_frame {
    border: 0;
    background: transparent;
    position: fixed;
    top: 0;
    left: 50%;
    right: 0;
    bottom: 0;
    margin: 46px 0 0;
    height: calc(100% - 46px);
    width: 100%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    z-index: 999;
}

html.templates_view {
    background-color: #212121;
}

.signup_bg {
    opacity: 1;
    cursor: pointer;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 997;
    background-color: #222;
}

.signup_bg:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 1);
    z-index: -1;
    opacity: .2;
    background-size: 8px 8px;
    background-image: url(https://auth.cargo.site/_gfx/checkered-grid.gif);
}

.signup_bg_loader {
    border: 0;
    background: #222;
    position: fixed;
    top: 0;
    left: 50%;
    right: 0;
    bottom: 0;
    margin: 46px 0;
    height: calc(100% - 46px);
    width: 100%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    z-index: 999;
}

.signup_bg_loader.generating {
    top: 0;
    left: 0;
    height: 45px;
    width: 45px;
    transform: none;
    padding: 0;
    margin: 0;
    background: transparent;
}

.signup_bg_loader.generating .loading_animation {
    margin-top: -1px;
}

.signup_bg_loader.generating .loading_animation.gray div svg>* {
    fill: #fff;
    opacity: .85;
}

.signup_nav {
    color: #fff;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif, Icons;
    justify-content: center;
    position: fixed;
    height: 46px;
    text-align: center;
    line-height: 44px;
    letter-spacing: 0.01em;
    left: 0;
    right: 0;
    top: 0;
    z-index: 999;
    border-bottom: 1px solid transparent;
    background: rgba(0, 0, 0, 1);
}

.signup_nav_border {
	position: fixed;
    height: 1px;
    top: 46px;
    left: 0;
    right: 0;
    background: rgba(255,255,255, 0.2);
    background: #333;
    z-index: 99999999999;
}

.newlink_icon {
    display: inline-block;
    float: right;
    font-size: 21px;
    line-height: 42px;
    opacity: .95;
}

.signup_prev,
.signup_next,
.signup_mobile,
.signup_close {
    display: block;
    height: 46px;
    width: 46px;
}

.signup_mobile {
    display: block;
    padding: 1.275rem 1.15rem 1.15rem 1.35rem;
}

.signup_prev,
.signup_next,
.signup_mobile {
    display: none;
}


.signup_mobile img {
    vertical-align: top;
}

.signup_title {
    margin-right: 2rem;
    border-left: 0;
    color: rgba(255, 255, 255, .6);
    text-decoration: none;
    font-size: 17px;
    left: 0;
    height: 46px;
    padding: 0 17px;
    width: auto;
    cursor: pointer;
    font-family: var(--main-font);
    letter-spacing: .04rem;
}

.signup_title:hover {
    color: rgba(255, 255, 255, .6);
}

.template_nav {
    position: absolute;
    height: 46px;
    width: auto;
    display: flex;
    right: 0;
}

.signup_close {
    cursor: pointer;
    background-color: #3d3d3d;
    color: #ccc;
    font-size: 26px;
    line-height: 42px;
    font-weight: normal;
    font-family: 'Lucida Grande', 'Lucida Sans Unicode', Arial, sans-serif;
    margin-left: 38px;
    line-height: 1.7;
    padding-left: 1px;
    position: relative;
}

.signup_close svg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin-left: 2px;
    margin-top: 1px;
}

.signup_nav .signup_close:hover {
    background-color: #555;
    color: #eee;
}

.signup_nav .signup_close:active {
    background-color: #444;
    color: #999;
}

.signup_link {
    border-left: 0;
    color: rgba(255, 255, 255, .6);
    text-decoration: none;
    position: absolute;
    font-size: 17px;
    left: 17px;
    cursor: pointer;
    height: 46px;
    padding-right: 20px;
    width: auto;
    font-weight: normal;
}

.signup_link:hover {
    color: rgba(255, 255, 255, .6);
}

.signup_link span {
    color: #fff;
    font-family: var(--main-font);
    font-weight: normal;
    letter-spacing: .04rem;
}

.signup_generate_message {
    border-left: 0;
    color: rgba(225, 255, 255, .9);
    text-decoration: none;
    position: absolute;
    font-size: 17px;
    left: 43px;
    cursor: default;
    height: 46px;
    padding-right: 20px;
    width: auto;
    font-weight: normal;
}

.signup_nav .admin-wrapper {
    width: calc(100% - 10rem)
}

[data-toggle] {
    cursor: pointer;
    padding: 10.5px 5px;
    line-height: 0;
}

[data-toggle]:active {
    opacity: .7;
}

[data-toggle="phone"] {
    padding-right: 14px;
}

[data-toggle="desktop"] svg {
    width: 33px;
    height: 24px;
}

.signup_nav [data-toggle] svg * {
    color: rgba(255, 255, 255, .6);
    fill: rgba(255, 255, 255, .6);
}

.signup_nav [data-toggle].active svg * {
    color: #698FFF;
    fill: #698FFF;
}

.progress-bar {
    width: 100%;
    position: absolute !important;
    left: 0;
    right: 45px;
    bottom: 0;
    top: 0;
    z-index: -1;
    width: auto !important;
}

.progress-indicator {
    background: #698FFF;
}

.progress-indicator:after {
    display: none !important;
}

.progress-bar,
[data-progress] .progress-percentage,
[data-progress] .progress-indicator {
    height: 100%;
}




/**************************
    Useful Music
**************************/
.useful-music .links_wrapper {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: flex-start;
    margin-left: -.75rem;
    margin-right: -.75rem;
}

.useful-music bodycopy a {
    max-width: calc(33.333% - 1.5rem);
    width: calc(33.333% - .75rem);
    margin-bottom: 1.5rem;
    margin-right: .75rem;
    margin-left: .75rem;
    flex-grow: 1;
}

.useful-music bodycopy a img,
[data-id="9145781"] bodycopy a img,
[data-id="9145781"] bodycopy img {
    max-width: 100%;
    height: auto !important;
    flex: 1;
    padding: 15px;
    box-shadow: 0px 0px 0px 1px var(--blue-outline);
    border-radius: 10px;
    outline: 1px solid var(--blue-outline);
    outline-offset: -16px;
    width: 100% !important;
    /*min-height: 30vw;*/
}

.useful-music bodycopy a.image-link .um-wrapper img,
[data-id="9145781"] bodycopy a.image-link .um-wrapper img {
    outline: none !important;
}

.useful-music bodycopy a.image-link .um-wrapper,
[data-id="9145781"] bodycopy a.image-link .um-wrapper  {
    outline: 1px solid var(--blue-outline);
    outline-offset: -15px;
}

.blog .new .bolt-wrapper {
    /*background: var(--blue);*/
    display: inline-block;
    z-index: 2;
    position: relative;
    overflow: hidden;
    display: none;
}

[data-id="9145781"] ol {
    margin-left: 3rem;
}

[data-id="9145781"] a.image-link img {
    padding: 15px;
    box-shadow: 0px 0px 0px 1px var(--blue-outline);
    border-radius: 10px;
}


/*MOBILE OVERRIDES*/
body.mobile .home-desktop,
body:not(.mobile) .home-mobile {
    display: none;
}

body.mobile .blog [data-container="page"] {
    border-top: 1px solid var(--blue-outline);
}


#newsletter_signup {
    font-size: 0;
}

#newsletter_signup input[type=text]::-webkit-input-placeholder {
    color: transparent;
    display: none;
}

#newsletter_signup {
    max-width: 450px;
    width: 100%;
    position: relative;
    margin: 0 auto;
    display: inline-block;
}

#newsletter_signup:before {
    content: '|';
    position: absolute;
    top: 1px;
    left: 9ch;
    right: 0;
    bottom: 0;
    padding: .75rem;
    font-family: var(--main-font);
    font-weight: 400;
    letter-spacing: inherit;
    text-rendering: optimizeLegibility;
    pointer-events: none;
    display: block;
    animation: 1s infinite blink;
    font-size: 1.7rem;
    z-index: 999;
    text-align: left;
}

#newsletter_signup:after {
    content: 'Subscribe:';
    position: absolute;
    top: 1px;
    left: 1rem;
    right: 0;
    bottom: 0;
    padding: .65rem .75rem .85rem .5rem;

    font-family: var(--main-font);
    font-weight: 400;
    letter-spacing: inherit;
    text-rendering: optimizeLegibility;
    pointer-events: none;
    display: block;
    /* animation: 1s infinite blink; */
    font-size: 1.7rem;
    line-height: 1.4;
    z-index: 999;
    text-align: left;
}

body.safari #newsletter_signup:before, 
body.safari #newsletter_signup:after {
    line-height: 1.5;
}

body.safari #newsletter_signup:before {
    line-height: 1.4;
}

#newsletter_signup input[type=text] {
    font-size: 1.7rem;
    line-height: 1.4;
    border: 1px solid var(--blue-outline);
    display: inline-block;
    padding: .65rem .75rem .85rem 1.5rem;
    font-family: inherit;
    color: var(--blue);
    font-family: var(--main-font);
    width: 100%;
    /*max-width: 450px;*/
    border-radius: 10rem;
    position: relative;
}

#newsletter_signup input.error {
    /*  outline: 1px solid rgba(255, 0, 51, .6);*/
}

#success,
#error {
    display: none;
    font-weight: 400;
    color: rgba(0, 0, 0, 0.35);
    font-style: normal;
}

#success {
    color: var(--blue);
}

#error {
    color: #ff0033;
}

#newsletter_signup input[type=button],
#newsletter_signup input[type=submit] {
    background-color: #698fff;
    border: 0;
    border-top: 0;
    margin: 0;
    color: white;
    padding: .75rem 1rem .85rem 1.1rem;
    margin-left: -1px;
    font-size: 1.4rem;
    text-decoration: none;
    cursor: pointer;
    line-height: 0.9;
    outline: 0;
    vertical-align: top;
    height: 2.9rem;
    -webkit-appearance: none;
    border-radius: 0;
}

#newsletter_signup.focus:after,
#newsletter_signup.focus:before {
    display: none;
}

#newsletter_signup input[type=button] {
    display: none;
}

[data-id="9145781"] a.image-link {
  width: 100%;
  display: block;
  height: 0;
  padding-bottom: 100%;
  position: relative;
}




/*
    Sticker
*/

.sticker img {
    max-width: 200px;
    max-height: 200px;
}


/********* 
    MORELEGACY BLOG! 
**********/
.blog .legacy a:empty{
  display: none!important;
}

body:not([data-adminview="content-editproject"]) .selections [data-container="page"]:first-child {
    background: white;
}


/* Legacy Blog Early Staff Pick Fix (works with JS) */
.blog .legacy [data-featured-in-use] a[legacy-border-special].pad-bottom-trick, 
.blog .legacy [data-staff-pick-image] a[legacy-border-special].pad-bottom-trick {
    padding-bottom: calc(62.4% + 1.7rem) !important;
    margin-top: -1.8rem;
}

body.mobile .blog .legacy [data-featured-in-use] a[legacy-border-special].pad-bottom-trick, 
body.mobile .blog .legacy [data-staff-pick-image] a[legacy-border-special].pad-bottom-trick {
    padding-bottom: calc(62.4% + 1.7rem) !important;
    margin-top: -1.8rem;
}





.font-grid .grid-item {
    margin: .75rem !important;
    width: calc(33.333% - 1rem) !important;
}

.font-grid .grid-item:nth-child(3n+1) {
    margin-left: 0 !important;
}

.font-grid {
    padding: 0 !important;
}

.font-grid .grid-item:nth-child(3n+3) {
    margin-right: 0 !important;
}

.font-grid .grid-item .item-inner {
    background: #fff !important;
    border: 1px solid var(--blue-outline) !important;
    color: var(--blue) !important;
    border-radius: 10px !important;
    margin: 0 !important;
    padding: 0 !important;
}

.font-grid .grid-item .item-text {
    padding: 2.5rem !important;
}

.blog [data-container="page"].new a.image-link.no-border,
.blog [data-container="page"].new .affections a.image-link {
    padding-bottom: 0 !important;
    width: 100%;
    height: auto;
    margin: 0;
}
.blog [data-container="page"].new a.image-link.no-border img { 
    outline: 0 !important;
    border: 0 !important;
    margin: 0 !important;
}

.blog [data-container="page"].new a:not(.image-link),
.blog [data-container="page"].new small a {
    text-decoration: underline;
}

.blog .gallery_card,
.blog .selection_url, 
.blog .selection_insta {
    text-decoration: none !important;
}




/*color change*/


.useful-music bodycopy a img, 
[data-id="9145781"] bodycopy a img, 
[data-id="9145781"] bodycopy img,
.blog .new .bolt-wrapper img,
.color-swap > img {
    mix-blend-mode: screen;
    filter: grayscale(100%) contrast(300%);
    outline: 0 !important;
    box-shadow: none !important;
}

[data-id="9145781"] bodycopy a img, 
[data-id="9145781"] bodycopy img {

}

.color-swap {
    background: var(--blue);
    display: inline-block;
}

.color-swap img {
    background: #fff;
}

.useful-music a.image-link {
    position: relative;
    line-height: 0;
    padding: 0;
}

.useful-music a.image-link:before,
[data-id="9145781"] a.image-link .um-wrapper:before  {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    filter: none;
    box-shadow: 0px 0px 0px 1px var(--blue-outline);
    border-radius: 10px;
}

.useful-music a.image-link {
    position: relative;
}

.useful-music a.image-link:after,
[data-id="9145781"] a.image-link:after {
    background: var(--blue);
    content: '';
    position: absolute;
    top: 1.7rem;
    left: 1.7rem;
    right: 1.7rem;
    bottom: 1.8rem;
    z-index: -1;
}

.useful-music a.image-link img:not([src]),
[data-id="9145781"] a.image-link img:not([src]) {
    background: white;
}

.blog .new .bolt-wrapper {
    background: var(--blue);
}


[data-bodyview] .page a.active {
    background: none;
    color: var(--blue);
    border-radius: 0;
    padding: 0 !important;
    padding-bottom: 0!important;
    border-bottom: 1px solid var(--blue);
}

[data-bodyview] [data-id="9146424"] .page a.active {
    border-bottom: none;
}

[data-predefined-style="true"] [data-bodyview] [local-style="9145894"] bodycopy a,
[data-predefined-style="true"] [data-bodyview] [local-style="9128720"] bodycopy a,
[data-predefined-style="true"] [data-bodyview] [local-style="9146436"] bodycopy a {
    margin: 0.05rem 1.2rem 0 1.2rem !important;
    padding: 0 !important;
    border-bottom: 2px solid transparent;
}

[data-predefined-style="true"] [data-bodyview] [local-style="9146436"] small a {
    margin: 0 !important;
}


[data-predefined-style="true"] [data-bodyview] [local-style="9145894"] bodycopy a.active,
[data-predefined-style="true"] [data-bodyview] [local-style="9128720"] bodycopy a.active,
[data-predefined-style="true"] [data-bodyview] [local-style="9146436"] bodycopy a.active {
    border-bottom: 1px solid var(--blue);
    line-height: 1.2;
}

[data-bodyview] .templates .page .header a {
    margin: 0.05rem 1.2rem 0 1.2rem !important;
    padding: 0 !important;
}

/*footer*/
[data-predefined-style="true"] [data-bodyview] [local-style="9000737"] small a {
    padding: 0.05rem 0 0 0 !important;
    margin: 0 .75rem !important;
}

/*social icons*/
[data-predefined-style="true"] [data-bodyview] [local-style="8500126"] bodycopy a {
    font-size: 1.8rem;
}

body.mobile [local-style="10902930"] {
    display: none;
}



/*inverted fonts page*/
body.invert[data-page-id="9004992"] *{
  color: #FFF !important;
}

body.invert[data-page-id="9004992"] .content_container .page_background {
    background: var(--blue) !important;
}

body.invert[data-page-id="9004992"] .font-grid .grid-item .item-inner {
    background: var(--blue) !important;
    border: 1px solid #fff !important;
}

body.invert[data-page-id="9004992"] #nav-logo [fill="#000000"] {
    fill: #fff;
}

body.invert[data-page-id="9004992"] #nav-logo [stroke="#000000"] {
    stroke: #fff;
}

body.invert[data-page-id="9004992"] ::selection {
    background-color: rgba(255, 255, 255, 0.99);
    color: var(--blue) !important;
} 

body.invert #invert_button svg [fill="#FF0000"] {
    fill: #fff !important;
}

body.invert #invert_button svg [fill="#FFFFFF"] {
    fill: var(--blue) !important;
}

/* 
    Blog styles after #126 
    blog-ver-# class is added via JS
*/

.blog-ver-one {
    max-width: 800px;
    margin: 0 auto;
    border: 0px solid #ccc;
}

.blog-ver-one a.image-link, 
.blog-ver-one .border-img,
.blog-ver-one .header-image {
    box-shadow: 0px 0px 0px 1px var(--blue-outline);
    padding: 15px;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    border-bottom: 0;
}

body.mobile .blog-ver-one a.image-link, 
body.mobile .blog-ver-one .border-img,
body.mobile .blog-ver-one .header-image {
    padding: 10px;
    border-radius: 6px;
}

.blog-ver-one a:not(.image-link) {
    text-decoration: underline;
    padding-bottom: 0;
}

.blog-ver-one .border-img,
.blog-ver-one .header-image {
    display: block;
    outline: 0;
}

.blog-ver-one a.image-link img,
.blog-ver-one a.header-image img,
.blog-ver-one .border-img img {
    display: block;
    max-width: 100%;
    height: auto !important;
}

.blog-ver-one a.image-link.site {
    outline-offset: -15px;
    outline: 1px solid var(--blue-outline);
}

body.mobile .blog-ver-one a.image-link.site {
  outline-offset: -10px;
}

.blog-ver-one .headerbar {
    display: block;
    width: 100%;
    border-bottom: 1px solid var(--blue-outline);
    margin: 0 auto;
}

.blog-ver-one .blog-txtcolor-white {
    color: #fff !important;
}

.blog-ver-one .intro-bolt {
    border: 0px; 
    padding: 0px; 
    max-width: 60px !important; 
    height: 78px; 
    margin: 0px !important; 
}

body.mobile .blog-ver-one .intro-bolt {
    max-width: 4.5rem !important;
    height: auto !important;
}

/* 
    Blog styles after #160
    blog-ver-# class is added via JS
*/


.blog-ver-two {
    max-width: 800px;
    margin: 0 auto;
    border: 0px solid #ccc;
}

.blog-ver-two .header-link {
    box-shadow: none;
    padding: 0;
    border-radius: 0;
    display: inline-block;
    text-decoration: none;
}

.blog-ver-two a.image-link, 
.blog-ver-two .border-img,
.blog-ver-two .header-image {
    box-shadow: 0px 0px 0px 1px var(--blue-outline);
    padding: 15px;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    border-bottom: 0;
}

body.mobile .blog-ver-two a.image-link, 
body.mobile .blog-ver-two .border-img,
body.mobile .blog-ver-two .header-image {
    padding: 10px;
    border-radius: 6px;
}

.blog-ver-two a:not(.image-link) {
    text-decoration: underline;
    padding-bottom: 0;
}

.blog-ver-two small a {
    text-decoration: none;
}

.blog-ver-two [grid-col] {
    line-height: 1;
}

.blog-ver-two .border-img,
.blog-ver-two .header-image {
    display: block;
    outline: 0;
}

.blog-ver-two a.image-link img,
.blog-ver-two a.header-image img,
.blog-ver-two .border-img img {
    display: block;
    max-width: 100%;
    height: auto !important;
}

.blog-ver-two a.image-link.site {
    outline-offset: -15px;
    outline: 1px solid var(--blue-outline);
}

body.mobile .blog-ver-two a.image-link.site {
  outline-offset: -10px;
}

.blog-ver-two .headerbar {
    display: block;
    width: 100%;
    border-bottom: 1px solid var(--blue-outline);
    margin: 0 auto;
}

.blog-ver-two .blog-txtcolor-white {
    color: #fff !important;
}

.blog-ver-two .intro-bolt {
    border: 0px; 
    padding: 0px; 
    max-width: 60px !important;
    height: 74px;
    margin: 0px !important; 
}

body.mobile .blog-ver-two .intro-bolt {
    max-width: 4.5rem !important;
    height: auto !important;
}