.not-intro-page #usersite-container div.zoogle-content[content-width~="<700"] .zoogle-columns-33-33-33,
.not-intro-page #usersite-container div.zoogle-content[content-width~="<700"] .zoogle-columns-33-67,
.not-intro-page #usersite-container div.zoogle-content[content-width~="<700"] .zoogle-columns-67-33 {
  display: block
}

.not-intro-page #usersite-container div.zoogle-content[content-width~="<700"] .zoogle-columns-33-33-33 .zoogle-column,
.not-intro-page #usersite-container div.zoogle-content[content-width~="<700"] .zoogle-columns-33-67 .zoogle-column,
.not-intro-page #usersite-container div.zoogle-content[content-width~="<700"] .zoogle-columns-67-33 .zoogle-column {
  width: 100%
}

.not-intro-page #usersite-container div.zoogle-content[content-width~="<500"] .zoogle-columns-50-50 {
  display: block
}

.not-intro-page #usersite-container div.zoogle-content[content-width~="<500"] .zoogle-columns-50-50 .zoogle-column {
  width: 100%
}

.not-intro-page #usersite-container .style-section-style-1.tier-card,
.not-intro-page #usersite-container [class*=section-style]:not(.has-section-styles) {
  --auto-colors-highlight: var(--link-color);
  --auto-colors-highlight-text-hsl: var(--link-color-h), calc(var(--link-color-s)*1%), calc((var(--link-color-l) - 75)*-100%);
  --auto-colors-highlight-text: hsla(var(--auto-colors-highlight-text-hsl), var(--link-color-a));
  --auto-colors-accent-hsl: var(--text-color-h), calc(var(--text-color-s)*1%), calc(var(--text-color-l)*1%);
  --auto-colors-accent: hsla(var(--auto-colors-accent-hsl), 0.2);
  --auto-colors-accent-heavy-hsl: var(--text-color-h), calc(var(--text-color-s)*1%), calc(var(--text-color-l)*1%);
  --auto-colors-accent-heavy: hsla(var(--auto-colors-accent-heavy-hsl), 0.5);
  --auto-colors-accent-dark-hsl: var(--text-color-h), calc(var(--text-color-s)*1%), calc(var(--text-color-l)*1%);
  --auto-colors-accent-dark: hsla(var(--auto-colors-accent-dark-hsl), 0.35);
  --auto-colors-accent-half-hsl: var(--text-color-h), calc(var(--text-color-s)*1%), calc(var(--text-color-l)*1%);
  --auto-colors-accent-half: hsla(var(--auto-colors-accent-half-hsl), 0.1);
  --auto-colors-accent-slight-hsl: var(--text-color-h), calc(var(--text-color-s)*1%), calc(var(--text-color-l)*1%);
  --auto-colors-accent-slight: hsla(var(--auto-colors-accent-slight-hsl), 0.05);
  --auto-colors-text-tertiary-hsl: var(--text-color-h), calc(var(--text-color-s)*1%), calc(var(--text-color-l)*1%);
  --auto-colors-text-tertiary: hsla(var(--auto-colors-text-tertiary-hsl), 0.5);
  background-color: transparent;
  background-color: var(--section-background-color, transparent);
  color: var(--text-color)
}

.not-intro-page #usersite-container .zoogle-columns.default-section-style {
  background-color: transparent
}

#usersite-container.mobile-view #page-title .outer {
  font-size: min(45px, var(--page-title-typeface-size-number))
}

.not-intro-page #usersite-container .landing-page #page-header {
  --responsive-header-height: calc(var(--theme-header-height-number-unitless)*1vh);
  min-height: var(--responsive-header-height)
}

.with-edit-bar .not-intro-page #usersite-container .landing-page #page-header,
.wysiwyg.not-intro-page #usersite-container .landing-page #page-header {
  min-height: calc(var(--responsive-header-height) - 70px)
}

.mobile-view.wysiwyg.not-intro-page #usersite-container .landing-page #page-header {
  min-height: calc(var(--theme-header-height-number-unitless)/100*568px)
}

.has-swmp.not-intro-page #usersite-container .landing-page #page-header {
  min-height: calc(var(--responsive-header-height) - 54px)
}

.with-edit-bar .has-swmp.not-intro-page #usersite-container .landing-page #page-header,
.wysiwyg.has-swmp.not-intro-page #usersite-container .landing-page #page-header {
  min-height: calc(var(--responsive-header-height) - 124px)
}

.not-intro-page #usersite-container .inner-page #page-header {
  min-height: var(--responsive-header-height)
}

.with-edit-bar .not-intro-page #usersite-container .inner-page #page-header,
.wysiwyg.not-intro-page #usersite-container .inner-page #page-header {
  min-height: calc(var(--responsive-header-height) - 70px)
}

.mobile-view.wysiwyg.not-intro-page #usersite-container .inner-page #page-header {
  min-height: calc(var(--header-height-inner-pages-number-unitless)/100*568px)
}

.has-swmp.not-intro-page #usersite-container .inner-page #page-header {
  min-height: calc(var(--responsive-header-height) - 54px)
}

.with-edit-bar .has-swmp.not-intro-page #usersite-container .inner-page #page-header,
.wysiwyg.has-swmp.not-intro-page #usersite-container .inner-page #page-header {
  min-height: calc(var(--responsive-header-height) - 124px)
}

#usersite-container.mobile-view .inner-page #page-header,
#usersite-container.mobile-view .landing-page #page-header {
  --vh-mobile-header-height: calc(var(--mobile-header-height-number-unitless)*1vh)
}

.not-intro-page.mobile-view .mobile-view#usersite-container[data-theme-use-custom-mobile-header-height-boolean="1"] .inner-page #page-header,
.not-intro-page.mobile-view .mobile-view#usersite-container[data-theme-use-custom-mobile-header-height-boolean="1"] .landing-page #page-header {
  min-height: var(--vh-mobile-header-height) !important
}

.mobile-view.has-swmp .mobile-view#usersite-container[data-theme-use-custom-mobile-header-height-boolean="1"] .inner-page #page-header,
.mobile-view.has-swmp .mobile-view#usersite-container[data-theme-use-custom-mobile-header-height-boolean="1"] .landing-page #page-header {
  min-height: calc(var(--vh-mobile-header-height) - 54px) !important
}

.mobile-view.wysiwyg .mobile-view#usersite-container[data-theme-use-custom-mobile-header-height-boolean="1"] .inner-page #page-header,
.mobile-view.wysiwyg .mobile-view#usersite-container[data-theme-use-custom-mobile-header-height-boolean="1"] .landing-page #page-header {
  min-height: calc(var(--mobile-header-height-number-unitless)/100*568px) !important
}

.mobile-view.wysiwyg.has-swmp .mobile-view#usersite-container[data-theme-use-custom-mobile-header-height-boolean="1"] .inner-page #page-header,
.mobile-view.wysiwyg.has-swmp .mobile-view#usersite-container[data-theme-use-custom-mobile-header-height-boolean="1"] .landing-page #page-header {
  min-height: calc(var(--mobile-header-height-number-unitless)/100*568px - 54px) !important
}

@media(max-width:999px) {
  .not-intro-page #usersite-container .page-title .outer {
    font-size: calc(var(--page-title-typeface-size-number)*0.75)
  }
}

.not-intro-page #usersite-container.previewing-within-container[content-width~="<1000"] .page-title .outer {
  font-size: calc(var(--page-title-typeface-size-number)*0.75)
}

.not-intro-page #usersite-container[data-theme-variant-key=d] #content .music-player .track-title .title {
  color: var(--text-color)
}

.not-intro-page #usersite-container * {
  box-sizing: border-box
}

.not-intro-page #usersite-container #container {
  line-height: 1.7
}

.not-intro-page #usersite-container #container .music-player {
  line-height: 1.5
}

.not-intro-page #usersite-container #container .music-player.no-tracks {
  background-color: transparent
}

.not-intro-page #usersite-container #content .heading-primary,
.not-intro-page #usersite-container #content .heading-secondary,
.not-intro-page #usersite-container #content .heading-tertiary {
  color: var(--feature-title-color)
}

.not-intro-page #usersite-container #content .heading-primary {
  font-size: var(--feature-title-typeface-size-number)
}

.not-intro-page #usersite-container #content .heading-secondary {
  font-size: calc(var(--feature-title-typeface-size-number)*0.8)
}

.not-intro-page #usersite-container #content .heading-tertiary {
  font-size: calc(var(--feature-title-typeface-size-number)*0.6)
}

.not-intro-page #usersite-container[data-theme-feature-title-uppercase-boolean="1"] .subtitle {
  text-transform: uppercase
}

.not-intro-page #usersite-container .landing-page #page-header {
  --responsive-header-height: calc(var(--header-height-number-unitless)*1vh)
}

.not-intro-page #usersite-container .inner-page #page-header {
  --responsive-header-height: calc(var(--header-height-inner-pages-number-unitless)*1vh)
}

.not-intro-page #usersite-container #page-header {
  display: flex;
  flex-direction: column
}

.not-intro-page #usersite-container[data-theme-page-title-align-enum=center] #page-header {
  align-items: center
}

.not-intro-page #usersite-container[data-theme-page-title-align-enum=center] #page-header .page-title .outer {
  text-indent: calc(var(--page-title-letterspacing-number)/2)
}

.not-intro-page #usersite-container[data-theme-page-title-align-enum=left] #page-header {
  align-items: flex-start
}

.not-intro-page #usersite-container[data-theme-page-title-align-enum=left] #page-header .my_sites {
  padding-left: 0
}

.not-intro-page #usersite-container[data-theme-page-title-align-enum=right] #page-header {
  align-items: flex-end
}

.not-intro-page #usersite-container[data-theme-page-title-align-enum=right] #page-header .my_sites {
  padding-right: 0
}

.not-intro-page #usersite-container[data-theme-site-wide-my-sites-position-enum=bottom] #page-header {
  flex-direction: column-reverse
}

.not-intro-page #usersite-container[data-theme-page-title-vertical-position-enum=middle] #page-header .title-nav-container {
  margin-top: auto;
  margin-bottom: auto
}

.not-intro-page #usersite-container[data-theme-page-title-vertical-position-enum=top] #page-header .title-nav-container {
  margin-bottom: auto;
  top: 0
}

.not-intro-page #usersite-container[data-theme-page-title-vertical-position-enum=bottom] #page-header .title-nav-container {
  margin-top: auto;
  bottom: 0
}

.not-intro-page #usersite-container[data-theme-page-title-vertical-position-enum=middle][data-theme-site-wide-my-sites-position-enum=bottom] #page-root.has-swms #page-header .title-nav-container {
  top: 2em
}

.not-intro-page #usersite-container .title-nav-container {
  z-index: 2
}

.not-intro-page #usersite-container[data-theme-page-title-align-enum=right] .title-nav-container {
  text-align: right
}

.not-intro-page #usersite-container[data-theme-page-title-align-enum=left] .title-nav-container {
  text-align: left
}

.not-intro-page #usersite-container .nav-bar .site-wrap {
  padding-right: 0;
  padding-left: 0
}

.not-intro-page #usersite-container nav.non-mobile {
  padding-top: 2px
}

.not-intro-page #usersite-container[data-theme-page-title-align-enum=right] nav.non-mobile {
  margin-right: -13px
}

.not-intro-page #usersite-container[data-theme-page-title-align-enum=left] nav.non-mobile {
  margin-left: -13px
}

.ios.mobile-view .not-intro-page #usersite-container[data-theme-page-title-vertical-position-enum=bottom] .inner-page .title-nav-container,
.ios.mobile-view .not-intro-page #usersite-container[data-theme-page-title-vertical-position-enum=bottom] .landing-page .title-nav-container {
  padding-bottom: 75px
}

.not-intro-page #usersite-container .page-media,
.not-intro-page #usersite-container .page-media-container {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-size: cover
}

.not-intro-page #usersite-container .page-media-container {
  background-color: var(--page-background-color)
}

.not-intro-page #usersite-container header .my_sites {
  padding: 2em
}

.not-intro-page #usersite-container:not(.mobile-view) #site-wide-header {
  z-index: 2;
  align-self: center
}

.not-intro-page #usersite-container[data-theme-site-wide-my-sites-align-enum=left]:not(.mobile-view) #site-wide-header {
  align-self: flex-start
}

.not-intro-page #usersite-container[data-theme-site-wide-my-sites-align-enum=right]:not(.mobile-view) #site-wide-header {
  align-self: flex-end
}

.not-intro-page #usersite-container:not(.mobile-view) #site-wide-header li a {
  margin-left: 4px
}

body.wysiwyg:not(.mobile-view) .not-intro-page #usersite-container #site-wide-header .my_site_feature.empty {
  min-width: 30rem
}

.not-intro-page #usersite-container .nav-bar a {
  padding: .5em !important;
  letter-spacing: 2.5px
}

.not-intro-page #usersite-container[data-theme-menu-item-uppercase-boolean="1"] nav a {
  text-transform: uppercase
}

.not-intro-page #usersite-container nav.non-mobile ul ul a {
  padding: 1em !important
}

.not-intro-page #usersite-container nav.mobile {
  background-color: var(--link-color)
}

.not-intro-page #usersite-container nav.mobile a {
  letter-spacing: 1.5px !important
}

.not-intro-page #usersite-container nav.mobile ul.top {
  padding-top: 20px;
  padding-left: 20px
}

.not-intro-page #usersite-container #toggle-mobile-menu {
  position: absolute;
  z-index: 99;
  top: -11px;
  left: 3px;
  font-size: 1.7rem;
  text-align: left
}

.not-intro-page #usersite-container #toggle-mobile-menu a {
  color: var(--page-title-color)
}

.mobile-nav-open .not-intro-page #usersite-container #toggle-mobile-menu a {
  color: var(--mobile-nav-link-color)
}

.not-intro-page #usersite-container .music-player:not(.display-swmp) .progress {
  background-color: var(--link-color)
}

.not-intro-page #usersite-container .music-player:not(.display-swmp) .track-title .title {
  font-size: 1.1em !important
}

.not-intro-page #usersite-container .music-player:not(.display-swmp) .title {
  font-family: var(--feature-title-typeface-style-stack)
}

.not-intro-page #usersite-container[data-theme-feature-title-uppercase-boolean="1"] .music-player:not(.display-swmp) .title {
  text-transform: uppercase
}

.not-intro-page #usersite-container .button {
  font-family: var(--heading-typeface-style-stack)
}

.not-intro-page #usersite-container .calendar_feature .calendar-placeholder-icon .calendar-placeholder-month {
  background-color: var(--sub-menu-background-color);
  color: var(--link-color)
}

.not-intro-page #usersite-container .calendar_feature .calendar-placeholder-icon .calendar-placeholder-day {
  border: 0;
  background-color: var(--page-background-color);
  color: var(--link-color)
}

.not-intro-page #usersite-container .calendar_feature .heading-tertiary {
  padding-bottom: 1em
}

.not-intro-page #usersite-container #content .calendar_feature article {
  padding: 2.5em 0
}

.not-intro-page #usersite-container #content .calendar_feature article:first-child {
  padding-top: p
}

.not-intro-page #usersite-container #content .calendar_feature[feature-width~="<440"] .list-style {
  padding: 2.5em 0
}

.not-intro-page #usersite-container #content .calendar_feature[feature-width~="<440"] .list-style:first-child {
  padding-top: 0
}

.not-intro-page #usersite-container .album-details .heading-album {
  padding-bottom: .2em
}

.not-intro-page #usersite-container .album-details .album-info .heading-secondary {
  font-family: var(--feature-title-typeface-style-stack)
}

.not-intro-page #usersite-container .gallery_feature .button-tertiary {
  margin-top: 2em
}

.not-intro-page #usersite-container .product-details .text-main {
  padding-bottom: .3em
}

.not-intro-page #usersite-container .product-details .text-main span {
  font-size: 16px
}

.not-intro-page #usersite-container.mobile-view #site-wide-header {
  width: 100%;
  margin: 0 auto
}

.not-intro-page .mobile-view#usersite-container[data-theme-site-wide-my-sites-position-enum=top] #site-wide-header {
  order: 0;
  padding-top: .25rem
}

.not-intro-page #usersite-container.mobile-view #site-wide-header .my_sites {
  padding-top: 1em;
  padding-right: 1em
}

.not-intro-page #usersite-container #title-wrap:after,
.not-intro-page #usersite-container #title-wrap:before,
.not-intro-page #usersite-container .title-nav-container:after,
.not-intro-page #usersite-container .title-nav-container:before {
  background: var(--nav-link-rollover-color)
}

.no-touchevents .not-intro-page #usersite-container[data-theme-nav-hover-animation-boolean="1"] nav.non-mobile li.top {
  position: relative
}

.no-touchevents .not-intro-page #usersite-container[data-theme-nav-hover-animation-boolean="1"] nav.non-mobile li.top>div:after,
.no-touchevents .not-intro-page #usersite-container[data-theme-nav-hover-animation-boolean="1"] nav.non-mobile li.top>div:before,
.no-touchevents .not-intro-page #usersite-container[data-theme-nav-hover-animation-boolean="1"] nav.non-mobile li.top a.top:after,
.no-touchevents .not-intro-page #usersite-container[data-theme-nav-hover-animation-boolean="1"] nav.non-mobile li.top a.top:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  transition: all .3s ease;
  opacity: .4;
  background: var(--nav-link-rollover-color)
}

.no-touchevents .not-intro-page #usersite-container[data-theme-nav-hover-animation-boolean="1"] nav.non-mobile li.top>div:before {
  right: 100%;
  bottom: auto;
  left: 1px;
  height: 1px
}

.no-touchevents .not-intro-page #usersite-container[data-theme-nav-hover-animation-boolean="1"] nav.non-mobile li.top>div:hover:before {
  right: 1px
}

.no-touchevents .not-intro-page #usersite-container[data-theme-nav-hover-animation-boolean="1"] nav.non-mobile li.top>div:after {
  top: auto;
  left: 100%;
  height: 1px
}

.no-touchevents .not-intro-page #usersite-container[data-theme-nav-hover-animation-boolean="1"] nav.non-mobile li.top>div:hover:after {
  left: 0
}

.no-touchevents .not-intro-page #usersite-container[data-theme-nav-hover-animation-boolean="1"] nav.non-mobile li.top a.top:before {
  right: auto;
  bottom: 100%;
  width: 1px
}

.no-touchevents .not-intro-page #usersite-container[data-theme-nav-hover-animation-boolean="1"] nav.non-mobile li.top a.top:hover:before {
  bottom: 1px
}

.no-touchevents .not-intro-page #usersite-container[data-theme-nav-hover-animation-boolean="1"] nav.non-mobile li.top a.top:after {
  bottom: 100%;
  left: auto;
  width: 1px
}

.no-touchevents .not-intro-page #usersite-container[data-theme-nav-hover-animation-boolean="1"] nav.non-mobile li.top a.top:hover:after {
  bottom: 1px
}

.wysiwyg.not-intro-page.has-swmp .display-mode-mobile #usersite-container[data-theme-use-custom-mobile-header-height-boolean="1"] .inner-page #page-header,
.wysiwyg.not-intro-page.has-swmp .display-mode-mobile #usersite-container[data-theme-use-custom-mobile-header-height-boolean="1"] .landing-page #page-header {
  min-height: calc(568px*var(--mobile-header-height-number-unitless)/100 - 54px)
}

.wysiwyg.not-intro-page.has-swmp .display-mode-mobile #usersite-container[data-theme-use-custom-mobile-header-height-boolean="0"] .inner-page #page-header,
.wysiwyg.not-intro-page.has-swmp .display-mode-mobile #usersite-container[data-theme-use-custom-mobile-header-height-boolean="0"] .landing-page #page-header {
  min-height: calc(568px*var(--header-height-number-unitless)/100 - 54px)
}

.wysiwyg.not-intro-page .display-mode-mobile #usersite-container[data-theme-use-custom-mobile-header-height-boolean="1"] .inner-page #page-header,
.wysiwyg.not-intro-page .display-mode-mobile #usersite-container[data-theme-use-custom-mobile-header-height-boolean="1"] .landing-page #page-header {
  min-height: calc(568px*var(--mobile-header-height-number-unitless)/100)
}

.wysiwyg.not-intro-page .display-mode-mobile #usersite-container[data-theme-use-custom-mobile-header-height-boolean="0"] .inner-page #page-header,
.wysiwyg.not-intro-page .display-mode-mobile #usersite-container[data-theme-use-custom-mobile-header-height-boolean="0"] .landing-page #page-header {
  min-height: calc(568px*var(--header-height-number-unitless)/100)
}

.screenshot-request #usersite-container:not(.mobile-view) .landing-page #page-header {
  min-height: 672px
}

.not-intro-page #usersite-container .zoogle-columns-first.has-title.padding-small,
.not-intro-page #usersite-container .zoogle-columns-first.has-title.padding-xsmall {
  padding-top: 64px
}

.not-intro-page #usersite-container .zoogle-columns-first.has-title.padding-small .row-title,
.not-intro-page #usersite-container .zoogle-columns-first.has-title.padding-xsmall .row-title {
  margin-top: 0
}

#wysiwyg-designer #usersite-container-inner-wrap .zoogle-columns.hover.bottom:last-of-type.padding-none,
#wysiwyg-designer #usersite-container-inner-wrap .zoogle-columns.hover.bottom:last-of-type.padding-xsmall {
  padding-bottom: 2rem;
  transition: padding .5s ease-in-out
}

#wysiwyg-designer #usersite-container-inner-wrap .zoogle-columns.hover.bottom:last-of-type .toolbar.bottom {
  margin-bottom: 2.25rem
}

.not-intro-page #wysiwyg-designer-wrapper #usersite-container footer.site-wide-footer .zoogle-content.block:first-child .zoogle-columns.padding-none.hover {
  padding-top: 3rem;
  transition: padding .5s ease-in-out
}

.not-intro-page #wysiwyg-designer-wrapper #usersite-container footer.site-wide-footer .zoogle-content.block:first-child .zoogle-columns.padding-none.hover .sections-overlay .toolbar {
  top: 3rem
}

.not-intro-page #wysiwyg-designer-wrapper #usersite-container footer.site-wide-footer .zoogle-content.block:first-child .zoogle-columns.hover.padding-large .sections-overlay,
.not-intro-page #wysiwyg-designer-wrapper #usersite-container footer.site-wide-footer .zoogle-content.block:first-child .zoogle-columns.hover.padding-medium .sections-overlay,
.not-intro-page #wysiwyg-designer-wrapper #usersite-container footer.site-wide-footer .zoogle-content.block:first-child .zoogle-columns.hover.padding-small .sections-overlay,
.not-intro-page #wysiwyg-designer-wrapper #usersite-container footer.site-wide-footer .zoogle-content.block:first-child .zoogle-columns.hover.padding-xlarge .sections-overlay,
.not-intro-page #wysiwyg-designer-wrapper #usersite-container footer.site-wide-footer .zoogle-content.block:first-child .zoogle-columns.hover.padding-xsmall .sections-overlay {
  top: 0
}

.not-intro-page #usersite-container #cart,
.not-intro-page #usersite-container .site-wide-feature-area .zoogle-content,
.not-intro-page #usersite-container .site-wrap {
  --legacy-content-width: 960px;
  max-width: var(--legacy-content-width);
  margin-right: auto;
  margin-left: auto
}

.chromeless-page.not-intro-page #usersite-container #cart,
.chromeless-page.not-intro-page #usersite-container .site-wide-feature-area .zoogle-content,
.chromeless-page.not-intro-page #usersite-container .site-wrap {
  margin: 0;
  max-width: none;
  width: auto
}

.chromeless-page.not-intro-page #usersite-container #cart .zoogle-columns-inner,
.chromeless-page.not-intro-page #usersite-container .site-wide-feature-area .zoogle-content .zoogle-columns-inner,
.chromeless-page.not-intro-page #usersite-container .site-wrap .zoogle-columns-inner {
  width: 100%;
  max-width: var(--legacy-content-width);
  margin-left: auto;
  margin-right: auto
}

.not-intro-page #usersite-container #page-media {
  position: relative
}

.not-intro-page #usersite-container.mobile-view #site-wide-header {
  z-index: 1
}

.not-intro-page #usersite-container #page-header {
  position: relative
}

.not-intro-page #usersite-container .title-nav-container {
  text-align: center
}

body:not(.mobile-view).not-intro-page #usersite-container .title-nav-container {
  position: relative;
  box-sizing: content-box;
  max-width: 960px;
  padding: 1em 5vw
}

body:not(.mobile-view).not-intro-page #usersite-container .title-nav-container .title-wrap {
  margin: 0 -.4em
}

.mobile-view.not-intro-page #usersite-container .title-nav-container {
  padding: 3rem .85rem .85rem
}

.mobile-view.not-intro-page #usersite-container .title-nav-container .title-wrap {
  position: relative
}

body:not(.mobile-view).not-intro-page #usersite-container #main-nav.non-mobile ul.top {
  text-align: inherit
}

.not-intro-page #usersite-container #main-nav.non-mobile,
.not-intro-page #usersite-container .nav-bar.mobile #toggle-mobile-menu {
  display: inline-block;
  vertical-align: middle
}

.not-intro-page #usersite-container #main-nav.non-mobile i.icon-close,
.not-intro-page #usersite-container .nav-bar.mobile #toggle-mobile-menu i.icon-close {
  font-size: 18px
}

.not-intro-page #usersite-container #main-nav.non-mobile li.top,
.not-intro-page #usersite-container #main-nav.non-mobile ul.top,
.not-intro-page #usersite-container .nav-bar.mobile #toggle-mobile-menu li.top,
.not-intro-page #usersite-container .nav-bar.mobile #toggle-mobile-menu ul.top {
  display: inline-block
}

.not-intro-page #usersite-container #main-nav.non-mobile a.top,
.not-intro-page #usersite-container .nav-bar.mobile #toggle-mobile-menu a.top {
  display: inline-block;
  padding: 1em;
  text-align: center
}

.not-intro-page #usersite-container #page-root {
  box-shadow: none
}

.not-intro-page #usersite-container .nav-bar a {
  text-decoration: none
}

.not-intro-page #usersite-container .nav-bar.mobile {
  z-index: 2;
  top: 5px;
  left: 20px;
  width: auto;
  padding-right: 0;
  padding-left: 0
}

.not-intro-page #usersite-container .nav-bar.mobile #toggle-mobile-menu a,
.not-intro-page #usersite-container .nav-bar.mobile #toggle-mobile-menu i {
  display: inline-block;
  width: 100%;
  height: 100%
}

.not-intro-page #usersite-container #page-header nav {
  will-change: transform
}

.not-intro-page #usersite-container #content .blog-article {
  padding-bottom: 1.5em
}

.not-intro-page #usersite-container #content .blog_feature .blog-footer {
  border-top: none
}

.not-intro-page #usersite-container #content .heading-primary {
  margin-bottom: .5em
}

.wysiwyg.not-intro-page #usersite-container #page-header {
  z-index: 100
}

.wysiwyg:not(.has-open-submenu).not-intro-page #usersite-container #content-wrap {
  position: relative;
  z-index: 200
}

#wysiwyg-designer-wrapper #wysiwyg-designer #usersite-container #page-root #page-header .content-container.my_site_feature {
  display: inline-flex;
  padding: 0 1rem
}

#wysiwyg-designer-wrapper #wysiwyg-designer #usersite-container #page-root #page-header .content-container.my_site_feature .empty-feature-container {
  position: relative
}

body.mobile-nav-open #usersite-container #main-nav.mobile {
  z-index: 10
}

body.not-intro-page.has-swmp #usersite-container #container {
  padding-bottom: 0
}

:root {
  --auto-colors-highlight: var(--link-color);
  --auto-colors-highlight-text-hsl: var(--link-color-h), calc(var(--link-color-s)*1%), calc((var(--link-color-l) - 75)*-100%);
  --auto-colors-highlight-text: hsla(var(--auto-colors-highlight-text-hsl), var(--link-color-a));
  --auto-colors-accent-hsl: var(--text-color-h), calc(var(--text-color-s)*1%), calc(var(--text-color-l)*1%);
  --auto-colors-accent: hsla(var(--auto-colors-accent-hsl), 0.2);
  --auto-colors-accent-heavy-hsl: var(--text-color-h), calc(var(--text-color-s)*1%), calc(var(--text-color-l)*1%);
  --auto-colors-accent-heavy: hsla(var(--auto-colors-accent-heavy-hsl), 0.5);
  --auto-colors-accent-dark-hsl: var(--text-color-h), calc(var(--text-color-s)*1%), calc(var(--text-color-l)*1%);
  --auto-colors-accent-dark: hsla(var(--auto-colors-accent-dark-hsl), 0.35);
  --auto-colors-accent-half-hsl: var(--text-color-h), calc(var(--text-color-s)*1%), calc(var(--text-color-l)*1%);
  --auto-colors-accent-half: hsla(var(--auto-colors-accent-half-hsl), 0.1);
  --auto-colors-accent-slight-hsl: var(--text-color-h), calc(var(--text-color-s)*1%), calc(var(--text-color-l)*1%);
  --auto-colors-accent-slight: hsla(var(--auto-colors-accent-slight-hsl), 0.05);
  --auto-colors-text-tertiary-hsl: var(--text-color-h), calc(var(--text-color-s)*1%), calc(var(--text-color-l)*1%);
  --auto-colors-text-tertiary: hsla(var(--auto-colors-text-tertiary-hsl), 0.5)
}

#usersite-container,
#usersite-container button,
#usersite-container legend {
  color: var(--text-color)
}

#usersite-container .FCK__AnchorC {
  color: var(--text-color) !important
}

#usersite-container .text-main,
#usersite-container h1,
#usersite-container h2,
#usersite-container h3,
#usersite-container h4,
#usersite-container h5 {
  color: var(--text-color)
}

#usersite-container .text-main a,
#usersite-container a:not(.btn-wiz),
#usersite-container h1 a,
#usersite-container h2 a,
#usersite-container h3 a,
#usersite-container h4 a,
#usersite-container h5 a {
  color: var(--link-color)
}

#usersite-container .text-secondary {
  color: hsla(var(--text-color-hsl), .75)
}

#usersite-container .text-tertiary {
  color: hsla(var(--text-color-h), calc(var(--text-color-s)*1%), calc(var(--text-color-l)*1%), .5);
  color: var(--auto-colors-text-tertiary)
}

#usersite-container .text-tertiary a {
  color: hsla(var(--text-color-hsl), .85)
}

.no-touchevents #usersite-container .text-tertiary a:focus,
.no-touchevents #usersite-container .text-tertiary a:hover {
  color: var(--text-color)
}

#usersite-container .bg-accent-slight,
.no-touchevents #usersite-container .bg-accent-slight-hover:hover,
.no-touchevents #usersite-container table.ui-collection tr:hover {
  background-color: hsla(var(--text-color-h), calc(var(--text-color-s)*1%), calc(var(--text-color-l)*1%), .05);
  background-color: var(--auto-colors-accent-slight)
}

#usersite-container .bg-accent {
  background-color: hsla(var(--text-color-h), calc(var(--text-color-s)*1%), calc(var(--text-color-l)*1%), .2);
  background-color: var(--auto-colors-accent)
}

#usersite-container .bg-accent-heavy {
  background-color: hsla(var(--text-color-h), calc(var(--text-color-s)*1%), calc(var(--text-color-l)*1%), .5);
  background-color: var(--auto-colors-accent-heavy)
}

#usersite-container .bg-main {
  background-color: var(--text-color)
}

#usersite-container .bg-highlight,
#usersite-container a.bg-highlight {
  transition: background .25s ease-in-out, color .25s ease-in-out;
  border: 1px solid transparent;
  background-color: var(--link-color);
  background-color: var(--auto-colors-highlight);
  color: hsla(var(--link-color-h), calc(var(--link-color-s)*1%), calc((var(--link-color-l) - 75)*-100%), .8);
  color: hsla(var(--auto-colors-highlight-text-hsl), .8)
}

#usersite-container .border-accent,
#usersite-container .border-accent td,
#usersite-container .border-accent th,
#usersite-container table.ui-collection td,
#usersite-container table.ui-collection th,
#usersite-container table.underlined td,
#usersite-container table.underlined th {
  border-color: var(--auto-colors-accent)
}

#usersite-container .border-accent-embossed {
  border-bottom-color: var(--auto-colors-accent);
  border-color: var(--auto-colors-accent) var(--auto-colors-accent) var(--auto-colors-accent-dark)
}

#usersite-container .border-accent-dark {
  border-color: var(--auto-colors-accent)
}

#usersite-container .border-link {
  border-color: var(--link-color);
  border-color: hsla(var(--link-color-hsl), .6)
}

#usersite-container td.spacer {
  background: hsla(var(--text-color-h), calc(var(--text-color-s)*1%), calc(var(--text-color-l)*1%), .2);
  background: var(--auto-colors-accent)
}

#usersite-container table.ui-collection thead tr th,
#usersite-container table.underlined thead tr th {
  color: hsla(var(--text-color-h), calc(var(--text-color-s)*1%), calc(var(--text-color-l)*1%), .5);
  color: var(--auto-colors-text-tertiary)
}

#usersite-container input,
#usersite-container textarea {
  background-color: #fff;
  color: #333;
  margin-bottom: 2px;
  padding: 5px;
  border-radius: 4px;
}

#usersite-container input[type=checkbox],
#usersite-container input[type=image],
#usersite-container input[type=radio] {
  background-color: transparent
}

#usersite-container .simple_form input,
#usersite-container .simple_form textarea {
  border: 1px solid var(--auto-colors-accent)
}

#usersite-container .simple_form input:focus,
#usersite-container .simple_form textarea:focus {
  border-color: var(--auto-colors-highlight);
  box-shadow: 0 0 4px hsla(var(--auto-colors-highlight-hsl), .5)
}

#usersite-container #mobile-header .bar {
  color: var(--text-color)
}

#usersite-container #mobile-header .bar a {
  border-color: var(--text-color);
  color: var(--text-color)
}

#usersite-container .blog_feature .message h2,
#usersite-container .calendar_feature h2,
#usersite-container .image_and_text_feature .image-and-text-feature-container:not(.display-format-collage) h2,
#usersite-container .post .message h2,
#usersite-container .text_feature h2,
#usersite-container .tip_jar_feature h2 {
  color: var(--feature-title-color)
}

#usersite-container .blog_feature .message h3,
#usersite-container .blog_feature .message h3.heading,
#usersite-container .calendar_feature h3,
#usersite-container .calendar_feature h3.heading,
#usersite-container .image_and_text_feature .image-and-text-feature-container:not(.display-format-collage) h3,
#usersite-container .image_and_text_feature .image-and-text-feature-container:not(.display-format-collage) h3.heading,
#usersite-container .post .message h3,
#usersite-container .post .message h3.heading,
#usersite-container .text_feature h3,
#usersite-container .text_feature h3.heading,
#usersite-container .tip_jar_feature h3,
#usersite-container .tip_jar_feature h3.heading {
  color: var(--heading-color)
}

#usersite-container .blog_feature .message h4,
#usersite-container .blog_feature .message h4.subheading,
#usersite-container .calendar_feature h4,
#usersite-container .calendar_feature h4.subheading,
#usersite-container .image_and_text_feature .image-and-text-feature-container:not(.display-format-collage) h4,
#usersite-container .image_and_text_feature .image-and-text-feature-container:not(.display-format-collage) h4.subheading,
#usersite-container .post .message h4,
#usersite-container .post .message h4.subheading,
#usersite-container .text_feature h4,
#usersite-container .text_feature h4.subheading,
#usersite-container .tip_jar_feature h4,
#usersite-container .tip_jar_feature h4.subheading {
  color: var(--secondary-heading-color)
}

#usersite-container .blog_feature .heading-blog,
#usersite-container .blog_feature .heading-blog a,
#usersite-container .blog_feature h3.text-main,
#usersite-container .blog_feature h3.text-main a,
#usersite-container .post .heading-blog,
#usersite-container .post .heading-blog a,
#usersite-container .post h3.text-main,
#usersite-container .post h3.text-main a {
  color: var(--heading-color)
}

#usersite-container .subtitle-wrap {
  color: var(--feature-title-color)
}

#usersite-container footer .branding a {
  color: var(--text-color)
}

#usersite-container :not(.site-wide-feature-area) .my_sites_font_face.-theme-button-color li a {
  fill: var(--button-color)
}

#usersite-container :not(.site-wide-feature-area) .my_sites_font_face.-theme-button-color li a:hover {
  fill: var(--button-hover-color)
}

#usersite-container .track-number {
  color: hsla(var(--text-color-hsl), .4)
}

#usersite-container .pagination {
  border-top: 1px solid hsla(var(--button-color-hsl), .2)
}

#usersite-container .pagination .next a,
#usersite-container .pagination .previous a {
  color: var(--button-color)
}

.no-touchevents #usersite-container .pagination .next a:focus,
.no-touchevents #usersite-container .pagination .next a:hover,
.no-touchevents #usersite-container .pagination .previous a:focus,
.no-touchevents #usersite-container .pagination .previous a:hover {
  color: var(--button-hover-color)
}

#usersite-container .pagination .page a {
  color: var(--button-color)
}

.no-touchevents #usersite-container .pagination .current,
.no-touchevents #usersite-container .pagination .page a:focus,
.no-touchevents #usersite-container .pagination .page a:hover {
  --pagination-contrast-color-hsl: var(--button-color-h), calc(var(--button-color-s)*1%), calc((var(--button-color-l) - 75)*-100%);
  --pagination-contrast-color: hsla(var(--pagination-contrast-color-hsl), var(--button-color-a));
  background-color: var(--button-color);
  color: var(--pagination-contrast-color)
}

.not-intro-page #usersite-container,
body:not(.wysiwyg) {
  background-color: var(--page-background-color)
}

.not-intro-page #usersite-container.mobile-view nav#main-nav.mobile {
  background-color: var(--mobile-nav-background-color)
}

.not-intro-page #usersite-container.mobile-view nav#main-nav.mobile .selected>div {
  position: relative;
  font-weight: 700
}

.not-intro-page #usersite-container.mobile-view nav#main-nav.mobile .selected>div:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: hsla(0, 0%, 60%, .5);
  mix-blend-mode: exclusion
}

#usersite-container nav#main-nav.non-mobile ul ul li a:link,
#usersite-container nav#main-nav.non-mobile ul ul li a:visited {
  background-color: var(--sub-menu-background-color);
  color: var(--sub-menu-link-color);
  color: hsla(var(--sub-menu-link-color-hsl), .8)
}

.no-touchevents #usersite-container nav#main-nav.non-mobile ul ul li a:focus,
.no-touchevents #usersite-container nav#main-nav.non-mobile ul ul li a:hover {
  color: var(--sub-menu-link-color);
}


#usersite-container nav#main-nav.non-mobile ul.horizontal ul:before,
#usersite-container nav#main-nav.non-mobile ul ul:before {
  border-left-color: transparent;
  border-bottom-color: var(--sub-menu-background-color);
  border-right-color: transparent;
  border-top-color: transparent
}

#usersite-container nav#main-nav.non-mobile ul.horizontal ul:after {
  border-left-color: transparent;
  border-bottom-color: transparent;
  border-right-color: transparent;
  border-top-color: var(--sub-menu-background-color)
}

#usersite-container nav#main-nav.non-mobile ul.vertical_right ul:before {
  border-left-color: var(--sub-menu-background-color);
  border-bottom-color: transparent;
  border-right-color: transparent;
  border-top-color: transparent
}

#usersite-container nav#main-nav.non-mobile ul.vertical_left ul:before {
  border-left-color: transparent;
  border-bottom-color: transparent;
  border-right-color: var(--sub-menu-background-color);
  border-top-color: transparent
}

#usersite-container #toggle-mobile-menu a,
#usersite-container nav#main-nav.non-mobile a.top {
  color: var(--nav-link-color)
}

#usersite-container nav#main-nav.non-mobile li.selected a.top,
.no-touchevents #usersite-container #toggle-mobile-menu a:focus,
.no-touchevents #usersite-container #toggle-mobile-menu a:hover,
.no-touchevents #usersite-container nav#main-nav.non-mobile a.top:focus,
.no-touchevents #usersite-container nav#main-nav.non-mobile a.top:hover {
  color: var(--nav-link-rollover-color);
  /* color: rgb(5, 5, 5);
  background-color: rgb(183, 242, 233); */
}

#usersite-container nav.mobile a.top,
#usersite-container nav.mobile ul li a {
  color: var(--mobile-nav-link-color)
}

#usersite-container nav.mobile ul.my-sites li a svg,
#usersite-container nav.mobile ul.my_sites li a svg {
  fill: var(--mobile-nav-link-color)
}

#usersite-container #page-root nav#main-nav,
#usersite-container nav#main-nav {
  font-size: var(--menu-item-typeface-size-number)
}

#usersite-container #page-root nav#main-nav ul ul,
#usersite-container nav#main-nav ul ul {
  --button-ul-size: calc(var(--menu-item-typeface-size-number)*0.7);
  font-size: var(--button-ul-size);
  font-size: max(var(--button-ul-size), 13px)
}

#usersite-container #page-root nav#main-nav.mobile,
#usersite-container nav#main-nav.mobile {
  font-size: 1rem
}

#usersite-container #page-root nav#main-nav.mobile ul ul,
#usersite-container nav#main-nav.mobile ul ul {
  font-size: .8rem
}

#usersite-container nav#main-nav {
  font-family: var(--menu-item-typeface-style-stack);
  font-style: var(--menu-item-typeface-style-font-style);
  font-weight: var(--menu-item-typeface-style-font-weight)
}

#usersite-container[data-theme-menu-item-uppercase-boolean="1"] nav#main-nav {
  text-transform: uppercase
}

#usersite-container[data-theme-menu-item-uppercase-boolean="0"] nav#main-nav {
  text-transform: none
}

#usersite-container[data-theme-content-link-style-enum=underline] a:not(.button) {
  text-decoration: underline
}

#usersite-container .text_feature,
#usersite-container p {
  line-height: var(--content-lineheight-number)
}

#usersite-container,
#usersite-container button,
#usersite-container input,
#usersite-container legend,
#usersite-container textarea {
  font-family: var(--content-typeface-style-stack);
  font-style: var(--content-typeface-style-font-style);
  font-weight: var(--content-typeface-style-font-weight);
  font-size: var(--content-typeface-size-number);
  line-height: 1.5;
}

#usersite-container[data-theme-content-uppercase-boolean="1"]:not(.button),
#usersite-container[data-theme-content-uppercase-boolean="1"] button:not(.button),
#usersite-container[data-theme-content-uppercase-boolean="1"] input:not(.button),
#usersite-container[data-theme-content-uppercase-boolean="1"] legend:not(.button),
#usersite-container[data-theme-content-uppercase-boolean="1"] textarea:not(.button) {
  text-transform: uppercase
}

#usersite-container[data-theme-content-uppercase-boolean="0"]:not(.button),
#usersite-container[data-theme-content-uppercase-boolean="0"] button:not(.button),
#usersite-container[data-theme-content-uppercase-boolean="0"] input:not(.button),
#usersite-container[data-theme-content-uppercase-boolean="0"] legend:not(.button),
#usersite-container[data-theme-content-uppercase-boolean="0"] textarea:not(.button) {
  text-transform: none
}

#usersite-container .gallery_feature li {
  font-size: var(--content-typeface-size-number)
}

#usersite-container footer .branding a {
  text-decoration: none
}

#usersite-container #ckeditor-toolbar .content-selected {
  font-family: var(--content-typeface-style-stack);
  font-style: var(--content-typeface-style-font-style);
  font-weight: var(--content-typeface-style-font-weight)
}

#usersite-container[data-theme-content-uppercase-boolean="1"] #ckeditor-toolbar .content-selected:not(.button) {
  text-transform: uppercase
}

#usersite-container[data-theme-content-uppercase-boolean="0"] #ckeditor-toolbar .content-selected:not(.button) {
  text-transform: none
}

#usersite-container .alt-font {
  font-family: var(--heading-typeface-style-stack);
  font-style: var(--heading-typeface-style-font-style);
  font-weight: var(--heading-typeface-style-font-weight);
  line-height: var(--heading-lineheight-number);
  font-size: var(--heading-typeface-size-number)
}

#usersite-container[data-theme-heading-uppercase-boolean="1"] .alt-font {
  text-transform: uppercase
}

#usersite-container[data-theme-heading-uppercase-boolean="0"] .alt-font {
  text-transform: none
}

#usersite-container .blog_feature .message h3,
#usersite-container .calendar_feature h3,
#usersite-container .image_and_text_feature h3,
#usersite-container .post .message h3,
#usersite-container .text_feature h3,
#usersite-container .tip_jar_feature h3,
#usersite-container .website-page-subscription-page h3 {
  font-family: var(--heading-typeface-style-stack);
  font-style: var(--heading-typeface-style-font-style);
  font-weight: var(--heading-typeface-style-font-weight);
  line-height: var(--heading-lineheight-number);
  font-size: var(--heading-typeface-size-number)
}

#usersite-container[data-theme-heading-uppercase-boolean="1"] .blog_feature .message h3,
#usersite-container[data-theme-heading-uppercase-boolean="1"] .calendar_feature h3,
#usersite-container[data-theme-heading-uppercase-boolean="1"] .image_and_text_feature h3,
#usersite-container[data-theme-heading-uppercase-boolean="1"] .post .message h3,
#usersite-container[data-theme-heading-uppercase-boolean="1"] .text_feature h3,
#usersite-container[data-theme-heading-uppercase-boolean="1"] .tip_jar_feature h3,
#usersite-container[data-theme-heading-uppercase-boolean="1"] .website-page-subscription-page h3 {
  text-transform: uppercase
}

#usersite-container[data-theme-heading-uppercase-boolean="0"] .blog_feature .message h3,
#usersite-container[data-theme-heading-uppercase-boolean="0"] .calendar_feature h3,
#usersite-container[data-theme-heading-uppercase-boolean="0"] .image_and_text_feature h3,
#usersite-container[data-theme-heading-uppercase-boolean="0"] .post .message h3,
#usersite-container[data-theme-heading-uppercase-boolean="0"] .text_feature h3,
#usersite-container[data-theme-heading-uppercase-boolean="0"] .tip_jar_feature h3,
#usersite-container[data-theme-heading-uppercase-boolean="0"] .website-page-subscription-page h3 {
  text-transform: none
}

#usersite-container h1 a:not(.button),
#usersite-container h2 a:not(.button),
#usersite-container h3 a:not(.button),
#usersite-container h4 a:not(.button),
#usersite-container h5 a:not(.button),
#usersite-container h6 a:not(.button) {
  text-decoration: none
}

#usersite-container #ckeditor-toolbar .heading-1-selected {
  font-family: var(--heading-typeface-style-stack);
  font-style: var(--heading-typeface-style-font-style);
  font-weight: var(--heading-typeface-style-font-weight);
  line-height: var(--heading-lineheight-number)
}

#usersite-container[data-theme-heading-uppercase-boolean="1"] #ckeditor-toolbar .heading-1-selected {
  text-transform: uppercase
}

#usersite-container[data-theme-heading-uppercase-boolean="0"] #ckeditor-toolbar .heading-1-selected {
  text-transform: none
}

#usersite-container .blog_feature .message h4,
#usersite-container .calendar_feature h4,
#usersite-container .image_and_text_feature h4,
#usersite-container .post .message h4,
#usersite-container .text_feature h4,
#usersite-container .website-page-subscription-page h4 {
  font-family: var(--secondary-heading-typeface-style-stack);
  font-style: var(--secondary-heading-typeface-style-font-style);
  font-weight: var(--secondary-heading-typeface-style-font-weight);
  line-height: var(--secondary-heading-lineheight-number);
  font-size: var(--secondary-heading-typeface-size-number)
}

#usersite-container[data-theme-secondary-heading-uppercase-boolean="1"] .blog_feature .message h4,
#usersite-container[data-theme-secondary-heading-uppercase-boolean="1"] .calendar_feature h4,
#usersite-container[data-theme-secondary-heading-uppercase-boolean="1"] .image_and_text_feature h4,
#usersite-container[data-theme-secondary-heading-uppercase-boolean="1"] .post .message h4,
#usersite-container[data-theme-secondary-heading-uppercase-boolean="1"] .text_feature h4,
#usersite-container[data-theme-secondary-heading-uppercase-boolean="1"] .website-page-subscription-page h4 {
  text-transform: uppercase
}

#usersite-container[data-theme-secondary-heading-uppercase-boolean="0"] .blog_feature .message h4,
#usersite-container[data-theme-secondary-heading-uppercase-boolean="0"] .calendar_feature h4,
#usersite-container[data-theme-secondary-heading-uppercase-boolean="0"] .image_and_text_feature h4,
#usersite-container[data-theme-secondary-heading-uppercase-boolean="0"] .post .message h4,
#usersite-container[data-theme-secondary-heading-uppercase-boolean="0"] .text_feature h4,
#usersite-container[data-theme-secondary-heading-uppercase-boolean="0"] .website-page-subscription-page h4 {
  text-transform: none
}

#usersite-container #ckeditor-toolbar .heading-2-selected {
  font-family: var(--secondary-heading-typeface-style-stack);
  font-style: var(--secondary-heading-typeface-style-font-style);
  font-weight: var(--secondary-heading-typeface-style-font-weight);
  line-height: var(--secondary-heading-lineheight-number)
}

#usersite-container[data-theme-secondary-heading-uppercase-boolean="1"] #ckeditor-toolbar .heading-2-selected {
  text-transform: uppercase
}

#usersite-container[data-theme-secondary-heading-uppercase-boolean="0"] #ckeditor-toolbar .heading-2-selected {
  text-transform: none
}

#usersite-container .subtitle-wrap {
  font-family: var(--feature-title-typeface-style-stack);
  font-style: var(--feature-title-typeface-style-font-style);
  font-weight: var(--feature-title-typeface-style-font-weight);
  letter-spacing: var(--feature-title-letterspacing-number);
  line-height: var(--feature-title-lineheight-number);
  font-size: var(--feature-title-typeface-size-number)
}

#usersite-container[data-theme-feature-title-uppercase-boolean="1"] .subtitle-wrap {
  text-transform: uppercase
}

#usersite-container[data-theme-feature-title-uppercase-boolean="0"] .subtitle-wrap {
  text-transform: none
}

#usersite-container .blog_feature .message h2,
#usersite-container .post .message h2,
#usersite-container .text_feature h2 {
  font-family: var(--feature-title-typeface-style-stack);
  font-style: var(--feature-title-typeface-style-font-style);
  font-weight: var(--feature-title-typeface-style-font-weight);
  letter-spacing: var(--feature-title-letterspacing-number);
  line-height: var(--feature-title-lineheight-number);
  font-size: var(--feature-title-typeface-size-number)
}

#usersite-container[data-theme-feature-title-uppercase-boolean="1"] .blog_feature .message h2,
#usersite-container[data-theme-feature-title-uppercase-boolean="1"] .post .message h2,
#usersite-container[data-theme-feature-title-uppercase-boolean="1"] .text_feature h2 {
  text-transform: uppercase
}

#usersite-container[data-theme-feature-title-uppercase-boolean="0"] .blog_feature .message h2,
#usersite-container[data-theme-feature-title-uppercase-boolean="0"] .post .message h2,
#usersite-container[data-theme-feature-title-uppercase-boolean="0"] .text_feature h2 {
  text-transform: none
}

#usersite-container .zoogle-columns.title-alignment-center .blog_feature .message h2,
#usersite-container .zoogle-columns.title-alignment-center .post .message h2,
#usersite-container .zoogle-columns.title-alignment-center .subtitle-wrap,
#usersite-container .zoogle-columns.title-alignment-center .text_feature h2 {
  padding-left: var(--feature-title-letterspacing-number)
}

#usersite-container #ckeditor-toolbar .title-selected {
  font-family: var(--feature-title-typeface-style-stack);
  font-style: var(--feature-title-typeface-style-font-style);
  font-weight: var(--feature-title-typeface-style-font-weight);
  letter-spacing: var(--feature-title-letterspacing-number);
  line-height: var(--feature-title-lineheight-number)
}

#usersite-container[data-theme-feature-title-uppercase-boolean="1"] #ckeditor-toolbar .title-selected {
  text-transform: uppercase
}

#usersite-container[data-theme-feature-title-uppercase-boolean="0"] #ckeditor-toolbar .title-selected {
  text-transform: none
}

h1#page-title.display-type-logo {
  width: var(--page-title-logo-size-number);
  max-width: calc(var(--page-title-logo-size-number-unitless)*1vw)
}

h1#page-title.display-type-logo img,
h1#page-title.display-type-logo span {
  width: 100%
}

#page-root.display-type-logo [data-logo-size-target] {
  width: var(--page-title-logo-size-number)
}

#page-root.display-type-logo [data-logo-size-target] h1#page-title.display-type-logo {
  width: 100%
}

#page-title span.outer {
  color: var(--page-title-color)
}

#usersite-container .project-name {
  font-family: var(--page-title-typeface-style-stack);
  font-style: var(--page-title-typeface-style-font-style);
  font-weight: var(--page-title-typeface-style-font-weight);
  letter-spacing: var(--page-title-letterspacing-number)
}

#usersite-container[data-theme-page-title-uppercase-boolean="1"] .project-name {
  text-transform: uppercase
}

#usersite-container[data-theme-page-title-uppercase-boolean="0"] .project-name {
  text-transform: none
}

#usersite-container h1#page-title .outer {
  font-family: var(--page-title-typeface-style-stack);
  font-style: var(--page-title-typeface-style-font-style);
  font-weight: var(--page-title-typeface-style-font-weight);
  letter-spacing: var(--page-title-letterspacing-number);
  font-size: var(--page-title-typeface-size-number)
}

#usersite-container[data-theme-page-title-uppercase-boolean="1"] h1#page-title .outer {
  text-transform: uppercase
}

#usersite-container[data-theme-page-title-uppercase-boolean="0"] h1#page-title .outer {
  text-transform: none
}

#usersite-container h1#page-title.display-type-logo span.outer,
#usersite-container h1#page-title.display-type-none span.outer {
  font-size: 0
}

#usersite-container h1#page-title.display-type-none span {
  display: none
}

#usersite-container #title-wrap h1#page-title.display-type-logo span,
#usersite-container #title-wrap h1#page-title.display-type-logo span img {
  width: 100%
}

#usersite-container.mobile-view h1#page-title .outer {
  letter-spacing: normal
}

.image-filter-container {
  position: relative;
  display: inline-block;
  z-index: 1;
  width: 100%
}

#usersite-container .page-media-container:after,
#usersite-container .page-media-container:before,
.image-filter-container-before-and-after,
.image-filter-container .image-filter-overlay,
.image-filter-container:after,
.image-filter-container:before {
  content: "";
  display: block;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  position: absolute;
  pointer-events: none;
  z-index: 9
}

#usersite-container .page-media-container:after,
#usersite-container .page-media-container:before,
.image-filter-container-after,
.image-filter-container:after {
  z-index: 10
}

#usersite-container[data-theme-image-filter-enum=darken] .page-media-container .page-photo,
#usersite-container[data-theme-image-filter-enum=darken] .page-media-container video.page-media,
.filter-darken {
  filter: brightness(.8)
}

#usersite-container[data-theme-image-filter-enum=darken] .page-media-container .no-cssfilters .page-photo:after,
#usersite-container[data-theme-image-filter-enum=darken] .page-media-container .no-cssfilters video.page-media:after,
.filter-darken-no-cssfilters,
.no-cssfilters #usersite-container[data-theme-image-filter-enum=darken] .page-media-container .page-photo:after,
.no-cssfilters #usersite-container[data-theme-image-filter-enum=darken] .page-media-container:after,
.no-cssfilters #usersite-container[data-theme-image-filter-enum=darken] .page-media-container video.page-media:after,
.no-cssfilters .filter-darken:after {
  background: #000
}

#usersite-container[data-theme-image-filter-enum=lighten] .page-media-container .page-photo,
#usersite-container[data-theme-image-filter-enum=lighten] .page-media-container video.page-media,
.filter-lighten {
  filter: brightness(1.2)
}

#usersite-container[data-theme-image-filter-enum=lighten] .page-media-container .no-cssfilters .page-photo:after,
#usersite-container[data-theme-image-filter-enum=lighten] .page-media-container .no-cssfilters video.page-media:after,
.filter-lighten-no-cssfilters,
.no-cssfilters #usersite-container[data-theme-image-filter-enum=lighten] .page-media-container .page-photo:after,
.no-cssfilters #usersite-container[data-theme-image-filter-enum=lighten] .page-media-container:after,
.no-cssfilters #usersite-container[data-theme-image-filter-enum=lighten] .page-media-container video.page-media:after,
.no-cssfilters .filter-lighten:after {
  background: #fff
}

#usersite-container[data-theme-image-filter-enum=grayscale] .page-media-container .page-photo,
#usersite-container[data-theme-image-filter-enum=grayscale] .page-media-container video.page-media,
.filter-grayscale {
  filter: saturate(0) contrast(1.1) brightness(1.1)
}

#usersite-container[data-theme-image-filter-enum=grayscale] .page-media-container .no-cssfilters .page-photo:after,
#usersite-container[data-theme-image-filter-enum=grayscale] .page-media-container .no-cssfilters video.page-media:after,
.filter-grayscale-no-cssfilters,
.no-cssfilters #usersite-container[data-theme-image-filter-enum=grayscale] .page-media-container .page-photo:after,
.no-cssfilters #usersite-container[data-theme-image-filter-enum=grayscale] .page-media-container:after,
.no-cssfilters #usersite-container[data-theme-image-filter-enum=grayscale] .page-media-container video.page-media:after,
.no-cssfilters .filter-grayscale:after {
  background: #000
}

#usersite-container[data-theme-image-filter-enum="1977"] .page-media-container .page-photo,
#usersite-container[data-theme-image-filter-enum="1977"] .page-media-container video.page-media,
.filter-1977 {
  filter: contrast(1.1) brightness(1.1) saturate(1.3)
}

#usersite-container[data-theme-image-filter-enum="1977"] .page-media-container:after,
.filter-1977-container-after,
.filter-1977-container:after {
  background: rgba(243, 106, 188, .3);
  mix-blend-mode: screen
}

#usersite-container[data-theme-image-filter-enum=brannan] .page-media-container .page-photo,
#usersite-container[data-theme-image-filter-enum=brannan] .page-media-container video.page-media,
.filter-brannan {
  filter: sepia(.5) contrast(1.4)
}

#usersite-container[data-theme-image-filter-enum=brannan] .page-media-container:after,
.filter-brannan-container-after,
.filter-brannan-container:after {
  background-color: rgba(161, 44, 199, .31);
  mix-blend-mode: lighten
}

#usersite-container[data-theme-image-filter-enum=brooklyn] .page-media-container .page-photo,
#usersite-container[data-theme-image-filter-enum=brooklyn] .page-media-container video.page-media,
.filter-brooklyn {
  filter: contrast(.9) brightness(1.1)
}

#usersite-container[data-theme-image-filter-enum=brooklyn] .page-media-container:after,
.filter-brooklyn-container-after,
.filter-brooklyn-container:after {
  background: radial-gradient(circle, rgba(168, 223, 193, .4) 70%, #c4b7c8);
  mix-blend-mode: overlay
}

#usersite-container[data-theme-image-filter-enum=earlybird] .page-media-container .page-photo,
#usersite-container[data-theme-image-filter-enum=earlybird] .page-media-container video.page-media,
.filter-earlybird {
  filter: contrast(.9) sepia(.2)
}

#usersite-container[data-theme-image-filter-enum=earlybird] .page-media-container:after,
.filter-earlybird-container-after,
.filter-earlybird-container:after {
  background: radial-gradient(circle, #d0ba8e 20%, #360309 85%, #1d0210 100%);
  mix-blend-mode: overlay
}

#usersite-container[data-theme-image-filter-enum=gingham] .page-media-container .page-photo,
#usersite-container[data-theme-image-filter-enum=gingham] .page-media-container video.page-media,
.filter-gingham {
  filter: brightness(1.05) hue-rotate(-10deg)
}

#usersite-container[data-theme-image-filter-enum=gingham] .page-media-container:after,
.filter-gingham-container-after,
.filter-gingham-container:after {
  background: #e6e6fa;
  mix-blend-mode: soft-light
}

#usersite-container[data-theme-image-filter-enum=kelvin] .page-media-container:after,
.filter-kelvin-container-after,
.filter-kelvin-container:after {
  background: #b77d21;
  mix-blend-mode: overlay
}

#usersite-container[data-theme-image-filter-enum=kelvin] .page-media-container:before,
.filter-kelvin-container-before,
.filter-kelvin-container:before {
  background: #382c34;
  mix-blend-mode: color-dodge
}

#usersite-container[data-theme-image-filter-enum=moon] .page-media-container .page-photo,
#usersite-container[data-theme-image-filter-enum=moon] .page-media-container video.page-media,
.filter-moon {
  filter: grayscale(1) contrast(1.1) brightness(1.1)
}

#usersite-container[data-theme-image-filter-enum=moon] .page-media-container:after,
.filter-moon-container-after,
.filter-moon-container:after {
  background: #383838;
  mix-blend-mode: lighten
}

#usersite-container[data-theme-image-filter-enum=moon] .page-media-container:before,
.filter-moon-container-before,
.filter-moon-container:before {
  background: #a0a0a0;
  mix-blend-mode: soft-light
}

#usersite-container[data-theme-image-filter-enum=nashville] .page-media-container .page-photo,
#usersite-container[data-theme-image-filter-enum=nashville] .page-media-container video.page-media,
.filter-nashville {
  filter: sepia(.2) contrast(1.2) brightness(1.05) saturate(1.2)
}

#usersite-container[data-theme-image-filter-enum=nashville] .page-media-container:after,
.filter-nashville-container-after,
.filter-nashville-container:after {
  background: rgba(0, 70, 150, .4);
  mix-blend-mode: lighten
}

#usersite-container[data-theme-image-filter-enum=nashville] .page-media-container:before,
.filter-nashville-container-before,
.filter-nashville-container:before {
  background: rgba(247, 176, 153, .56);
  mix-blend-mode: darken
}

#usersite-container[data-theme-image-filter-enum=toaster] .page-media-container .page-photo,
#usersite-container[data-theme-image-filter-enum=toaster] .page-media-container video.page-media,
.filter-toaster {
  filter: contrast(1.5) brightness(.9)
}

#usersite-container[data-theme-image-filter-enum=toaster] .page-media-container:after,
.filter-toaster-container-after,
.filter-toaster-container:after {
  background: radial-gradient(circle, #804e0f, #3b003b);
  mix-blend-mode: screen
}

#usersite-container[data-theme-image-filter-enum=walden] .page-media-container .page-photo,
#usersite-container[data-theme-image-filter-enum=walden] .page-media-container video.page-media,
.filter-walden {
  filter: brightness(1.1) hue-rotate(-10deg) sepia(.3) saturate(1.6)
}

#usersite-container[data-theme-image-filter-enum=walden] .page-media-container:after,
.filter-walden-container-after,
.filter-walden-container:after {
  background: #04c;
  mix-blend-mode: screen;
  opacity: .3
}

#usersite-container[data-theme-image-filter-enum=xpro2] .page-media-container .page-photo,
#usersite-container[data-theme-image-filter-enum=xpro2] .page-media-container video.page-media,
.filter-xpro2 {
  filter: sepia(.3)
}

#usersite-container[data-theme-image-filter-enum=xpro2] .page-media-container:after,
.filter-xpro2-container-after,
.filter-xpro2-container:after {
  background: radial-gradient(circle, #e6e7e0 40%, rgba(43, 42, 161, .6) 110%);
  mix-blend-mode: color-burn
}

#usersite-container[data-theme-image-filter-enum=dots] .page-media-container:after,
.filter-dots-container-after,
.filter-dots-container:after {
  background-image: radial-gradient(#fff 15%, transparent 17%);
  background-size: 14px 14px;
  opacity: .3
}

#usersite-container[data-theme-image-filter-enum=squares] .page-media-container:after,
.filter-squares-container-after,
.filter-squares-container:after {
  background-image: url("data:image/svg+xml;utf8,%3Csvg%20width%3D%22100px%22%20height%3D%22100px%22%20viewBox%3D%220%200%20100%20100%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%3Cg%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill%3D%22%23000000%22%20fill-rule%3D%22evenodd%22%3E%3Crect%20fill%3D%22%23000000%22%20x%3D%220%22%20y%3D%220%22%20width%3D%2233px%22%20height%3D%2233px%22%3E%3C%2Frect%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  background-repeat: repeat;
  background-size: 10px 10px;
  opacity: .3
}

#usersite-container[data-theme-image-filter-enum=custom] .page-media-container:after {
  background-color: var(--image-filter-custom-color);
  mix-blend-mode: var(--image-filter-custom-mode-enum)
}

#usersite-container #page-footer .zoogle-columns,
#usersite-container #site-wide-header .zoogle-columns,
.wysiwyg #usersite-container #page-footer .zoogle-columns,
.wysiwyg #usersite-container #site-wide-header .zoogle-columns {
  height: auto !important
}

#usersite-container #page-footer .zoogle-columns .my_sites li,
#usersite-container #site-wide-header .zoogle-columns .my_sites li,
.wysiwyg #usersite-container #page-footer .zoogle-columns .my_sites li,
.wysiwyg #usersite-container #site-wide-header .zoogle-columns .my_sites li {
  margin: 0 8px;
  padding: .5rem
}

#usersite-container #page-footer .zoogle-columns .my_sites li a,
#usersite-container #site-wide-header .zoogle-columns .my_sites li a,
.wysiwyg #usersite-container #page-footer .zoogle-columns .my_sites li a,
.wysiwyg #usersite-container #site-wide-header .zoogle-columns .my_sites li a {
  display: flex;
  align-items: center;
  justify-content: center
}

#usersite-container #page-footer .zoogle-columns .my_sites li a svg,
#usersite-container #site-wide-header .zoogle-columns .my_sites li a svg,
.wysiwyg #usersite-container #page-footer .zoogle-columns .my_sites li a svg,
.wysiwyg #usersite-container #site-wide-header .zoogle-columns .my_sites li a svg {
  width: var(--site-wide-my-sites-size-number);
  height: var(--site-wide-my-sites-size-number);
  fill: var(--site-wide-my-sites-color)
}

.no-touchevents #usersite-container #page-footer .zoogle-columns .my_sites li a:hover svg,
.no-touchevents #usersite-container #site-wide-header .zoogle-columns .my_sites li a:hover svg,
.no-touchevents .wysiwyg #usersite-container #page-footer .zoogle-columns .my_sites li a:hover svg,
.no-touchevents .wysiwyg #usersite-container #site-wide-header .zoogle-columns .my_sites li a:hover svg {
  fill: var(--site-wide-my-sites-hover-color)
}

#wysiwyg-designer-wrapper.display-mode-mobile #usersite-container #main-nav.mobile .my_site_feature {
  padding: 0
}

#wysiwyg-designer-wrapper.display-mode-mobile #usersite-container #main-nav.mobile .my_site_feature ul.my_sites {
  text-align: left
}

#usersite-container[data-theme-site-wide-my-sites-align-enum=left] #site-wide-header .my_sites {
  justify-content: flex-start
}

.mobile-view #usersite-container[data-theme-site-wide-my-sites-align-enum=left] #site-wide-header .my_sites {
  padding-left: 3rem
}

#usersite-container[data-theme-site-wide-my-sites-align-enum=center] #site-wide-header .my_sites {
  justify-content: center
}

#usersite-container[data-theme-site-wide-my-sites-align-enum=right] #site-wide-header .my_sites {
  justify-content: flex-end
}

#usersite-container #sticky-footer,
#usersite-container #swmp {
  --swmp-background-hsl: var(--text-color-h), calc(var(--text-color-s)*1%), calc(var(--text-color-l)*1%);
  --swmp-background: hsla(var(--swmp-background-hsl), 1);
  --swmp-text-hsl: var(--text-color-h), calc(var(--text-color-s)*1%), calc((var(--text-color-l) - 75)*-100%);
  --swmp-text: hsla(var(--swmp-text-hsl), var(--text-color-a))
}

#usersite-container[data-theme-swmp-use-custom-colors-boolean="1"] #sticky-footer,
#usersite-container[data-theme-swmp-use-custom-colors-boolean="1"] #swmp {
  --swmp-background-hsl: var(--swmp-background-color-h), calc(var(--swmp-background-color-s)*1%), calc(var(--swmp-background-color-l)*1%);
  --swmp-background: hsla(var(--swmp-background-hsl), 1)
}

[data-theme-swmp-use-custom-colors-boolean="1"]#usersite-container[data-theme-swmp-text-color-enum=black] #sticky-footer,
[data-theme-swmp-use-custom-colors-boolean="1"]#usersite-container[data-theme-swmp-text-color-enum=black] #swmp {
  --swmp-text-hsl: 0, 0%, 0%;
  --swmp-text-h: 0;
  --swmp-text-s: 0%;
  --swmp-text-l: 0%;
  --swmp-text-a: 1;
  --swmp-text: #000
}

[data-theme-swmp-use-custom-colors-boolean="1"]#usersite-container[data-theme-swmp-text-color-enum=white] #sticky-footer,
[data-theme-swmp-use-custom-colors-boolean="1"]#usersite-container[data-theme-swmp-text-color-enum=white] #swmp {
  --swmp-text-hsl: 360, 100%, 100%;
  --swmp-text-h: 360;
  --swmp-text-s: 100%;
  --swmp-text-l: 100%;
  --swmp-text-a: 1;
  --swmp-text: #fff
}

#usersite-container #sticky-footer .music_feature .music-player.display-swmp,
#usersite-container #swmp .music_feature .music-player.display-swmp {
  background-color: hsla(var(--swmp-background-hsl), .95)
}

#usersite-container[data-theme-swmp-use-custom-colors-boolean="1"] #sticky-footer .music_feature .music-player.display-swmp:not(.is-expandable),
#usersite-container[data-theme-swmp-use-custom-colors-boolean="1"] #swmp .music_feature .music-player.display-swmp:not(.is-expandable) {
  border-top: 1px solid var(--swmp-background);
  background-color: hsla(var(--swmp-background-hsl), .95);
  background-image: linear-gradient(0deg, hsla(0, 0%, 100%, .1), hsla(0, 0%, 100%, 0))
}

#usersite-container[data-theme-swmp-use-custom-colors-boolean="1"] #sticky-footer .music_feature .music-player.display-swmp.is-expandable .player,
#usersite-container[data-theme-swmp-use-custom-colors-boolean="1"] #sticky-footer .music_feature .music-player.display-swmp.is-expandable .player-extra,
#usersite-container[data-theme-swmp-use-custom-colors-boolean="1"] #swmp .music_feature .music-player.display-swmp.is-expandable .player,
#usersite-container[data-theme-swmp-use-custom-colors-boolean="1"] #swmp .music_feature .music-player.display-swmp.is-expandable .player-extra {
  background-color: var(--swmp-background)
}

#usersite-container[data-theme-swmp-use-custom-colors-boolean="1"] #sticky-footer .music_feature .music-player.display-swmp span.title,
#usersite-container[data-theme-swmp-use-custom-colors-boolean="1"] #swmp .music_feature .music-player.display-swmp span.title {
  color: var(--swmp-text-color-enum)
}

#usersite-container #sticky-footer .music_feature .music-player.display-swmp .track-list .track-icon-playing,
#usersite-container #sticky-footer .music_feature .music-player.display-swmp .track-list .track-number,
#usersite-container #swmp .music_feature .music-player.display-swmp .track-list .track-icon-playing,
#usersite-container #swmp .music_feature .music-player.display-swmp .track-list .track-number {
  color: var(--swmp-text)
}

#usersite-container #sticky-footer .music_feature .music-player.display-swmp.is-expandable,
#usersite-container #swmp .music_feature .music-player.display-swmp.is-expandable {
  border-top: none;
  background-color: transparent;
  background-image: none
}

#usersite-container #sticky-footer .music_feature .music-player.display-swmp.is-expandable .player,
#usersite-container #sticky-footer .music_feature .music-player.display-swmp.is-expandable .player-extra,
#usersite-container #sticky-footer .music_feature .music-player.display-swmp.is-expandable .swmp-header,
#usersite-container #swmp .music_feature .music-player.display-swmp.is-expandable .player,
#usersite-container #swmp .music_feature .music-player.display-swmp.is-expandable .player-extra,
#usersite-container #swmp .music_feature .music-player.display-swmp.is-expandable .swmp-header {
  background-color: var(--swmp-background)
}

#usersite-container #sticky-footer .music_feature .music-player.display-swmp.is-expandable .track-list li:hover,
#usersite-container #swmp .music_feature .music-player.display-swmp.is-expandable .track-list li:hover {
  background-color: hsla(var(--swmp-text-hsl), .08)
}

#usersite-container #sticky-footer .music_feature .music-player.display-swmp .title,
#usersite-container #swmp .music_feature .music-player.display-swmp .title {
  color: hsla(var(--swmp-text-hsl), .9)
}

#usersite-container #sticky-footer .music_feature .music-player.display-swmp .artist,
#usersite-container #sticky-footer .music_feature .music-player.display-swmp .by-artist,
#usersite-container #swmp .music_feature .music-player.display-swmp .artist,
#usersite-container #swmp .music_feature .music-player.display-swmp .by-artist {
  color: hsla(var(--swmp-text-hsl), .6)
}

#usersite-container #sticky-footer .music_feature .music-player.display-swmp .artist span,
#usersite-container #sticky-footer .music_feature .music-player.display-swmp .by-artist span,
#usersite-container #swmp .music_feature .music-player.display-swmp .artist span,
#usersite-container #swmp .music_feature .music-player.display-swmp .by-artist span {
  color: hsla(var(--swmp-text-hsl), .7)
}

#usersite-container #sticky-footer .music_feature .music-player.display-swmp .player .action .button,
#usersite-container #sticky-footer .music_feature .music-player.display-swmp .swmp-header .action .button,
#usersite-container #swmp .music_feature .music-player.display-swmp .player .action .button,
#usersite-container #swmp .music_feature .music-player.display-swmp .swmp-header .action .button {
  min-width: 55px;
  font-size: 12px
}

#usersite-container #sticky-footer .music_feature .music-player.display-swmp .player a.button,
#usersite-container #sticky-footer .music_feature .music-player.display-swmp .player a.play-button,
#usersite-container #sticky-footer .music_feature .music-player.display-swmp .swmp-header a.button,
#usersite-container #sticky-footer .music_feature .music-player.display-swmp .swmp-header a.play-button,
#usersite-container #swmp .music_feature .music-player.display-swmp .player a.button,
#usersite-container #swmp .music_feature .music-player.display-swmp .player a.play-button,
#usersite-container #swmp .music_feature .music-player.display-swmp .swmp-header a.button,
#usersite-container #swmp .music_feature .music-player.display-swmp .swmp-header a.play-button {
  border-color: transparent;
  background-color: hsla(var(--swmp-text-hsl), .3)
}

html.no-touchevents #usersite-container #sticky-footer .music_feature .music-player.display-swmp .player a.button:focus,
html.no-touchevents #usersite-container #sticky-footer .music_feature .music-player.display-swmp .player a.button:hover,
html.no-touchevents #usersite-container #sticky-footer .music_feature .music-player.display-swmp .player a.play-button:focus,
html.no-touchevents #usersite-container #sticky-footer .music_feature .music-player.display-swmp .player a.play-button:hover,
html.no-touchevents #usersite-container #sticky-footer .music_feature .music-player.display-swmp .swmp-header a.button:focus,
html.no-touchevents #usersite-container #sticky-footer .music_feature .music-player.display-swmp .swmp-header a.button:hover,
html.no-touchevents #usersite-container #sticky-footer .music_feature .music-player.display-swmp .swmp-header a.play-button:focus,
html.no-touchevents #usersite-container #sticky-footer .music_feature .music-player.display-swmp .swmp-header a.play-button:hover,
html.no-touchevents #usersite-container #swmp .music_feature .music-player.display-swmp .player a.button:focus,
html.no-touchevents #usersite-container #swmp .music_feature .music-player.display-swmp .player a.button:hover,
html.no-touchevents #usersite-container #swmp .music_feature .music-player.display-swmp .player a.play-button:focus,
html.no-touchevents #usersite-container #swmp .music_feature .music-player.display-swmp .player a.play-button:hover,
html.no-touchevents #usersite-container #swmp .music_feature .music-player.display-swmp .swmp-header a.button:focus,
html.no-touchevents #usersite-container #swmp .music_feature .music-player.display-swmp .swmp-header a.button:hover,
html.no-touchevents #usersite-container #swmp .music_feature .music-player.display-swmp .swmp-header a.play-button:focus,
html.no-touchevents #usersite-container #swmp .music_feature .music-player.display-swmp .swmp-header a.play-button:hover {
  background-color: hsla(var(--swmp-text-hsl), .325);
  border-color: var(--button-hover-color)
}

html.no-touchevents #usersite-container #sticky-footer .music_feature .music-player.display-swmp .player a.button:active,
html.no-touchevents #usersite-container #sticky-footer .music_feature .music-player.display-swmp .player a.play-button:active,
html.no-touchevents #usersite-container #sticky-footer .music_feature .music-player.display-swmp .swmp-header a.button:active,
html.no-touchevents #usersite-container #sticky-footer .music_feature .music-player.display-swmp .swmp-header a.play-button:active,
html.no-touchevents #usersite-container #swmp .music_feature .music-player.display-swmp .player a.button:active,
html.no-touchevents #usersite-container #swmp .music_feature .music-player.display-swmp .player a.play-button:active,
html.no-touchevents #usersite-container #swmp .music_feature .music-player.display-swmp .swmp-header a.button:active,
html.no-touchevents #usersite-container #swmp .music_feature .music-player.display-swmp .swmp-header a.play-button:active {
  background-color: hsla(var(--swmp-text-hsl), .35)
}

#usersite-container #sticky-footer .music_feature .music-player.display-swmp .player .button,
#usersite-container #sticky-footer .music_feature .music-player.display-swmp .player a,
#usersite-container #sticky-footer .music_feature .music-player.display-swmp .swmp-header .button,
#usersite-container #sticky-footer .music_feature .music-player.display-swmp .swmp-header a,
#usersite-container #swmp .music_feature .music-player.display-swmp .player .button,
#usersite-container #swmp .music_feature .music-player.display-swmp .player a,
#usersite-container #swmp .music_feature .music-player.display-swmp .swmp-header .button,
#usersite-container #swmp .music_feature .music-player.display-swmp .swmp-header a {
  color: var(--swmp-text);
  text-decoration: none;
  --swmp-text-hover-hsl: var(--swmp-text-h), calc(var(--swmp-text-s)*1%), calc((var(--swmp-text-l) - 65)*-100%);
  --swmp-text-hover: hsla(var(--swmp-text-hover-hsl), var(--swmp-text-a));
  --swmp-text-button-color-hsl: var(--button-hover-color-h), calc(var(--button-hover-color-s)*1%), calc((var(--button-hover-color-l) - 65)*-100%);
  --swmp-text-button-color: hsla(var(--swmp-text-button-color-hsl), var(--button-hover-color-a))
}

#usersite-container #sticky-footer .music_feature .music-player.display-swmp .player .button:hover,
#usersite-container #sticky-footer .music_feature .music-player.display-swmp .player a:hover,
#usersite-container #sticky-footer .music_feature .music-player.display-swmp .swmp-header .button:hover,
#usersite-container #sticky-footer .music_feature .music-player.display-swmp .swmp-header a:hover,
#usersite-container #swmp .music_feature .music-player.display-swmp .player .button:hover,
#usersite-container #swmp .music_feature .music-player.display-swmp .player a:hover,
#usersite-container #swmp .music_feature .music-player.display-swmp .swmp-header .button:hover,
#usersite-container #swmp .music_feature .music-player.display-swmp .swmp-header a:hover {
  color: var(--swmp-text-button-color)
}

#usersite-container #sticky-footer .music_feature .music-player.display-swmp .player .progress,
#usersite-container #sticky-footer .music_feature .music-player.display-swmp .swmp-header .progress,
#usersite-container #swmp .music_feature .music-player.display-swmp .player .progress,
#usersite-container #swmp .music_feature .music-player.display-swmp .swmp-header .progress {
  background: hsla(var(--swmp-text-hsl), .4)
}

#usersite-container #sticky-footer .music_feature .music-player.display-swmp .player .progress .position,
#usersite-container #sticky-footer .music_feature .music-player.display-swmp .swmp-header .progress .position,
#usersite-container #swmp .music_feature .music-player.display-swmp .player .progress .position,
#usersite-container #swmp .music_feature .music-player.display-swmp .swmp-header .progress .position {
  background: hsla(var(--swmp-text-hsl), .7)
}

#usersite-container #sticky-footer .music_feature .music-player.display-swmp .text-tertiary,
#usersite-container #sticky-footer .music_feature .music-player.display-swmp .time,
#usersite-container #swmp .music_feature .music-player.display-swmp .text-tertiary,
#usersite-container #swmp .music_feature .music-player.display-swmp .time {
  color: hsla(var(--swmp-text-hsl), .7)
}

#usersite-container[data-theme-button-shape-enum=rounded] .button,
#usersite-container[data-theme-button-shape-enum=rounded] form.simple_form input,
#usersite-container[data-theme-button-shape-enum=rounded] form.simple_form input[type=button],
#usersite-container[data-theme-button-shape-enum=rounded] form.simple_form input[type=reset],
#usersite-container[data-theme-button-shape-enum=rounded] form.simple_form input[type=submit],
#usersite-container[data-theme-button-shape-enum=rounded] form.simple_form textarea {
  border-radius: 4px
}

#usersite-container[data-theme-button-shape-enum=rounded] .button-circle {
  border-radius: 40px
}

#usersite-container[data-theme-button-shape-enum=square] .button,
#usersite-container[data-theme-button-shape-enum=square] form.simple_form input,
#usersite-container[data-theme-button-shape-enum=square] form.simple_form input[type=button],
#usersite-container[data-theme-button-shape-enum=square] form.simple_form input[type=reset],
#usersite-container[data-theme-button-shape-enum=square] form.simple_form input[type=submit],
#usersite-container[data-theme-button-shape-enum=square] form.simple_form textarea,
#usersite-container[data-theme-button-shape-enum=square] nav#main-nav.non-mobile ul li.top li.subpage a {
  border-radius: 0
}

#usersite-container[data-theme-button-shape-enum=pill] .button,
#usersite-container[data-theme-button-shape-enum=pill] form.simple_form input,
#usersite-container[data-theme-button-shape-enum=pill] form.simple_form input[type=button],
#usersite-container[data-theme-button-shape-enum=pill] form.simple_form input[type=reset],
#usersite-container[data-theme-button-shape-enum=pill] form.simple_form input[type=submit] {
  border-radius: 40px
}

#usersite-container[data-theme-button-shape-enum=pill] form.simple_form textarea {
  border-radius: 15px
}

.intro-page #usersite-container .button,
.intro-page #usersite-container input[type=submit],
.not-intro-page #usersite-container .button,
.not-intro-page #usersite-container input[type=submit] {
  --button-accessible-font-color-hsl: var(--button-color-h), calc(var(--button-color-s)*1%), calc((var(--button-color-l) - 75)*-100%);
  --button-accessible-font-color: hsla(var(--button-accessible-font-color-hsl), var(--button-color-a));
  --button-hover-accessible-font-color-hsl: var(--button-hover-color-h), calc(var(--button-hover-color-s)*1%), calc((var(--button-hover-color-l) - 75)*-100%);
  --button-hover-accessible-font-color: hsla(var(--button-hover-accessible-font-color-hsl), var(--button-hover-color-a));
  transition: background .2s ease-in-out, border-color .2s ease-in-out, color .25s ease-in-out;
  border: 1px solid transparent
}

.intro-page #usersite-container .button.disabled,
.intro-page #usersite-container .button[disabled],
.intro-page #usersite-container input[type=submit].disabled,
.intro-page #usersite-container input[type=submit][disabled],
.not-intro-page #usersite-container .button.disabled,
.not-intro-page #usersite-container .button[disabled],
.not-intro-page #usersite-container input[type=submit].disabled,
.not-intro-page #usersite-container input[type=submit][disabled] {
  --button-color: hsla(calc(var(--button-color-h)), calc(var(--button-color-s)*1% - 10%), calc(var(--button-color-l)*1% - 20%), calc(var(--button-color-a)));
  --button-hover-color: var(--button-color)
}

.intro-page #usersite-container .button:not(.button-secondary):not(.button-tertiary),
.intro-page #usersite-container .simple_form input[type=submit],
.intro-page #usersite-container input[type=submit],
.not-intro-page #usersite-container .button:not(.button-secondary):not(.button-tertiary),
.not-intro-page #usersite-container .simple_form input[type=submit],
.not-intro-page #usersite-container input[type=submit] {
  background-color: var(--button-color);
  color: hsla(var(--button-accessible-font-color-hsl), .8);

}

.no-touchevents .intro-page #usersite-container .button:not(.button-secondary):not(.button-tertiary):active,
.no-touchevents .intro-page #usersite-container .button:not(.button-secondary):not(.button-tertiary):focus,
.no-touchevents .intro-page #usersite-container .button:not(.button-secondary):not(.button-tertiary):hover,
.no-touchevents .intro-page #usersite-container .simple_form input[type=submit]:active,
.no-touchevents .intro-page #usersite-container .simple_form input[type=submit]:focus,
.no-touchevents .intro-page #usersite-container .simple_form input[type=submit]:hover,
.no-touchevents .intro-page #usersite-container input[type=submit]:active,
.no-touchevents .intro-page #usersite-container input[type=submit]:focus,
.no-touchevents .intro-page #usersite-container input[type=submit]:hover,
.no-touchevents .not-intro-page #usersite-container .button:not(.button-secondary):not(.button-tertiary):active,
.no-touchevents .not-intro-page #usersite-container .button:not(.button-secondary):not(.button-tertiary):focus,
.no-touchevents .not-intro-page #usersite-container .button:not(.button-secondary):not(.button-tertiary):hover,
.no-touchevents .not-intro-page #usersite-container .simple_form input[type=submit]:active,
.no-touchevents .not-intro-page #usersite-container .simple_form input[type=submit]:focus,
.no-touchevents .not-intro-page #usersite-container .simple_form input[type=submit]:hover,
.no-touchevents .not-intro-page #usersite-container input[type=submit]:active,
.no-touchevents .not-intro-page #usersite-container input[type=submit]:focus,
.no-touchevents .not-intro-page #usersite-container input[type=submit]:hover {
  background-color: var(--button-hover-color);
  color: hsla(var(--button-hover-accessible-font-color-hsl), .8);
}

.intro-page #usersite-container .button-secondary,
.not-intro-page #usersite-container .button-secondary {
  border-color: var(--button-color);
  color: var(--button-color)
}

.no-touchevents .intro-page #usersite-container .button-secondary:active,
.no-touchevents .intro-page #usersite-container .button-secondary:focus,
.no-touchevents .intro-page #usersite-container .button-secondary:hover,
.no-touchevents .not-intro-page #usersite-container .button-secondary:active,
.no-touchevents .not-intro-page #usersite-container .button-secondary:focus,
.no-touchevents .not-intro-page #usersite-container .button-secondary:hover {
  border-color: var(--button-hover-color);
  background-color: var(--button-hover-color);
  color: var(--button-hover-accessible-font-color)
}

.intro-page #usersite-container .button-tertiary,
.not-intro-page #usersite-container .button-tertiary {
  border: none
}

.no-touchevents .intro-page #usersite-container .button-tertiary:not(.small):active,
.no-touchevents .intro-page #usersite-container .button-tertiary:not(.small):focus,
.no-touchevents .intro-page #usersite-container .button-tertiary:not(.small):hover,
.no-touchevents .not-intro-page #usersite-container .button-tertiary:not(.small):active,
.no-touchevents .not-intro-page #usersite-container .button-tertiary:not(.small):focus,
.no-touchevents .not-intro-page #usersite-container .button-tertiary:not(.small):hover {
  text-decoration: underline
}

.no-touchevents .intro-page #usersite-container .button-tertiary.small:active,
.no-touchevents .intro-page #usersite-container .button-tertiary.small:focus,
.no-touchevents .intro-page #usersite-container .button-tertiary.small:hover,
.no-touchevents .not-intro-page #usersite-container .button-tertiary.small:active,
.no-touchevents .not-intro-page #usersite-container .button-tertiary.small:focus,
.no-touchevents .not-intro-page #usersite-container .button-tertiary.small:hover {
  background-color: var(--button-hover-color);
  color: var(--button-hover-accessible-font-color)
}

.intro-page #usersite-container[data-theme-button-style-enum=outline] .button:not(.button-secondary):not(.button-tertiary),
.intro-page #usersite-container[data-theme-button-style-enum=outline] .simple_form input[type=submit],
.intro-page #usersite-container[data-theme-button-style-enum=outline] input[type=submit],
.not-intro-page #usersite-container[data-theme-button-style-enum=outline] .button:not(.button-secondary):not(.button-tertiary),
.not-intro-page #usersite-container[data-theme-button-style-enum=outline] .simple_form input[type=submit],
.not-intro-page #usersite-container[data-theme-button-style-enum=outline] input[type=submit] {
  border-color: var(--button-color);
  background-color: transparent;
  color: var(--button-color)
}

.no-touchevents .intro-page #usersite-container[data-theme-button-style-enum=outline] .button:not(.button-secondary):not(.button-tertiary):active,
.no-touchevents .intro-page #usersite-container[data-theme-button-style-enum=outline] .button:not(.button-secondary):not(.button-tertiary):focus,
.no-touchevents .intro-page #usersite-container[data-theme-button-style-enum=outline] .button:not(.button-secondary):not(.button-tertiary):hover,
.no-touchevents .intro-page #usersite-container[data-theme-button-style-enum=outline] .simple_form input[type=submit]:active,
.no-touchevents .intro-page #usersite-container[data-theme-button-style-enum=outline] .simple_form input[type=submit]:focus,
.no-touchevents .intro-page #usersite-container[data-theme-button-style-enum=outline] .simple_form input[type=submit]:hover,
.no-touchevents .intro-page #usersite-container[data-theme-button-style-enum=outline] input[type=submit]:active,
.no-touchevents .intro-page #usersite-container[data-theme-button-style-enum=outline] input[type=submit]:focus,
.no-touchevents .intro-page #usersite-container[data-theme-button-style-enum=outline] input[type=submit]:hover,
.no-touchevents .not-intro-page #usersite-container[data-theme-button-style-enum=outline] .button:not(.button-secondary):not(.button-tertiary):active,
.no-touchevents .not-intro-page #usersite-container[data-theme-button-style-enum=outline] .button:not(.button-secondary):not(.button-tertiary):focus,
.no-touchevents .not-intro-page #usersite-container[data-theme-button-style-enum=outline] .button:not(.button-secondary):not(.button-tertiary):hover,
.no-touchevents .not-intro-page #usersite-container[data-theme-button-style-enum=outline] .simple_form input[type=submit]:active,
.no-touchevents .not-intro-page #usersite-container[data-theme-button-style-enum=outline] .simple_form input[type=submit]:focus,
.no-touchevents .not-intro-page #usersite-container[data-theme-button-style-enum=outline] .simple_form input[type=submit]:hover,
.no-touchevents .not-intro-page #usersite-container[data-theme-button-style-enum=outline] input[type=submit]:active,
.no-touchevents .not-intro-page #usersite-container[data-theme-button-style-enum=outline] input[type=submit]:focus,
.no-touchevents .not-intro-page #usersite-container[data-theme-button-style-enum=outline] input[type=submit]:hover {
  border-color: var(--button-hover-color);
  background-color: var(--button-hover-color);
  color: var(--button-hover-accessible-font-color)
}

.intro-page #usersite-container[data-theme-button-style-enum=outline] .button-secondary,
.not-intro-page #usersite-container[data-theme-button-style-enum=outline] .button-secondary {
  border-color: var(--button-color);
  background-color: transparent
}

.no-touchevents .intro-page #usersite-container[data-theme-button-style-enum=outline] .button-secondary:active,
.no-touchevents .intro-page #usersite-container[data-theme-button-style-enum=outline] .button-secondary:focus,
.no-touchevents .intro-page #usersite-container[data-theme-button-style-enum=outline] .button-secondary:hover,
.no-touchevents .not-intro-page #usersite-container[data-theme-button-style-enum=outline] .button-secondary:active,
.no-touchevents .not-intro-page #usersite-container[data-theme-button-style-enum=outline] .button-secondary:focus,
.no-touchevents .not-intro-page #usersite-container[data-theme-button-style-enum=outline] .button-secondary:hover {
  background-color: var(--button-hover-color);
  color: var(--button-hover-accessible-font-color)
}

.intro-page #usersite-container {
  color: var(--intro-page-text-color)
}

.intro-page #usersite-container,
.intro-page #usersite-container #container-wrap {
  background-color: var(--intro-page-background-color)
}

.no-touchevents .intro-page #usersite-container a:not(.button):link,
.no-touchevents .intro-page #usersite-container a:not(.button):visited {
  color: var(--intro-page-text-color)
}

.intro-page #usersite-container .button,
.intro-page #usersite-container input[type=submit] {
  background-color: var(--intro-page-text-color);
  color: var(--intro-page-background-color)
}

.no-touchevents .intro-page #usersite-container .button:focus,
.no-touchevents .intro-page #usersite-container .button:hover,
.no-touchevents .intro-page #usersite-container input[type=submit]:focus,
.no-touchevents .intro-page #usersite-container input[type=submit]:hover {
  opacity: .8
}

.not-intro-page #usersite-container header .my_sites {
  padding: 2em 0 0
}

.not-intro-page #usersite-container.mobile-view .nav-bar.mobile #toggle-mobile-menu {
  top: 0
}

.not-intro-page #usersite-container.mobile-view .nav-bar.mobile #toggle-mobile-menu a,
.not-intro-page #usersite-container.mobile-view .nav-bar.mobile #toggle-mobile-menu i {
  width: inherit
}

.not-intro-page #usersite-container.mobile-view .nav-bar.mobile #toggle-mobile-menu i {
  display: flex;
  align-items: center;
  height: var(--site-wide-my-sites-size-number)
}

.not-intro-page #usersite-container.mobile-view .nav-bar.mobile #toggle-mobile-menu i.icon-menu:before {
  line-height: normal
}

.not-intro-page #usersite-container.mobile-view #site-wide-header .my_sites {
  padding: .25em 1em
}

.not-intro-page .mobile-view#usersite-container[data-theme-site-wide-my-sites-position-enum=top] #page-root:not(.hide-navigation-menu) #site-wide-header .my_sites {
  justify-content: flex-end
}

.not-intro-page #usersite-container[data-theme-feature-backgrounds-boolean="1"] .default-section-style .music-player:not(.display-swmp) {
  padding: 2em;
  background-color: var(--sub-menu-background-color)
}

.not-intro-page #usersite-container[data-theme-feature-backgrounds-boolean="1"] #content .default-section-style .zoogle-column-2-of-2.layout_third {
  margin-top: 10px;
  margin-bottom: 10px;
  padding-right: 10px
}

.not-intro-page #usersite-container[data-theme-feature-backgrounds-boolean="1"] #content .default-section-style .zoogle-column-2-of-2.layout_third .zoogle-feature {
  padding: 1em;
  background-color: var(--sub-menu-background-color)
}

.not-intro-page #usersite-container[data-theme-feature-backgrounds-boolean="1"] #content .default-section-style .zoogle-column-2-of-2.layout_third .block-title-feature,
.not-intro-page #usersite-container[data-theme-feature-backgrounds-boolean="1"] #content .default-section-style .zoogle-column-2-of-2.layout_third .title_feature.layout_full,
.not-intro-page #usersite-container[data-theme-feature-backgrounds-boolean="1"] #content .default-section-style .zoogle-column-2-of-2.layout_third .zoogle-feature-placeholder:first-child+.zoogle-feature.layout_full,
.not-intro-page #usersite-container[data-theme-feature-backgrounds-boolean="1"] #content .default-section-style .zoogle-column-2-of-2.layout_third .zoogle-feature.layout_full:first-child {
  border-top: 2px solid var(--feature-title-color)
}

.not-intro-page #usersite-container[data-theme-feature-backgrounds-boolean="1"] #content .default-section-style .zoogle-column-2-of-2.layout_third .block-title-feature:not(:first-child),
.not-intro-page #usersite-container[data-theme-feature-backgrounds-boolean="1"] #content .default-section-style .zoogle-column-2-of-2.layout_third .title_feature.layout_full:not(:first-child),
.not-intro-page #usersite-container[data-theme-feature-backgrounds-boolean="1"] #content .default-section-style .zoogle-column-2-of-2.layout_third .zoogle-feature-placeholder:first-child+.zoogle-feature.layout_full:not(:first-child),
.not-intro-page #usersite-container[data-theme-feature-backgrounds-boolean="1"] #content .default-section-style .zoogle-column-2-of-2.layout_third .zoogle-feature.layout_full:first-child:not(:first-child) {
  margin-top: 4rem
}

.not-intro-page #usersite-container[data-theme-feature-backgrounds-boolean="1"] #content .default-section-style .zoogle-column-2-of-2.layout_third .music-player:not(.display-swmp) {
  padding: 0
}

html:not(.mobile-view):not(.screenshot-request) .not-intro-page #usersite-container[data-theme-loading-animation-boolean="1"] .landing-page #page-header #title-wrap:after,
html:not(.mobile-view):not(.screenshot-request) .not-intro-page #usersite-container[data-theme-loading-animation-boolean="1"] .landing-page #page-header #title-wrap:before,
html:not(.mobile-view):not(.screenshot-request) .not-intro-page #usersite-container[data-theme-loading-animation-boolean="1"] .landing-page #page-header .title-nav-container:after,
html:not(.mobile-view):not(.screenshot-request) .not-intro-page #usersite-container[data-theme-loading-animation-boolean="1"] .landing-page #page-header .title-nav-container:before {
  content: "";
  position: absolute;
  -webkit-animation: topBorder ease-in 1;
  animation: topBorder ease-in 1;
  -webkit-animation-duration: .5s;
  animation-duration: .5s;
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
  opacity: .6
}

html:not(.mobile-view):not(.screenshot-request) .not-intro-page #usersite-container[data-theme-loading-animation-boolean="1"] .landing-page #page-header .title-nav-container:before {
  top: 0;
  right: 0;
  bottom: auto;
  height: 1px;
  -webkit-animation-name: topBorder;
  animation-name: topBorder
}

.video-thumnail iframe {
  border: 1px solid blue;
  margin: 50px 0;
}

.video-thumnail div.caption {
  border: 1px solid red;
  z-index: 100;
  color: orange;
}


@-webkit-keyframes topBorder {
  0% {
    left: 33%
  }

  to {
    left: 100%
  }
}

@keyframes topBorder {
  0% {
    left: 33%
  }

  to {
    left: 100%
  }
}

html:not(.mobile-view):not(.screenshot-request) .not-intro-page #usersite-container[data-theme-loading-animation-boolean="1"] .landing-page #page-header .title-nav-container:after {
  top: auto;
  bottom: 0;
  left: 0;
  height: 1px;
  -webkit-animation-name: bottomBorder;
  animation-name: bottomBorder
}

@-webkit-keyframes bottomBorder {
  0% {
    right: 33%
  }

  to {
    right: 100%
  }
}

@keyframes bottomBorder {
  0% {
    right: 33%
  }

  to {
    right: 100%
  }
}

html:not(.mobile-view):not(.screenshot-request) .not-intro-page #usersite-container[data-theme-loading-animation-boolean="1"] .landing-page #page-header #title-wrap:before {
  right: auto;
  left: 0;
  width: 1px;
  -webkit-animation-name: leftBorder;
  animation-name: leftBorder
}

@-webkit-keyframes leftBorder {
  0% {
    top: 0;
    bottom: 66%
  }

  50% {
    top: 0;
    bottom: 0
  }

  to {
    top: 100%;
    bottom: 0
  }
}

@keyframes leftBorder {
  0% {
    top: 0;
    bottom: 66%
  }

  50% {
    top: 0;
    bottom: 0
  }

  to {
    top: 100%;
    bottom: 0
  }
}

html:not(.mobile-view):not(.screenshot-request) .not-intro-page #usersite-container[data-theme-loading-animation-boolean="1"] .landing-page #page-header #title-wrap:after {
  right: 0;
  bottom: 0;
  left: auto;
  width: 1px;
  -webkit-animation-name: rightBorder;
  animation-name: rightBorder
}

@-webkit-keyframes rightBorder {
  0% {
    top: 33%
  }

  to {
    top: 100%
  }
}

@keyframes rightBorder {
  0% {
    top: 33%
  }

  to {
    top: 100%
  }
}

html:not(.mobile-view):not(.screenshot-request) .not-intro-page #usersite-container[data-theme-loading-animation-boolean="1"] .landing-page #page-header .nav-bar {
  -webkit-animation: navLift cubic-bezier(.075, .82, .165, 1) 1;
  animation: navLift cubic-bezier(.075, .82, .165, 1) 1;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both
}

@-webkit-keyframes navLift {
  0% {
    transform: translate(30px, 30px);
    opacity: 0
  }

  to {
    transform: translate(0);
    opacity: 1
  }
}

@keyframes navLift {
  0% {
    transform: translate(30px, 30px);
    opacity: 0
  }

  to {
    transform: translate(0);
    opacity: 1
  }
}

html:not(.mobile-view):not(.screenshot-request) .not-intro-page #usersite-container[data-theme-loading-animation-boolean="1"] .landing-page #page-header .page-title {
  -webkit-animation: titleGrow cubic-bezier(.075, .82, .165, 1) 1;
  animation: titleGrow cubic-bezier(.075, .82, .165, 1) 1;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both
}

@-webkit-keyframes titleGrow {
  0% {
    transform: translateX(-50%) scale(0);
    opacity: 0
  }

  to {
    transform: translateX(0) scale(1);
    opacity: 1
  }
}

@keyframes titleGrow {
  0% {
    transform: translateX(-50%) scale(0);
    opacity: 0
  }

  to {
    transform: translateX(0) scale(1);
    opacity: 1
  }
}