* {
  /*
  font-family: Inter, -apple-system, system-ui;
  -webkit-font-smoothing: antialiased;
  */

  /*
  font-family: -apple-system, system-ui, BlinkMacSystemFont,
             'Segoe UI', Roboto, 'Helvetica Neue',
             Ubuntu, Arial, sans-serif;
             */
  font-family: -apple-system, BlinkMacSystemFont, sans-serif;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6, p, html, body, section {
  margin: 0;
}

.medium-zoom-image--opened {
  z-index: 3000;
}
.medium-zoom-overlay {
  z-index: 2999;
}
@media only screen and (max-width: 768px) {
}

a[hidden] {
  display: none;
}

nav.top {
  background-color: #fff;
  position: fixed;
  top: 0;
  z-index: 20000;
  display: flex;
  align-items: center;
  width: 100%;
  padding: 10px 0;
  height: 26px;
  border-bottom: 1px solid #eee;
  box-shadow: 0 0 25px -8px #999;
}
nav.top > a.home {
  outline: none;
}
nav.top > a.home > img {
  margin-left: min(5vw, 31px);
  margin-top: min(2vw, 8px);
  width: 116px;
}
nav.top > a.call {
  margin-left: auto;
  margin-right: 5%;
}
nav.top > a.call > img {
  width: 32px;
  margin-top: 10px;
}
nav.top .spacer {
  width: 100%;
}
nav.top a#call-support {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  white-space: nowrap;
  text-decoration: none;
  color: #263859;
  top: 2px;
  font-size: 20px;
  font-weight: 700;
  margin-left: 42px;
}
@media only screen and (max-width: 768px) {
  nav.top a#call-support {
    position: absolute;
    top: .8rem;
    right: 5%;
  }
}

nav.top a#referrals,
nav.top a#learn,
nav.top a#communities {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  white-space: nowrap;
  text-decoration: none;
  color: #263859;
  top: 2px;
  font-size: 12px;
  margin-right: 3%;
  font-weight: 700;
}
@media only screen and (max-width: 768px) {
  nav.top a#referrals,
  nav.top a#learn,
  nav.top a#communities {
    visibility: hidden;
  }
}
nav.top a#referrals > img,
nav.top a#learn > img,
nav.top a#communities > img {
  width: 28px;
  position: relative;
  top: -2px;
}
nav.top a#call-support > img {
  width: 28px;
}
nav.top a#call-support > span,
nav.top a#referrals > span,
nav.top a#learn > span,
nav.top a#communities > span {
  position: relative;
  top: -2px;
}

nav.bottom {
  display: flex;
  justify-content: space-around;
  position: fixed;
  background-color: #fff;
  bottom: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  width: 100%;
  padding: 25px 0;
  height: 32px;
  border-bottom: 1px solid #eee;
  box-shadow: 0 0 25px -8px #999;
  visibility: hidden;
}
@media only screen and (max-width: 768px) {
  nav.bottom {
    visibility: visible;
  }
}
nav.bottom a {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  white-space: nowrap;
  text-decoration: none;
  color: #263859;
  top: 2px;
  font-size: 12px;
  font-weight: 700;
}
nav.bottom span {
  font-size: 16px;
}
nav.bottom a > img {
  width: 35px;
}
nav.bottom a#referrals > img,
nav.bottom a#learn > img,
nav.bottom a#communities > img {
  position: relative;
  top: -1px;
}
nav.bottom a#call-support {
  margin-right: 3%;
}

#community-pagination {
  opacity: 0;
  padding-top: 50px;
  padding-bottom: 50px;
}
#community-pagination.posts-loaded {
  opacity: 1;
}

#community-pagination .ellipsis {
  margin-left: 8px;
  margin-right: 8px;
}

#community-pagination a.community-page-button {
  color: black;
  text-decoration: none;
  margin-left: 5px;
  margin-right: 5px;
  border-radius: 3px;
  padding: 4px 8px;
  border: 1px solid #999;
  background-color: #fff;
  cursor: pointer;
}
#community-pagination a.community-page-button[disabled] {
  color: #999;
  cursor: default;
}

#show-more-posts {
  display: flex;
  justify-content: center;
  width: 100%;
  opacity: 0;
  transition: opacity 0.25s;
  margin-bottom: 30px
}
#show-more-posts.posts-loaded {
  opacity: 1;
}

#show-more-posts button {
  border-radius: 8px;
  font-size: 26px;
  width: 603px;
  height: 75px;
  cursor: pointer;
  border: none;
  outline: none;
  transition: background-color 0.42s;
  background-color: #f02849;
  color: #fff;
}
@media only screen and (max-width: 768px) {
  #show-more-posts button {
    width: 96%;
  }
}
#show-more-posts button.loading {
  background-color: #c4c4c4;
}

footer {
  background-color: #1e0735;
  padding-top: 72px;
  padding-right: 10px;
  padding-left: 10px;
  padding-bottom: 128px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
}

footer.hidden {
  display: none;
}

footer h2 {
  margin-top: 25px;
  font-size: min(8vw, 20px);
  line-height: 28px;
  color: #fff;
  text-align: center;
}

footer p {
  color: hsla(0, 0%, 100%, .5);
  font-size: min(7vw, 14px);
}

footer a {
  text-decoration: none;
}

#footer-top {
  width: 100%;
  max-width: 328px;
  margin-bottom: 30px;
}

#footer-top img {
  max-width: 98%;
}

#footer-logo {
  display: flex;
  align-items: center;
  justify-content: center;
}

#footer-socials {
  margin-bottom: 41px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-column-gap: 20px;
}

#footer-bottom {
  display: flex;
  margin-top: 16px;
  padding-right: 25px;
}

#footer-bottom > .col-0 {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

#footer-bottom > div {
  margin-left: 15px;
}

#footer-bottom > div > a {
  display: flex;
  margin-bottom: 6px;
}

#footer-bottom > div > a > p {
  text-align: center;
}

header {
}

#call-your-state {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  color: #fff;
  background-image: linear-gradient(90deg,#ff6768,#5132c0);
  transition: background-color 1s cubic-bezier(.6,-.28,.735,.045), opacity 0.25s;
  width: 50%;
  padding: 25px 0px;
  border-radius: 18px;
  margin: 15px 0;
  height: 46px;
}
#call-your-state:hover {
  background-image: linear-gradient(107deg,#ff4a4b,#ff6768 25%,#5132c0 75%,#2903af);
}
@media only screen and (max-width: 768px) {
  #call-your-state {
    width: 96%;
    background-image: linear-gradient(107deg,#ff4a4b,#ff6768 25%,#5132c0 75%,#2903af);
  }
}

#call-your-state > h3 {
  font-size: min(6vw, 32px);
  margin-right: 5px;
}
#call-your-state > select {
  -webkit-appearance:none;
  -moz-appearance:none;
  appearance:none;
  outline: none;
  cursor: pointer;
  color: #fff;
  border: 1px solid hsla(0, 0%, 100%, 0.342);
  background-color: hsla(0,0%,100%,.25);
  width: 70%;
  border-radius: 6px;
  font-size: min(6vw, 32px);
  padding: 10px 0;
  padding-right: 15px;
}
#call-your-state > select > option {
  color: black;
}

#claimyr-call-anchor {
  background-color: transparent;
  border: none;
  outline: none;
  cursor: pointer;
  margin-left: 3%;
  transition: opacity 0.5s;
  opacity: 1;
}
#claimyr-call-anchor.disabled {
  pointer-events: none;
  opacity: 0.6;
}

#phone-icon-40f040 {
  width: 36px;
}

.spinner {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}
.spinner > img {
  width: 25px;
  height: 25px;
}

#dropdown-karat {
  position: absolute;
  right: 18%;
  transition: transform 0.35s, opacity 0.35s;
  opacity: 1;
}
#dropdown-karat.hidden {
  opacity: 0;
}
#round-right-karat-fff {
  width: 15px;
  transform: rotate(90deg);
}

.community-home {
  overflow-x: hidden;
  overflow-y: hidden;
  margin: 0 auto;
}
.community-home #community-header {
  all: initial;
  align-items: center;
  background-color: var(--claimyr-blue);
  /*
  border-bottom-left-radius: 0.5rem;
  border-bottom-right-radius: 0.5rem;
  */
  box-shadow: var(--shadow-md);
  box-sizing: border-box;
  display: flex;
  margin-bottom: 15px;
  padding: 1rem;
  width: 100%;
}
@media only screen and (max-width: 768px) {
  .community-home #community-header {
    width: 100%;
    margin-bottom: 0;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
  }
}
.community-home #community-header img {
  height: 3rem;
}
.community-home #community-header h1 {
  color: var(--white);
  font-size: 1.25rem;
}
.community-home #community-header .membership-controls {
  flex: 1 1 0%;
  margin-left: 1rem;
  padding: 0;
}
.community-home #community-header .membership-controls .membership-button {
  background-color: transparent;
}
.community-home #community-header .membership-controls .membership-button.leave {
  border-color: var(--gray-300);
  color: var(--gray-300);
}

.community-home #post-editor-and-place-call-now {
  width: 600px;
}
@media only screen and (max-width: 768px) {
  .community-home #post-editor-and-place-call-now {
    width: 100%;
  }
}

#community-header {
}
#community-header > .content {
  display: flex;
  width: 600px;
}
@media only screen and (max-width: 768px) {
  #community-header > .content {
    width: 95%;
  }
}
#community-header .membership-controls {
  box-sizing: border-box;
  text-align: right;
  width: 600px;
}
@media only screen and (max-width: 768px) {
  #community-header .membership-controls {
    padding: 0 1rem;
    width: 100%;
  }
}
#community-banner {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-right: 15px;
}
#community-banner > img {
  height: 65px;
}
#community-banner.small > img {
  height: 42px;
}
#community-name {
  display: flex;
  align-items: center;
  color: #263859;
  font-size: min(5vw, 20px);
}

.shadow {
  position: absolute;
  width: 200%;
  height: 420px;
  box-shadow: inset 0px 7px 57px 0 #000;
  bottom: 0;
  left: -50%;
}

main {
  background-color: #F3F4F6;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: start;
  overflow-x: hidden;
}

#home{
  padding-top: 1rem;
}
#sign-up {
  opacity: 0;
  transition: opacity 0.42s;
}
#sign-up.posts-loaded {
  opacity: 1;
}

#home-sign-up-slider {
  display: flex;
  color: #333;
  transition: transform 0.10s, height 0.26s;
  transform: translate(50vw);
  width: 200vw;
}
#home-sign-up-slider.sign-up-none {
}
#home-sign-up-slider.sign-up-state-select {
  transform: translate(-50vw);
  height: 110px;
}
#home-sign-up-slider > div.panel {
  display: flex;
  justify-content: center;
  align-items: start;
  width: 600px;
  margin: 0 auto;
}
@media only screen and (max-width: 768px) {
  #home-sign-up-slider > div.panel {
    width: 100vw;
    margin: 0;
  }
}
#post-slider {
  display: flex;
  color: #333;
  opacity: 0;
  /* transition: transform 0.10s, opacity 0.42s, height 0.26s; */
  transition: transform 0.10s, opacity 0.42s;
  transform: translate(250vw);
  width: 600vw;
}
#post-slider.retracted {
  height: 0px !important;
}
#post-slider.expanded {
  height: fit-content !important;
  margin-bottom: -.75rem;
}
#post-slider.posts-loaded {
  opacity: 1;
}
#post-slider.sign-up-join-community {
  height: 128px;
}
#post-slider.sign-up-join-community.expanded {
  height: 462px;
}
#post-slider.sign-up-join-community.post-page {
  height: 153px;
}
#post-slider.sign-up-full-name {
  transform: translate(150vw);
  height: 222px;
}
#post-slider.sign-up-register {
  transform: translate(50vw);
}
#post-slider.sign-up-sms-auth {
  transform: translate(-50vw);
  height: 222px;
}
#post-slider.sign-up-upload-profile-image {
  transform: translate(-150vw);
  height: fit-content;
}
#post-slider.sign-up-complete {
  height: 131px;
  transform: translate(-250vw);
}
#post-slider.sign-up-complete.expanded {
  height: 380px;
}
#post-slider.sign-up-join-community.is-not-public {
  height: 240px;
}
#post-slider.sign-up-join-community.is-not-public.expanded {
  height: 340px;
}
#post-slider > div.panel {
  display: flex;
  justify-content: center;
  align-items: start;
  width: 600px;
  margin: 0 auto;
}
@media only screen and (max-width: 768px) {
  #post-slider > div.panel {
    width: 100vw;
    margin: 0;
  }
}

#referrer-sign-up {
  display: flex;
  flex-direction: column;
  width: 600px;
  margin-top: 25vh;
}
@media only screen and (max-width: 768px) {
  #referrer-sign-up {
    width: 96%;
  }
}

button.continue {
  padding: 15px 0;
  font-size: min(8vw, 32px);
  cursor: pointer;
  border: 1px solid #ccc;
  background-color: #f02849;
  color: #fff;
  border-radius: 8px;
  transition: background-color 0.5s;
  outline: none;
}
button.continue:hover {
  background-color: #d60f30;
}

.post-comment-editor-with-sign-up {
}
.post-comment-editor-with-sign-up > .onboarding {
  margin: 0 auto;
  padding: 10px 0px;
}

/*
.post-comment-editor-with-sign-up > .slider {
  display: flex;
  width: 600%;
  transition: transform 0.10s;
}
.post-comment-editor-with-sign-up > .slider > .panel {
  display: flex;
  justify-content: center;
  width: 100%;
}
.post-comment-editor-with-sign-up > .sign-up-join-community {
}
.post-comment-editor-with-sign-up > .sign-up-full-name {
  transform: translate(-16.67%);
  height: 222px;
}
.post-comment-editor-with-sign-up > .sign-up-register {
  transform: translate(-33.33%);
  height: 222px;
}
.post-comment-editor-with-sign-up > .sign-up-sms-auth {
  transform: translate(-50%);
  height: 222px;
}
.post-comment-editor-with-sign-up > .sign-up-upload-profile-image {
  transform: translate(-66.67%);
  height: fit-content;
}
.post-comment-editor-with-sign-up > .sign-up-complete {
  transform: translate(-83.33%);
}
*/

#sign-up-join-community {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
#sign-up-join-community > button {
  color: #fff;
  background-color: #f02849;
  border: none;
  outline: none;
  cursor: pointer;
  font-size: min(8vw, 32px);
  border-radius: 8px;
  padding: 15px 0;
  width: 600px;
  transition: background-color 0.25s;
  height: 100px;
}
@media only screen and (max-width: 768px) {
  #sign-up-join-community > button {
    width: 88%;
  }
}
#sign-up-join-community > button:hover {
  background-color: #d60f30;
}
#sign-up-join-community > button.disabled {
  background-color: #999;
}

.sms-disclaimer {
  margin-top: 5px;
  margin-bottom: 10px;
  font-size: 11px;
}

#onboarding-post-editor > .onboarding {
  margin: 0 auto;
  padding: 10px 0px;
}

#sign-up-full-name,
#sign-up-phone-number,
#sign-up-sms-auth-code,
#sign-up-profile-image
{
  display: flex;
  flex-direction: column;
  visibility: visible;
  width: 100%;
}
@media only screen and (max-width: 768px) {
  #sign-up-full-name,
  #sign-up-phone-number,
  #sign-up-sms-auth-code,
  #sign-up-profile-image {
    width: 96%;
  }
}

.post-comment-editor-with-signup #sign-up-full-name,
.post-comment-editor-with-signup #sign-up-phone-number,
.post-comment-editor-with-signup #sign-up-sms-auth-code,
.post-comment-editor-with-signup #sign-up-profile-image
{
  display: flex;
  flex-direction: column;
  visibility: visible;
  width: 100%;
}
@media only screen and (max-width: 768px) {
  #sign-up-full-name,
  #sign-up-phone-number,
  #sign-up-sms-auth-code,
  #sign-up-profile-image {
  }
}

#sign-up-full-name > input,
#sign-up-phone-number > input,
#referrer-sign-up > input,
#referrer-auth-code > input,
#referrer-paypal-register > input,
#sign-up-sms-auth-code > input
{
  outline: none;
  border: none;
  border: 1px solid #ccc;
  border-radius: 15px;
  padding: 15px 3%;
  margin: 10px 0;
  font-size: min(8vw, 32px);
}
#sign-up-full-name.hidden,
#sign-up-phone-number.hidden,
#referrer-sign-up.hidden,
#sign-up-sms-auth-code.hidden,
#sign-up-profile-image.hidden
{
  visibility: hidden;
  transition: visibility 0.25s;
  height: 0px
}

#sign-up-profile-image {
  transition: height 0.26s;
  display: flex;
  flex-direction: column;
  align-items: center;
  visibility: visible;
  height: fit-content;
  margin-bottom: 25px;
}
/*
#sign-up-profile-image.visible {
  height: fit-content;
  visibility: hidden;
}
#sign-up-profile-image.hidden {
  height: 0px;
  visibility: hidden;
}
*/

#sign-up-profile-image-mask {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  border: 1px solid #ccc;
  z-index: 1;
  margin-top: 8px;
  border-radius: 500px;
  width: 100px;
  height: 100px;
  outline: none;
  cursor: pointer;
}
#sign-up-profile-image > input {
  margin-top: 5px;
  outline: none;
  cursor: pointer;
}
#sign-up-profile-image img {
  position: relative;
}
#sign-up-profile-image img.foreground {
  z-index: 0;
  width: auto;
  height: 100px;
}
#sign-up-profile-image img.background {
  position: absolute;
  filter: blur(8px);
  z-index: -1;
  width: auto;
  height: 150px;
}
#sign-up-profile-image button.continue {
  margin-top: 15px;
  width: 100%;
  border-radius: 15px;
  height: 60px;
}
.post-tips {
  z-index: -1;
  border: 1px solid #D1DDF3;
  border-radius: 0.5rem;
  box-sizing: border-box;
  color: #333;
  display: block;
  font-size: 0.8rem;
  font-weight: 500;
  list-style-type: none;
  margin-bottom: -200px;
  opacity: 0;
  padding: 1rem;
  position: relative;
  top: -300px;
  transition: top 0.25s, margin-bottom 0.25s, opacity 0.125s;
  width: calc(600px - 2rem);
  z-index: 100;
}
.post-tips.expanded {
  top: 0;
  transition: top 0.25s, margin-bottom 0.25s, opacity 0.125s 0.125s;
  margin-bottom: 0;
  opacity: 1;
}
.post-tips.expanded .small {
  display: none;
}
@media only screen and (max-width: 768px) {
  .post-tips {
    width: calc(100vw - 2rem);
  }
  .post-tips.expanded .small {
    display: block;
  }
  .post-tips.expanded .large {
    display: none;
  }
}
.post-tips span {
  color: rgb(0, 209, 0);
  font-weight: 700;
}
.post-tips li + li {
  margin-top: 0.25rem;
}
.post-tips span.do-not {
  color: red;
  font-weight: 700;
}
#post-editor .row-1 {
  height: 120px;
}
#post-editor .row-1.expanded {
  height: 358px;
}
#post-editor, #faux-post-editor {
  position: relative;
  width: 100%;
}
#post-editor > .row-1, #faux-post-editor > .row-1 {
  background-color: #fff;
  box-sizing: border-box;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 0.5rem;
  padding: 1rem;
}
@media only screen and (max-width: 768px) {
  #post-editor > .row-1, #faux-post-editor > .row-1 {
    border-radius: 0;
  }
}
#post-editor > .row-1, #faux-post-editor > .row-1,
#post-editor > .row-2, #faux-post-editor > .row-2 {
  width: 100%;
  display: grid;
  grid-template-columns: 58px 1fr;
  align-items: start;
  justify-content: center;
  position: relative;
}
#post-editor > .row-2, #faux-post-editor > .row-2 {
  transition: opacity 0.25s;
  opacity: 1;
}
#post-editor > .row-2.expanded, #faux-post-editor > .row-2.expanded {
  opacity: 1;
}

#post-editor-content-wrapper, #faux-post-editor-content-wrapper {
  position: relative;
  background-color: #fff;
  z-index: 150;
}

#post-editor-action-bar, #faux-post-editor-action-bar {
  display: flex;
  /*
  grid-template-columns: 43px 80% 80px;
  max-width: 67vw;
  */
}

#post-editor-action-bar > .spacer, #faux-post-editor-action-bar > .spacer {
  width: 100%;
}

#create-post, #faux-create-post {
  color: #fff;
  background-color: #263859;
  border: none;
  outline: none;
  cursor: pointer;
  white-space: nowrap;
  font-size: min(6vw, 15px);
  transition: background-color 0.42s;
  padding: 0px 15px;
  border-radius: 15px;
  height: 30px;
  font-size: min(8vw, 16px);
  width: 100px;
}
#create-post:hover, #faux-create-post:hover {
  background-color: #172235;
}
#create-post[disabled], #faux-create-post[disabled],
#create-post[disabled]:hover, #faux-create-post[disabled]:hover {
  cursor: default;
  background-color: #c4c4c4;
}

#post-editor-hint, #faux-post-editor-hint {
  box-sizing: border-box;
  position: absolute;
  color: #999;
  line-height: 1em;
  z-index: 0;
  top: 0;
  padding: 0 3.1%;
  opacity: 1;
  padding-top: 11px;
  margin-top: 6px;
  overflow: hidden;
  height: 40px;
  transition: height 0.25s;
  border-radius: 25px;
}
#post-editor-hint.visible, #faux-post-editor-hint.visible {
  opacity: 1;
}
#post-editor-hint.hidden, #faux-post-editor-hint.hidden {
  opacity: 0;
}
#post-editor-hint.expanded, #faux-post-editor-hint.expanded {
  height: 135px;
}

#post-editor-content, #faux-post-editor-content {
  border: 1px solid #e4e4e4;
  position: relative;
  z-index: 1;
  outline: none;
  overflow: scroll;
  transition: min-height 0.25s;
  padding: 11px 3%;
  border-radius: 25px;
  min-height: 16px;
  height: 16px;
  width: 94%;
  margin-bottom: 10px;
  margin-top: 6px;
	z-index: 200;
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}
#post-editor-content::-webkit-scrollbar, #faux-post-editor-content::-webkit-scrollbar {
  display: none; 
}

@media only screen and (max-width: 768px) {
  #post-editor-content, #faux-post-editor-content {
    max-width: 100vw;
  }
}
#post-editor-content.expanded, #faux-post-editor-content.expanded {
  min-height: 111px;
}

#post-editor-album, #faux-post-editor-album {
  display: flex;
  flex-wrap: wrap;
  width: 125%;
}
#post-editor-album .uploaded-image, #faux-post-editor-album .uploaded-image {
  position: relative;
  margin-right: 15px;
}
#post-editor-album .image-mask, #faux-post-editor-album .image-mask {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  border: 1px solid #ccc;
  border-radius: 8px !important;
  width: 150px !important;
  height: 150px !important;
  margin-bottom: 25px;
}
#post-editor-album .image-mask > img.foreground, #faux-post-editor-album .image-mask > img.foreground {
  height: auto !important;
  width: 100% !important;
}
#post-editor-album .image-mask > img.background, #faux-post-editor-album .image-mask > img.background {
  height: auto !important;
  width: 150% !important;
  position: absolute;
  z-index: -1;
  filter: blur(8px);
}

button.x {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #c4c4c4;
  outline: none;
  cursor: pointer;
  border: 3px solid #f3f4f6;
  right: -9px;
  top: -7px;
  padding: 9px;
  border-radius: 50%;
  width: 32px;
  height: 32px;
  z-index: 1;
}
button.x > img {
  width: 12px;
  height: 12px;
}

#profile-image {
  grid-column-start: 1;
  grid-column-end: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  border: 1px solid #ccc;
  z-index: 1;
  border-radius: 500px;
  width: 50px;
  height: 50px;
}
#profile-image > img
{
  position: relative;
  width: auto;
}
#profile-image > img.foreground {
  height: 50px;
  z-index: 0;
}
#profile-image > img.background {
  position: absolute;
  filter: blur(8px);
  height: 75px;
  z-index: -1;
}
#profile .edit-image {
  height: 100%;
  position: absolute;
  width: 100%;
}
#profile .edit-image.hidden {
  display: none;
}
#profile #profile-image-edit {
  display: none;
}
#profile label {
  align-items: center;
  background-color: rgba(0, 0, 0, 0.5);
  color: #fff;
  cursor: pointer;
  display: flex;
  height: 100%;
  justify-content: center;
  width: 100%;
}
#profile a.edit-headline {
  color: #999;
  font-size: 0.8rem;
  margin-left: 0.25rem;
}
#profile p.edit-headline {
  cursor: pointer;
}
#profile span.edit-headline {
  color: #999;
}
#profile span.edit-headline:hover {
  text-decoration: underline;
}
#profile .edit-headline .edit-icon {
  height: 0.75rem;
  opacity: 0.5;
}
#profile .edit-image .edit-icon {
  height: 3rem;
  filter: invert();
  opacity: 0.5;
}

#upload-image, #faux-upload-image {
  background: none;
  outline: none;
  border: none;
  cursor: pointer;
  padding: 0;
  padding-left: 8px;
  margin: 0;
  transition: opacity 0.42s;
  opacity: 1;
  z-index: 2;
}
#upload-image.reply, #faux-upload-image.reply {
  margin-right: 8px;
}
#upload-image.expanded, #faux-upload-image.expanded {
  opacity: 1;
}
#upload-image[disabled], #faux-upload-image[disabled] {
  filter: greyscale(0);
  opacity: 0.2;
  cursor: not-allowed;
}
#upload-image > img, #faux-upload-image > img {
  width: 36px;
}
#upload-image > input, #faux-upload-image > input {
  display: none;
}

#call-now-button {
  width: 600px;
  margin: 5px auto;
}
@media only screen and (max-width: 768px) {
  #call-now-button {
    width: 98%;
  }
}

#call-now-button a {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 32px;
  text-decoration: none;
  background-color: #3DA83B;
  background-color: rgb(0, 209, 0);
  color: #fff;
  border-radius: 8px;
  padding: 25px 0px;
  transition: background-color 0.1s;
}
#call-now-button a svg {
  padding-left: 5px;
  width: 42px;
  background-color: transparent;
  color: #fff;
  position: relative;
  top: -3px;
}
#call-now-button a:hover {
  background-color: rgb(0, 238, 0);
}

.image-mask {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  border: 1px solid #ccc;
  z-index: 1;
  border-radius: 500px;
  min-width: 50px;
  min-height: 50px;
  width: 50px;
  height: 50px;
}
.comment-comment-editor > .image-mask {
  width: 33px;
  height: 33px;
}

.image-mask > img.foreground {
  z-index: 0;
  height: 50px;
  width: auto;
}
.image-mask > img.background {
  width: 150%;
  position: absolute;
  z-index: -1;
  filter: blur(8px);
}

.post-with-comment-editor {
  width: 100%;
}

#profile-image {
  grid-column-start: 1;
  grid-column-end: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  border: 1px solid #ccc;
  z-index: 1;
  border-radius: 500px;
  width: 50px;
  height: 50px;
}
#profile-image > img
{
  position: relative;
  width: auto;
}
#profile-image > img.foreground {
  height: 50px;
  z-index: 0;
}
#profile-image > img.background {
  position: absolute;
  filter: blur(8px);
  height: 75px;
  z-index: -1;
}

#state-select {
  position: relative;
  display: flex;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.42s;
  width: 100%;
}
#state-select.posts-loaded {
  opacity: 1;
}
#state-select select {
  font-size: 27px;
  font-weight: 600;
  height: 100px;
  width: 604px;
  padding-left: min(5vw, 25px);
  border: 1px solid #f02849;
  border-radius: 6px;
  background-color: #f02849;
  color: #fff;
  outline: none;
  cursor: pointer;
  -webkit-appearance: none;
}
@media only screen and (max-width: 768px) {
  #state-select select {
    width: 100%;
  }
}
#state-select select > option {
  background-color: #fff;
  color: black;
}
#state-select img.drop-down-karat {
  position: absolute;
  width: 12px;
}

main.community-home #community-posts {
  min-height: 100vh;
}

#home-community-posts,
#community-posts {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 600px;
}
@media only screen and (max-width: 768px) {
  #home-community-posts, #community-posts {
    width: 100%;
  }
}
#home-community-posts.posts-loaded,
#community-posts.posts-loaded {
}

.chats-slider .panel #community-posts {
  width: 100%;
}

.community-post {
  padding-top: 15px;
  position: relative;
  border-radius: 3px;
  width: 100%;
}
.community-post > .header {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
  padding-left: 15px;
}
.community-post .moderator-buttons {
  position: absolute;
  right: 2px;
  text-align: right;
  top: 2px;
  z-index: 100;
}
.community-post .moderator-buttons button {
  align-items: center;
  background-color: #efefef;
  border: 0;
  border-radius: 0.5rem;
  color: #fff;
  display: inline-flex;
  font-size: 1.5rem;
  font-weight: 600;
  height: 3rem;
  justify-content: center;
  outline: none;
  width: 3rem;
}
.community-post .moderator-buttons ul {
  border-radius: 0.5rem;
  list-style-type: none;
  margin: 0;
  margin-top: 4px;
  padding: 0;
}
.community-post .moderator-buttons li {
  background-color: #efefef;
  border-radius: 0.5rem;
  display: block;
  padding: 1rem 2rem;
  text-align: center;
}
.community-post .moderator-buttons li + li {
  margin-top: 4px
}
.community-post > .header .moderator-controls {
  color: #999;
  display: inline-block;
}
.community-post > .header .moderator-controls .button {
  background-color: #999;
  border-radius: 999px;
  color: #fff;
  font-size: 0.8rem;
  padding: 0 .5rem;
}
.community-post > .header .moderator-controls .button:hover {
  background-color: #666;
}
.community-post > .header > a > .image-mask {
  margin-right: 10px;
}
.community-post > .content > h1.explicit {
  font-weight: 500;
  font-size: 28px;
  margin-bottom: 5px;
}
.community-post > .content {
  padding-left: 15px;
  padding-right: 15px;
  padding-bottom: 10px;
  border-bottom: 1px solid #e4e4e4;
  white-space: pre-wrap;
  word-break: break-word;
}
.community-post > .content > h1 {
  font-size: 16px;
  font-weight: 500;
}
.community-post > .content a {
  text-decoration: none;
  color: #000;
}
.community-post > .content h3 {
  font-size: 16px;
  font-weight: 500;
}
a.moderator-remove {
  color: #000;
  text-decoration: none;
}
a.moderator-remove:hover {
  text-decoration: none;
}
a.moderator-remove img {
  height: 0.8rem;
}
a.moderator-remove img:hover {
  filter: brightness(0.8);
}

.community-post > .media {
}
.community-post > .media.single-panel {
  min-height: 25vh;
}
.community-post > .media.multi-panel {
  min-height: 25vh;
}
.community-post > .media > img {
  width: 100%;
}

.community-post > .comments {
  margin-top: 8px;
}
.community-post > .comments > .comment {
  padding-left: 15px;
}
.community-post > .comments > .comment > .header {
  display: flex;
  align-items: start;
}
.community-post > .comments > .comment > .header > a > .image-mask {
  margin-right: 10px;
  margin-top: 8px;
}
.community-post > .comments > .comment .content-wrapper {
  max-width: 81%;
}
.community-post > .comments > .comment .info-text {
  align-items: center;
  display: flex;
  margin-left: 10px;
  margin-top: 5px;
}
.community-post > .comments > .comment .info-text > * + * {
  margin-left: 0.5rem;
}
.community-post > .comments > .comment .content {
  background-color: #f7f7f7;
  display: inline-block;
  padding: 2px 15px;
  border-radius: 25px;
  max-width: 100%;
}
.community-post > .comments > .comment .content > h3 {
  white-space: nowrap;
}
.community-post > .comments > .comment .content > p {
  white-space: pre-wrap;
  word-break: break-word;
}

.community-post > .comments .comments > .comment > .header > .content {
  display: inline-block;
  background-color: #f7f7f7;
  padding: 8px 12px;
  border-radius: 25px;
}
.community-post > .comments .comments > .comment > .header > .content > p {
  white-space: pre-wrap;
}
.community-post > .comments .comments > .comment > .header {
  display: flex;
  align-items: start;
}
.community-post > .comments .comments {
  padding-left: 65px;
}
.community-post > .comments .comments > .comment > .header > a > .image-mask {
  width: 33px !important;
  height: 33px !important;
  margin-right: 10px;
  margin-top: 8px;
}
.community-post > .comments .comments > .comment > .header > .image-mask > img.foreground {
  z-index: 1;
  width: 100%;
}
.community-post > .comments .comments > .comment > .header > .image-mask > img.background {
  position: absolute;
  filter: blur(8px);
  z-index: 0;
  width: auto;
  height: 150%;
}
.community-post > .comments > .comment > .media {
  width: 60%;
  margin-left: 9%;
  margin-bottom: 10px;
}
.community-post > .comments .comments > .comment > .media {
  width: 60%;
  margin-left: 12%;
  margin-bottom: 10px;
}
.community-post a.profile-link {
  color: #000;
  text-decoration: none;
}
.community-post a.community-link {
  color: #999;
  text-decoration: none;
}
.community-post .post-info-links {
  display: flex;
}
.community-post .post-info-links * + * {
  margin-left: 0.25rem;
}
.community-post a.profile-link:hover {
  text-decoration: underline;
}
.community-post .header > .profile-link > .image-mask > .foreground:hover {
  zoom: 110%;
}
.community-post a.profile-link.secondary > h3 {
  font-weight: bold;
}
.community-post .guide {
  box-sizing: border-box;
  padding-bottom: 0;
  position: relative;
  border-top: 1px solid #e4e4e4;
  border-bottom: 1px solid #e4e4e4;
  max-height: 300px;
  overflow: hidden;
  width: 100%;
}
.community-post .guide.selected {
  max-height: none;
}
.community-post .prose {
  box-sizing: border-box;
  background-color: #fff;
  border-top-left-radius: .5rem;
  border-top-right-radius: .5rem;
  box-sizing: border-box;
  padding: 1rem;
  min-height: 300px;
  width: 100%;
}
.community-post .read-more {
  align-items: center;
  background-image: linear-gradient(
    to bottom,
    hsla(0, 0%, 100%, 0) 0%,
    hsla(0, 0%, 100%, 0.013) 8.1%,
    hsla(0, 0%, 100%, 0.049) 15.5%,
    hsla(0, 0%, 100%, 0.104) 22.5%,
    hsla(0, 0%, 100%, 0.175) 29%,
    hsla(0, 0%, 100%, 0.259) 35.3%,
    hsla(0, 0%, 100%, 0.352) 41.2%,
    hsla(0, 0%, 100%, 0.45) 47.1%,
    hsla(0, 0%, 100%, 0.55) 52.9%,
    hsla(0, 0%, 100%, 0.648) 58.8%,
    hsla(0, 0%, 100%, 0.741) 64.7%,
    hsla(0, 0%, 100%, 0.825) 71%,
    hsla(0, 0%, 100%, 0.896) 77.5%,
    hsla(0, 0%, 100%, 0.951) 84.5%,
    hsla(0, 0%, 100%, 0.987) 91.9%,
    hsl(0, 0%, 100%) 100%
  );
  bottom: 0;
  display: flex;
  justify-content: center;
  padding: 4rem 0 1rem 0;
  position: absolute;
  width: 100%;
}
.community-post .selected .read-more {
  padding-top: 0;
  position: inherit;
}
.community-post .read-more a {
  border: 1px solid rgba(0,0,0,.5);
  border-radius: 999px;
  color: rgba(0,0,0,.5);
  padding: .5rem 1rem;
  text-decoration: none;
  font-weight: 600;
}
.community-post .prose h1 {
  margin-top: 0;
}

.info-text h3 {
  margin-bottom: 3px;
}
.info-text a {
  text-decoration: none;
}
.info-text a:hover {
  text-decoration: none;
  text-decoration-color: #999;
}
.info-text .relative-time {
  display: inline-block;
  color: #999;
}
.info-text .posted-to-arrow {
}
.info-text .posted-to-arrow > img {
  width: 12px;
}

.photo-album {
  display: grid;
  width: 100%;
  height: auto;
  opacity: 0;
  transition: opacity 0.42s;
}
.photo-album.ready {
  opacity: 1;
}

.photo-album .panel {
  position: relative;
}
.photo-album img.foreground {
  z-index: 1;
  cursor: zoom-in;
}
.photo-album img.background {
  position: absolute;
  filter: blur(8px);
  z-index: 0;
  width: auto;
  height: 150%;
  cursor: default;
}
.photo-album > .panel.width-primary > img.foreground {
  height: auto;
  width: 100%;
}
.photo-album > .panel.height-primary > img.foreground {
  height: auto;
  width: 100%;
  /*
  height: 100%;
  width: auto;
  */
}

.photo-album.frame-0 {
  height: 0px;
}
.photo-album.frame-1 {
  grid-template-columns: 100%;
  grid-template-rows: 100%;
  height: fit-content;
}
.photo-album.frame-1 > .panel {
  max-height: 50vh;
}

.photo-album.frame-2.width-primary {
  grid-template-columns: 100%;
  grid-template-rows: 50% 50%;
}
.photo-album.frame-2.height-primary {
  grid-template-columns: 50% 50%;
}
.photo-album.frame-2 > .panel {
  max-height: 25vh;
}

.photo-album.frame-3 {
  grid-template-columns: 50% 50%;
  grid-template-rows: 50% 50%;
}
.photo-album.frame-3 > .panel.index-0 {
  grid-column-start: 1;
  grid-column-end: 3;
}
.photo-album.frame-3 > .panel.index-1 {
  grid-column-start: 1;
  grid-column-end: 2;
}
.photo-album.frame-3 > .panel.index-2 {
  grid-column-start: 2;
  grid-column-end: 3;
}
.photo-album.frame-3 > .panel {
  max-height: 25vh;
}

.photo-album.frame-4 > {
  grid-template-columns: 50% 50%;
  grid-template-rows: 50% 50%;
}
.photo-album.frame-4 > .panel.index-0,
.photo-album.frame-4 > .panel.index-2
{
  grid-column-start: 1;
  grid-column-end: 2
}
.photo-album.frame-4 > .panel.index-1,
.photo-album.frame-4 > .panel.index-3
{
  grid-column-start: 2;
  grid-column-end: 3;
}
.photo-album.frame-4 > .panel {
  max-height: 25vh;
}

.photo-album.frame-5 > .panel.index-0 {
  grid-column-start: 1;
  grid-column-end: 4;
}
.photo-album.frame-5 > .panel.index-1 {
  grid-column-start: 4;
  grid-column-end: 7;
}
.photo-album.frame-5 > .panel.index-2 {
  grid-column-start: 1;
  grid-column-end: 3;
}
.photo-album.frame-5 > .panel.index-3 {
  grid-column-start: 3;
  grid-column-end: 5;
}
.photo-album.frame-5 > .panel.index-4 {
  grid-column-start: 5;
  grid-column-end: 7;
}
.photo-album.frame-5 > .panel {
  max-height: 25vh;
}

.photo-album > .panel {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.post-with-comment-editor {
  margin-bottom: 15px;
  background-color: #fff;
  border-radius: 0.5rem;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
}
.post-with-comment-editor:last-child {
  margin-bottom: 0px;
}

.post-comment-editor-content-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  margin-left: 7px;
}

.post-comment-editor {
  height: fit-content;
  width: 98%;
  padding-left: 2%;
  padding-top: 10px;
  margin-bottom: 10px;
  transition: opacity 0.42s, height 0.42s;
  opacity: 1;
}
.post-comment-editor[hidden] {
  opacity: 0;
  height: 0;
  padding: 0;
  margin: 0;
  border: none;
}
.post-comment-editor .image-mask > img.foreground {
  width: 100%;
}
.post-comment-editor .image-mask > img.background {
  width: 150%;
  position: absolute;
  z-index: -1;
  filter: blur(8px);
}

.post-comment-editor > .input-bar,
.comment-comment-editor > .input-bar {
  display: flex;
  align-items: center;
  height: fit-content;
}

.post-comment-editor-hint {
  position: absolute;
  color: #999;
  line-height: 1em;
  z-index: 0;
  top: 15px;
  left: 3.9%;
  opacity: 1;
}
.post-comment-editor-hint.hidden {
  opacity: 0;
}

.post-comment-editor-content {
  position: relative;
  z-index: 1;
  outline: none;
  overflow: scroll;
  white-space: pre-wrap;
  border: 1px solid #e4e4e4;
  transition: min-height 0.25s;
  padding: 11px 3.6%;
  padding-top: 15px;
  padding-right: 10%;
  border-radius: 25px;
  min-height: 17px;
  width: 90%;
  margin-bottom: 5px;
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}
.post-comment-editor-content::-webkit-scrollbar {
  display: none;
}

@media only screen and (max-width: 768px) {
  .post-comment-editor-content {
    max-width: 100vw;
  }
}

.post-comment-editor-send-button {
  background: none;
  border: none;
  outline: none;
  cursor: pointer;
  position: absolute;
  background-color: #263859;
  padding: 0;
  right: 57px;
  bottom: 12px;
  z-index: 1;
  width: 33px;
  height: 33px;
  border-radius: 25px;
  transition: background-color 0.42s;
}
.post-comment-editor-send-button[disabled] {
  cursor: default;
  background-color: #c4c4c4;
}
.post-comment-editor-send-button.faded {
  background-color: #fff;
}
.post-comment-editor-send-button > img {
  width: 33px;
  height: 33px;
  transition: filter 0.42s;
  filter: greyscale(0);
}
.post-comment-editor-send-button.faded {
  cursor: default;
}
.post-comment-editor-send-button.faded > img {
  cursor: default;
}

.comment-comment-editor-content-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  width: 90%;
  margin-left: 2%;
  margin-top: 10px;
}

.comment-comment-editor {
  margin-bottom: 10px;
  transition: opacity 0.42s, height 0.42s;
  opacity: 1;
}
.comment-comment-editor[hidden] {
  opacity: 0;
  height: 0;
  padding: 0;
  margin: 0;
  border: none;
}
.comment-comment-editor > .input-bar {
  display: flex;
  align-items: center;
  height: fit-content;
}
.comment-comment-editor .image-mask > img.foreground {
  width: 100%;
}
.comment-comment-editor .image-mask > img.background {
  width: 150%;
  position: absolute;
  z-index: -1;
  filter: blur(8px);
}

.comment-comment-editor > #post-editor-album,
.post-comment-editor > #post-editor-album {
  padding-left: 55px;
  width: 92%;
  margin-top: 8px;
}

.comment-comment-editor-hint {
  position: absolute;
  color: #999;
  line-height: 1em;
  z-index: 0;
  top: 12px;
  left: 4.2%;
  opacity: 1;
}
.comment-comment-editor-hint.hidden {
  opacity: 0;
}

.comment-comment-editor-content {
  position: relative;
  z-index: 1;
  outline: none;
  overflow: scroll;
  white-space: pre-wrap;
  border: 1px solid #e4e4e4;
  transition: min-height 0.25s;
  padding: 11px 3.6%;
  padding-right: 6%;
  border-radius: 25px;
  min-height: 17px;
  width: 90%;
  margin-bottom: 5px;
  max-width: 42vw;
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}
.comment-comment-editor-content::-webkit-scrollbar {
  display: none;
}

@media only screen and (max-width: 768px) {
  .comment-comment-editor-content {
    max-width: 100vw;
  }
}

.comment-comment-editor-send-button {
  background: none;
  border: none;
  outline: none;
  cursor: pointer;
  position: absolute;
  background-color: #263859;
  padding: 0;
  right: 57px;
  bottom: 9px;
  z-index: 1;
  width: 33px;
  height: 33px;
  border-radius: 25px;
  transition: background-color 0.42s;
}
.comment-comment-editor-send-button[disabled] {
  cursor: default;
  background-color: #c4c4c4;
}
.comment-comment-editor-send-button.faded {
  background-color: #fff;
}
.comment-comment-editor-send-button > img {
  width: 33px;
  height: 33px;
  transition: filter 0.42s;
  filter: greyscale(0);
}
.comment-comment-editor-send-button.faded {
  cursor: default;
}
.comment-comment-editor-send-button.faded > img {
  cursor: default;
}

.community-post > .view-previous-comments {
  background: none;
  border: none;
  outline: none;
  cursor: pointer;
  font-size: min(8vw, 16px);
  margin-top: 8px;
  margin-left: 15px;
}
.community-post > .view-previous-comments[hidden] {
  display: none;
}
.community-post > .view-previous-comments > span {
  white-space: nowrap;
  margin-right: 5px;
}
.community-post > .view-previous-comments .spinner img {
  width: 16px;
  height: 16px;
}
.community-post .view-previous-comments[hidden] {
  display: none;
}
.community-post .view-previous-comments > span {
  white-space: nowrap;
  margin-right: 5px;
}
.community-post .view-previous-comments .spinner img {
  width: 16px;
  height: 16px;
}
.comment > .view-previous-comments {
  background: none;
  border: none;
  outline: none;
  cursor: pointer;
  font-size: min(8vw, 16px);
  margin-left: 65px;
  margin-bottom: 5px;
}

.engagement {
  align-items: center;
  display: flex;
  justify-content: space-between;
  text-align: right;
  padding: 5px 10px;
  border-bottom: 1px solid #e4e4e4;
}
.engagement a {
  color: #000;
  text-decoration: none;
}
.engagement a:hover {
  text-decoration: underline;
}

#call-app {
  width: 100%;
}

#payment-slider {
  display: flex;
  width: 400vw;
  transform: translate(250vw);
  align-items: start;
  transition: transform 0.1s, height 0.25s ease, opacity 0.25s;
  opacity: 0;
}
#payment-slider.hidden {
  display: none;
}
#payment-slider.posts-loaded {
  opacity: 1;
}

#payment-slider > .panel {
  position: relative;
  z-index: -1;
  width: 100vw;
  display: flex;
  justify-content: center;
  align-items: center;
}
#payment-slider > .panel > .retracted {
  height: 0;
}
#payment-slider.payment-rendering {
}
#payment-slider.payment-visible,
#payment-slider.payment-in-progress {
  transform: translate(50vw);
}
#payment-slider.payment-ssn {
  transform: translate(150vw);
}
#payment-slider.payment-success {
  transform: translate(-50vw);
}

#place-call-now {
  margin-bottom: 8px;
}

#place-call-now, #faux-place-call-now {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}

#place-call-now button[disabled], #faux-place-call-now button[disabled] {
  background-color: var(--gray-300);
}

#place-call-now > div, #faux-place-call-now > div {
  width: 100%;
}
#place-call-now .select-wrapper,
#faux-place-call-now .select-wrapper
{
  position: relative;
  opacity: 1;
  transition: opacity 0.25s;
  margin-top: 3px;
}
#place-call-now .select-wrapper.disabled::after,
#faux-place-call-now .select-wrapper.disabled::after
{
  color: #fff;
}
#place-call-now .select-wrapper.hidden,
#faux-place-call-now .select-wrapper.hidden
{
  opacity: 0;
}
#place-call-now select,
#faux-place-call-now select
{
  background-image: url("https://yrcdn.net/assets/arrow.webp");
  background-repeat: no-repeat;
  background-size: 0.75rem;
  background-position-x: calc(100% - 1rem);
  background-position-y: 50%;
  font-size: 27px;
  font-weight: 600;
  height: 42px;
  width: 100%;
  padding-left: min(5vw, 25px);
  border-radius: 8px;
  background-color: #fff;
  color: #263859;
  border: none;
  outline: none;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  transition: background-color 0.25s;
}
select.flash {
  animation: flash 400ms infinite;
}
@keyframes flash {
  0% { color: red }
  46% { color: red }
  50% { color: #263859 }
  99% { color: #263859 }
  100% { color: red }
}
#place-call-now select[disabled],
#faux-place-call-now select[disabled]
{
  color: #fff;
  background-color: #c4c4c4;
  cursor: default;
  opacity: 1;
}
#place-call-now span,
#faux-place-call-now span {
  font-size: 32px;
}
@media only screen and (max-width: 768px) {
  #place-call-now span {
    font-size: 24px;
    white-space: pre-wrap;
  }
}
#place-call-now button, #faux-place-call-now button {
  outline: none;
  cursor: pointer;
  background-color: rgb(0, 209, 0);
  box-shadow: 0 0 25px -8px #999;
  border: 1px solid hsla(0, 0%, 100%, 0.342);
  color: #fff;
  border-radius: 7px;
  padding-top: 25px;
  padding-bottom: 25px;
  width: 600px;
  font-size: min(7vw, 26px);
  transition: background-color 0.42s;
  white-space: nowrap;
}
#place-call-now button.coming-soon,
#faux-place-call-now button.coming-soon
{
  background-color: #c4c4c4;
}
#place-call-now button.coming-soon:hover,
#faux-place-call-now button.coming-soon:hover
{
  background-color: #c4c4c4;
}
#place-call-now button[disabled],
#faux-place-call-now button[disabled]
{
  pointer-events: none;
}

#faux-place-call-now > button {
  width: 100%;
  margin-bottom: 10px;
}
#place-call-now button.payment-none {
  opacity: 1;
}
#place-call-now button.payment-rendering,
#place-call-now button.payment-visible,
#place-call-now button.payment-success {
  opacity: 0;
}
#place-call-now button:hover, #faux-place-call-now button:hover {
  border: 1px solid white;
  background-color: rgb(0, 238, 0);
}
#place-call-now button img#phone-icon-fff, #faux-place-call-now button img#phone-icon-fff {
  width: 32px;
  margin-left: 2%;
  margin-bottom: -5px;
}

@media only screen and (max-width: 768px) {
  #place-call-now, #faux-place-call-now {
    width: 100%;
  }
  #place-call-now button, #faux-place-call-now button {
    width: 100%;
  }
  #place-call-now button img#phone-icon-fff {
    margin-bottom: 0;
    width: 20px;
  }
}
#place-call-now button[disabled] {
  background-color: #c4c4c4;
  cursor: default;
  pointer-events: none;
}

.referral-link-activated {
  font-size: 1rem;
  margin-top: 0.5rem;
}

#payment-form {
  display: flex;
  flex-direction: column;
  align-items: center;
  border: none;
  width: 560px;
  margin-bottom: 12px;
  padding: 17px 20px;
  border-radius: 8px;
  box-shadow: 0 0 20px -12px #8f2df0;
  transition: opacity 0.25s;
  background-color: #fff;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
}
@media only screen and (max-width: 768px) {
  #payment-form {
    width: 96%;
  }
}
#payment-form > h1 {
  color: #263859;
  text-align: center;
}
#payment-form > div#payment-billing-details {
  position: relative;
  right: -1.9%;
  width: 100%;
}

#payment-form.payment-none,
#payment-form.payment-rendering,
#payment-form.payment-visible {
  opacity: 1;
}
#payment-form.payment-success {
  opacity: 0;
}

#payment-form-submit-button {
  font-size: min(7vw, 14px);
  color: white;
  background-color: rgb(0, 209, 0);
  padding: 12px 2%;
  border-radius: 5px;
  border: none;
  box-shadow: 0 6px 20px -8px #3c5ccf;
  width: 96%;
  height: 50px;
  cursor: pointer;
}

#payment-form-submit-button > span > .payment-in-progress,
#payment-form-submit-button > span > .payment-success {
  color: #000;
  cursor: default;
  box-shadow: none;
  padding: 7px 10px;
}

#payment-form-submit-button > span > img {
  width: 25px;
  height: 25px;
}

#payment-form-submit-button > span > #payment-button-phone-icon {
  width: min(2vh, 14px);
  height: min(2vh, 14px);
  margin-bottom: -1px;
  margin-left: 7px;
}

#stripe-card {
  border: 1px solid lightgrey;
  width: 91.8%;
  border-radius: 5px;
  margin-bottom: 15px;
  padding: 10px 2%;
}

.payment-input-container {
  width: 100%;
  margin-bottom: 15px;
  margin-top: 15px;
}
.payment-input {
  padding: 10px 2%;
  border: 1px solid lightgrey;
  border-radius: 5px;
  outline: none;
  font-size: 16px;
  width: 92%;
}
.payment-input::placeholder {
  font-size: 16px;
  font-weight: 500;
}

#payment-success-container {
  display: flex;
  align-items: start;
  justify-content: center;
  width: 100vw;
  margin-top: 139px;
}

#payment-success {
  color: #263859;
  /* background-color: #f7f7f7; */
  background-color: #fff;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  /* border: 1px solid #ccc; */
  border-radius: 8px;
  width: 580px;
  padding: 24px 10px;
  margin: 10px auto 10px auto;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
}
#payment-success > button {
  align-self: flex-end;
  background: none;
  outline: none;
  border: none;
  cursor: pointer;
}
#payment-success > button > img {
  width: 18px;
}
#payment-success > img {
  width: 100px;
  height: 100px;
}
#payment-success > p {
  margin-top: 10px;
}
@media only screen and (max-width: 768px) {
  #payment-success {
    width: 100%;
  }
  #payment-success > p {
    padding: 0 10px;
  }
}

#powered-by-stripe {
  display: flex;
  width: 100%;
  padding-top: 10px;
  padding-right: 5%;
}
#powered-by-stripe > .spacer {
  width: 80%;
}
#powered-by-stripe > img {
  width: 111px;
}

#profile > * {
  width: 600px;
}
@media only screen and (max-width: 768px) {
  #profile > * {
    width: 100%;
  }
}
#post-header {
  width: 600px;
  margin-top: 1rem;
  margin-bottom: 1rem;
  padding-left: 30px;
}
@media only screen and (max-width: 768px) {
  #post-header {
    width: 100%;
  }
}
#profile-header > div:first-child {
  color: red;
  display: flex;
  font-size: 0.8rem;
  justify-content: space-between;
  margin-top: 0.5rem;
}
#profile-header > div:first-child > div > button {
  background-color: transparent;
  border: none;
  color: red;
  cursor: pointer;
  padding: 0;
  margin: 0;
}
#profile-header > div:first-child > div > button:hover {
  text-decoration: underline;
}
#profile-header > div:first-child > div > button > img {
  height: 1rem;
  margin-left: 0.5rem;
  display: none;
}
#profile-header > div:first-child > div > button > img.show {
  display: inline;
}
#profile-header > div > a.clear-profile, #post-header > a {
 color: #666;
 text-decoration: none;
}
#profile-header > div > a.clear-profile:hover, #post-header > a:hover {
  color: #333;
}
#profile-header > .content {
  display: flex;
  margin: 1.5rem 0;
}
@media only screen and (max-width: 768px) {
  #profile-header > .content {
    padding: 0 1rem;
  }
}
#profile-header > .content > .info {
  align-items: flex-start;
  flex: auto;
  display: flex;
  flex-direction: column;
  margin-left: 1rem;
  margin-top: 40px;
  width: calc(100% - 120px - 1rem);
}
#profile-header > .content > .info > h2 + p,
#profile-header > .content > .info > h2 + input {
  margin-top: 0.5rem;
}
#profile-header > .content > .info > h2 + p {
  white-space: pre-wrap;
  word-break: break-word;
}

#profile-header > .content > .info > h2 + input {
  border: 1px solid #e4e4e4;
  border-radius: 1.5rem;
  box-sizing: border-box;
  display: block;
  outline: none;
  padding: 1rem;
  width: 100%;
}
#profile-header .image-mask {
  display: flex;
  flex: 0 0 120px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  border: 1px solid #ccc;
  z-index: 1;
  border-radius: 500px;
  min-width: 50px;
  min-height: 50px;
  width: 120px;
  height: 120px;
}
#profile-header .image-mask > img.foreground {
  z-index: 0;
  height: 120px;
  width: auto;
}
#profile-header .image-mask > img.background {
  width: 150%;
  position: absolute;
  z-index: -1;
  filter: blur(8px);
}

.profile-headline-editor-content-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
}

.profile-headline-editor {
  height: fit-content;
  width: 100%;
  padding-top: 10px;
  margin-bottom: 10px;
  transition: opacity 0.42s, height 0.42s;
  opacity: 1;
}
.profile-headline-editor[hidden] {
  opacity: 0;
  height: 0;
  padding: 0;
  margin: 0;
  border: none;
}

.profile-headline-editor > .input-bar,
.comment-comment-editor > .input-bar {
  display: flex;
  align-items: center;
  height: fit-content;
  width: 100%;
}

.profile-headline-editor-hint {
  position: absolute;
  color: #999;
  line-height: 1em;
  z-index: 0;
  top: 15px;
  left: 3.9%;
  opacity: 1;
}
.profile-headline-editor-hint.hidden {
  opacity: 0;
}

.profile-headline-editor-content {
  position: relative;
  z-index: 1;
  outline: none;
  overflow: scroll;
  white-space: pre-wrap;
  border: 1px solid #e4e4e4;
  transition: min-height 0.25s;
  padding: 11px 3.6%;
  padding-top: 15px;
  padding-right: 100px;
  border-radius: 25px;
  min-height: 17px;
  width: 90%;
  margin-bottom: 5px;
}
@media only screen and (max-width: 768px) {
  .profile-headline-editor-content {
    max-width: 100vw;
  }
}

.profile-headline-editor-send-button {
  background: none;
  border: none;
  outline: none;
  cursor: pointer;
  position: absolute;
  background-color: #263859;
  padding: 0;
  right: 42px;
  bottom: 12px;
  z-index: 1;
  width: 33px;
  height: 33px;
  border-radius: 25px;
  opacity: 1;
  transition: background-color 0.42s, opacity 0.42s;
}

.profile-headline-editor-send-button[disabled] {
  cursor: default;
  background-color: #c4c4c4;
}
.profile-headline-editor-send-button.faded {
  opacity: 0;
}
.profile-headline-editor-send-button > img {
  width: 33px;
  height: 33px;
  transition: filter 0.42s;
  filter: greyscale(0);
}

.profile-headline-editor-send-button.faded {
  cursor: default;
}
.profile-headline-editor-send-button.faded > img {
  cursor: default;
}

.profile-headline-editor-cancel-button {
  background: none;
  border: none;
  outline: none;
  cursor: pointer;
  position: absolute;
  background-color: #dc3545;
  padding: 0;
  right: 7px;
  bottom: 12px;
  z-index: 1;
  width: 33px;
  height: 33px;
  border-radius: 25px;
  transition: background-color 0.42s;
}

.profile-headline-editor-cancel-button[disabled] {
  cursor: default;
  background-color: #c4c4c4;
}
.profile-headline-editor-cancel-button.faded {
  background-color: #fff;
}
.profile-headline-editor-cancel-button > img {
  width: 25px;
  height: 25px;
  transition: filter 0.42s;
  filter: invert();
}

.profile-headline-editor-cancel-button.faded {
  cursor: default;
}
.profile-headline-editor-cancel-button.faded > img {
  cursor: default;
}
#profile-activity {
  margin-bottom: 10rem;
}
.activity {
  border: 1px solid transparent;
  background-color: #fff;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 0.375rem;
}
.activity + .activity {
  margin-top: 1rem;
}
.activity a {
  color: #999;
}
.activity .header {
  color: #999;
  font-size: 0.8rem;
}
.activity .header a img {
  height: 0.6rem;
}
.activity .post {
  padding: 1rem;
}
.activity .content {
  color: #000;
  margin-top: 0.5rem;
  text-decoration: none;
  white-space: pre-wrap;
  word-break: break-word;
}
.activity .content a {
  color: #000;
  text-decoration: none;
}
.activity .comment {
  border-top: 1px solid #e4e4e4;
}
.activity .comment .content-wrapper {
  border-left: 2px dashed #e4e4e4;
  margin: 1rem;
  padding: 0.5rem 1rem;
}
.activity .comment .comment-comment .content-wrapper {
  margin-bottom: -0.5rem;
  margin-left: 0;
}
.activity .comment .comment-comment .content-wrapper .content {
  display: inline-block;
  background-color: #f7f7f7;
  border-radius: 25px;
  display: inline-block;
  padding: 10px 15px;
}
.activity .comment .comment-comment .content-wrapper .content h3 {
  margin-bottom: 0.25rem;
}
.activity .comment .comment-comment .content-wrapper .info-text {
  color: #999;
  font-size: 0.8rem;
  margin-top: 0.25rem;
  margin-left: 1rem;
}

.activity .comment .comment-comment .content-wrapper .info-text a img {
  height: 0.6rem;
}

#invite-friends-copy {
  opacity: 0;
  transition: opacity 0.25s;
  padding: 8px 0px;
  width: 100%;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  color: #263859;
  background-color: #fff;
  display: flex;
  justify-content: center;
}
#invite-friends-copy.ready {
  opacity: 1;
}
#invite-friends-copy > div {
}
#invite-friends-copy h1 {
  font-size: 48px;
  margin-left: 8px;
}
#invite-friends-copy h3 {
  position: relative;
  left: 10px;
  margin-top: 5px;
}

#referral-stats {
  color: #263859;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 600px;
  opacity: 0;
  transition: opacity 0.25s;
  /* background-color: rgba(140, 171, 201, 0.1); */
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  background-color: #fff;
  padding: 8px 30px;
  border-radius: 8px;
  margin-top: 8px;
}
@media only screen and (max-width: 768px) {
  #referral-stats {
    width: 90%;
  }
}
#referral-stats.ready {
  opacity: 1;
}
#referral-stats .stat {
  text-align: center;
}
#referral-stats .stat > p {
  color: #10153a;
  opacity: 0.5;
}
#referral-stats .stat.payouts-today {
  margin-left: 10%;
}
#referral-stats .stat.payouts-today > h1 {
  font-size: 48px;
}
#referral-stats .lesser-stats {
  display: flex;
  justify-content: space-around;
  flex-direction: row;
  width: 50%;
}
@media only screen and (max-width: 768px) {
  #referral-stats .lesser-stats {
    flex-direction: column;
  }
  #referral-stats .lesser-stats > .stat.total-paid-out {
    margin-bottom: 15px;
  }
}

#add-payout-info {
  color: #263859;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: opacity 0.25s;
  transition-delay: 50ms;
  opacity: 0;
  margin-top: 8px;
}
@media only screen and (max-width: 768px) {
  #add-payout-info {
    width: 100%;
  }
}
#add-payout-info.ready {
  opacity: 1;
}

#add-payout-info .panel > div.flattened {
  height: 0;
}

#add-payout-info .slider {
  display: flex;
  width: 400vw;
  transition: transform 0.1s, height 0.25s ease, opacity 0.25s;
}
#add-payout-info .slider.none {
  transform: translate(150vw);
}
#add-payout-info .slider.sms-auth {
  transform: translate(50vw);
}
#add-payout-info .slider.paypal-register {
  transform: translate(-50vw);
}
#add-payout-info .slider.complete {
  transform: translate(-150vw);
}
@media only screen and (max-width: 768px) {
  #add-payout-info .slider.none {
    transform: translate(0vw);
  }
  #add-payout-info .slider.sms-auth {
    transform: translate(-100vw);
  }
  #add-payout-info .slider.paypal-register {
    transform: translate(-200vw);
  }
  #add-payout-info .slider.complete {
    transform: translate(-300vw);
  }
}
#add-payout-info .slider > .panel {
  width: 100vw;
  display: flex;
  align-items: start;
  justify-content: center;
}

#referrer-get-paid-out {
  display: flex;
  justify-content: center;
  width: 100%;
}
#referrer-get-paid-out > button {
  font-size: 36px;
  width: 100%;
  padding: 30px;
  border-radius: 8px;
  font-weight: 700;
  color: #fff;
  transition: box-shadow 0.25s, background-color 0.42s;
  background-color: rgb(0, 209, 0);
  cursor: pointer;
  box-shadow: none;
  border: none;
  outline: none;
}
#referrer-get-paid-out > button:hover {
  box-shadow: inset 0 0 20px -5px #fff;
}
#referrer-auth-code {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 100%;
}

#referrer-paypal-register {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 100%;
}
#paypal-logo {
  position: relative;
  margin: 0 8px;
  height: 22px;
  bottom: -3px;
}

#referrer-paypal-account {
  width: 100%;
}
#referrer-paypal-account > h3 {
  margin: 1rem 0 0.5rem 0;
  text-align: center;
}
#referrer-paypal-account > h2 {
  background-color: #fff;
  border: 1.5px solid #ced6e2;
  border-radius: 10px;
  padding: 20px;
}
#referrer-paypal-account .reset-account {
  display: flex;
  justify-content: flex-end;
}
#referrer-paypal-account .reset-account > button {
  margin-top: 2px;
  background-color: transparent;
  color: #b6b8bb;
  border: none;
  cursor: pointer;
  outline: none;
}
#referrer-paypal-account > .note {
  margin-top: 10px;
  text-align: center;
}

/* Referral Share Buttons */

#referral-sharing {
  width: 660px;
  opacity: 0;
  transition: opacity 0.25s;
  position: relative;
}
@media only screen and (max-width: 768px) {
  #referral-sharing {
    width: 96%;
  }
}
#referral-sharing.ready {
  opacity: 1;
}

#referrer-sharing {
  width: 630px;
  padding: 10px 15px;
  opacity: 0;
  transition: opacity 0.25s;
  margin-top: 1rem;
  border-radius: 8px;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  background-color: #fff;
  position: relative;
}
@media only screen and (max-width: 768px) {
  #referrer-sharing {
    padding: 10px 2%;
    width: 92%;
  }
}
#referrer-sharing.ready {
  opacity: 1;
}

#referral-share-title {
  color: #8cabc9;
  width: 100%;
  font-size: 32px;
}

#referral-link-container {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-around;
}

#referral-link-area {
  background-color: #fff;;
  font-size: 16px;
  width: 100%;
  padding: 15px 30px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 8px;
  color: #263859;
}

#referral-link-copy-button {
  background-color: transparent;
  outline: none;
  border: none;
  cursor: pointer;
}

#referral-buttons-copy {
  color: #263859;
  text-align: center;
  font-size: 28px;
}

#referral-buttons {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
  margin: 1rem auto 0 auto;
}

.referral-share-button {
  align-items: center;
  border: none;
  border-radius: 8px;
  background-color: transparent;
  outline: none;
  cursor: pointer;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  font-size: 1rem;
  font-weight: 600;
  justify-content: center;
  padding: 1rem 0;
  width: calc(20% - 10px);
}
.referral-share-button > span {
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-bottom: 10px;
}
.referral-share-button:hover {
  background-color: #E5E7EB;
}
.referral-share-button.selected {
  background-color: #263859;
  color: #fff;
}
.referral-share-button.selected > span > img {
  filter: invert();
}

.referral-share-button > span > img {
  height: 100%;
  margin-bottom: 1rem;
}
@media only screen and (max-width: 768px) {
  .referral-share-button {
    font-size: 0.6rem;
    padding: 0.5rem 0;
    width: calc(20% - 5px);
  }
  .referral-share-button > span > img {
    margin-bottom: 0.5rem;
  }
}
.referral-inputs {
  box-sizing: border-box;
  /* background-color: #F3F4F6; */
  background-color: #fff;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  margin-top: 8px;
  padding: 1rem;
  width: 660px;
  opacity: 0;
  transition: opacity 0.25s;
}
@media only screen and (max-width: 768px) {
  .referral-inputs {
    width: 100%;
  }
}
.referral-inputs.ready {
  opacity: 1;
}
@media only screen and (max-width: 768px) {
  .referral-inputs {
    width: calc(90% + 20px);
  }
}
.referral-inputs > input {
  box-sizing: border-box;
  font-size: 16px;
  width: 100%;
  padding: 15px 30px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 8px;
  color: #263859;
}
.referral-inputs > * + * {
  margin-top: 0.5rem;
}
.referral-inputs > div {
  display: flex;
}
.referral-inputs > div > button {
  width: 100%;
  padding: 15px;
  color: #fff;
  background: #263859;
  border: none;
  outline: none;
  border-radius: 8px;
  font-weight: 600;
  height: 55px;
  cursor: pointer;
}
.referral-inputs > div > .clear-referral-inputs {
  flex: 1 1 50px;
  margin-left: 0.5rem;
  background-color: #ccc;
}
#copy-success-text {
  position: absolute;
  right: 0;
  top: -10px;
  margin-top: 10px;
  text-align: right;
  opacity: 0.6;
}
#copy-success-text.hidden {
  visibility: hidden;
}
#copy-success-text.visible {
  visibility: visible;
}

#how-claimyr-rewards-work {
  width: 660px;
  margin-top: 36px;
  margin-bottom: 36px;
  opacity: 0;
  transition: opacity 0.25s;
}
@media only screen and (max-width: 768px) {
  #how-claimyr-rewards-work {
    width: 96%;
  }
}
#how-claimyr-rewards-work.ready {
  opacity: 1;
}

#how-claimyr-rewards-work .panel {
  background-color: #fff;
}

#how-claimyr-rewards-work > h3 {
  color: #8cabc9;
  padding-left: 10px;
  font-size: 32px;
}
#how-claimyr-rewards-work > .slider {
  margin-top: 5px;
  display: grid;
  grid-template-columns: 33.3% 33.3% 33.3%;
  grid-gap: 2%;
  transition: transform 0.5s;
}
#how-claimyr-rewards-work > .slider > .panel {
  border: none;
  border-radius: 13px;
  padding: 35px 10%;
  box-shadow: 0 0 20px -12px #8f2df0;
}
#how-claimyr-rewards-work > .slider > .panel > img {
  width: 50px;
}
#how-claimyr-rewards-work > .slider > .panel > p {
  font-size: min(4vw, 16px);
  margin-top: 10px;
}

@media only screen and (max-width: 768px) {
  #how-claimyr-rewards-work {
  }
  #how-claimyr-rewards-work > .slider {
    display: flex;
    flex-direction: column;
    grid-gap: 1.5%;
    margin-bottom: 5vh;
  }
  #how-claimyr-rewards-work > .slider > .panel {
    padding: 35px 9%;
  }
  #how-claimyr-rewards-work > .slider > .panel > img {
  }
  #how-claimyr-rewards-work > .slider > .panel > p {
  }
}

#how-claimyr-rewards-work > .slider.invite {
  transform: translate(0%);
}
#how-claimyr-rewards-work > .slider.cash {
  transform: translate(-40.25%);
}
#how-claimyr-rewards-work > .slider.remind {
  transform: translate(-80.5%);
}

#pending-posts {
  width: 600px;
  margin-top: 1rem;
  text-align: center;
}
@media only screen and (max-width: 768px) {
  #pending-posts {
    width: 100%;
  }
}

#pending-posts button {
  background-color: #f02849;
  border: none;
  color: #ffffff;
  cursor: pointer;
  font-weight: 600;
  font-size: 1rem;
  line-height: 1rem;
  outline: none;
  border-radius: 999px;
  box-sizing: border-box;
  margin: 0;
  padding: 1rem 2rem;
}

#pending-posts hr {
  box-sizing: border-box;
  border: none;
  border-bottom: 3px solid #f02849;
  margin: 0;
  margin-top: calc(-2rem + 6px);
  margin-bottom: 2.5rem;
  padding: 0;
  /* width: 100%; */
}

.coin-button {
  align-items: center;
  display: flex;
}
.coin-button button {
  align-items: center;
  background-color: #eee;
  border: 1px solid #ccc;
  border-radius: 999px;
  cursor: pointer;
  display: inline-flex;
  font-size: 1rem;
  margin-right: 0.25rem;
  outline: none;
  padding: 0;
  padding-right: .5rem;
  white-space: nowrap;
  overflow: hidden;
  z-index: 100;
  color: #000;
}
.coin-button button p {
  width: 10ch;
}
.coin-button img {
  filter: saturate(0);
  height: 1.5rem;
  margin-right: 0.25rem;
  transition: filter 0.5s;
}
.coin-button img.animate {
  animation: coin-roll 2s ease-in;
}
@keyframes coin-roll {
  0% { transform: translate(0, 0) rotate(0deg) }
  50% { transform: translate(14ch, 0) rotate(359deg) }
  65% { transform: translate(14ch, 3rem) rotate(0deg) }
  70% { transform: translate(-3rem, 3rem) rotate(0deg) }
  75% { transform: translate(-3rem, 0) rotate(0deg) }
}
.coin-button button.selected img {
  filter: saturate(1);
  transition: filter 0.5s;
}
.coin-button.small, .coin-relative-time-separator {
  color: #999;
}
.coin-button.small button {
  font-size: 0.8rem;
}
.coin-button.small button img {
  height: 1rem;
}
.test-coin-text {
  display: flex;
  align-items: center;
}
.coin-info {
  align-items: center;
  background-color: #fff;
  border-radius: 999px;
  border: 1px solid #ccc;
  display: flex;
  margin-top: 8px;
  padding: 0;
  padding-right: .5rem;
}
.coin-info img {
  height: 1rem;
  margin-right: 0.25rem;
}
.coin-info p {
  font-size: 0.8rem;
}

/* START Confetti */
/* Source: https://codepen.io/nqthqn/pen/xWLgLZ */
.coin-count {
  position: relative;
  display: inline-block;
  transition: transform ease-in 0.1s, box-shadow ease-in 0.25s;
  z-index: 100;
}

.coin-count:before, .coin-count:after {
  position: absolute;
  content: '';
  display: block;
  width: 140%;
  height: 100%;
  left: -20%;
  z-index: -1000;
  transition: all ease-in-out 0.5s;
  background-repeat: no-repeat;
}

.coin-count:before {
  display: none;
  top: -75%;
  background-image:
    radial-gradient(circle, #EAC431 20%, transparent 20%),
    radial-gradient(circle, transparent 20%, #EAC431 20%, transparent 30%),
    radial-gradient(circle, #EAC431 20%, transparent 20%),
    radial-gradient(circle, #EAC431 20%, transparent 20%),
    radial-gradient(circle, transparent 10%, #EAC431 15%, transparent 20%),
    radial-gradient(circle, #EAC431 20%, transparent 20%),
    radial-gradient(circle, #EAC431 20%, transparent 20%),
    radial-gradient(circle, #EAC431 20%, transparent 20%),
    radial-gradient(circle, #EAC431 20%, transparent 20%);
  /* background-size: 10% 10%, 20% 20%, 15% 15%, 20% 20%, 18% 18%, 10% 10%, 15% 15%, 10% 10%, 18% 18%; */
  background-size: 20% 20%, 40% 40%, 30% 30%, 40% 40%, 36% 36%, 20% 20%, 30% 30%, 20% 20%, 36% 36%;
}

.coin-count:after {
  display: none;
  bottom: -75%;
  background-image:
    radial-gradient(circle, #EAC431 20%, transparent 20%),
    radial-gradient(circle, #EAC431 20%, transparent 20%),
    radial-gradient(circle, transparent 10%, #EAC431 15%, transparent 20%),
    radial-gradient(circle, #EAC431 20%, transparent 20%),
    radial-gradient(circle, #EAC431 20%, transparent 20%),
    radial-gradient(circle, #EAC431 20%, transparent 20%),
    radial-gradient(circle, #EAC431 20%, transparent 20%);
  /* background-size: 15% 15%, 20% 20%, 18% 18%, 20% 20%, 15% 15%, 10% 10%, 20% 20%; */
  background-size: 30% 30%, 40% 40%, 36% 36%, 40% 40%, 30% 30%, 20% 20%, 40% 40%;
}

/* .coin-count.animate {
  transform: scale(1);
} */

.coin-count.animate:before {
  display: block;
  animation: topBubbles ease-in-out 0.5s forwards;
}

.coin-count.animate:after {
  display: block;
  animation: bottomBubbles ease-in-out 0.5s forwards;
}
@keyframes topBubbles {
  0% {
    background-position: 5% 90%, 10% 90%, 10% 90%, 15% 90%, 25% 90%, 25% 90%, 40% 90%, 55% 90%, 70% 90%;
  }
  50% {
    background-position: 0% 80%, 0% 20%, 10% 40%, 20% 0%, 30% 30%, 22% 50%, 50% 50%, 65% 20%, 90% 30%;
  }
  100% {
    background-position: 0% 70%, 0% 10%, 10% 30%, 20% -10%, 30% 20%, 22% 40%, 50% 40%, 65% 10%, 90% 20%;
    background-size: 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%;
  }
}
@keyframes bottomBubbles {
  0% {
    background-position: 10% -10%, 30% 10%, 55% -10%, 70% -10%, 85% -10%, 70% -10%, 70% 0%;
  }
  50% {
    background-position: 0% 80%, 20% 80%, 45% 60%, 60% 100%, 75% 70%, 95% 60%, 105% 0%;
  }
  100% {
    background-position: 0% 90%, 20% 90%, 45% 70%, 60% 110%, 75% 80%, 95% 70%, 110% 10%;
    background-size: 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%;
  }
}

a.clickable-link {
  color: #4c74b9;
  text-decoration: underline !important;
  text-decoration-color: #d2dcee !important;
  transition: all 0.3s ease;
}
a.clickable-link:hover {
  text-decoration-color: #829dce !important;
}

button.clickable-link {
  color: #4c74b9;
  text-decoration: underline !important;
  text-decoration-color: #d2dcee !important;
  transition: all 0.3s ease;
  border: none;
  background: none;
  cursor: pointer;
  margin: 0;
  padding: 0;
  font-size: 16px;
}
button.clickable-link:hover {
  text-decoration-color: #829dce !important;
}

.join-waitlist button.disabled, .join-waitlist button.disabled:hover {
  background-color: #aaa;
  border: none;
}

.clipboard-icon {
  filter: invert();
  height: 32px;
  margin-left: 2%;
  margin-bottom: -5px;
}

/* START join-waitlist */
.join-waitlist {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 600px;
  margin-bottom: 8px;
}
@media only screen and (max-width: 768px) {
  .join-waitlist {
    width: 100%;
  }
}
.join-waitlist button {
  outline: none;
  cursor: pointer;
  background-color: rgb(0, 209, 0);
  box-shadow: 0 0 25px -8px #999;
  border: 1px solid hsla(0, 0%, 100%, 0.342);
  color: #fff;
  border-radius: 7px;
  padding-top: 32px;
  padding-bottom: 32px;
  width: 600px;
  font-size: min(7vw, 26px);
  transition: background-color 0.42s;
  white-space: nowrap;
}
.join-waitlist button:hover, #faux-place-call-now button:hover {
  border: 1px solid white;
  background-color: rgb(0, 238, 0);
}
@media only screen and (max-width: 768px) {
  .join-waitlist button {
    width: 100%;
  }
}
/* END join-waitlist */
/* START youtube-video */
.youtube-video {
  box-sizing: border-box;
  margin-bottom: 0.5rem;
  margin-top: 1rem;
  width: 100%;
  height: 320px;
  border-radius: .5rem;
}
.comment .youtube-video {
  height: 250px;
}
.comment .comment .youtube-video {
  height: 220px;
}
/* END youtube-video */ 
/* START guides */
.guides .info {
  line-height: 1.2rem;
  margin-bottom: 0.5rem;
}
.guides .learn-more {
  border: 0;
  background-color: #263859;
  border-radius: 999px;
  color: #fff;
  cursor: pointer;
  font-size: 1rem;
  font-weight: 600;
  margin-bottom: 2rem;
  margin-top: 0.25rem;
  outline: none;
  padding: 0.5rem 1rem;
}
.guides .learn-more:hover {
  background-color: rgba(38, 56, 89, .8);
}
.guides .menu-item {
  border-bottom: 1px solid #d8d9da;
  color: #64666a;
  cursor: pointer;
  padding: 1rem 0;
}
.guides .menu-item.selected {
  font-weight: 600;
  color: #ff4a4b;
}
.guides .sub-menu {
  background-color: #fff;
  border-bottom: 1px solid #d8d9da;
  display: none;
  padding-left: 2rem;
}
.guides .sub-menu.selected {
  display: block;
}
.guides .guide-item {
  border-bottom: 1px solid #d8d9da;
  color: #64666a;
  cursor: pointer;
  padding: 1rem 0;
}
.guides .guide-item.selected {
  font-weight: 600;
  color: #ff4a4b;
}
.guides .guide-link {
  align-items: center;
  color: #000;
  display: flex;
  height: 3rem;
  text-decoration: none;
}
.guides .guide-link + .guide-link {
  border-top: 1px solid #d8d9da;
}
.guides .guide-link.new {
  color: #64666a;
}
.guides .moderator-mode {
  align-items: center;
  display: flex;
}
.guides .moderator-mode .switch {
  margin-right: 1rem;
}
/* END guides */
/* START community-group */
.community-group H2 {
  border-bottom: 1px solid #d8d9da;
  color: #ff4a4b;
  cursor: pointer;
  font-size: 1rem;
  font-weight: 600;
  padding: 1rem 0;
}
.community-group .sub-menu {
  background-color: #fff;
  border-bottom: 1px solid #d8d9da;
  display: block;
  padding: 0 2rem;
}
.community-group .community-controls {
  align-items: center;
  color: #000;
  display: flex;
  justify-content: space-between;
  height: 3rem;
  text-decoration: none;
}
.community-group .community-controls + .community-controls {
  border-top: 1px solid #d8d9da;
}
.community-group .community-controls a {
  align-items: center;
  color: #000;
  display: flex;
  flex: 1 1 100%;
  height: 100%;
  text-decoration: none;
}
/* END community-group */
/* START guide-forms */
.guide-forms .guide-form {
  background-color: #f7f7f7;
  border: 1px solid #ccc;
  border-radius: .5rem;
  box-sizing: border-box;
  margin-bottom: 1rem;
  margin-left: -1rem;
  padding: 0 1rem;
  width: calc(100%)
}
.guide-forms h3 {
  margin-top: 1rem;
}
.guide-forms h3 span {
  color: #009897;
}
.guide-forms input,
.guide-forms textarea,
.guide-forms h4 {
  box-sizing: border-box;
  margin-top: 0.5rem;
  width: 100%;
}
.guide-forms button, .guide-forms input[type="file"] {
  margin-bottom: 1rem;
  margin-top: 0.5rem;
}
.guide-forms textarea {
  height: 600px;
  margin-bottom: 1rem;
}
.guide-form .upload-controls {
  background-color: #fff;
  border: 1px solid #ccc;
  display: inline-block;
  padding: 1rem;
}
.guide-form .upload-controls .preview {
  display: block;
  max-width: 100%;
}
.guide-form .upload-controls .upload, .guide-form .upload-controls .remove {
  border: none;
  border-radius: 999px;
  background-color: #28a745;
  color: #fff;
  cursor: pointer;
  margin: 0;
  margin-bottom: 1rem;
  padding: 0.5rem 1rem;
}
.guide-form .upload-controls .remove {
  background-color: #dc3545;
  margin-left: 0.5rem;
}
.guide-form .related-guides button {
  margin: 0;
  margin-left: 1rem;
}
.guide-form .uploaded-images {
  list-style-type: none;
  padding: 0;
}
.guide-form .uploaded-images li {
  align-items: center;
  display: flex;
  margin-top: 0.5rem;
}
.guide-form .uploaded-images button {
  margin: 0;
  margin-left: .5rem;
}
.guide-form .uploaded-images img {
  margin-right: 1rem;
  max-width: 50px;
  max-height: 50px;
}
.guide-forms .prose {
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 0.5rem;
  padding: 1rem;
}
.guide-forms .prose h1 {
  margin-top: 0;
}
/* END guide-forms */
/* START switch */
.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}
.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}
.switch .slider {
  border-radius: 34px;
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.switch .slider:before {
  border-radius: 50%;
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

.switch input:checked + .slider {
  background-color: #2196F3;
}

.switch input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

.switch input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}
/* END switch */
/* START guide-page */
.guide-page {
  background-color: #fff;
  padding-bottom: 4rem;
}
.guide-page #post-header {
  width: 700px;
}
@media only screen and (max-width: 768px) {
  .guide-page #post-header {
    width: 100%;
  }
}
.guide-page > h2 {
  box-sizing: border-box;
  padding-bottom: 0.5rem;
  width: 700px;
}
@media only screen and (max-width: 768px) {
  .guide-page > h2 {
    padding-left: 1rem;
    padding-right: 1rem;
    width: 100%;
  }
}
.guide-page > p {
  box-sizing: border-box;
  margin-bottom: 1.5rem;
  width: 700px;
}
@media only screen and (max-width: 768px) {
  .guide-page > p {
    margin-bottom: 1.5rem;
    padding: 0 1rem;
    width: 100%;
  }
}

.guide-page .prose-title {
  width: 700px;
  color: rgb(55, 53, 47);
}
@media only screen and (max-width: 768px) {
  .guide-page .prose-title {
    padding: 3% 0%;
    width: 94%;
  }
}

.guide-page .prose-title h1 {
  font-size: 2.5em;
}

.guide-page .prose {
  box-sizing: border-box;
  padding-bottom: 4rem;
  width: 700px;
}
@media only screen and (max-width: 768px) {
  .guide-page .prose {
    padding: 1rem;
    padding-bottom: 4rem;
    width: 100%;
  }
}
.guide-page .prose img {
  width: 100%;
}
.guide-page #community-posts {
  box-sizing: border-box;
  min-height: 0;
  width: 700px;
}
@media only screen and (max-width: 768px) {
  .guide-page #community-posts {
    width: 100%;
    padding-left: 1rem;
    padding-right: 1rem;
  }
}
.guide-page .community-post {
  padding-top: 0;
}
.guide-page ul.related-guides {
  list-style-type: none;
  margin: 0;
  margin-bottom: 1rem;
  padding: 0;
  width: 700px;
}
@media only screen and (max-width: 768px) {
  .guide-page ul.related-guides {
    width: 100%;
  }
}
.guide-page ul.related-guides li {
  margin-bottom: 0.5rem;
}
@media only screen and (max-width: 768px) {
  .guide-page ul.related-guides li {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}
.guide-page .moderator-tools {
  display: flex;
  width: 700px
}
@media only screen and (max-width: 768px) {
  .guide-page .moderator-tools {
    width: 100%;
  }
}
.guide-page .guide-editor {
  width: 700px
}
@media only screen and (max-width: 768px) {
  .guide-page .guide-editor {
    width: 96%;
  }
}
.guide-page .guide-editor textarea {
  width: 100%;
}
.guide-page .guide-editor textarea.content {
  height: 500px;
}
/* END guide-page */
.promotion-ends {
  margin-top: 10px;
  white-space: normal;
}

.crossed-out-price {
  text-decoration: line-through;
}

/*TOOLTIP*/

.tooltip {
  position: relative;
  display: inline-block;
  margin: 5px auto;
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 220px;
  background-color: black;
  color: #fff;
  text-align: center;
  padding: 5px 0;
  border-radius: 6px;
  top: 100%;
  left: 50%;
  margin-left: -110px;
  position: absolute;
  z-index: 1;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
}

.tooltip > p {
  margin-left: 10px;
}

.tooltiptext > a:link {
  color: cyan;
  text-decoration: none;
}

.tooltiptext > a:visited {
  color: cyan;

}

#ssn-input {
  position: relative;
  display: flex;
  flex-direction: column;
  visibility: visible;
  margin-top: 10px;
}

#ssn-input > input {
  margin: 0px 10px 10px 10px;
  outline: none;
  border: 1px solid #ccc;
  border-radius: 15px;
  padding: 3%;
  font-size: min(8vw, 32px);
}
.ssn-icon {
  padding: 15px;
  color: rgb(49, 0, 128);
  width: 70px;
  text-align: right;
  background-size: 28px 28px;
}
#ssn-input-icon {
  visibility: visible;
  display: flex;
  position: relative;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  margin-top: 10px;
}

#ssn-input-icon > i {
  position: absolute;
  right: 20px;
  background-repeat: no-repeat;
  width: 1px;
  height: 1px;
  display: block;
  top: 45%;
  bottom: 55%;
  transform: translate(-50%, -50%);
}

#ssn-input-icon > input {
  margin: 0px 10px 10px 10px;
  outline: none;
  border: 1px solid #ccc;
  border-radius: 15px;
  padding: 3%;
  font-size: min(8vw, 32px);
}

#ssn-input > h3 {
  margin-bottom: 10px;
  text-align: center;
}

#ssn-input > div > span {
  font-size: 18px;
}

.ssn-note {
  margin: 10px 10px 10px;
  text-align: center;
  font-size: 18px;
  font-style: italic;
}

#ssn-input > button {
  outline: none;
  cursor: pointer;
  background-color: rgb(0, 209, 0);
  box-shadow: 0 0 25px -8px #999;
  border: 1px solid hsla(0, 0%, 100%, 0.342);
  color: #fff;
  border-radius: 7px;
  padding-top: 25px;
  padding-bottom: 25px;
  font-size: min(7vw, 26px);
  transition: background-color 0.42s;
  white-space: nowrap;
  margin-bottom: 10px;
}

#ssn-input input {
  width: calc(100% - 32px);
  padding: 10px 15px;
  border-radius: 8px;
  border: 1px solid #333;
  margin-bottom: 10px;
}

@media only screen and (max-width: 768px) {
  #ssn-input > input {
    margin: 0 auto;
    width: 80%;
  }
  #ssn-input > h3 {
    margin-top: 10px;
    text-align: center;
  }
  #ssn-input > button {
    width: 100%;
  }
  #ssn-input {
    width: 100%;
  }
}



@media only screen and (max-width: 768px) {
  #ssn-input-icon > input {
    margin: 0 auto;
    width: 80%;
  }

  #ssn-input-icon > i {
    right: 8%;
    top: 50%;
    bottom: 50%;
  }
}
/* START membership-button */
.membership-button {
  background-color: #fff;
  border: 1px solid #FE6769;
  border-radius: 999px;
  color: #FE6769;
  cursor: pointer;
  font-size: 0.8rem;
  font-weight: 600;
  height: 30px;
  outline: none;
  padding: 0 15px;
}
.membership-button.leave {
  border-color: #c4c4c4;
  color: #c4c4c4;
} 
/* END membership-button */
/* START join-communities */
.join-communities {
  background-color: #fff;
  border-radius: 0.5rem;
  box-shadow: 0 1px 3px 0 rgb(0 0 0 / 10%), 0 1px 2px 0 rgb(0 0 0 / 6%);
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  font-size: 1.25rem;
  align-items: center;
  line-height: 2rem;
  padding: 2rem;
  width: 600px;
}
.join-communities button {
  background-color: #FE6769;
  border: 0;
  border-radius: 999px;
  color: #fff;
  cursor: pointer;
  font-size: 1rem;
  font-weight: 600;
  margin-top: 1rem;
  outline: none;
  padding: 0.75rem 1.5rem;
}
@media only screen and (max-width: 768px) {
  .join-communities {
    width: 100%;
  }
}
/* END join-communities */
/* START cta */
.prompt {
  background-color: #00BDAA;
  border-radius: 0.5rem;
  box-shadow: 0 1px 3px 0 rgb(0 0 0 / 10%), 0 1px 2px 0 rgb(0 0 0 / 6%);
  box-sizing: border-box;
  color: #fff;
  display: flex;
  flex-direction: column;
  font-size: 1.25rem;
  font-weight: 600;
  align-items: center;
  line-height: 2rem;
  margin-bottom: 1rem;
  padding: 2rem;
  width: 600px;
  white-space: pre-wrap;
}
@media only screen and (max-width: 768px) {
  .prompt {
    width: 100%;
  }
}

.prompt .referral-link {
  border: 1px solid #fff;
  padding: 5px 10px;
}

.prompt a.cta {
  background-color: #fff;
  border: 0;
  border-radius: 999px;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  color: #000;
  cursor: pointer;
  font-size: 1rem;
  font-weight: 600;
  margin-top: 2rem;
  outline: none;
  padding: 0.75rem 1.5rem;
  text-decoration: none;
  white-space: nowrap;
}

/* END cta */
/* START about */
.about {
  box-sizing: border-box;
  text-align: center;
  padding: 2rem 0;
  width: 600px;
}
@media only screen and (max-width: 768px) {
  .about {
    padding: 2rem 1rem;
    width: 100%;
  }
}
.about h1 {
  margin-bottom: 1rem;
}
.about > p {
  line-height: 1.5rem;
}
.about .team {
  background-color: #fff;
  border-radius: 0.5rem;
  box-shadow: 0 1px 3px 0 rgb(0 0 0 / 10%), 0 1px 2px 0 rgb(0 0 0 / 6%);
  margin: 2rem 0;
  padding: 1rem 0;
}
.about .team-members {
  display: grid;
  grid-gap: 1rem;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  margin-top: 1rem;
}
/* END about */
/* START team-member */
.team-member .mask {
  position: relative;
  border-radius: 999px;
  overflow: hidden;
  width: 165px;
  margin: auto;
  display: flex;
  justify-content: center;
  background-color: grey;
}
.team-member img {
  height: 165px;
}
.team-member .name {
  font-weight: 600;
  margin-top: 0.25rem;
}
.team-member .title {
  font-size: 0.8rem;
  margin-top: 0.25rem;
}
/* END team-member */

#post-editor .char-limit {
  display: flex;
  align-items: center;
  color: #bbb;
  font-size: 0.8rem;
  font-weight: 500;
  margin-right: 0.5rem;
  white-space: nowrap;
}
#post-editor .char-limit.warning {
  color: #f02849;
}

#read-more-community-posts {
  width: 100%;
}
#read-more-community-posts a {
  display: block;
  background-color: #2A3856;
  color: #fff;
  text-decoration: none;
  border: 1px solid #d8d9da;
  width: 600px;
  text-align: center;
  padding: 18px 0px;
  border-radius: 5px;
  margin: 0 auto;
}
@media only screen and (max-width: 768px) {
  #read-more-community-posts a {
    width: 100%;
  }
}

#saved-cards {
  display: flex;
  flex-direction: column;
}

#saved-cards .saved-card {
  width: calc(100% - 40px);
  border-radius: 12px;
  margin: 5px 1%;
  padding: 20px;
  border: none;
  outline: none;
  cursor: pointer;
  background-color: #fff;
}
@media only screen and (max-width: 768px) {
  #saved-cards .saved-card {
  }
}

#saved-cards .saved-card .row {
  display: flex;
  justify-content: space-between;
  padding: 5px 0px;
}

#saved-cards .saved-card img {
  width: 30px;
}

#saved-cards .saved-card .credit-card-logo-and-info {
  display: flex;
  align-items: center;
}

#saved-cards .saved-card .credit-card-logo-and-info .brand {
  margin-left: 5px;
}

#saved-cards .saved-card .credit-card-logo-and-info .bullets {
  display: flex;
  align-items: center;
  margin-left: 5px;
}
#saved-cards .saved-card .credit-card-logo-and-info .bullets .bullet {
  margin: 0px 1px;
}

#saved-cards .saved-card .credit-card-info {
  margin-left: 5px;
  text-align: left;
  font-size: 10px;
}

#saved-cards .buttons {
  padding: 10px 0px;
}
#saved-cards .buttons button {
  background-color: var(--claimyr-blue);
  color: #fff;
  padding: 10px 0px;
  border-radius: 5px;
  border: none;
  outline: none;
  margin: 0px 5px;
  cursor: pointer;
  width: 46%;
}

#tax-review-container {
  display: flex;
  flex-direction: column;
  width: 100%;
  align-items: center;
}
#tax-review-landing {
  width: 100%;
  background-color: white;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 12px;
  border: none;
  border-radius: 8px;
  box-shadow: rgb(0 0 0 / 10%) 0px 1px 3px 0px, rgb(0 0 0 / 6%) 0px 1px 2px 0px;
}
#tax-review-landing-header {
  margin-top: 2em;
  display: flex;
  flex-direction: row;
  align-items: center;
}
#tax-review-landing-header > img {
  height: 150px;
  border-radius: 360px;
}
#tax-review-landing-headers-description {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-left: 2em;
}
#tax-review-landing-headers-description > h1 {
  color: rgb(38, 56, 89);
  font-size: 2em;
  margin-top: 0;
}
#tax-review-landing-headers-description > h2 {
  color: rgb(38, 56, 89);
  margin-inline-end: auto;
  font-size: 1.5em;
}
#tax-review-landing-headers-rating {
  display: flex;
  flex-direction: row;
  color: rgb(38, 56, 89);
  margin-inline-end: auto;
  font-size: 0.6em;
}
#tax-review-landing-headers-rating > span {
  margin-inline-end: auto;
}
#tax-review-landing > p {
  margin: 2em 2em 5px 2em;
}
#tax-review-landing-footer {
  margin-bottom: 2em;
  margin-left: 2em;
  display: flex;
  flex-direction: row;
  align-items: baseline;
}
#tax-review-landing-footer-overview {
  display: flex;
  flex-direction: column;
  flex-basis: 50%;
}
#tax-review-landing-footer-social {
  display: flex;
  flex-direction: column;
  flex-basis: 50%;
}
#tax-review-landing > #payment-form {
  box-shadow: none;
}
#tax-review-comments-container {
  display: flex;
  flex-direction: column;
  align-items: baseline;
  border: none;
  width: 100%;
  margin-bottom: 30px;
  border-radius: 8px;
  transition: opacity 0.25s;
  background-color: #fff;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
}
#tax-review-comments {
  margin-left: 2em;

}
#tax-review-comments > h1 {
  color: rgb(38, 56, 89);
  font-size: 1.5em;
  margin-top: 10px;
  margin-bottom: 15px;
}
#tax-review-comments > p {
  font-size: 14px;
  margin-top: 15px;
  margin-right: 20px;
}
#tax-review-comments > hr {
  margin-top: 15px;
  margin-bottom: 15px;
  margin-right: 2em;
  border-top: 2px dashed #bbb;
}
#tax-review-comments-comment-header {
  display: flex;
  flex-direction: row;
}
#tax-review-comments-profile-description {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-left: 25px;
  color: rgb(38, 56, 89);
}
#tax-review-comments-profile-description > a,
#tax-review-landing-footer-social > a {
  text-decoration: none;
}
#tax-review-comments-comment-header > img {
  height: 100px;
  border-radius: 360px;
}
#tax-review-spinner {
  width: 25px;
  height: 25px;
}
#tax-review-container > #sign-up-full-name,
#tax-review-container > #sign-up-phone-number,
#tax-review-container > #sign-up-sms-auth-code
{
  transition: none;
}
#tax-review-success-payment {
  margin-top: 1em;
  margin-bottom: 1em;
  display: flex;
  flex-direction: column;
  align-items: center;
  color: rgb(38, 56, 89);
}
#tax-review-button {
  margin-bottom: 10px;
  padding: 10px;
  border-radius: 7px;
  background-color: blue;
  color: white;
  border: none;
  cursor: pointer;
  font-size: 20px;
  width: 100%;
  padding: 18px 0px;
  box-shadow: 0 0 25px -8px #999;
  opacity: 0;
  transition: opacity 0.25s;
}
#tax-review-button.posts-loaded {
  opacity: 1;
}
#tax-review-button-content {
  display: flex;
  flex-direction: column;
  align-items: center;
}
#tax-review-faux-pay-button {
  font-size: min(7vw, 14px);
  color: white;
  background-color: rgb(0, 209, 0);
  padding: 12px 2%;
  border-radius: 5px;
  border: none;
  box-shadow: 0 6px 20px -8px #3c5ccf;
  width: 100%;
  height: 50px;
  cursor: pointer;
  margin-bottom: 10px;
}
#tax-review-landing-work-experience {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-top: 5px;
}
#tax-review-landing-work-experience > img {
  height: 40px;
  width: 40px;
  margin-right: 10px;
}
#tax-review-payment-or-sign-up-flow,
#tax-review-payment-or-sign-up-flow > #payment-form {
  width: 100%;
}
#tax-review-book-now-button {
  font-size: min(7vw, 14px);
  color: white;
  background-color: rgb(0, 209, 0);
  padding: 12px 2%;
  border-radius: 5px;
  border: none;
  box-shadow: 0 6px 20px -8px #3c5ccf;
  width: 100%;
  height: 50px;
  cursor: pointer;
  margin-top: 10px;
  margin-inline-end: auto;
}
#tax-review-payment-or-sign-up-flow > #payment-form > #payment-billing-details {
  position: relative;
  right: -2%;
  width: 100%;
}

#tax-review-payment-or-sign-up-flow, #tax-review-payment-or-sign-up-flow > #payment-form {
  width: -webkit-fill-available;
}

.review-stars {
  color: #FFD700;
}
#tax-review-landing-headers-rating > .review-stars {
  line-height: 8px;
  font-size: 17px;
  margin-right: 5px;
}
