@import url(https://cdn.jsdelivr.net/npm/@xz/fonts@1/serve/metropolis.min.css);

#e0-11 h3,
#e0-11 span {
  font-weight: 500;
  width: 100%;
  z-index: 2;
}

#opti-1,
#opti-2 {
  position: absolute;
  padding-left: 10px;
  padding-right: 10px;
  gap: 10px;
}

#areaName,
#o-1 {
  top: 75px;
  text-align: center;
}

#e0-11,
#inp-1,
#inp-2,
#options-12 #z-12n,
#searchArea,
#top-1,
#z-01 {
  position: relative;
}

#canc,
#comp {
  left: 4424px;
  top: 906px;
  background: 0 0;
}

#areaName,
#cat-0-drop ul li,
#data-p span,
#e0-11 h3,
#e0-11 span,
#edit,
#for-foo,
#h-a,
#h-b,
#hea,
#o-1,
#or-00,
#p0,
#r-0,
#r-1,
#top-1 h3,
.circle {
  text-align: center;
}

#loader-ac img,
.r-0-109 img {
  position: relative !important;
  left: 0 !important;
  top: 0 !important;
}

#cat-0-drop #pinkiText-34,
#comp,
#inp-4 span,
#o-1 span,
#p-19,
#pText {
  color: #f04e58;
}

#e0-11 h3,
#enter-yr,
#opti-1 div,
#opti-2 div,
#options-12 #z-12n {
  text-transform: capitalize;
}

#e0-11 h3,
#top-1 h3,
#top-g h3 {
  line-height: 24px;
}

#for-foo,
#h-a,
#h-b,
#special-1 {
  line-height: 16px;
}

#inp-4 button div,
#pin0 p,
.almost-modal {
  margin: 0 !important;
}

#pin0,
#pin0 p {
  color: #f04e58 !important;
}

#o-1,
#o-1-1,
#top-g p {
  line-height: 0;
}

#inp-1,
#inp-2,
#inp-3,
#inp-mob-2 {
  width: fit-content;
  align-self: center;
  gap: 3px;
}

.activeSlide-1 {
  height: 620px;
}

.activeSlide-1 .modal-content {
  margin: 10px;
  height: 100% !important;
}

#e0-11 {
  height: 100%;
  width: 100%;
  border-radius: 10px;
}

#e0-11 #img-wrapper-1 {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  height: 100%;
  width: 100%;
  border-radius: 10px;
}

#e0-11 div img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 5px;
  object-position: top;
}

#e0-11 h3 {
  color: #fff;
  position: absolute;
  top: 185px;
  font-family: Metropolis, sans-serif;
  font-style: normal;
  font-size: 25px;
}

#btn-wrapper-11 button,
#e0-11 span,
#o-1 {
  font-size: 20px;
  font-family: Metropolis, sans-serif;
  font-style: normal;
  color: #000;
}

#e0-11 span {
  position: absolute;
  top: 260px;
  line-height: 25px;
  color: #fff;
}

#e0-11 #btn-wrapper-11 {
  position: absolute;
  bottom: 75px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: fit-content;
  z-index: 2;
}

#btn-wrapper-11 button {
  width: 254px;
  height: 52px;
  background: #f04e58;
  border-radius: 10px;
  outline: 0;
  border: none;
  font-weight: 400;
}

#area-wrapper span,
#area-wrapper2 span,
#h-a,
#h-b,
#o-1,
#r-0,
#r-1,
#top-1 h3 {
  font-weight: 500;
}

#custom-slider-09 .DayPicker-Day,
.modal-content {
  border: none !important;
}

#z-01 {
  height: 100%;
}

#top-1 {
  height: 30%;
}

#img-wrapper-11 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 100%;
}

#img-wrapper-11 img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-top-left-radius: 7px;
  position: absolute;
  border-top-right-radius: 7px;
}

#top-1 h3 {
  font-family: Metropolis, sans-serif;
  font-style: normal;
  font-size: 24px;
  color: #000;
  top: 25px;
  width: 100%;
  z-index: 2;
}

#o-1 {
  width: 100%;
  z-index: 2;
}

#r-0,
#r-1 {
  position: absolute;
  width: 100%;
  bottom: 30px;
  font-family: Metropolis, sans-serif;
  font-style: normal;
  font-size: 22px;
  letter-spacing: -0.02em;
  color: #000;
  z-index: 2;
}

#h-a,
#h-b {
  position: absolute;
  bottom: 10px;
  width: 100%;
  font-family: Metropolis, sans-serif;
  font-style: normal;
  font-size: 16px;
  color: #000;
  text-transform: uppercase;
  z-index: 2;
}

#top-2 {
  background: #fff;
  height: 71%;
  position: absolute;
  width: 100%;
  top: 188px;
  border-radius: 5px;
}

#hea {
  top: 24px;
  position: absolute;
  font-family: Metropolis;
  font-size: 30px;
  font-weight: 300;
  line-height: 20px;
  text-align: center;
  color: rgba(74, 38, 110, 1);
  width: 100%;
}

#edit,
#options-12 #z-12n,
.circle {
  font-weight: 400;
  font-family: Metropolis, sans-serif;
  font-style: normal;
  color: #888;
}

#opti-1 {
  top: 77px;
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

#opti-1 div,
#opti-2 div {
  height: 110px;
  border: 1px solid #DAB5FF;
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-family: Metropolis, sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 12px;
  line-height: 20px;
  color: #333;
  width: 110px;
  position: relative;
  gap: 6px;
  cursor: pointer;
}

#opti-2,
#z-12n div {
  width: 100%;
  display: flex;
  flex-direction: row;
}

#opti-1 div img,
#opti-2 div img {
  width: 100%;
  height: 84px;
  object-fit: scale-down;
}

#opti-2 {
  top: 203px;
  justify-content: center;
  align-items: center;
}

#options-12 #z-12n {
  cursor: pointer;
  width: 355px;
  padding: 10px;
  border: 0.5px solid #888;
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-size: 16px;
  line-height: 20px;
  background: #fff;
  height: 100%;
  background: #fff;
  /* border: 1px solid rgba(74, 38, 110, 1); */
  border: 1px solid #DAB5FF;
  /* filter: brightness(1.3); */
}

#z-12n div {
  justify-content: space-evenly;
  align-items: center;
}

#options-12,
#stages-wrapper {
  flex-direction: row;
  width: 100%;
  display: flex;
  position: absolute;
}

#options-12 {
  top: 350px;
  justify-content: center;
  align-items: center;
  padding: 0 36px;
}

#stages-wrapper {
  display: none;
  justify-content: center;
  align-items: center;
  gap: 5px;
  top: 24px;
  padding: 0 10px;
}

.pcircle {
  width: 30px;
  height: 30px;
  border: 1px solid #F04E58;
  border-radius: 50%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  box-sizing: border-box;
}

.pink {
  background: #f04e58;

  width: 37.66px;
  height: 0.77px;
}

.circle {
  align-items: center;
  justify-content: center;
  flex-direction: row;
  width: 25px;
  height: 25px;
  border: 1px solid #b9b9b9;
  border-radius: 100%;
  display: flex;
  font-size: 12px;
}

#edit,
#searchArea {
  flex-direction: row;
  display: flex;
  width: 100%;
}

.grey {
  width: 37.66px;
  height: 0.77px;
  background: #b9b9b9;
}

#edit {
  justify-content: center;
  font-size: 14px;
  line-height: 14px;
  align-items: center;
  gap: 5px;
  position: absolute;
  top: 73px;
  cursor: pointer;
}

#areaName {
  font-family: Metropolis, sans-serif !important;
  font-style: normal !important;
  font-weight: 500 !important;
  font-size: 20px !important;
  text-align: center !important;
  color: #333 !important;
  line-height: 24px !important;
  position: absolute !important;
  top: 60px !important;
  width: 100% !important;
}

#searchArea {
  display: flex !important;
  flex-direction: row !important;
  justify-content: center !important;
  align-items: center !important;
  position: absolute !important;
  top: 330px !important;
  width: 424px !important;
  max-width: 100% !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
}

#searchArea img {
  position: absolute !important;
  left: 16px !important;
  top: 14px !important;
  height: 22px !important;
  width: 22px !important;
  filter: invert(41%) sepia(85%) saturate(3015%) hue-rotate(334deg) brightness(96%) contrast(97%) !important;
}

#area-wrapper,
#area-wrapper2,
#for-foo,
#inp-3,
#or-00,
.r-0-109 span {
  position: absolute;
}

#searchArea input {
  width: 424px !important;
  max-width: 100% !important;
  height: 50px !important;
  border: 0.5px solid #888;
  border-radius: 10px;
  outline: 0;
  padding-left: 45px;
  padding-top: 0;
}

#area-wrapper span,
#area-wrapper2 span,
#inp-1 input,
#inp-3 input {
  border: 0.5px solid #888;
  font-family: Metropolis, sans-serif;
  font-style: normal;
}

#area-wrapper {
  position: absolute !important;
  top: 127px !important;
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 15px !important;
  padding: 0px !important;
  width: calc(100% - 40px) !important;
  max-width: 424px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  justify-content: center !important;
}
#area-wrapper2{
   position: absolute !important;
  top: 120px !important;
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 15px !important;
  padding: 0px !important;
  width: calc(100% - 40px) !important;
  max-width: 424px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  justify-content: center !important;
}

#area-wrapper span,
#area-wrapper2 span {
  width: auto !important;
  height: 52px !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 10px !important;
  justify-content: center !important;
  font-family: Metropolis, sans-serif !important;
  font-style: normal !important;
  font-weight: 500 !important;
  font-size: 15px !important;
  display: flex !important;
  align-items: center !important;
  color: #333333 !important;
  flex: none !important;
  cursor: pointer !important;
  background-color: #ffffff !important;
  transition: all 0.2s ease !important;
}
#area-wrapper span:hover,
#area-wrapper2 span:hover {
  border-color: #b9b9b9 !important;
}
#area-wrapper2 span {
  height: 71px !important;
}

#inp-1,
#uni-1 {
  flex-direction: column;
  display: flex;
}

#uni-1 {
  gap: 16px;
}

#uni-1 p {
  margin: 0;
}

#small-time {
  margin: 0;
  font-family: Metropolis, sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 12px;
  line-height: 12px;
  display: flex;
  align-items: center;
  color: #333;
}

#inp-1 input,
#inp-2 #co-0,
#inp-2 input,
#inp-3 input,
#inp-mob-2 #co-0,
#inp-mob-2 input,
#or-00 {
  font-size: 16px;
  font-weight: 400;
}

#b-11,
.time-z-1 {
  justify-content: center;
}

#inp-3 div,
.r-0-109 span {
  flex-direction: row;
  cursor: pointer;
}

#for-foo {
  top: 95px !important;
  font-family: Metropolis, sans-serif;
  font-style: normal;
  font-weight: 500;
  font-size: 14px !important;
  color: #777777 !important;
  width: 100%;
  text-align: center !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
}
.b-11 {
  top: 170px !important;
}

.r-0,
.r-0-109 {
  top: 365px !important;
}

.r-0-109 input {
  width: 241px !important;
  height: 46px !important;
  border: 0.5px solid #888 !important;
  border-radius: 40px !important;
  padding-left: 10px !important;
}

.r-0-109 span {
  width: 50px;
  height: 50px;
  border: 1px solid #f04e58;
  border-radius: 40px;
  right: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  top: 0;
}

.r-0 img {
  left: auto !important;
}

#inp-1 {
  top: 215px;
  justify-content: center;
  align-items: center;
}

#inp-1 input,
#inp-3 input {
  width: 277px;
  height: 48px;
  border-radius: 5px;
  padding-left: 15px;
  line-height: 20px;
  color: #888;
  outline: 0;
  letter-spacing: 1px;
}

#inp-2 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  top: 285px;
}

#inp-2 #sig,
#inp-2 #sigOne,
#inp-mob-2 #sig,
#inp-mob-2 #sigOne {
  width: 277px;
  height: 48px;
  align-items: center;
  display: flex;
  position: relative;
}

#inp-2 #sig,
#inp-mob-2 #sig {
  border: 0.5px solid #888;
  border-radius: 5px;
}

#inp-2 #sigOne,
#inp-mob-2 #sigOne {
  border: 2px solid #f04e58 !important;
  border-radius: 5px;
}

#inp-2 #co-0,
#inp-mob-2 #co-0 {
  padding-left: 6px;
  font-family: Metropolis, sans-serif;
  font-style: normal;
  line-height: 20px;
  color: #000;
  height: 100%;
  width: 20%;
  display: flex;
  align-items: center;
  border-radius: 5px;
  gap: 4px;
  cursor: pointer;
  font-size: 13px !important;
}

#inp-2 input,
#inp-mob-2 input {
  width: 80%;
  height: 100%;
  border: none;
  outline: 0;
  padding-left: 15px;
  font-family: Metropolis, sans-serif;
  font-style: normal;
  line-height: 20px;
  color: #888;
  border-radius: 5px;
  letter-spacing: 1px;
}

#inp-3 span,
#inp-4 span {
  font-family: Metropolis, sans-serif;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
}

#comp,
#inp-3 div {
  border: 0.5px solid #888;
  width: 277px;
  height: 41px;
}

#inp-3 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  top: 355px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

#or-00 {
  font-family: Metropolis, sans-serif;
  font-style: normal;
  line-height: 20px;
  color: #888;
  width: 100%;
  top: 184px;
}

#inp-3 span {
  color: red;
  margin-left: 70px;
  font-size: 10px;
}

#inp-3 div {
  border-radius: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
}

#data-p,
#inp-4 {
  display: flex;
  flex-direction: row;
  width: 100%;
  position: absolute;
}

#inp-4 {
  top: 127px;
  justify-content: center;
  align-items: center;
}

#inp-4 span {
  font-size: 14px;
}

#inp-4 button {
  width: 277px;
  background-color: #fff !important;
  color: rgba(0, 0, 0, 0.54) !important;
  padding: 0 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  font-family: Roboto, sans-serif !important;
  border: 0.5px solid #888 !important;
  border-radius: 10px !important;
  display: flex !important;
  flex-direction: row !important;
  justify-content: center !important;
  align-items: center !important;
  box-shadow: none !important;
  gap: 15px !important;
}

#canc,
#comp,
#cont-btn button,
#data-p span,
#p0 {
  font-weight: 500;
}

#canc,
#comp,
#cont-btn button,
#data-p span,
#indi-1,
#indi-2,
#p0 {
  font-family: Metropolis, sans-serif;
  font-style: normal;
  line-height: 20px;
}

#inp-4 button div {
  border-radius: 2px !important;
  padding: 0 !important;
}

#data-p {
  top: 442px;
  justify-content: center;
  align-items: center;
  gap: 6px;
}

#cont-btn,
#custom-slider-09 {
  flex-direction: row;
  display: flex;
}

#data-p span {
  font-size: 12px;
  color: #000;
}

#canc,
#comp,
#cont-btn button {
  font-size: 16px;
}

#cont-btn {
  position: absolute;
  top: 466px;
  justify-content: center;
  align-items: center;
  width: 100%;
}

#cont-btn button {
  width: 277px;
  height: 41px;
  background: #f04e58;
  border-radius: 10px;
  border: none;
  outline: 0;
  color: #fff;
}

.almost-modal {
  position: absolute !important;
  width: 100% !important;
  height: 100%;
  background: transparent;
}

#comp {
  border-radius: 10px;
}

#canc {
  width: 277px;
  height: 41px;
  border: 0.5px solid #888;
  border-radius: 10px;
  color: #f04e58;
}

#p0 {
  font-size: 20px;
  color: #333;
  margin-top: 24px;
}

#indi-1,
#indi-2 {
  font-weight: 400;
  font-size: 12px;
  color: #888;
}

#gText,
#pText {
  font-weight: 400;
  font-size: 14px;
  margin-top: 2px;
  padding: 0;
  font-family: Metropolis, sans-serif;
  font-style: normal;
}

#areaName.are09 {
  text-decoration: none !important;
}
#custom-slider-09 {
  position: relative;
  top: 0 !important;
  margin-top: 0 !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow: visible;
  height: auto !important;
  min-height: 330px;
  width: 100%;
}
#custom-slider-09 .DayPicker {
  display: block !important;
  width: 100% !important;
  max-width: 380px !important;
  margin: 0 auto !important;
}
#custom-slider-09 .DayPicker-wrapper {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  position: relative !important;
  width: 100% !important;
  max-width: 380px !important;
  height: auto !important;
  border: none !important;
  border-radius: 0px !important;
  outline: none !important;
  background: none !important;
  padding-bottom: 10px !important;
}
#custom-slider-09 .DayPicker-Months {
  order: 1 !important;
  display: block !important;
  height: auto !important;
  width: 100% !important;
}
#custom-slider-09 .DayPicker-Month {
  display: table !important;
  width: 100% !important;
  border-collapse: separate !important;
  border-spacing: 0px 5px !important;
}
#custom-slider-09 .DayPicker-Weekdays {
  display: table-header-group !important;
  width: 100% !important;
}
#custom-slider-09 .DayPicker-WeekdaysRow {
  display: table-row !important;
  width: 100% !important;
}
#custom-slider-09 .DayPicker-Weekday {
  display: table-cell !important;
  text-align: center !important;
  padding: 8px 0 !important;
  font-family: Metropolis, sans-serif !important;
  font-style: normal !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  color: #777777 !important;
}
#custom-slider-09 .DayPicker-Weekday abbr[data-original-title],
abbr[title] {
  border: none !important;
  text-decoration: none !important;
  cursor: none !important;
}
#custom-slider-09 .DayPicker-Caption div {
  font-family: Metropolis, sans-serif !important;
  font-style: normal !important;
  font-weight: 500 !important;
  font-size: 15px !important;
  line-height: 22px !important;
  letter-spacing: normal !important;
  text-transform: capitalize !important;
  color: #5C5C5C !important;
  text-align: center !important;
}
#custom-slider-09 .DayPicker-Caption {
  text-align: center !important;
  margin-bottom: 20px !important;
  margin-top: 10px !important;
}
#custom-slider-09 .DayPicker-Body {
  display: table-row-group !important;
  width: 100% !important;
}
#custom-slider-09 .DayPicker-Week {
  display: table-row !important;
  width: 100% !important;
}
#custom-slider-09 .DayPicker-Day {
  display: table-cell !important;
  text-align: center !important;
  vertical-align: middle !important;
  padding: 8px 0 !important;
  font-family: Metropolis, sans-serif !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  color: #333333 !important;
  cursor: pointer !important;
}
#custom-slider-09 .DayPicker-Day--disabled,
#custom-slider-09 .DayPicker-Day--outside {
  color: #cccccc !important;
  cursor: default !important;
  pointer-events: none !important;
  opacity: 0.5 !important;
}
#custom-slider-09 .DayPicker-Day--selected:not(.DayPicker-Day--disabled):not(.DayPicker-Day--outside) {
  position: relative !important;
  background: none !important;
  color: #f04e58 !important;
  z-index: 1 !important;
}
#custom-slider-09 .DayPicker-Day--selected:not(.DayPicker-Day--disabled):not(.DayPicker-Day--outside)::before {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: 36px !important;
  height: 36px !important;
  border: 1px solid #f04e58 !important;
  background-color: #fff2f3 !important;
  border-radius: 50% !important;
  z-index: -1 !important;
}
#custom-slider-09 .DayPicker-Day:hover:not(.DayPicker-Day--disabled):not(.DayPicker-Day--outside) {
  position: relative !important;
  background: none !important;
}
#custom-slider-09 .DayPicker-Day:hover:not(.DayPicker-Day--disabled):not(.DayPicker-Day--outside)::before {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: 36px !important;
  height: 36px !important;
  background-color: #f5f5f5 !important;
  border-radius: 50% !important;
  z-index: -1 !important;
}
#custom-slider-09 .DayPicker-NavBar {
  order: 2 !important;
  position: relative !important;
  top: auto !important;
  bottom: auto !important;
  left: auto !important;
  right: auto !important;
  display: flex !important;
  flex-direction: row !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  gap: 36px !important;
  margin-top: 35px !important;
  margin-bottom: 15px !important;
}
#custom-slider-09 .DayPicker-NavButton {
  position: relative !important;
  cursor: pointer !important;
  background: none !important;
  background-image: none !important;
  border: none !important;
  width: 24px !important;
  height: 24px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  outline: none !important;
}

#custom-slider-09 .DayPicker-NavButton--prev,
#custom-slider-09 .DayPicker-NavButton--next {
  background-image: none !important;
}

.enquiryDateSlide .DayPicker-NavButton,
.enquiryDateSlide .DayPicker-NavButton--prev,
.enquiryDateSlide .DayPicker-NavButton--next {
  background-image: none !important;
}
#custom-slider-09 .DayPicker-NavButton--prev::after {
  content: "<" !important;
  font-family: monospace, sans-serif !important;
  font-size: 20px !important;
  color: #333333 !important;
  font-weight: bold !important;
}
#custom-slider-09 .DayPicker-NavButton--next::after {
  content: ">" !important;
  font-family: monospace, sans-serif !important;
  font-size: 20px !important;
  color: #333333 !important;
  font-weight: bold !important;
}
#custom-slider-09 .DayPicker-NavBar span {
  position: relative !important;
}

#cat-0-drop ul,
#dropDown-code,
#dropDown-code-modal {
  flex-direction: column;
  height: 180px;
  overflow: auto;
  display: flex;
}

#custom-slider-09 .DayPicker-NavBar span {
  position: relative !important;
}

#dropDown-code,
#dropDown-code-modal {
  background: #fff;
  border: 1px solid #3333;
  z-index: 1000 !important;
  padding: 15px;
  align-items: flex-start;
  position: absolute;
  left: 0;
  top: 47px;
  border-radius: 10px;
  width: 137px;
  line-height: 2;
}

#dropDown-code ul,
#dropDown-code-modal ul {
  padding: 0;
  margin: 0;
}

#dropDown-code ul li,
#dropDown-code-modal ul li {
  text-decoration: none;
  list-style: none;
  letter-spacing: 1px;
  font-family: Metropolis, sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  color: #333;
  cursor: pointer;
}

#cat-0-drop {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  margin-top: 0;
  align-items: center;
  gap: 23px;
  position: absolute;
  top: 100%;
  background: #fff;
  border: 0.5px solid #888;
  border-radius: 10px;
}

#io0-bla,
#io0-bla-1,
#io0-blaa-0,
.loader-new-login {
  background: none;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
}

#cat-0-drop ul {
  padding: 12px;
  list-style: none;
  line-height: 1.7;
  width: 100%;
  align-items: center;
  gap: 10px;
}

#cat-0-drop ul li {
  width: 100%;
  border-bottom: 2px solid #d9d9d9;
  cursor: pointer;
}

.mainEnquirySlider.modal-dialog.modal-lg {
  border-radius: 10px;
}

#m-04 {
  margin-top: 35px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: relative;
  align-self: center;
}

.a-76 ul {
  background: #fff;
  z-index: 1;
  height: 140px;
}

#loader-43 {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  background: rgba(255, 255, 255, 0.25);
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
  backdrop-filter: blur(4px);
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  bottom: 0;
  z-index: 99999;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

#pText,
.gCircle {
  flex-direction: row;
  display: flex;
}

#loader-ac {
  height: 30px;
  width: 30px;
}

#loader-ac img {
  height: 100%;
  width: 100%;
  animation: 4s linear infinite spin;
}

#m-0 {
  position: relative;
  width: 100%;
}

#inp-1 input:focus,
#inp-3 input:focus,
#pin0 {
  border: 2px solid #f04e58 !important;
}

.gCircle {
  width: 30px;
  height: 30px;
  border: 1px solid #b9b9b9;
  border-radius: 50%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  box-sizing: border-box;
}

#pText {
  justify-content: center;
  align-items: center;
  height: 100%;
  width: 100%;
}

#gText {
  color: #888;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  height: 100%;
  width: 100%;
}

#enter-yr,
#top-g h3 {
  font-size: 24px;
  text-align: center;
}

#err-09,
#err-10 {
  display: flex;
  align-items: center;
  gap: 5px;
  width: 100%;
}

#enter-yr {
  display: block !important;
  font-family: Metropolis, sans-serif;
  font-style: normal;
  font-weight: 600;
  line-height: 29px;
  color: #333;
  position: absolute;
  top: 24px;
  width: 100%;
}

#err-09,
#err-10,
#err-11 {
  font-family: Metropolis, sans-serif;
  font-style: normal;
  font-weight: 500;
  font-size: 10px;
  line-height: 20px;
  color: red;
}

#err-09 {
  top: 218px;
  z-index: 2;
}

#err-10 {
  top: 290px;
}

#err-11 {
  text-align: center;
  margin-top: 3px;
}

#err-12,
#special-1 {
  font-size: 16px;
  display: flex;
  font-family: Metropolis, sans-serif;
  font-style: normal;
  font-weight: 500;
}

#err-12 {
  position: absolute;
  top: 61px;
  line-height: 20px;
  color: red;
  width: 100%;
  text-align: center;
  align-items: center;
  justify-content: center;
  gap: 4px;
}

#err-12 span {
  height: 18px;
  width: 18px;
}

#top-g {
  height: 30%;
  position: relative;
}

#img-wrapper-12 {
  position: absolute;
  height: 100%;
  width: 100%;
}

#img-wrapper-12 img {
  position: absolute;
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
}

#io0-bla-1 {
  height: 100%;
  width: 100%;
  z-index: 1;
}

#top-g h3 {
  width: 96%;
  font-family: Metropolis, sans-serif;
  font-style: normal;
  font-weight: 500;
  color: #000;
  z-index: 1;
  margin: 0;
  /* margin-top: 30px; */
}

#top-g p {
  margin: 0;
  margin-top: 10px;
  font-family: Metropolis, sans-serif;
  font-style: normal;
  font-weight: 500;
  font-size: 20px;
  color: #000;
  width: 80%;
  z-index: 1;
  text-align: center;
  /* line-height: 25px; */
  display: flex;
  justify-content: center;
}

#io0-bla,
#io0-blaa-0 {
  display: block !important;
  height: 100%;
  width: 100%;
  z-index: 1;
}

#co-0 img {
  height: 10px;
  width: 10px;
}

#special-con-9 {
  position: absolute;
  z-index: 1;
  top: 110px;
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 20px;
}

#special-1 {
  color: #000;
  flex-direction: row;
  justify-content: center;
  align-items: baseline;
  gap: 8px;
}

#pin0 {
  display: flex !important;
}

.in {
  z-index: 99999 !important;
}

#pin0 {
  flex-direction: column !important;
}

#special-con-10 {
  position: absolute;
  z-index: 1;
  width: 100%;
}

.loader-new-login {
  width: 100%;
  height: 100%;
}

#top-3 {
  height: 70%;
  position: absolute;
  top: auto;
  display: flex;
  flex-direction: column;
  width: 100%;
  border-radius: 5px;
}

#special-1 #img-0912 {
  height: 27px;
  width: 27px;
}

#special-1 #img-0912 img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.in {
  flex-direction: column !important;
  justify-content: center !important;
  align-items: inherit !important;
  background-color: #e9e2ff !important;
  display: flex !important;
}

.mainEnquirySlider {
  box-shadow: none !important;
  top: 0 !important;
}
body.lead-popup-open,
body.vendor-enquiry-modal-open,
body.modal-open,
html:has(body.lead-popup-open),
html:has(body.vendor-enquiry-modal-open) {
  overflow: hidden !important;
  overflow-x: hidden !important;
  overflow-y: hidden !important;
}
.modal:has(.mainEnquirySlider),
.modal.in:has(.mainEnquirySlider),
.modal.show:has(.mainEnquirySlider),
.modal.vendor-enquiry-modal,
.modal.vendor-enquiry-modal.in,
.modal.vendor-enquiry-modal.show,
body.lead-popup-open .modal,
body.vendor-enquiry-modal-open .modal {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  overflow-x: hidden !important;
  overflow-y: hidden !important;
}
@media screen and (min-width: 769px) {
  .modal:has(.mainEnquirySlider),
  .modal.in:has(.mainEnquirySlider),
  .modal.show:has(.mainEnquirySlider),
  .modal.vendor-enquiry-modal,
  .modal.vendor-enquiry-modal.in,
  .modal.vendor-enquiry-modal.show,
  body.lead-popup-open .modal,
  body.vendor-enquiry-modal-open .modal {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    overflow-x: hidden !important;
    overflow-y: hidden !important;
  }
  .modal-dialog.mainEnquirySlider,
  .modal.vendor-enquiry-modal .modal-dialog,
  .vendor-enquiry-modal .modal-dialog.mainEnquirySlider,
  .modal:has(.mainEnquirySlider) .modal-dialog {
    top: 0 !important;
    transform: none !important;
    -webkit-transform: none !important;
    margin: auto !important;
    position: relative !important;
    max-height: calc(100vh - 40px) !important;
  }
  .mainEnquirySlider .modal-content,
  .vendor-enquiry-modal .modal-content {
    margin: 0 !important;
    height: 100% !important;
  }
}

#o-1-1 {
  font-family: Metropolis, sans-serif;
  font-style: normal;
  font-weight: 500;
  font-size: 20px;
  color: #000;
  width: 100%;
  z-index: 1;
  text-align: center;
  display: flex;
  justify-content: center;
}

#noth-4,
#noth-5,
#noth-6 {
  font-family: Metropolis, sans-serif;
  font-style: normal;
  font-weight: 500;
  line-height: 14px;
  color: #f04e58 !important;
  animation-duration: 1s;
  top: -15px;
  font-size: 15px;
  background: #fff;
  z-index: 0.9;
  padding: 5px;
  position: absolute;
}

#em-08,
#em-09,
#em-10,
.g-icon {
  display: none;
}

#noth-5 {
  left: 10px;
  animation-name: phoneamination;
}

#noth-6 {
  left: 40px;
  animation-name: emailAni;
}

#noth-4 {
  left: 10px;
  animation-name: emailanimation;
}

@keyframes phoneamination {
  from {
    top: 26%;
  }

  to {
    top: -15px;
  }
}

@keyframes emailAni {
  from {
    top: 26%;
    left: 72px;
  }

  to {
    top: -15px;
    left: 10px;
  }
}

@keyframes emailanimation {
  from {
    top: 26%;
    left: 72px;
  }

  to {
    top: -15px;
    left: 10px;
  }
}

#n-o-0 {
  width: 90%;
  height: 100%;
  filter: contrast(150%);
  background: #fff;
  color: rgba(74, 38, 110, 1);
  font-size: 16px;
  margin-left: 23px;
  font-weight: 400;
}

#want-this-venue {
  margin-top: 0 !important;
  color: #fff !important;
  padding: 10px 60px !important;
  font-size: 16px !important;
  border-radius: 5px !important;
}

.confirm-btn-container {
  display: flex;
  width: 100%;
  gap: 10px;
}

.main_venue_btn {
  border: 1px solid #f04e58 !important;
}

@media screen and (max-width: 768px) {
  .mainEnquirySlider {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    width: calc(100% - 20px) !important;
    transform: translate(-50%, -50%) !important;
    margin: 0 !important;
  }
  #options-12 {
    padding: 0 10px;
  }

  #options-12 #z-12n {
    width: 100% !important;
  }

  #o-1-1,
  #suc-text {
    font-size: 16px;
    color: #333;
    font-family: Metropolis, sans-serif;
    font-style: normal;
  }

  #main-almost-wrapper,
  .almost-modal .modal-content {
    background: 0 0;
    height: 100%;
  }

  #area-wrapper,
  #inp-2,
  #l-heading,
  #mini-al,
  #searchArea {
    position: absolute;
  }

  #for-foo,
  #suc-text,
  #top-1 h3 {
    text-align: center;
  }

  .success-prod-title-old {
    margin-bottom: 10px !important;
  }

  .success-prod-sub-title {
    margin-bottom: 15px !important;
  }

  #gText,
  #pText {
    margin: 0 !important;
    display: block !important;
    line-height: 30px !important;
    height: 30px !important;
    width: 30px !important;
    text-align: center !important;
    font-size: 14px !important;
  }
  .gCircle,
  .pcircle {
    width: 30px !important;
    height: 30px !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    box-sizing: border-box !important;
  }
  .pcircle img {
    /* width: 14px !important; */
    /* height: 14px !important; */
    display: block !important;
  }
  .pink,
  .grey {
    flex: 1 !important;
    min-width: 5px !important;
    max-width: 49px !important;
    height: 1px !important;
  }
  .success-modal {
    margin: 0 !important;
  }

  .success-modal .modal-content {
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: center !important;
    height: auto !important;
  }

  #special-1 #img-0912,
  #suc-img img {
    height: 70px;
    width: 70px;
  }

  #suc-wrapper {
    width: 100%;
    height: 280px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background: #fff;
    border-radius: 20px;
  }

  #suc-img {
    width: 54px;
    height: 54px;
    margin-bottom: 17px;
    margin-top: 0;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    border-radius: 100%;
  }

  .success-modal {
    height: 100% !important;
    width: 100% !important;
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: center !important;
  }

  #irritating-text {
    flex-direction: column;
    width: 100%;
    display: none;
    height: 100%;
  }

  #mini-al {
    flex-direction: column;
    width: 100%;
    display: flex;
    height: 100%;
  }

  #suc-text {
    font-weight: 500;
    line-height: 24px;
    margin: 0;
  }

  #inp-5 {
    margin-top: 35px;
  }

  #oc-opt {
    margin-top: 20px;
  }

  #cat-0-drop {
    bottom: 100%;
    top: auto;
  }

#top-g p {
  
}


  #irritating-text {
    display: none;
    position: relative;
    /* top: 3px; */
    top: 45px;
    gap: 15px;
  }

  .activeSlide-1 #irritating-text {
    display: flex;
  }


  #l-heading{
    font-size: 16px !important;
  }
#top-g h3 {
  font-size: 24px !important;
  margin-top: 50px;
}


  #r-1 {
    display: none;
  }

  #h-b{
    display: none;
  }
  #inp-4 {
    top: 68px;
  }

  #or-00 {
    top: 130px;
  }

  #inp-1 {
    top: 165px;
  }

  #inp-2 {
    top: 241px;
  }

  #inp-3 {
    top: 320px;
  }

  #data-p {
    top: 390px;
  }

  #cont-btn {
    top: 420px;
  }

  #o-1-1 {
    top: 59px;
  }

  #l-heading {
    font-size: 33px !important;
    top: 6px !important;
    width: 100% !important;
    text-transform: capitalize;
    line-height: 35px !important;
  }

  #special-1 #img-0912 img {
    height: 100%;
    width: 100%;
    object-fit: contain;
  }

  .time-z-1 {
    gap: 25px !important;
  }

  .time-z-1 span {
    height: 70px !important;
  }

  #h-a,
  #img-wrapper-11 img,
  #r-0,
  #special-con-10,
  #special-con-9 {
    display: none;
  }

  #o-2-2 {
    top: 90px !important;
    position: absolute;
    line-height: 30px !important;
    width: 100% !important;
    font-size: 22px !important;
    display: flex;
    justify-content: center;
  }

  #special-con-9 div {
    font-family: Metropolis, sans-serif;
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    line-height: 14px;
    color: #fff;
    flex: 0 0 44%;
  }

  #o-1,
  #top-1 h3 {
    font-family: Metropolis, sans-serif;
    font-style: normal;
    font-weight: 500;
    color: #333;
    display: flex;
    justify-content: center;
    font-size: 18px !important;
  }

  #enter-yr,
  #io0-bla {
    display: none !important;
  }

  #err-12 {
    top: 48px;
    font-size: 12px;
  }

  #custom-slider-09 .DayPicker-NavBar {
    top: auto !important;
    position: relative !important;
  }

#opti-1 div img,
#opti-2 div img {
  width: 100%;
  height: 71px;
  object-fit: scale-down;
}

  .a-01 {
    top: 205px !important;
  }

  .a-01 span,
  .b-11 span,
  .time-z-1 span {
    flex: 0 0 45% !important;
  }

  .r-0,
  .r-0-109 {
    top: 319px !important;
  }

  #area-wrapper span {
    flex: 0 0 29%;
    height: 45px;
    gap: 5px;
  }

  #areaName{
    font-weight: 500;
  }

  #area-wrapper {
    width: 310px !important;
        grid-template-columns:repeat(2, 1fr) !important;
    top: 175px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    padding: 0 13px;
    gap: 20px;
    justify-content: space-evenly;
  }

  #dropDown-code {
    top: 46px;
    left: 0;
  }

  #custom-slider-09 {
    margin-top: 140px;
    overflow: visible;
  }

  #main-almost-wrapper {
    position: relative;
  }

  #mini-al {
    bottom: 0;
    background: #fff;
    height: 250px;
    border-radius: 20px 20px 0 0;
    align-items: center;
    gap: 10px;
  }

  .b-1-z-z {
    gap: 16px !important;
    top: 165px !important;
  }

  .b-1-z-z span {
    width: 111px !important;
    height: 41px !important;
    border: 0.5px solid #888 !important;
    border-radius: 40px !important;
    font-family: Metropolis, sans-serif;
    font-style: normal !important;
    font-weight: 400 !important;
    font-size: 12px !important;
    line-height: 15px !important;
    color: #333 !important;
  }

  #searchArea {
    top: 455px !important;
    top: 145px;
  }

  #searchArea input {
        width: 314px !important;

  }

  #for-foo {
    top: 125px;
    width: 100%;
  }

  #o-1 {
    top: 59px;
    font-size: 16px;
    line-height: 16px;
  }

  #top-1 h3 {
    font-size: 20px;
    line-height: 20px;
    margin: 0;
  }

  #top-1 {
    height: 14%;
    border-bottom: 1px solid #e8e8e8;
  }

  #top-2 {
    height: 86%;
    top: -46px;
    display: flex;
    flex-direction: column;
  }
  #main-almost-wrapper {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
  }
  #mini-al {
    position: static !important;
    width: calc(100% - 20px) !important;
    height: 250px !important;
    border-radius: 20px !important;
  }
  .activeSlide-1 .modal-content {
    margin: 10px !important;
    border-radius: 10px;
  }
}

@media only screen and (min-width: 1200px) {

/* #area-wrapper{

  justify-content: center;
} */
  #enter-yr,
  #io0-bla {
    display: block !important;
    position: absolute;
  }

  #enter-yr,
  #suc-text {
    font-weight: 500;
    text-align: center;
  }

  #mini-al,
  #suc-wrapper,
  #top-2 {
    background: #fff;
    display: flex;
  }

  #img-wrapper-11,
  #top-1,
  #top-2,
  #top-3 {
    position: relative;
  }

  #img-wrapper-11,
  #io0-bla {
    top: 0;
    height: 100%;
    width: 100%;
    left: 0;
    right: 0;
  }

  #e0-11 h3,
  #e0-11 span {
    color: #fff;
    font-weight: 400;
  }

  #e0-11 span,
  #enter-yr,
  #suc-text,
  .circle,
  .pcircle {
    text-align: center;
  }

  #area-wrapper span,
  #irritating-text,
  #mini-al,
  #options-12,
  #suc-img,
  #suc-wrapper,
  #top-2,
  #top-3,
  #z-01 {
    display: flex;
  }

  #area-wrapper span,
  #enter-yr,
  #suc-text {
    font-family: Metropolis, sans-serif;
    font-style: normal;
    color: #333;
  }

  #areaName,
  #e0-11 span,
  #edit,
  #enter-yr,
  #inp-1,
  #inp-2,
  #inp-3,
  #io0-bla,
  #irritating-text,
  #options-12,
  #searchArea,
  #stages-wrapper {
    position: absolute;
  }

  .success-modal {
    height: 100% !important;
    width: 100% !important;
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: center !important;
    margin: 0 !important;
  }

  .circle,
  .gCircle,
  .pcircle {
    height: 30px;
    width: 30px;
  }

  #suc-wrapper {
    width: 514px;
    height: 260px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 20px;
    margin-top: 22px;
    margin-bottom: 24px;
    margin-right: 46px;
    margin-left: 46px;
  }

  #suc-img {
    margin-bottom: 0;
    width: 64px;
    height: 64px;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    border-radius: 100%;
  }

  #suc-text {
    font-size: 20px;
    line-height: 24px;
    margin: 0;
    padding-top: 24px;
    padding-bottom: 24px;
  }

  #options-12 #z-12n {
    width: 395px;
  }

  #irritating-text {
    width: 100%;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 24px;
  }

  #special-1 {
    justify-content: flex-start;
  }

  #special-con-10,
  #special-con-9 {
    padding: 0 16px;
  }

  .b-11,
  .time-z-1 {
    justify-content: center !important;
  }

  .mainEnquirySlider.modal-dialog.modal-lg {
    width: 974px !important;
    height: 588px !important;
  }

  #top-3 {
    height: 100%;
    top: auto;
    flex-direction: column;
    width: 61%;
    border-radius: 5px;
  }

  #top-g {
    top: auto;
    width: 40%;
    height: 100%;
  }

  #io0-bla {
    bottom: 0;
    background: none;
  }

  #m-0 {
    width: 100%;
    position: static;
  }

  .r-0,
  .r-0-109 {
    top: 335px !important;
  }

  .pcircle img {
    height: 16px;
    width: 16px;
  }

  #custom-slider-09 {
    margin-top: 120px;
    height: 330px;
    margin-top: 0;
  }

  #custom-slider-09 .DayPicker-NavBar {
    top: auto !important;
    position: relative !important;
  }

  #custom-slider-09 .DayPicker-wrapper {
    width: 440.62px;
    height: auto !important;
  }

  .almost-modal .modal-content {
    background: transparent;
    height: 100%;
  }

  #main-almost-wrapper {
    background: 0 0;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    height: 100%;
  }

  #mini-al {
    width: 514px;
    height: 273px;
    border-radius: 20px;
    flex-direction: column;
    align-items: center;
    gap: 10px;
  }

  #enter-yr {
    font-size: 24px;
    line-height: 29px;
    text-transform: capitalize;
    top: 24px;
  }

  .b-1-z-z span {
    width: 125px !important;
    height: 46px !important;
    border: 0.5px solid #888 !important;
    border-radius: 40px !important;
    font-family: Metropolis, sans-serif !important;
    font-style: normal !important;
    font-weight: 400 !important;
    font-size: 12px !important;
    line-height: 15px !important;
    color: #333 !important;
    flex: 0 0 23% !important;
  }

  .b-1-z-z {
    top: 190px !important;
  }

  .activeSlide-1 .modal-content {
    margin-top: 0;
    border-radius: 10px;
  }

  #options-12 {
    width: 100%;
    top: 389px;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    bottom: auto;
  }

  #top-1 {
    height: 100%;
    width: 420px;
  }

  #z-01 {
    flex-direction: row;
    align-items: center;
  }

  #top-2 {
    height: 100%;
    width: 100%;
    top: 0 !important;
    border-radius: 5px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-direction: column;
  }

  #top-1 h3 {
    top: 165px;
  }

  #o-1,
  #o-1-1 {
    top: 217px;
  }

  #img-wrapper-11 img {
    border-radius: 7px;
  }

  #opti-1 {
    top: 100px;
  }

  #opti-2 {
    top: 244px;
  }

  #opti-1,
  #opti-2 {
    gap: 49px;
  }

  #opti-1 div,
  #opti-2 div {
    width: 122px;
    height: 122px;
  }

  #e0-11 h3 {
    font-family: Metropolis, sans-serif;
    font-style: normal;
    font-size: 44px;
    line-height: 44px;
    top: 128px;
  }

  #e0-11 span {
    font-family: Metropolis, sans-serif;
    font-style: normal;
    font-size: 34px;
    top: 209px;
    z-index: 2;
    width: 70%;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.3;
  }

  #e0-11 #btn-wrapper-11 {
    top: 446px;
  }

  #stages-wrapper {
    display: none;
    cursor: pointer;
  }

  .circle,
  .pcircle {
    font-weight: 400;
    font-size: 16px;
    line-height: 16px;
  }

  #area-wrapper span {
    gap: 16px;
    letter-spacing: 1px;
    width: 170px;
    height: 69px;
    border: 0.5px solid #888;
    border-radius: 10px;
    justify-content: center;
    font-weight: 500;
    font-size: 16px;
    align-items: center;
    flex: 0 0 29%;
    text-align: center;
  }

  #edit {
    top: 81px;
  }

  #areaName {
    top: 118px;
  }

  #searchArea {
    top: 154px;
  }

  #searchArea input {
    padding-top: 0;
  }

  #area-wrapper {
    padding: 0 21px;
    /* justify-content: flex-start; */
  }
}

@media only screen and (min-width: 768px) and (max-width: 992px) {

  #e0-11 h3,
  #special-con-10 div,
  #special-con-9 div {
    font-family: Metropolis, sans-serif;
    font-style: normal;
    color: #fff;
  }

  #in0-bla,
  #irritating-text {
    z-index: 1;
    width: 100%;
    position: absolute;
  }

  #main-almost-wrapper,
  .almost-modal .modal-content {
    background: transparent;
    height: 100%;
  }

  #for-foo,
  #or-00 {
    top: 130px;
  }

  #e0-11 span,
  #in0-bla,
  #inp-2,
  #irritating-text,
  #searchArea {
    position: absolute;
  }

  #options-12 {
    top: 328px;
  }

  #cat-0-drop {
    bottom: 100%;
    top: auto;
  }

  #options-12 #z-12n {
    width: 362px;
  }

  .b-11 {
    top: 175px !important;
  }

  #irritating-text {
    top: 8px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 10px;
  }

  #inp-4 {
    top: 68px;
  }

  #inp-3 {
    top: 70px;
  }

  #inp-1 {
    top: 165px;
  }

  #inp-2 {
    top: 241px;
  }

  #data-p {
    top: 316px;
  }

  #cont-btn {
    top: 338px;
  }

  #o-1-1 {
    top: 40px;
    margin: 0;
  }

  #p-heading {
    top: 5px !important;
    margin: 0 !important;
  }

  #special-1 #img-0912,
  #special-con-10 div img {
    height: 20px;
    width: 20px;
  }

  #special-1 #img-0912 img {
    height: 100%;
    width: 100%;
    object-fit: contain;
  }

  #top-g h3 {
    margin: 0;
    top: 5px !important;
  }

  #special-con-10,
  #special-con-9 {
    display: flex;
    top: 65px;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: end;
    gap: 15px;
  }

  #special-con-10 div,
  #special-con-9 div {
    font-weight: 600;
    font-size: 14px;
    line-height: 14px;
    flex: 0 0 44%;
  }

  #top-1 h3 {
    top: -10px;
  }

  #o-1 {
    top: 38px;
  }

  #e0-11 span {
    font-size: 34px;
    text-align: center;
    color: #fff;
    top: 209px;
    width: 70%;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.3;
  }

  #l-heading {
    top: 60px !important;
    margin: 0;
  }

  #o-2-2 {
    top: 100px !important;
  }

  #e0-11 h3 {
    font-weight: 400;
    font-size: 44px;
    line-height: 44px;
    top: 128px;
  }

  #in0-bla {
    display: block !important;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.35));
  }

  #top-g {
    height: 30%;
    width: 100%;
    position: relative;
  }

  #err-12 {
    top: 50px;
  }

  .b-11 span,
  .time-z-1 span {
    flex: 0 0 30% !important;
  }

  .time-z-1 {
    top: 160px !important;
  }

  .r-0,
  .r-0-109 {
    top: 295px !important;
  }

  #area-wrapper span {
    flex: 0 0 23%;
    gap: 5px;
  }

  #area-wrapper {
    width: 100%;
    top: 210px;
  }

  #dropDown-code {
    top: 47px;
    left: 0;
  }

  #custom-slider-09 .DayPicker-NavBar {
    top: auto !important;
    position: relative !important;
  }

  #custom-slider-09 .DayPicker-wrapper {
    width: 440.62px;
    height: auto !important;
  }

  #custom-slider-09 {
    height: 229px !important;
    margin-top: 84px;
  }

  #main-almost-wrapper {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
  }

  #mini-al {
    width: 514px;
    height: 273px;
    background: #fff;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
  }

  .r-0 {
    top: 320px !important;
  }

  .b-1-z-z span {
    border: 0.5px solid #888 !important;
    border-radius: 40px !important;
    font-family: Metropolis, sans-serif !important;
    font-style: normal !important;
    font-weight: 400 !important;
    font-size: 12px !important;
    line-height: 15px !important;
    color: #333 !important;
    flex: 0 0 23% !important;
    width: 125px !important;
    height: 46px !important;
  }

  .b-1-z-z {
    gap: 10px !important;
    justify-content: center !important;
    top: 150px !important;
  }

  #for-foo {
    width: 100%;
    text-align: center;
  }

  .activeSlide-1 .modal-content {
    margin-top: 0;
  }

  #top-2 {
    display: flex;
    flex-direction: column;
  }

  #area-wrapper span {
    flex: 0 0 20%;
    height: 57.2px;
    width: auto;
  }

  #searchArea {
    top: 154px;
  }
}

@media only screen and (min-width: 992px) {

  #io0-bla,
  #special-con-10 {
    z-index: 1;
    width: 100%;
    position: absolute;
  }

  #e0-11 span,
  #inp-2,
  #io0-bla,
  #irritating-text,
  #searchArea,
  #special-con-10 {
    position: absolute;
  }

  #top-1,
  #top-g {
    width: 39%;
  }

  #top-2,
  #top-3 {
    top: auto;
    width: 61%;
    display: flex;
  }

  #top-1,
  #top-2,
  #top-3 {
    height: 100%;
    position: relative;
  }

  #irritating-text,
  #mini-al,
  #special-con-10,
  #top-2,
  #top-3,
  #z-01 {
    display: flex;
  }

  #options-12 #z-12n {
    width: 91%;
    height: 53px;
  }

  #irritating-text {
    width: 100%;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 24px;
    top: 24px;
  }

  #area-wrapper span {
    flex: 0 0 29%;
  }

  #special-1 {
    justify-content: flex-start;
  }

  #o-1,
  #o-1-1 {
    top: 217px;
  }

  #special-con-10,
  #special-con-9 {
    padding: 0 16px;
  }

  #top-3 {
    flex-direction: column;
    border-radius: 5px;
  }

  #p-heading {
    top: 200px !important;
    margin: 0 !important;
  }

  #special-con-10 {
    top: 110px;
    flex-direction: column;
    gap: 20px;
  }

  #e0-11 span {
    font-size: 34px;
    text-align: center;
    color: #fff;
    top: 209px;
    width: 70%;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.3;
  }

  #e0-11 h3 {
    font-family: Metropolis, sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 44px;
    line-height: 44px;
    color: #fff;
    top: 128px;
  }

  #io0-bla {
    display: block !important;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(179.9deg, #ffffff 0.09%, rgba(255, 255, 255, 0.7) 20.03%, rgba(255, 255, 255, 0.5) 29.99%, rgba(255, 255, 255, 0.1) 45.85%, rgba(255, 255, 255, 0.01) 51.42%);
  }

  #top-g {
    top: auto;
    height: 100%;
  }

  .pcircle img {
    height: 30px;
    width: 30px;
  }

  #area-wrapper {
    width: 100%;
  }

  .almost-modal .modal-content {
    background: 0 0;
    height: 100%;
  }

  #main-almost-wrapper {
    background: transparent;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    height: 100%;
  }

  #mini-al {
    width: 514px;
    height: 273px;
    background: #fff;
    border-radius: 20px;
    flex-direction: column;
    align-items: center;
    gap: 15px;
  }

  .b-1-z-z span {
    width: 125px !important;
    height: 46px !important;
    border: 0.5px solid #888 !important;
    border-radius: 40px !important;
    font-family: Metropolis, sans-serif !important;
    font-style: normal !important;
    font-weight: 400 !important;
    font-size: 12px !important;
    line-height: 15px !important;
    color: #333 !important;
    flex: 0 0 23% !important;
  }

  .r-0 {
    top: 325px !important;
  }

  .b-1-z-z {
    gap: 10px !important;
    justify-content: center !important;
    top: 190px !important;
  }

  .activeSlide-1 .modal-content {
    margin-top: 0;
  }

  #searchArea {
    top: 154px;
  }

  #z-01 {
    flex-direction: row;
  }

  #top-2 {
    flex-direction: column;
  }

  #options-12 {
    top: 386px;
    bottom: auto;
  }

  #opti-1 {
    top: 100px;
    gap: 10px;
    justify-content: space-evenly;
  }

  #opti-2 {
    top: 244px;
    gap: 10px;
    justify-content: space-evenly;
  }

  #img-wrapper-11 img {
    border-radius: 7px;
  }

  #top-1 h3 {
    top: 177px !important;
    margin: 0;
  }

  #breadcrumb li {
    padding: 0px !important;
  }
}

@media only screen and (max-width: 350px) {
  .activeSlide-1 {
    height: 540px;
  }

  #opti-1 div,
  #opti-2 div {
    width: 100px;
    height: 94px;
    font-size: 10px;
  }

  #opti-1 div img,
  #opti-2 div img {
    height: 48px;
  }

  #options-12 {
    top: 324px;
  }

  .b-11 span,
  .time-z-1 span {
    flex: 0 0 44% !important;
  }

  .time-z-1 span {
    height: 60px !important;
  }

  .b-1-z-z span {
    border: 1px solid #888 !important;
    font-size: 10px;
  }

  #irritating-text {
    display: none;
    top: 1px;
  }

  .activeSlide-1 #irritating-text {
    display: flex;
  }
}

#eroor67 {
  position: absolute;
  background: #fff;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

#eroor67 span {
  background: url(//media.bookeventz.com/html/bookeventz.com/asset/images/Spiner_V3.gif) center no-repeat;
  z-index: 103;
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  left: 0;
  right: 0;
  margin: auto;
}

input:-webkit-autofill,
input:-webkit-autofill:active,
input:-webkit-autofill:focus,
input:-webkit-autofill:hover {
  -webkit-box-shadow: 0 0 0 30px #fff inset !important;
  -webkit-text-fill-color: #888888 !important;
}

.mobile-modal-btn {
  width: 132px;
  height: 40px;
  border-radius: 10px !important;
  font-family: Metropolis;
  color: #fff;
  background-color: #f04e58;
  border: none;
  margin-top: 24px;
}

#inp-mob-2 {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  top: 0;
  margin-top: 34px;
}

#o-2 {
  top: 73px !important;
}

.main_venue_btn {
  color: #f04e58;
  border: 1px solid #f04e58 !important;
  padding: 10px 20px !important;
  font-size: 16px !important;
  border-radius: 5px !important;
}

.this_venue_btn {
  color: #f04e58;
  border: 1px solid #f04e58 !important;
  padding: 17px !important;
  font-size: 16px !important;
  background-color: #f04e58;
  border-radius: 5px !important;
}

#comp {
  color: green;
}

#p-19 {
  color: #f04e58;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

@media screen and (max-width: 768px) {
  #want-this-venue {
    padding: 10px 40px !important;
    font-size: 10px !important;
  }

  .main_venue_btn {
    padding: 10px !important;
    font-size: 10px !important;
  }

  #special-1 #img-0912,
  #suc-img img {
    width: 50px !important;
    height: 50px !important;
  }

  .success-modal .modal-content {
    width: 90% !important;
  }
}

/* For desktop */
.data-pe {
  top: 370px !important;
}

.data-pee {
  top: 400px !important;
}

/* For mobile */
@media screen and (max-width: 768px) {
  .data-pe {
    top: 318px !important;
  }
      #ds99.enquire-capsule {
        align-self: start !important;
    }

  .data-pee {
    top: 352px !important;
  }


#inp-2 input{
  padding-left: 5px !important;
}

#hea{
  font-size: 24px !important;
}

  /* #img-wrapper-12 {
    border-bottom: 1px solid #333 !important;
  } */

  #img-wrapper-12 img {
    display: none;
  }

  #o-2 {
    width: 100% !important;
  }
}

#o-1 {
  display: flex;
  justify-content: center;
}

/* From Uiverse.io by PriyanshuGupta28 */
#spinner_15 {
  position: absolute;
  width: 6px;
  height: 6px;
}

#spinner_15 div {
  position: absolute;
  width: 50%;
  height: 150%;
  transform: rotate(calc(var(--rotation) * 1deg)) translate(0, calc(var(--translation) * 1%));
  animation: spinner-fzua35 1s calc(var(--delay) * 1s) infinite ease;
}

#logib_loading_86 #spinner_15 div:nth-child(1) {
  --delay: 0.1;
  --rotation: 36;
  --translation: 150;
}

#logib_loading_86 #spinner_15 div:nth-child(2) {
  --delay: 0.2;
  --rotation: 72;
  --translation: 150;
}

#logib_loading_86 #spinner_15 div:nth-child(3) {
  --delay: 0.3;
  --rotation: 108;
  --translation: 150;
}

#logib_loading_86 #spinner_15 div:nth-child(4) {
  --delay: 0.4;
  --rotation: 144;
  --translation: 150;
}

#logib_loading_86 #spinner_15 div:nth-child(5) {
  --delay: 0.5;
  --rotation: 180;
  --translation: 150;
}

#logib_loading_86 #spinner_15 div:nth-child(6) {
  --delay: 0.6;
  --rotation: 216;
  --translation: 150;
}

#logib_loading_86 #spinner_15 div:nth-child(7) {
  --delay: 0.7;
  --rotation: 252;
  --translation: 150;
}

#logib_loading_86 #spinner_15 div:nth-child(8) {
  --delay: 0.8;
  --rotation: 288;
  --translation: 150;
}

#logib_loading_86 #spinner_15 div:nth-child(9) {
  --delay: 0.9;
  --rotation: 324;
  --translation: 150;
}

#logib_loading_86 #spinner_15 div:nth-child(10) {
  --delay: 1;
  --rotation: 360;
  --translation: 150;
}

@keyframes spinner-fzua35 {

  0%,
  10%,
  20%,
  30%,
  50%,
  60%,
  70%,
  80%,
  90%,
  100% {
    background: rgba(74, 38, 110, 1);
    transform: rotate(calc(var(--rotation) * 1deg)) translate(0, calc(var(--translation) * 1%));
  }

  50% {
    background: rgba(240, 78, 88, 1);
    transform: rotate(calc(var(--rotation) * 1deg)) translate(0, calc(var(--translation) * 1.5%));
  }
}

#logib_loading_86 {
  all: unset;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
  background: rgba(0, 0, 0, 0.5);
}

@media screen and (max-width: 992px) {
  #n-sl-wr,
  #n-sl-wr_69 {
    /* height: auto !important; */
    min-height: auto !important;
    padding-bottom: 40px !important;
  }
  #new-listing-slider-wrapper {
    flex-direction: column !important;
    height: auto !important;
    padding: 0 20px !important;
    gap: 20px !important;
    align-items: center !important;
  }
  #right-side-listing {
    width: 100% !important;
    padding: 0px 0px 0 !important;
    text-align: center !important;
    align-items: center !important;
  }
  #ou9s {
    font-size: 24px !important;
    line-height: 40px !important;
    text-align: start !important;
    margin-bottom: 10px !important;
  }
  #is87 {
    width: 100% !important;
    align-items: center !important;
    gap: 8px !important;
  }
  #is87 span {
    font-size: 16px !important;
    line-height: 24px !important;
    text-align: center !important;
  }
  #ds99 {
    font-size: 20px !important;
    line-height: 30px !important;
    text-align: center !important;
    margin-top: 15px !important;
  }
  #right-side-listing .curler_09 {
    display: none !important;
  }
  .curler_10 {
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 20px !important;
    width: 100% !important;
    margin-top: 30px !important;
    padding: 0 20px !important;
  }
  #saiu8 div {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    width: auto !important;
  }
  #saiu8 div span {
    font-size: 14px !important;
    line-height: 18px !important;
  }
  #divuy {
    background: #4a266e !important;
    width: 1px !important;
    height: 30px !important;
    display: block !important;
  }
  #left-side-listing {
    position: relative !important;
    margin: 0px auto 0 !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    width: 100% !important;
    max-width: 550px !important;
    height: auto !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1) !important;
    border-radius: 15px !important;
  }
  #left-side-listing #z-01 {
    width: 100% !important;
    justify-content: center !important;
  }
  #left-side-listing #top-3 {
    width: 100% !important;
    height: auto !important;
    padding: 24px 20px !important;
    border-radius: 15px !important;
  }
  #left-side-listing #opti-1,
  #left-side-listing #opti-2 {
    gap: 15px !important;
    justify-content: center !important;
    width: 100% !important;
  }
  #left-side-listing #opti-1 div,
  #left-side-listing #opti-2 div {
    width: 130px !important;
    height: 110px !important;
    border: 1px solid #DAB5FF
  }
  #left-side-listing #options-12 {
    width: 100% !important;
    margin-top: 20px !important;
  }
  #left-side-listing #options-12 #z-12n {
    width: 100% !important;
    max-width: 420px !important;
    margin: 0 auto !important;
  }
}

#ds99.enquire-capsule img {
  width: 40px !important;
  height: 40px !important;
  margin-left: 8px !important;
  display: inline-block !important;
  vertical-align: middle !important;
}

@media screen and (max-width: 767px) {
  #ds99.enquire-capsule {
    align-self: start !important;
  }
  #ds99.enquire-capsule img {
    width: 16px !important;
    height: 16px !important;
    margin-left: 4px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
  #ds99.enquire-capsule {
    align-self: center !important;
  }
}

.enquiry-circular-progress{
  top:-38px
}



#top-3,
#top-2 {
  position: relative !important;
}

.enquiry-circular-progress-container {
  position: absolute !important;
  top: 200px !important;
  bottom: auto !important;
  right: 24px !important;
  z-index: 100 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.enquiry-circular-progress {
  position: relative !important;
  top: 297px;
  width: 60px !important;
  height: 60px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.enquiry-progress-text {
  position: absolute !important;
  font-family: "Metropolis", sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #4a266e !important;
}

@media only screen and (max-width: 1024px) {
  .enquiry-circular-progress-container {
    position: absolute !important;
    top: 20px !important;
    right: 20px !important;
    bottom: auto !important;
    left: auto !important;
  }
  .enquiry-circular-progress {
    position: relative !important;
    top: -35px !important;
  }
}

/* Login slide redesign */
#enter-yr {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  position: absolute !important;
  top: 15px !important;
  width: 100% !important;
  height: auto !important;
}

.login-main-title {
  font-family: Metropolis, sans-serif !important;
  font-style: normal !important;
  font-weight: 600 !important;
  font-size: 20px !important;
  line-height: 26px !important;
  color: #333333 !important;
  margin-bottom: 12px !important;
  padding: 0 20px !important;
}

.login-sub-title {
  font-family: Metropolis, sans-serif !important;
  font-style: normal !important;
  font-weight: 400 !important;
  font-size: 14px !important;
  line-height: 18px !important;
  color: #666666 !important;
  padding: 0 20px !important;
}

#inp-4 {
  top: 125px !important;
  position: absolute !important;
  width: 100% !important;
  display: flex !important;
  justify-content: center !important;
}

#inp-4 button,
.mock-google-login-btn {
  width: calc(100% - 40px) !important;
  max-width: 424px !important;
  height: 50px !important;
  border: 1px solid #ccc !important;
  border-radius: 10px !important;
  background-color: #fff !important;
  display: flex !important;
  flex-direction: row !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 15px !important;
  box-shadow: none !important;
  cursor: pointer !important;
}

#inp-4 button .g-text,
.mock-google-login-btn .g-text {
  color: #f04e58 !important;
  font-family: Metropolis, sans-serif !important;
  font-size: 16px !important;
  font-weight: 500 !important;
}

.g-icon {
  display: inline-block !important;
  width: 24px !important;
  height: 24px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath fill='%23EA4335' d='M24 9.5c3.54 0 6.71 1.22 9.21 3.6l6.85-6.85C35.9 2.38 30.47 0 24 0 14.62 0 6.51 5.38 2.56 13.22l7.98 6.19C12.43 13.72 17.74 9.5 24 9.5z'/%3E%3Cpath fill='%234285F4' d='M46.5 24c0-1.61-.15-3.16-.42-4.69H24v9.07h12.75c-.53 2.87-2.14 5.31-4.57 6.95l7.15 5.54C43.5 35.31 46.5 30.2 46.5 24z'/%3E%3Cpath fill='%23FBBC05' d='M10.54 28.59c-.48-1.45-.76-2.99-.76-4.59s.27-3.14.76-4.59l-7.98-6.19C.92 16.46 0 20.12 0 24c0 3.88.92 7.54 2.56 10.78l7.98-6.19z'/%3E%3Cpath fill='%2334A853' d='M24 48c6.48 0 11.93-2.13 15.89-5.81l-7.15-5.54c-1.99 1.34-4.55 2.15-8.74 2.15-6.26 0-11.57-4.22-13.46-9.91l-7.98 6.19C6.51 42.62 14.62 48 24 48z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-size: contain !important;
}

#or-00 {
  position: absolute !important;
  top: 195px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: calc(100% - 40px) !important;
  max-width: 424px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  font-family: Metropolis, sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #888888 !important;
  gap: 15px !important;
}

#or-00::before,
#or-00::after {
  content: "" !important;
  flex: 1 !important;
  height: 1px !important;
  background-color: #e0e0e0 !important;
}

#inp-1 {
  position: absolute !important;
  top: 235px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: calc(100% - 40px) !important;
  max-width: 424px !important;
}

#inp-1 input {
  width: 100% !important;
  height: 50px !important;
  border: 1px solid #ccc !important;
  border-radius: 10px !important;
  padding-left: 42px !important;
  font-family: Metropolis, sans-serif !important;
  font-size: 15px !important;
  outline: none !important;
  /* background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23888888'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z'/%3E%3C/svg%3E") !important; */
  background-image: url(/media/login_slide/account_circle.png) !important;
  background-repeat: no-repeat !important;
  background-position: 12px center !important;
  background-size: 23px !important;
}

#inp-2 {
  position: absolute !important;
  top: 305px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: calc(100% - 40px) !important;
  max-width: 424px !important;
  z-index: 10 !important;
}

#sig,
#sigOne {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  width: 100% !important;
  height: 50px !important;
  border: 1px solid #ccc !important;
  border-radius: 10px !important;
  background-color: #fff !important;
  position: relative !important;
}

#co-0 {
  display: flex !important;
  align-items: center !important;
  height: 100% !important;
  padding-left: 42px !important;
  padding-right: 10px !important;
  border-right: none !important;
  font-family: Metropolis, sans-serif !important;
  font-size: 15px !important;
  color: #333333 !important;
  cursor: pointer !important;
  background-image: url(/media/login_slide/call.png) !important;
  background-repeat: no-repeat !important;
  background-position: 12px center !important;
  background-size: 18px !important;
}

#co-0 img {
  width: 10px !important;
  height: 6px !important;
  margin-left: 6px !important;
}

#inp-2 input {
  flex: 1 !important;
  height: 100% !important;
  border: none !important;
  padding-left: 6px !important;
  font-family: Metropolis, sans-serif !important;
  font-size: 15px !important;
  outline: none !important;
  background: transparent !important;
}

#inp-3 {
  position: absolute !important;
  top: 375px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: calc(100% - 40px) !important;
  max-width: 424px !important;
}

#inp-3 input {
  width: 100% !important;
  height: 50px !important;
  border: 1px solid #ccc !important;
  border-radius: 10px !important;
  padding-left: 45px !important;
  font-family: Metropolis, sans-serif !important;
  font-size: 15px !important;
  outline: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23888888'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: 15px center !important;
  background-size: 20px !important;
}

#cont-btn {
  position: absolute !important;
  top: 375px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: calc(100% - 40px) !important;
  max-width: 424px !important;
  display: flex !important;
  justify-content: center !important;
}

#inp-3 ~ #cont-btn {
  top: 445px !important;
}

#cont-btn button {
  width: 100% !important;
  height: 50px !important;
  background-color: #f04e58 !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 10px !important;
  font-family: Metropolis, sans-serif !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: background-color 0.2s ease !important;
}

#cont-btn button:hover {
  background-color: #d83a43 !important;
}

#data-p {
  position: absolute !important;
  top: 440px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 100% !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
}

#inp-3 ~ #data-p {
  top: 510px !important;
}

#data-p img {
  width: 18px !important;
  height: 18px !important;
  filter: invert(53%) sepia(87%) saturate(415%) hue-rotate(94deg) brightness(91%) contrast(97%) !important;
}

#data-p span {
  font-family: Metropolis, sans-serif !important;
  font-size: 13px !important;
  color: #333333 !important;
  font-weight: 500 !important;
}

@media screen and (max-width: 768px) {
  #irritating-text.hide-on-mobile {
    display: none !important;
  }
}
@media screen and (max-width: 768px) {
  #inp-2 input {
    padding-left: 26px !important;
  }
}

#irritating-text h3, #irritating-text p {
  position: static !important;
  top: auto !important;
  margin: 0 !important;
  line-height: normal !important;
}