.taxArea {
  display: block !important;
}

.taxItem {
  display: flex;
  justify-content: space-between;
}

.taxItem>div,
.taxItem>span {
  font-weight: 700 !important;
}

.taxArea {
  background: whitesmoke;
  padding: 5px;
  border: 1px solid #e9e1e1;
  border-radius: 5px;
}

.taxadd {
  font-size: 12px;
  padding: 5px;
  color: gray;
}

.catalogItem {
  margin: 10px !important;
  min-height: 200px;
  border-radius: 5px;
}

.priceShowed .pricedItem {
  font-size: 9px;
}

.detailRateBar {
  display: none;
  margin-bottom: 15px;
}

div#roomSection>.roomItem:first-child {
  margin-top: 0 !important;
}

.row.roomItem {
  margin: 10px 0 !important;
  padding: 10px !important;
}

.infoBarType {
  margin-bottom: 5px;
}

.dailypriceArea {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.dailyprice {
  text-align: center;
  box-shadow: 2px 2px 6px darkgrey;
  margin: 10px 0;
  width: 10%;
}

.roomAvCount {
  color: var(--button);
}

.dailyprice .dailydate {
  background: whitesmoke;
  padding: 3px 20px;
}

.infoBarType .infoLabel {
  font-weight: 700;
  font-size: 14px;
}

.row {
  margin: 0 !important;
}

.sectionWidget {
  background: #fff;
  border-radius: 0 5px 0 0;
  margin: 0 0 10px 0;
  width: 100%;
}

.roomText {
  padding: 0;
  margin: 10px 0;
}

select#rezcurrency {
  width: 49px;
}

.rezimg {
  width: 100%;
  object-fit: cover;
  margin-top: 10px;
  height: 200px;
  cursor: pointer;
}

.roomTypeDetailSliderArea {
  display: flex;
  align-items: center;
}

.roomTypeDetailSliderArea i {
  background: #ffffffd1;
  padding: 10px;
  position: absolute;
  cursor: pointer;
}

.roomTypeDetailSliderArea .right {
  right: 0;
}

.roomTypeDetailSliderArea i:hover {
  background: white;
  transition: 0.5s;
}

.roomname {
  font-weight: 700;
  font-size: 24px;
  margin-top: 10px;
}

.themeMod .roomname {
  margin-top: 0;
}

.pricebar {
  display: flex;
  justify-content: space-between;
}

.roomprice {
  padding: 0 0 0 10px;
  font-weight: 700;
  font-size: 20px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.priceRight {
  display: flex;
  flex-direction: column;
}

.priceRight>div {
  line-height: 13px;
}

.addbasket {
  background: var(--primary);
  color: #fff;
  font-size: 14px;
  padding: 5px;
  font-weight: 600;
  cursor: pointer;
  display: flex;
  align-items: center;
  width: 110px;
  justify-content: center;
  height: 40px;
  border-radius: 5px;
}

.showExchangePriceAreaIn {
  display: grid;
  grid-template-columns: auto auto auto;
}

.showExchangePriceItem {
  font-weight: 700;
  background: #f9f9f9;
  margin: 5px;
  padding: 5px;
  border: 1px solid #d2d2d2;
  border-radius: 5px;
  text-align: center;
}

.showExchangePriceArea i {
  width: 28px;
  height: 28px;
  text-align: center;
  margin: auto 5px !important;
}

.addbasket:hover {
  background: var(--secondary);
}

.clickToCall {
  background: var(--primary);
  color: #fff;
  font-size: 15px;
  padding: 5px;
  font-weight: 600;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  background-image: -webkit-linear-gradient(30deg,
      var(--primary) 50%,
      transparent 50%);
  background-image: linear-gradient(30deg, var(--primary) 50%, transparent 50%);
  background-size: 1000px;
  background-repeat: no-repeat;
  background-position: 0;
  -webkit-transition: background 300ms ease-in-out;
  transition: background 0.7s ease-in-out;
  overflow: hidden;
  position: relative;
}

.clickToCall:before {
  content: '';
  position: absolute;
  width: 100px;
  height: 100%;
  background-image: linear-gradient(120deg,
      rgba(255, 255, 255, 0) 30%,
      rgba(255, 255, 255, 0.8),
      rgba(255, 255, 255, 0) 70%);
  top: 0;
  left: -100px;
  animation: shine 4s infinite linear;
}

.clickToCall>svg {
  fill: #fff;
  margin-right: 5px;
}

.roomItem {
  background: #fff;
  border: 1px solid #eaeaea;
  box-shadow: 0 3px 3px -2px #0003, 0 3px 4px #00000024, 0 1px 8px #0000001f;
}

.deleteRez {
  background: var(--secondary);
  color: var(--secondary-contrast);
  width: fit-content;
  padding: 10px;
  cursor: pointer;
  margin: auto;
}

.infobar {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.infobar .itemRez {
  font-weight: 700;
  text-align: center;
  padding: 0;
  margin: 5px;
  text-align: center;
  min-width: 160px;
  max-width: 170px;
}

.rezbar {
  padding: 10px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: self-start;
}

.roomType {
  background: linear-gradient(25deg, var(--primary), #060000);
  min-width: 40px;
  padding: 11px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: 700;
  border-radius: 50%;
  display: none;
}

.personalitem .row {
  padding-left: 0;
  padding-right: 0;
}

.reservationArea .row {
  padding-left: 0;
  padding-right: 0;
}

.genderInput {
  text-indent: 10px;
}

.genderInput option {
  text-indent: 5px !important;
  padding: 5px;
}

#buyLaterFormValidation .personalitem .rezinput label {
  top: -5px;
}

.reservationArea .rezinput label {
  position: absolute;
  top: -5px;
  background: #fff;
  padding: 2px 8px;
  display: block;
  z-index: 1;
  left: 9px;
}

.basketAgrements {
  font-size: 20px;
}

@media (min-width: 1100px) {
  .voucherfield {
    width: 57% !important;
  }

  .personalitem .rezinput {
    width: 100%;
  }

  .personalitem .rezinput input,
  .personalitem .rezinput select {
    position: relative;
    /* margin: 15px 0 0; */
  }

  .personalitem .row {
    display: flex;
    width: 100%;
    flex-wrap: initial;
  }

  .personalitem label.error {
    top: 0 !important;
    left: 0;
    padding: 0;
    position: relative;
    margin: 12px 0;
  }

  input.error {
    border: none !important;
    border: 1px solid red !important;
  }

  .roomprice {
    min-width: 135px;
    padding-left: 0;
  }

  .themeMod .roomcount-basket {
    display: flex;
    flex-direction: column;
    gap: 5px;
  }
}

.guest {
  font-weight: 700;
  height: 25px;
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 5px 0 0 0;
}

.guest i {
  margin-right: 5px;
}

.requiredMod {
  display: flex;
  align-items: center;
  gap: 5px;
}

.requiredMod label {
  padding: 0;
}

.rezinfo {
  display: flex;
  background-color: #fff;
  font-size: 18px;
  justify-content: space-between;
  box-shadow: 0 3px 3px -2px #0003, 0 3px 4px #00000024, 0 1px 8px #0000001f !important;
  padding: 20px 15px;
  margin-top: 10px;
  gap: 5px;
}

.reservationArea label.error {
  position: relative;
  top: 0;
  left: 0;
  padding: 5px;
}

.groupPageWidget {
  margin-top: -53px;
  position: relative;
  z-index: 10;
}

.GroupHotelArea:before,
.GroupHotelArea:after {
  display: none;
}

.GroupHotelArea .listPriceContent {
  margin: 0;
}

.groupPageWidget .rezinfo {
  box-shadow: none !important;
  border-radius: 0;
  background-color: white;
  box-shadow: 0px 0px 48px 0px rgba(70, 72, 76, 0.1) !important;
  padding: 55px 15px;
  margin-top: -78px;
}

.groupPageWidget .rezinfo .rezLabel {
  background: white;
}

.groupPageWidget #rezpicker {
  background: none;
}

.groupPageWidget #rezpicker i {
  background: none;
  /* color: var(--secondary-contrast); */
}

.showCalendar i {
  margin-right: 4px;
}

.showBillArea div,
.showNotArea div {
  display: flex;
  align-items: center;
}

.reservationArea.col-md-8.customshadow {
  padding: 10px;
}

.reservationArea {
  background-color: #fff;
}

.cardMessage {
  margin-left: 10px;
  margin-bottom: 10px;
}

.reservationArea label {
  padding: 2px 8px;
}

.showBillArea div label,
.showNotArea div label {
  margin-left: 5px !important;
  padding: 3px;
}

.rateType {
  display: flex;
  width: 30%;
  flex-direction: column;
  justify-content: center;
}

.top-rateType {
  display: flex;
  align-items: center;
  width: 100%;
}

.bottom-rateType {
  margin-top: 5px;
  width: 100%;
  display: flex;
}

.period-in-days {
  white-space: nowrap;
  display: flex;
  align-items: center;
  cursor: pointer;
  padding: 0 5px;
  margin-right: 5px;
  /* border: solid 1px #ededed; */
  height: 28px;
  font-weight: 400;
  background-color: #fff;
  font-size: 12px;
}

.rateType svg {
  width: 20px;
  margin-right: 5px;
}

li.description.active {
  background: #636363 !important;
}

.expandedStatus {
  display: none;
}

.expededArea {
  background: #fff;
  position: relative;
}

.unexped {
  text-align: center;
  background: #e0e0e0;
  padding: 5px;
  width: fit-content;
  margin: auto;
  cursor: pointer;
  display: flex;
  align-items: center;
  margin-bottom: 5px;
}

.unexped svg {
  margin-left: 10px;
}

.calendarAvailibiltyIn {
  position: absolute;
  background: #ffffffba;
  top: 10px;
  z-index: 55;
  padding: 5px 12px;
  font-size: 18px;
  cursor: pointer;
  border-radius: 0 5px 5px 0;
  left: 0;
  display: flex;
  align-items: center;
  gap: 7px;
  z-index: 1;
}

/* ForeCast Css*/
.table-container .month-container {
  color: #a1a1a1;
  font-size: 10px;
}

.table-container td {
  text-align: center;
  position: relative;
  height: 35px;
}

.table-container {
  overflow-x: auto;
}

.table-container>table {
  margin-bottom: 10px;
}

.foreCastArea {
  margin: 35px 0;
}

#daterangecalendar {
  margin: 45px 0 0;
}

.table-container .sticky-col {
  font-weight: 700;
  position: -webkit-sticky;
  position: sticky;
  left: 0;
  background-color: #fff;
  z-index: 1;
  box-shadow: 2px 0 5px rgba(0, 0, 0, 0.1);
}

.table-container .sticky-col:nth-child(2) {
  left: 70px;
}

.table-container tbody tr:nth-child(even) {
  background-color: #f9f9f9;
}

.table-container tbody tr:hover {
  background-color: #f1f1f1;
}

.forecastInfoBar {
  display: flex;
  justify-content: end;
  gap: 10px;
  margin-bottom: 10px;
}

/* .dateGapper {
    position: absolute;
    top: 50px;
} */

.forecastInfoButtons {
  display: flex;
  justify-content: space-between;
}

.ForecastButton {
  background: var(--primary);
  color: var(--primary-contrast);
  padding: 10px 15px;
  cursor: pointer;
}

.ForecastButton:hover {
  background: var(--button);
}

.table-container .available {
  cursor: pointer;
}

.table-container .selected {
  color: white;
  background-color: #96bdf9 !important;
}

.table-container .range-selected {
  background-color: #4682b4 !important;

  color: white;
}

.disabledSelecting {
  opacity: 0.5;
}

.range-hover {
  background-color: #96bdf9 !important;
  color: white;
}

.totalPriceSection {
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
  white-space: nowrap;
}

.totalPriceSection i {
  font-size: 12px;
}

.toolTipPrice {
  position: absolute;
  top: -75px;
  background: #000000bd;
  color: white;
  padding: 10px 5px;
  z-index: 1;
  font-size: 20px !important;
  right: 0;
  border-radius: 5px;
}

.toolTipDate {
  font-size: 15px;
  padding: 0px 0px 5px;
  color: orange;
}

.unavailable {
  background-color: #ffcccc;
  /*  pointer-events: none !important; */
  cursor: pointer;
}

.forecastroomcount {
  position: absolute;
  top: 1px;
  left: 1px;
  background: #e79898;
  color: white;
  font-size: 10px;
  height: 14px;
  text-align: center;
  line-height: 14px;
  padding: 0 2px;
}

.table-container .pricedItem {
  white-space: nowrap;
  line-height: 12px;
}

.forecastprice {
  font-weight: 600;
  letter-spacing: -0.5px;
}

.rateDetails {
  font-size: 12px;
  margin-bottom: 5px;
}

.clearSelection {
  display: flex;
  align-items: center;
  background: white;
  padding: 10px;
  border: 1px solid #cecece;
  cursor: pointer;
  display: none;
}

/* ForeCast Css End*/

.maxadult svg {
  width: 6px;
  fill: #fff;
}

.maxadult {
  position: absolute;
  bottom: 0;
  background: #1b1b1b4f;
  width: 100%;
  display: flex;
  justify-content: center;
  gap: 5px;
  padding: 5px;
}

.maxadult span {
  color: #fff;
}

.nationalty {
  display: block;
  width: 100%;
  border: 1px solid #ccc;
  color: #454545;
  -webkit-border-radius: 18px;
  -moz-border-radius: 18px;
  border-radius: 5px;
}

.rezinfoItem {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  position: relative;
  border-bottom-width: 1px;
  width: 45%;
  height: 46px;
  border-color: #d3d3d3;
  border-style: solid;
  box-sizing: border-box;
}

.priceBar .rezinfoItem {
  height: 42px;
  width: fit-content;
  min-width: 161px;
  margin-top: 5px;
}

span.select2.select2-container.select2-container--default {
  width: 100% !important;
  display: block;
  margin: 0;
  padding: 0;
}

.rezinfoItem:last-child {
  border: none;
  padding: 0;
}

.rezinfoItem span {
  margin-right: 5px;
  font-weight: 400;
  font-size: 12px;
}

li.description {
  background: #6495ed;
}

li.description.active:hover {
  background: gray !important;
}

.paypopup {
  position: fixed;
  z-index: 10000;
  display: flex;
  justify-content: center;
  width: 100%;
  height: 100vh;
  top: 0;
  background: #2b2a2866;
  padding: 20px;
  display: none;
}

.paypopup iframe {
  max-width: 720px;
}

.roomcount-basket .rezinfoItem {
  width: 100%;
}



@media (min-width: 720px) and (max-width: 1230px) {
  .guestCallArea {
    flex-wrap: wrap;
  }

  .rezinfoItem.callButtonArea {
    display: flex;
    flex-wrap: revert;
  }

  .guestCallArea .rezinfoItem {
    width: 24% !important;
  }
}

@media (min-width: 720px) and (max-width: 920px) {
  .themeMod .roomcount-basket .addbasket {
    margin-top: 15px;
  }

  .themeMod .roomcount-basket {
    margin-top: 15px;
    gap: 25px;
  }
}

@media (max-width: 1236px) {
  .GuestCallAreaContainer {
    position: relative !important;
    top: 0 !important;
  }

  .priceBar {
    flex-wrap: unset !important;
  }

  .roomTypeItem {
    width: 100% !important;
    margin-right: 0;
  }

  .roomTypesArea {
    flex-wrap: wrap;
  }

  table.month1,
  table.month2 {
    width: 100% !important;
  }

  .month-wrapper .gap {
    display: none;
  }

  .childItems {
    background: #ececec;
  }

  .deleteRez {
    width: 100%;
    text-align: center;
  }

  .itemRez {
    width: 47%;
  }

  .guest {
    width: 100%;
  }

  .rezinfo {
    flex-wrap: wrap;
    gap: 0;
  }

  .rezinfoItem {
    background: #fff;
    color: #000;
    padding: 5px 0;
    display: flex;
    justify-content: space-between;
    height: 45px;
    margin-top: 15px;
  }

  .dailypriceArea {
    gap: 0px;
    margin-top: 0;
  }

  .dailyprice {
    margin: 0 0 5px 0;
    width: 33.33%;
  }
}

.rezinfoItem input,
.rezinfoItem select,
.rezinfoItem .select2-container .select2-selection--single {
  border-radius: 0;
  width: 100%;
  font-size: 14px;
  border: none !important;
  text-align: center;
}

.rezinfoItem i {
  margin-right: 5px;
}

#refreshRez {
  text-shadow: none;
  font-size: 16px;
  height: 50px;
  border-radius: 0;
  border: none;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

#rezInfoSearchArea {
  margin: 20px 0;
}

.availibiltyCalendarSearchArea {
  width: auto;
}

.availibiltyCalendarSearchArea i {
  margin-right: 0;
}

.notRoom {
  font-weight: 700;
  margin: 20px 0;
  text-align: center;
}

.disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.childItems {
  position: absolute;
  top: 48px;
  display: flex;
  flex-wrap: wrap;
  display: none;
  z-index: 1;
  border: 1px solid #ebe5e5;
  z-index: 100;
  border-radius: 7px;
  background: #fefdfd;
  border: 1px solid lightgrey;
}

.childArea {
  display: flex;
  padding: 10px;
}

.childageIn {
  font-size: 12px;
  padding: 5px;
  min-width: 95px;
}

.childageIn label {
  display: block;
  margin: 0;
}

.childArea select {
  margin: 5px;
  border-radius: 4px;
  border: 1px solid lightgrey !important;
}

#applyChild {
  background: var(--secondary);
  width: fit-content;
  text-align: center;
  font-size: 14px;
  cursor: pointer !important;
  padding: 5px 21px;
  z-index: 1;
  color: #fff;
  margin: auto;
  margin-bottom: 5px;
  border-radius: 7px;
  display: flex;
  justify-content: center;
  border: none;
}

#applyChild:disabled {
  opacity: 0.5;
}

.childageIn {
  display: none;
}

.notSale {
  color: #b0b0b0;
  pointer-events: none;
  width: fit-content;
  opacity: 0.5;
}

ul.tab-menu {
  display: flex;
  margin: 10px 0;
  overflow: auto;
}

#changeHotel {
  font-weight: 700;
}

ul.tab-menu li {
  padding: 0;
  text-align: center;
}

ul.tab-menu li a {
  color: #9c9c9c;
  margin: 0 !important;
  padding: 15px !important;
  display: flex;
}

.roomItem .tab-menu {
  border-bottom: solid 1px gray;
  margin-bottom: 0;
}

.roomItem .tab-menu .current {
  display: inline-block;
  border-bottom: 3px solid var(--secondary);
}

.roomItem .tab-menu .current>a {
  display: inline-block;
  width: 100%;
}

.roomItem.boardTypesMode .tab-menu {
  display: none;
}

.roomTotalPrice {
  font-size: 16px;
  padding: 10px;
}

.openSection {
  display: block !important;
}

.tab-content {
  width: 100%;
  overflow: auto;
}

.moreRead {
  color: var(--primary);
  font-weight: 700;
  display: none;
  cursor: pointer;
}

.showRead {
  display: inline-block;
}

.showText {
  max-height: 90px;
  overflow: hidden;
}

.roomText {
  padding: 0;
  margin: 0 0 10px 0;
}

.payItem {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  padding: 10px;
  border: solid 1px #eee;
  border-top: none;
}

.payItem label {
  padding: 0;
  margin-left: 5px;
}

#closeFrame {
  background: #000;
  color: #fff;
  padding: 10px;
  cursor: pointer;
}

.closeFrame {
  display: flex;
  justify-content: flex-end;
}

.roompricenodiscount {
  text-decoration: line-through;
  font-weight: 600;
  color: gray;
  font-size: 15px;
  line-height: 10px;
}

.discountRate {
  background: var(--secondary);
  color: white;
  text-align: center;
  font-weight: 700;
  font-size: 16px;
  padding: 0 5px;
  height: 35px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  min-width: 60px;
}

.themeMod .discountRate {
  position: relative;
  background: var(--warn);
  border-radius: 0;
  padding: 0;
  margin: 0;
  min-width: 55px;
  color: var(--warn-contrast);
  min-height: 55px;
}

.discountRate:before {
  content: ' ';
  position: absolute;
  left: -5px;
  top: 0;
  width: 0;
  height: 0;
  border-bottom: 5px solid #000;
  border-left: 2px solid transparent;
  border-right: 3px solid #000;
}

.discountRate:after {
  content: ' ';
  position: absolute;
  left: 0;
  width: 0;
  height: 0;
  border-bottom: 15px solid #fff0;
  border-left: 27px solid var(--warn);
  border-right: 28px solid var(--warn);
  bottom: -15px;
}

.priceBar {
  display: flex;
  gap: 15px;
  align-items: center;
  margin-bottom: 5px;
}

.comission {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5px;
  padding: 5px;
}

.comissionLabel {
  width: 100%;
  text-align: center;
  white-space: nowrap;
}

.standartDiscount {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  /* margin: 0px 10px; */
}

.priceRight {
  display: flex;
  flex-direction: column;
}

.roomPriceCon {
  display: flex;
  font-size: 15px;
  align-items: center;
  color: #2121219e;
}

.roomPriceContent {
  display: flex;
  flex-direction: column;
}

.roompricenodiscount .priceLeft {
  font-size: 22px;
  line-height: 26px;
}

.priceLeft {
  font-size: 35px;
  letter-spacing: -1px;
}

.comissionLabel {
  display: none;
}

.roompricenodiscount .priceRight {
  font-size: 11px;
}

.roompricenodiscount .priceMin {
  margin-bottom: -4px;
}

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

.comission div i {
  font-size: 28px;
  /* margin-bottom: 17px; */
}

.promoionFrontArea .discountRate {
  background: #ae5d1b !important;
}

.rezbar .rezLabel:after {
  width: 0;
  height: 0;
  border-top: 15px solid #fff;
  border-bottom: 13px solid #fff;
  border-left: 14px solid #f5f5f5;
  border-right: 0 solid #fff;
  content: '';
  display: block;
  position: absolute;
  right: 0;
  top: 0;
}

.rezbar .rezLabel:before {
  width: 0;
  height: 0;
  border-top: 15px solid #f5f5f5;
  border-bottom: 13px solid #f5f5f5;
  border-left: 14px solid #fff;
  border-right: 0 solid #fff;
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
}

#rezpicker .drp_top-bar.normal {
  background: transparent !important;
}

#rezpicker .drp_top-bar.normal i {
  display: none !important;
}

#rezpicker .drp_top-bar .default-top,
.drp_top-bar .normal-top {
  display: block;
  text-align: center;
  color: #000;
}

#rezpicker .drp_top-bar {
  padding: 10px !important;
}

.roomTypeCalendarUnavaible {
  text-align: center;
  background: var(--primary);
  padding: 10px;
  border-radius: 5px;
  border: 1px solid;
  color: var(--primary-contrast);
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 5px;
  font-weight: 600;
  justify-content: center;
}

@media (min-width: 992px) {
  #roomTypeCalendar .lb-wrap {
    width: 48%;
    left: 26%;
  }

  .HeadLabel {
    display: block !important;
  }

  #rezpicker-container {
    width: 560px;
    top: 50px;
    left: 0;
  }

  .calendarRoomAvaiable table.month1,
  .calendarRoomAvaiable table.month2 {
    width: 47% !important;
    border: 1px solid #fff;
    border-radius: 10px !important;
    border-collapse: unset;
    min-height: 270px;
  }

  #creditCard {
    padding: 0px 10px;
  }

  .themeMod .themeModRezArea {
    max-width: 200px;
    float: right;
  }

  .themeMod .roomprice {
    display: flex !important;
    gap: 10px;
  }
}

@media (max-width: 992px) {
  .themeMod .roomcount-basket {
    display: flex;
    justify-content: space-between;
    flex-direction: row;
  }

  .themeModRezArea {
    width: 100%;
  }
}

@media (max-width: 920px) {
  .BestRoomItem {
    flex-wrap: wrap;
  }

  .BestRoomItem .roomprice {
    flex-direction: row;
  }

  .BestRoomItem .bHotelInfo {
    justify-content: space-between;
    width: 100%;
  }

  #showbasketItems {
    margin: 10px 0px !important;
  }
}

@media (min-width: 1100px) {
  .table-container {
    overflow-x: visible;
  }

  .maxWidth {
    max-width: 115px;
  }
}

.discountDetailArea .discountRate:after {
  visibility: hidden;
}

#paymentForm input,
#paymentForm select {
  height: 55px !important;
  margin: 0px 0px 10px;
}

.rezinput input,
.rezinput select {
  /* border: none; */
  border-bottom: 1px solid #ccc;
  box-sizing: border-box;
  height: 40px;
  font-size: 14px;
  font-weight: 600;
  border-radius: 5px;
}

.rezinput textarea {
  border-radius: 0;
}

.genderMessage {
  max-width: fit-content;
  white-space: normal;
}

.HeadLabel .hlabel {
  border-bottom: 1px solid #000;
  display: block;
  margin: 5px;
  padding: 5px 0;
  background: #f5f5f5;
  text-align: center;
}

.HeadLabel {
  display: none;
}

.hideprice {
  display: none;
}

.lossmessage {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #454545;
}

.lossMessageIcon {
  text-decoration: none;
}

.lossMessageIcon>i {
  padding: 5px;
  margin-right: 5px;
  font-size: 17px;
}

.lossMessageText {
  /* text-decoration: underline; */
}

.lossMessageText>a {
  color: #8b0000;
  font-weight: normal;
}

@keyframes blinker {
  50% {
    opacity: 0;
  }
}

.roomTypesArea {
  width: 100%;
  display: flex;
  overflow: auto;
}

.roomTypeItem {
  background: #fff;
  padding: 5px;
  margin-right: 15px;
  margin-bottom: 10px;
  cursor: pointer;
  border: 1px solid #c7c0c0;
  display: flex;
  align-items: center;
  border-radius: 5px 5px 0 0;
  justify-content: center;
  text-align: center;
  white-space: nowrap;
}

#rezpicker {
  width: 100%;
  display: flex;
  justify-content: end;
  align-items: baseline;
  min-width: 255px;
  cursor: pointer;
  z-index: 1000;
  background: #fff;
  padding: 0 0 0 5px;
  position: relative;
}

.pickerArea>span {
  border-bottom-width: 1px;
  border-style: solid;
  border-color: #d3d3d3;
}

#rezpicker-container {
  position: absolute;
}

.pickerArea span {
  font-size: 14px;
  width: 100%;
  min-height: 46px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

#rezpicker .day.toMonth.invalid {
  opacity: 0.3;
}

.rezgapper {
  border: 1px solid lightgrey;
  height: 45px;
  width: 1px !important;
}

.rezpickerdate {
  font-size: 14px;
  padding: 0 10px;
  font-weight: 600;
  margin-bottom: 2px;
  line-height: 23px;
  text-align: center;
}

#rezpicker .date-picker-wrapper {
  background: #fff;
}

#rezpicker .date-picker-wrapper .month-wrapper {
  border: none;
}

#rezpicker i {
  font-size: 18px;
  padding: 0 10px;
  font-weight: 600;
  border-radius: 5px;
  margin: 0 5px 2px 5px;
  line-height: 25px;
  text-align: center;
  position: absolute;
  left: 0;
  top: -15px;
  padding: 5px;
  background: #fff !important;
}

.rezpickerday {
  text-align: center;
  line-height: 10px;
  font-size: 14px;
  margin-bottom: 10px;
}

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

.calendarRoomAvaiable .date-picker-wrapper {
  width: 100%;
  padding: 0;
}

.calendarRoomAvaiable .month-wrapper {
  width: 100% !important;
}

.calendarRoomAvaiable .month-wrapper td {
  width: 30px;
  border: 1px solid #fff;
}

.colorBar {
  display: flex;
  justify-content: center;
  gap: 20px;
}

.colorBar div {
  padding: 10px;
}

.aroomCount {
  background: #370e0e8a;
  position: absolute;
  top: 0;
  padding: 0 4px;
}

.priceShowed {
  position: relative;
}

.colorBar {
  display: flex;
  justify-content: center;
  gap: 20px;
}

.colorBar div {
  padding: 10px;
}

.day.toMonth.valid.tmp.checked {
  background: var(--secondary);
}

span.pickerDate {
  font-size: 10px !important;
}

.pricedItem span {
  font-size: 12px;
}

.week-name,
.week-name>th {
  color: #fff;
  border-color: #fff;
}

.week-name>th {
  color: #b4b4b4 !important;
}

.date-picker-wrapper table .caption>th {
  background: none;
  border: none;
}

.roomTypeItem.active {
  border-bottom: 2px solid red;
  box-sizing: border-box;
  background: #4e4e4e;
  color: #fff;
}

.date-picker-wrapper table .caption .next:hover,
.date-picker-wrapper table .caption .prev:hover {
  background-color: transparent;
  color: #000;
}

.avaibilitymessage {
  background: #fff;
  width: 100%;
  display: block;
  text-align: center;
  padding: 18px;
  margin-bottom: 20px;
  font-weight: 700;
}

.date-picker-wrapper {
  margin-bottom: 20px;
}

.showCalendar {
  font-size: 15px;
  background-color: var(--primary);
  margin: 10px 0;
  padding: 10px 15px 10px 25px;
  cursor: pointer;
  color: #fff;
  box-shadow: 0 3px 3px -2px #0003, 0 3px 4px #00000024, 0 1px 8px #0000001f;
  display: none !important;
}

.detailsRate {
  display: flex;
  align-items: center;
  cursor: pointer;
  padding: 0 5px;
  margin-right: 5px;
  border: solid 1px #ededed;
  height: 28px;
  font-weight: 600;
  background-color: #fff;
  color: var(--primary);
  width: fit-content;
}

.firstbar {
  display: flex;
}

.firstSecondBar {
  justify-content: center;
  text-align: center;
  width: 50%;
}

.firstSecondBar .comission {
  display: block;
  flex-wrap: wrap;
  justify-content: center;
  max-width: unset !important;
}

.firstinBar {
  width: 50%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.mobileadd {
  width: 100% !important;
  max-width: 100% !important;
  margin: 10px 0;
}

.agentConsole {
  flex-direction: column;
  display: flex;
}

.rpItem {
  width: 33.33%;
  position: relative;
}

.rpItemContent {
  display: flex;
  flex-wrap: wrap;
}

.rpItemContent label {
  display: block !important;
  position: relative;
  background: transparent;
  padding: 0;
}

.rpItemFull {
  width: 100%;
}

.rpItemFull>textarea {
  height: 80px;
  position: relative;
  border: 1px solid #d3d3d3;
  border-radius: 5px;
  margin: 15px 0 0;
  background-color: #fff;
}

.rpItem label {
  top: 8px;
  padding: 2px 8px;
  display: block;
  z-index: 1;
}

.rpItem input,
.rpItem select {
  position: relative;
  border: 1px solid #d3d3d3;
  border-radius: 5px;
  margin: 15px 0 0;
  background-color: #fff;
}

.showDescIconBest {
  background: var(--primary);
  padding: 4px 10px;
  border-radius: 50%;
  color: #fff;
  font-size: 12px;
  cursor: pointer;
  font-size: 19px;
}

.iti input::placeholder {
  font-size: 12px;
  font-weight: 300;
  opacity: 0.5;
}

@media (max-width: 720px) {

  .rezsearchButton,
  .availibiltyCalendarSearchArea,
  .availibiltyCalendarSearchArea button {
    width: 100%;
    max-width: 100%;
  }

  .personalitem .rezinput label {
    position: absolute;
    top: -5px;
    background: #fff;
    padding: 2px 8px;
    display: block;
    z-index: 1;
    left: 9px;
  }

  .personalitem .rezinput label.error {
    position: relative;
    top: 5px;
    left: 0px;
    padding: 0px;
  }

  .rezinput {
    margin: 10px 0 0px 0;
  }



  .table-container .pricedItem {
    margin-top: 12px;
  }

  #roomTypeCalendar .lb-wrap {
    padding: 2px;
    max-width: 95% !important;
    width: 95%;
    left: 3%;
  }

  .pricedItem span {
    font-size: 10px !important;
  }

  #rezpicker {
    margin-top: 15px;
    padding: 5px 0 0 5px;
  }

  .rezpickerday {
    margin: 10px 0;
  }

  .roomname {
    font-size: 1rem;
  }

  .roomItem .tab-menu {
    margin: 0;
  }

  .roomprice {
    font-size: 24px !important;
  }

  span.rateTypeLabel {
    white-space: nowrap;
  }

  .showRead {
    display: none;
  }

  .showText {
    max-height: inherit;
  }

  .roomItem .tab-menu li {
    white-space: nowrap;
  }

  .calendarAvailibiltyIn {
    top: 10px !important;
    border-radius: 0;
    padding: 5px;
    width: fit-content;
    left: auto;
  }

  .showDescIcon {
    background: var(--primary);
    padding: 4px 8px;
    border-radius: 50%;
    color: #fff;
    font-size: 12px;
    cursor: pointer;
  }

  .lossmessage {
    margin-bottom: 15px;
    font-size: 13px;
  }
}

@media (max-width: 720px) {
  .personalitem {
    margin: 10px 5px;
    padding: 5px 5px;
    border-radius: 5px;
    border: 1px solid #ebebeb;
  }

  .rezinput input,
  .rezinput select {
    padding: 5px;
  }

  .rezinfoItem span {
    font-size: 11px !important;
  }

  .rateType {
    flex-wrap: wrap;
    width: 100%;
  }

  .rateType .rateTypeLabel {
    margin-top: 5px;
    white-space: break-spaces;
    height: auto;
    width: 100%;
    margin-right: 0;
    padding: 0;
    font-size: 14px;
  }

  .itemRez {
    width: 47%;
  }
}

.row {
  margin: 0 !important;
  padding: 0 10px;
}

#paymethodArea .row {
  padding: 0;
}

.rezinput {
  padding: 5px;
}

.sectionInfo {
  font-weight: 700;
  /* background: linear-gradient(45deg, #979797, #00000030); */
  color: #fff;
  padding: 5px;
  width: 100%;
  position: relative;
}

.sectionInfo::before {
  content: ' ';
  position: absolute;
  top: 16px;
  left: 0;
  right: 0;
  border-bottom: solid 2px var(--primary);
  z-index: 1;
}

.reservationArea .sectionInfo {
  font-weight: 600;
  color: #fff;
  padding: 5px;
  width: 100%;
  font-size: 14px;
  display: flex;
  background: none;
}

.reservationArea .sectionInfo::before {
  content: ' ';
  position: absolute;
  top: 16px;
  left: 0;
  right: 0;
  border-bottom: solid 2px var(--primary);
  z-index: 1;
}

.sectionInfo>div {
  background-color: #fff;
  position: relative;
  z-index: 2;
  color: var(--secondary);
  width: fit-content;
  display: flex;
  align-items: center;
  padding: 0 5px;
  font-size: 16px;
}

#payArea {
  display: none !important;
  position: fixed;
  background: #0000004f;
  top: 0;
  width: 100%;
  height: 100vh;
  z-index: 100000;
  display: flex;
  align-items: center;
}

.pay {
  margin: auto;
  align-items: center;
  background: #fff;
  width: 300px;
  height: 500px;
}

.payinfo {
  color: black;
  width: fit-content;
  padding: 8px;
  border-radius: 10px;
  margin: 15px 5px;
  font-size: 18px;
  margin: 20px auto;
  font-weight: 600;
  background-color: #80808014;
}

.percentArea {
  display: flex;
  justify-content: space-between;
  padding: 15px;
  margin-left: 20px;
  align-items: center;
  background: #f8f8f8;
  flex-wrap: wrap;
  gap: 10px;
}

.percentButtons {
  display: flex;
  gap: 10px;
}

.percentButtons button {
  background: #fff;
  border: 1px solid;
  color: black !important;
  border-radius: 5px;
}

.percentArea .priceArea {
  font-weight: 700;
  font-size: 16px;
}

.percentButtons .active {
  background: #c5c5c5;
}

.paymentSeller {
  max-width: 720px;
}

.paymentItem {
  padding: 5px;
}

.messageArea {
  display: inline-block;
  background: #fff;
  width: 100%;
  padding: 5px;
  text-align: center;
  color: red;
  font-size: 18px;
  padding: 10px;
  border: 1px solid;
}

.infobar {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.infobar .itemRez {
  font-weight: 700;
  text-align: center;
  padding: 0;
  margin: 5px;
  text-align: center;
  min-width: 160px;
  max-width: 170px;
}

.rezbar {
  padding: 10px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

.HotelArea {
  display: flex;
  width: 100%;
  padding: 5px;
}

.paymentProcessArea,
.paymentProcessAreaWired {
  width: 100%;
  display: flex;
  gap: 10px;
  margin: 10px 0;
  background: #f5f5f5;
  padding: 5px;
  border-radius: 5px;
}

.hotellogo {
  max-height: 70px;
  margin: 10px;
}

.HotelArea {
  justify-content: center;
}

.waitingLoading {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999999;
  width: 100%;
  height: 100%;
  background: #fff;
  text-align: center;
  padding-top: 18%;
}

.rezLabel {
  margin-bottom: 0;
  text-align: center;
  display: flex;
  position: absolute;
  background: #fff;
  width: fit-content;
  top: -7px;
  padding: 0px 5px 5px 5px;
  left: 5px;
  z-index: 5;
  align-items: center;
}

.bankLogo {
  height: 50px;
  display: flex;
  align-items: center;
  width: 100%;
  justify-content: center;
}

.installOptions {
  margin: 5px;
}

.showInstalments {
  cursor: pointer;
}

.flexIns span {
  font-weight: 700;
  margin-left: 10px;
  font-size: 18px;
}

.flexIns {
  display: flex;
  align-items: center;
  min-height: 55px;
}

.flexIns>input {
  margin-bottom: 0 !important;
}

.roomloading {
  width: 4rem;
  height: 4rem;
  border: 5px solid #f3f3f3;
  border-top: 6px solid #9c41f2;
  border-radius: 100%;
  margin: 10px auto;
  animation: spin 1s infinite linear;
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

.rateTypeLabel {
  display: flex;
  align-items: center;
  cursor: pointer;
  padding: 0 5px;
  margin-right: 5px;
  /* border: solid 1px #ededed; */
  height: 28px;
  font-weight: 600;
  background-color: #fff;
  font-size: 18px;
  white-space: nowrap;
}

.priceBarArea {
  padding: 5px 0;
}

.priceBarArea>.rezSec {
  margin-bottom: 20px;
}

.priceBarArea>.rezSec:last-child {
  margin-bottom: 0;
}

.priceTopBar {
  padding: 0 5px 5px 5px;
  border-bottom: solid 1px #dedede;
  margin-bottom: 5px;
}

.priceTopBar:hover {
  background-color: #ededed;
}

.priceTopBar:hover .rezLabel {
  background: #ededed;
}

.priceTopBar:hover .rateTypeLabel {
  background: #ededed;
}

.priceTopBar:hover .detailsRate {
  background: #ededed;
}

.priceTopBar:hover .period-in-days {
  background: #ededed;
}

.priceBarArea .priceTopBar:last-child {
  border: none;
  margin-bottom: 0;
}

.rezinfoItem span {
  margin-right: 5px;
  font-weight: 400;
  font-size: 12px;
  align-items: center;
  justify-content: center;
  position: relative;
  display: flex;
  line-height: 11px;
}

.rezinfoItem .select2-container .select2-selection--single {
  height: 38px;
  border-radius: 0;
  border: none;
}

.rezinfo .rezLabel {
  display: flex;
  position: absolute;
  top: 0;
  background: #fff !important;
  width: fit-content;
  top: -14px;
  padding: 5px;
  left: 2px;
  z-index: 5;
}

.headerActionbar .rezinfoItem {
  border: none;
  background: #fff;
  height: 30px;
  margin: auto;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 35px !important;
}

.paymethodDescription {
  width: 100%;
  margin: 15px 0;
  background: #f5f5f5;
  padding: 10px;
}

.basketButtons {
  display: flex;
  gap: 5px;
  justify-content: space-between;
  text-align: center;
}

.basketButtons .deleteRez {
  margin: 0;
  width: 100%;
  background: var(--secondary);
  border-radius: 5px;
  font-size: 14px;
  font-weight: 600;
  color: var(--secondary-contrast);
}

.basketButtons .deleteRez i {
  margin-right: 5px;
}

.guestInfoArea {
  flex-wrap: wrap;
  margin-bottom: 8px;
  display: flex;
}

.guestInfoArea .guestItem {
  font-weight: 600;
  border: 1px solid #f1f1f1;
  padding: 5px;
  margin: 1px;
  border-radius: 5px;
  display: flex;
  justify-content: center;
  text-transform: uppercase;
}

.basketItemBasicInfo .mat-content {
  display: flex;
  justify-content: space-between;
}

.basketItemBasicInfo .mat-content>.mat-expansion-panel-header-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.basketItemBasicInfo .mat-content button {
  background: no-repeat;
  color: #000 !important;
  border: none;
}

.basketContainer {
  width: 100%;
  border: 1px solid #eee;
  padding: 10px;
  border-radius: 5px;
  margin: 10px 0;
}

.customshadow {
  box-shadow: 0 3px 3px -2px #0003, 0 3px 4px #00000024, 0 1px 8px #0000001f;
}

#showbasketItems {
  margin: 0 0 0 10px;
  border: 1px solid #eaeaea;
  padding: 10px;
  background-color: #fff;
}

.basketItem {
  display: flex;
  flex-direction: column;
}

.basketItem .bHotelInfo {
  align-items: flex-start;
  gap: 5px;
}

.basketItem .bHotelInfo .roomImg {
  width: 50%;
  height: 147px;
}

.deleteBasketItem {
  padding: 0 !important;
}

.basketItem .bHotelInfo .roomImg img {
  object-fit: cover;
  width: 100;
  border-radius: 5px;
}

.basketItem .bHotelInfo address {
  width: 100%;
  padding-left: 10px;
  font-size: 14px;
  display: flex;
  flex-wrap: wrap;
}

.hotelAddress * {
  display: block;
}

.nodiscount {
  justify-content: flex-end;
  text-decoration: line-through;
}

.basketItem .bHotelInfo .hotelAddress-ar {
  padding-right: 10px;
  padding-left: 0;
}

.basketItem .checkInOut {
  justify-content: space-between;
  display: block;
  width: 50%;
}

.basketItem .checkInOut .checkInfo {
  background-color: #dfdfdf;
  width: 100%;
  flex-direction: column;
  margin-bottom: 5px;
  border-radius: 5px;
}

.basketItem .checkInOut .checkInfo:last-child {
  margin-bottom: 0;
}

.basketItem .checkInOut .checkInfo .checkContent {
  flex-direction: column;
  padding: 5px;
}

.basketItem .checkInOut .checkInfo .checkContent .checkHead {
  justify-content: space-between;
  margin-bottom: 5px;
  font-size: 14px;
}

.basketItem .checkInOut .checkInfo .checkContent .checkCon .checkDay {
  font-size: 40px;
  align-items: center;
  margin-right: 5px;
  line-height: 35px;
}

.basketItem .checkInOut .checkInfo .checkContent .checkCon .checkMoreInfo {
  flex-direction: column;
  justify-content: flex-end;
}

.basketItem .checkInOut .checkInfo .checkContent .checkCon .checkMoreInfo .checkM {
  line-height: 8px;
  font-size: 11px !important;
}

.basketItem .checkInOut .checkInfo .checkContent .checkCon .checkMoreInfo .checkMY {
  font-weight: 500;
  line-height: 20px;
  font-size: 16px;
  white-space: nowrap;
}

.basketItem .basketPInfo {
  padding-top: 10px;
  border-bottom: solid 1px #b3b3b3;
  padding-bottom: 5px;
  margin-bottom: 10px;
}

.basketItem .basketPInfo .roomName {
  display: flex;
  align-items: center;
  width: 50%;
  font-size: 16px;
  font-weight: 600;
}

.basketItem .basketPInfo .roomPrice {
  flex-direction: column;
  width: 100%;
}

.basketItem .basketPInfo .roomPrice .bPrice {
  font-size: 14px;
  font-weight: 700;
  display: flex;
  justify-content: flex-end;
}

.basketItem .basketPInfo .roomPrice .bInformation {
  justify-content: flex-end;
  font-size: 14px;
}

.basketItem .bBottom {
  border-bottom: 1px solid #eee;
  padding-bottom: 10px;
}

.basketItem .bBottom .typeCon {
  width: 70%;
  font-size: 12px;
  flex-direction: column;
}

.basketItem .bBottom .typeCon .rateType {
  width: 100%;
}

.basketItem .bBottom .typeCon .boardType {
  margin-bottom: 5px;
}

.promoitem {
  display: flex;
  justify-content: space-between;
  font-weight: 700;
  font-size: 16px;
  background: #f5f5f5;
  padding: 7px 5px;
  line-height: 16px;
}

.basketItem .bBottom .totalP {
  align-self: center;
  width: 30%;
  justify-content: flex-end;
  align-items: center;
}

.basketItem .bBottom .totalP i {
  font-size: 24px;
  width: 24px;
  height: 24px;
}

.basketItem .bBottom button {
  align-items: center;
  justify-content: center;
  padding: 0;
  min-width: 50px;
  font-size: 14px;
}

.basketItem .promobox {
  width: 100%;
  flex-direction: column;
  margin: 4px 0;
}

.basketItem .promobox .promoitem {
  width: 100%;
  justify-content: space-between;
}

.basketItem .promobox .promoitem span:first-child {
  font-weight: 500;
}

.iti__country-list {
  z-index: 10000;
}

.available-days {
  display: flex;
  gap: 5px;
  margin: 10px 0;
  flex-wrap: wrap;
}

.dayItem {
  background: #f5f5f5;
  padding: 0 5px;
  border-radius: 5px;
}

.available-daysHeading {
  font-weight: 700;
  padding: 5px;
}

.tabOpen {
  min-width: 100px;
  cursor: pointer;
}

ul.tab-menu {
  gap: 10px;
}

li.tabOpen {
  background: white;
  padding: 10px !important;
  font-weight: 700;
}

li.tabOpen.active {
  border-bottom: 2px solid var(--primary);
}

li.tabOpen:hover {
  color: white !important;
}

.basketItem .basketExtraService {
  display: inline-block;
}

.extraQuantity {
  text-align: end;
  font-weight: 700;
}

.extraItemDescription table td,
.extraItemDescription table {
  border: none !important;
}

.hotelItem * {
  display: flex;
}

.extraInfo * {
  display: block;
}

.exServiceDate {
  text-align: center;
  margin: 15px 0;
  background: whitesmoke;
  padding: 5px;
  border-radius: 50px;
}

.basketItem .basketExtraServiceItems {
  margin-top: 15px;
  display: flex;
  flex-direction: column;
}

.basketItem .checkTitle {
  font-size: 14px;
}

.roomNameInfo {
  margin-left: 3px;
  color: var(--secondary);
  border-left: solid 3px var(--secondary);
  border-radius: 0;
  padding: 3px 5px;
  width: fit-content;
  min-width: 213px;
  font-weight: 600;
  font-size: var(--sizeMedium);
}

.voucherInput {
  margin: 20px 0;
}

.voucherInput input {
  background: beige;
}

.infoGroup {
  /* border: 1px solid #EEE; */
  margin: 10px 0 0 0;
  padding-bottom: 10px;
}

.basketActions {
  display: flex;
}

.deleteBasketIcon {
  background: red;
  color: #fff;
  padding: 10px 12px;
  border-radius: 50%;
}

.roomnameBasket {
  font-weight: 600;
}

.bItem.generalTotal {
  display: flex;
  justify-content: center;
  font-size: 18px;
  font-weight: 700;
  margin: 10px 5px;
}

.bItem.generalTotal>span:first-child {
  margin-right: 3px;
}

.extraDescriptionArea {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  overflow: auto;
}

.extraDescriptionArea img {
  width: 100%;
  height: 150px;
  object-fit: cover;
}

.extraDescriptionArea img {
  max-width: 320px;
  height: 250px;
}

.selectExtraItem {
  display: flex;
  align-items: center;
}

.extraItem {
  margin: 20px 0;
  padding: 10px;
  background-color: #fff;
}

.extraItemDescription {
  width: 50%;
  padding: 0 10px;
}

.extraItemPriceArea {
  margin: 10px;
  text-align: center;
  padding: 3px;
  border-radius: 5px;
}

.questionArea input.error {
  border: 1px solid red !important;
}

.extraItemPrice {
  font-weight: 700;
  font-size: 16px;
  width: auto;
  text-align: center;
  padding: 5px;
}

.extraServiceItems {
  height: 40px;
  width: 100%;
  font-size: 12px;
  text-align: center;
  padding: 0;
}

.instalmentInfoItem {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 14px;
  font-weight: 600;
  color: #e53935;
  cursor: pointer;
}

.installmentsInfo {
  display: flex;
  align-items: center;
  justify-content: end;
  margin: 5px;
}

#instalments .lb-wrap {
  width: 80%;
  max-width: 80%;
  left: 10%;
  right: 10%;
}

.closeExtra {
  display: flex;
  justify-content: flex-end;
  font-size: 25px;
  cursor: pointer;
}

#extraServices {
  background: var(--secondary);
  color: var(--secondary-contrast);
  max-width: 100% !important;
}

#completeBasketButton {
  max-width: 100% !important;
}

#extraServiceButton i {
  margin-right: 5px;
}

.totalExtraItem {
  width: fit-content;
  padding: 10px 0;
  float: right;
  font-weight: 700;
  min-width: 200px;
  text-align: center;
  font-weight: 700;
  font-size: 14px;
  border-radius: 5px;
  margin: 0 10px;
  text-align: end;
}

.modalArea {
  background: #fff;
  width: 100%;
  margin: 20px auto;
  max-width: 720px;
  padding: 10px;
  border-radius: 5px;
  border: 2px solid #efdbdb;
  position: relative;
}

.extraServiceButtonArea {
  width: 100%;
}

.extraHeadingFilter {
  font-size: 14px;
  font-weight: 700;
}

.extraHeading {
  font-weight: 700;
  margin: 10px;
  font-size: 20px;
  display: flex;
  justify-content: space-between;
}

#extraServiceButton {
  border: none;
  border-radius: 5px;
  background: var(--primary);
  margin: 10px;
}

.modal {
  display: flex;
  max-height: 500px;
  overflow: auto;
}

.modalOverlay {
  position: fixed;
  top: 0;
  z-index: 555;
  background: #00000080;
  left: 0;
  right: 0;
  height: 100%;
  display: none;
}

.selectExtraItem span {
  margin-left: 10px;
  font-weight: 700;
}

.selectExtraItem span {
  margin: 10px 0;
  font-size: 18px;
}

input.extraItemsCheck {
  height: 44px;
  width: 25px;
}

.questionLabel {
  margin: 5px 0;
  padding: 5px;
  font-weight: 700;
}

.basketWrap {
  margin: 10px 0;
  border: 1px solid gray;
  padding: 5px;
}

.rezInfoArea .rezInfoItem {
  margin-bottom: 1px;
  display: block;
  background: #f5f5f5;
  padding: 5px;
}

.rezInfoArea .rezInfoItem span:first-child {
  font-weight: 700;
  margin-right: 10px;
  width: 80px;
}

.rezInfoArea .rezInfoItem span:last-child:before {
  content: ':';
  margin: 5px;
}

.rezInfoItem span {
  display: inline-block;
}

.basketLink {
  background: #f5f5f5;
  padding: 5px;
  margin: 2px 0;
  display: block;
  color: #000 !important;
}

#callErrorsMessage {
  background: linear-gradient(45deg, #f0f0f0, transparent);
  margin: 5px 0;
  border-radius: 5px;
}

.iconed {
  display: flex;
  align-items: center;
}

.iconed i {
  background: blue;
  padding: 3px 7px;
  z-index: 5;
  margin: 5px;
  color: #fff;
  border-radius: 50%;
  cursor: pointer;
}

.payLinksVoucher {
  background: #f5f5f5;
  padding: 15px 9px;
  width: fit-content;
  border-radius: 6px;
}

#calculatedArea {
  padding: 5px;
  background: linear-gradient(211deg, white, #ebebeb);
}

#calculatedArea .label {
  width: 100px !important;
  display: inline-block;
  font-weight: 700;
}

#calculatedArea .item {
  padding: 5px 0;
  font-size: 16px;
}

.calCulatedItem label {
  width: 100px;
}

.calCulatedItem {
  margin-bottom: 10px;
  border-bottom: 1px solid #fff;
  padding: 6px;
  align-items: center;
}

.flex .cbutton {
  padding: 8px;
  max-width: 100px;
}

.clearButton {
  background: red !important;
}

.cbutton.cancelDiscount {
  background: red;
}

#discoutLabel,
#priceLabel {
  display: flex;
}

.flex .cbutton {
  max-width: 120px;
  padding: 8px;
  margin: 5px;
}

.makeReservationform-control {
  width: 50%;
}

ul#callErrorsMessage li {
  text-align: left;
  line-height: 1px;
  font-weight: 700;
  color: red;
  padding: 10px 0;
}

.guestCallArea {
  display: flex;
  gap: 10px;
  margin: 20px 0 0;
}

.guestCallArea input {
  text-align: left;
}

.cbutton {
  background: var(--primary);
  width: 100%;
  color: var(--primary-contrast);
  text-align: center;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  cursor: pointer;
  border-radius: 5px;
}

.callButtonArea {
  flex-wrap: inherit;
  gap: 5px;
}

.callMessage {
  text-align: center;
  font-weight: 700;
  background: #f5f5f5;
}

ul#callErrorsMessage {
  margin: 0;
}

.GuestCallAreaContainer {
  position: sticky;
  top: 50px;
  z-index: 10;
  background-color: #fff;
  padding: 1px 10px 10px;
  margin-bottom: 20px;
  display: none;
}

.guestCallFinder {
  margin: 10px 0;
}

.guestCallFinder td {
  text-align: left;
}

.guestCallFinder table {
  margin: 0;
}

.guestCallFinder {
  margin: 10px 0;
  max-height: 200px;
  overflow: auto;
}

.createGuest {
  background: #5cd95c;
  color: #fff;
  padding: 8px 4px 8px 8px;
  display: flex;
  align-items: center;
  cursor: pointer;
  width: 100px;
}

.priceTypeOptions {
  opacity: 0.5;
  pointer-events: none;
  background: #efefef;
  border-radius: 5px;
  padding: 5px;
  display: inherit;
}

.priceTypeOptions.active {
  opacity: 1;
  pointer-events: auto;
}

#priceTypeArea label {
  display: block !important;
  padding: 0;
}

.priceTypeOptions input {
  margin-bottom: 5px;
  font-weight: 700;
}

.priceCalculateMessage {
  display: inline-block;
  background: #f5f5f5;
  width: 100% !important;
  color: red;
  text-align: center;
}

.guetInfoArea {
  background: blue;
  color: #fff;
  padding: 0 7px;
  border-radius: 50%;
  display: inline-block;
  margin: 2px;
  cursor: pointer;
}

.promItem {
  display: flex;
  gap: 10px;
  align-items: center;
}

.promItem Input {
  width: 75px;
}

.creditCardArea input {
  margin: 5px 0;
  font-size: inherit;
}

#creditCard>div {
  margin: 0px 0px 15px 0px;
}

.payDescription {
  margin: 15px 0;
}

.themeMod .roomcount-basket .addbasket {
  width: 100% !important;
}

.themeMod .roomprice .discountRate:before {
  display: none !important;
}

.themeMod .roomprice .discountRate:after {
  display: none !important;
}

.themeMod .roomprice .discountRate {
  min-height: 20px;
  border-radius: 5px;
}

.themeMod .roomprice .standartDiscount {
  margin-top: 0;
  margin: 0;
}

.themeModBar .listAmenitiesItem {
  border: none;
}

@media (max-width: 720px) {

  .themeModBar {
    flex-wrap: wrap;
    height: auto !important;
  }

  .makeReservationform-control {
    width: 100%;
  }

  .extraItemDescription {
    width: 100%;
    text-align: justify;
  }

  .extraFieldArea {
    display: flex;
  }

  .extraDescriptionArea {
    flex-wrap: wrap;
    justify-content: center;
    flex-direction: column;
    align-items: center;
  }

  .specialDate {
    position: relative !important;
    top: 0 !important;
  }

  .guestCallArea {
    flex-wrap: wrap;
    margin: 30px 0;
  }

  .guestCallArea .rezinfoItem {
    width: 45%;
    margin: 5px;
  }

  .rezinfoItem.callButtonArea {
    display: flex;
    width: 100%;
  }

  .rezinfoItem.callButtonArea div {
    width: 24%;
  }

  .firstSecondBar .comission {
    display: flex;
    padding-right: 0;
    justify-content: flex-end;
    align-items: center;
    margin-bottom: 5px;
    gap: 5px;
  }

  .discountRate {
    font-size: 16px;
  }

  .comission {
    gap: 0;
  }

  .firstinBar {
    width: 50%;
    align-items: flex-start;
    padding-top: 10px;
  }

  .firstSecondBar {
    width: 50%;
    padding-top: 10px;
  }

  .roomprice {
    font-size: 18px;
  }

  .roomprice {
    text-align: end;
    flex-direction: column;
    align-items: flex-end;
    padding-left: 0;
  }

  .themeMod .roomprice .standartDiscount {
    margin: 0 !important;
    margin-top: -20px !important;
  }

  .themeMod .themeModBar {
    width: 100% !important;
    justify-content: space-around;
  }

  .themeMod .roomprice .discountRate:before {
    display: none !important;
  }

  .themeMod .roomprice .discountRate:after {
    display: none !important;
  }

  .themeMod .roomprice .discountRate {
    min-height: 35px !important;
    border-radius: 10px;
  }

  .themeMod .roomname {
    margin-top: 10px;
    display: flex;
    align-items: center;
    gap: 5px;
  }

  .themeMod .standartDiscount {
    margin-top: -472px !important;
  }

  .themeMod .roomcount-basket {
    justify-content: space-between;
    flex-direction: row;
    gap: 25px;
  }

  .roomcount-basket .rezinfoItem {
    margin-top: 0;
    width: 100% !important;
  }

  .comissionLabel {
    width: 95px;
    white-space: inherit;
  }

  .extraHeading {
    flex-direction: column;
    margin: 0;
  }

  .extraHeadingFilter {
    font-size: 12px;
  }
}

table th {
  background: #f3f3f3;
  border: 1px solid #ccc;
  padding: 5px;
}

.row {
  margin: 0;
}

.formItemP.readonly input {
  pointer-events: none;
  color: #a0a0a0;
}

.formItemP.readonly {
  color: silver;
}

.saveBtn {
  margin: 10px 0;
}

.flexMod {
  display: flex;
  align-items: center;
}

#pDescription {
  padding: 0 9px;
  border-radius: 5px;
}

main.main.newMain h2 {
  border: none;
  background: linear-gradient(45deg, #d9d9d9, transparent);
  padding: 0;
  color: #000;
  margin: 10px 0;
}

.formItemP {
  margin: 15px 8px;
  position: relative;
  border: 1px solid #e7e0e0;
  border-radius: 5px;
}

.grid {
  display: grid;
  grid-template-columns: auto auto;
  gap: 10px;
}

.checkItem {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 5px 0;
}

.formItemP input {
  border: none;
}

#promotionAndBonusArea {
  margin: 10px 0;
  background: linear-gradient(45deg, #dfdfdf, transparent);
  padding: 10px;
  width: 100%;
  line-height: 15px;
}

.bonusText {
  text-align: center;
  font-weight: 700;
  font-size: 16px;
}

.error {
  color: red;
}

.formItemP label {
  position: absolute;
  top: -10px;
  margin-left: 10px;
  background: #fff;
  padding: 1px 8px;
}

.phoneArea span {
  display: initial;
}

.reasonItem {
  text-align: center;
  font-weight: 700;
  margin: 10px;
}

@media screen and (max-width: 860px) {
  .profileContent .inner-nav {
    width: 100%;
  }

  .profileContent .inner-nav li {
    width: 100%;
  }

  .profileContent .inner-nav li.active {
    width: 100%;
  }

  .inner-nav li.active a:after {
    display: none;
  }

  div#lastBasketsArea {
    overflow-y: auto;
  }

  div#lastBasketsArea table td {
    white-space: nowrap;
  }

  div#lastBasketsArea table th {
    white-space: nowrap;
  }
}

.disabledActions {
  opacity: 0.3;
  pointer-events: none;
}

span.count {
  background: #fff;
  width: 15px;
  padding: 0;
  margin: 0;
  height: 23px;
  line-height: 25px;
  padding: 0 0;
  width: 23px;
  text-align: center;
  border-radius: 50%;
  font-size: 10px;
  margin: 20px 7px;
  color: #000;
}

td.green {
  color: green;
}

.agencySelectArea {
  padding: 15px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.agencySelectArea label {
  padding: 0;
  width: 100%;
}

.agencySelectArea span.select2-selection.select2-selection--single {
  background: transparent;
  border: 1px solid #fff;
}

.agencySelectArea span#select2-chooseAgency-container,
.agencySelectArea span#select2-chooseHotel-container {
  color: #fff;
  line-height: 28px !important;
  width: 200px;
}

.agencySelectArea .select2-container--default .select2-selection--single .select2-selection__placeholder {
  color: #fff;
}

.select2-dropdown {
  z-index: 1000000;
}

#chooseAgency option {
  color: #000;
}

.getCallRez {
  cursor: pointer;
  text-align: center;
}

#depositPaymentMessage {
  margin: 10px;
}

#loginUserForm label.error {
  display: none !important;
}

li.description a {
  text-align: center;
  padding: 8px;
}

.count-profile {
  display: none;
}

.createCallSimple {
  background: orange;
}

.selectGuestActions {
  display: flex;
  gap: 10px;
  justify-content: start;
  align-items: center;
}

.selectGuestActions i {
  cursor: pointer;
}

#wiredpayButtonArea .button {
  background: whitesmoke;
  padding: 20px;
  border-radius: 5px;
  display: block;
  border: 1px solid #dfdfdf;
  cursor: pointer;
  font-weight: 700;
}

#wiredpayButtonArea {
  display: flex;
  gap: 10px;
  height: 145px;
  align-items: center;
  flex-wrap: wrap;
}

#contentBoxSlider .lb-wrap,
#contentBoxSlider .lb-content,
#Gallery .lb-wrap,
#Gallery .lb-content {
  padding: 0;
  margin: 0 auto;
  border-radius: 0;
}

#contentBoxSlider .close,
#contentBoxSlider .close i,
#Gallery .close,
#Gallery .close i {
  background: transparent
}

.group .slider {
  flex-direction: column !important;
}

.slider-container {
  overflow: hidden;
  width: 100%;
}

.slider {
  display: flex;
  transition: transform 0.3s ease-in-out;
}

.slide {
  min-width: 100%;
  position: relative;
  width: 100% !important;
}

img.bg-img {
  z-index: -1;
  width: 100%;
  opacity: .5;
  object-fit: cover;
  filter: blur(10px);
  height: 100%;
  margin: 0 auto;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  /* width: 100% !important; */
}

.detailSliderArea {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5px;
}

.slide img {
  width: 100%;
}

span.slideButton {
  background: #ffffffe8;
  color: black;
  padding: 10px 15px;
  border-radius: 8px;
  cursor: pointer;
  position: absolute;
  z-index: 1;
}

.prevButton {
  left: 15px;
}

.nextButton {
  right: 15px;
}

.rezSearchIcon {
  position: absolute;
  right: 0;
  left: 0;
  width: fit-content;
  margin: auto;
  top: 40%;
  color: black;
  font-size: 20px;
  background: #ffffffd4;
  padding: 10px;
  cursor: pointer;
  display: none;
  border-radius: 50% !important;
  transition: 1s;
  z-index: 1;
}

.roomItemDetail:hover .rezSearchIcon {
  display: block;
}

.reservationOptions {
  display: flex;
  gap: 20px;
}

.offerOptions {
  max-height: 120px;
}

.resActions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 10px 0;
}

.options i {
  background: green;
  color: #fff;
  padding: 5px;
  border-radius: 5px;
  cursor: pointer;
}

.resActions .options {
  display: flex;
  align-items: center;
  gap: 10px;
}

.selectGuestActions .fa-basket-shopping {
  color: red;
  padding: 5px;
  border-radius: 3px;
}

.selectGuestActions i {
  padding: 5px;
}

.discountDetailArea {
  margin-bottom: 10px;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.discountItem {
  background: whitesmoke;
  display: flex;
  gap: 10px;
  margin: 3px 0;
  align-items: center;
  padding: 5px 10px;
  width: fit-content;
  box-shadow: 2px 2px 6px darkgrey;
}

.discountItem .discountRate {
  font-size: 12px;
  height: auto;
  min-width: fit-content;
  padding: 0;
  margin: 0;
  padding: 5px;
}

.discountItem .discountName {
  min-width: 165px;
}

.manuelDiscountItemsArea .items {
  display: flex;
  gap: 5px;
  background: #fff;
  padding: 5px;
  margin: 1px 0;
  align-items: center;
}

.manuelDiscountArea {
  justify-content: space-between;
  margin: 10px 0;
  font-size: 20px;
  background: whitesmoke;
  padding: 5px;
  align-items: center;
  border-radius: 5px;
}


.actionsM {
  display: flex;
  gap: 5px;
  width: 100%;
  align-items: center;
}

.actionsM .cbutton {
  padding: 5px;
  width: auto;
}

.items label {
  min-width: 200px;
}

.rezinput textarea {
  height: 40px;
}

.basicModeArea .rateTypeLabel {
  white-space: normal;
  width: 200px;
  height: auto;
}

.basicModeArea .addbasket {
  width: fit-content;
}

.basicMode {
  display: flex;
  gap: 5px;
  margin: 0 10px;
  font-weight: 700;
  text-decoration: underline;
  /* white-space: nowrap; */
  flex-wrap: wrap;
  width: 80p;
}

.basicItem {
  background: whitesmoke;
  padding: 3px;
  border: 1px solid #d2d2d2;
  border-radius: 5px;
  font-size: 12px;
  overflow: hidden;
  width: 150px;
}

.callMesssages {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column-reverse;
}

.chatComment.directionTrue {
  display: flex;
  justify-content: end;
}

.chatComment {
  display: flex;
  justify-content: start;
}

.chatComment.directionTrue span {
  background: #d9fdd3;
}

.chatComment span {
  border: 1px solid #d4cece;
  margin: 10px 0;
  padding: 10px;
  border-radius: 5px;
}

.kvkkAgrement {
  display: flex;
  align-items: center;
  gap: 15px;
  margin: 0 0;
  width: 100%;
  margin-bottom: 15px;
}

.kvkkAgrement span {
  width: 100%;
}

.kvkkAgrement input {
  width: 20px;
}

.kvkkAgrement span:hover {
  text-decoration: underline;
  cursor: pointer;
}

label#kvkk-error {
  position: absolute;
  top: -10px;
}

#finallyButton {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.showBillArea {
  width: 100%;
}

.changeRezMod {
  margin: 10px 0;
  display: flex;
  justify-content: space-evenly;
  gap: 10px;
  background: #fff;
}

.changeRezMod button {
  color: inherit !important;
  background: #fff;
  border: none;
  border-bottom: 2px solid lightgrey;
  border-radius: 0;
  width: 100%;
}

.changeRezMod button.active {
  border-color: #000;
}

.buyLater {
  text-align: center;
  margin: 6px 0;
  background: var(--secondary);
  color: var(--secondary-contrast);
  padding: 10px;
  border-radius: 5px;
  cursor: pointer;
  font-weight: 600;
  font-size: 14px;
}

.buyLaterButtons {
  display: flex;
  gap: 10px;
  margin: 20px 0;
  width: 100%;
}

.buyLaterButtons .cbutton {
  padding: 10px;
  width: 70%;
}

.buyLaterButtons .cbuttonCancel {
  width: 30%;
}

.promotionItem {
  display: flex;
  gap: 10px;
  align-items: center;
}

.promotionInput input {
  width: fit-content !important;
}

.promotionItem input {
  border: 1px solid #dcdada;
}

.promotionItem button {
  border-radius: 5px;
  border: none;
  background: var(--secondary) !important;
  color: var(--secondary-contrast) !important;
}

.head-info {
  display: flex;
  justify-content: space-between;
}

.hotel-map {
  cursor: pointer;
  width: 125px;
  display: flex;
}

.showMap {
  width: 100%;
  height: 90px;
  border: solid 4px #fdf4cc;
  position: relative;
}

.showMap>img {
  width: 100%;
  height: 82px;
}

.showMap>span {
  cursor: pointer;
  position: absolute;
  left: 0;
  right: 0;
  font-size: 12px;
  width: 100%;
  text-align: center;
  font-weight: 600;
  bottom: 0;
  line-height: 14px;
}

.mapText {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  padding: 0;
  margin: 0;
}

.hotel-con {
  padding: 0 15px;
}

.hotel-con h1 {
  padding: 0;
}

.socials {
  display: flex;
}

.socials>div:last-child>a {
  margin-right: 0;
}

.socials>div:last-child>a>i {
  margin-right: 0;
}

.hotel-contact {
  display: flex;
  width: 100%;
  justify-content: space-between;
  align-items: center;
  margin-top: 10px;
  flex-wrap: wrap;
}

.hotel-contact a {
  display: flex;
  align-items: center;
  gap: 5px;
  color: #000;
  margin-right: 10px;
}

.hotel-contact>div {
  margin-bottom: 10px;
  margin-right: 5px;
}

.hotel-contact a>i {
  font-size: 20px;
  margin-right: 5px;
}

.hotel-info-def-facility .item {
  border: 1px solid #eee;
  width: 33.33%;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 32px;
}

.hotel-info-def-facility .item>i {
  font-size: 16px;
  margin-right: 5px;
}

.hotel-info-def-facility {
  justify-content: space-between;
  display: flex;
  width: 100%;
  justify-content: space-around;
  margin-top: 15px;
}

.photoContent .defPhotoCon {
  height: 380px;
}

ul#imageGallery img {
  max-height: 380px;
}

img.defaultPhoto {
  height: 100%;
  width: 100%;
}

.photoContent {
  width: 100%;
}

.hotel-info {
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  background-color: #fff;
}

.hotel-info .InfoItem {
  position: relative;
  width: 50%;
}

.carbon-free {
  position: absolute;
  right: 10px;
  top: 10px;
  width: 60px;
  height: 60px;
}

.carbon-free>img {
  width: 100%;
}

.hotel-desc {
  margin-top: 15px;
  max-height: 295px;
  overflow: auto;
  width: 100%;
  text-align: justify;
}

.facilityHeading {
  font-size: 16px;
  padding-left: 10px;
  cursor: pointer;
}

.nightPrice {
  font-size: 10px;
  font-weight: 400;
  line-height: 3px;
  text-align: right;
  margin-top: -5px;
}

.roomPriceContent .roomPriceCon {
  color: #212121;
}

.roomPriceContent .roompricenodiscount .roomPriceCon {
  color: #2121219e;
}

.lastRoomWarning {
  color: orange;
  background: #f6f6f6;
  padding: 5px;
  width: fit-content;
  border-radius: 5px;
  font-size: 15px;
}

@media (max-width: 720px) {
  #extraServiceButton {
    width: 90%;
    max-width: 250px;
  }

  .nightPrice {
    text-align: right;
    margin-right: 0;
  }

  .hotel-info .InfoItem {
    width: 100%;
  }

  .hotel-con {
    padding: 0;
    margin: 20px 0;
  }
}

.extraServiceMessage {
  text-align: center;
  font-weight: 700;
  margin: 10px;
}

.extraServiceSearchArea {
  display: flex;
  align-items: center;
  width: fit-content;
  border-bottom: 1px solid #000;
}

.extraServiceSearchArea input {
  border: none;
}

.clickToCallRez {
  text-align: center;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  color: #f44336;
  font-weight: 500;
  font-size: 13px;
}

.clickToCallRez>i {
  font-size: 22px;
}

.clickToCallRez>span {
  text-decoration: underline;
  margin-left: 5px;
}

.buyLaterFinal {
  background: var(--secondary);
  display: flex;
  align-items: center;
  color: #fff;
  font-weight: 600;
  justify-content: center;
  margin: 0 10px;
  cursor: pointer;
  padding: 10px;
  font-size: 14px;
}

.detail-stars i {
  color: var(--primary);
  font-size: 18px;
}

.detail-addres {
  font-weight: 500;
  margin: 10px 0;
}

.cancelPromotion {
  cursor: pointer;
  width: 100%;
  text-align: center;
  width: fit-content;
  margin: auto;
  background: var(--primary);
  color: var(--primary-contrast);
}

.themeMod .comission {
  display: flex;
  justify-content: end;
  position: relative;
}

.themeMod .roomPriceCon {
  display: flex;
  justify-content: end;
}

.themeMod .roomprice {
  justify-content: end;
  flex-wrap: wrap;
  display: grid;
  text-align: end;
  color: var(--secondary);
  font-size: 24px;
  margin: 10px 0;
  line-height: 35px;
  flex-direction: column;
  align-items: flex-end;
}

.themeMod .roompricenodiscount {
  font-size: 20px;
}

.themeMod .roomBasketArea {
  justify-content: end;
  display: flex;
  flex-wrap: wrap;
}

.themeMod .roomBasketArea>* {
  width: 100%;
}

.themeMod .roomBasketArea>* {
  margin: 3px 0;
}

.themeMod .boardType {
  text-align: center;
  font-weight: 700;
  margin: 14px 0 7px !important;
}

.themeMod .standartDiscount {
  /* border: 1px solid #dbd6d6;
  border-radius: 5px;
  margin: 0;
  padding: 0 18px;
  display: flex !important;
  flex-direction: row;
  background: whitesmoke !important;
  width: 100%; */
  margin-top: -15px;
  margin-bottom: 15px;
}

.themeMod .standartDiscount>* {
  /* background: transparent !important; */
  /* color: inherit; */
  width: fit-content;
  white-space: nowrap;
}

.showOtherBoard {
  text-align: center;
  cursor: pointer;
}

.themeModBoardsArea .addbasket {
  min-width: 125px !important;
}

.themeModBar * {
  color: inherit !important;
}

.themeModBar .listAmenities i {
  border: none;
}

.themeModBar {
  display: flex;
  gap: 15px;
}

.themeModBar {
  align-items: center;
  border: 1px solid #d0d0d0;
  padding: 5px;
  border-radius: 5px;
  height: 50px;
  width: fit-content;
  margin: 10px 0 10px 0;
}

.themeModBar svg {
  height: 20px;
  width: 8px;
}

.themeMod .rezimg {
  height: 305px;
  border-radius: 5px;
  margin-top: 0;
}

.themeMod .nightPrice {
  margin: 10px 0;
}

.roomText ul li {
  list-style: disc;
  padding: 0;
  margin-left: 20px;
}

.themeMod .roomText p {
  padding: 0;
  line-height: 18px;
}

.themeMod .roomText {
  max-height: 180px;
}

.makeReservation {
  font-size: 14px !important;
  font-weight: 600;
}

.classicSearchBox .rezinfoItem {
  border-width: 1px;
  border-radius: 5px;
}

.classicSearchBox .pickerArea span:first-child {
  border-top-width: 1px;
  border-left-width: 1px;
  border-radius: 5px 0 0 5px;
}

.classicSearchBox .pickerArea span:last-child {
  border-top-width: 1px;
  border-left-width: 1px;
  border-right-width: 1px;
  border-radius: 0 5px 5px 0;
}

.bottomLeftTopContent {
  display: flex;
}

@media (min-width: 921px) {
  .themeMod {
    display: flex;
    justify-content: end;
    height: 100%;
  }
}

@media (max-width: 720px) {
  .bottomLeftContainer {
    width: 100%;
    display: flex;
    flex-direction: column;
  }

  .bottomLeftTopContent {
    width: 100%;
    justify-content: space-between;
  }

  .bottomLeftBottomLinks {
    margin-bottom: 15px;
    justify-content: space-around;
  }

  .themeMod .rezimg {
    max-height: 160px;
  }

  .themeMod .addbasket {
    min-width: 50%;
  }

  #showbasketItems {
    margin-left: 0;
  }

  .reservationArea {
    padding: 0;
  }

  .makeReservation {
    width: 100%;
  }

  .buyLaterFinal {
    width: 40%;
    margin: 0;
    white-space: nowrap;
  }

  .hotel-info-def-facility {
    flex-direction: column;
  }

  .hotel-info-def-facility .item {
    width: 100%;
  }

  .roomText {
    margin: 0;
  }

  .roomItemDetail div.row {
    padding: 0;
  }

  .groupPageWidget {
    margin-top: inherit;
  }

  .groupPageWidget .rezinfoItem {
    border-color: #000;
  }

  .groupPageWidget .rezinfo {
    border-radius: 0;
    margin-bottom: 10px;
    background-color: #fff;
    box-shadow: 0 3px 3px -2px #0003, 0 3px 4px #00000024, 0 1px 8px #0000001f !important;
    margin-top: 0;
    padding: 10px 15px;
  }

  .groupPageWidget .hotelItemIn {
    margin: 0;
  }

  .period-in-days {
    white-space: normal;
    height: auto;
    margin: 0;
    padding: 0;
  }

  .sectionInfo {
    justify-content: center;
  }

  .groupPageWidget #rezpicker i {
    color: #000;
  }

  .groupPageWidget .rezinfoItem span {
    color: #000;
    text-shadow: none;
  }

  .groupPageWidget .inputReset {
    color: #000;
    text-shadow: none;
  }

  .addbasket {
    width: 50%;
  }

  .addToBasketCon {
    display: flex;
    justify-content: space-between;
  }

  .mobileadd {
    width: 50% !important;
  }

  .rezSec {
    border-bottom: solid 1px #dedede;
    padding-bottom: 10px;
    margin-bottom: 5px;
    width: 100%;
    box-sizing: border-box;
  }

  .boardTypeContent .rezSec:last-child {
    border: none;
  }
}

/*Best Room*/

.BestRoomItemSec .bHotelInfo {
  width: 100%;
  display: flex;
  justify-content: end;
}

.bestPriceSelectAllList {
  font-weight: 700;
  align-items: center;
  display: flex;
  padding: 5px;
  justify-content: space-between;
  font-size: 16px;
}

.BestRoomItemSec {
  margin: 5px 5px 0 0;
  background: white !important;
  display: inline-block;
  padding: 5px;
  min-height: 430px;
}

.bestPriceAra {
  display: flex;
  gap: 5px;
  align-items: center;
}

.bHotelInfo {
  display: flex;
  gap: 15px;
  align-items: center;
}

.roomName {
  font-weight: 700;
  font-size: 15px;
}

.BestRoomItemInner {
  border-radius: 5px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 10px 0;
  width: fit-content;
  padding: 5px;
}

.BestRoomItemInner>span {
  border: 1px solid #e5e5e5;
  padding: 6px;
  border-radius: 5px;
  font-size: 15px;
}

.BestRoomItem .discountRate:before,
.BestRoomItem .discountRate:after {
  visibility: hidden;
}

.bestItemSelectAllButton {
  gap: 5px;
  width: fit-content;
  padding: 15px;
}

.bestItemSelectAllButton i {
  background: white;
  padding: 5px;
  color: var(--primary);
  width: 30px;
  height: 30px;
  line-height: 20px;
  border-radius: 50%;
}

.priceParams {
  display: flex;
  align-items: center;
  gap: 15px;
  flex-wrap: wrap;
}

.priceParams .roomPriceCon {
  color: var(--primary);
}

/*Best Room End */

/*UpRoom */

.itemUp {
  display: flex;
  gap: 10px;
}

.itemUp span {
  background: whitesmoke;
  padding: 5px;
  border-radius: 5px;
  border: 1px solid #b4b4b4;
}


.upRoomDesc .showDescIcon {
  width: 25px;
  height: 25px;
  text-align: center;
  background: var(--primary);
  line-height: 25px;
  border-radius: 50%;
  margin-right: 5px;
  color: white;
  cursor: pointer;
}

.UpRoom {
  background: black;
  color: white;
  padding: 10px;
  font-weight: 700;
  width: fit-content;
}

.UpRoomCancel {
  text-decoration: underline;
  padding: 5px;
}

.UpButtons * {
  cursor: pointer;
}

.upRoomDesc {
  padding: 0px 10px;
}

.uproomModal {
  font-size: 15px;
  margin: 10px 0;
  text-align: center;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  white-space: break-spaces;
  line-height: 20px;
}

.upRoomItem img {
  height: 100%;
  object-fit: cover;
  width: 100%;
  max-height: 160px;
  min-height: 160px;
}

.upRoomItem {
  margin: 15px 5px !important;
  width: 98%;
  padding: 5px;
}

.upRoomItem h1 {
  font-size: 14px;
}



/*Uproom End*/