* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

html,
body {
  width: 100%;
  height: 100%;

}

div {
  font-family: "Inter", sans-serif;
}

.current_location {
  display: flex;
}

body::-webkit-scrollbar {
  display: none;
}
#u_0_1_vG{
  display: none !important;
}
/*  */
/* .profilemail{
  display: flex;
} */
#search_input4:focus::placeholder {
  color:transparent;
}
#search_input:focus::placeholder {
  color:transparent;
}

#search_input1:focus::placeholder {
  color: transparent !important;
}
.share-button:hover{
  color: #cf2c79 !important;
}
.share-button{
  padding: 10px;
  
}
.onclickitup {
  cursor: pointer !important;
}

/* CSS */
.adjustemail {
  display:flex;
}
._5n6h _2pih

.gm-style .gm-style-iw-d button:hover {
  background-color: #fcf3f7 !important;
  border: 1px solid #cf2c79 !important;
  /* color: #CF2C79; */

}
.gm-style .gm-style-iw-d h3,h2{
  font-size: 18px;
}
.gm-style .gm-style-iw-d button {
  margin-left: 20px ;
  margin-right: 20px;
/* 
  height: 30px;
  color: #4f5f6d;
  padding-left: 10px;
  padding-right: 10px;
  border: 1px solid transparent;
  background-color: transparent; */
}

#followCommunity1:hover {
  background-color: #fcf3f7;
}

#followCommunity1 {
  background-color: white;
}

#followCommunity:hover {
  background-color: #fcf3f7;
}

#followCommunity {
  background-color: white;
}

#verifyemailbutton:hover {
  background-color: #fcf3f7;
}

#verifyemailbutton {
  background-color: #fff;
}
.hoverall{
  width: -webkit-fill-available;
  text-align: justify;
}
.gm-style-iw {
  /* background-color: #0075ff !important; */
}

.gm-style-iw-chr {
  height: 10px;
}

.gm-style .gm-style-iw-d {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  overflow: hidden !important;
  margin-bottom: 10px;
  padding: 4px !important;
}

.gm-style .gm-style-iw-c {
  width: 550px !important;
  max-width: 550px !important;
  border: 1px solid #CF2C79 !important;
}

.gm-style-iw {
  width: 500px !important;
  height: auto !important;
  padding: 10px !important;
  border: 1px solid #CF2C79 !important;
}
.dropdown-item:hover {
  background-color: #cf2c79;
  color: white;
}

#fullscreenCarousel {
  height: 800px;
}

#fullscreenCarousel img {
  /* height:auto !important; */
  margin-top: 10px;
  padding: 10%;
  height: 100vh !important;

  width: -webkit-fill-available;

}

.profileimage {
  height: 30px;
  width: 30px;
}

.custom-title-class {
  font-size: 20px;
  color: black;
}

.custom-confirm-button-class {

  color: #cf2c79 !important;
  width: 50px;
  background-color: transparent !important;
}

.custom-deny-button-class {
  color: #cf2c79 !important;
  width: 50px;
  background-color: transparent !important;
}

.custom-deny-button-class {
  width: 50px;

}
.popup{
  display: hidden;
}

.sub {
  color: #4F5F6D;
  font-size: 18px;
}

.swal2-popup {
  width: 95%;
}

/* .svgasbg:hover{
  
  height: 56px;
  color: #0F141A !important;
  align-items: center;
 
  cursor: pointer;
} */
#imageModal {
  z-index: 2000;
  /* Set a higher z-index value for the second modal */
}

.modal-backdrop {
  z-index: 1000;
  /* Adjust the z-index of the modal backdrop if needed */
}

.modal-content {
  margin-top: 50px;
  height: 420px;
}

.top-voice-right-sidebar:hover {
  border-radius: 8px;
  background: var(--Outline-2, #EBEEF0);
}

.svgasbg {
  width: 90%;
  height: 56px;
  border-radius: 44px;
  border: 1px solid var(--Outline-2, #EBEEF0);
  background: var(--US-White, #FFF);
  border-radius: 50px;

  margin-bottom: 0px !important;
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="black"%3E%3Cpath fill-rule="evenodd" clip-rule="evenodd" d="M4.04167 8.45551C4.04167 6.37984 4.79931 4.87733 5.89207 3.88799C6.99689 2.88774 8.48781 2.37369 10 2.3737C11.5122 2.3737 13.0031 2.88776 14.1079 3.88801C15.2007 4.87735 15.9583 6.37986 15.9583 8.45551C15.9583 10.2126 15.2716 11.8321 14.3154 13.2331C13.3595 14.6338 12.1599 15.7777 11.2028 16.5676C10.4917 17.1543 9.50865 17.1544 8.79757 16.5676C7.84039 15.7778 6.64068 14.6338 5.68469 13.2332C4.72842 11.8321 4.04167 10.2126 4.04167 8.45551ZM17.375 8.45551C17.375 6.00442 16.466 4.11186 15.0587 2.83781C13.6636 1.57468 11.8211 0.957036 10 0.957031C8.17885 0.957027 6.33645 1.57466 4.94127 2.83779C3.53403 4.11184 2.625 6.00441 2.625 8.45551C2.625 10.5882 3.45775 12.4834 4.51459 14.0318C5.57171 15.5806 6.8787 16.8209 7.89592 17.6603C9.13051 18.679 10.8699 18.679 12.1044 17.6602C13.1216 16.8209 14.4285 15.5805 15.4856 14.0317C16.5423 12.4833 17.375 10.5882 17.375 8.45551ZM8.20833 8.33206C8.20833 7.34255 9.01049 6.54039 10 6.54039C10.9895 6.54039 11.7917 7.34255 11.7917 8.33206C11.7917 9.32157 10.9895 10.1237 10 10.1237C9.01049 10.1237 8.20833 9.32157 8.20833 8.33206ZM10 5.12372C8.22809 5.12372 6.79167 6.56014 6.79167 8.33206C6.79167 10.104 8.22809 11.5404 10 11.5404C11.7719 11.5404 13.2083 10.104 13.2083 8.33206C13.2083 6.56014 11.7719 5.12372 10 5.12372Z" fill="%234F5F6D" /%3E%3C/svg%3E') !important;
  background-repeat: no-repeat !important;
  background-position:  16px 6px !important;
  /* Adjust position as needed */
  /* Adjust padding to ensure the SVG doesn't overlap text */
}

.image_agency img {
  height: 80px !important;
  width: 80px !important;
}

.overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  /* Semi-transparent black background */
  z-index: 1000;
  /* Ensure the overlay is on top of other content */
}

.loader {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border: 4px solid #f3f3f3;
  /* Light grey border */
  border-top: 4px solid #CF2C79;
  /* Pink border for the spinner */
  border-radius: 50%;
  width: 50px;
  height: 50px;
  animation: spin 1s linear infinite;
  /* Rotate the spinner */
  z-index: 1001;
  /* Ensure the loader is on top of the overlay */
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

.svgasbg1 {
  width: 90%;
  height: 56px;
  border-radius: 44px;
  border: 1px solid var(--Outline-2, #EBEEF0);
  background: var(--US-White, #FFF);
  border-radius: 50px;

  margin-bottom: 10px !important;
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none"%3E%3Cpath fill-rule="evenodd" clip-rule="evenodd" d="M4.04167 8.45551C4.04167 6.37984 4.79931 4.87733 5.89207 3.88799C6.99689 2.88774 8.48781 2.37369 10 2.3737C11.5122 2.3737 13.0031 2.88776 14.1079 3.88801C15.2007 4.87735 15.9583 6.37986 15.9583 8.45551C15.9583 10.2126 15.2716 11.8321 14.3154 13.2331C13.3595 14.6338 12.1599 15.7777 11.2028 16.5676C10.4917 17.1543 9.50865 17.1544 8.79757 16.5676C7.84039 15.7778 6.64068 14.6338 5.68469 13.2332C4.72842 11.8321 4.04167 10.2126 4.04167 8.45551ZM17.375 8.45551C17.375 6.00442 16.466 4.11186 15.0587 2.83781C13.6636 1.57468 11.8211 0.957036 10 0.957031C8.17885 0.957027 6.33645 1.57466 4.94127 2.83779C3.53403 4.11184 2.625 6.00441 2.625 8.45551C2.625 10.5882 3.45775 12.4834 4.51459 14.0318C5.57171 15.5806 6.8787 16.8209 7.89592 17.6603C9.13051 18.679 10.8699 18.679 12.1044 17.6602C13.1216 16.8209 14.4285 15.5805 15.4856 14.0317C16.5423 12.4833 17.375 10.5882 17.375 8.45551ZM8.20833 8.33206C8.20833 7.34255 9.01049 6.54039 10 6.54039C10.9895 6.54039 11.7917 7.34255 11.7917 8.33206C11.7917 9.32157 10.9895 10.1237 10 10.1237C9.01049 10.1237 8.20833 9.32157 8.20833 8.33206ZM10 5.12372C8.22809 5.12372 6.79167 6.56014 6.79167 8.33206C6.79167 10.104 8.22809 11.5404 10 11.5404C11.7719 11.5404 13.2083 10.104 13.2083 8.33206C13.2083 6.56014 11.7719 5.12372 10 5.12372Z" fill="%234F5F6D" /%3E%3C/svg%3E') !important;
  background-repeat: no-repeat !important;
  background-position: 0px 4px !important;
  /* Adjust position as needed */
  padding-left: 25px !important;

  /* Adjust padding to ensure the SVG doesn't overlap text */
}

.detectlocationDiv {
  position: absolute;
  display: none;
  top: 0;
  right: 0;
}

.detectlocation:hover {
  color: #CF2C79;
}

.detectlocation1:hover {
  color: #CF2C79;
}

.communities-location-search:focus .detectlocationDiv,
.communities-location-search:hover .detectlocationDiv,
.communities-location-search:active .detectlocationDiv{
  display: block;
}



.xyz:hover {
  background-color: #b3b7ba83;
  border-radius: 50px;
  cursor: pointer;
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0) !important;
}

.carousel-item {
  text-align: center;
}

p {
  margin-bottom: 10px !important;
}

.trendhidemainscroll::-webkit-scrollbar {
  display: none;
}

/* /////////////////////////////////PHONE NUMBER/////////////////////////////////////////// */


.svgasbg::placeholder {
  /* Your placeholder styles here */
  color: #010101;
  /* Placeholder text color */

  /* Add any other styles you want */
}

#basic-addon1 {
  background-color: white;
  border: 1px solid #d2d5db;
  border-radius: 4px;
  height: 45px;
  width: 50px;
  padding: 0;
}
.main-time{
  justify-content: center;
    display: grid;
}
.clearfilter {
  color: #cf2c79;
  cursor: pointer;
}

.checkboxcolor {
  border: #808991 !important;
  border: 1px solid #808991 !important;
}

.yourphonenumber {
  color: var(--UB-Primary-Font-Color, #0F141A);
  text-align: center;
  font-family: "Inter", sans-serif;
  font-size: 24px;
  font-style: normal;
  margin-top: 5px;
  font-weight: 600;
  line-height: 40px;
  /* 166.667% */
  letter-spacing: -0.24px;
}

.iagreetocheckbox {
  height: 30px;
  border: none;
  background-color: white;
  width: 10%;
}

.agree {
  outline: none !important;
  padding-top: 0px !important;
  border: 1px solid white !important;
  color: var(--UB-Secondary-Font-Color, #4f5f6d);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 22px;
  /* 157.143% */
  letter-spacing: -0.14px;
  text-align: justify;
  padding: 10px;
  width: 90%;
}
.choices__input--cloned {
  display: none !important;
}
.fs{
  width: 110px !important;
}

.form-control:focus {
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0) !important;
}

.agree:focus {
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0) !important;
}

.getotpbutton {
  background-color: #EBEEF0;
  border: none;
  color: #808991;

  padding: .50rem;
  border-radius: 4px;
  margin-top: 10px;
  font-weight: 600;
}

.phonenumberinput {
  height: 40px;
}

.placeholderphone::placeholder {
  color: var(--UB-Font-Light, #808991);
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 40px;
  /* 250% */
  letter-spacing: -0.16px;
  padding-left: 1px;
}

.card-body::-webkit-scrollbar {
  width: 0;
  /* Hide scrollbar for Chrome, Safari, and Opera */
}

/* //////////////////////////////////////////////////////////////////////////////////////////
////////////////////////OTP SECTION--------------------------------------------------- */
.changephoto {
  height: 45px;
  width: 45px;
}

.otpfour {
  justify-content: space-between;
}

.blocflex {
  display: block;
}

#profile,
#ajaxForm,
#otp {
  margin-left: 5rem;
  margin-right: 5rem;
  margin-top: 0.9rem;
}
.hashtag-input::before {
  content: attr(data-content);
  display: block !important;
}
.gotocom-mobile:hover {
  background-color: rgba(207, 44, 121, 0.06) !important;
}

#locationForm {
  height: 280px;
  overflow:hidden auto !important;

}

#locationForm1 {
  height: 280px;
  overflow:hidden hidden;
}

/* .borderbottom{
  padding-bottom: 15px;
  border-bottom: 1px solid #EBEEF0 !important;
  border-radius: 0px;
} */
.cardmention::-webkit-scrollbar {
  width: 0;
}

.full-post::-webkit-scrollbar {
  width: 0;
}

.sidespace {
  margin-left: 5rem;
  margin-right: 5rem;

}

.completediv:hover {
  cursor: pointer;
  background: var(--Outline-2, #EBEEF0);
}

.full-post {
  display: flex !important;
}

#fullscreenCarousel {
  width: 65%;
  height: 100vh;
}

#postInformation {
  width: 35%;
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden
}

.logoutbutton:hover {
  background-color: rgba(207, 44, 121, 0.06);
}

.emailbutton:hover {
  background-color: rgba(207, 44, 121, 0.06);
}

.topphotosinheight {
  width: 50%;
  height: 85.149px;
  flex-shrink: 0;
}

.close-mobile {
  margin-right: 10px !important;
  margin-top: 10px !important;
}

.hoverrighticon {
  max-width: 100%;
  width: 175px;
  height: 45px;
  color: #0F141A;
  align-items: center;
  margin-bottom: 0px !important;
  cursor: pointer;
}

.side-navbar {
  display: block;
  margin-left: 8%;
}

.side-navbar-item {
  display: flex;
  margin-bottom: 5px;
}

.pac-container {
  margin-top: 10px;
}

.mainnav {
  display: block;
}

.numpost {
  width: max-content;
  font-size: clamp(12px, 2vw, 14px) !important;
  color: #CF2C79;
  font-size: 13px;
  font-weight: 600;
}

#custom_dropdown_container::-webkit-scrollbar {
  width: 6px;
  /* Width of the scrollbar */
}

/* Position the autocomplete dropdown slightly above the input box */
.pac-container {

  z-index: 2;

}

.service-providerhandle {
  color: #808991;
  text-decoration: none;
  border: none;
  background-color: none;
  font-size: 16px;
}

.easy {
  width: max-content;
}


.alert-warning {
  bottom: 50px;

}

.downtoup {
  bottom: 10px;
}

#custom_dropdown_container {
  background-color: white;
  border: 1px solid #ced4da;
  border: none;
  border-radius: 4px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  max-height: 180px;
  /* Adjust max height as needed */
  overflow-y: scroll;
  overflow-x: auto;

  bottom: calc(0% + -185px);


  z-index: 999;
}

.inmobiletopphoto {
  width: 50%;
  height: 120.149px;
  flex-shrink: 0;
}
.submit_remark{
  background-color: #CF2C79;
  border: 1px solid #CF2C79;
  width: -webkit-fill-available;
  height: 54px;
  border-radius: 4px;
  font-size: 16px;
  font-weight: 600;
  color: #fff;
}
.reasons {
  font-family: Inter;
  font-size: 14px;
  font-weight: 600;
  line-height: 22px;
  letter-spacing: -0.02em;
  text-align: left;
}

.predictions-list li {

  background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none"%3E%3Cpath fill-rule="evenodd" clip-rule="evenodd" d="M4.04167 8.45551C4.04167 6.37984 4.79931 4.87733 5.89207 3.88799C6.99689 2.88774 8.48781 2.37369 10 2.3737C11.5122 2.3737 13.0031 2.88776 14.1079 3.88801C15.2007 4.87735 15.9583 6.37986 15.9583 8.45551C15.9583 10.2126 15.2716 11.8321 14.3154 13.2331C13.3595 14.6338 12.1599 15.7777 11.2028 16.5676C10.4917 17.1543 9.50865 17.1544 8.79757 16.5676C7.84039 15.7778 6.64068 14.6338 5.68469 13.2332C4.72842 11.8321 4.04167 10.2126 4.04167 8.45551ZM17.375 8.45551C17.375 6.00442 16.466 4.11186 15.0587 2.83781C13.6636 1.57468 11.8211 0.957036 10 0.957031C8.17885 0.957027 6.33645 1.57466 4.94127 2.83779C3.53403 4.11184 2.625 6.00441 2.625 8.45551C2.625 10.5882 3.45775 12.4834 4.51459 14.0318C5.57171 15.5806 6.8787 16.8209 7.89592 17.6603C9.13051 18.679 10.8699 18.679 12.1044 17.6602C13.1216 16.8209 14.4285 15.5805 15.4856 14.0317C16.5423 12.4833 17.375 10.5882 17.375 8.45551ZM8.20833 8.33206C8.20833 7.34255 9.01049 6.54039 10 6.54039C10.9895 6.54039 11.7917 7.34255 11.7917 8.33206C11.7917 9.32157 10.9895 10.1237 10 10.1237C9.01049 10.1237 8.20833 9.32157 8.20833 8.33206ZM10 5.12372C8.22809 5.12372 6.79167 6.56014 6.79167 8.33206C6.79167 10.104 8.22809 11.5404 10 11.5404C11.7719 11.5404 13.2083 10.104 13.2083 8.33206C13.2083 6.56014 11.7719 5.12372 10 5.12372Z" fill="%234F5F6D" /%3E%3C/svg%3E') !important;
  background-repeat: no-repeat !important;
  background-position: 20px 12px !important;
  /* Adjust position as needed */
  padding-left: 50px !important;
  align-items: center;
  padding: 6px;
  /* Add some padding for better readability */
  cursor: pointer;
  /* Change cursor to indicate clickable items */
  width: max-content;
}

.predictions-list li:hover {
  background-color: #f0f0f0;
  /* Add a background color on hover */
}

.predictions-list {
  padding: 0;
  list-style-type: none;

}
.timeline{
  position: relative;
  padding: 1rem;
  

}
.service-provider-image-div {
  height: 70px; 
  /* object-fit:cover;  */
  width:70px;
}
.service-provider-image {
  height: 70px; 
  object-fit:cover; 
  width:70px;
}


@media(min-width:768px) and (max-width:4000px) {
  .timeline:nth-child(odd)::before,
.timeline:nth-child(even)::before{
  content: '';
  background-color: #cf2c79;
  width: 15px;
  height: 15px;
  border: 1px solid #CF2C79;
  position: absolute;
  border-radius: 50%;
  top: 20px;
}
.timeline:nth-child(odd)::before{
  left: -8px;
}
.timeline:nth-child(even)::before{
  right: -10px;
}
.timeline div{
  border: 1px solid transparent;
  background-color: transparent;
 
}
.timeline:nth-child(odd){
  border-left: 3px solid #D02C79;
  transform: translateX(14em);
  text-align: left;
}
.timeline:nth-child(even){
  border-right: 3px solid #D02C79;
  transform: translateX(-15em);
  text-align: right;
}
  .posts_row_mobile {
    display: none !important;
  }

  .han {
    font-size: clamp(10px, 2vw, 20px) !important;
  }

  .radiostyle {
    font-size: clamp(-11, 2vw, 14px) !important;
  }

  .allcom {
    font-size: clamp(9px, 2vw, 18px) !important;
  }

  .msp {
    font-size: clamp(9px, 2vw, 18px) !important;
  }

  .hidesearch {
    display: none !important;
  }

  .vanish-bbmp {
    display: none !important;
  }

  .main-top-photos {
    display: none;
  }

  .main-vanish-bbmp {
    display: none;
  }

  .local-heading {
    display: none;
  }

  .left-side-map-mainhide {
    display: none;
  }

  .maphidemain {
    display: none;
  }

  .mh0-mobile {
    display: none !important;
  }

  .trendhidemain {
    display: none;
  }

  .mentionhidemain {
    display: none;
  }

  .oknokmweb {
    display: none;
  }

  .searchicon {
    display: none;
  }

  .locatemeinmweb {
    display: none !important;
  }

  .modalheader0 {
    display: none !important;
  }

  .navdivmweb0 {
    display: none;
  }

  .half {
    width: 50% !important;
  }

}

@media(min-width:768px) and (max-width:960px) {
  .modal-content {
    height: 100vh;
    margin-top: 0px;

    overflow: hidden;
  }

  .modal-dialog {
    height: 100vh;
    overflow: hidden;
  }

  .modal-body {
    margin-bottom: 7vh;
  }

  .modal-dialog {
    margin: auto ;
  }

  .modal {
    overflow: hidden;
    /* height: 100vh !important; */
  }

  .modal-body {
    margin-top: 3vh;
    padding-bottom: 0px !important;
  }
  .current_location {
    display: block;
  }

  .nameuser {
    font-size: clamp(18px, 2vw, 22px) !important;
  }

  .locin {
    width: max-content;
  }

  .create {
    width: -webkit-fill-available;
  }
}

@media(min-width:1280px) and (max-width:4000px) {
  .ialsoweb {
    display: flex;
  }
}

@media(min-width:961px) and (max-width:4000px) {
  .vanish-sup {
    display: none !important;
  }
}

@media(max-width:960px) {
  .mobile-vanish-sup {
    display: none !important;
  }

  .hide-headings {
    display: none !important;
  }
}

.locin_link {
  text-decoration: none; 
  max-width:70%;
}

@media(max-width:767px) {

  .locin_link {
    max-width: 100%;
  }
  .me-height{
    height: -webkit-fill-available ;
  }
  .timeline{
    text-align: center;
    padding: .5rem;
  }
  .priority {
    font-size: clamp(13px, 2vw, 16px) !important;
  }

  .status {
    font-size: clamp(13px, 2vw, 16px) !important;
  }

  .service-providerhandle {
    font-size: clamp(13px, 2vw, 16px) !important;
  }

  .serviceprovider_name {
    font-size: clamp(15px, 2vw, 19px) !important;
  }

  #post-summary1 {
    font-size: clamp(14px, 2vw, 18px) !important;
  }

  #post-summary2 {
    font-size: clamp(14px, 2vw, 18px) !important;
  }

  .posts_row_web {
    display: none !important;
  }

  /* .alert-warning{
    bottom: 360px;
  }
  .downtoup{
    bottom: 320px;
  } 

  */
  .gm-style .gm-style-iw-c {
    width: clamp(300px,350px,550px) !important;
  }

  .gm-style .gm-style-iw-d button {
    margin-left: 0px !important;
    margin-right: 0px !important;
  }

  .profilemail {
    display: block;
  }

  .detectlocation {
    margin-top: 5px;
    margin-left: 15px;
  }

  .current_location {
    display: block;
  }

  .inmobiletopphoto {
    width: 50%;
    height: 100.149px;
    flex-shrink: 0;
  }

  .inmobilereport {
    overflow: scroll !important;
  }

  #custom_dropdown_container {
    background-color: white;
    border: 1px solid #ced4da;
    border-radius: 4px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    max-height: 180px;
    /* Adjust max height as needed */
    overflow-y: auto;
    bottom: calc(100% + 5px) !important;
    translate: none !important;
  }

  #p_comment {
    height: 60vh !important;
  }

  .sc {
    margin-bottom: 60px;
  }





  .m-cheight {
    height: 100vh !important;
  }

  .topphotosinheight {
    width: 50%;
    height: 100.149px;
    flex-shrink: 0;
  }

  .sidespace {
    margin-left: 1rem;
    margin-right: 1rem;

  }

  .nameuser {
    font-size: clamp(18px, 2vw, 20px) !important;
  }

  .changephoto {
    width: 38px !important;
    height: 38px !important;
  }

  .profilename img {
    width: 75px !important;
    height: 75px !important;
  }

  .profilenames {
    width: 75px !important;
    height: 75px !important;
  }

  .ialsomobile {
    display: block;
  }

  .styleions {
    font-size: .9em !important;
  }

  #otp {
    margin-left: 1rem;
    margin-right: 1rem;
  }

  .otpfour {
    justify-content: space-evenly;
  }

  .close-mobile {
    display: none;
  }

  #report {
    width: -webkit-fill-available;
  }

  #locationForm {
    height: 70vh !important;
    overflow-y: auto !important;
  }

  #locationForm1 {
    height: 70vh !important;
    overflow-y: auto !important;
  }

  .modal-content {
    margin: 0;
    height: 100svh;
    overflow: hidden;
  }

  .modal-dialog {
    margin: auto;
  }

  .getotpbuttons {

    margin-top: 13vh;
  }

  #ajaxForm,
  #profile,
  #otp {
    margin-left: 1rem !important;
    margin-right: 1rem !important;
    margin-top: 0.2rem;

  }

  .borderbottom {
    border-bottom: 3px solid #EBEEF0 !important;
    border-radius: 0px;
  }

  .mainnav {
    display: flex;
  }

  .mainna {
    display: grid !important;
  }

  #fullscreenCarousel img {
    /* height:auto !important; */
    margin-top: 0px;
    padding: 0px;
    height: 40vh !important;

    width: -webkit-fill-available;

  }

  .full-post {
    display: block !important;
  }

  #fullscreenCarousel {
    width: 100%;
    height: 40vh !important;
  }

  #postInformation {
    width: 100%;
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    position: fixed;
  }

  #myTab {
    background-color: white;
    gap: 0%;
    justify-content: space-around;


  }

  .half {
    width: -webkit-fill-available;
  }

  .most-supported-trending-post {
    display: block !important;
  }

  .gotocom-mobile {
    width: -webkit-fill-available !important;
  }

  .mobile-vanish-bbpm {
    display: none !important;
  }

  .local-hide-mobile {
    display: none;
  }

  .search-hide-mobile {
    display: none !important;
  }

  .top-map-photos-mobile {
    display: contents;
    overflow: scroll;
  }

  .maphide {
    display: none;
  }

  .trend-mobile {
    display: contents;
    margin-bottom: 10px;
  }

  .trend-mobile-scroll::-webkit-scrollbar {
    display: none;
  }

  .trend-mobile-scroll {
    overflow-x: scroll;
    overflow-y: hidden;
  }

  .profileimage {
    height: 20px;
    width: 20px;
  }

  .trendpostmob {
    display: flex !important;
  }

  .trending-post-mobile {
    border: 1px solid #EBEEF0;
    border-radius: 8px;
    margin-right: 2%;
    padding: 10px;
    display: block;
  }

  .mobileseemore {
    display: none !important;
  }

  .mobilecardbody {
    display: flex;
    overflow: scroll;
    padding: 10px;
  }

  .postnotneededinmweb {
    position: fixed;
    right: 15px;
    top: 20px;

  }

  .modalheader1 {
    display: none;
  }

  .navdivmweb {
    display: none;
  }

  .locateme1 {
    border-radius: 0px;
    border: none !important;
    background: transparent;
    padding: 0px;
    translate: -15px -17px;
    transition: ease;
  }

  #search_input1:focus {
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0);
  }
  

  

  .locateme1:hover {
    border-radius: 44px !important;
    border: 1px solid var(--Outline-2, #EBEEF0) !important;
    background: var(--Outline-Color, #EFF3F4) !important;
    translate: 0px;
  }

  .rightsidem {
    display: none !important;
  }


  .trendhide {
    display: none;
  }

  .mentionhide {
    display: none;
  }

  .left-sidem {
    position: fixed;
    bottom: 0;
    z-index: 2;
    background-color: white;
    height: 95px;
    padding: 0;
    height: 55px;
  }

  .mid-sidem {
    flex-grow: 1;
    z-index: 1;
  }

  .locatemeindown {
    display: none !important;
  }

  .oknokimg {
    display: none;
  }

  .side-navbar-item {
    display: block;
    margin-bottom: 5px;
    padding: 10px;
    padding-top: 0px !important;
  }

  .side-navbar {
    align-items: center;
    justify-content: space-between;
    gap: 1%;
    display: flex;
    margin: 0 auto;
    flex-direction: row;
  }
}


/* ------------------------------------------------------------------------------------------------- */
@media(max-width:360px){
  .heightmore{
    height: 20vh;
  }
  .iagreetocheckbox{
    height: 24px; border: none; background-color: white;
  }
  .agree{
    color: var(--UB-Secondary-Font-Color, #4F5F6D);
    font-family: "Inter", sans-serif;
font-size: 12px;
font-style: normal;
font-weight: 500;
line-height: 22px;
letter-spacing: -0.14px;
  }
  .modal-dialog{
    margin: 0px;
  }

  #ajaxForm{
    margin-left: 0rem !important;
    margin-right: 0rem !important;
    margin-top: 0rem;
  }
  .modal-content{
    margin-top: 0px !important;
    height: 100vh !important;
    border-radius: 0px;

  }
  .yourphonenumber{
    color: var(--UB-Primary-Font-Color, #0F141A);
    margin-top: 5vh;
    text-align: center;
    font-family: "Inter", sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 40px;
    letter-spacing: -0.2px;
  }
}
.nav-item-banner a {
  color: black;
  font-family: "Inter", sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
  border: 1.5px solid black;
  border-radius: 10px;
}

.nav-link {
  padding: 0px !important;
}

a.nav-link.active {
  padding: 10px 25px !important;
}

#zoomBox {
  padding-left: 6px;
  padding-right: 4px;
  padding-top: 4px;
  padding-bottom: 4px;
}

.container {
  position: relative;

}

.background-image {
  position: absolute;
  z-index: 1;
  /* Set a lower z-index to make sure it's behind the logo */
}

.sc::-webkit-scrollbar {
  display: none;
}



.profile-container {
  position: relative;
}

.card-body {
  flex: 0;
}

.logoutbutton {
  color: var(--US-PC, #CF2C79);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 22px;
  /* 157.143% */
  border-radius: 4px;
  height: 30px;
  border: 1px solid var(--US-PC, #CF2C79);
  background: var(--US-White, #FFF);
}

.profile-container img {
  padding: 0;
  width: 95px;
  height: 95px;
  background-color: #EFF3F4;
  margin-right: 5px;
  border: 1px solid none;
  border-radius: 50% 50%;
}

.proi {
  color: var(--UB-Primary-Font-Color, #0F141A) !important;
}

#post {
    {
    i
  }
}

a.read-more {
  color: #BB1E68;
  /* Change the color of the link text */
  text-decoration: none;
  /* Add underline to the link text */
  cursor: pointer;
  /* Change the cursor to indicate it's clickable */
}

.nameandedit h3 {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
  line-height: 26px;
}

.mapheading {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 125%;
  /* 25px */
}

#search_here,
#seach_here1 {
  border: 2px solid #CF2C79;
}

#search_here:hover {
  background-color: rgb(247, 234, 240) !important;
}

.findpost {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 17px;
  font-style: normal;
  font-weight: 600;
  line-height: 125%;

  /* 17.5px */
}

.inurarea {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 125%;
}

.searchprofileslocation {
  letter-spacing: 0px !important;
  /* 157.143% */
}

.inurarealocal {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 125%;
  /* 17.5px */
}

.si:hover {
  background-color: transparent !important;
}

.trendingposts {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 22px;
  /* 157.143% */
}

.hashtrendtag:hover {
  border: 1px solid #EBEEF0;
  background-color: #EBEEF0;
}

.hashtrendtag {
  color: var(--UB-Primary-Font-Color, #0F141A);
  border: 1px solid #EBEEF0;
  height: 40px;
  font-size: clamp(13px, 1vw, 14px) !important;
  font-family: "Inter", sans-serif;
  padding-right: 6px !important;
  padding-bottom: 8px !important;
  padding-left: 6px !important;
  padding-top: 8px !important;
  font-style: normal;
  height: auto;
  cursor: pointer;
  font-weight: 600;
  justify-content: start;
  border-radius: 8px;
  margin-bottom: 8px;
  align-items: center;
  width: 100%;


}

.mspnpn {
  color: var(--US-PC, #CF2C79);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
  /* 150% */}

.topvoice {
  height: fit-content;
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
  /* 200% */
}

.tm {
  color: var(--UB-Primary-Font-Color, #0F141A) !important;
}

.i1 {
  color: var(--US-PC, #CF2C79);
  font-family: "Inter", sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
  /* 120% */
  height: 36px;
  width: 36px;
  text-align: center;
  background-color: rgba(207, 44, 121, 0.06);
  ;
  border: 1px solid rgba(207, 44, 121, 0.06);
  ;
  border-radius: 50px;
  padding-top: 4px;
}

.msp {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: 24px;
  /* 133.333% */
}

.completediv {
  height: auto;
  overflow: hidden;
  border-radius: 8px;
  border: 1px solid var(--Outline-2, #EBEEF0);
}

.mspt {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
  /* 157.143% */
  word-break: break-all;
}

.mspn {
  color: var(--US-PC, #CF2C79);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
  /* 171.429% */
}

.btncom {
  background-color: white;
  border: 1px solid #BB1E68;
  height: 36px;
  border-radius: 8px;
  border: 1px solid var(--US-PC, #CF2C79);
  background: var(--US-White, #FFF);
}

.badge {
  padding-left: 0;
  padding-right: 0;
}

.gotocomp {
  text-decoration: none;
  color: var(--US-PC, #CF2C79);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 22px;
  /* 157.143% */
}

.tpm {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 125%;
  /* 17.5px */
}

.last {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  width: max-content;
  border-radius: 4px;
  background: #F0F7ED;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
  /* 183.333% */
  letter-spacing: -0.24px;
}

.fontse {
  line-height: 24px !important;
  /* 171.429% */
}



.locin {
  word-break : break-all;
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 24px;
  /* 150% */
}

.create {
  color: var(--UB-Secondary-Font-Color, #4F5F6D);
  font-family: "Inter", sans-serif;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
  /* 183.333% */
  letter-spacing: -0.24px;
}

.allcom {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
  /* 133.333% */

}

.byin {

  line-height: 24px !important;
  /* 171.429% */

}

.cominlocal {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 125%;
  /* 25px */
}

.communities-location-search {
  border-radius: 50px;
  border: 1px solid transparent;
  transition: 0.2s linear;
  cursor: pointer;
}

.communities-location-search:hover {
  border: 1px solid #EBEEF0;
  background-color: #EFF3F4;
}
.communities-location-search input:focus {
  border: 1px solid #EBEEF0 !important;
  /* background-color: #EFF3F4; */
}

.communities_pillbox {
  width: fit-content;
  border-radius: 33px;
  margin: auto;
  background: rgba(208, 44, 121, 0.06);
}

.hidden-text {
  display: none;
}

.usernam {
  color: var(--US-PC, #CF2C79);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
  /* 171.429% */
}

.hasloccom {

  width: max-content;
  color: var(--US-PC, #CF2C79);
  font-family: "Inter", sans-serif;
  font-size: 13px;
  font-style: normal;
  font-weight: 600;
  line-height: 26px;
  /* 216.667% */
}

.viewissuec:hover {
  background-color: rgba(207, 44, 121, 0.06);
}

.viewissuec {
  width: -webkit-fill-available;
  height: 40px;
  border-radius: 8px;
  border: 1px solid var(--UB-Tagoutline, #CF2C79);
  background: var(--US-White, #FFF);
  text-align: center;
  color: var(--US-PC, #CF2C79);
}

.viewissue {
  color: var(--US-PC, #CF2C79);
  text-align: center;
  font-family: "Inter", sans-serif;
  text-decoration: none;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 22px;
  /* 157.143% */
  width: -webkit-fill-available;
  display: contents;
}

.mappost {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
  /* 157.143% */
}

.trendingtags {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 22px;
  /* 157.143% */
}

.svg-overlay {
  position: absolute;
  bottom: 15%;
  left: 12%;
}

.para {
  text-align: center;
}


.shake-icon {
  animation: shake 0.5s ease-in-out infinite;
}

@keyframes shake {

  0%,
  100% {
    transform: translateX(0);
  }

  25%,
  75% {
    transform: translateX(-5px);
  }

  50% {
    transform: translateX(5px);
  }
}




#seeMoreContainer a {
  color: var(--US-PC, #CF2C79);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 125%;
  /* 17.5px */
}

#seeMoreContainer1 a {
  color: var(--US-PC, #CF2C79);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 125%;
  /* 17.5px */
}

/* #suggestionsList{
  border-radius: 4px;
background: var(--US-White, #FFF);
box-shadow: 0px 4px 12px 2px rgba(15, 20, 26, 0.24);
padding-left: 0!important;
} */


#suggestionsList ul {
  border: 1px solid black;
  padding-left: 0 !important;


}


#suggestionsList li {
  border: none;

}

#suggestionsList1 ul {
  border: 1px solid black;
  padding-left: 0 !important;


}


#suggestionsList1 li {
  border: none;

}

.suggestionItem {
  z-index: 1;
  list-style: none;
  /* Remove default list item bullets */
  padding: 8px 12px;
  /* Adjust padding for better appearance */
  cursor: pointer;
  border: none;


  /* Add a border for separation */
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  /* 271.429% */
}

.suggestionItem:hover {
  background-color: #f0f0f0;
  /* Change background color on hover */
}





.mid-sidebar {
  background-color: none;
  border-right: 1px solid #ebeef0;
  border-left: 1px solid #ebeef0;
}

/* .right-sidebar{
  margin-bottom: 200px;
} */
#adjust {
  padding-top: 8px;
}



/* .side-navbar-item a {
  color: black;
  font-family: "Inter", sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: 30px;
  text-decoration: none;
} */
.bi {
  width: 28px;
  height: 28px;
}

.search-around {
  background-color: #eff3f4;

  height: 40px;
  border: none;
}

.searchdropdown {
  border-radius: 8px;
  background: var(--US-White, #FFF);
  box-shadow: 0px 0px 8px 4px rgba(15, 20, 26, 0.08);
  width: -webkit-fill-available;
  margin-right: 30px;

}

/* #rounds{
  /* border: 1px solid none !important;
  border-radius: 50% 50% !important; */

.midimage {
  width: 35px;
  height: 35px;
  background-color: #eff3f4;
  border: 1px solid none;
  border-radius: 50% 50%;
}

.midimage img {
  border-radius: 25px;
}

.avatar-img {
  height: 40px;
  width: 40px;
  border: 1px solid none;
  border-radius: 50% 50%;
}

.h5 {
  color: var(--UB-Primary-Font-Color, #0f141a);
  font-family: "Inter", sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 125%;
  /* 22.5px */
}

.custom-hw {
  width: 28px;
  height: 28px;
}

.footer p {
  padding: 40px;
  text-align: center;
  color: #808991;
  text-align: center;
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  /* 114.286% */
}

/* .custscroll {
  overflow-y: scroll;
  height: 100px;
} */

/* Width of the entire scrollbar */
.custscroll::-webkit-scrollbar {
  width: 10px;
}

/* Track (the area on the sides of the thumb) */
.custscroll::-webkit-scrollbar-track {
  background: #f1f1f1;
}

/* Handle (the draggable part) */
.custscroll::-webkit-scrollbar-thumb {
  background: #888;
}

/* Handle on hover */
.custscroll::-webkit-scrollbar-thumb:hover {
  background: #555;
}

/* .custscroll {
  overflow-y: scroll;
  height: 100px;
} */

/* Width of the entire scrollbar */
.custscroll::-webkit-scrollbar {
  width: 10px;
}

/* Track (the area on the sides of the thumb) */
.custscroll::-webkit-scrollbar-track {
  background: #f1f1f1;
}

/* Handle (the draggable part) */
.custscroll::-webkit-scrollbar-thumb {
  background: #888;
}

/* Handle on hover */
.custscroll::-webkit-scrollbar-thumb:hover {
  background: #555;
}

.share p,
.comments p,
.monitoring p,
.handshake p {

  line-height: 24px !important;

}

.rightradio:checked {
  background-color: #CF2C79 !important;
  border-color: #CF2C79 !important;
}

.rightradio {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  border-radius: 33px;
  border: 1px solid var(--UB-Font-Light, #808991);
  color: var(--UB-Primary-Font-Color, #0F141A) !important;

}

.mentionradio {
  cursor: pointer;
  word-break: break-all;
  color: var(--UB-Primary-Font-Color, #0F141A) !important;
}

.trends {

  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 18px !important;
  font-style: normal;
  font-weight: 600;
  line-height: 125%;
  /* 22.5px */
}

.trending {
  /* border-top: none;
  border-left:none ;
  border-right: none; */
  border-bottom: 1px solid #eff3f4;
  /* margin-bottom: 10px; */
}

.card-header,
.card-title,
.card-body {
  padding: 0;
}

.counts {
  margin-top: 20px;
}

.post-img {
  width: 545px;
  height: 280px;
  border: 1px solid none;
  border-radius: 10px;
}

.btns {
  padding-left: 0;
}

.contents {
  justify-content: space-between;
}

#postimg {
  width: 30px;
  height: 30px;
  background-color: #d3d3d3;

  border-radius: 25px;
}

#postimg img {
  border: 1px solid blue;
}

.modal-header {
  border: none;
}

/* .hoverrighticon{
  width: 200px;
  height: 45px;
  color: #0F141A;
  align-items: center;
  margin-bottom: 10px !important;
  cursor: pointer;
} */
.hoverrighticon:hover {
  border-radius: 8px;
  background: var(--Outline-Color, #EFF3F4);
  color: #0F141A;
  height: 45px;
  cursor: pointer;
}

.modal-content {
  border-radius: 0.5rem;
}

.sticky-bottom {
  position: absolute;
  bottom: 0;
  width: 93%;
  color: #fff;
  text-align: center;
  padding: 10px;
}

.form-control {
  height: 30px;
}
.daterange_service:hover{
background-color: transparent !important;
}
.alert {
  height: 42px;
  padding: 0;
  background-color: #ffedbe;
  margin-bottom: 0;
}

.rounded {
  border-radius: 15px !important;
  padding: 4px;
}

.rounds {
  border-radius: 50% 50% !important;
}

.rounded img {
  border-radius: 15px !important;
}

#myButton {
  background-color: #ebeef0;
  color: #808991;
  border: 1px solid transparent;
  border-radius: 50px 50px;
  padding-right: 30px;
  padding-left: 30px;
}

#myButton.active {
  background-color: #cf2c79 !important;
  color: white;
}

.custom-card {
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  border-bottom: none;
}

.whichcommunity {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 20px;
  font-style: normal;
  word-break: break-all;
  font-weight: 600;
  line-height: 26px;
  /* 130% */
}

.communityheading h5 {
  color: var(--US-PC, #CF2C79);
  font-family: "Inter", sans-serif;

  font-size: 12px;
  font-style: normal;
  font-weight: 600;
  line-height: 26px;
  /* 216.667% */
}

.detailscommunity {

  line-height: 24px !important;
  /* 171.429% */

  margin-bottom: 0px !important;
}

.communityheading {
  border-radius: 33px;
  background: rgba(208, 44, 121, 0.06);
  width: max-content;
  /* Set the width of the container div */
  margin: 0 auto;

}

.rounded-pill {
  border: 1px solid transparent;
  border-radius: 8px !important;
  height: 42px;
  background-color: #eff3f4 !important;
}

.sharexperince {
  padding: 0;
  outline: none;
  margin-left: 10px !important;
  color: var(--UB-Primary-Font-Color, #0f141a);
  font-family: "Inter", sans-serif;

  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 36px;

  /* 225% */
}

.sharexperince {
  outline: none;
  border: 1px solid transparent;
}
.prfileinfo{
  border-bottom: 4px solid #EBEEF0;
}
.sharexperince:focus {
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0);
}

.post-detail-link {
  cursor: pointer;
}
.sp-body-hover:hover{
  background-color: rgb(247, 249, 249);
}

.post-detail-link:hover {
  background-color: rgb(247, 249, 249);
  cursor: pointer;
}

.btn {
  outline: none;
  border: 1px solid transparent;
  padding: .50rem .50rem;
  transition: none;
}

.btn:focus {
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0);
}

.navbar-brand {
  color: var(--US-PC, #cf2c79);
  font-family: "Poppins", sans-serif;
  font-size: 22px;
  font-style: normal;
  font-weight: 700;
  line-height: 36px;
  /* 163.636% */
  letter-spacing: -0.88px;
}

#autocompleteInput {
  width: 100%;
  min-height: 50px;
  /* Set a minimum height */
  padding: 10px;
  font-size: 16px;
  border: 1px solid #ccc;
  border-radius: 5px;
  resize: none;
  /* Disable resizing by the user */
}

.responds {
  color: var(--UB-Secondary-Font-Color, #4F5F6D);
  text-align: center;
  font-weight: 400 !important;

}

#autocompleteInput {
  outline: none;
  border: 1px solid transparent;
}

.trendsi {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: 125%;
  /* 22.5px */
}

.trendslocation {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  margin-bottom: 16px;
  line-height: 125%;
  /* 17.5px */
}

.seemorebutton {
  color: var(--US-PC, #CF2C79);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 125%;
  /* 17.5px */
}

.tl {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 24px;
  width: max-content;
  /* 171.429% */
}

.filterby {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: 125%;
  /* 22.5px */
}

#autocompleteInput:focus {
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0);
}

#autocompleteInput1 {
  width: 100%;
  min-height: 50px;
  /* Set a minimum height */
  padding: 10px;
  font-size: 16px;
  border: 1px solid #ccc;
  border-radius: 5px;
  resize: none;
  /* Disable resizing by the user */
}

#autocompleteInput1 {
  outline: none;
  border: 1px solid transparent;
}

#autocompleteInput1:focus {
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0);
}

#autocompleteInput2 {
  width: 100%;
  min-height: 50px;
  /* Set a minimum height */
  padding: 10px;
  font-size: 16px;
  border: 1px solid #ccc;
  border-radius: 5px;
  resize: none;
  /* Disable resizing by the user */
}

#autocompleteInput2 {
  outline: none;
  border: 1px solid transparent;
}

#autocompleteInput2:focus {
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0);
}

.ic1 {
  position: relative;
  display: inline-block;
  font-size: 14px;
  align-items: center;
  /* Adjust the font size as needed */
}

.rounded:hover {
  border-radius: 44px;
  border: 1px solid var(--Outline-2, #EBEEF0);
  background: var(--Outline-Color, #EFF3F4);
}

#locateme {
  border-radius: none;
  border: none;
  background: none;

}

#locateme:focus {

  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0);
}

#search_input:focus {

  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0);
}

#search_input:hover {
  border-radius: 44px !important;
  border: 1px solid var(--Outline-2, #EBEEF0) !important;
  background: var(--Outline-Color, #EFF3F4) !important;
}

/* #search_input1:hover {
  border-radius: 44px !important;
  border: 1px solid var(--Outline-2, #EBEEF0) !important;
  background: var(--Outline-Color, #EFF3F4) !important;
} */



.handshake:hover {
  background-color: #eff3f4 !important;
  /* border: 1px solid transparent; */
  /* border-radius: 8px 8px;
  padding-top: 0px; */
}

.icon-container-1:hover::after {
  content: "Support";
  position: absolute;
  background-color: #4F5F6D;
  margin-top: 5px;
  top: 70%;
  left: 50%;
  transform: translateX(-50%);
  color: white !important;
  padding: 2px;
  border: 1px solid rgba(0, 0, 0, #cf2c79) !important;
  border-radius: 5px;
  white-space: nowrap;
  font-size: 13px;
  opacity: 1;
  z-index: 1;
}


.ic2 {
  position: relative;
  display: inline-block;
  font-size: 14px;
  align-items: center;
  /* Adjust the font size as needed */
}

.comments:hover {
  background-color: #EFF3F4 !important;
  /* border: 1px solid transparent;
  border-radius: 8px 8px;
  padding-top: 0px; */
}

/* .navbarofcsls{
  margin-left: 55px;
} */
.icon-container-2:hover::after {
  content: "Comment";
  position: absolute;
  background-color: #4F5F6D;
  margin-top: 5px;
  top: 70%;
  left: 50%;
  transform: translateX(-50%);
  color: white !important;
  padding: 2px;
  border: 1px solid rgba(0, 0, 0, #cf2c79) !important;
  border-radius: 5px;
  white-space: nowrap;
  font-size: 13px;
  opacity: 1;
  z-index: 1;
}


.ic3 {
  position: relative;
  display: inline-block;
  font-size: 14px;
  align-items: center;
  /* Adjust the font size as needed */
}

.share:hover {
  background-color: #EFF3F4 !important;
  /* border: 1px solid transparent;
  border-radius: 8px 8px;
  padding-top: 0px; */
}

.icon-container-3:hover::after {
  content: "Share";
  position: absolute;
  background-color: #4F5F6D;
  margin-top: 5px;
  top: 70%;
  left: 50%;
  transform: translateX(-50%);
  color: white !important;
  padding: 2px;
  border: 1px solid rgba(0, 0, 0, #cf2c79) !important;
  border-radius: 5px;
  white-space: nowrap;
  font-size: 13px;
  opacity: 1;
  z-index: 1;
}

.ic4 {
  position: relative;
  display: inline-block;
  font-size: 14px;
  align-items: center;
  /* Adjust the font size as needed */
}

.monitoring:hover {
  background-color: #EFF3F4 !important;
  /* border: 1px solid transparent;
  border-radius: 8px 8px;
  padding-top: 0px; */
}

.icon-container-4:hover::after {
  content: "Views";
  position: absolute;
  background-color: #4F5F6D;
  margin-top: 5px;
  top: 70%;
  left: 50%;
  transform: translateX(-50%);
  color: white !important;
  padding: 2px;
  border: 1px solid rgba(0, 0, 0, #cf2c79) !important;
  border-radius: 5px;
  white-space: nowrap;
  font-size: 13px;
  opacity: 1;
  z-index: 1;
}


.phonenumber {
  color: var(--UB-Primary-Font-Color, #0f141a);
  text-align: center;
  font-family: "Inter", sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
  line-height: 40px;
  /* 166.667% */
  letter-spacing: -0.24px;
}


#phone,
#otpno,
#phones,
#emailId {
  height: 45px;
  outline: none;
  border: 1px solid #d2d5db;
  border-radius: 4px;

}

.citiuser {
  color: var(--US-PC, #CF2C79);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
  /* 171.429% */
}

#phone:focus {
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0);
}

#phones:focus {
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0);
}

#emailId:focus {
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0);
}

.toast {
  position: fixed;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  background-color: #BB1E68;
  color: #fff;
  padding: 10px 20px;
  border-radius: 5px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
  opacity: 1 !important;
}

#phones::placeholder {
  color: #808991;
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-style: normal;

  line-height: 40px;

  letter-spacing: -0.16px;

}

/* Add your other styles as needed */
.input-group-lg input::placeholder {
  color: #808991;
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-style: normal;

  line-height: 40px;

  letter-spacing: -0.16px;
}

#emailID::placeholder {
  color: #808991 !important;
  font-family: "Inter", sans-serif !important;
  font-size: 16px !important;
  font-style: normal !important;

  line-height: 40px !important;

  letter-spacing: -0.16px !important;

}

.small {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  word-break: break-all;
  /* 150% */
}

#emailID::placeholder {
  color: #808991;
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-style: normal;
  line-height: 40px;
  letter-spacing: -0.16px;

}

.getloginotp {
  color: var(--UB-Font-Light, #808991);
  text-align: center;
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 26px;
  /* 162.5% */
}



.usersubmit {
  color: #808991;
  text-align: center;
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 26px;
  /* 162.5% */
}


.form-check-input:focus {
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0) !important;
}

.form-check-input:checked {
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0) !important;
}

.form-check-input:checked {
  background-color: #4f5f6d;
  border-color: #4f5f6d;
}

#mybutton {
  color: #808991;
  border: 1px solid #ebeef0;
  background-color: #ebeef0;
}

#mybutton.active {
  background-color: #cf2c79 !important;
  color: black;
}

.otp-input {
  width: 45px;
  height: 45px;
  text-align: center;
  margin: 0 0.2em;
  border: 1px solid #d2d5db;
}

.sentto {
  color: #4f5f6d;
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
  /* 162.5% */
  letter-spacing: -0.16px;
}

/* .container{
  border: none;
} */
.confirmotp {

  letter-spacing: -0.14px !important;
}

.timer {
  border-bottom: 0%;
}

#name {
  height: 45px;
  outline: none;
  border: 1px solid #d2d5db;
  color: #808991;
  font-size: 17px;
  line-height: 40px;
  /* 250% */
  letter-spacing: -0.16px;
  margin-bottom: 20px;
}

#name {
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0);
}

#email {
  height: 45px;
  outline: none;
  border: 1px solid #d2d5db;
  color: #808991;
  font-size: 17px;
  line-height: 40px;
  /* 250% */
  letter-spacing: -0.16px;
  margin-bottom: 20px;
}

#email {
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0);
}

.modal-title h5 {
  color: black;
  text-align: center;
  font-family: "Inter", sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
  line-height: 40px;
  /* 166.667% */
  letter-spacing: -0.24px;
}


.getotp,
.getotp:hover,
.getotp:active {
  border-radius: 4px;
  background-color: #ebeef0;
  color: #808991;
  text-align: center;
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 26px;
}

.otpsent {
  color: #4f5f6d;
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
  /* 162.5% */
  letter-spacing: -0.16px;
}



.complaint {
  color: var(--US-Dark-brown, #764415);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 22px;
  /* 157.143% */
}

#postbutton {
  background-color: #ebeef0;
  padding-left: 20px;
  padding-right: 20px;
  border-radius: 50px 50px !important;
  color: #808991;
  text-align: center;
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 18px;
  /* 128.571% */
}

.wb {
  color: var(--UB-Secondary-Font-Color, #4F5F6D);
  font-family: "Inter", sans-serif;
  border-radius: 8px;
  background: var(--Outline-Color, white) !important;
  padding: 1px 4px;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 18px;
  padding: 5px 0px;
  border: 1px solid transparent;
  font-weight: 500;
  size: 14px;
  /* 128.571% */
}

.wb:hover {
  color: var(--UB-Secondary-Font-Color, #4F5F6D);
  font-family: "Inter", sans-serif;
  border-radius: 8px;
  background: var(--Outline-Color, #EFF3F4) !important;
  padding: 1px 4px;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 18px;
  padding: 5px 0px;
  border: 1px solid transparent;
  font-weight: 500;
  size: 14px;
}

.recentlyposted {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 125%;
  /* 22.5px */
}

#report {
  margin-top: 12px;
  color: #cf2c79;
  background-color: white;
  font-family: "Inter", sans-serif;
  text-align: center;
  font-size: clamp(13px, 1vw, 14px) !important;

  font-style: normal;
  font-weight: 500;
  line-height: 22px;
  height: 40px;

  border-radius: 8px;
  border: 1px solid var(--US-PC, #CF2C79);
  background: var(--US-White, #FFF);
}

#report:hover {
  border-radius: 8px;
  border: 1px solid var(--US-PC, #CF2C79);
  background: rgba(207, 44, 121, 0.06);
}

/* .dropdownhover {
  border: 1px solid transparent;
  background-color: white !important;
  border-radius: 50% 50%;
  padding: 0px 0px !important;
  height: 40px;
  width: 40px;
  padding: 1px 0px !important;
} */

/* .dropdownhovera:hover {
  padding: 0px 0px !important;
  height: 40px;
  width: 40px;
} */

.trending-post:hover {
  border-radius: 8px;
  background: var(--Outline-Color, #EFF3F4);
  cursor: pointer;
}

.locationwithpost {
  border-radius: 8px;
  background: var(--Outline-Color, white);
  padding: 0px 0px !important;
}

.locationwithpost:hover {
  border-radius: 8px;
  background: var(--Outline-Color, #EFF3F4);
  padding: 1px 4px;
}

.tophover:hover {
  background-color: #EFF3F4 !important;
  border-radius: 8px;
  cursor: pointer;

}

/* .dropdownhover:hover {
  border: 1px solid transparent;
  background-color: #EFF3F4 !important;
  border-radius: 50% 50%;
  padding: 0px 0px !important;
  height: 40px;
  width: 40px;
} */

.scrollable-card {
  max-height: 200px;
  /* Adjust the max height as needed */
  overflow-y: auto;
}

/* .lightbox-image {
  max-width: 100%;
  height: auto;
} */
#lightbox-container {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  align-items: center;
  justify-content: center;
}

#lightbox-image {
  max-width: 100%;
  max-height: 100%;
}

.lightbox-close {
  position: absolute;
  top: 10px;
  right: 10px;
  color: #fff;
  cursor: pointer;
}

.container-xxl {
  justify-content: center;
}

#blockflex {
  justify-content: center;
  display: block;
}

.hashtagpopup {
  width: 260px;
}

.hashtags p {
  color: var(--US-PC, #cf2c79);
  font-family: "Inter", sans-serif;
  font-size: 16px !important;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
  /* 162.5% */
}

.mention-color {
  color: #BB1E68;
}

.dropdown-toggle::after {
  display: none !important;
}


.replies {
  color: #0075ff !important;

}

input[type="search"]:focus {
  outline: none;
}

input:focus {
  outline: none;
}

.trendhash {
  word-break: break-all;
  text-decoration: none;
  color: #0f141a;
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 22px;
  /* 157.143% */
}

.pepreport {
  color: var(--UB-Secondary-Font-Color, #4f5f6d);
  font-family: "Inter", sans-serif;
  font-size: 13px;
  font-style: normal;
  font-weight: 500;
  line-height: 22px;
  /* 183.333% */
}

.plusbutton {
  border-radius: 8px;
  opacity: 0.9;
  background-color: #0f141a;
  width: 50px;
  height: 44px;
  flex-shrink: 0;
  color: white;
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 125%;
}

#phoneNumberError {
  color: #cf2c79;
}

.plusbutton:hover {
  border-radius: 8px;
  opacity: 0.9;
  background-color: #0f141a;
  width: 50px;
  height: 44px;
  flex-shrink: 0;
  color: white;
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 125%;
  /* 17.5px */
}

.time {

  color: var(--UB-Secondary-Font-Color, #4F5F6D) !important;
  font-family: "Inter", sans-serif;

  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
  /* 183.333% */
  letter-spacing: -0.24px;
}

#myTab {
  background-color: white;
  gap: 5%;


}

.nav-tabs {
  background-color: white !important;
  border-bottom: none !important;
}

.profilename {
  color: var(--UB-Primary-Font-Color, #0f141a);
  font-family: "Inter", sans-serif;
  font-size: 20px !important;
  font-style: normal;
  font-weight: 600;
  line-height: 125%;
  /* 25px */
}

.profilename img {
  width: 95px;
  height: 95px;
}

#postInformation::-webkit-scrollbar {
  display: none;
}

.postd::-webkit-scrollbar {
  display: none;
}

.otps {
  text-align: center;
  height: 50px;
  width: 50px;
}

#wrongotp {
  color: var(--UB-Red-Error, #EF4444);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  /* 142.857% */
  letter-spacing: -0.14px;
}

.imgdiv {
  border-radius: 12px;
  display: block;
}

.textarea-container {
  position: relative;
  width: 95%;
  margin-bottom: 0;
}

.pd {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 125%;
  /* 25px */
}

#autocompleteInput {
  height: 2em;
}

.edit:hover {
  background-color: rgba(207, 44, 121, 0.06) !important;
}

.pc,
.spc,
.topmentionhandle,
.proi,
.editprofile,
.tm,
.fontse,
.mentionradio,
.howmanyfollow,
.pplfollow,
.manyppl,
.manyppls,
.byin,
.detailscommunity,
.radiostyle,
.share p,
.comments p,
.monitoring p,
.responds,
.replies,
.rightradio,
.mentionit,
.confirmotp,
.searchprofileslocation {
  color: var(--UB-Secondary-Font-Color, #4F5F6D);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 22px;
  /* 157.143% */
  letter-spacing: -0.28px;
}

.show-more {
  position: absolute;
  bottom: 0;
  right: 0;
  background-color: #fff;
  cursor: pointer;
  display: none;
  color: blue;
}

#timer a {
  text-decoration: none;
}

#showMoreLink {
  display: none;
}

.show-more-content {
  overflow: hidden;
  line-height: 1.2em;
  max-height: 2.4em;
}

#previewContainer,
#previewContainer1,
#previewContainerReport {
  display: flex;
  flex-wrap: wrap;
}

.styleions {
  font-family: "Inter", sans-serif;
  font-size: 20px;
  font-style: normal;

  line-height: 30px;
  text-decoration: none;
  font-weight: 600;
  /* margin-left: 3px; */
}

.small {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  /* 150% */
}

.pcp {
  color: var(--US-PC, #CF2C79) !important;
  font-family: "Inter", sans-serif;
  text-decoration: none;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
  /* 171.429% */
}

.customscrollbar {
  max-height: 320px;
  overflow-y: auto;

  &::-webkit-scrollbar {
    width: 8px;
  }

  &::-webkit-scrollbar-thumb {
    background-color: darkgray;
    border-radius: 10px;
    /* Set the border-radius for the thumb */
  }

  &::-webkit-scrollbar-track {
    background-color: lightgray;
    border-radius: 10px;
    /* Set the border-radius for the track */
  }
}

.post-link {
  color: black;
  /* Change to the desired color */
}

.mentionmore {
  cursor: pointer;
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-weight: 500;
  word-break: break-word;
  letter-spacing: 0em;
  text-align: left;
  margin-top: 3px;
}

/* .draw:hover{
  background-color:  rgb(203, 202, 202) !important;
} */

.category_list {
  overflow-x: scroll;
  scrollbar-width: none;
  scroll-behavior: smooth;
  max-width: 100%;
  width: auto;
  font-size: 13px;
  margin: 5px 0;
  display: flex;
  list-style-type: none;
  text-transform: capitalize;
}

@media screen and (max-width: 575px) {
  .mid-sidebar {
    border: 0;
  }
  .category_list {
    width: auto;
    max-width: 100%;
  }
  .service-provider-image-div {
    height: 50px; 
    /* object-fit:cover;  */
    width:50px;
  }
  .service-provider-image {
    height: 50px; 
    object-fit:cover; 
    width:50px;
  }
  .service-provider-info {
    font-size: 14px;
  }
}

.category_list li ::marker {
  visibility: none;
}

.category_list{
  cursor: pointer;
}
.pillbox {
  height: auto;
  background-color: transparent !important;
  border: 1px solid grey;
  padding: 3px 6px;
  margin: auto 5px;
  transition: ease-out 0.3s;
  cursor: pointer;
  white-space: nowrap;
}

.pillbox:hover {
  background-color: #18161625 !important;
  border: 1px solid #a0a0a0;
}

.selected_category {
  height: auto;
  background-color: #0000009d !important;
  border: 1px #0000009d !important;
  padding: 3px 6px;
  margin: auto 5px;
  cursor: pointer;
  color: white;
  white-space: nowrap;
}


.countButton,
.remaining-count {
  border: none;
  color: var(--US-PC, #CF2C79);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
  /* 171.429% */
  cursor: pointer;

}

.mentionmoreheading {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 125%;
  /* 22.5px */
}

.svgst {
  margin-top: 4px;
}

.mentionit {
  color: var(--UB-Primary-Font-Color, #0f141a) !important;
  font-weight: 500 !important;
  line-height: 30px !important;
}

.show-more-trigger {
  display: block;
}

textarea {
  border: none;
  outline: none;
  border-bottom: 1px solid transparent;
}

textarea::-webkit-scrollbar {
  width: 12px;
}

textarea::-webkit-scrollbar-thumb {
  background-color: #c0bcbc;
  border-radius: 6px;
}

textarea::-webkit-scrollbar-track {
  background-color: #f1f1f1;
}

.hashtag-input {
  background-color: white;
  border: 1px solid black;
  padding: 8px;
  font-size: 16px;
  position: relative;
}

.clicked {
  background-color: red;
}

.profilename {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 125%;
}

.hashtag-input::before {
  content: attr(data-content);
  display: inline-block;
}

.btn-secondary:hover {
  color: #fff;
  background-color: white !important;
  border-color: white !important;
}

.btn-secondary:focus {
  color: #fff;
  background-color: white !important;
  border-color: white !important;
}

#profile-tab {
  color: #4F5F6D;
}

#home-tab,
#profile-tab,
#contact-tab,
#disabled-tab {
  color: #4F5F6D !important;
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  letter-spacing: 0em;
  text-align: left;
  border: none;
  margin-bottom: 10px;
}

#home-tab-pane,
#profile-tab-pane,
#contact-tab-pane,
#share-tab-pane {
  margin-top: 10px;
}

.reportit h4 {
  font-family: "Inter", sans-serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 22px;
  letter-spacing: -0.02em;
  text-align: left;

}

.roundedspill {
  width: fit-content;
  margin: 0 auto;
  height: 44px;
  align-items: center;
  border: 2px solid #BB1E68;
  padding: 8px 8px;
  border-radius: 33px 33px;
  color: var(--US-PC, #CF2C79);
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 26px;
  /* 162.5% */
}

.follow {
  color: var(--US-PC, #CF2C79);
  font-family: "Inter", sans-serif;
  font-size: 16px;
  height: 44px;
  font-style: normal;
  font-weight: 500;
  line-height: 26px;
  border: 2px solid #BB1E68;
  background-color: transparent;
  border-radius: 33px 33px;
  padding: 0px 26px;
}

.howmanyfollow,
.pplfollow {
  text-align: center;
}

.reportissue label {
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 22px;
  letter-spacing: -0.02em;
  text-align: left;
}

#issueresolved {
  border-radius: 4px;
  background: #F0F7ED;
  width: 40%;
  margin: 0 auto;
  color: #2BA700;
  text-align: center;
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 22px;
  margin-bottom: 5px !important;
  /* 157.143% */
}

.imgdivs {
  position: absolute;
}

#imgdiv2 {
  left: 50%;
  top: 15%;
  height: 80px;
  transform: translate(-50%, -50%);
  z-index: 1;
}

.reportissue p {
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  letter-spacing: -0.02em;
  text-align: left;
}

.reportissue input[type="radio"]:checked {
  background-color: #CF2C79;
  border-color: #fff;
}

#reportfoot button {
  height: 54px;
  border: 1px solid transparent;
  /* margin-bottom: 20px; */
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 26px;
  letter-spacing: 0em;
  text-align: center;
  width: 80%;
  color: #808991;
  border-radius: 4px;
}

#reportcompleteModal h1 {
  font-family: "Inter", sans-serif;
  font-size: 24px;
  font-weight: 500;
  line-height: 32px;
  letter-spacing: 0em;
  text-align: center;
}

#noedit {
  color: #cf2c79
}

.commenttext {
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 22px;
  letter-spacing: 0em;
  text-align: left;
  margin-left: 5px;
  word-break: break-all;
}

.commentperson {
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 24px;
  letter-spacing: 0em;
  text-align: left;
}

.placeholder {
  position: absolute;
  top: 0;
  left: 8px;
  /* Adjust this value to move the placeholder to the desired position */
  color: #999;
  pointer-events: none;
  margin-right: 2px;
  /* Adjust the margin as needed */
}



#autocompleteInput {
  padding-top: 20px;
  /* Adjust the padding to ensure content doesn't overlap with placeholder */
}

.placeholder1 {
  position: absolute;
  top: 0;
  left: 8px;
  /* Adjust this value to move the placeholder to the desired position */
  color: #999;
  pointer-events: none;
  margin-right: 2px;
  /* Adjust the margin as needed */
}

#autocompleteInput1 {
  padding-top: 20px;
  /* Adjust the padding to ensure content doesn't overlap with placeholder */
}


.posturcomment {
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 18px;
  letter-spacing: 0em;
  text-align: left;
  color: #808991;
}

.commenttextholder::placeholder {
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 16px;
  letter-spacing: 0em;
  text-align: left;
  color: var(--UB-Font-Light, #808991) !important;
}

form::-webkit-scrollbar {
  width: 10px;
  border-radius: 50% 50%;
  margin-top: 10px;
}

form::-webkit-scrollbar-track {
  background: #f1f1f1;

}

form::-webkit-scrollbar-thumb {
  background: #d7d7d7;
}

form::-webkit-scrollbar-thumb:hover {
  background: #c4c2c2;
}

.spinner-border {
  width: 22px;
  height: 22px;
  border-width: 0.20em;
}

#otp1,
#otp2,
#otp3,
#otp4 {
  box-shadow: none !important;
  border: 1px solid #D2D5DB;
}

.zoom-box {
  width: 500px;
  height: 300px;
  overflow: hidden;
  border: 1px solid #ccc;
}

.suggestionItemsearch {
  padding: 10px;
  cursor: pointer;
  transition: background-color 0.3s ease;
  text-decoration: none;
}

.suggestionItemsearch1 {
  padding: 10px;
  cursor: pointer;
  transition: background-color 0.3s ease;
  text-decoration: none;
}

#place {
  border: none;
}

.hashtag {
  color: #BB1E68;
}

.mention {
  color: #BB1E68;
}

.suggestionItemsearch:hover {
  background-color: #f1f1f1;
}

.suggestionItemsearch a {
  text-decoration: none;
  color: black;
}

.suggestionItemsearch1:hover {
  background-color: #f1f1f1;
}

.suggestionItemsearch1 a {
  text-decoration: none;
  color: black;
}

.suggestionItemplace {
  padding: 10px;
  cursor: pointer;
  transition: background-color 0.3s ease;
  text-decoration: none;
}

.hoverit:hover {
  background-color: #eff3f4;
  border-radius: 50%;
}

.hoverit {
  background-color: transparent;
}

.suggestionItemplace:hover {
  background-color: #f1f1f1;
}

.suggestionItemplace a {
  text-decoration: none;
  color: black;
}

#zoomImage {
  width: 100%;
  height: auto;
  transition: transform 0.3s ease;
}

.successfully {
  color: var(--UB-Primary-Font-Color, #0F141A);
  text-align: center;
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
}

.expshare {
  color: var(--UB-Secondary-Font-Color, #4F5F6D);
  text-align: center;
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 22px;
}

.highlight {
  color: #0075ff;
}

.posttext1 {
  color: var(--UB-Primary-Font-Color, #0F141A) !important;
  font-family: "Inter", sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 440 !important;
  line-height: 22px;
}


.m-cheight {
  height: 540px;
}
.me-height{
  height: 500px;
}

.visitcommunity:hover {
  color: #CF2C79;
  background-color: rgba(207, 44, 121, 0.06);
  ;

}

.cbody {
  height: max-content;
  border-radius: 16px 16px 0px 0px;
  border-top: 1px solid var(--Outline-2, #EBEEF0);
  border-right: 1px solid var(--Outline-2, #EBEEF0);
  border-left: 1px solid var(--Outline-2, #EBEEF0);
  background: var(--US-White, #FFF);
  border-bottom: 1px solid white;
}

.supportnw {
  color: var(--UB-Secondary-Font-Color, #4F5F6D);
  text-align: center;
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 22px;
  /* 157.143% */
}

.ctitle {
  color: var(--US-PC, #CF2C79);
  text-align: center;
  font-family: "Inter", sans-serif;

  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: 34px;
}

.svg1 {
  height: 10px;
  width: 10px;
}

.ctexts {
  color: var(--UB-Primary-Font-Color, #0F141A);
  text-align: center;
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 30px;
}

.contri {
  color: var(--UB-Secondary-Font-Color, #4F5F6D);
  text-align: center;
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 30px;
}

.visitcommunity {
  color: var(--US-Primary-Dark, #BB1E68);
  text-align: center;
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 26px;
  border-radius: 4px;
  height: 54px;
  width: 220px;
  background-color: white;
  border: 1px solid var(--US-PC, #CF2C79);
  /* 162.5% */
}

.vasantnagarinwhitefield {
  color: var(--US-PC, #CF2C79);
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 22px;
  /* 137.5% */
  letter-spacing: -0.32px;
}

.manyppl,
.manyppls {
  line-height: 24px !important;/
}

.serialno {
  color: #D02C79;
  font-family: "Inter", sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: 500;
  height: 40px;
  width: 40px;
  text-align: center;
  background-color: #f5dee9;
  border: 1px solid transparent;
  border-radius: 50% 50%;
}

.gotocom:hover {
  cursor: pointer;
  background: rgba(207, 44, 121, 0.06);
  color: #cf2c79 !important;
}

.supbyppl {
  color: var(--UB-Secondary-Font-Color, #4F5F6D);
  font-family: "Inter", sans-serif;
  font-size: clamp(12px, 2vw, 14px) !important;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
  /* 171.429% */
  letter-spacing: -0.28px;
}

.gotocom {
  color: #CF2C79 !important;
  text-align: center;
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 22px;
  /* 157.143% */
  border-radius: 8px;
  border: 1px solid var(--US-PC, #CF2C79);
  background: var(--US-White, #FFF);
  width: 245px;
  height: 40px;
  flex-shrink: 0;
}

.issuein {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 24px;
  /* 150% */
}

.topcommunities {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: 22px;
}



.spinner-border div {
  width: 25px;
  height: 25px;
}

#agency {
  color: var(--US-PC, #CF2C79);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 24px;
  /* 171.429% */
  letter-spacing: -0.28px;
}

.han {
  color: var(--UB-Primary-Font-Color, #0F141A);
  font-family: "Inter", sans-serif;
  font-size: clamp(18px, 2vw, 20px) !important;
  font-style: normal;
  font-weight: 600;
  line-height: 26px;
}