:root {
  --white: #fff;
  --shadow-color: #0003;
  --gray-4: #bdbdbd;
  --white-80: #fffc;
  --dark-gray: #5f5f5f;
  --primary-color: #5a7100;
  --olive-light: #c9df8f;
  --red-50: #ec565680;
  --light-mint: #e2f6d9;
  --yellow: #ffc802;
  --red-51: #ec5656;
  --blue: #3696ea;
  --cloud: #bebebe;
  --light-gray: #f2f2f2;
  --gray-3: #828282;
  --black: black;
  --bright-lime: #62ff00;
  --white-81: white;
}

.header {
  z-index: 5;
  background-color: var(--white);
  box-shadow: 0 0 15px 0 var(--shadow-color);
  justify-content: space-between;
  width: 100%;
  height: 60px;
  display: flex;
  position: fixed;
  inset: 0% 0% auto;
}

.page-wrapper {
  background-color: #ffffff80;
  align-items: flex-start;
  display: flex;
}

.page-wrapper.profile {
  background-color: #fff;
}

.page-left-column {
  border: 1px solid var(--gray-4);
  background-color: var(--white);
  width: 270px;
  max-width: 270px;
  height: 100vh;
  padding-top: 60px;
  position: relative;
  overflow: auto;
}

.page-left-column.profile {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex-direction: column;
  align-items: flex-start;
  width: 270vw;
  max-width: 270px;
  padding-top: 80px;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
}

.input-header-wrapper {
  align-items: center;
  padding: 10px;
  display: flex;
}

.input-header-title {
  color: var(--dark-gray);
  white-space: nowrap;
  margin-right: 10px;
  font-size: 13px;
}

.input-header-title.active {
  border: 1px solid var(--primary-color);
  color: var(--primary-color);
  border-radius: 15px;
  padding-left: 5px;
  padding-right: 5px;
}

.input-header-line {
  background-color: var(--gray-4);
  width: 100%;
  height: .5px;
}

.body {
  color: var(--dark-gray);
  font-family: Lato, sans-serif;
}

.search-form {
  border: 1px solid var(--gray-4);
  border-radius: 15px;
  flex-direction: column;
  align-items: center;
  width: 350px;
  margin-top: 0;
  padding-bottom: 10px;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
}

.search-form.side {
  background-color: #fff;
  border-color: #fff0;
  width: 100%;
  padding-bottom: 0;
}

.search-input {
  box-shadow: inset 0 0 10px 0 var(--shadow-color);
  color: var(--dark-gray);
  border-radius: 15px;
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: 35px;
  margin-bottom: 0;
  padding-left: 30px;
  display: flex;
}

.search-input.bottom-margin {
  margin-bottom: 20px;
}

.search-input.bottom-margin.text-area {
  height: 250px;
}

.search-input-wrapper {
  cursor: pointer;
  align-items: center;
  width: 100%;
  margin-bottom: 10px;
  display: flex;
  position: relative;
}

.search-input-wrapper.side {
  margin-bottom: 0;
}

.input-left-iscons {
  color: var(--gray-4);
  justify-content: center;
  align-items: center;
  height: 35px;
  font-family: Material Symbols Rounded, sans-serif;
  display: flex;
  position: absolute;
  left: 10px;
}

.input-left-iscons.register {
  color: var(--gray-4);
}

.input-left-iscons.active {
  color: var(--olive-light);
}

.form-centered-text {
  color: var(--dark-gray);
  text-align: center;
  margin-top: 5px;
  margin-bottom: 5px;
  margin-right: 10px;
  font-size: 13px;
}

.input-rightiscons {
  color: var(--olive-light);
  justify-content: center;
  align-items: center;
  height: 35px;
  padding-left: 5px;
  padding-right: 5px;
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 20px;
  display: flex;
  position: absolute;
  inset: 0% 0% 0% auto;
}

.input-rightiscons.red {
  color: var(--red-50);
}

.input-rightiscons.date-time {
  height: 25px;
}

.drop-down-input {
  grid-column-gap: 7px;
  grid-row-gap: 7px;
  background-color: var(--white);
  box-shadow: inset 0 0 10px 0 var(--shadow-color);
  color: var(--dark-gray);
  cursor: pointer;
  border-radius: 15px;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  min-height: 35px;
  margin-bottom: 0;
  padding: 7px 30px 7px 5px;
  display: flex;
  overflow: hidden;
}

.drop-down-input.date-time {
  justify-content: flex-start;
  width: 90px;
  min-height: 25px;
  max-height: 25px;
  padding-top: 3px;
  padding-right: 5px;
  position: relative;
}

.drop-down-input.date-time.open {
  z-index: 4;
  max-height: 250px;
  position: relative;
  overflow: auto;
}

.drop-down-input.frequency {
  width: 310px;
  max-height: 35px;
  margin-top: 10px;
  position: relative;
}

.drop-down-input.frequency.open {
  max-height: none;
}

.dropdown-input-text {
  color: var(--dark-gray);
  border-radius: 15px;
  width: 100%;
  padding-left: 7px;
  padding-right: 7px;
}

.dropdown-input-text.selected {
  background-color: var(--light-mint);
}

.dropdown-input-text.selected.red {
  background-color: var(--red-50);
}

.dropdown-input-text.hovered {
  background-color: var(--light-mint);
}

.dropdown-input-text.hovered.red {
  background-color: var(--red-50);
}

.categories-input-wrapper {
  grid-column-gap: 2.5px;
  grid-row-gap: 2.5px;
  border: 1px solid var(--gray-4);
  border-radius: 15px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  max-width: 201.725px;
  max-height: 200px;
  margin-bottom: 20px;
  margin-left: 5px;
  margin-right: 5px;
  padding: 10px 5px;
  display: flex;
  position: relative;
  overflow: auto;
}

.categories-input-wrapper.no-border {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  border-style: none;
  margin-bottom: 40px;
}

.categories-input-wrapper.no-border.wrap {
  flex-flow: wrap;
  justify-content: center;
  align-items: flex-start;
  max-width: 100%;
}

.category-input-badge-icon {
  border-radius: 15px;
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 15px;
}

.category-input-badge-icon.selected {
  background-color: var(--light-mint);
}

.category-input-badge-wrapper {
  border: 1px solid var(--light-mint);
  color: var(--dark-gray);
  cursor: pointer;
  border-radius: 15px;
  padding: 2.5px 5px;
  display: flex;
}

.category-input-badge-wrapper.selected {
  background-color: var(--light-mint);
  box-shadow: inset 0 2px 5px 0 var(--shadow-color);
  color: var(--primary-color);
  border-style: none;
  border-radius: 15px;
}

.category-input-badge-title {
  white-space: nowrap;
  border-radius: 15px;
  margin-left: 5px;
  padding-right: 5px;
  font-size: 11px;
  line-height: 20px;
}

.category-input-badge-title.selected {
  background-color: var(--light-mint);
}

.action-button {
  background-color: var(--primary-color);
  color: var(--white);
  text-align: center;
  cursor: pointer;
  border-radius: 20px;
  padding: 5px 10px;
  font-size: 16px;
  line-height: 18px;
  display: inline-block;
}

.action-button._100 {
  width: 100%;
}

.action-button._100.oposit {
  border: 1px solid var(--primary-color);
  background-color: var(--white);
  color: var(--primary-color);
}

.action-button-centered-wrapper {
  justify-content: center;
  margin-top: 5px;
  margin-bottom: 5px;
  padding-left: 10px;
  padding-right: 10px;
  display: flex;
}

.page-right-area {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: wrap;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  min-height: 100vh;
  max-height: 100vh;
  padding: 80px 30px 20px;
  display: flex;
  position: relative;
  overflow: auto;
}

.page-right-area.center {
  justify-content: center;
  align-items: center;
}

.event-card-wrapper {
  box-shadow: 0 0 8px 0 var(--shadow-color);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  background-color: #ffffff80;
  border-radius: 15px;
  width: 345px;
  min-width: 345px;
  max-width: 345px;
  height: 510px;
  min-height: 510px;
  max-height: 510px;
  transition: all .2s;
  position: static;
  overflow: hidden;
}

.event-card-wrapper._1 {
  transform-style: preserve-3d;
  margin-top: -10px;
  margin-right: -270px;
  transform: rotateX(20deg)rotateY(31deg)rotateZ(-20deg);
}

.event-card-wrapper._2 {
  transform-style: preserve-3d;
  margin-top: 10px;
  margin-right: -270px;
  transform: rotateX(20deg)rotateY(31deg)rotateZ(-20deg);
}

.event-card-wrapper._3 {
  transform-style: preserve-3d;
  margin-top: 30px;
  transform: rotateX(20deg)rotateY(31deg)rotateZ(-20deg);
}

.event-card-wrapper.effect:hover {
  box-shadow: 0 0 20px 0 #5a7100cc, 0 0 8px 0 var(--shadow-color);
}

.event-card-wrapper.effect.sf {
  border: 1px solid var(--gray-4);
  background-image: linear-gradient(0deg, var(--gray-4), white);
  box-shadow: inset 0 0 100px 20px var(--white);
  justify-content: center;
  align-items: center;
  width: 100%;
  min-width: 100%;
  max-width: 100%;
  height: auto;
  min-height: auto;
  display: flex;
}

.event-card-wrapper.effect.sf:hover {
  transform: none;
}

.event-card-header {
  background-color: var(--olive-light);
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 53px;
  padding-left: 10px;
  padding-right: 10px;
  display: flex;
}

.event-card-username-wrapper {
  border: 1px solid var(--white);
  background-color: var(--white);
  cursor: pointer;
  border-radius: 20px;
  justify-content: flex-start;
  align-items: center;
  min-width: 80%;
  max-width: 80%;
  padding-right: 10px;
  display: flex;
  overflow: hidden;
}

.event-card-user-image {
  background-image: url('../images/pexels-vinicius-wiesehofer-1130626.jpg');
  background-position: 50%;
  background-size: cover;
  border-radius: 34px;
  width: 34px;
  min-width: 34px;
  height: 34px;
  min-height: 34px;
}

.event-card-user-image.eat {
  background-image: url('../images/pattern8.svg');
}

.event-card-user-image.summer {
  background-image: url('../images/dl09nM3MadQDmraXmx2S--1--gd7jp.jpg');
}

.event-card-user-image.bounce {
  background-image: url('../images/2024-03-26-17_28_54-ChatGPT---SociaFly-Assistance.png');
}

.event-card-username {
  color: var(--primary-color);
  white-space: nowrap;
  word-break: keep-all;
  margin-left: 5px;
}

.event-card-interest-icon {
  color: var(--white);
  cursor: pointer;
  font-family: Material Icons;
  font-size: 25px;
}

.event-card-interest-icon.active {
  color: var(--yellow);
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: var(--dark-gray);
}

.event-card-interest-icon.red {
  color: var(--red-51);
  font-family: Material Symbols Rounded, sans-serif;
}

.event-card-category-container {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  display: flex;
  position: relative;
}

.event-card-category-icon {
  border: 1px solid var(--primary-color);
  color: var(--primary-color);
  border-radius: 8px;
  justify-content: center;
  align-items: center;
  padding: 5px;
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 25px;
  display: flex;
}

.event-card-info-wrapper {
  width: 100%;
  padding: 10px;
}

.image-card-image {
  background-image: url('../images/pexels-enric-cruz-lópez-6039252.jpg');
  background-position: 50%;
  background-size: cover;
  border-radius: 10px;
  width: 100%;
  height: 165px;
  margin-top: 5px;
  overflow: hidden;
}

.image-card-image.eat {
  background-image: url('../images/pexels-fauxels-3184183.jpg');
  background-size: 100%;
  transition: all .2s cubic-bezier(1, 0, 0, 1);
}

.image-card-image.eat.sf {
  background-image: url('../images/logo.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  height: 60px;
}

.image-card-image.summer {
  background-image: url('../images/BNXSAoelNgOozUYirXIb--1--b2hx3.jpg');
}

.image-card-image.bounce {
  background-image: url('../images/LPpGLrXZqrMbwGAvgYkz--1--4xwim.jpg');
}

.event-card-title {
  color: var(--primary-color);
  text-transform: capitalize;
  cursor: pointer;
  margin-top: 5px;
  margin-bottom: 15px;
  font-size: 16px;
}

.event-card-title.sf {
  text-align: center;
  text-transform: none;
  margin-top: 5px;
  margin-bottom: 5px;
  font-size: 15px;
  font-weight: 700;
  line-height: 20px;
}

.event-card-icon-and-text-wrapper {
  margin-top: 5px;
  display: flex;
}

.event-card-detail-icon {
  color: var(--primary-color);
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 20px;
}

.event-card-detail-text {
  color: var(--dark-gray);
  margin-left: 10px;
}

.event-card-detail-text.link {
  color: var(--blue);
  cursor: pointer;
}

.event-card-detail-text.link.no-margin {
  background-color: var(--olive-light);
  color: var(--primary-color);
  text-align: center;
  border-radius: 99px;
  justify-content: center;
  align-items: center;
  width: auto;
  margin-top: 0;
  padding: 5px 12px 5px 10px;
  font-size: 13px;
  font-weight: 700;
  line-height: 13px;
  transition: all .2s cubic-bezier(1, 0, 0, 1);
  display: flex;
  box-shadow: inset 0 0 5px #0003, 0 0 8px #5f5f5f80;
}

.event-card-detail-text.link.no-margin:hover {
  background-color: var(--primary-color);
  color: var(--olive-light);
}

.event-card-detail-text.no-margin {
  margin-top: 10px;
  margin-left: 0;
}

.event-card-detail-text.no-margin.sf {
  text-align: center;
  font-size: 20px;
}

.event-card-detail-text.no-margin.sf.feature {
  margin-top: 5px;
  font-size: 15px;
  line-height: 15px;
}

.event-card-report-wrapper {
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding-bottom: 5px;
  padding-left: 10px;
  padding-right: 10px;
  display: flex;
  position: absolute;
  inset: auto 0 5px auto;
}

.event-card-report-wrapper.sf {
  justify-content: center;
  margin-bottom: 5px;
  padding-bottom: 0;
  line-height: 15px;
  position: static;
}

.event-card-report-button {
  color: var(--red-51);
  cursor: pointer;
  justify-content: flex-end;
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 20px;
}

.event-card-report-button.hidden {
  display: none;
}

.event-card-zoom-wrapper {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  background-image: linear-gradient(#ffffffbf, #0000);
  justify-content: flex-end;
  align-items: center;
  height: 38px;
  padding-right: 10px;
  display: flex;
}

.event-card-zoom-icon {
  border: 1px solid var(--olive-light);
  background-color: var(--white-80);
  color: var(--primary-color);
  cursor: pointer;
  border-radius: 50px;
  justify-content: center;
  align-items: center;
  width: 30px;
  height: 30px;
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 25px;
  line-height: 25px;
  display: flex;
}

.event-card-zoom-icon.big {
  width: 40px;
  height: 40px;
  margin-top: 10px;
  margin-right: 10px;
  font-size: 30px;
}

.event-card-zoom-icon.big.abs {
  position: fixed;
  inset: 70px auto auto 0%;
}

.event-card-zoom-icon.big.abs.event-page {
  margin-left: 10px;
  top: 70px;
}

.event-card-zoom-icon.big.abs.purchase {
  top: 20px;
  left: 10px;
}

.event-card-image-full-wrapper {
  background-color: var(--white);
  transform-style: preserve-3d;
  background-image: url('../images/pexels-serkan-bayraktar-8028103.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 100%;
  height: 100%;
  transition: all .2s;
  position: absolute;
  inset: 0% auto auto 0%;
  transform: translate(0)rotateX(0)rotateY(90deg)rotateZ(0);
}

.event-card-image-full-wrapper.hidden {
  display: none;
}

.event-card-image-full-wrapper.open {
  transform: translate(0)rotate(0);
}

.event-card-user-profile-wrapper {
  background-color: var(--white);
  transform-style: preserve-3d;
  width: 100%;
  height: 100%;
  transition: all .2s;
  position: absolute;
  inset: 0% auto auto 0%;
  transform: translate(0)rotateX(90deg)rotateY(0)rotateZ(0);
}

.event-card-user-profile-wrapper.hidden {
  display: none;
}

.event-card-user-profile-wrapper.open {
  transition: all .2s;
  transform: translate(0)rotate(0);
}

.event-card-user-profile-cover {
  background-image: url('../images/pattern9.svg');
  background-size: cover;
  border-radius: 15px;
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: 193px;
  display: flex;
}

.event-card-back-btn-wrapper {
  border: 1px solid var(--olive-light);
  background-color: var(--white-80);
  color: var(--gray-4);
  cursor: pointer;
  border-radius: 45px;
  justify-content: center;
  align-items: center;
  width: 35px;
  height: 35px;
  display: flex;
  position: absolute;
  inset: 10px auto auto 10px;
}

.event-card-back-btn {
  color: var(--primary-color);
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 25px;
  line-height: 25px;
  display: flex;
}

.event-card-big-profile-image {
  border: 2px solid var(--white);
  background-color: var(--white);
  background-image: url('../images/profile.png');
  background-position: 50%;
  background-size: cover;
  border-radius: 200px;
  min-width: 188px;
  max-width: 188px;
  min-height: 188px;
  max-height: 188px;
  margin-top: 30px;
}

.event-card-prifole-info-wrapper {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  flex-flow: column;
  margin-top: 50px;
  padding-left: 5px;
  padding-right: 5px;
  display: flex;
}

.event-card-profile-name {
  text-align: center;
  margin-top: -20px;
  padding-top: 5px;
  padding-bottom: 5px;
  font-size: 20px;
}

.event-card-profile-tiny-details {
  text-align: center;
  padding-top: 2.5px;
  padding-bottom: 2.5px;
  font-size: 12px;
  line-height: 12px;
}

.event-card-profile-tiny-details.green {
  color: var(--primary-color);
}

.event-card-profile-actions-wrapper {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  margin-top: 20px;
  display: flex;
}

.event-card-profile-action-btn {
  background-color: var(--blue);
  color: var(--white);
  cursor: pointer;
  border-radius: 20px;
  justify-content: center;
  align-items: center;
  width: 75px;
  padding-top: 10px;
  padding-bottom: 10px;
  line-height: 14px;
  display: flex;
}

.event-card-profile-action-btn.green {
  background-color: var(--primary-color);
}

.event-card-profile-action-btn.disabled {
  background-color: var(--gray-4);
}

.event-card-profile-action-btn.red {
  background-color: var(--red-51);
}

.event-card-profile-bio {
  text-align: center;
  margin-top: 20px;
  padding: 2.5px 5px;
  font-size: 14px;
  line-height: 18px;
}

.event-card-profile-bio.green {
  color: var(--primary-color);
}

.event-card-profile-social-wrapper {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  justify-content: center;
  align-items: center;
  margin-top: 10px;
  padding-top: 5px;
  padding-bottom: 5px;
  display: flex;
  position: absolute;
  inset: auto 0% 10px;
}

.event-card-social-media-img {
  cursor: pointer;
  width: 20px;
}

.big-message-icon {
  margin-top: -80px;
  font-size: 80px;
  font-weight: 400;
  line-height: 90px;
}

.big-message-icon.report {
  color: #ec5656;
  margin-top: 0;
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 40px;
  line-height: 40px;
}

.big-message-icon.green {
  color: #5a7100;
}

.report-send-button {
  text-align: center;
  background-color: #ec5656;
  border-radius: 15px;
  width: 100%;
}

.report-send-button.cancel {
  background-color: #595b5c;
  margin-top: 10px;
}

.report-send-button.cancel.feedback {
  background-color: var(--dark-gray);
  margin-top: 0;
}

.report-send-button.feedback {
  background-color: var(--primary-color);
  border-radius: 30px;
  width: 150px;
}

.report-dropdown {
  text-transform: capitalize;
  border-radius: 15px;
}

.confirm-message-button-wrapper {
  justify-content: space-around;
  align-items: center;
  width: 100%;
  display: flex;
}

.report-form {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-top: 10px;
  display: flex;
}

.report-form.hidden {
  display: none;
}

.post-message-text {
  text-align: center;
  margin-bottom: 20px;
  font-size: 16px;
  line-height: 25px;
}

.post-message-text.feedback {
  font-size: 25px;
}

.post-message-text.white {
  color: var(--white);
}

.message-ok-button {
  color: #3b3b3b;
  cursor: pointer;
  background-color: #fff;
  border-radius: 20px;
  width: auto;
  padding: 5px 20px;
  font-weight: 700;
  display: inline-block;
}

.message-ok-button.red {
  color: #fff;
  background-color: #ec5656;
  justify-content: center;
  width: 75px;
  padding-left: 0;
  padding-right: 0;
  display: flex;
}

.report-form-block {
  width: 100%;
  margin-bottom: 0;
}

.report-form-block.feedback {
  width: 50%;
  max-width: 400px;
}

.post-report-div {
  z-index: 1;
  color: #fff;
  cursor: default;
  background-color: #000c;
  border-radius: 15px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  padding-left: 10px;
  padding-right: 10px;
  display: flex;
  position: absolute;
  inset: 0% auto auto 0%;
}

.post-report-div.hidden {
  display: none;
}

.report-message-input {
  border-radius: 15px;
  min-height: 100px;
}

.post-report-div-2 {
  z-index: 1;
  color: #fff;
  cursor: default;
  background-color: #000000db;
  border-radius: 15px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  padding-left: 10px;
  padding-right: 10px;
  display: flex;
  position: absolute;
  inset: 0% auto auto 0%;
}

.post-report-div-2.hidden {
  display: none;
}

.event-card-form {
  width: 100%;
  padding-left: 20px;
  padding-right: 20px;
}

.form-label-white {
  color: var(--dark-gray);
  text-align: left;
  text-transform: capitalize;
  width: 100%;
  margin-top: 5px;
  margin-bottom: 5px;
  display: none;
}

.form-label-white.seperator {
  color: var(--gray-4);
  text-align: center;
  white-space: nowrap;
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  display: block;
}

.form-label-white.login {
  text-align: center;
}

.textarea {
  box-shadow: inset 0 0 8px 0 var(--shadow-color);
  border-radius: 15px;
}

.header-logo-wrapper {
  align-items: center;
  padding: 5px;
  font-size: 20px;
  font-weight: 700;
  display: flex;
}

.header-logo-wrapper.dev {
  filter: grayscale();
}

.header-logo {
  cursor: pointer;
  background-image: url('../images/256x256.png');
  background-position: 0 0;
  background-size: cover;
  width: 40px;
  height: 40px;
}

.header-logo-name {
  color: var(--primary-color);
  text-shadow: 0 0 2px var(--olive-light);
  cursor: pointer;
  margin-left: 10px;
  font-weight: 300;
}

.header-nav-wrapper {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  justify-content: center;
  align-items: center;
  padding-left: 10px;
  padding-right: 10px;
  display: flex;
}

.header-nav-text.create {
  padding: 0 5px;
}

.header-nav-text.opaque {
  opacity: .3;
}

.header-nav-block {
  color: gray;
  border-radius: 20px;
  padding: 10px;
  font-size: 16px;
  text-decoration: none;
}

.header-nav-block:visited {
  color: var(--dark-gray);
  font-size: 15px;
  text-decoration: none;
}

.header-nav-block.selected {
  color: var(--primary-color);
  text-shadow: 0 0 10px var(--olive-light);
  font-weight: 700;
}

.header-nav-block.create {
  color: var(--primary-color);
  cursor: pointer;
  border-radius: 30px;
  justify-content: center;
  align-items: center;
  margin-left: 5px;
  margin-right: 5px;
  padding: 7.5px 10px;
  display: flex;
  position: relative;
  box-shadow: 0 0 8px #5a710099;
}

.header-nav-block.create.disabled {
  filter: grayscale();
  background-color: #00000012;
}

.header-nav-block.create.opaque {
  opacity: .3;
}

.header-nav-block.profile {
  color: var(--white);
  cursor: pointer;
  background-image: url('../images/profile.png');
  background-position: 50%;
  background-size: cover;
  border-radius: 50px;
  min-width: 45px;
  max-width: 50px;
  min-height: 45px;
  max-height: 50px;
  padding-top: 0;
  padding-bottom: 0;
  box-shadow: 0 0 10px #00000082;
}

.create-btn-icon {
  color: var(--primary-color);
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 20px;
  line-height: 0;
  display: flex;
}

.create-btn-icon.white {
  color: var(--white);
}

.create-btn-icon.white.large {
  width: auto;
  height: auto;
  font-size: 40px;
  line-height: 40px;
}

.mobile-menu-grab-wrapper {
  display: none;
}

.register-form-wrapper {
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  background-color: #fff9;
  border-radius: 15px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  max-width: 95%;
  padding-top: 20px;
  padding-bottom: 20px;
  display: flex;
  box-shadow: 0 0 8px #5a710042;
}

.register-form-wrapper.input-page {
  z-index: 1;
  background-color: #fff;
  border-radius: 0 30px 30px 0;
  justify-content: center;
  align-items: center;
  width: 40%;
  min-width: 40%;
  max-width: 40%;
  display: flex;
  position: absolute;
  inset: 0% auto auto 0%;
}

.register-form-wrapper.right {
  background-image: linear-gradient(to bottom, var(--olive-light), #5a71007d), url('../images/erika-giraud-7KhbREQPFD4-unsplash.jpg');
  background-position: 0 0, 50%;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  width: 100%;
  min-width: 100%;
  max-width: 100%;
  display: flex;
}

.register-form-wrapper.right.flex-right {
  align-items: center;
  width: 50%;
  min-width: 50%;
  max-width: 50%;
}

.register-form-wrapper.blur {
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  width: 100%;
  min-width: 100%;
  max-width: 100%;
  min-height: 100%;
  max-height: 100%;
  position: absolute;
  inset: 0% auto auto 0%;
}

.register-form-wrapper.hidden {
  display: none;
}

.registration-page-wrapper {
  background-image: linear-gradient(151deg, #e2f6d94d, #ffffff4d);
  background-position: 0 0;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  font-family: Lato, sans-serif;
  display: flex;
}

.registration-benifits-wrapper {
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  background-color: #ffffff30;
  border-radius: 15px;
  min-width: 300px;
  max-width: 600px;
  padding: 10px;
}

.registration-page-info-header {
  color: var(--primary-color);
  text-align: center;
  text-shadow: 0 0 13px var(--shadow-color);
  width: 100%;
  margin-top: 10px;
  margin-bottom: 0;
  font-size: 25px;
  font-weight: 400;
  line-height: 35px;
}

.body-2 {
  color: var(--white);
  font-family: Lato, sans-serif;
}

.registration-benifit-title {
  font-size: 18px;
}

.paragraph {
  color: var(--primary-color);
  margin-top: 5px;
  padding-left: 15px;
  font-size: 18px;
  line-height: 20px;
}

.bold-text {
  color: var(--primary-color);
  font-size: 20px;
}

.purchase-close-button {
  color: #fff;
  cursor: pointer;
  background-color: #000;
  border-radius: 25px;
  justify-content: center;
  align-items: center;
  min-width: 25px;
  min-height: 25px;
  font-family: Material Icons;
  display: flex;
  position: absolute;
  inset: -7px -7px auto auto;
}

.monthly-badge-wrapper {
  justify-content: center;
  align-items: center;
  width: 100%;
  display: flex;
  position: absolute;
  inset: -12px 0% auto;
}

.product-price {
  text-align: center;
  margin-top: 10px;
  margin-bottom: 10px;
  line-height: 15px;
}

.paywall-fine-print {
  color: #5a7100;
  text-align: center;
  margin-top: 0;
  margin-bottom: 5px;
  font-size: 12px;
  font-weight: 300;
  line-height: 15px;
}

.paywall-fine-print.stripe {
  color: #2b2b2b;
  background-color: #c2de4e;
  border-radius: 8px;
  padding: 2.5px 5px;
}

.paywall-fine-print.link {
  color: #5a7100;
  cursor: pointer;
  text-decoration: underline;
}

.paywall-fine-print.link:visited {
  color: #5a7100;
}

.payment-options-div {
  justify-content: space-between;
  align-items: center;
  width: 100%;
  display: flex;
}

.monthly-badge {
  background-color: #c2de4e;
  border-radius: 5px;
  width: 40%;
  padding: 2px 7px;
}

.paywall-footer {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-top: 20px;
  display: flex;
}

.payment-option-wrapper {
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
}

.payments-options-box {
  flex-direction: column;
  align-items: center;
  margin-bottom: 10px;
  display: flex;
}

.text-span-2 {
  text-decoration: underline;
}

.registration-logo {
  background-image: url('../images/logo_1.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 250px;
  height: 90px;
}

.product-name {
  color: #5a7100;
  text-align: center;
  margin-bottom: 0;
  font-size: 15px;
  font-weight: 400;
  line-height: 18px;
}

.benefits-text {
  color: var(--dark-gray);
  text-align: center;
  max-width: 400px;
  margin-top: 5px;
  font-size: 16px;
  font-weight: 700;
  line-height: 20px;
}

.benefits-box {
  color: #fff;
  padding: 10px 0;
  display: flex;
}

.benefits-icon {
  color: #5a7100;
  justify-content: center;
  align-items: center;
  margin-right: 10px;
  font-family: Material Icons;
  font-size: 25px;
  display: flex;
}

.pay-button-wrapper {
  justify-content: center;
  align-items: center;
  width: 100%;
  display: flex;
}

.monthly-badge-text {
  color: #5a7100;
  text-align: center;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-size: 10px;
  font-weight: 900;
}

.payment-option {
  cursor: pointer;
  background-color: #fff;
  border: 2px solid #c2de4e;
  border-radius: 20px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 200px;
  margin-left: 5px;
  margin-right: 5px;
  padding: 20px;
  display: flex;
  box-shadow: 0 0 20px #0003;
}

.benefits-wrapper {
  flex-direction: column;
  margin-top: 10px;
  margin-bottom: 20px;
  padding: 5px 11px;
  display: flex;
}

.registeration-info-wrapper {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-bottom: 0;
  padding-left: 10px;
  padding-right: 10px;
  display: flex;
  position: relative;
}

.registration-form-title {
  color: var(--primary-color);
  text-align: center;
  letter-spacing: -.5px;
  width: 100%;
  margin-top: 10px;
  margin-bottom: 0;
  font-size: 20px;
  font-weight: 400;
  line-height: 32px;
}

.registration-form-title.sign-in {
  margin-top: 0;
}

.form-block {
  margin-bottom: 0;
}

.password-visible-icon {
  color: var(--gray-4);
  justify-content: center;
  align-items: center;
  height: 35px;
  font-family: Material Icons;
  display: flex;
  position: absolute;
  left: auto;
  right: 10px;
}

.password-visible-icon.register {
  color: var(--gray-4);
}

.password-visible-icon.register.active {
  font-family: Material Symbols Rounded, sans-serif;
}

.password-visible-icon.active {
  color: var(--olive-light);
}

.password-visible-icon.delete {
  color: var(--red-51);
  font-size: 18px;
}

.btn-2 {
  display: inline-block;
}

.register-button {
  color: gray;
  border-radius: 20px;
  padding: 10px;
  font-size: 16px;
  text-decoration: none;
}

.register-button:visited {
  color: var(--dark-gray);
  font-size: 15px;
  text-decoration: none;
}

.register-button.selected {
  color: var(--primary-color);
  text-shadow: 0 0 10px var(--primary-color);
  font-weight: 700;
}

.register-button.create {
  background-color: var(--olive-light);
  color: var(--dark-gray);
  cursor: pointer;
  border-radius: 15px;
  justify-content: center;
  align-items: center;
  margin-top: 10px;
  margin-left: 5px;
  margin-right: 5px;
  padding: 7.5px 20px;
  display: flex;
  position: relative;
}

.register-button.profile {
  color: var(--white);
  background-image: url('../images/profile.png');
  background-position: 50%;
  background-size: cover;
  border-radius: 50px;
  min-width: 50px;
  max-width: 50px;
  min-height: 50px;
  max-height: 50px;
  padding-top: 0;
  padding-bottom: 0;
}

.register-button.google {
  box-shadow: 0 0 8px 0 var(--shadow-color);
  color: var(--blue);
  background-color: #fff;
  border-radius: 15px;
  margin-bottom: 10px;
  padding: 7.5px 20px;
}

.register-button.google.blue {
  background-color: var(--blue);
  color: var(--white);
  cursor: pointer;
}

.register-button.cancel {
  background-color: var(--gray-4);
  color: var(--dark-gray);
  cursor: pointer;
  border-radius: 15px;
  justify-content: center;
  align-items: center;
  margin-top: 10px;
  margin-left: 5px;
  margin-right: 5px;
  padding: 7.5px 20px;
  display: flex;
  position: relative;
}

.registration-seperator {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  justify-content: center;
  align-items: center;
  width: 100%;
  margin-top: 10px;
  margin-bottom: 10px;
  line-height: 15px;
  display: flex;
}

.registration-separator-line {
  border-bottom: 1px solid var(--cloud);
  border-left: 1px solid var(--cloud);
  background-color: #d6d6d6;
  border-radius: 20px;
  width: 100%;
  height: 0;
}

.registration-separator-line._90 {
  width: 90%;
  height: 0;
  margin-top: 10px;
  margin-bottom: 20px;
}

.blue {
  color: var(--blue);
}

.form-block-2 {
  margin-bottom: 0;
}

.register-form {
  border-radius: 15px;
  flex-direction: column;
  align-items: center;
  width: 350px;
  margin-top: 10px;
  padding-bottom: 10px;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
}

.register-form.side {
  background-color: #fff;
  border-color: #fff0;
  width: 100%;
  padding-bottom: 0;
}

.register-form.sign-in {
  margin-top: 0;
}

.register-form.sign-in.hidden {
  display: none;
}

.regitration-input {
  box-shadow: inset 0 0 10px 0 var(--shadow-color);
  color: var(--dark-gray);
  border-radius: 15px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  height: 35px;
  margin-bottom: 0;
  padding-left: 30px;
  padding-right: 30px;
  font-size: 15px;
  display: flex;
}

.regitration-input::placeholder {
  color: var(--gray-4);
}

.registration-input-wrapper {
  cursor: pointer;
  align-items: center;
  width: 100%;
  margin-bottom: 10px;
  display: flex;
  position: relative;
}

.registration-input-wrapper.side {
  margin-bottom: 0;
}

.clip-test {
  -webkit-text-fill-color: transparent;
  background-image: linear-gradient(red, red);
  -webkit-background-clip: text;
  background-clip: text;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0% auto auto 0%;
}

.header-menu {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  background-color: #ffffffe6;
  border-bottom-right-radius: 15px;
  border-bottom-left-radius: 15px;
  flex-direction: column;
  align-items: center;
  min-width: 150px;
  min-height: 100px;
  padding: 10px 5px;
  display: flex;
  position: absolute;
  top: 60px;
  left: auto;
  right: 5px;
  transform: translate(0);
  box-shadow: 0 0 20px #0003;
}

.header-menu-link-wrapper {
  color: var(--dark-gray);
  cursor: pointer;
  border-radius: 15px;
  justify-content: flex-start;
  width: 100%;
  padding: 2.5px 5px 2.5px 15px;
  text-decoration: none;
  display: flex;
}

.header-menu-link-wrapper:visited {
  color: var(--dark-gray);
}

.header-menu-link-wrapper.selected {
  background-color: var(--light-mint);
  box-shadow: inset 0 2px 5px 0 var(--shadow-color);
  color: var(--primary-color);
  border-radius: 15px;
}

.header-menu-link-text {
  white-space: nowrap;
  border-radius: 15px;
  margin-left: 10px;
  font-size: 16px;
}

.header-menu-link-text.selected {
  background-color: var(--light-mint);
}

.header-menu-link-icon {
  border-radius: 15px;
  font-family: Material Icons;
  font-size: 23px;
}

.header-menu-link-icon.selected {
  background-color: var(--light-mint);
}

.header-bg {
  width: 100vw;
  height: 100vh;
  transition: all .2s;
  position: absolute;
  transform: translate(0, -100%);
}

.header-bg.hidden {
  display: none;
}

.header-bg.open {
  z-index: 3;
  transform: translate(0);
}

.scroll-fade {
  background-image: linear-gradient(#fff0, #fff);
  width: 100%;
  height: 25px;
  position: sticky;
  inset: auto 0% -10px;
}

.search-input-header-btn {
  background-color: var(--gray-4);
  color: var(--white);
  white-space: nowrap;
  cursor: pointer;
  border-radius: 15px;
  width: 40.875px;
  margin-left: -5px;
  margin-right: 10px;
  padding-left: 5px;
  padding-right: 5px;
  font-size: 13px;
}

.search-input-header-btn.active {
  border: 1px solid var(--primary-color);
  color: var(--primary-color);
  border-radius: 15px;
  padding-left: 5px;
  padding-right: 5px;
}

.map-popup-wrapper {
  justify-content: center;
  align-items: center;
  display: flex;
}

.map-popup-wrapper.hidden {
  display: none;
}

.map-popup {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.gicon {
  flex-direction: row;
  align-items: center;
  font-family: Material Symbols Rounded, sans-serif;
  display: flex;
}

.event-card-icons-wrapper {
  grid-column-gap: 2px;
  grid-row-gap: 2px;
  align-items: center;
  display: flex;
}

.post-page-back-button {
  color: var(--primary-color);
  cursor: pointer;
  margin-left: 10px;
  padding-top: 10px;
  padding-left: 10px;
  padding-right: 10px;
  font-family: Material Icons;
  font-size: 40px;
  line-height: 50px;
  display: inline-block;
}

.post-page-header {
  color: var(--primary-color);
  text-align: center;
  letter-spacing: -2px;
  font-size: 50px;
  font-weight: 700;
  line-height: 50px;
}

.post-page-back-button-wrapper {
  justify-content: flex-end;
  align-items: center;
  width: 100%;
  display: flex;
}

.post-page-steps-wrapper {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  border-bottom: 1px solid var(--gray-4);
  justify-content: center;
  align-items: center;
  margin-top: 30px;
  margin-bottom: 20px;
  padding: 5px 10px 20px;
  display: flex;
}

.post-page-step-block {
  cursor: pointer;
  align-items: center;
  display: flex;
  position: relative;
}

.post-page-step-number {
  background-color: var(--light-gray);
  color: var(--gray-4);
  border-radius: 10px;
  justify-content: center;
  align-items: center;
  min-width: 40px;
  max-width: 40px;
  min-height: 40px;
  max-height: 40px;
  display: flex;
}

.post-page-step-number.selected {
  background-color: var(--olive-light);
  box-shadow: 0 0 8px 0 var(--olive-light);
  color: var(--white);
}

.post-page-step-text {
  color: var(--gray-4);
  padding-left: 10px;
}

.post-page-step-text.selected {
  color: var(--primary-color);
}

.post-page-body {
  background-color: #fffc;
  flex-direction: column;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  align-items: center;
  width: 100vw;
  height: 100vh;
  min-height: 100vh;
  padding-top: 10px;
  padding-bottom: 76px;
  font-family: Lato, sans-serif;
  display: flex;
  position: absolute;
  inset: 0% auto auto 0%;
  overflow: auto;
}

.post-page-body.hidden {
  display: none;
  overflow: auto;
}

.post-page-body.profile {
  background-color: #fff;
}

.post-page-body.event {
  background-color: #fff;
  margin-top: 60px;
  padding-top: 0;
}

.post-page-form-wrapper {
  width: 600px;
  margin-bottom: 0;
}

.post-page-form-wrapper.hidden {
  display: none;
}

.post-form-title {
  color: var(--primary-color);
  letter-spacing: -2px;
  margin-bottom: 15px;
  font-size: 35px;
  font-weight: 700;
  line-height: 35px;
}

.post-form-step {
  color: var(--gray-4);
  margin-bottom: 0;
  font-size: 13px;
}

.post-form-label {
  color: var(--gray-4);
  font-size: 15px;
  font-weight: 400;
  display: inline-block;
}

.post-form-label.post-input-counter {
  color: var(--cloud);
  padding-left: 10px;
}

.post-form-label-wrapper {
  display: block;
}

.post-text-input {
  box-shadow: inset 0 0 10px 0 var(--shadow-color);
  color: var(--dark-gray);
  border-radius: 20px;
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: 35px;
  margin-bottom: 10px;
  display: flex;
}

.post-text-input.bottom-margin {
  margin-bottom: 20px;
}

.post-text-input.bottom-margin.text-area {
  height: 250px;
}

.post-text-area {
  box-shadow: inset 0 0 10px 0 var(--shadow-color);
  color: var(--dark-gray);
  border-radius: 15px;
  flex-direction: column;
  align-items: center;
  width: 100%;
  min-height: 250px;
  margin-bottom: 20px;
  padding-left: 5px;
  padding-right: 5px;
}

.post-text-area.bottom-margin {
  margin-bottom: 20px;
}

.post-text-area.bottom-margin.text-area {
  height: 250px;
}

.post-border-div {
  border: 1px solid var(--gray-4);
  border-radius: 15px;
  width: 100%;
  height: 280px;
  margin-bottom: 40px;
  overflow: hidden;
}

.post-border-div.image {
  cursor: pointer;
  border-style: dashed;
  border-width: 2px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 200px;
  margin-bottom: 0;
  display: flex;
}

.post-border-div.image.hidden {
  display: none;
}

.temporary-page-spacer {
  height: 50vh;
}

.time-input-wrapper {
  flex-direction: column;
  align-items: flex-start;
  margin-bottom: 20px;
  display: flex;
}

.post-frequency-input-block {
  background-color: var(--white);
  border-radius: 15px;
  align-items: center;
  width: 310px;
  height: 35px;
  display: flex;
  box-shadow: inset 0 0 8px #0003;
}

.post-date-frequesny-input {
  color: var(--gray-4);
  cursor: pointer;
  justify-content: center;
  align-items: center;
  width: 50%;
  height: 100%;
  display: flex;
}

.post-date-frequesny-input.selected {
  background-color: var(--olive-light);
  color: var(--white);
  border-radius: 15px;
}

.post-date-time-box {
  border-radius: 15px;
  min-width: 310px;
  padding-bottom: 10px;
  position: relative;
  box-shadow: 0 0 8px #0003;
}

.post-date-time-box.custom {
  background-color: var(--white);
  margin-top: 40px;
  margin-bottom: 10px;
  padding-bottom: 10px;
}

.post-date-time-box-header {
  background-color: var(--olive-light);
  border-radius: 15px;
  justify-content: space-between;
  align-items: flex-start;
  height: 40px;
  margin-bottom: 5px;
  padding-top: 7.5px;
  padding-left: 10px;
  padding-right: 10px;
  display: flex;
}

.post-date-time-box-header.title-header {
  height: auto;
  padding-top: 5px;
  padding-bottom: 5px;
}

.post-time-input-wrapper {
  padding: 0 10px;
}

.post-time-dropdown-wrapper {
  justify-content: space-around;
  align-items: flex-start;
  max-height: 25px;
  margin-bottom: 10px;
  display: flex;
}

.post-date-time-delete {
  background-color: var(--red-51);
  color: var(--white);
  cursor: pointer;
  border-radius: 20px;
  justify-content: center;
  align-items: center;
  width: 25px;
  height: 25px;
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 15px;
  display: flex;
  position: absolute;
  inset: -10px -10px auto auto;
}

.post-date-time-tab {
  background-color: var(--olive-light);
  color: var(--white);
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  justify-content: center;
  align-items: center;
  width: 65px;
  font-size: 12px;
  display: flex;
  position: absolute;
  inset: -20px auto auto 15px;
}

.post-date-time-add-btn-wrapper {
  justify-content: center;
  align-items: center;
  min-width: 310px;
  max-width: 310px;
  display: flex;
}

.post-date-time-add-btn {
  background-color: var(--blue);
  color: var(--white-80);
  border-radius: 10px;
  padding: 5px 10px;
  font-size: 15px;
  font-weight: 400;
  display: inline-block;
}

.post-date-time-add-btn.post-input-counter {
  color: var(--cloud);
  padding-left: 10px;
}

.post-image-icon {
  color: var(--gray-3);
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 50px;
  line-height: 50px;
}

.post-page-section {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  margin-top: 10px;
  margin-bottom: 10px;
  padding-top: 10px;
  padding-bottom: 10px;
  display: flex;
}

.post-page-section.image {
  border-style: dashed;
  border-width: 2px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 200px;
  display: flex;
}

.post-page-section.hidden {
  display: none;
}

.post-page-footer-navigation {
  z-index: 3;
  border-top: 1px none var(--gray-4);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  justify-content: space-around;
  align-items: center;
  min-width: 750px;
  height: 70px;
  margin-top: 5px;
  padding: 10px;
  display: flex;
  position: fixed;
  inset: auto 0% 0%;
  box-shadow: 0 0 8px #0003;
}

.post-page-form-nav {
  cursor: pointer;
  align-items: center;
  display: flex;
  position: relative;
}

.post-page-form-nav-text {
  border: 1px solid var(--gray-4);
  background-color: var(--primary-color);
  color: var(--white);
  border-radius: 20px;
  justify-content: center;
  align-items: center;
  width: 115px;
  height: 35px;
  padding-right: 35px;
  font-size: 15px;
  display: flex;
}

.post-page-form-nav-text.back {
  background-color: var(--light-gray);
  color: var(--dark-gray);
  padding-left: 35px;
  padding-right: 0;
}

.post-page-form-nav-icon {
  border: 1px solid var(--light-gray);
  background-color: var(--olive-light);
  outline-color: var(--olive-light);
  outline-offset: 0px;
  color: var(--white);
  border-radius: 20px;
  outline-width: 5px;
  outline-style: solid;
  justify-content: center;
  align-items: center;
  min-width: 35px;
  max-width: 35px;
  min-height: 35px;
  max-height: 35px;
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 30px;
  line-height: 30px;
  display: flex;
  position: absolute;
  bottom: auto;
  left: auto;
  right: 0%;
}

.post-page-form-nav-icon.back {
  inset: auto auto auto 0%;
}

.post-step-verified {
  color: var(--primary-color);
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 30px;
  line-height: 30px;
  position: absolute;
  inset: -15px auto auto -15px;
}

.post-agreement {
  border: 1px solid var(--gray-4);
  background-color: var(--white);
  color: var(--dark-gray);
  border-radius: 5px;
  max-width: 610px;
  max-height: 350px;
  padding: 5px;
  overflow: auto;
}

.post-agreement-checkbox-wrapper {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  justify-content: flex-start;
  align-items: center;
  width: 610px;
  margin-top: 10px;
  padding-top: 10px;
  display: flex;
}

.post-agreement-checkbox {
  color: var(--olive-light);
  text-shadow: 2px 2px 4px var(--dark-gray);
  cursor: pointer;
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 30px;
  font-weight: 400;
  line-height: 30px;
}

.post-agreement-checkbox-text {
  color: var(--primary-color);
  font-size: 16px;
  font-weight: 700;
}

.post-image-upload-wrapper {
  border: 1px solid var(--gray-4);
  border-radius: 15px;
  justify-content: center;
  align-items: center;
  min-height: 300px;
  margin-bottom: 20px;
  padding: 40px;
  display: flex;
}

.post-image-upload-wrapper.imagebg {
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/img/background-image.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
}

.image-upload-cancel-btn-wrapper {
  justify-content: center;
  align-items: center;
  width: 100%;
  margin-bottom: 20px;
  display: flex;
}

.post-page-image-upload-cancel-btn {
  background-color: var(--red-51);
  color: var(--white);
  border-radius: 10px;
  padding: 5px 10px;
  font-size: 15px;
  font-weight: 400;
  display: inline-block;
}

.post-page-image-upload-cancel-btn.post-input-counter {
  color: var(--cloud);
  padding-left: 10px;
}

.event-page-cover-image {
  background-image: url('../images/pattern9.svg');
  background-position: 50%;
  background-size: cover;
  border-bottom-right-radius: 15px;
  border-bottom-left-radius: 15px;
  justify-content: center;
  align-items: flex-end;
  width: 100%;
  height: 405px;
  min-height: 320px;
  display: flex;
  position: relative;
}

.event-page-profile-image {
  border: 1px solid var(--white);
  background-color: #fff;
  background-image: url('../images/profile.png');
  background-position: 50%;
  background-size: cover;
  border-radius: 250px;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  width: 250px;
  height: 250px;
  display: flex;
}

.event-page-content-flex {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  justify-content: center;
  width: 100%;
  padding-top: 120px;
  padding-left: 5%;
  padding-right: 5%;
  display: flex;
  position: relative;
}

.event-page-detail-section {
  flex-direction: column;
  align-items: flex-start;
  width: 60%;
  min-width: 60%;
  padding-bottom: 40px;
  display: flex;
}

.event-page-title {
  margin-bottom: 10px;
  font-size: 25px;
  line-height: 40px;
}

.event-page-top-content-wrapper {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-end;
  display: flex;
}

.event-page-datetime-wrapper {
  flex-direction: column;
  margin-top: 20px;
  display: flex;
}

.event-page-datetime-wrapper.top-margin {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-direction: column;
  align-items: flex-start;
  margin-top: 5px;
}

.event-page-datetime {
  margin-top: 5px;
  display: flex;
}

.event-page-profile-name {
  color: var(--primary-color);
  cursor: pointer;
  font-size: 18px;
  font-weight: 700;
  line-height: 25px;
}

.event-page-profile-follow-btn {
  background-color: var(--blue);
  color: var(--white);
  text-align: center;
  cursor: pointer;
  border-radius: 15px;
  justify-content: center;
  align-items: center;
  width: 80px;
  padding: 7px 15px 8px;
  font-size: 13px;
  line-height: 12px;
  display: flex;
}

.event-page-profile-follow-btn.interested {
  background-color: var(--gray-4);
  color: var(--white);
  justify-content: center;
  align-items: center;
  width: auto;
  margin-top: 10px;
  padding: 10px 20px;
  font-size: 14px;
  display: flex;
}

.event-page-profile-follow-btn.interested.selected {
  background-color: var(--olive-light);
  color: var(--dark-gray);
  box-shadow: inset 0 2px 5px #0003;
}

.event-page-profile-follow-btn.profile {
  background-color: var(--primary-color);
}

.event-page-profile-follow-btn.red {
  background-color: var(--red-51);
}

.event-page-categories-wrapper {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  display: flex;
}

.event-page-category-box {
  border: 1px solid var(--primary-color);
  border-radius: 5px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding-left: 5px;
  padding-right: 5px;
  display: flex;
}

.event-page-category-icon {
  color: var(--primary-color);
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 35px;
  line-height: 40px;
}

.event-page-category-text {
  color: var(--primary-color);
  font-size: 13px;
}

.event-page-description {
  margin-top: 20px;
}

.event-page-right-section {
  grid-column-gap: 25px;
  grid-row-gap: 25px;
  flex-direction: column;
  align-items: center;
  width: 30%;
  padding-top: 40px;
  padding-left: 10px;
  padding-right: 10px;
  display: flex;
}

.event-page-right-section.hidden {
  display: none;
}

.event-page-map {
  border: 1px solid var(--primary-color);
  border-radius: 15px;
  width: 100%;
  height: 220px;
}

.event-page-location-icon {
  color: var(--primary-color);
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 25px;
}

.event-page-location-text {
  color: var(--blue);
  cursor: pointer;
}

.event-page-location-wrapper {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  align-items: center;
  margin-top: 10px;
  margin-bottom: 10px;
  display: flex;
}

.event-page-link-btn {
  background-color: var(--olive-light);
  color: var(--primary-color);
  text-align: center;
  cursor: pointer;
  border-radius: 15px;
  justify-content: center;
  align-items: center;
  width: 100%;
  margin-top: 10px;
  padding-top: 10px;
  padding-bottom: 10px;
  display: none;
}

.event-page-link-btn.hidden {
  display: none;
}

.event-page-back-button {
  border: 1px solid var(--olive-light);
  background-color: var(--white);
  color: var(--primary-color);
  cursor: pointer;
  border-radius: 50px;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  font-family: Material Icons;
  font-size: 35px;
  display: flex;
  position: fixed;
  inset: 70px auto auto 10px;
  overflow: auto;
}

.event-page-image-max-btn {
  border: 1px solid var(--olive-light);
  background-color: var(--white);
  color: var(--primary-color);
  cursor: pointer;
  border-radius: 50px;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 35px;
  display: flex;
  position: absolute;
  inset: auto 10px 10px auto;
  overflow: auto;
}

.event-page-image-max-btn.close {
  position: static;
}

.utility-page-wrap {
  justify-content: center;
  align-items: center;
  width: 100vw;
  max-width: 100%;
  height: 100vh;
  max-height: 100%;
  display: flex;
}

.utility-page-content {
  text-align: center;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

._404header {
  color: var(--primary-color);
  margin-top: 0;
  margin-bottom: 0;
  font-family: Lato, sans-serif;
  font-size: 25px;
}

._404header.big {
  color: var(--light-mint);
  -webkit-text-stroke-width: 5px;
  -webkit-text-stroke-color: var(--gray-4);
  -webkit-text-fill-color: transparent;
  background-image: url('../images/Icon-Grid.svg');
  background-position: 50%;
  background-size: 700px;
  -webkit-background-clip: text;
  background-clip: text;
  font-size: 500px;
  font-weight: 900;
  line-height: 500px;
}

._404header.big.hidden {
  display: none;
}

._404-text {
  color: var(--primary-color);
  letter-spacing: -1px;
  font-family: Lato, sans-serif;
  font-size: 35px;
  font-weight: 400;
  line-height: 40px;
}

.page-not-found {
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
  position: absolute;
  overflow: hidden;
}

._404image {
  z-index: -1;
  width: 100vw;
  max-width: none;
  height: 100vh;
  position: absolute;
  inset: auto auto 0% 0%;
}

._404content-wrapper {
  border-radius: 15px;
  padding-left: 20px;
  padding-right: 20px;
  line-height: 14px;
}

._404-icon {
  font-family: Material Icons;
  font-size: 400px;
}

.color-sample {
  background-color: var(--olive-light);
  width: 200px;
  height: 200px;
}

._404-iamge {
  background-image: url('../images/404.svg');
  background-position: 50% 100%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 100%;
  height: 50%;
}

._404-image {
  width: 800px;
  max-width: none;
}

._404-image.hidden {
  display: none;
}

.star-icon {
  margin-right: 5px;
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 15px;
}

.star-icon.selected {
  color: var(--yellow);
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: var(--dark-gray);
}

.event-page-profile-image-wrapper {
  position: relative;
  bottom: -30px;
}

.event-page-profile-btns-wrapper {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  margin-top: 5px;
  display: flex;
}

.event-page-profile-info {
  z-index: 1;
  flex-direction: column;
  align-items: center;
  display: flex;
  position: absolute;
  inset: auto 0% -60px;
}

.loading-wrapper {
  z-index: 50;
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  background-color: #fffc;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
  position: fixed;
  inset: 0% auto auto 0%;
}

.loading-bg-test {
  background-image: url('../images/pattern8.svg');
  background-position: 0 0;
  background-size: auto;
}

.mobile-search-menu {
  display: none;
}

.header-wrapper {
  z-index: 5;
  background-color: var(--white);
  flex-direction: row;
  justify-content: space-between;
  width: 100%;
  display: flex;
  position: relative;
}

.mobile-nav, .mobile-nave-menu-wrapper {
  display: none;
}

.profile-left-side-btn {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  border: 1px solid var(--light-mint);
  color: var(--gray-3);
  cursor: pointer;
  border-radius: 15px;
  align-items: flex-start;
  width: 100%;
  margin-bottom: 5px;
  padding: 2.5px 5px;
  display: flex;
}

.profile-left-side-btn.selected {
  background-color: var(--light-mint);
  box-shadow: inset 0 2px 5px 0 var(--shadow-color);
  color: var(--primary-color);
  border-style: none;
  border-radius: 15px;
}

.profile-left-side-btn-icon {
  border-radius: 15px;
  padding-left: 10px;
  padding-right: 10px;
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 20px;
}

.profile-left-side-btn-icon.selected {
  background-color: var(--light-mint);
}

.profile-left-side-btn-text {
  white-space: nowrap;
  border-radius: 15px;
  margin-left: 5px;
  padding-right: 5px;
  font-size: 15px;
  line-height: 20px;
}

.profile-left-side-btn-text.selected {
  background-color: var(--light-mint);
}

.profile-cover-area {
  z-index: 0;
  background-image: url('../images/sun-tornado.svg');
  background-position: 50%;
  background-size: cover;
  width: 100%;
  height: 300px;
  min-height: 300px;
  max-height: 300px;
  position: relative;
  top: 0;
  left: 0;
  overflow: visible;
}

.profile-right-area {
  flex-direction: column;
  place-content: center flex-start;
  align-items: center;
  width: 100%;
  min-height: 100vh;
  padding-bottom: 70px;
  display: flex;
}

.profile-right-area.profile {
  background-color: #fffc;
  height: 100vh;
  overflow: auto;
}

.profile-cover-upload-btn {
  z-index: 1;
  border: 2px solid var(--white);
  background-color: var(--blue);
  color: var(--white);
  cursor: pointer;
  border-radius: 40px;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 25px;
  display: flex;
  position: absolute;
  inset: auto 30px -20px auto;
}

.profile-preview-btn {
  background-color: var(--primary-color);
  color: var(--white);
  cursor: pointer;
  border-radius: 40px;
  justify-content: center;
  align-items: center;
  margin-top: 10px;
  padding: 5px 15px;
  font-family: Lato, sans-serif;
  font-size: 16px;
  line-height: 20px;
  display: flex;
}

.profile-preview-btn.blue {
  background-color: var(--blue);
}

.profile-head-wrapper {
  flex-direction: column;
  align-items: center;
  display: flex;
  position: relative;
  top: -160px;
}

.profile-page-image {
  border: 3px solid var(--white);
  color: var(--white);
  background-color: #fff;
  background-image: url('../images/profile.png');
  background-position: 50%;
  background-size: cover;
  border-radius: 200px;
  justify-content: center;
  align-items: center;
  width: 200px;
  height: 200px;
  font-size: 100px;
  display: flex;
  position: relative;
}

.profile-page-name {
  color: var(--dark-gray);
  text-align: center;
  font-size: 25px;
  font-weight: 400;
  line-height: 35px;
}

.profile-image-upload-btn {
  border: 2px solid var(--white);
  background-color: var(--blue);
  color: var(--white);
  cursor: pointer;
  border-radius: 40px;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 25px;
  display: flex;
  position: absolute;
  inset: auto 5px 10px auto;
}

.profle-page-tiny-details-wrapper {
  grid-column-gap: 50px;
  grid-row-gap: 50px;
  border-bottom: 1px solid var(--gray-4);
  margin-top: 15px;
  padding-bottom: 5px;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
}

.profile-page-tiny-details {
  color: var(--primary-color);
  align-items: center;
  font-size: 15px;
  font-weight: 300;
  display: flex;
}

.bold {
  margin-right: 5px;
  font-weight: 700;
}

.profile-tiny-details-icon {
  margin-right: 5px;
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 20px;
}

.profile-page-section {
  flex-direction: column;
  align-items: center;
  width: 100%;
  margin-bottom: 20px;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
  position: relative;
  top: -140px;
}

.profile-page-section.hidden {
  display: none;
}

.profile-page-section-title {
  background-color: var(--light-mint);
  color: var(--dark-gray);
  letter-spacing: .5px;
  border-radius: 15px;
  width: 80%;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 10px;
  font-size: 30px;
  line-height: 35px;
}

.profile-page-section-title.empty {
  color: var(--gray-4);
  text-align: center;
  font-size: 20px;
}

.profile-page-section-title.left-mark {
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 5px;
}

.profile-page-section-title.left-mark.no-bg {
  background-color: #fff0;
  padding-top: 2.5px;
  padding-bottom: 2.5px;
}

.oval-content-container {
  border: 1px solid var(--gray-4);
  background-color: var(--white);
  border-radius: 15px;
  flex-direction: column;
  justify-content: center;
  align-items: stretch;
  width: 80%;
  min-height: 200px;
  margin-top: 5px;
  margin-bottom: 20px;
  padding: 10px;
  display: flex;
  position: relative;
}

.oval-content-container.contact {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-direction: row;
  justify-content: flex-start;
  align-items: stretch;
  min-height: auto;
  display: flex;
}

.oval-content-container.profile-setting-action {
  justify-content: flex-start;
  align-items: center;
  min-height: auto;
  padding-top: 20px;
  padding-bottom: 20px;
}

.oval-content-container.profile-setting-action.gray {
  background-color: var(--light-gray);
}

.oval-content-container.top-center-wrap {
  justify-content: center;
  align-items: center;
  min-height: 50px;
}

.oval-content-container.top-center-wrap.gray-bg {
  background-color: var(--light-gray);
}

.oval-content-container.top-center-wrap.dark {
  background-color: var(--dark-gray);
  color: var(--white);
}

.temp-profile-icon {
  cursor: default;
  font-family: Material Symbols Rounded, sans-serif;
  line-height: 100px;
}

.empty-profile-wrapper {
  background-color: var(--white);
  border-radius: 15px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  min-height: 100%;
  display: flex;
  position: absolute;
  top: 0;
  left: 0;
}

.empty-profile-wrapper.hidden {
  display: none;
}

.edit-profile-btn {
  background-color: var(--blue);
  color: var(--white);
  cursor: pointer;
  border-radius: 51px;
  justify-content: center;
  align-items: center;
  width: 160px;
  padding-top: 10px;
  padding-bottom: 10px;
  font-size: 18px;
  display: flex;
}

.edit-profile-btn.cancel {
  background-color: var(--dark-gray);
}

.profile-edit-actions-wrapper {
  justify-content: space-around;
  width: 100%;
  margin-top: 20px;
  margin-bottom: 20px;
  display: flex;
}

.profile-edit-actions-wrapper.hidden {
  display: none;
}

.page-profile-label {
  background-color: var(--olive-light);
  color: var(--primary-color);
  text-align: left;
  letter-spacing: .2px;
  width: 125px;
  height: 100%;
  padding: 5px 5px 5px 20px;
  font-size: 18px;
  line-height: 30px;
}

.page-profile-value {
  color: var(--dark-gray);
  letter-spacing: .2px;
  font-size: 16px;
  line-height: 18px;
}

.page-profile-value.empty {
  color: var(--gray-4);
}

.page-profile-value.padding {
  padding-top: 5px;
  padding-bottom: 5px;
}

.page-profile-value.warning {
  color: var(--red-50);
  letter-spacing: 0;
  font-size: 12px;
  line-height: 12px;
}

.page-profile-value.red {
  color: var(--red-51);
}

.page-profile-value.green {
  color: var(--primary-color);
}

.page-profile-value.blue {
  color: var(--blue);
  cursor: pointer;
}

.profile-content-wrapper {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  background-color: var(--light-mint);
  border-radius: 15px;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  margin-bottom: 10px;
  padding-right: 10px;
  display: flex;
  overflow: hidden;
}

.profile-content-wrapper.no-bg {
  background-color: #fff0;
}

.social-media-input-icon {
  cursor: pointer;
  background-image: url('../images/3225190_app_linkedin_logo_media_popular_icon.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 40px;
  height: 40px;
}

.social-media-input-icon.ig {
  background-image: url('../images/3225191_app_instagram_logo_media_popular_icon.png');
}

.social-media-input-icon.fb {
  background-image: url('../images/3225194_app_facebook_logo_media_popular_icon.png');
}

.social-media-input-wrapper {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  background-color: var(--light-mint);
  border-radius: 15px;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 10px;
  padding: 10px;
  display: flex;
  overflow: hidden;
}

.social-media-input-wrapper.no-bg {
  background-color: #fff0;
}

.temp-design {
  background-image: url('../images/2024-02-06-21_01_04-Window.png');
  background-position: 0%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 300px;
  height: 40px;
}

.input-delete {
  color: var(--red-51);
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 20px;
  line-height: 20px;
  display: flex;
}

.profile-social-media-icons-wrapper {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  padding: 10px;
  display: flex;
}

.profile-contanct-text {
  color: var(--gray-3);
}

.profile-contanct-text.address {
  color: var(--blue);
  cursor: pointer;
}

.profile-contanct-text.empty {
  color: var(--gray-4);
}

.profile-contact-text-column {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex-direction: column;
  display: flex;
}

.profile-page-back-btn {
  background-color: var(--white);
  color: var(--primary-color);
  cursor: pointer;
  border-radius: 50px;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  font-family: Material Icons;
  font-size: 25px;
  line-height: 25px;
  display: flex;
  position: absolute;
  inset: 70px auto auto 10px;
}

.event-card-profile-loading {
  background-color: #ffffffc7;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: absolute;
  inset: 0% auto auto 0%;
}

.event-card-profile-loading.hidden {
  display: none;
}

.profile-page-selection-btn {
  color: var(--gray-3);
  cursor: pointer;
  border-radius: 15px 15px 0 0;
  justify-content: center;
  align-items: center;
  padding: 10px 20px;
  font-size: 14px;
  display: flex;
  box-shadow: 0 -2px 8px #0003;
}

.profile-page-selection-btn.cancel {
  background-color: var(--dark-gray);
}

.profile-page-selection-btn.selected {
  background-color: var(--light-mint);
  color: var(--dark-gray);
}

.profile-tab-btns-wrapper {
  grid-column-gap: 15px;
  grid-row-gap: 15px;
  justify-content: flex-start;
  width: 100%;
  margin-top: 20px;
  padding-left: 20px;
  display: flex;
}

.profile-tab-btns-wrapper.hidden {
  display: none;
}

.profile-section-tab-wrapper {
  width: 100%;
  min-height: 80px;
  margin-top: 20px;
  padding-left: 20px;
  padding-right: 20px;
}

.profile-post-tab {
  grid-column-gap: 15px;
  grid-row-gap: 15px;
  border-radius: 15px;
  flex-wrap: wrap;
  justify-content: center;
  width: 100%;
  min-height: 80px;
  padding: 20px 10px;
  display: flex;
  box-shadow: 0 0 8px #0003;
}

.profile-empty-section {
  color: var(--gray-4);
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100px;
  font-size: 18px;
  display: flex;
}

.profile-empty-section.green {
  color: var(--primary-color);
}

.purachase-column {
  max-width: 25%;
  padding-left: 5px;
  padding-right: 5px;
}

.purchase-column-title {
  color: var(--primary-color);
}

.purchase-column-text {
  color: var(--dark-gray);
  word-break: break-all;
  width: 100%;
  font-size: 12px;
}

.purchase-item-container {
  background-color: var(--light-mint);
  border-radius: 15px;
  justify-content: space-between;
  width: 100%;
  margin-top: 10px;
  margin-bottom: 10px;
  padding: 5px;
  display: flex;
}

.use-post-pass {
  background-color: var(--blue);
  color: var(--white);
  cursor: pointer;
  border-radius: 40px;
  justify-content: center;
  align-items: center;
  margin-top: 10px;
  padding: 5px 20px;
  font-family: Lato, sans-serif;
  font-size: 16px;
  font-weight: 300;
  line-height: 20px;
  display: flex;
}

.use-posr-btn-wrapper {
  justify-content: center;
  width: 100%;
  display: flex;
}

.profile-setting-action-paragraph {
  color: var(--dark-gray);
  text-align: left;
  letter-spacing: .2px;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-right: 5px;
  font-size: 18px;
  line-height: 20px;
}

.profile-setting-action-btn {
  background-color: var(--blue);
  color: var(--white);
  cursor: pointer;
  border-radius: 40px;
  justify-content: center;
  align-items: center;
  padding: 5px 40px;
  font-family: Lato, sans-serif;
  font-size: 16px;
  font-weight: 300;
  line-height: 20px;
  display: flex;
}

.profile-setting-action-btn.red {
  background-color: var(--red-51);
}

.profile-setting-action-btn-wrapper {
  margin-top: 10px;
  position: relative;
}

.profile-setting-action-btn-icon {
  color: var(--white);
  align-items: center;
  height: 100%;
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 18px;
  display: flex;
  position: absolute;
  inset: 0% auto auto 10px;
}

.locad-more-btn {
  background-color: var(--blue);
  color: var(--white);
  cursor: pointer;
  border-radius: 40px;
  justify-content: center;
  align-items: center;
  margin-top: 10px;
  padding: 5px 20px;
  font-family: Lato, sans-serif;
  font-size: 16px;
  font-weight: 300;
  line-height: 20px;
  display: flex;
}

.interesting-section {
  grid-column-gap: 60px;
  grid-row-gap: 60px;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 100%;
  margin-bottom: 20px;
  padding: 30px 20px;
  display: flex;
}

.interesting-section.hidden {
  display: none;
}

.interesting-page-wrapper {
  background-color: #fffc;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  min-height: 100vh;
  padding-top: 60px;
  padding-left: 60px;
  padding-right: 60px;
  font-family: Lato, sans-serif;
  display: flex;
}

.interesting-page-nav-btn {
  border: 1px solid var(--gray-4);
  color: var(--dark-gray);
  text-align: center;
  cursor: pointer;
  border-radius: 20px;
  justify-content: center;
  align-items: center;
  width: 200px;
  padding-top: 7.5px;
  padding-bottom: 7.5px;
  font-size: 18px;
  transition: all .2s;
  display: flex;
}

.interesting-page-nav-btn.selected {
  background-color: var(--light-mint);
  box-shadow: inset 0 0 8px 0 var(--shadow-color);
  color: var(--dark-gray);
}

.interested-page-section-title {
  color: var(--gray-4);
  letter-spacing: .5px;
  white-space: nowrap;
  font-size: 30px;
  line-height: 35px;
}

.interested-page-section-title.empty {
  color: var(--gray-4);
  text-align: center;
  font-size: 20px;
}

.interested-page-section-title.left-mark {
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 5px;
}

.interested-page-title-wrapper {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  align-items: center;
  width: 100%;
  margin-bottom: 20px;
  display: flex;
}

.interested-section-title-line {
  border-bottom: 1px solid var(--gray-4);
  width: 100%;
}

.interested-page-section {
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  display: flex;
}

.interested-page-section.hidden {
  display: none;
}

.interested-page-events-wrapper {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  flex-flow: wrap;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  grid-auto-flow: row;
  justify-content: center;
  justify-items: start;
  width: 100%;
  display: flex;
}

.following-profile-image {
  background-image: url('../images/profile.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 150px;
  width: 100px;
  height: 100px;
}

.interested-following-profile-wrapper {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  border: 1px none var(--gray-4);
  cursor: pointer;
  background-color: #fff;
  border-radius: 15px;
  flex-flow: column wrap;
  justify-content: flex-start;
  align-items: center;
  width: 120px;
  padding: 10px;
  display: flex;
  box-shadow: 0 0 5px #0003;
}

.interested-following-name {
  text-align: center;
  font-size: 16px;
}

.interested-page-see-more-wrapper {
  justify-content: center;
  width: 100%;
  display: flex;
}

.interested-page-see-more-btn {
  border: 1px solid var(--blue);
  color: var(--blue);
  cursor: pointer;
  border-radius: 99px;
  margin-top: 5px;
  margin-bottom: 5px;
  padding: 5px 10px;
}

.interested-page-section-wrapper {
  width: 100%;
}

.date-card-title {
  color: var(--white);
  font-weight: 700;
}

.time-input-label-wrapper {
  align-items: center;
  padding-top: 10px;
  padding-bottom: 10px;
  display: flex;
}

.post-form-step-copy {
  color: var(--gray-4);
  font-size: 13px;
}

.after-pm-input {
  background-color: var(--white);
  border-radius: 15px;
  align-items: center;
  width: 200px;
  margin-left: 15px;
  display: flex;
  box-shadow: inset 0 0 8px #0003;
}

.after-midnight-input {
  color: var(--gray-4);
  cursor: pointer;
  justify-content: center;
  align-items: center;
  width: 50%;
  height: 100%;
  font-size: 12px;
  display: flex;
}

.after-midnight-input.selected {
  background-color: var(--olive-light);
  color: var(--white);
  border-radius: 15px;
}

.purchase-close-button-2 {
  color: #fff;
  cursor: pointer;
  background-color: #000;
  border-radius: 50px;
  justify-content: center;
  align-items: center;
  min-width: 35px;
  min-height: 35px;
  font-family: Material Icons;
  display: flex;
  position: absolute;
  inset: -15px -15px auto auto;
}

.paywall-wrapper {
  background-color: #fffc;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  height: 100vh;
  padding-top: 100px;
  display: flex;
  position: relative;
}

.paywall-content {
  z-index: 0;
  background-image: linear-gradient(170deg, #fff0, var(--olive-light));
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  padding-top: 60px;
  padding-bottom: 10px;
  display: flex;
  position: fixed;
  inset: auto 0% 0%;
}

.paywall-logo {
  background-image: url('../images/logo.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 200px;
  height: 60px;
  margin-top: 10px;
}

.benefits-text-2 {
  color: #5a7100;
  max-width: 400px;
  font-size: 16px;
}

.paywall-bg {
  z-index: 0;
  filter: hue-rotate(56deg);
  -webkit-text-fill-color: inherit;
  background-image: url('../images/nicholas-green-nPz8akkUmDI-unsplash.jpg');
  background-position: 50% 100%;
  background-repeat: no-repeat;
  background-size: cover;
  background-clip: border-box;
  width: 100vw;
  height: 100vh;
  position: fixed;
  inset: auto 0% 0%;
}

.paywall-content-wrapper {
  background-image: linear-gradient(#ffffffdb, #ffffffdb), url('../images/pattern11.svg');
  background-position: 0 0, 50%;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
  border-radius: 10px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 10px;
  display: flex;
  position: relative;
  box-shadow: 0 0 20px #0003;
}

.paywall-page-title {
  color: var(--gray-4);
  text-align: center;
  text-shadow: 2px 2px 6px #fff3;
  font-size: 45px;
  line-height: 50px;
}

.paywall-row {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  flex-direction: row;
  justify-content: center;
  width: 100%;
  padding: 60px 10px;
  display: flex;
}

.paywall-plan-card {
  box-shadow: inset -20px -20px 40px 0 var(--light-mint), inset 20px 20px 40px 0 #c9df8f4d, 10px 20px 20px 0 #d6e5ce, -20px -20px 40px 0 #c9df8f70;
  -webkit-backdrop-filter: grayscale(63%) blur(5px);
  backdrop-filter: grayscale(63%) blur(5px);
  cursor: default;
  background-color: #ffffff59;
  border-radius: 90px;
  flex-direction: column;
  align-items: center;
  min-width: 330px;
  max-width: 330px;
  min-height: 580px;
  transition: all .2s;
  display: flex;
  overflow: hidden;
}

.paywall-plan-card.post-pass {
  box-shadow: inset -20px -20px 40px 0 var(--light-mint), inset 20px 20px 40px 0 #c9df8f4d, 10px 20px 30px 0 #d6e5ce, -20px -20px 40px 0 #c9df8f80;
}

.paywall-plan-card.post-pass.open {
  box-shadow: inset -20px -20px 40px #c9df8f80, inset 20px 20px 40px #c9df8f4d, 20px 20px 30px #bccc9080, -20px -20px 40px #c9df8f33;
}

.paywall-plan-card.monthly {
  box-shadow: inset -20px -20px 40px #5a710066, inset 20px 20px 40px #c9df8f4d, 10px 20px 30px #5a710066, -20px -20px 40px #c9df8f33;
}

.paywall-plan-card-title-wrapper {
  background-color: var(--light-mint);
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 100%;
  min-height: 90px;
  max-height: 90px;
  display: flex;
  box-shadow: inset 0 8px 40px #9c9c9c33;
}

.paywall-plan-card-title-wrapper.post-pass {
  background-color: var(--olive-light);
  box-shadow: inset 0 8px 40px #9c9c9c80;
}

.paywall-plan-card-title-wrapper.monthly {
  background-color: var(--primary-color);
  color: var(--white);
  box-shadow: inset 0 8px 40px #616161;
}

.paywall-plan-card-title {
  text-align: center;
  letter-spacing: 1px;
  font-size: 25px;
  line-height: 40px;
}

.paywall-plan-card-paragraph {
  text-align: center;
  margin-top: 10px;
  margin-bottom: 20px;
  padding-left: 10px;
  padding-right: 10px;
  font-size: 17px;
  line-height: 19px;
}

.paywall-plan-card-subtitle {
  text-align: center;
  padding-top: 20px;
  padding-bottom: 10px;
  font-size: 35px;
  font-weight: 700;
  line-height: 40px;
}

.paywall-plan-card-benifits-wrapper {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex-flow: column;
  display: flex;
}

.paywall-plan-card-benifit-row {
  justify-content: flex-start;
  display: flex;
}

.benifit-icon {
  color: var(--olive-light);
  margin-right: 5px;
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 25px;
  font-weight: 400;
}

.benifit-icon.red {
  color: var(--red-51);
}

.benifit-text {
  text-align: center;
  width: 100%;
  font-size: 16px;
  font-weight: 700;
}

.benifit-text.center-align {
  text-align: center;
}

.paywall-plan-card-action-btn {
  background-color: var(--blue);
  color: var(--white);
  text-align: center;
  cursor: pointer;
  border-radius: 50px;
  width: 165px;
  margin-bottom: 50px;
  padding-top: 5px;
  padding-bottom: 5px;
  position: absolute;
  inset: auto auto 0%;
}

.paywall-plan-card-action-btn.cancel-any-time {
  margin-bottom: 0;
  font-size: 14px;
  font-weight: 400;
  position: static;
}

.paywall-plan-card-action-btn.gray {
  background-color: var(--gray-4);
}

.paywall-plan-card-content-wrapper {
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  height: 100%;
  display: flex;
  position: relative;
}

.paywall-plan-card-currency {
  font-size: 25px;
  font-weight: 400;
}

.paywall-back-btn {
  color: var(--primary-color);
  cursor: pointer;
  padding-top: 40px;
  padding-left: 40px;
  font-family: Material Icons;
  font-size: 35px;
  line-height: 35px;
  position: fixed;
  inset: 0% auto auto 0%;
}

.paywall-plan-card-tab {
  background-color: var(--light-mint);
  transform-style: preserve-3d;
  border-top-left-radius: 90px;
  border-top-right-radius: 90px;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 100%;
  min-height: 90px;
  max-height: 90px;
  transition: all .2s;
  display: flex;
  box-shadow: inset 0 8px 40px #9c9c9c33;
}

.paywall-plan-card-tab.post-pass {
  background-color: var(--olive-light);
  box-shadow: inset 0 8px 40px #9c9c9c80;
}

.paywall-plan-card-tab.monthly {
  background-color: var(--primary-color);
  color: var(--white);
  box-shadow: inset 0 8px 40px #616161;
}

.paywall-plan-card-tabs-wrapper {
  display: none;
}

.inbox-bg {
  -webkit-backdrop-filter: blur(7px);
  backdrop-filter: blur(7px);
  background-color: #ffffffa3;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  display: flex;
  position: fixed;
  inset: 0% auto auto 0%;
}

.inbox-bg.hidden {
  display: none;
}

.inbox-wrapper {
  background-color: var(--white);
  border-radius: 15px;
  flex-direction: column;
  align-items: center;
  min-width: 600px;
  max-width: 600px;
  max-height: 70vh;
  display: flex;
  position: relative;
  overflow: hidden;
  box-shadow: 0 0 40px #0003;
}

.inbox-header {
  border-bottom: 1px solid var(--olive-light);
  background-color: var(--olive-light);
  justify-content: space-between;
  width: 100%;
  padding: 10px 10px 10px 20px;
  display: flex;
}

.messages-wraper {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-direction: column;
  width: 100%;
  padding: 20px 10px 55px;
  display: flex;
  position: relative;
  overflow: auto;
}

.inbox-header-text {
  font-size: 18px;
  font-weight: 700;
}

.inbox-header-icon {
  cursor: pointer;
  font-family: Material Icons;
  font-size: 25px;
}

.message-div {
  border-radius: 15px;
  width: 100%;
  box-shadow: 0 0 10px #0003;
}

.message-header {
  background-color: var(--light-gray);
  justify-content: space-between;
  align-items: center;
  padding: 10px 10px 5px;
  display: flex;
}

.message-header.sys {
  background-color: var(--olive-light);
  justify-content: center;
  padding-bottom: 10px;
}

.message-header.new {
  background-color: var(--light-mint);
}

.message-body.sys {
  background-color: var(--light-mint);
  text-align: center;
  flex-direction: column;
  align-items: center;
  display: flex;
}

.message-header-content-wrapper {
  grid-column-gap: 2.5px;
  grid-row-gap: 2.5px;
  flex-direction: column;
  display: flex;
}

.message-header-title {
  font-size: 15px;
  font-weight: 700;
  line-height: 17px;
}

.message-timestamp {
  font-size: 10px;
  line-height: 16px;
}

.message-header-delete {
  color: var(--red-51);
  cursor: pointer;
  font-family: Material Icons;
  font-size: 20px;
}

.message-text {
  margin-bottom: 0;
  padding: 10px;
}

.message-text.empty {
  color: var(--gray-4);
  text-align: center;
  padding-top: 30px;
  padding-bottom: 30px;
}

.message-text.btn {
  background-color: var(--white);
  cursor: pointer;
  border-radius: 20px;
  width: 100px;
  margin-top: 10px;
  margin-bottom: 15px;
  padding-top: 5px;
  padding-bottom: 5px;
  box-shadow: 0 0 8px #0003;
}

.header-notification-icon {
  cursor: pointer;
  font-family: Material Icons;
  font-size: 25px;
}

.header-notification-icon.active {
  color: var(--olive-light);
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: var(--primary-color);
  text-shadow: 0 0 8px var(--gray-4);
  font-family: Material Symbols Rounded, sans-serif;
}

.empty-interested-events {
  color: var(--gray-4);
  margin-bottom: 20px;
  padding-top: 60px;
  padding-bottom: 60px;
  font-size: 25px;
}

.thank-you-page {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  background-image: linear-gradient(#ffffffe6, #ffffffe6), url('../images/pattern6.svg');
  background-position: 0 0, 50%;
  background-size: auto, cover;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-family: Lato, sans-serif;
  display: flex;
}

.thank-you-tester-text.large {
  color: var(--olive-light);
  text-align: center;
  font-size: 80px;
  font-weight: 700;
  line-height: 100px;
}

.thank-you-tester-text.medium {
  color: var(--white);
  text-align: center;
  width: 70%;
  font-size: 30px;
  line-height: 40px;
}

.thank-you-testers-wrapper {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  background-image: linear-gradient(133deg, var(--olive-light), var(--dark-gray));
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.report-dispute {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  background-color: #000000ab;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: absolute;
  inset: 0% auto auto 0%;
}

.report-dispute.hidden {
  display: none;
}

.reported-event-text {
  color: var(--white);
  text-align: center;
  padding-left: 10px;
  padding-right: 10px;
  font-size: 16px;
  line-height: 25px;
}

.reported-event-text.button {
  background-color: var(--blue);
  color: var(--white);
  cursor: pointer;
  border-radius: 50px;
  padding: 5px 10px;
  font-size: 14px;
}

.reported-event-text.button.hidden {
  display: none;
}

.reported-event-text.under-review {
  color: var(--white);
}

.reported-event-text.hidden {
  display: none;
}

.sys-message-bg {
  z-index: 6;
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  background-color: #ffffff8a;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: fixed;
  inset: 0% auto auto 0%;
}

.sys-message-bg.hidden {
  display: none;
}

.sys-message-wrapper {
  border-radius: 15px;
  max-width: 40%;
  overflow: hidden;
}

.notification-icon-wrapper {
  position: relative;
}

.notification-count {
  background-color: var(--red-51);
  color: var(--white);
  text-align: center;
  cursor: pointer;
  border-radius: 15px;
  justify-content: center;
  align-items: center;
  height: 20px;
  padding-left: 5px;
  padding-right: 5px;
  font-family: Lato, sans-serif;
  font-size: 10px;
  line-height: 10px;
  display: flex;
  position: absolute;
  inset: -7px -7px auto auto;
}

.notification-count.active {
  color: var(--olive-light);
  text-shadow: 0 0 5px var(--olive-light);
}

.event-page-full-image {
  z-index: 10;
  background-color: #000c;
  background-image: url('../images/subtle-prism.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  flex-direction: column;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  align-items: center;
  width: 100%;
  height: 100vh;
  min-height: 100vh;
  padding-top: 10px;
  padding-bottom: 76px;
  font-family: Lato, sans-serif;
  display: flex;
  position: fixed;
  inset: 0% auto auto 0%;
  overflow: auto;
}

.event-page-full-image.hidden {
  display: none;
  overflow: auto;
}

.event-page-full-image.profile {
  background-color: #fff;
}

.event-page-full-image-close-btn-wrapper {
  position: absolute;
  inset: 80px 7px auto auto;
}

.install-badge {
  background-color: var(--blue);
  color: var(--white);
  text-shadow: 0 0 9px var(--blue);
  cursor: pointer;
  border-radius: 20px;
  margin-left: 20px;
  padding: 5px 10px;
  font-size: 14px;
  font-weight: 300;
  line-height: 14px;
}

.enable-location-wrapper {
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  background-color: #ffffffb3;
  border-radius: 15px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 40px 20px;
  display: flex;
  box-shadow: 0 0 20px #0003;
}

.enable-location-wrapper.hidden {
  display: none;
}

.enable-location-wrapper.green-bg {
  background-color: var(--light-mint);
}

.enable-location-header {
  color: var(--dark-gray);
  text-align: center;
  margin-bottom: 20px;
  font-size: 16px;
}

.enable-location-body-text {
  color: var(--gray-3);
  text-align: center;
  margin-bottom: 5px;
}

.allow-location-button {
  background-color: var(--blue);
  color: var(--white);
  cursor: pointer;
  border-radius: 20px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-top: 10px;
  margin-bottom: 10px;
  padding: 5px 10px;
  display: flex;
}

.edit-card-btn {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  background-color: var(--blue);
  color: var(--white);
  cursor: pointer;
  border-radius: 20px;
  justify-content: space-between;
  align-items: center;
  padding: 2.5px 10px;
  display: flex;
}

.edit-card-btn.hidden {
  display: none;
}

.post-page-form-nav-wrapper {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.inbox-delete-btns-wrapper {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-direction: column;
  align-items: flex-end;
  width: 100%;
  padding: 10px 10px 0;
  display: flex;
}

.inbox-delete-all-btn {
  background-color: var(--red-51);
  color: var(--white);
  text-align: center;
  cursor: pointer;
  border-radius: 20px;
  justify-content: center;
  align-items: center;
  width: 110px;
  padding: 10px 20px;
  font-size: 12px;
  line-height: 12px;
  display: flex;
}

.inbox-delete-all-btn.interested {
  background-color: var(--gray-4);
  color: var(--white);
  justify-content: center;
  align-items: center;
  padding: 10px 20px;
  font-size: 14px;
  display: flex;
}

.inbox-delete-all-btn.interested.selected {
  background-color: var(--olive-light);
  color: var(--dark-gray);
  box-shadow: inset 0 2px 5px #0003;
}

.inbox-delete-all-btn.profile {
  background-color: var(--primary-color);
  color: var(--white);
}

.inbox-delete-all-btn.red {
  background-color: var(--red-51);
}

.inbox-delete-all-btn.cancel {
  background-color: var(--gray-4);
}

.inbox-delete-all-btn.small {
  width: auto;
  padding: 5px 10px;
}

.inbox-delete-all-btn.small.gray {
  background-color: var(--cloud);
}

.inbox-delete-all-btn.small.hidden {
  display: none;
}

.inbox-delete-all-btn.gray {
  background-color: var(--gray-4);
}

.ibox-delete-all-message {
  font-size: 16px;
}

.inbox-cancel-delete-all-wrapper {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  color: var(--white);
  background-color: #000000a1;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 10px;
  display: flex;
  position: absolute;
  inset: 0% auto auto 0%;
}

.inbox-cancel-delete-all-wrapper.hidden {
  display: none;
}

.inbox-delete-all-confirmation-btns-wrapper {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  justify-content: center;
  display: flex;
}

.inbox-header-title-wrapper {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  align-items: center;
  display: flex;
}

.post-edit-icon {
  font-family: Material Symbols Rounded, sans-serif;
}

.signup-page-wrapper {
  color: var(--dark-gray);
  flex-flow: row;
  min-height: 100vh;
  font-family: Lato, sans-serif;
  display: flex;
}

.signup-page-column {
  background-color: #fffc;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 50%;
  height: auto;
  min-height: 100vh;
  display: flex;
}

.signup-page-column.bg {
  background-image: url('../images/Group.png'), linear-gradient(311deg, #5a7100cc, #e1f5d8cc 54%, #c9df8fcc);
  background-position: 100%, 0 0;
  background-repeat: no-repeat, repeat;
  background-size: auto 100%, auto;
  flex-flow: column;
  justify-content: center;
  align-items: flex-start;
  padding-left: 40px;
  padding-right: 40px;
  display: flex;
  box-shadow: -4px 2px 20px #0003;
}

.signup-page-column.padding {
  padding: 0 20px;
}

.signup-decor {
  background-image: url('../images/Group.png');
  background-position: 100%;
  background-repeat: no-repeat;
  background-size: auto 100%;
  background-attachment: scroll;
  width: 20%;
  height: 100%;
  position: absolute;
  inset: 0% 0% auto auto;
}

.signu-catchphrase {
  color: var(--primary-color);
  text-shadow: 4px 4px 8px #00000075;
  font-size: 75px;
  font-weight: 900;
  line-height: 75px;
}

.signup-slogan {
  color: var(--dark-gray);
  margin-top: 30px;
  font-size: 20px;
  line-height: 25px;
}

.signup-logo {
  background-image: url('../images/256x256.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 100px;
  height: 100px;
}

.signup-welcome-msg {
  color: var(--dark-gray);
  text-align: center;
  margin-top: 10px;
  margin-bottom: 10px;
  font-size: 25px;
  line-height: 30px;
  transition: all .2s;
}

.signup-welcome-msg.hidden {
  opacity: 0;
}

.signup-directions {
  color: var(--gray-4);
  text-align: center;
  margin-top: 10px;
  margin-bottom: 40px;
  font-size: 14px;
  line-height: 30px;
}

.signup-directions.no-space {
  color: var(--dark-gray);
  margin-bottom: 10px;
  line-height: 20px;
}

.signup-directions.error {
  color: var(--red-51);
  margin-bottom: 0;
  line-height: 15px;
}

.signup-directions.error.hidden {
  display: none;
}

.signup-page-form-wrapper {
  width: 100%;
  margin-bottom: 0;
  transition: opacity .2s;
  position: absolute;
  inset: 0% auto auto 0%;
}

.signup-page-form-wrapper.hidden {
  display: none;
}

.signup-button {
  background-color: var(--primary-color);
  color: var(--white);
  text-align: center;
  cursor: pointer;
  border-radius: 20px;
  padding: 10px;
  font-size: 16px;
  text-decoration: none;
}

.signup-button:visited {
  color: var(--dark-gray);
  font-size: 15px;
  text-decoration: none;
}

.signup-button.selected {
  color: var(--primary-color);
  text-shadow: 0 0 10px var(--primary-color);
  font-weight: 700;
}

.signup-button.create {
  background-color: var(--olive-light);
  color: var(--dark-gray);
  cursor: pointer;
  border-radius: 15px;
  justify-content: center;
  align-items: center;
  margin-top: 10px;
  margin-left: 5px;
  margin-right: 5px;
  padding: 7.5px 20px;
  display: flex;
  position: relative;
}

.signup-button.profile {
  color: var(--white);
  background-image: url('../images/profile.png');
  background-position: 50%;
  background-size: cover;
  border-radius: 50px;
  min-width: 50px;
  max-width: 50px;
  min-height: 50px;
  max-height: 50px;
  padding-top: 0;
  padding-bottom: 0;
}

.signup-button.google {
  box-shadow: 0 0 8px 0 var(--shadow-color);
  color: var(--blue);
  background-color: #fff;
  border-radius: 15px;
  margin-bottom: 10px;
  padding: 7.5px 20px;
}

.signup-button.google.blue {
  background-color: var(--blue);
  color: var(--white);
  cursor: pointer;
}

.signup-button.cancel {
  background-color: var(--gray-3);
  margin-top: 10px;
}

.signup-login-btn {
  color: var(--primary-color);
  cursor: pointer;
  font-weight: 700;
}

.google-sign-up-logo {
  background-image: url('../images/unnamed.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 20px;
  height: 20px;
}

.google-sign-up-btn {
  border: 1px solid var(--cloud);
  cursor: pointer;
  border-radius: 50px;
  padding: 10px;
  position: relative;
}

.feedback-btns-wrapper {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  margin-top: 20px;
  display: flex;
}

.grecaptcha-badge {
  opacity: .52;
  visibility: hidden;
}

.map-load-more-btn {
  background-color: var(--blue);
  color: var(--white);
  text-align: center;
  cursor: pointer;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  justify-content: center;
  align-items: center;
  width: 150px;
  padding-top: 2.5px;
  padding-bottom: 2.5px;
  font-weight: 700;
  display: flex;
}

.map-load-more-wrapper {
  z-index: 10;
  justify-content: center;
  align-items: center;
  width: 100%;
  display: flex;
  position: fixed;
  inset: auto 0% 0%;
}

.map-load-more-wrapper.hidden {
  display: none;
}

.body-3 {
  font-family: Lato, sans-serif;
}

.map-head-message {
  background-color: var(--olive-light);
  text-align: center;
  text-transform: capitalize;
  justify-content: center;
  align-items: flex-end;
  height: 110px;
  padding-bottom: 15px;
  font-size: 20px;
  font-weight: 300;
  line-height: 20px;
  display: flex;
}

.map-div {
  background-image: url('../images/map.png');
  background-position: 0 0;
  background-size: contain;
  height: calc(100vh - 110px);
  box-shadow: inset 0 2px 8px #00000094;
}

.profile-nav-tabs-wrapper {
  width: 100%;
}

.profile-nav-tab-text {
  display: none;
}

.event-card-report-icon {
  color: #ec5656;
  align-items: center;
  margin-left: 20px;
  font-family: Material Icons;
  font-size: 20px;
  display: flex;
}

.landing-device-animation {
  background-image: url('../images/test-portrait.png');
  background-position: 50% 0;
  background-repeat: no-repeat;
  background-size: contain;
  width: 30%;
  height: 80vh;
  transform: rotate(9deg);
}

.hero-without-image {
  border-bottom: 1px solid #e4ebf3;
  padding-bottom: 60px;
  padding-left: 30px;
  padding-right: 30px;
  position: relative;
  overflow: hidden;
}

.message-edit-button {
  outline-offset: 0px;
  color: #5a7100;
  cursor: pointer;
  background-color: #fff;
  border-radius: 11px;
  outline: 1px solid #5a7100;
  width: auto;
  padding: 5px 20px;
  font-weight: 700;
  display: inline-block;
}

.message-edit-button.green {
  color: #fff;
  background-color: #5a7100;
}

.event-card-time-icon {
  color: #5a7100;
  justify-content: center;
  align-items: center;
  font-family: Material Icons;
  font-size: 20px;
  line-height: 25px;
  display: flex;
}

.event-card-3d {
  cursor: default;
  mix-blend-mode: normal;
  transform-style: preserve-3d;
  background-color: #fff;
  border-radius: 15px;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  width: 350px;
  min-height: 480px;
  margin: 10px 10px 10px 0;
  padding: 10px;
  display: flex;
  position: relative;
  transform: rotateX(20deg)rotateY(31deg)rotateZ(-20deg);
  box-shadow: 0 2px 5px 3px #00000026;
}

.event-card-3d._3 {
  margin-top: 30px;
  margin-left: -280px;
}

.event-card-3d._1 {
  margin-top: -10px;
  margin-right: -270px;
}

.event-card-poster-div {
  justify-content: flex-end;
  width: 100%;
  display: flex;
}

.pic-zoom-button {
  color: #fff;
  font-family: Material Icons;
  font-size: 30px;
  line-height: 30px;
  position: absolute;
  inset: 5px 5px auto auto;
}

.post-delete-message {
  z-index: 1;
  color: #fff;
  cursor: default;
  background-color: #000000db;
  border-radius: 15px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  padding-left: 10px;
  padding-right: 10px;
  display: flex;
  position: absolute;
  inset: 0% auto auto 0%;
}

.post-delete-message.hidden {
  display: none;
}

.big-picture {
  z-index: 1;
  color: #3b3b3b;
  cursor: default;
  background-color: #fff;
  background-image: url('../images/pexels-rdne-stock-project-6646967.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  border-radius: 15px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: absolute;
  inset: 0% auto auto 0%;
}

.big-picture.hidden {
  background-size: contain;
  display: none;
}

.landing-logo {
  background-image: url('../images/logo.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 20rem;
  height: 5rem;
}

.footer-links-wrapper {
  flex-direction: column;
  align-items: center;
  display: flex;
}

.event-card-favorite-icon {
  color: #595b5c;
  justify-content: center;
  align-items: center;
  width: 30px;
  height: 30px;
  font-size: 25px;
  line-height: 25px;
  display: flex;
}

.event-card-favorite-icon.selected {
  color: #ec5656;
  justify-content: center;
  font-family: Material Icons;
}

._3d-landing {
  perspective: 2000px;
  justify-content: center;
  align-items: center;
  display: flex;
}

.container-2 {
  width: 100%;
  max-width: 940px;
  margin-left: auto;
  margin-right: auto;
}

.report-send-button-2 {
  background-color: #ec5656;
  border-radius: 15px;
  width: 100%;
}

.report-send-button-2.cancel {
  background-color: #595b5c;
  margin-top: 10px;
}

.footer-logo-wrapper {
  background-image: url('../images/g3792.png');
  background-position: 0%;
  background-repeat: no-repeat;
  background-size: auto 35px;
  width: 40px;
  height: 40px;
  margin-right: 10px;
}

.event-card-title-wrapper {
  align-items: center;
  display: flex;
}

.centered-heading {
  color: var(--primary-color);
  text-align: center;
  letter-spacing: -2px;
  margin-bottom: 16px;
}

.event-card-location-text {
  color: #333;
  text-align: left;
  align-items: center;
  margin-left: 10px;
  font-size: 13px;
  font-weight: 700;
  line-height: 13px;
  text-decoration: none;
  display: flex;
}

.event-card-location-text:visited {
  color: #333;
}

.share-links-wrapper {
  grid-column-gap: 10%;
  grid-row-gap: 10%;
  border-radius: 15px;
  justify-content: center;
  align-items: center;
  padding: 10px 5px;
  display: flex;
}

.event-card-time-div {
  align-items: center;
  margin-top: 1px;
  margin-bottom: 1px;
  display: flex;
}

.pic-zoom-close-button-wrapper {
  background-image: linear-gradient(219deg, #000, #fff0 10%);
  width: 100%;
  height: 100%;
}

.post-edit-message {
  z-index: 1;
  color: #3b3b3b;
  cursor: default;
  background-color: #fffffff2;
  border-radius: 15px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: absolute;
  inset: 0% auto auto 0%;
}

.post-edit-message.hidden {
  display: none;
}

.event-card-icon-text {
  font-size: 12px;
  line-height: 15px;
}

.features-table {
  width: 50%;
  padding: 50px 30px;
  position: relative;
}

.event-card-desc {
  text-align: left;
  margin-top: 5px;
  margin-bottom: 5px;
  overflow: hidden;
}

.landing-subtitle {
  text-align: center;
  font-size: 1.3rem;
  line-height: 2rem;
}

.landing-column {
  perspective: 2000px;
  margin-top: 40px;
  display: flex;
}

.landing-column.vertical {
  flex-direction: column;
  align-items: center;
  margin-top: 0;
}

.landing-wrapper {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  perspective: 2000px;
  perspective-origin: 50%;
  background-image: linear-gradient(#ffffffe8, #ffffffe8), url('../images/pattern8.svg');
  background-position: 0 0, 50%;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
  width: 100%;
  overflow: hidden;
  transform: none;
}

.heading-2 {
  color: var(--primary-color);
}

.margin-bottom-24px {
  margin-bottom: 24px;
  font-size: 18px;
  line-height: 25px;
}

.event-card-profile-image {
  background-image: url('../images/profile.png');
  background-position: 50%;
  background-size: contain;
  border-radius: 40px;
  width: 40px;
  height: 40px;
  position: relative;
}

.pic-zoom-close-button {
  color: #fff;
  font-size: 30px;
  line-height: 30px;
  position: absolute;
  inset: 5px 5px auto auto;
}

.feature-event-wrapper {
  perspective: 2000px;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding-top: 40px;
  padding-bottom: 40px;
  font-size: 18px;
  line-height: 25px;
  display: flex;
  overflow: hidden;
}

.centered-subheading {
  text-align: center;
  max-width: 530px;
  margin-left: auto;
  margin-right: auto;
  font-size: 18px;
  line-height: 25px;
}

.mobile-bg {
  display: none;
}

.feature-section {
  position: relative;
  overflow: hidden;
}

.paragraph-link, .paragraph-link:visited {
  color: #3898ec;
}

.hero-wrapper-two {
  text-align: center;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  max-width: 750px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.footer {
  color: #e2f6d9;
  background-color: #1d1c1a;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  width: 100%;
  min-height: 145px;
  padding-top: 20px;
  padding-bottom: 20px;
  display: flex;
  box-shadow: 0 0 20px #0003;
}

.footer.landing {
  overflow: hidden;
}

.landing-heading-bg {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  margin-left: 20px;
  display: flex;
}

.pic-zoom-button-wrapper {
  background-image: linear-gradient(212deg, #000, #fff0 15%);
  width: 100%;
  height: 100%;
}

.share-icon-wrapper {
  width: 50px;
  height: 50px;
}

.event-card-icons-wrapper-2 {
  border-radius: 5px;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  padding: 11px 5px 5px 10px;
  display: flex;
  position: absolute;
  inset: 0% auto auto 0%;
}

.event-card-image {
  background-image: url('../images/arno-smit-qY_yTu7YBT4-unsplash.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 5px;
  width: 100%;
  height: 150px;
  position: relative;
  overflow: hidden;
}

.event-card-image._2 {
  background-image: url('../images/event-image.JPG');
}

.event-card-image._3 {
  background-image: url('../images/pexels-matheus-bertelli-3797402.jpg');
}

.container {
  width: 100%;
  max-width: 940px;
  height: 100%;
  margin-left: auto;
  margin-right: auto;
}

.landing-signup-button {
  background-color: var(--olive-light);
  color: var(--dark-gray);
  text-align: center;
  text-transform: uppercase;
  cursor: pointer;
  border-radius: 20px;
  justify-content: center;
  align-items: center;
  width: 180px;
  height: 50px;
  margin-top: 40px;
  margin-left: 5px;
  margin-right: 5px;
  padding-left: 20px;
  padding-right: 20px;
  font-weight: 600;
  line-height: 14px;
  text-decoration: none;
  display: flex;
}

.landing-signup-button:visited {
  text-decoration: none;
}

.event-card-icon-icon {
  font-family: Material Icons;
  font-size: 25px;
  line-height: 25px;
}

.event-card-poster-name {
  align-items: center;
  margin-left: 10px;
  display: flex;
}

.footer-link {
  color: #e2f6d9;
  margin-bottom: 5px;
  font-size: 16px;
  text-decoration: none;
}

.footer-link:hover, .footer-link:visited {
  color: #e2f6d9;
}

.event-card-header-2 {
  z-index: 1;
  flex-wrap: wrap;
  justify-content: flex-end;
  width: 100%;
  min-height: 30px;
  margin-bottom: 27px;
  display: flex;
  position: relative;
  overflow: hidden;
}

.footer-content-wrapper {
  color: #5f5f5f;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
}

.event-card-icon {
  color: #5a7100;
  border: 1px solid #5a7100;
  border-radius: 5px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-right: 5px;
  padding: 5px 3px;
  display: flex;
}

.event-cart-title {
  color: #5a7100;
  text-align: left;
  margin-top: 5px;
  margin-bottom: 5px;
  margin-right: 10px;
  font-size: 17px;
  font-weight: 700;
  line-height: 17px;
  text-decoration: underline;
}

.event-card-time-text {
  align-items: center;
  margin-left: 10px;
  line-height: 15px;
  display: flex;
}

.profile-setting-btn-wrapper {
  background-color: var(--blue);
  color: var(--white);
  text-align: center;
  cursor: pointer;
  border-radius: 20px;
  flex-flow: row;
  justify-content: center;
  align-items: center;
  min-width: 120px;
  margin-top: 15px;
  padding: 2.5px 35px;
  display: flex;
  position: relative;
}

.profile-setting-btn-wrapper.red-bg {
  background-color: var(--red-51);
}

.profile-setting-btn-wrapper.gray {
  background-color: var(--gray-4);
}

.profile-setting-btn-icon {
  justify-content: center;
  align-items: center;
  padding: 5px 5px 5px 10px;
  font-family: Material Symbols Rounded, sans-serif;
  display: flex;
  position: absolute;
  inset: 0% auto 0% 0%;
}

.account-delete-confirm-btns {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  display: flex;
}

.purchase-small-text {
  font-size: 15px;
  font-weight: 700;
}

.free-trial-text {
  color: var(--primary-color);
  margin-top: -4px;
  margin-bottom: -12px;
  font-size: 15px;
  font-weight: 900;
  line-height: 15px;
  display: block;
}

.one-month-free {
  font-size: 12px;
  font-weight: 400;
  line-height: 17px;
  display: block;
}

.cancel-any-time-wrapper {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  inset: auto 0% 30px;
}

.cancel-any-time {
  font-size: 12px;
  font-weight: 700;
}

.inbox-delete-confirm-wrapper {
  z-index: 1;
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  background-color: #000c;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: absolute;
  inset: 0% auto auto 0%;
}

.inbox-delete-confirm-wrapper.hidden {
  display: none;
}

.inbox-delete-confirm-text {
  color: var(--white);
  text-align: center;
  margin-bottom: 20px;
  font-size: 16px;
}

.admin-header-name {
  justify-content: center;
  align-items: center;
  font-size: 16px;
  font-weight: 700;
  display: flex;
}

.admin-header {
  z-index: 5;
  background-color: var(--olive-light);
  flex-flow: row;
  justify-content: space-between;
  align-items: stretch;
  width: 100%;
  display: flex;
  position: relative;
}

.admin-header-logout {
  color: var(--red-51);
  cursor: pointer;
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 25px;
  line-height: 25px;
}

.admin-action-page {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  padding-top: 100px;
  padding-bottom: 60px;
  font-family: Lato, sans-serif;
  display: flex;
}

.admin-page-title {
  color: var(--gray-4);
  font-size: 35px;
  font-weight: 300;
  line-height: 40px;
}

.admin-menu-btn {
  background-color: var(--primary-color);
  color: var(--white);
  text-align: center;
  cursor: pointer;
  border-radius: 20px;
  width: 100%;
  padding: 5px 15px;
  font-weight: 400;
}

.admin-menu-btn.disabled {
  background-color: var(--gray-4);
  cursor: not-allowed;
}

.admin-menu-wrapper {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.admin-reported-event-box {
  cursor: pointer;
  border-radius: 10px;
  width: 350px;
  overflow: hidden;
  box-shadow: 0 0 8px #0003;
}

.admin-reported-event-box.selected {
  border: 4px solid var(--blue);
}

.admin-report-event-title {
  font-size: 12px;
  font-weight: 700;
  line-height: 15px;
}

.admin-report-event-title.link {
  color: var(--blue);
  margin-bottom: 5px;
}

.admin-report-event-header {
  background-color: var(--light-mint);
  padding: 2.5px 5px;
}

.admin-report-event-header.flagged {
  background-color: var(--red-51);
}

.admin-report-event-header.immune {
  background-color: var(--yellow);
}

.admin-report-count {
  color: var(--red-51);
  font-size: 10px;
  line-height: 12px;
}

.admin-report-count.flagged {
  color: var(--white);
}

.admin-report-body {
  padding-top: 0;
  padding-left: 0;
  padding-right: 2.5px;
  display: flex;
  position: relative;
}

.admin-report-event-image {
  background-image: url('../images/sun-tornado.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  min-width: 100px;
  min-height: 100px;
  display: flex;
}

.admin-report-event-details {
  flex-flow: column;
  justify-content: space-between;
  width: 100%;
  padding: 2.5px 2.5px 2.5px 10px;
  display: flex;
}

.admin-report-event-desc {
  font-size: 12px;
  font-weight: 400;
  line-height: 15px;
}

.admin-report-event-desc-wrapper {
  height: 80px;
  overflow: auto;
}

.admin-report-event-time {
  text-align: right;
  margin-top: 5px;
  font-size: 12px;
  font-weight: 700;
  line-height: 15px;
}

.admin-report-open-btn {
  background-color: var(--blue);
  color: var(--white);
  text-transform: uppercase;
  border-radius: 201px;
  padding: 2.5px 10px;
  font-size: 12px;
}

.admin-page-back-btn {
  color: var(--primary-color);
  cursor: pointer;
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 35px;
  line-height: 35px;
  position: absolute;
  inset: 75px auto auto 5px;
}

.admin-event-page-section-title {
  background-color: var(--olive-light);
  color: var(--dark-gray);
  text-align: center;
  width: 100%;
  margin-bottom: 20px;
  padding-top: 10px;
  padding-bottom: 10px;
  font-size: 25px;
}

.admin-report-profile-image {
  background-image: url('../images/sun-tornado.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 100px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 50px;
  min-width: 50px;
  max-width: 50px;
  height: 50px;
  min-height: 50px;
  max-height: 50px;
  margin-top: 5px;
  margin-left: 5px;
  display: flex;
}

.admin-report-event-actions-wrapper {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: center;
  margin-bottom: 20px;
  display: flex;
  position: relative;
}

.admin-report-event-action-btn {
  background-color: var(--blue);
  color: var(--white);
  text-shadow: 0 0 9px var(--blue);
  cursor: pointer;
  border-radius: 20px;
  padding: 5px 10px;
  font-size: 14px;
  font-weight: 300;
  line-height: 14px;
}

.admin-report-event-action-btn.gray {
  background-color: var(--gray-3);
  text-shadow: none;
}

.admin-report-event-action-btn.yellow {
  background-color: var(--yellow);
  color: var(--dark-gray);
  text-shadow: none;
}

.admin-report-event-action-btn.yellow.inverse {
  background-color: var(--black);
  color: var(--yellow);
}

.admin-report-event-action-btn.red {
  background-color: var(--red-51);
}

.admin-reported-event-filter-btn {
  border: 1px solid var(--olive-light);
  color: var(--dark-gray);
  text-align: center;
  cursor: pointer;
  border-radius: 20px;
  padding: 5px 10px;
  font-size: 14px;
  font-weight: 400;
  line-height: 14px;
}

.admin-reported-event-filter-btn.gray {
  background-color: var(--gray-3);
  text-shadow: none;
}

.admin-reported-event-filter-btn.yellow {
  background-color: var(--yellow);
  color: var(--dark-gray);
  text-shadow: none;
}

.admin-reported-event-filter-btn.yellow.inverse {
  background-color: var(--black);
  color: var(--yellow);
}

.admin-reported-event-filter-btn.selected {
  background-color: var(--white);
  box-shadow: inset 1px 1px 8px 0 var(--olive-light);
  color: var(--primary-color);
  font-weight: 400;
}

.admin-reported-event-filter-btn.disabled {
  opacity: .28;
}

.admin-msg-user-wrapper {
  z-index: 1;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 50%;
  height: 100%;
  padding-left: 10px;
  padding-right: 10px;
  display: flex;
}

.admin-msg-user-wrapper.hidden {
  display: none;
}

.admin-text-input {
  border-radius: 15px;
}

.admin-text-input.textarea {
  min-height: 100px;
}

.admin-message-input-label {
  text-align: left;
  width: 100%;
  font-size: 16px;
  line-height: 25px;
}

.admin-message-input-label.feedback {
  font-size: 25px;
}

.admin-msg-variable-btns-wrapper {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  margin-top: 10px;
  margin-bottom: 60px;
  display: flex;
}

.admin-msg-username-label {
  text-align: left;
  width: 100%;
  margin-bottom: 10px;
  font-size: 16px;
  line-height: 25px;
}

.admin-msg-username-label.feedback {
  font-size: 25px;
}

.admin-msg-user-detail {
  color: var(--primary-color);
}

.admin-msg-variable-btn {
  background-color: var(--black);
  color: var(--white);
  cursor: pointer;
  border-radius: 20px;
  width: auto;
  padding: 2.5px 20px;
  font-weight: 400;
  display: inline-block;
}

.admin-msg-variable-btn.red {
  color: #fff;
  background-color: #ec5656;
  justify-content: center;
  width: 75px;
  padding-left: 0;
  padding-right: 0;
  display: flex;
}

.admin-msg-send-btn-wrapper {
  grid-column-gap: 100px;
  grid-row-gap: 100px;
  justify-content: center;
  align-items: center;
  width: 100%;
  display: flex;
}

.admin-msg-send-btn {
  background-color: var(--blue);
  text-align: center;
  border-radius: 15px;
  width: 100%;
}

.admin-msg-send-btn.cancel {
  background-color: #595b5c;
}

.admin-msg-send-btn.cancel.feedback {
  background-color: var(--dark-gray);
  margin-top: 0;
}

.admin-msg-send-btn.feedback {
  background-color: var(--primary-color);
  border-radius: 30px;
  width: 150px;
}

.admin-report-action-loading {
  background-color: #ffffffed;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  inset: 0%;
}

.admin-report-action-loading.hidden {
  display: none;
}

.admin-message-user-wrapper {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  width: 100%;
  margin-bottom: 10px;
  display: flex;
}

.admin-message-user-image {
  border: 1px solid var(--olive-light);
  background-image: url('../images/27.svg');
  background-position: 50%;
  background-size: cover;
  border-radius: 100px;
  width: 100px;
  min-width: 100px;
  height: 100px;
  min-height: 100px;
}

.tour-page {
  grid-column-gap: 27px;
  grid-row-gap: 27px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  min-height: 110vh;
  font-family: Lato, sans-serif;
  display: flex;
}

.tour-page-subtitle {
  font-size: 18px;
  line-height: 16px;
}

.tour-page-title {
  color: var(--dark-gray);
  text-align: center;
  font-size: 25px;
  font-weight: 400;
  line-height: 25px;
}

.confirm-all-msg-delete {
  color: #3b3b3b;
  text-align: center;
  cursor: pointer;
  background-color: #fff;
  border-radius: 20px;
  width: 120px;
  padding-top: 5px;
  padding-bottom: 5px;
  font-weight: 700;
  display: inline-block;
}

.confirm-all-msg-delete.red {
  color: #fff;
  background-color: #ec5656;
  justify-content: center;
  display: flex;
}

.inbox-footer {
  z-index: 1;
  border-bottom: 1px solid var(--olive-light);
  background-color: var(--white);
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: 10px 10px 10px 20px;
  display: flex;
  box-shadow: 0 -2px 8px #0003;
}

.post-page-subheader {
  color: var(--blue);
  text-align: center;
  cursor: pointer;
  font-size: 15px;
  font-weight: 400;
  line-height: 30px;
}

.reset-password-wrapper {
  flex-flow: column;
  align-items: center;
  display: flex;
}

.admin-feedback-delete-btn {
  color: var(--red-51);
  text-align: right;
  cursor: pointer;
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 20px;
  position: absolute;
  inset: 5px 5px auto auto;
}

.event-interested-count {
  background-color: var(--white);
  color: var(--primary-color);
  text-align: center;
  border-radius: 20px;
  margin-top: 3px;
  padding: 2px 2px 0;
  font-size: 10px;
  font-weight: 700;
  line-height: 10px;
  position: relative;
}

.event-interested-count.hidden {
  display: none;
}

.event-stats-wrapper {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  border-radius: 10px;
  justify-content: center;
  align-items: center;
  display: flex;
}

.event-stats-wrapper.hidden {
  background-color: #00000080;
  display: none;
}

.event-views-icon {
  color: var(--white);
  font-family: Material Icons;
  font-size: 17px;
  line-height: 17px;
}

.event-views-icon.blue {
  color: var(--blue);
  font-family: Material Symbols Rounded, sans-serif;
}

.event-views-icon.yellow {
  color: var(--yellow);
  font-family: Material Symbols Rounded, sans-serif;
}

.event-views-text {
  font-family: Lato, sans-serif;
  font-size: 12px;
  line-height: 12px;
}

.stats-group {
  flex-flow: column;
  align-items: flex-start;
  display: flex;
  position: absolute;
  left: auto;
  right: 0%;
}

.stats-group.hidden {
  display: none;
}

.interested-number-span {
  margin-left: 5px;
  font-size: 12px;
  font-weight: 700;
}

.event-page-report-btn {
  background-color: var(--red-51);
  color: var(--white);
  text-align: center;
  cursor: pointer;
  border-radius: 100px;
  justify-content: center;
  align-items: center;
  width: 40px;
  min-width: 40px;
  max-width: 40px;
  height: 40px;
  min-height: 40px;
  max-height: 40px;
  padding: 15px;
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 20px;
  line-height: 20px;
  display: flex;
  position: absolute;
  inset: 10px 10px auto auto;
}

.event-page-report-btn.interested {
  background-color: var(--gray-4);
  color: var(--white);
  justify-content: center;
  align-items: center;
  width: auto;
  margin-top: 10px;
  padding: 10px 20px;
  font-size: 14px;
  display: flex;
}

.event-page-report-btn.interested.selected {
  background-color: var(--olive-light);
  color: var(--dark-gray);
  box-shadow: inset 0 2px 5px #0003;
}

.event-page-report-btn.profile {
  background-color: var(--primary-color);
}

.event-page-report-btn.red {
  background-color: var(--red-51);
}

.forgot-password-btn {
  color: var(--dark-gray);
  cursor: pointer;
  margin-top: 20px;
  text-decoration: underline;
}

.login-register-switch {
  box-shadow: inset 0 0 10px 0 var(--shadow-color);
  color: var(--dark-gray);
  border-radius: 20px;
  flex-flow: row;
  justify-content: center;
  align-items: center;
  width: 60%;
  height: 35px;
  margin-top: 10px;
  margin-bottom: 10px;
  padding-top: 10px;
  padding-bottom: 10px;
  transition: all .2s;
  display: flex;
  position: relative;
}

.login-register-switch.bottom-margin {
  margin-bottom: 20px;
}

.login-register-switch.bottom-margin.text-area {
  height: 250px;
}

.login-register-switch.hidden {
  opacity: 0;
  transform-style: preserve-3d;
  transform: scale3d(1, 0, 1);
}

.login-register-switch-button {
  z-index: 1;
  color: var(--primary-color);
  text-align: center;
  cursor: pointer;
  border-radius: 20px;
  justify-content: center;
  align-items: center;
  width: 50%;
  height: 100%;
  padding-left: 10px;
  padding-right: 10px;
  font-size: 16px;
  text-decoration: none;
  display: flex;
  position: relative;
}

.login-register-switch-button:visited {
  color: var(--dark-gray);
  font-size: 15px;
  text-decoration: none;
}

.login-register-switch-button.selected {
  background-color: var(--olive-light);
  color: var(--primary-color);
  text-shadow: 0 0 10px var(--primary-color);
}

.login-register-switch-button.create {
  background-color: var(--olive-light);
  color: var(--dark-gray);
  cursor: pointer;
  border-radius: 15px;
  justify-content: center;
  align-items: center;
  margin-top: 10px;
  margin-left: 5px;
  margin-right: 5px;
  padding: 7.5px 20px;
  display: flex;
  position: relative;
}

.login-register-switch-button.profile {
  color: var(--white);
  background-image: url('../images/profile.png');
  background-position: 50%;
  background-size: cover;
  border-radius: 50px;
  min-width: 50px;
  max-width: 50px;
  min-height: 50px;
  max-height: 50px;
  padding-top: 0;
  padding-bottom: 0;
}

.login-register-switch-button.google {
  box-shadow: 0 0 8px 0 var(--shadow-color);
  color: var(--blue);
  background-color: #fff;
  border-radius: 15px;
  margin-bottom: 10px;
  padding: 7.5px 20px;
}

.login-register-switch-button.google.blue {
  background-color: var(--blue);
  color: var(--white);
  cursor: pointer;
}

.login-register-btn-bg {
  background-color: var(--olive-light);
  border-radius: 151515px;
  width: 50%;
  height: 100%;
  transition: all .2s;
  position: absolute;
  inset: 0% auto auto 0%;
}

.login-register-btn-bg.register {
  transform: translate(100%);
}

.text-block-4 {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: absolute;
  inset: 0% auto auto 0%;
}

.provider-login-btn-text {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  font-size: 15px;
  font-weight: 700;
  display: flex;
  position: absolute;
  inset: 0% auto auto 0%;
}

.login-footer-link {
  color: var(--gray-4);
  text-align: center;
  text-decoration: none;
}

.login-footer-link:visited {
  color: var(--gray-4);
}

.login-footer {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex-flow: column;
  margin-top: 10px;
  display: flex;
}

.register-login-forms-wrapper {
  flex-flow: row;
  justify-content: center;
  align-items: center;
  width: 60%;
  height: 300px;
  display: flex;
  position: relative;
  overflow: hidden;
}

.signup-page-form-wrapper-register {
  width: 100%;
  margin-bottom: 0;
  transition: all .2s;
  position: absolute;
  inset: 0% auto auto 0%;
  transform: translate(-100%);
}

.signup-page-form-wrapper-register.hidden {
  display: none;
}

.signup-page-form-wrapper-register.show {
  transform: translate(0%);
}

.signup-page-form-wrapper-login {
  width: 100%;
  margin-bottom: 0;
  transition: all .2s;
  position: absolute;
  inset: 0% auto auto 0%;
  transform: translate(100%);
}

.signup-page-form-wrapper-login.hidden {
  display: none;
}

.signup-page-form-wrapper-login.show {
  transform: translate(0%);
}

.signup-page-form-wrapper-register-forgot-password {
  width: 100%;
  margin-bottom: 0;
  transition: all .2s;
  position: absolute;
  inset: 0% auto auto 0%;
  transform: translate(0%, 200%);
}

.signup-page-form-wrapper-register-forgot-password.hidden {
  display: none;
}

.signup-page-form-wrapper-register-forgot-password.show {
  transform: translate(0%);
}

.share-bg {
  z-index: 10;
  flex-direction: column;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  min-height: 100vh;
  font-family: Lato, sans-serif;
  transition: all .2s;
  display: flex;
  position: fixed;
  inset: 0% auto auto 0%;
  overflow: auto;
  transform: translate(0, 100%);
}

.share-bg.hidden {
  display: none;
  overflow: auto;
}

.share-bg.profile {
  background-color: #fff;
}

.share-bg.open {
  transform: translate(0);
}

.share-wrapper {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  border: 1px solid var(--primary-color);
  background-color: #f2f3ed;
  border-radius: 30px;
  flex-flow: column;
  padding: 40px 80px;
  display: flex;
  position: relative;
}

.share-wrapper.open {
  opacity: 1;
  transform: translate(0);
}

.share-close-btn {
  text-align: center;
  justify-content: center;
  align-items: center;
  font-family: Material Icons;
  font-size: 30px;
  line-height: 35px;
  display: flex;
  position: absolute;
  inset: 10px 10px auto auto;
}

.share-header {
  color: var(--primary-color);
  text-align: center;
  font-size: 35px;
  line-height: 40px;
}

.share-title {
  text-align: center;
  padding-top: 20px;
  font-size: 16px;
  font-weight: 300;
  line-height: 25px;
}

.share-buttons-wrapper {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  justify-content: center;
  align-items: center;
  padding-top: 0;
  display: flex;
}

.share-button {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.facebook-share-icon {
  background-image: url('../images/3225194_app_facebook_logo_media_popular_icon.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 50px;
  height: 50px;
}

.share-media-name {
  text-align: center;
  padding-top: 5px;
  font-weight: 700;
}

.instagram-share-icon {
  background-image: url('../images/3225191_app_instagram_logo_media_popular_icon.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 50px;
  height: 50px;
}

.x-share-icon {
  background-image: url('../images/twitter-x_1twitter-x.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 50px;
  height: 50px;
}

.whatsapp-share-icon {
  background-image: url('../images/4202050_whatsapp_chat_logo_social_social-media_icon_14202050_whatsapp_chat_logo_social_social media_icon.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 50px;
  height: 50px;
}

.share-btn {
  border: 1px solid var(--primary-color);
  color: var(--primary-color);
  text-align: center;
  cursor: pointer;
  border-radius: 15px;
  justify-content: center;
  align-items: center;
  padding: 7px 15px 8px;
  font-size: 13px;
  line-height: 12px;
  display: flex;
}

.share-btn.interested {
  background-color: var(--gray-4);
  color: var(--white);
  justify-content: center;
  align-items: center;
  width: auto;
  margin-top: 10px;
  padding: 10px 20px;
  font-size: 14px;
  display: flex;
}

.share-btn.interested.selected {
  background-color: var(--olive-light);
  color: var(--dark-gray);
  box-shadow: inset 0 2px 5px #0003;
}

.share-btn.profile {
  background-color: var(--primary-color);
}

.share-btn.red {
  background-color: var(--red-51);
}

.page-cover {
  z-index: 200;
  background-color: var(--white);
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
  position: fixed;
  inset: 0%;
}

.page-cover.hidden {
  display: none;
}

.cover-icon {
  background-image: url('../images/logo.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 300px;
  height: 100px;
}

.device-btn {
  background-color: var(--olive-light);
  color: var(--primary-color);
  border-radius: 99px;
  padding: 10px 30px;
}

.device-btn-icon {
  text-align: center;
  font-family: Material Symbols Rounded, sans-serif;
  font-size: 30px;
}

.device-btn-text {
  text-align: center;
  line-height: 14px;
}

.device-btns-wrapper {
  grid-column-gap: 15px;
  grid-row-gap: 15px;
  flex-flow: column;
  margin-top: 20px;
  display: flex;
}

.device-landing-text {
  text-align: center;
}

.device-landing-text.bold {
  margin-top: 10px;
  margin-right: 0;
}

.event-recurring-badge {
  background-color: var(--light-mint);
  color: var(--primary-color);
  text-align: center;
  border-radius: 99px;
  justify-content: center;
  align-items: center;
  margin-left: 10px;
  padding: 2px 5px;
  font-size: 11px;
  line-height: 11px;
  display: flex;
}

.live-event-animation {
  background-image: url('../images/Ripple1x-1.0s-200px-200px.svg');
  background-position: 0 0;
  background-size: cover;
  width: 25px;
  height: 25px;
}

.live-event-div {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  inset: 0% 0% 0% auto;
}

.text-block-5 {
  color: var(--red-51);
  text-align: center;
  width: 100%;
  font-size: 11px;
  font-weight: 900;
  line-height: 11px;
}

.app-features-bosy {
  z-index: 100;
  background-color: #fff;
  background-image: linear-gradient(#ffffffe6, #ffffffe6), url('../images/pattern9.svg');
  background-position: 0 0, 50%;
  background-size: auto, cover;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  font-family: Lato, sans-serif;
  display: flex;
  position: fixed;
  inset: 0% auto auto 0%;
}

.app-feature-page-title {
  color: var(--primary-color);
  text-shadow: .3px .3px 1.2px var(--primary-color);
  margin-bottom: 20px;
  font-size: 35px;
  font-weight: 700;
  line-height: 40px;
}

.app-features-logo {
  background-image: url('../images/256x256_1.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 80px;
  height: 80px;
  margin-bottom: 10px;
}

.app-features-container {
  grid-column-gap: 25px;
  grid-row-gap: 25px;
  justify-content: center;
  align-items: flex-start;
  display: flex;
}

.app-feature-block {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  max-width: 275px;
  display: flex;
}

.app-feature-card {
  background-color: var(--white);
  perspective: 2000px;
  border-radius: 20px;
  height: 130px;
  position: relative;
  overflow: hidden;
  transform: translate(0);
  box-shadow: 0 0 8px #0003;
}

.app-feature-card.map {
  background-image: url('../images/image-7.png');
}

.app-feature-card.editor {
  background-image: url('../images/image-8.png');
  background-position: 50% 0;
  background-size: cover;
}

.app-feature-text {
  color: var(--dark-gray);
  text-align: center;
  letter-spacing: .3px;
  font-weight: 700;
  line-height: 16px;
}

.app-feature-title {
  background-image: linear-gradient(180deg, white, var(--olive-light));
  color: var(--dark-gray);
  text-align: center;
  justify-content: center;
  align-items: center;
  width: 110px;
  height: 100%;
  padding-top: 5px;
  padding-left: 5px;
  padding-right: 5px;
  font-size: 17px;
  font-weight: 400;
  display: flex;
  position: relative;
  box-shadow: 4px 4px 8px #0003;
}

.app-feature-signup {
  background-color: var(--olive-light);
  color: var(--dark-gray);
  text-align: center;
  letter-spacing: .3px;
  cursor: pointer;
  border-radius: 99px;
  width: 200px;
  padding: 2px 20px;
  box-shadow: 2px 2px 5px #0003;
}

.app-feature-signup.cancel {
  border: 1px solid var(--primary-color);
  background-color: var(--white);
}

.app-feature-signup-wrapper {
  grid-column-gap: 15px;
  grid-row-gap: 15px;
  flex-flow: column;
  margin-top: 10px;
  display: flex;
}

.app-feature-card-image {
  transform-style: preserve-3d;
  background-image: url('../images/image-11.png');
  background-position: 100%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 120%;
  height: 120%;
  position: absolute;
  inset: -10% 0 auto -10%;
  transform: rotateX(30deg)rotateY(15deg)rotateZ(0);
}

.app-feature-card-image.map {
  background-image: url('../images/image-10.png');
  background-position: 0%;
  background-size: cover;
  width: 150%;
  height: 150%;
  top: -20%;
}

.app-feature-card-image.editor {
  background-image: url('../images/image-8-1.png');
  background-position: 0 0;
  width: 150%;
  height: 150%;
  position: absolute;
  top: 1%;
  left: 26%;
}

.show-more-icon {
  margin-right: 2px;
  font-family: Material Symbols Rounded, sans-serif;
  font-weight: 400;
  line-height: 14px;
}

.sociafly-member-ad-wrapper {
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: 10px 20px;
  display: flex;
}

.sociafly-ad-join-btn {
  background-color: var(--blue);
  color: var(--white);
  text-align: center;
  letter-spacing: -.2px;
  cursor: pointer;
  border-radius: 20px;
  width: 100px;
  margin-top: 10px;
  padding-top: 2.5px;
  padding-bottom: 2.5px;
  font-size: 13px;
}

.sociafly-ad-join-btn.full-width {
  width: 100%;
}

.faded-bg {
  background-color: #fffc;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  padding-left: 5px;
  padding-right: 5px;
  display: flex;
  position: absolute;
  inset: 0%;
}

.sign-up-text-link {
  color: var(--blue);
  white-space: nowrap;
  cursor: pointer;
  font-weight: 400;
}

.sign-up-text {
  text-align: center;
  margin-top: 10px;
  font-size: 13px;
  line-height: 14px;
}

.registration-age-verification-wrapper {
  flex-flow: column;
  justify-content: center;
  align-items: stretch;
  padding-top: 10px;
  padding-bottom: 10px;
  display: flex;
}

.age-verification-title {
  color: var(--primary-color);
  text-align: center;
  font-size: 25px;
  font-weight: 900;
  line-height: 30px;
}

.age-verifiation-btns-wrapper {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: space-around;
  align-items: center;
  margin-top: 20px;
  padding-bottom: 0;
  display: flex;
}

.age-btn {
  border: 1px solid var(--olive-light);
  background-color: var(--white);
  color: var(--primary-color);
  text-align: center;
  cursor: pointer;
  border-radius: 20px;
  width: 100%;
  padding: 10px;
  font-size: 16px;
  text-decoration: none;
}

.age-btn:visited {
  color: var(--dark-gray);
  font-size: 15px;
  text-decoration: none;
}

.age-btn.selected {
  color: var(--primary-color);
  text-shadow: 0 0 10px var(--primary-color);
  font-weight: 700;
}

.age-btn.create {
  background-color: var(--olive-light);
  color: var(--dark-gray);
  cursor: pointer;
  border-radius: 15px;
  justify-content: center;
  align-items: center;
  margin-top: 10px;
  margin-left: 5px;
  margin-right: 5px;
  padding: 7.5px 20px;
  display: flex;
  position: relative;
}

.age-btn.profile {
  color: var(--white);
  background-image: url('../images/profile.png');
  background-position: 50%;
  background-size: cover;
  border-radius: 50px;
  min-width: 50px;
  max-width: 50px;
  min-height: 50px;
  max-height: 50px;
  padding-top: 0;
  padding-bottom: 0;
}

.age-btn.google {
  box-shadow: 0 0 8px 0 var(--shadow-color);
  color: var(--blue);
  background-color: #fff;
  border-radius: 15px;
  margin-bottom: 10px;
  padding: 7.5px 20px;
}

.age-btn.google.blue {
  background-color: var(--blue);
  color: var(--white);
  cursor: pointer;
}

.age-btn.cancel {
  background-color: var(--gray-3);
  margin-top: 10px;
}

.age-btn.under {
  border: 1px solid var(--primary-color);
  background-color: var(--white);
  color: var(--primary-color);
}

.age-btn.age-selected {
  background-color: var(--olive-light);
  color: var(--primary-color);
}

.age-btn.next {
  background-color: var(--primary-color);
  color: var(--white);
  border-style: none;
  margin-top: 20px;
}

.age-verification-text {
  text-align: center;
  margin-top: 5px;
  font-size: 18px;
  font-weight: 400;
  line-height: 20px;
}

.age-verification-terms-and-policy {
  color: var(--primary-color);
  text-align: center;
  margin-top: 10px;
  font-size: 14px;
  font-weight: 400;
  line-height: 15px;
}

.age-verification-popup {
  z-index: 110;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  background-color: #fffc;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  inset: 0%;
}

.age-verification-popup.hide {
  display: none;
}

.age-terms-link {
  color: var(--primary-color);
}

.age-terms-link:visited {
  color: var(--primary-color);
  text-decoration: none;
}

@media screen and (max-width: 991px) {
  .search-form.side {
    padding-left: 5px;
    padding-right: 5px;
  }

  .page-right-area {
    justify-content: center;
  }

  .event-card-detail-text {
    font-size: 12px;
  }

  .report-form-block.feedback {
    width: 100%;
  }

  .header-nav-wrapper {
    grid-column-gap: 5px;
    grid-row-gap: 5px;
    padding-left: 5px;
    padding-right: 5px;
  }

  .header-nav-block {
    padding-left: 5px;
    padding-right: 5px;
  }

  .payments-options-box {
    flex-direction: column;
  }

  .register-button {
    padding-left: 5px;
    padding-right: 5px;
  }

  .registration-seperator {
    width: 90%;
  }

  .register-form.side {
    padding-left: 5px;
    padding-right: 5px;
  }

  .post-page-footer-navigation {
    height: 65px;
  }

  .event-page-cover-image {
    min-height: 320px;
  }

  .event-page-profile-image {
    width: 200px;
    height: 200px;
  }

  .event-page-content-flex {
    justify-content: space-between;
    padding-left: 10px;
    padding-right: 10px;
  }

  .event-page-detail-section {
    width: 70%;
  }

  .event-page-top-content-wrapper {
    align-items: flex-end;
  }

  ._404header.big {
    font-size: 390px;
    line-height: 390px;
  }

  ._404-icon {
    font-size: 300px;
  }

  .profile-preview-btn {
    font-size: 14px;
    inset: auto auto -40px 10px;
  }

  .profle-page-tiny-details-wrapper {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    padding-left: 10px;
    padding-right: 10px;
  }

  .profile-page-section-title, .oval-content-container {
    width: 100%;
  }

  .profile-page-selection-btn {
    width: 30%;
    padding-left: 10px;
    padding-right: 10px;
    font-size: 14px;
  }

  .profile-tab-btns-wrapper {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }

  .profile-section-tab-wrapper {
    padding-left: 10px;
    padding-right: 10px;
  }

  .profile-post-tab {
    flex-wrap: wrap;
    justify-content: center;
  }

  .use-post-pass, .profile-setting-action-btn, .locad-more-btn {
    font-size: 14px;
    inset: auto auto -40px 10px;
  }

  .interesting-page-wrapper {
    padding-left: 0;
    padding-right: 0;
  }

  .interested-page-title-wrapper {
    padding-left: 10px;
    padding-right: 10px;
  }

  .paywall-wrapper {
    justify-content: flex-start;
  }

  .paywall-page-title {
    font-size: 35px;
  }

  .paywall-row {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    flex-wrap: wrap;
    padding-left: 40px;
    padding-right: 40px;
  }

  .paywall-plan-card {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    min-width: 100%;
    min-height: 500px;
    display: none;
  }

  .paywall-plan-card.post-pass.hidden {
    display: none;
  }

  .paywall-plan-card.post-pass.open {
    display: flex;
    box-shadow: inset -20px -20px 40px #c9df8f80, inset 20px 20px 40px #c9df8f4d, 20px 20px 30px #b1c48180, -20px -20px 40px #c9df8f33;
  }

  .paywall-plan-card.monthly.hidden {
    display: none;
  }

  .paywall-plan-card.monthly.open {
    display: flex;
  }

  .paywall-plan-card.hidden {
    display: none;
  }

  .paywall-plan-card.open {
    display: flex;
    transform: none;
  }

  .paywall-plan-card.open:hover {
    transform: none;
  }

  .paywall-plan-card-title-wrapper {
    min-height: 90px;
    max-height: 90px;
    display: none;
  }

  .paywall-plan-card-paragraph {
    width: 80%;
  }

  .paywall-plan-card-action-btn {
    width: 140px;
  }

  .paywall-back-btn {
    padding-top: 20px;
  }

  .paywall-plan-card-tab {
    box-shadow: 0 -20px 40px -10px var(--light-mint), inset 0 8px 40px 0 #9c9c9c33;
    cursor: pointer;
    width: 100%;
    min-height: 60px;
    max-height: 90px;
    transition: all .2s;
    display: flex;
  }

  .paywall-plan-card-tab:hover {
    transform: translate(0, -3px)scale3d(1, 1.12, 1);
  }

  .paywall-plan-card-tab.selected {
    background-color: var(--olive-light);
    color: var(--white);
  }

  .paywall-plan-card-tabs-wrapper {
    width: 100%;
    display: flex;
  }

  .thank-you-tester-text.large {
    font-size: 70px;
  }

  .thank-you-tester-text.medium {
    line-height: 35px;
  }

  .sys-message-wrapper {
    max-width: 60%;
  }

  .signup-page-column.bg {
    padding-left: 20px;
    padding-right: 20px;
  }

  .signu-catchphrase {
    font-size: 55px;
    line-height: 60px;
  }

  .signup-slogan {
    font-size: 15px;
    line-height: 20px;
  }

  .signup-logo {
    margin-top: 20px;
  }

  .signup-directions {
    text-align: center;
  }

  .signup-page-form-wrapper {
    width: 90%;
  }

  .signup-button {
    padding-left: 5px;
    padding-right: 5px;
  }

  .google-sign-up-btn {
    margin-bottom: 20px;
  }

  .landing-device-animation {
    background-position: 50%;
    width: 35%;
    transform: rotate(9deg);
  }

  .landing-logo {
    width: 15rem;
  }

  ._3d-landing {
    justify-content: center;
    padding-right: 20px;
  }

  .container-2 {
    max-width: 728px;
  }

  .features-table {
    width: 35%;
    padding-left: 10px;
    padding-right: 10px;
  }

  .landing-subtitle {
    font-size: 1.2rem;
  }

  .feature-event-wrapper {
    position: relative;
  }

  .feature-section {
    justify-content: center;
    align-items: center;
    display: flex;
  }

  .footer {
    padding-bottom: 80px;
  }

  .footer.landing {
    padding-bottom: 20px;
  }

  .landing-heading-bg {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    display: flex;
  }

  .container {
    max-width: 728px;
  }

  .login-register-switch {
    width: 70%;
  }

  .login-register-switch-button {
    padding-left: 5px;
    padding-right: 5px;
  }

  .register-login-forms-wrapper {
    width: 70%;
    min-height: 250px;
  }

  .app-features-bosy {
    background-image: linear-gradient(#fffffff2, #fffffff2), url('../images/pattern9.svg');
    background-position: 0 0, 50%;
    background-size: auto, cover;
    justify-content: flex-start;
    align-items: center;
    padding-top: 10px;
  }

  .app-feature-page-title {
    margin-top: 0;
    margin-bottom: 10px;
    font-size: 25px;
    line-height: 30px;
  }

  .app-features-logo {
    display: none;
  }

  .app-features-container {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
  }

  .app-features-container.hidden {
    display: none;
  }

  .app-feature-block {
    grid-column-gap: 5px;
    grid-row-gap: 5px;
    width: 275px;
    min-width: 275px;
    max-width: 275px;
  }

  .app-feature-card {
    height: 110px;
  }

  .app-feature-text {
    margin-bottom: 0;
    font-size: 12px;
    line-height: 15px;
  }

  .app-feature-title {
    padding-top: 2px;
    font-size: 15px;
    line-height: 17px;
  }

  .app-feature-signup-wrapper {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    margin-top: 15px;
  }

  .age-btn {
    padding-left: 5px;
    padding-right: 5px;
  }
}

@media screen and (max-width: 767px) {
  .header {
    z-index: 2;
  }

  .page-wrapper {
    flex-direction: column;
    align-items: center;
  }

  .page-left-column {
    z-index: 1;
    background-color: var(--white-80);
    -webkit-backdrop-filter: blur(15px);
    backdrop-filter: blur(15px);
    border-radius: 15px;
    width: 90%;
    max-width: 90%;
    height: auto;
    padding-bottom: 20px;
    transition: all .2s;
    position: absolute;
    top: auto;
    bottom: auto;
    overflow: visible;
    transform: translate(0, -100%);
  }

  .page-left-column.hidden {
    display: none;
  }

  .page-left-column.open {
    transition: all .2s;
    top: auto;
    transform: translate(0, 1%);
  }

  .page-left-column.profile {
    flex-direction: row;
    justify-content: space-around;
    align-items: flex-end;
    width: 100%;
    max-width: none;
    height: 130px;
    padding: 60px 5px 5px;
    inset: 0% auto auto 0%;
    transform: translate(0%);
  }

  .drop-down-input {
    max-height: 35px;
  }

  .categories-input-wrapper {
    flex-flow: wrap;
    justify-content: center;
    align-items: center;
    max-width: 100%;
    max-height: 120px;
  }

  .action-button-centered-wrapper {
    margin-top: 20px;
  }

  .page-right-area {
    padding: 120px 10px 70px;
  }

  .report-send-button.feedback {
    width: 100px;
  }

  .message-ok-button {
    margin-bottom: 10px;
  }

  .report-form-block.feedback {
    width: 100%;
  }

  .header-logo {
    width: 35px;
    height: 35px;
  }

  .header-logo-name {
    margin-left: 5px;
    font-size: 15px;
  }

  .header-nav-wrapper {
    padding-left: 20px;
    padding-right: 20px;
  }

  .header-nav-block, .header-nav-block.create, .header-nav-block.profile {
    display: none;
  }

  .mobile-menu-grab-wrapper {
    justify-content: center;
    display: flex;
    position: absolute;
    inset: auto 0% -30px;
  }

  .mobile-search-grab-btn {
    border-bottom: 2px solid var(--primary-color);
    background-color: var(--white-80);
    -webkit-backdrop-filter: blur(15px);
    backdrop-filter: blur(15px);
    color: var(--primary-color);
    cursor: pointer;
    border-bottom-right-radius: 20px;
    border-bottom-left-radius: 20px;
    padding: 5px 25px;
    font-family: Material Symbols Rounded, sans-serif;
    font-size: 20px;
  }

  .product-price {
    font-size: 13px;
  }

  .monthly-badge {
    width: 40%;
  }

  .paywall-footer {
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }

  .registration-logo {
    width: 200px;
  }

  .product-name {
    font-size: 15px;
    line-height: 18px;
  }

  .benefits-box {
    padding-top: 5px;
    padding-bottom: 5px;
  }

  .register-button {
    display: none;
  }

  .register-button.profile, .register-button.google {
    display: block;
  }

  .regitration-input {
    font-size: 14px;
    line-height: 16px;
  }

  .post-page-back-button, .post-page-header {
    font-size: 30px;
    line-height: 30px;
  }

  .post-page-back-button-wrapper {
    position: relative;
  }

  .post-page-steps-wrapper {
    grid-column-gap: 15px;
    grid-row-gap: 15px;
    justify-content: space-around;
    width: 100%;
  }

  .post-page-step-block {
    flex-direction: column;
  }

  .post-page-step-text {
    padding-left: 0;
  }

  .post-page-body {
    padding-bottom: 126px;
  }

  .post-page-body.profile {
    padding-top: 60px;
  }

  .post-page-form-wrapper {
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;
  }

  .post-form-label {
    font-size: 13px;
    line-height: 16px;
  }

  .time-input-wrapper {
    align-items: center;
  }

  .post-page-section {
    padding-left: 10px;
    padding-right: 10px;
  }

  .post-page-footer-navigation {
    min-width: 100%;
    padding-left: 20px;
    padding-right: 20px;
  }

  .post-agreement-checkbox-wrapper {
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;
  }

  .event-page-cover-image {
    min-height: 250px;
    margin-top: 0;
  }

  .event-page-profile-image {
    width: 150px;
    height: 150px;
  }

  .event-page-content-flex {
    flex-direction: column;
    padding-left: 10px;
    padding-right: 10px;
  }

  .event-page-detail-section {
    width: 100%;
  }

  .event-page-title {
    font-size: 18px;
    line-height: 25px;
  }

  .event-page-datetime-wrapper {
    grid-column-gap: 5px;
    grid-row-gap: 5px;
    flex-direction: column;
  }

  .event-page-profile-name {
    font-size: 15px;
  }

  .event-page-profile-follow-btn {
    padding-top: 5px;
    padding-bottom: 6px;
    font-size: 11px;
  }

  .event-page-categories-wrapper {
    grid-column-gap: 5px;
    grid-row-gap: 5px;
    align-items: flex-end;
  }

  .event-page-category-box {
    height: 50px;
    display: flex;
  }

  .event-page-category-icon {
    font-size: 25px;
    line-height: 30px;
  }

  .event-page-category-text {
    line-height: 15px;
  }

  .event-page-description {
    font-size: 12px;
  }

  .event-page-right-section {
    width: 100%;
    margin-bottom: 40px;
  }

  .event-page-back-button, .event-page-image-max-btn {
    width: 30px;
    height: 30px;
    font-size: 20px;
  }

  ._404header.big {
    background-size: 50px;
    font-size: 200px;
    line-height: 200px;
  }

  ._404-text {
    font-size: 35px;
    line-height: 40px;
  }

  ._404-icon {
    font-size: 150px;
  }

  ._404-iamge {
    background-position: 50%;
  }

  .event-page-profile-image-wrapper {
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    width: 100vw;
    display: flex;
  }

  .event-page-profile-info {
    width: 100vw;
    inset: auto 0% -60px;
  }

  .mobile-search-menu {
    justify-content: center;
    transition: all .2s;
    display: flex;
    position: absolute;
    bottom: -90px;
    left: 0;
    right: 0;
  }

  .mobile-search-menu.hide {
    transition: all .2s;
    transform: translate(0, -100vh);
  }

  .mobile-nav {
    z-index: 1;
    grid-column-gap: 5px;
    grid-row-gap: 5px;
    box-shadow: 0 0 15px 0 var(--shadow-color);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    color: var(--white);
    background-color: #5a7100b8;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    justify-content: space-around;
    align-items: center;
    height: 50px;
    display: flex;
    position: fixed;
    inset: auto 0% 0%;
  }

  .mobile-nav-btn {
    color: var(--white);
    cursor: pointer;
    justify-content: center;
    align-items: center;
    width: 35px;
    height: 35px;
    font-family: Material Symbols Rounded, sans-serif;
    font-size: 30px;
    line-height: 30px;
    text-decoration: none;
    display: flex;
  }

  .mobile-nav-btn:visited {
    color: var(--white);
    text-decoration: none;
  }

  .mobile-nav-btn.selected {
    background-color: var(--white);
    color: var(--primary-color);
    border-radius: 50px;
  }

  .mobile-nav-btn.create {
    border-top: 3px solid var(--gray-4);
    background-color: var(--light-mint);
    color: var(--primary-color);
    border-radius: 50px;
    width: 45px;
    height: 45px;
    font-size: 35px;
    line-height: 35px;
    position: relative;
    top: -20px;
  }

  .mobile-nave-menu-wrapper {
    width: 100vw;
    min-height: 70px;
    padding-bottom: 0;
    padding-left: 20px;
    padding-right: 20px;
    transition: all .2s;
    display: block;
    position: fixed;
    inset: auto 0% 0%;
    transform: translate(0, 110%);
  }

  .mobile-nave-menu-wrapper.open {
    transform: translate(0);
  }

  .mobile-nav-menu {
    grid-column-gap: 5px;
    grid-row-gap: 5px;
    background-color: var(--white-80);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    padding: 10px 10px 70px;
    display: flex;
    box-shadow: 0 0 15px #0003;
  }

  .mobile-nave-menu-btn-wrapper {
    justify-content: space-between;
    width: 100%;
    padding-top: 2.5px;
    padding-bottom: 2.5px;
    display: flex;
  }

  .mobile-nave-menu-btn-wrapper.selected {
    background-color: var(--light-mint);
    box-shadow: inset 0 0 10px 0 var(--shadow-color);
    border-radius: 15px;
  }

  .mobile-menu-btn-icon {
    color: var(--dark-gray);
    padding-left: 20px;
    padding-right: 10px;
    font-family: Material Icons;
    font-size: 30px;
    line-height: 30px;
  }

  .mobile-menu-btn-text {
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    display: flex;
  }

  .mobile-nav-menu-logo-wrapper {
    justify-content: center;
    width: 100%;
    padding-top: 2.5px;
    padding-bottom: 2.5px;
    display: flex;
  }

  .mobile-nav-menu-logo-wrapper.selected {
    background-color: var(--light-mint);
    box-shadow: inset 0 0 10px 0 var(--shadow-color);
    border-radius: 15px;
  }

  .mobile-nav-logo {
    width: 50px;
    height: 50px;
  }

  .mobile-nav-install-wrapper {
    justify-content: center;
    width: 100%;
    padding-top: 2.5px;
    padding-bottom: 2.5px;
    display: flex;
  }

  .mobile-nav-install-wrapper.selected {
    background-color: var(--light-mint);
    box-shadow: inset 0 0 10px 0 var(--shadow-color);
    border-radius: 15px;
  }

  .mobile-nav-install-btn {
    background-color: var(--blue);
    color: var(--white);
    cursor: pointer;
    border-radius: 15px;
    padding: 5px 15px;
  }

  .mobile-nav-line {
    border-bottom: 1px solid var(--gray-4);
    justify-content: center;
    width: 100%;
    height: 0;
    margin-top: 5px;
    margin-bottom: 5px;
    padding-top: 0;
    padding-bottom: 0;
    display: flex;
  }

  .mobile-nav-line.selected {
    background-color: var(--light-mint);
    box-shadow: inset 0 0 10px 0 var(--shadow-color);
    border-radius: 15px;
  }

  .mobile-menu-grab-btn {
    background-color: var(--white-80);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    cursor: pointer;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    padding: 5px 10px;
    font-family: Material Icons;
    font-size: 35px;
    box-shadow: 0 0 15px #0003;
  }

  .mobile-menu-grab-btn-wrapper {
    z-index: -1;
    justify-content: center;
    width: 100%;
    display: flex;
    position: absolute;
    inset: -30px 0% auto;
  }

  .profile-left-side-btn {
    border-radius: 100px;
    justify-content: center;
    align-items: center;
    width: 35px;
    height: 35px;
    margin-bottom: 0;
  }

  .profile-left-side-btn.selected {
    border-radius: 50px;
  }

  .profile-left-side-btn-text {
    display: none;
  }

  .profile-cover-area {
    height: 220px;
    min-height: 220px;
    max-height: 220px;
  }

  .profile-right-area {
    padding-top: 100px;
    padding-bottom: 70px;
  }

  .profile-right-area.profile {
    padding-top: 60px;
  }

  .profile-head-wrapper {
    top: -130px;
  }

  .profile-page-image {
    width: 150px;
    height: 150px;
  }

  .profile-page-name {
    font-size: 20px;
  }

  .profile-image-upload-btn {
    right: 0;
  }

  .profile-page-section {
    padding-left: 10px;
    padding-right: 10px;
    top: -120px;
  }

  .profile-page-section-title {
    font-size: 20px;
  }

  .profile-page-section-title.left-mark {
    line-height: 25px;
  }

  .oval-content-container.top-center-wrap.gray-bg {
    background-color: var(--light-gray);
  }

  .edit-profile-btn {
    width: 100px;
    font-size: 14px;
  }

  .page-profile-label {
    font-size: 14px;
  }

  .page-profile-value, .profile-page-selection-btn {
    font-size: 12px;
  }

  .profile-page-selection-btn.selected {
    padding-left: 5px;
    padding-right: 5px;
  }

  .profile-tab-btns-wrapper {
    border-bottom: 1px solid #f0f0f0;
    justify-content: center;
    padding-left: 0;
    display: flex;
  }

  .profile-section-tab-wrapper {
    padding-left: 0;
    padding-right: 0;
  }

  .purachase-column {
    width: 100%;
    max-width: none;
    margin-top: 5px;
    margin-bottom: 5px;
  }

  .purchase-item-container {
    flex-direction: column;
  }

  .profile-setting-action-paragraph {
    font-size: 14px;
  }

  .interesting-section {
    padding: 15px 10px;
    top: -120px;
  }

  .interesting-page-wrapper {
    padding-left: 10px;
    padding-right: 10px;
  }

  .interesting-page-nav-btn {
    width: 150px;
  }

  .interested-page-section-title {
    font-size: 20px;
  }

  .interested-page-section-title.left-mark {
    line-height: 25px;
  }

  .paywall-wrapper {
    padding-top: 70px;
  }

  .benefits-text-2 {
    font-size: 13px;
    line-height: 16px;
  }

  .paywall-page-title {
    font-size: 30px;
  }

  .paywall-plan-card-title {
    font-size: 20px;
  }

  .paywall-plan-card-subtitle {
    font-size: 30px;
  }

  .benifit-text {
    font-size: 13px;
    line-height: 15px;
  }

  .inbox-bg {
    z-index: 5;
  }

  .inbox-wrapper {
    border-radius: 0;
    justify-content: space-between;
    align-items: center;
    min-width: 100vw;
    max-width: 100vw;
    height: 100vh;
    max-height: 100vh;
  }

  .messages-wraper {
    height: 100%;
  }

  .thank-you-tester-text.large {
    font-size: 55px;
    line-height: 80px;
  }

  .thank-you-tester-text.medium {
    width: 85%;
    font-size: 25px;
    line-height: 30px;
  }

  .sys-message-bg {
    z-index: 5;
  }

  .sys-message-wrapper {
    max-width: 70%;
  }

  .event-page-full-image {
    padding-bottom: 126px;
  }

  .event-page-full-image.profile {
    padding-top: 50px;
  }

  .install-badge {
    display: none;
  }

  .inbox-delete-btns-wrapper {
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    width: 100%;
  }

  .inbox-delete-all-btn {
    background-color: var(--red-51);
    font-size: 12px;
  }

  .inbox-delete-all-btn.cancel {
    background-color: var(--gray-4);
  }

  .ibox-delete-all-message {
    text-align: center;
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;
    font-size: 16px;
  }

  .inbox-cancel-delete-all-wrapper {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    flex-direction: column;
    align-items: center;
    display: flex;
  }

  .signup-page-wrapper {
    background-image: url('../images/1689825300142.png');
    background-position: 50%;
    background-size: cover;
    flex-flow: column;
    justify-content: center;
    align-items: center;
  }

  .signup-page-column {
    background-color: var(--white);
    border-radius: 15px;
    width: 90%;
    min-height: 90vh;
    padding: 10px;
  }

  .signup-page-column.bg {
    z-index: -1;
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    grid-template-rows: auto auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    display: none;
    position: absolute;
    inset: 0% auto auto 0%;
  }

  .signup-page-column.padding {
    background-color: #fff;
    padding-top: 20px;
    padding-bottom: 20px;
    box-shadow: 0 0 8px #0003;
  }

  .signup-logo {
    width: 90px;
    height: 90px;
  }

  .signup-welcome-msg {
    font-size: 20px;
    line-height: 25px;
  }

  .signup-page-form-wrapper {
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;
  }

  .signup-button {
    padding-top: 5px;
    padding-bottom: 5px;
    font-size: 15px;
  }

  .signup-button.profile, .signup-button.google {
    display: block;
  }

  .profile-nav-tabs-wrapper {
    flex-flow: column;
    justify-content: center;
    align-items: center;
    display: flex;
  }

  .profile-nav-tab-text {
    text-align: center;
    display: block;
  }

  .landing-device-animation {
    width: 45%;
  }

  .hero-without-image {
    padding-bottom: 60px;
    padding-left: 15px;
    padding-right: 15px;
  }

  .message-edit-button {
    margin-bottom: 10px;
  }

  .event-card-3d {
    justify-content: space-between;
    width: 100%;
    height: 420px;
    min-height: 420px;
    max-height: 420px;
  }

  ._3d-landing {
    flex-flow: wrap-reverse;
    justify-content: center;
    width: 100vw;
    padding-top: 0;
    padding-right: 0;
  }

  .text-block-3 {
    font-size: 12px;
  }

  .centered-heading {
    margin-top: 16px;
    margin-bottom: 5px;
    font-size: 25px;
    line-height: 25px;
  }

  .share-links-wrapper {
    grid-column-gap: 6%;
    grid-row-gap: 6%;
    padding-left: 0;
    padding-right: 0;
  }

  .features-table {
    width: 45%;
    padding: 60px 15px;
  }

  .landing-column {
    align-items: flex-end;
    width: 100%;
    height: 100%;
    margin-top: 0;
    margin-left: 25px;
  }

  .landing-column.vertical {
    justify-content: center;
    margin-left: 0;
    inset: 0% auto auto 0%;
  }

  .margin-bottom-24px {
    font-size: 14px;
    line-height: 20px;
  }

  .feature-event-wrapper {
    background-color: #0000;
    padding: 10px;
  }

  .centered-subheading {
    margin-bottom: 0;
    font-size: 14px;
    line-height: 20px;
  }

  .mobile-bg {
    z-index: -1;
    background-image: linear-gradient(#ffffffe8, #ffffffe8), url('../images/pattern8.svg');
    background-position: 0 0, 50%;
    background-repeat: repeat, no-repeat;
    background-size: auto, cover;
    background-attachment: scroll, fixed;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    display: flex;
    position: fixed;
    inset: 0%;
  }

  .feature-section {
    margin-top: 80px;
  }

  .landing-heading-bg {
    border-radius: 0 0 1000px 1000px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-left: 0;
    padding: 20px 15px 10px;
    display: flex;
  }

  .share-icon-wrapper {
    width: 25px;
    height: 25px;
  }

  .landing-signup-button {
    margin-top: 20px;
    font-size: 12px;
  }

  .footer-link {
    margin-bottom: 10px;
    font-size: 12px;
    line-height: 15px;
  }

  .footer-content-wrapper {
    line-height: 15px;
  }

  .profile-setting-btn-wrapper.red-bg {
    background-color: var(--red-51);
  }

  .admin-header-name {
    font-size: 12px;
  }

  .admin-header-logout {
    font-size: 15px;
  }

  .admin-page-title, .admin-page-back-btn {
    font-size: 25px;
  }

  .admin-msg-user-wrapper {
    width: 90%;
  }

  .admin-msg-variable-btns-wrapper {
    grid-column-gap: 5px;
    grid-row-gap: 5px;
    margin-bottom: 40px;
  }

  .admin-msg-send-btn.feedback {
    width: 100px;
  }

  .tour-page-title {
    font-size: 20px;
  }

  .confirm-all-msg-delete {
    margin-bottom: 10px;
  }

  .post-page-subheader {
    font-size: 12px;
  }

  .event-page-report-btn {
    width: 30px;
    min-width: 30px;
    max-width: 30px;
    height: 30px;
    min-height: 30px;
    max-height: 30px;
    font-size: 15px;
    line-height: 15px;
  }

  .login-register-switch {
    width: 70%;
  }

  .login-register-switch-button {
    padding-top: 5px;
    padding-bottom: 5px;
    font-size: 15px;
  }

  .login-register-switch-button.profile, .login-register-switch-button.google {
    display: block;
  }

  .register-login-forms-wrapper {
    width: 70%;
    min-height: 270px;
  }

  .signup-page-form-wrapper-register, .signup-page-form-wrapper-login, .signup-page-form-wrapper-register-forgot-password {
    padding-left: 10px;
    padding-right: 10px;
  }

  .share-bg {
    background-color: #fff0;
  }

  .share-bg.profile {
    padding-top: 50px;
  }

  .share-wrapper {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    width: 100%;
    padding-bottom: 100px;
    position: absolute;
    inset: auto 0% 0%;
  }

  .share-btn {
    padding-top: 5px;
    padding-bottom: 6px;
    font-size: 11px;
  }

  .app-features-bosy {
    background-image: none;
    background-position: 0 0;
    background-size: auto;
  }

  .app-feature-page-title {
    text-shadow: 0 0 0 var(--primary-color);
  }

  .sociafly-ad-join-btn.full-width {
    max-width: 200px;
  }

  .age-btn {
    padding-top: 5px;
    padding-bottom: 5px;
    font-size: 15px;
  }

  .age-btn.profile, .age-btn.google {
    display: block;
  }
}

@media screen and (max-width: 479px) {
  .search-form {
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;
  }

  .event-card-wrapper {
    width: 100%;
    min-width: 100%;
    max-width: 100%;
  }

  .event-card-detail-text {
    font-size: 12px;
    font-style: normal;
  }

  .post-message-text.feedback {
    padding-left: 10px;
    padding-right: 10px;
    font-size: 20px;
  }

  .form-label-white.seperator {
    white-space: nowrap;
  }

  .header-nav-text {
    font-size: 12px;
  }

  .register-form-wrapper {
    min-width: 95%;
  }

  .registration-page-wrapper {
    background-position: 0 0, 0 0;
  }

  .monthly-badge-wrapper {
    top: -12px;
  }

  .payment-options-div {
    width: 100%;
  }

  .monthly-badge {
    width: 60%;
    padding-top: 2px;
    padding-bottom: 2px;
  }

  .payment-option-wrapper {
    width: 50%;
  }

  .payments-options-box {
    width: 100%;
  }

  .benefits-text {
    line-height: 20px;
  }

  .benefits-box {
    padding-top: 5px;
    padding-bottom: 5px;
  }

  .payment-option {
    width: 95%;
    min-height: 100px;
    margin-left: 0;
    margin-right: 0;
  }

  .form-block {
    width: 95%;
  }

  .registration-seperator {
    width: 100%;
  }

  .register-form {
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;
  }

  .post-page-header {
    margin-top: 20px;
    font-size: 25px;
  }

  .post-page-step-text {
    text-align: center;
    font-size: 13px;
  }

  .post-text-input::placeholder {
    color: var(--gray-4);
  }

  .post-page-section {
    padding-left: 10px;
    padding-right: 10px;
  }

  .event-page-title {
    line-height: 40px;
  }

  .event-page-top-content-wrapper {
    grid-column-gap: 5px;
    grid-row-gap: 5px;
    flex-direction: column-reverse;
    justify-content: center;
    align-items: stretch;
  }

  .event-page-datetime-wrapper.top-margin {
    flex-direction: row;
    align-items: flex-start;
  }

  .event-page-profile-follow-btn.interested {
    width: 124.078px;
  }

  .event-page-category-box {
    height: 55px;
  }

  .event-page-description {
    margin-top: 25px;
    font-size: 13px;
  }

  ._404header.big {
    font-size: 150px;
    line-height: 150px;
  }

  ._404-text {
    font-size: 25px;
  }

  ._404-icon {
    font-size: 120px;
  }

  .event-page-profile-btns-wrapper {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }

  .event-page-profile-info {
    width: 100%;
    padding-top: 10px;
    padding-bottom: 10px;
    bottom: -70px;
  }

  .mobile-nave-menu-wrapper {
    padding-left: 10px;
    padding-right: 10px;
  }

  .mobile-menu-btn-text {
    font-size: 14px;
  }

  .profile-head-wrapper {
    margin-bottom: -60px;
    top: -115px;
  }

  .profile-page-image {
    width: 130px;
    height: 130px;
  }

  .profle-page-tiny-details-wrapper {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    padding-left: 10px;
    padding-right: 10px;
  }

  .profile-page-section {
    top: -50px;
  }

  .profile-page-section-title {
    padding-top: 2.5px;
    padding-bottom: 2.5px;
  }

  .page-profile-label {
    width: 90px;
    font-size: 12px;
  }

  .profile-page-selection-btn {
    text-align: center;
    width: 33%;
    padding-left: 10px;
    padding-right: 10px;
  }

  .profile-post-tab {
    box-shadow: none;
  }

  .interesting-section {
    top: -50px;
  }

  .paywall-content {
    min-height: 60%;
    padding-left: 10px;
    padding-right: 10px;
  }

  .benefits-text-2 {
    font-size: 13px;
  }

  .paywall-page-title {
    font-size: 25px;
  }

  .paywall-row {
    padding-left: 20px;
    padding-right: 20px;
  }

  .paywall-plan-card.post-pass.hidden, .paywall-plan-card.monthly.hidden {
    display: none;
  }

  .paywall-plan-card-title {
    font-size: 14px;
  }

  .paywall-plan-card-paragraph {
    width: 95%;
  }

  .paywall-plan-card-tab {
    border-top-left-radius: 25px;
    border-top-right-radius: 25px;
    min-height: 40px;
  }

  .paywall-plan-card-tabs-wrapper {
    grid-column-gap: 3px;
    grid-row-gap: 3px;
  }

  .thank-you-tester-text.large {
    font-size: 30px;
    line-height: 50px;
  }

  .thank-you-tester-text.medium {
    width: 90%;
    font-size: 18px;
    line-height: 20px;
  }

  .sys-message-wrapper {
    max-width: 95%;
  }

  .install-badge {
    font-size: 12px;
  }

  .inbox-delete-btns-wrapper {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }

  .inbox-delete-all-btn {
    padding: 10px 20px;
  }

  .inbox-delete-all-btn.interested {
    width: 124.078px;
  }

  .signup-page-column.bg {
    border-radius: 0;
  }

  .signup-page-column.padding {
    width: 95%;
    padding-left: 10px;
    padding-right: 10px;
  }

  .google-sign-up-btn {
    background-color: var(--white);
  }

  .profile-nav-tab-text {
    font-size: 12px;
  }

  .landing-device-animation {
    background-color: #0000;
    background-position: 50% 0;
    background-size: cover;
    width: 100%;
    height: 50vh;
    margin-bottom: -11px;
    transform: rotate(0);
  }

  .hero-without-image {
    padding-bottom: 20px;
  }

  .event-card-3d {
    width: 100%;
    height: 480px;
    min-height: 480px;
    max-height: 480px;
  }

  .event-card-3d._1 {
    margin-right: -280px;
  }

  .event-card-3d._2 {
    margin-right: 0;
  }

  .container-2 {
    max-width: none;
  }

  .centered-heading {
    margin-bottom: 5px;
  }

  .features-table {
    background-color: #0000;
    border-bottom-style: none;
    width: 100%;
    padding-top: 0;
    padding-bottom: 0;
  }

  .landing-column, .landing-column.vertical {
    width: 100%;
    margin-left: 0;
    overflow: visible;
  }

  .landing-wrapper {
    width: 100vw;
    overflow: hidden;
  }

  .heading-2 {
    font-size: 35px;
  }

  .feature-event-wrapper {
    flex-direction: column;
    justify-content: flex-end;
    min-height: auto;
    padding: 80px 0 0;
  }

  .centered-subheading {
    margin-bottom: 20px;
  }

  .feature-section {
    margin-top: 40px;
  }

  .container {
    max-width: none;
  }

  .admin-reported-event-box {
    width: 97%;
  }

  .admin-report-event-action-btn, .admin-reported-event-filter-btn {
    font-size: 12px;
  }

  .admin-msg-user-wrapper {
    width: 95%;
  }

  .admin-message-input-label.feedback, .admin-msg-username-label.feedback {
    padding-left: 10px;
    padding-right: 10px;
    font-size: 20px;
  }

  .tour-page {
    padding-left: 10px;
    padding-right: 10px;
  }

  .confirm-all-msg-delete {
    width: 100px;
  }

  .event-page-report-btn.interested {
    width: 124.078px;
  }

  .login-register-switch {
    width: 90%;
    height: 30px;
    padding-top: 5px;
    padding-bottom: 5px;
  }

  .login-register-switch-button {
    padding-top: 0;
    padding-bottom: 0;
    font-size: 13px;
    line-height: 15px;
  }

  .register-login-forms-wrapper {
    width: 90%;
  }

  .share-wrapper {
    padding-left: 10px;
    padding-right: 10px;
  }

  .share-header {
    font-size: 25px;
    line-height: 30px;
  }

  .share-buttons-wrapper {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    flex-flow: wrap;
    justify-content: space-around;
    align-items: stretch;
  }

  .share-media-name {
    color: var(--dark-gray);
  }

  .share-btn.interested {
    width: 124.078px;
  }

  .device-landing-text {
    font-weight: 300;
  }

  .device-landing-text.bold {
    font-weight: 700;
  }

  .age-verification-terms-and-policy {
    line-height: 16px;
  }

  .age-verification-popup {
    padding-left: 15px;
    padding-right: 15px;
  }
}