.video-grid {
  background: transparent !important;
  padding: 16px 0;
}
.video-grid .video-box {
  width: calc(100% / 4);
  box-shadow: none;
  position: relative;
  padding: 15px;
}
.video-grid .video-box .video-info {
  display: flex;
  justify-content: space-between;
  padding: 5px;
}
.video-grid .video-box .video-thumbnail {
  position: relative;
}
.video-grid .video-box .video-thumbnail img {
  width: 100%;
  height: 150px;
  object-fit: cover;
  border-radius: 5px;
}
.video-grid .video-box .play-icon {
  position: absolute;
  color: white;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 30px;
}
@media (max-width: 990px) {
  .video-grid .video-box {
    width: calc(100% / 3);
  }
}
@media (max-width: 567px) {
  .video-grid .video-box {
    width: calc(100% / 2);
  }
  .video-grid .video-box .video-thumbnail img {
    height: 155px;
  }
}
.video-form {
  padding: 16px 24px !important;
}
@media (max-width: 567px) {
  .video-form {
    padding-left: 24px;
    padding-right: 24px;
  }
}
.video-form .edit-icon {
  position: absolute;
  font-size: 16px;
  bottom: 0px;
  right: 0px;
  border-radius: 8px;
  background: white;
  height: 20px;
  width: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.video-form label {
  font-weight: bold !important;
}
.video-single-card {
  border-radius: 10px;
  background: transparent !important;
  box-shadow: 0 1px 2px -2px rgba(0, 0, 0, 0.16), 0 3px 6px 0 rgba(0, 0, 0, 0.12), 0 5px 12px 4px rgba(0, 0, 0, 0.09);
}
.video-single-card .ant-card-body {
  padding: 0;
}
.video-single-card .video-single-card-thumb {
  position: relative;
  width: 100%;
  padding-top: calc(100% - 50px);
}
.video-single-card .video-single-card-thumb img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-top-right-radius: 10px;
  border-top-left-radius: 10px;
}
.video-single-card .video-single-card-thumb .value {
  position: absolute;
  top: 10px;
  left: 10px;
}
.video-single-card .video-single-card-thumb .download-icon {
  position: absolute;
  bottom: 10px;
  right: 10px;
}
.video-single-card .info {
  padding: 10px 0 10px 10px;
  font-weight: bold;
  color: #000000;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.purchased-video-card {
  margin-bottom: 20px;
}
.purchased-video-card .purchased-video-card-thumb {
  padding: 20px;
  background-color: rgba(255, 0, 102, 0.1);
  border-radius: 10px;
  position: relative;
}
.purchased-video-card .purchased-video-card-thumb img {
  width: 100%;
  height: 150px;
  border-radius: 10px;
}
.purchased-video-card .purchased-video-card-thumb span {
  font-size: 30px;
  color: #ffffff;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 99;
}
.purchased-video-card .purchased-video-card-name {
  width: 100%;
  height: 50px;
  line-height: 50px;
  font-size: 13px;
  font-weight: bold;
  text-align: center;
  text-transform: uppercase;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.video-dimensions {
  width: 100%;
  min-height: 250px;
  max-height: 320px;
}

.favorite-performer-grid {
  background: transparent !important;
  width: 100%;
}
.favorite-performer-grid .icon {
  color: #ff0066;
  position: absolute;
  bottom: 50px;
  cursor: 'pointer';
  right: 25px;
  font-size: 15px;
}
.favorite-performer-grid .ant-card-head {
  padding: 0 10px !important;
  border: none;
}
.favorite-performer-grid .performer-box {
  width: calc(100% / 6);
  padding: 10px;
  position: relative;
}
.favorite-performer-grid .performer-box .tags {
  color: #8c8c8c;
}
.favorite-performer-grid .performer-box .about-me {
  color: #000000;
  font-weight: bold;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.favorite-performer-grid .performer-box .performer-avatar {
  position: relative;
  display: block;
}
.favorite-performer-grid .performer-box .performer-avatar img {
  width: 100%;
  height: 140px;
  object-fit: cover;
  border-radius: 15px;
}
.favorite-performer-grid .performer-box .performer-title {
  display: flex;
  flex-direction: row;
  margin-top: 3px;
  align-items: center;
  font-size: 16px;
}
.favorite-performer-grid .performer-box .performer-title .performer-name {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  max-width: 70%;
}
.favorite-performer-grid .performer-box .performer-title .performer-flag img {
  width: 20px;
  height: 16px;
  position: absolute;
  right: 20px;
  bottom: 15px;
}
@media (max-width: 1200px) {
  .favorite-performer-grid .performer-box {
    width: calc(100% / 4);
  }
}
@media (max-width: 567px) {
  .favorite-performer-grid .performer-box {
    width: calc(100% / 2);
  }
}
.profile-card {
  background-color: rgba(245, 0, 98, 0.1);
  padding: 20px;
  font-family: Roboto;
  height: 100%;
}
.profile-card .avatar {
  margin-bottom: 20px;
}
.profile-card .avatar img {
  border-radius: 20px;
  height: 240px;
  object-fit: cover;
}
.profile-card .profile span {
  color: #8c8c8c;
}
.profile-card .profile .lable {
  font-weight: bold;
  color: #000000;
}
.profile-card .tags {
  font-weight: bold;
  color: #ff0066;
}
.profile-card p {
  font-weight: bold;
  color: #000000;
  margin-bottom: 0;
  margin-top: 10px;
}
@media (max-width: 567px) {
  .performerEditForm {
    padding-left: 24px;
    padding-right: 24px;
  }
}
.performerEditForm .edit-icon {
  position: absolute;
  font-size: 16px;
  bottom: 0px;
  right: 0px;
  border-radius: 8px;
  background: white;
  height: 20px;
  width: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.performerEditForm label {
  font-weight: bold !important;
}

.favorite-page {
  background-color: #fff;
  min-height: 100%;
}

.carousel .control-arrow,.carousel.carousel-slider .control-arrow{-webkit-transition:all .25s ease-in;-moz-transition:all .25s ease-in;-ms-transition:all .25s ease-in;-o-transition:all .25s ease-in;transition:all .25s ease-in;opacity:.4;filter:alpha(opacity=40);position:absolute;z-index:2;top:20px;background:none;border:0;font-size:32px;cursor:pointer}.carousel .control-arrow:focus,.carousel .control-arrow:hover{opacity:1;filter:alpha(opacity=100)}.carousel .control-arrow:before,.carousel.carousel-slider .control-arrow:before{margin:0 5px;display:inline-block;border-top:8px solid transparent;border-bottom:8px solid transparent;content:''}.carousel .control-disabled.control-arrow{opacity:0;filter:alpha(opacity=0);cursor:inherit;display:none}.carousel .control-prev.control-arrow{left:0}.carousel .control-prev.control-arrow:before{border-right:8px solid #fff}.carousel .control-next.control-arrow{right:0}.carousel .control-next.control-arrow:before{border-left:8px solid #fff}.carousel-root{outline:none}.carousel{position:relative;width:100%}.carousel *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.carousel img{width:100%;display:inline-block;pointer-events:none}.carousel .carousel{position:relative}.carousel .control-arrow{outline:0;border:0;background:none;top:50%;margin-top:-13px;font-size:18px}.carousel .thumbs-wrapper{margin:20px;overflow:hidden}.carousel .thumbs{-webkit-transition:all .15s ease-in;-moz-transition:all .15s ease-in;-ms-transition:all .15s ease-in;-o-transition:all .15s ease-in;transition:all .15s ease-in;-webkit-transform:translate3d(0, 0, 0);-moz-transform:translate3d(0, 0, 0);-ms-transform:translate3d(0, 0, 0);-o-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);position:relative;list-style:none;white-space:nowrap}.carousel .thumb{-webkit-transition:border .15s ease-in;-moz-transition:border .15s ease-in;-ms-transition:border .15s ease-in;-o-transition:border .15s ease-in;transition:border .15s ease-in;display:inline-block;margin-right:6px;white-space:nowrap;overflow:hidden;border:3px solid #fff;padding:2px}.carousel .thumb:focus{border:3px solid #ccc;outline:none}.carousel .thumb.selected,.carousel .thumb:hover{border:3px solid #333}.carousel .thumb img{vertical-align:top}.carousel.carousel-slider{position:relative;margin:0;overflow:hidden}.carousel.carousel-slider .control-arrow{top:0;color:#fff;font-size:26px;bottom:0;margin-top:0;padding:5px}.carousel.carousel-slider .control-arrow:hover{background:rgba(0,0,0,0.2)}.carousel .slider-wrapper{overflow:hidden;margin:auto;width:100%;-webkit-transition:height .15s ease-in;-moz-transition:height .15s ease-in;-ms-transition:height .15s ease-in;-o-transition:height .15s ease-in;transition:height .15s ease-in}.carousel .slider-wrapper.axis-horizontal .slider{-ms-box-orient:horizontal;display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-moz-flex;display:-webkit-flex;display:flex}.carousel .slider-wrapper.axis-horizontal .slider .slide{flex-direction:column;flex-flow:column}.carousel .slider-wrapper.axis-vertical{-ms-box-orient:horizontal;display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-moz-flex;display:-webkit-flex;display:flex}.carousel .slider-wrapper.axis-vertical .slider{-webkit-flex-direction:column;flex-direction:column}.carousel .slider{margin:0;padding:0;position:relative;list-style:none;width:100%}.carousel .slider.animated{-webkit-transition:all .35s ease-in-out;-moz-transition:all .35s ease-in-out;-ms-transition:all .35s ease-in-out;-o-transition:all .35s ease-in-out;transition:all .35s ease-in-out}.carousel .slide{min-width:100%;margin:0;position:relative;text-align:center}.carousel .slide img{width:100%;vertical-align:top;border:0}.carousel .slide iframe{display:inline-block;width:calc(100% - 80px);margin:0 40px 40px;border:0}.carousel .slide .legend{-webkit-transition:all .5s ease-in-out;-moz-transition:all .5s ease-in-out;-ms-transition:all .5s ease-in-out;-o-transition:all .5s ease-in-out;transition:all .5s ease-in-out;position:absolute;bottom:40px;left:50%;margin-left:-45%;width:90%;border-radius:10px;background:#000;color:#fff;padding:10px;font-size:12px;text-align:center;opacity:0.25;-webkit-transition:opacity .35s ease-in-out;-moz-transition:opacity .35s ease-in-out;-ms-transition:opacity .35s ease-in-out;-o-transition:opacity .35s ease-in-out;transition:opacity .35s ease-in-out}.carousel .control-dots{position:absolute;bottom:0;margin:10px 0;padding:0;text-align:center;width:100%;z-index:1}@media (min-width: 960px){.carousel .control-dots{bottom:0}}.carousel .control-dots .dot{-webkit-transition:opacity .25s ease-in;-moz-transition:opacity .25s ease-in;-ms-transition:opacity .25s ease-in;-o-transition:opacity .25s ease-in;transition:opacity .25s ease-in;opacity:.3;filter:alpha(opacity=30);box-shadow:1px 1px 2px rgba(0,0,0,0.9);background:#fff;border-radius:50%;width:8px;height:8px;cursor:pointer;display:inline-block;margin:0 8px}.carousel .control-dots .dot.selected,.carousel .control-dots .dot:hover{opacity:1;filter:alpha(opacity=100)}.carousel .carousel-status{position:absolute;top:0;right:0;padding:5px;font-size:10px;text-shadow:1px 1px 1px rgba(0,0,0,0.9);color:#fff}.carousel:hover .slide .legend{opacity:1}

.photo-carousel-content {
  padding-right: 100px;
  padding-left: 100px;
}
@media (max-width: 767px) {
  .photo-carousel-content {
    padding-right: 0;
    padding-left: 0;
  }
}
.carousel .slide img {
  max-height: 500px;
}

.videos-page .ant-card-grid {
  width: calc(100% / 6);
  padding: 12.5px;
}
@media (max-width: 1200px) {
  .videos-page .ant-card-grid {
    width: calc(100% / 4);
  }
}
@media (max-width: 767px) {
  .videos-page .ant-card-grid {
    width: calc(100% / 2);
  }
}
@media (max-width: 567px) {
  .videos-page .ant-card-grid {
    width: 100%;
  }
}
.video-detail-page {
  max-width: 990px;
  margin: auto;
}
.video-detail-page .video-header {
  border-bottom: 1px solid #eee;
  margin-bottom: 20px;
  padding-bottom: 10px;
}
.video-detail-page .video-header .vid-title {
  margin: 15px 0 0;
  font-size: 22px;
  font-weight: 600;
}
.video-detail-page .video-header .vid-duration {
  display: flex;
  align-items: center;
}
.video-detail-page .video-header .vid-duration a {
  color: #888;
  margin-right: 15px;
}
.video-detail-page .video-stats {
  margin: 10px 0;
  padding: 10px;
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
}
.video-detail-page .video-stats button {
  width: 50%;
  margin: 0 10px;
}
.video-detail-page .buy-video {
  text-align: center;
  width: 100%;
  padding: 20px;
}
.video-detail-page .video-player {
  width: 100%;
  margin: auto;
  text-align: center;
}
.video-detail-page .video-player .video-thumbnail {
  max-width: 990px;
  width: 100%;
  height: 600px;
  object-fit: cover;
}
.video-detail-page .video-player video {
  max-width: 990px;
  width: 100%;
  height: 600px;
  object-fit: cover;
}
@media (max-width: 767px) {
  .video-detail-page .video-player .video-thumbnail {
    max-width: 600px;
    height: 480px;
  }
  .video-detail-page .video-player video {
    max-width: 600px;
    height: 480px;
  }
}
.video-detail-page .video-info {
  padding: 10px 0;
  background-color: rgba(245, 0, 98, 0.1);
  margin-bottom: 25px;
}
.video-detail-page .video-info .video-description {
  color: #666;
  padding: 10px;
}

.performer-profile-list {
  text-transform: capitalize;
}

.text-overflow {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.text-gradient {
  background-image: -webkit-gradient(linear, 37.219838% 34.532506%, 36.425669% 93.178216%, from(#29cdff), to(#0a60ff), color-stop(0.37, #148eff));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.background-hover {
  transition: all 0.3s ease-out;
}
.background-hover:hover {
  background-color: #f9f9fc;
}
.primary-icon {
  color: #ff0066 !important;
}
.editable-cell {
  position: relative;
}
.editable-cell-value-wrap {
  padding: 5px 12px;
  cursor: pointer;
}
.editable-row:hover .editable-cell-value-wrap {
  border: 1px solid #d9d9d9;
  border-radius: 4px;
  padding: 4px 11px;
}
[data-theme='dark'] .editable-row:hover .editable-cell-value-wrap {
  border: 1px solid #434343;
}
.performer-grid {
  background: transparent !important;
  width: 100%;
}
.performer-grid .icon {
  color: #ff0066;
}
.performer-grid .ant-card-head {
  padding: 0 10px !important;
  border: none;
}
.performer-grid .performer-box {
  width: calc(100% / 6);
  padding: 10px;
}
.performer-grid .performer-box .tags {
  color: #8c8c8c;
}
.performer-grid .performer-box .about-me {
  color: #000000;
  font-weight: bold;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.performer-grid .performer-box .performer-avatar {
  display: block;
  border-radius: 25px;
  height: 200px;
  width: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  border-radius: 5px;
  overflow: hidden;
}
.performer-grid .performer-box .performer-avatar .p-status {
  background: #ff0f0f;
  position: absolute;
  padding: 2px 5px;
  top: 5px;
  left: 5px;
  border-radius: 5px;
  display: inline-block;
  color: #fff;
  text-transform: uppercase;
  font-size: 10px;
  font-weight: 600;
}
.performer-grid .performer-box .performer-avatar .p-status.online {
  background: #2fb52d;
}
.performer-grid .performer-box .performer-avatar .p-status.streaming {
  background: #2fb52d;
}
.performer-grid .performer-box .performer-avatar .p-gradient {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 20%;
  background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(128, 128, 128, 0.3) 80%, rgba(128, 128, 128, 0.3) 81%, rgba(128, 128, 128, 0.5) 100%);
  background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(128, 128, 128, 0.3) 80%, rgba(128, 128, 128, 0.3) 81%, rgba(128, 128, 128, 0.5) 100%);
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(128, 128, 128, 0.3) 80%, rgba(128, 128, 128, 0.3) 81%, rgba(128, 128, 128, 0.5) 100%);
}
.performer-grid .performer-box .performer-avatar .performer-title {
  color: #fff;
  display: flex;
  align-items: center;
  text-transform: capitalize;
  position: absolute;
  bottom: 5px;
  left: 5px;
  font-size: 12px;
  width: 69%;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.performer-grid .performer-box .performer-avatar .performer-view {
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  text-transform: capitalize;
  position: absolute;
  bottom: 5px;
  right: 5px;
  font-size: 12px;
  width: 29%;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
@media (max-width: 1200px) {
  .performer-grid .performer-box {
    width: calc(100% / 4);
  }
}
@media (max-width: 567px) {
  .performer-grid .performer-box {
    width: calc(100% / 2);
  }
}
.profile-card {
  background-color: rgba(245, 0, 98, 0.1);
  padding: 20px;
  font-family: Roboto;
  height: 100%;
}
.profile-card .avatar {
  margin-bottom: 20px;
}
.profile-card .avatar img {
  border-radius: 20px;
  height: 240px;
  object-fit: cover;
}
.profile-card .profile span {
  color: #8c8c8c;
}
.profile-card .profile .lable {
  font-weight: bold;
  color: #000000;
}
.profile-card .tags {
  font-weight: bold;
  color: #ff0066;
}
.profile-card p {
  font-weight: bold;
  color: #000000;
  margin-bottom: 0;
  margin-top: 10px;
}
@media (max-width: 567px) {
  .performerEditForm {
    padding-left: 24px;
    padding-right: 24px;
  }
}
.performerEditForm .edit-icon {
  position: absolute;
  font-size: 16px;
  bottom: 0px;
  right: 0px;
  border-radius: 8px;
  background: white;
  height: 20px;
  width: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.performerEditForm label {
  font-weight: bold !important;
}

.earning-history-page {
  background-color: white;
  height: 100%;
}
.earning-history-page .table .admin-to-studio-transaction,
.earning-history-page .table .studio-to-model-transaction {
  background: #99ff99;
}
.earning-history-page .table .ant-table-tbody .ant-table-expanded-row-fixed {
  width: auto !important;
}

.photo-grid {
  width: 100%;
  border-radius: 10px;
  margin-bottom: 20px;
  box-shadow: 0 1px 2px -2px rgba(0, 0, 0, 0.16), 0 3px 6px 0 rgba(0, 0, 0, 0.12), 0 5px 12px 4px rgba(0, 0, 0, 0.09);
}
.photo-grid .photo-box {
  width: calc(100% / 4);
  box-shadow: none;
  position: relative;
}
.photo-grid .photo-box .photo-info {
  display: flex;
  justify-content: space-between;
  color: #000000;
  font-weight: bold;
}
.photo-grid .photo-box .photo-thumbnail {
  display: block;
  position: relative;
}
.photo-grid .photo-box .photo-thumbnail img {
  width: 100%;
  height: 150px;
  object-fit: cover;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}
.photo-grid .photo-box .actions {
  position: absolute;
  bottom: 10px;
  right: 10px;
  font-size: 15px;
  color: #fff;
  background: rgba(255, 255, 255, 0.5);
  padding: 3px 6px;
  border-radius: 4px;
}
.photo-grid .photo-box .photo-status {
  position: absolute;
  top: 10px;
  right: 5px;
}
.photo-grid .photo-box .sale-tag {
  position: absolute;
  top: 10px;
  left: 5px;
}
.photo-grid .photo-box .photo-description {
  color: #8c8c8c;
}
@media (max-width: 567px) {
  .photo-grid .photo-box {
    width: calc(100% / 2);
  }
  .photo-grid .photo-box .photo-thumbnail img {
    width: 100%;
    height: 155px;
    object-fit: cover;
  }
}
form {
  padding: 16px 24px !important;
}
@media (max-width: 567px) {
  form {
    padding-left: 24px;
    padding-right: 24px;
  }
}
form .edit-icon {
  position: absolute;
  font-size: 16px;
  bottom: 0px;
  right: 0px;
  border-radius: 8px;
  background: white;
  height: 20px;
  width: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
form label {
  font-weight: bold !important;
}

.performer-photos-page {
  background-color: white;
  height: 100%;
}

.geo-blocking-page {
  background-color: white;
  height: 100%;
  padding: 15px;
}

.payout-request-form {
  padding: 16px 24px !important;
}

.payout-request-page {
  background-color: white;
  height: 100%;
}

.payout-request-page {
  background-color: white;
  height: 100%;
}

.performer-schedule-page {
  background-color: white;
}

.text-overflow {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.text-gradient {
  background-image: -webkit-gradient(linear, 37.219838% 34.532506%, 36.425669% 93.178216%, from(#29cdff), to(#0a60ff), color-stop(0.37, #148eff));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.background-hover {
  transition: all 0.3s ease-out;
}
.background-hover:hover {
  background-color: #f9f9fc;
}
.primary-icon {
  color: #ff0066 !important;
}
.editable-cell {
  position: relative;
}
.editable-cell-value-wrap {
  padding: 5px 12px;
  cursor: pointer;
}
.editable-row:hover .editable-cell-value-wrap {
  border: 1px solid #d9d9d9;
  border-radius: 4px;
  padding: 4px 11px;
}
[data-theme='dark'] .editable-row:hover .editable-cell-value-wrap {
  border: 1px solid #434343;
}
.studio-commisson-background {
  background-color: white;
  height: 100%;
}
.studio-commisson-background .studio-commisson-box {
  padding: 0 24px;
}
@media (max-width: 567px) {
  .performerEditForm {
    padding-left: 24px;
    padding-right: 24px;
  }
}
.performerEditForm .edit-icon {
  position: absolute;
  font-size: 16px;
  bottom: 0px;
  right: 0px;
  border-radius: 8px;
  background: white;
  height: 20px;
  width: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.performerEditForm label {
  font-weight: bold !important;
}

@media (max-width: 567px) {
  .performerRegisterForm {
    padding-left: 24px;
    padding-right: 24px;
  }
}
.performerRegisterForm .edit-icon {
  position: absolute;
  font-size: 16px;
  bottom: 0px;
  right: 0px;
  border-radius: 8px;
  background: white;
  height: 20px;
  width: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.performerRegisterForm label {
  font-weight: bold !important;
}

.account-setting-page {
  background-color: white;
}

.payment-token-history {
  background-color: #ffffff;
}

.purchased-product {
  background-color: #ffffff;
}

.earning-history-page {
  background-color: white;
  height: 100%;
}
.earning-history-page .table .ant-table-thead .admin-to-studio-transaction,
.earning-history-page .table .ant-table-thead .studio-to-model-transaction {
  background: #99ff99;
}
.earning-history-page .table .ant-table-tbody .ant-table-expanded-row-fixed {
  width: auto !important;
}

.text-overflow {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.text-gradient {
  background-image: -webkit-gradient(linear, 37.219838% 34.532506%, 36.425669% 93.178216%, from(#29cdff), to(#0a60ff), color-stop(0.37, #148eff));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.background-hover {
  transition: all 0.3s ease-out;
}
.background-hover:hover {
  background-color: #f9f9fc;
}
.primary-icon {
  color: #ff0066 !important;
}
.editable-cell {
  position: relative;
}
.editable-cell-value-wrap {
  padding: 5px 12px;
  cursor: pointer;
}
.editable-row:hover .editable-cell-value-wrap {
  border: 1px solid #d9d9d9;
  border-radius: 4px;
  padding: 4px 11px;
}
[data-theme='dark'] .editable-row:hover .editable-cell-value-wrap {
  border: 1px solid #434343;
}
.studio-models-background {
  background-color: white;
  height: 100%;
}
.studio-models-background .studio-models-box {
  padding: 0 24px;
}
@media (max-width: 567px) {
  .performerEditForm {
    padding-left: 24px;
    padding-right: 24px;
  }
}
.performerEditForm .edit-icon {
  position: absolute;
  font-size: 16px;
  bottom: 0px;
  right: 0px;
  border-radius: 8px;
  background: white;
  height: 20px;
  width: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.performerEditForm label {
  font-weight: bold !important;
}

@media (max-width: 567px) {
  .ant-menu-item.hidden-sm {
    display: none !important;
  }
}
@media (min-width: 567px) {
  .ant-menu-item.visible-sm {
    display: none !important;
  }
}
@media (max-width: 567px) {
  .ant-menu-item.visible-sm {
    display: inline-block !important;
  }
}
.cate-sub-menu-overlay {
  width: 450px;
}
.cate-sub-menu-overlay ul li {
  width: 25%;
}
.cate-sub-menu-overlay ul li .ant-dropdown-menu-title-content {
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: center;
}
.cate-sub-menu-overlay ul li:hover {
  color: #fff;
  background-color: #ff0066;
}
@media (max-width: 767px) {
  .cate-sub-menu-overlay {
    width: 100%;
  }
}

.recaptcha-box .recaptcha-error-message {
  color: #dd4b39 !important;
  font-size: 13px !important;
  line-height: 1.5715 !important;
  padding: 4px 0 !important;
  margin: 0 !important;
}

.text-overflow {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.text-gradient {
  background-image: -webkit-gradient(linear, 37.219838% 34.532506%, 36.425669% 93.178216%, from(#29cdff), to(#0a60ff), color-stop(0.37, #148eff));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.background-hover {
  transition: all 0.3s ease-out;
}
.background-hover:hover {
  background-color: #f9f9fc;
}
.primary-icon {
  color: #ff0066 !important;
}
.editable-cell {
  position: relative;
}
.editable-cell-value-wrap {
  padding: 5px 12px;
  cursor: pointer;
}
.editable-row:hover .editable-cell-value-wrap {
  border: 1px solid #d9d9d9;
  border-radius: 4px;
  padding: 4px 11px;
}
[data-theme='dark'] .editable-row:hover .editable-cell-value-wrap {
  border: 1px solid #434343;
}
.register-page {
  background-color: #fff;
  position: relative;
  display: flex;
}
.register-page .form-register-container {
  position: relative;
  background: #fff;
  min-height: calc(100vh * 0.75);
  width: 50%;
}
.register-page .form-register-container form.ant-form {
  margin: 0;
  position: relative;
  padding: 20px 50px;
  width: 100%;
}
.register-page .form-register-container form.ant-form .ant-form-item {
  margin-bottom: 10px;
}
.register-page .form-register-container form.ant-form .ant-form-item label {
  color: #8c8c8c;
}
.register-page .form-register-container form.ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-input,
.register-page .form-register-container form.ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-select-selector {
  padding-right: 24px;
  border-radius: unset;
  border: unset;
  border-bottom: 0.5px solid #d9d9d9;
}
.register-page .form-register-container form.ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-password {
  border-radius: unset;
  border: unset;
  border-bottom: 0.5px solid #d9d9d9;
}
.register-page .form-register-container form.ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-password .ant-input {
  border: unset;
}
.register-page .form-register-container form.ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-picker {
  width: 100%;
  border-radius: unset;
  border: unset;
  border-bottom: 0.5px solid #d9d9d9;
}
.register-page .form-register-container form.ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-upload span.file-name {
  width: 100%;
  display: block;
  padding: 10px;
  margin-top: 10px;
  border: #ccc dashed 0.5px;
}
.register-page .form-register-container form.ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-children-icon {
  color: #ff0066;
}
.register-page .form-register-container form.ant-form .row-button-auth {
  margin-bottom: 30px;
}
.register-page .form-register-container form.ant-form .input-password label {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.register-page .form-register-container form.ant-form .ant-form-item-required::before {
  display: none;
}
.register-page .form-register-container .logo {
  display: none;
}
@media (max-width: 567px) {
  .register-page .form-register-container .logo {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .register-page .form-register-container .logo img {
    width: 100px;
    height: 100px;
  }
}
.register-page .form-register-container .logo span {
  vertical-align: text-bottom;
  font-size: 16px;
  text-transform: uppercase;
  display: inline-block;
  font-weight: 700;
  color: #ff0066;
}
.register-page .form-register-container button.btn-submit {
  width: 70%;
  background-color: #ff0066;
}
.register-page .form-register-container button.btn-submit:hover {
  background-color: #CE0053;
}
.register-page .form-register-container p {
  color: #000000;
  text-align: center;
  margin-top: 16px;
  font-size: 12px;
  display: flex;
  justify-content: space-between;
}
.register-page .form-register-placeholder {
  background-image: url('/background-login.jpg');
  width: 50%;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
@media screen and (max-width: 767px) {
  .register-page .form-register-container {
    width: 100%;
  }
  .register-page .form-register-container form.ant-form {
    padding: 20px;
  }
  .register-page button {
    width: 100%;
  }
  .register-page h1 {
    text-align: center;
  }
  .register-page .form-register-placeholder {
    display: none;
  }
}

.card-studio-commission .ant-card-body {
  padding: initial;
}

.performer-gallries-page {
  background-color: white;
  height: 100%;
}

.performer-products-page {
  background-color: white;
  height: 100%;
}

.performer-videos-page {
  background-color: white;
  height: 100%;
}

.stream-group {
  margin: 5px 0;
}
.stream-group #group-video-container {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}
#main-group-video {
  height: 480px !important;
  width: 100%;
}

.private-streaming-container {
  position: relative;
  margin: 5px 0;
  min-height: 520px;
}
.private-streaming-container #private-publisher {
  right: 10px;
  top: 25px;
  height: 145px;
  width: 145px;
  position: absolute;
  z-index: 2;
}
.private-streaming-container #private-subscriber {
  width: 100% !important;
  height: 480px;
  object-fit: cover;
}

.product-form {
  padding: 16px 24px !important;
}
@media (max-width: 567px) {
  .product-form {
    padding-left: 24px;
    padding-right: 24px;
  }
}
.product-form .edit-icon {
  position: absolute;
  font-size: 16px;
  bottom: 0px;
  right: 0px;
  border-radius: 8px;
  background: #fff;
  height: 20px;
  width: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.product-form label {
  font-weight: bold !important;
}
.product-card {
  width: 100%;
  border-radius: 10px;
  margin-bottom: 20px;
  box-shadow: 0 1px 2px -2px rgba(0, 0, 0, 0.16), 0 3px 6px 0 rgba(0, 0, 0, 0.12), 0 5px 12px 4px rgba(0, 0, 0, 0.09);
  cursor: pointer;
  transition: all 0.3s;
}
.product-card:hover {
  transform: scale(1.03);
}
.product-card .product-thumb {
  position: relative;
  width: 100%;
  padding-top: calc(100% - 50px);
}
.product-card .product-thumb .value {
  position: absolute;
  top: 10px;
  left: 10px;
}
.product-card .product-thumb .type-digital {
  position: absolute;
  top: 40px;
  left: 10px;
  padding: 3px 10px;
  background: #f06;
  color: #fff;
  border-radius: 5px;
  font-size: 12px;
}
.product-card .product-thumb img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}
.product-card .product-thumb .product-stats {
  width: 100%;
  color: #fff;
  background-color: rgba(1, 1, 1, 0.1);
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 10px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.product-card .product-name {
  width: 100%;
  color: #000000;
  background-color: #fff;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  padding: 10px;
  font-weight: bold;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.product-card .btn-purchase {
  position: absolute;
  bottom: 10px;
  left: 10px;
  padding: 5px 10px;
  background-color: #ffffff42;
  color: #fff;
  border-radius: 10px;
  display: flex;
  align-items: center;
  font-weight: bold;
  min-width: 30px;
}
.product-card .btn-purchase .text-buy {
  display: none;
}
.product-card .btn-purchase:hover {
  cursor: pointer;
}
.product-card .btn-purchase:hover .text-buy {
  display: block;
}
.product-card .stock {
  position: absolute;
  bottom: 10px;
  right: 0;
  background-color: #ffffff42;
  color: #fff;
  align-items: center;
  font-weight: bold;
  min-width: 30px;
}

.popup {
  width: 40%;
}
.popup .ant-radio-wrapper {
  width: 100%;
}
.popup span.ant-radio + * {
  width: 100%;
}
.popup .ant-modal-close {
  color: #ffffff;
}
.popup .ant-modal-header {
  background-color: #ff0066;
}
.popup .ant-modal-header .ant-modal-title {
  color: #ffffff;
}
.popup .ant-modal-body {
  color: #000000;
}

.color {
  color: #ff0066;
}

.text-overflow {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.text-gradient {
  background-image: -webkit-gradient(linear, 37.219838% 34.532506%, 36.425669% 93.178216%, from(#29cdff), to(#0a60ff), color-stop(0.37, #148eff));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.background-hover {
  transition: all 0.3s ease-out;
}
.background-hover:hover {
  background-color: #f9f9fc;
}
.primary-icon {
  color: #ff0066 !important;
}
.editable-cell {
  position: relative;
}
.editable-cell-value-wrap {
  padding: 5px 12px;
  cursor: pointer;
}
.editable-row:hover .editable-cell-value-wrap {
  border: 1px solid #d9d9d9;
  border-radius: 4px;
  padding: 4px 11px;
}
[data-theme='dark'] .editable-row:hover .editable-cell-value-wrap {
  border: 1px solid #434343;
}
.product-carousel {
  width: 100%;
  min-height: 1px;
  background: rgba(245, 0, 98, 0.1);
  border-radius: 5px;
  position: relative;
}
.product-carousel .product-header {
  padding: 25px 25px 0 25px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.product-carousel .product-header .shop-name {
  font-weight: bold;
  color: #000000;
  text-transform: capitalize;
}
.product-carousel .product-list {
  position: relative;
  display: flex;
  width: 100%;
  overflow-x: scroll;
  margin: 10px 0;
  -ms-overflow-style: none;
  z-index: 1;
}
.product-carousel .product-list::-webkit-scrollbar {
  display: none;
}
.product-carousel .product-list .item {
  width: 320px;
  font-size: 14px;
  position: relative;
  font-style: normal;
  font-stretch: normal;
  letter-spacing: normal;
  margin: 5px 15px 5px 0;
  padding: unset;
  float: left;
  align-items: center;
  border-radius: unset;
  background: unset;
  height: unset;
  text-transform: capitalize;
  border-radius: 10px;
}
.product-carousel .product-list .item .text-buy {
  display: none;
}
.product-carousel .product-list .item:hover .text-buy {
  display: block;
}
.product-carousel .product-list .item .item-title {
  display: flex;
  justify-content: space-between;
}
.product-carousel .product-list .item .item-title .item-name {
  padding: 10px 0;
  font-weight: bold;
  color: #000000;
}
.product-carousel .product-list .item .item-title .item-toolbar {
  color: #8c8c8c;
}
.product-carousel .product-list .item .item-image {
  position: relative;
  height: 200px;
  width: 320px;
  background-size: cover;
  display: block;
}
.product-carousel .product-list .item .item-token {
  bottom: 10px;
  left: 10px;
  padding: 5px 10px;
  background-color: #ffffff42;
  position: absolute;
  color: white;
  border-radius: 10px;
  display: flex;
  align-items: center;
  font-weight: bold;
  min-width: 30px;
}
.product-carousel .product-list .item .item-description {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.product-carousel .product-list .item:hover a.link-to {
  text-decoration: none;
}
@media screen and (min-width: 990px) {
  .product-carousel .product-list .item:hover a.link-to {
    color: #fff !important;
    background-color: #d95776;
    text-decoration: none;
  }
}
.product-carousel .product-list .item img {
  width: 320px;
  height: 240px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  display: block;
  object-fit: cover;
}
.product-carousel .product-list .item a.link-to {
  color: #333;
  line-height: 25px;
  font-size: 16px;
  display: flex;
  border-radius: 50px;
  align-items: center;
  background: #eeeeee;
  padding: 0px 18px;
  height: 40px;
}
.product-carousel .product-list .item a.link-to span {
  white-space: nowrap;
}
.product-carousel .product-list .item.active a.link-to {
  color: #fff !important;
  background-color: #d95776;
}
.product-carousel .paddle {
  position: absolute;
  top: 50%;
  z-index: 2;
  background: #ccc;
  color: #fff;
}
.product-carousel .paddle:hover {
  background: #fff;
  color: #ff0066;
}
@media (max-width: 767px) {
  .product-carousel .paddle {
    display: none !important;
  }
}
.product-carousel .left-paddle {
  border-radius: 50%;
  font-size: 30px;
  left: 15px;
  cursor: pointer;
  border: 1px solid;
  background: #ccc;
  color: #fff;
}
.product-carousel .right-paddle {
  border-radius: 50%;
  font-size: 30px;
  right: 15px;
  padding-right: 0;
  border: 1px solid #ccc;
  cursor: pointer;
  border: 1px solid;
  background: #ccc;
  color: #fff;
}

.video-carousel {
  width: 100%;
  min-height: 1px;
  background: rgba(245, 0, 98, 0.1);
  border-radius: 5px;
  position: relative;
}
.video-carousel .video-header {
  padding: 25px 25px 0 25px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.video-carousel .video-header .shop-name {
  font-weight: bold;
  color: #000000;
  text-transform: capitalize;
}
.video-carousel .video-list {
  position: relative;
  display: flex;
  width: 100%;
  overflow-x: scroll;
  margin: 10px 0;
  -ms-overflow-style: none;
  z-index: 1;
}
.video-carousel .video-list::-webkit-scrollbar {
  display: none;
}
.video-carousel .video-list .item {
  width: 100%;
  border-radius: 10px;
  margin-bottom: 20px;
  box-shadow: 0 1px 2px -2px rgba(0, 0, 0, 0.16), 0 3px 6px 0 rgba(0, 0, 0, 0.12), 0 5px 12px 4px rgba(0, 0, 0, 0.09);
}
.video-carousel .video-list .item .text-buy {
  display: none;
}
.video-carousel .video-list .item:hover .text-buy {
  display: block;
}
.video-carousel .video-list .item .item-title {
  color: #000000;
  font-weight: bold;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  background-color: #fff;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  padding: 10px;
  height: 50px;
}
.video-carousel .video-list .item .item-title .item-name {
  font-weight: bold;
  color: #000000;
}
.video-carousel .video-list .item .item-title .item-toolbar {
  color: #8c8c8c;
}
.item {
  position: relative;
  transition: all 0.3s;
}
.item:hover {
  transform: scale(1.03);
}
.item .value {
  position: absolute;
  top: 10px;
  left: 10px;
}
.video-carousel .video-list .item .item-image {
  position: relative;
  height: 150px;
  width: 100%;
  padding-top: calc(100% - 50px);
  background-size: cover;
  display: block;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}
.video-carousel .video-list .item .item-lock {
  position: absolute;
  bottom: 10px;
  right: 10px;
  color: white;
  font-size: 20px;
}
.video-carousel .video-list .item .item-token {
  position: absolute;
  bottom: 10px;
  left: 10px;
  padding: 5px 10px;
  background-color: #ffffff42;
  color: white;
  border-radius: 10px;
  display: flex;
  align-items: center;
  font-weight: bold;
  min-width: 30px;
}
.video-carousel .video-list .item .item-duration {
  position: absolute;
  top: 10px;
  right: 0;
  color: white;
  min-width: 30px;
  background-color: rgba(0, 0, 0, 0.5);
  text-align: center;
}
.video-carousel .video-list .item .icon-play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 60px;
  color: white;
}
.video-carousel .video-list .item .icon-play:hover {
  color: #ff0066;
}
.video-carousel .video-list .item .item-description {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.video-carousel .video-list .item:hover a.link-to {
  text-decoration: none;
}
@media screen and (min-width: 990px) {
  .video-carousel .video-list .item:hover a.link-to {
    color: #fff !important;
    background-color: #d95776;
    text-decoration: none;
  }
}
.video-carousel .video-list .item img {
  width: 320px;
  height: 240px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  display: block;
  object-fit: cover;
}
.video-carousel .video-list .item a.link-to {
  color: #333;
  line-height: 25px;
  font-size: 16px;
  display: flex;
  border-radius: 50px;
  align-items: center;
  background: #eeeeee;
  padding: 0px 18px;
  height: 40px;
}
.video-carousel .video-list .item a.link-to span {
  white-space: nowrap;
}
.video-carousel .video-list .item.active a.link-to {
  color: #fff !important;
  background-color: #d95776;
}
.video-carousel .paddle {
  position: absolute;
  top: 50%;
  z-index: 2;
  background: #ccc;
  color: #fff;
}
.video-carousel .paddle:hover {
  background: #fff;
  color: #ff0066;
}
@media (max-width: 767px) {
  .video-carousel .paddle {
    display: none !important;
  }
}
.video-carousel .left-paddle {
  border-radius: 50%;
  font-size: 30px;
  left: 15px;
  cursor: pointer;
  border: 1px solid;
  background: #ccc;
  color: #fff;
}
.video-carousel .right-paddle {
  border-radius: 50%;
  font-size: 30px;
  right: 15px;
  padding-right: 0;
  border: 1px solid #ccc;
  cursor: pointer;
  border: 1px solid;
  background: #ccc;
  color: #fff;
}

.gallery-card {
  width: 100%;
  border-radius: 10px;
  margin-bottom: 20px;
  box-shadow: 0 1px 2px -2px rgba(0, 0, 0, 0.16), 0 3px 6px 0 rgba(0, 0, 0, 0.12), 0 5px 12px 4px rgba(0, 0, 0, 0.09);
  cursor: pointer;
  transition: all 0.3s;
}
.gallery-card:hover {
  transform: scale(1.03);
}
.gallery-card .gallery-thumb {
  position: relative;
  width: 100%;
  padding-top: calc(100% - 50px);
}
.gallery-card .gallery-thumb .value {
  position: absolute;
  top: 10px;
  left: 10px;
}
.gallery-card .gallery-thumb img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}
.gallery-card .gallery-thumb .count {
  position: absolute;
  bottom: 10px;
  right: 10px;
  padding: 5px 10px;
  background-color: rgba(0, 0, 0, 0.5);
  color: #fff;
  border-radius: 10px;
  display: flex;
  align-items: center;
  font-weight: 500;
  min-width: 30px;
}
.gallery-card .gallery-info {
  width: 100%;
  color: #000000;
  background-color: #fff;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  padding: 10px;
  font-weight: bold;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.gallery-card .gallery-info .name {
  font-weight: bold;
  color: #000000;
}
.gallery-card .btn-purchase {
  position: absolute;
  bottom: 30px;
  left: 30px;
  padding: 5px 10px;
  background-color: #ffffff42;
  color: #fff;
  border-radius: 10px;
  display: flex;
  align-items: center;
  font-weight: bold;
  min-width: 30px;
}
.gallery-card .btn-purchase .text-buy {
  display: none;
}
.gallery-card .btn-purchase:hover {
  cursor: pointer;
}
.gallery-card .btn-purchase:hover .text-buy {
  display: block;
}
.photo-grid {
  background: transparent !important;
  padding: 16px 0;
}
.photo-grid .photo-box {
  width: calc(100% / 4);
  position: relative;
}
.photo-grid .photo-box .photo-info {
  display: flex;
  justify-content: space-between;
  color: #000000;
  font-weight: bold;
}
.photo-grid .photo-box .photo-thumbnail {
  display: block;
  position: relative;
}
.photo-grid .photo-box .photo-thumbnail img {
  width: 100%;
  height: 150px;
  object-fit: cover;
  border-radius: 5px;
}
.photo-grid .photo-box .actions {
  position: absolute;
  bottom: 10px;
  right: 5px;
  font-size: 15px;
  color: #fff;
  background: rgba(0, 0, 0, 0.5);
  padding: 3px 6px;
  border-radius: 4px;
}
.photo-grid .photo-box .actions .ant-btn {
  font-size: 15px;
}
.photo-grid .photo-box .photo-status {
  position: absolute;
  top: 10px;
  right: 5px;
}
.photo-grid .photo-box .sale-tag {
  position: absolute;
  top: 10px;
  left: 5px;
}
.photo-grid .photo-box .photo-description {
  color: #8c8c8c;
}
@media (max-width: 990px) {
  .photo-grid .photo-box {
    width: calc(100% / 3);
  }
}
@media (max-width: 567px) {
  .photo-grid .photo-box {
    width: calc(100% / 2);
  }
  .photo-grid .photo-box .photo-thumbnail img {
    height: 155px;
  }
}
form {
  padding: 16px 24px !important;
}
@media (max-width: 567px) {
  form {
    padding-left: 24px;
    padding-right: 24px;
  }
}
form .edit-icon {
  position: absolute;
  font-size: 16px;
  bottom: 0px;
  right: 0px;
  border-radius: 8px;
  background: white;
  height: 20px;
  width: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
form label {
  font-weight: bold !important;
}
.purchased-gallery-card {
  margin-bottom: 20px;
}
.purchased-gallery-card .purchased-gallery-card-thumb {
  padding: 20px;
  background-color: rgba(255, 0, 102, 0.1);
  border-radius: 10px;
  position: relative;
}
.purchased-gallery-card .purchased-gallery-card-thumb img {
  width: 100%;
  object-fit: contain;
  height: 150px;
  border-radius: 10px;
}
.purchased-gallery-card .purchased-gallery-card-name {
  width: 100%;
  height: 50px;
  line-height: 50px;
  font-size: 13px;
  font-weight: bold;
  text-align: center;
  text-transform: uppercase;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.text-overflow {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.text-gradient {
  background-image: -webkit-gradient(linear, 37.219838% 34.532506%, 36.425669% 93.178216%, from(#29cdff), to(#0a60ff), color-stop(0.37, #148eff));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.background-hover {
  transition: all 0.3s ease-out;
}
.background-hover:hover {
  background-color: #f9f9fc;
}
.primary-icon {
  color: #ff0066 !important;
}
.editable-cell {
  position: relative;
}
.editable-cell-value-wrap {
  padding: 5px 12px;
  cursor: pointer;
}
.editable-row:hover .editable-cell-value-wrap {
  border: 1px solid #d9d9d9;
  border-radius: 4px;
  padding: 4px 11px;
}
[data-theme='dark'] .editable-row:hover .editable-cell-value-wrap {
  border: 1px solid #434343;
}
.gallery-carousel {
  width: 100%;
  min-height: 1px;
  background: rgba(245, 0, 98, 0.1);
  border-radius: 5px;
  position: relative;
}
.gallery-carousel .gallery-header {
  padding: 25px 25px 0 25px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin-bottom: 10px;
}
.gallery-carousel .gallery-header .shop-name {
  font-weight: bold;
  color: #000000;
  text-transform: capitalize;
}
.gallery-carousel .gallery-list {
  position: relative;
  display: flex;
  width: 100%;
  overflow-x: scroll;
  margin: 10px 0;
  -ms-overflow-style: none;
  z-index: 1;
}
.gallery-carousel .gallery-list::-webkit-scrollbar {
  display: none;
}
.gallery-carousel .gallery-list .item {
  font-size: 14px;
  width: 320px;
  position: relative;
  font-style: normal;
  font-stretch: normal;
  letter-spacing: normal;
  margin: 5px 15px 5px 0;
  padding: unset;
  float: left;
  align-items: center;
  border-radius: unset;
  background: unset;
  height: unset;
  text-transform: capitalize;
  border-radius: 10px;
}
.gallery-carousel .gallery-list .item .text-buy {
  display: none;
}
.gallery-carousel .gallery-list .item:hover .text-buy {
  display: block;
}
.gallery-carousel .gallery-list .item .item-title {
  display: flex;
  justify-content: space-between;
}
.gallery-carousel .gallery-list .item .item-title .item-name {
  padding: 10px 0;
  font-weight: bold;
  color: #000000;
}
.gallery-carousel .gallery-list .item .item-title .item-toolbar {
  color: #8c8c8c;
}
.gallery-carousel .gallery-list .item .item-image {
  position: relative;
  height: 200px;
  width: 320px;
  background-size: cover;
  display: block;
}
.gallery-carousel .gallery-list .item .item-lock {
  position: absolute;
  bottom: 10px;
  right: 10px;
  color: white;
  font-size: 20px;
}
.gallery-carousel .gallery-list .item .item-token {
  position: absolute;
  bottom: 10px;
  left: 10px;
  padding: 5px 10px;
  background-color: #ffffff42;
  color: white;
  border-radius: 10px;
  display: flex;
  align-items: center;
  font-weight: bold;
  min-width: 30px;
}
.gallery-carousel .gallery-list .item .icon-play {
  position: absolute;
  bottom: 45%;
  left: 45%;
  font-size: 45px;
  color: white;
}
.gallery-carousel .gallery-list .item .item-description {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.gallery-carousel .gallery-list .item:hover a.link-to {
  text-decoration: none;
}
@media screen and (min-width: 990px) {
  .gallery-carousel .gallery-list .item:hover a.link-to {
    color: #fff !important;
    background-color: #d95776;
    text-decoration: none;
  }
}
.gallery-carousel .gallery-list .item img {
  width: 320px;
  height: 240px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  display: block;
  object-fit: cover;
}
.gallery-carousel .gallery-list .item a.link-to {
  color: #333;
  line-height: 25px;
  font-size: 16px;
  display: flex;
  border-radius: 50px;
  align-items: center;
  background: #eeeeee;
  padding: 0px 18px;
  height: 40px;
}
.gallery-carousel .gallery-list .item a.link-to span {
  white-space: nowrap;
}
.gallery-carousel .gallery-list .item.active a.link-to {
  color: #fff !important;
  background-color: #d95776;
}
.gallery-carousel .paddle {
  position: absolute;
  top: 50%;
  z-index: 2;
  background: #ccc;
  color: #fff;
}
.gallery-carousel .paddle:hover {
  background: #fff;
  color: #ff0066;
}
@media (max-width: 767px) {
  .gallery-carousel .paddle {
    display: none !important;
  }
}
.gallery-carousel .left-paddle {
  border-radius: 50%;
  font-size: 30px;
  left: 15px;
  cursor: pointer;
  border: 1px solid;
  background: #ccc;
  color: #fff;
}
.gallery-carousel .right-paddle {
  border-radius: 50%;
  font-size: 30px;
  right: 15px;
  padding-right: 0;
  border: 1px solid #ccc;
  cursor: pointer;
  border: 1px solid;
  background: #ccc;
  color: #fff;
}

.performer-grid {
  background: transparent !important;
  width: 100%;
  min-height: 500px;
}
@media (max-width: 767px) {
  .performer-grid .middle-performer-list {
    flex-direction: column-reverse;
  }
}
.performer-grid .icon {
  color: #ff0066;
}
.performer-grid .ant-card-head {
  padding: 0 10px !important;
  border: none;
}
.performer-grid .ant-card-actions {
  background-color: #fff !important;
  border-top: none !important;
}
.performer-grid .performer-list {
  width: 100%;
}
.performer-grid .ant-carousel .right-banners img {
  min-height: 720px;
  height: 100%;
  width: 100%;
  object-fit: cover;
}
@media screen and (max-width: 1200px) {
  .performer-grid .ant-carousel .right-banners img {
    min-height: 860px;
  }
}
.performer-grid .performer-box {
  width: calc(100% / 6);
  padding: 10px;
  position: relative;
  min-height: 150px;
}
.performer-grid .performer-box .blocked-thumb {
  position: absolute;
  top: 8px;
  left: 8px;
  width: calc(100% - 16px);
  height: calc(100% - 16px);
  background-color: rgba(1, 1, 1, 0.8);
  border-radius: 3px;
  z-index: 990;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: not-allowed;
}
.performer-grid .performer-box .blocked-thumb .anticon {
  color: #fff;
  font-size: 20px;
}
.performer-grid .performer-box .tags {
  color: #8c8c8c;
}
.performer-grid .performer-box .about-me {
  color: #000000;
  font-weight: bold;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.performer-grid .performer-box .performer-avatar {
  display: block;
  border-radius: 25px;
  height: unset;
  width: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  position: relative;
  border-radius: 5px;
  overflow: hidden;
  padding-top: 100%;
}
.performer-grid .performer-box .performer-avatar .image-performer {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  -o-object-fit: cover;
}
.performer-grid .performer-box .performer-avatar .p-status {
  background: #ff0f0f;
  position: absolute;
  padding: 2px 5px;
  top: 5px;
  left: 5px;
  border-radius: 5px;
  display: inline-block;
  color: #fff;
  text-transform: uppercase;
  font-size: 10px;
  font-weight: 600;
}
.performer-grid .performer-box .performer-avatar .p-status.online {
  background: #2fb52d;
}
.performer-grid .performer-box .performer-avatar .p-status.offline {
  background: #8c8c8c;
}
.performer-grid .performer-box .performer-avatar .p-status.public {
  background: #2fb52d;
}
.performer-grid .performer-box .performer-avatar .p-status.private {
  background: #f97332;
}
.performer-grid .performer-box .performer-avatar .p-status.group {
  background: #f97332;
}
.performer-grid .performer-box .performer-avatar .p-gradient {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 20%;
  background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(128, 128, 128, 0.3) 80%, rgba(128, 128, 128, 0.3) 81%, rgba(128, 128, 128, 0.5) 100%);
  background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(128, 128, 128, 0.3) 80%, rgba(128, 128, 128, 0.3) 81%, rgba(128, 128, 128, 0.5) 100%);
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(128, 128, 128, 0.3) 80%, rgba(128, 128, 128, 0.3) 81%, rgba(128, 128, 128, 0.5) 100%);
}
.performer-grid .performer-box .performer-avatar .p-title {
  color: #fff;
  display: flex;
  align-items: center;
  text-transform: capitalize;
  position: absolute;
  bottom: 5px;
  left: 5px;
  font-size: 12px;
  width: 69%;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.performer-grid .performer-box .performer-avatar .p-viewer {
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  text-transform: capitalize;
  position: absolute;
  bottom: 5px;
  right: 5px;
  font-size: 12px;
  width: 29%;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.performer-grid .performer-box .performer-bottom .p-favorite {
  cursor: pointer;
  color: #ff0066;
}
@media (max-width: 1200px) {
  .performer-grid .performer-box {
    width: calc(100% / 4);
  }
  .performer-grid .performer-box .performer-avatar {
    height: 175px;
    background-size: cover;
    background-position: center center;
  }
}
@media (max-width: 767px) {
  .performer-grid .performer-box {
    width: calc(100% / 2);
  }
  .performer-grid .performer-box .performer-avatar {
    height: 200px;
    background-size: cover;
    background-position: center center;
  }
}
.performer-box-4-item {
  width: calc(100% / 4) !important;
  transition: all 0.3s ease-in-out;
}
.performer-box-4-item .performer-bottom {
  display: none;
}
.performer-box-4-item:hover img {
  opacity: 0.8;
}
@media (max-width: 1200px) {
  .performer-box-4-item {
    width: calc(100% / 3) !important;
  }
}
@media (max-width: 767px) {
  .performer-box-4-item {
    width: calc(100% / 2) !important;
  }
}
.image-banner-right {
  width: 100%;
  padding: 0 6px;
}
.profile-card {
  background-color: rgba(245, 0, 98, 0.1);
  padding: 20px;
  font-family: Roboto;
  height: 100%;
}
.profile-card .avatar {
  margin-bottom: 20px;
}
.profile-card .avatar img {
  border-radius: 20px;
  width: 280px;
  height: 280px;
  object-fit: cover;
}
.profile-card .profile span {
  color: #8c8c8c;
}
.profile-card .profile table {
  table-layout: fixed;
  width: 100%;
}
.profile-card .profile table tr {
  vertical-align: top;
}
.profile-card .profile .lable {
  font-weight: bold;
  color: #000000;
  text-transform: capitalize;
}
.profile-card .profile .lable::after {
  content: ':';
}
.profile-card .profile .text {
  text-transform: capitalize;
}
.profile-card .tags {
  font-weight: bold;
  color: #ff0066;
}
.profile-card p {
  font-weight: bold;
  color: #000000;
  margin-bottom: 0;
  margin-top: 10px;
}
@media (max-width: 567px) {
  .performerEditForm {
    padding-left: 24px;
    padding-right: 24px;
  }
}
.performerEditForm .edit-icon {
  position: absolute;
  font-size: 16px;
  bottom: 0px;
  right: 0px;
  border-radius: 8px;
  background: white;
  height: 20px;
  width: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.performerEditForm label {
  font-weight: bold !important;
}


.loader {
  background-color: rgba(255, 255, 255, 0.8);
  width: 100%;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 100000;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 1;
  text-align: center;
}
.loader.fullScreen {
  position: fixed;
}
.loader .warpper {
  width: 100px;
  height: 100px;
  display: inline-flex;
  flex-direction: column;
  justify-content: space-around;
}
.loader .inner {
  width: 40px;
  height: 40px;
  margin: 0 auto;
  text-indent: -12345px;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
  border-right: 1px solid rgba(0, 0, 0, 0.08);
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  border-left: 1px solid rgba(0, 0, 0, 0.7);
  border-radius: 50%;
  z-index: 100001;
}
.loader .inner {
  animation: FqxmFNz4OrHU-AwWcntBB 600ms infinite linear;
}
.loader .text {
  width: 100px;
  height: 20px;
  text-align: center;
  font-size: 12px;
  letter-spacing: 4px;
  color: #000;
}
.loader.hidden {
  z-index: -1;
  opacity: 0;
  transition: opacity 1s ease 0.5s, z-index 0.1s ease 1.5s;
}
@keyframes spinner {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.tk-studio {
  background: #ff0066;
  padding: 15px;
  color: #fff;
  margin-bottom: 15px;
}
.tk-studio .stat {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.btn-live {
  width: 100%;
  height: 45px;
  font-size: 18px;
}
.footer {
  background: #fff;
  margin-top: 0;
  margin-bottom: 0;
  padding-top: 24px;
  padding-bottom: 24px;
  min-height: 72px;
}
.primary-content {
  padding: 10px;
}
.table {
  padding: 16px 24px;
  height: 100%;
}
.table img {
  height: 100px;
  width: 100px;
}
.ant-card-actions {
  background-color: #fff !important;
  border-top: none !important;
}

.text-overflow {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.text-gradient {
  background-image: -webkit-gradient(linear, 37.219838% 34.532506%, 36.425669% 93.178216%, from(#29cdff), to(#0a60ff), color-stop(0.37, #148eff));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.background-hover {
  transition: all 0.3s ease-out;
}
.background-hover:hover {
  background-color: #f9f9fc;
}
.primary-icon {
  color: #ff0066 !important;
}
.editable-cell {
  position: relative;
}
.editable-cell-value-wrap {
  padding: 5px 12px;
  cursor: pointer;
}
.editable-row:hover .editable-cell-value-wrap {
  border: 1px solid #d9d9d9;
  border-radius: 4px;
  padding: 4px 11px;
}
[data-theme='dark'] .editable-row:hover .editable-cell-value-wrap {
  border: 1px solid #434343;
}
.ant-layout-header.header {
  width: 100%;
  padding: 0 24px;
  box-shadow: 4px 4px 40px 0 rgba(0, 0, 0, 0.05);
  position: fixed;
  display: flex;
  justify-content: space-between;
  height: 72px;
  z-index: 999;
  align-items: center;
  background-color: #fff;
}
.ant-layout-header.header .left-container {
  display: flex;
  align-items: center;
}
.ant-layout-header.header .left-container .ant-menu {
  background-color: #753148;
  border: none;
  margin-left: 30px;
}
.ant-layout-header.header .left-container .ant-menu .ant-menu-item,
.ant-layout-header.header .left-container .ant-menu .ant-menu-submenu {
  border-bottom: none;
  color: #fff;
  height: 71px;
  line-height: 71px;
  text-align: center;
  font-size: 14px;
}
.ant-layout-header.header .left-container .ant-menu .ant-menu-item:hover,
.ant-layout-header.header .left-container .ant-menu .ant-menu-submenu:hover {
  background-color: #642d3f;
}
.ant-layout-header.header .left-container .ant-menu .ant-menu-item::selection,
.ant-layout-header.header .left-container .ant-menu .ant-menu-submenu::selection {
  background-color: #642d3f;
}
.ant-layout-header.header .left-container .ant-menu .ant-menu-item .ant-menu-submenu-title,
.ant-layout-header.header .left-container .ant-menu .ant-menu-submenu .ant-menu-submenu-title {
  color: #fff;
}
.ant-layout-header.header .left-container .ant-menu .ant-menu-item a,
.ant-layout-header.header .left-container .ant-menu .ant-menu-submenu a {
  color: #fff !important;
}
.ant-layout-header.header .left-container .ant-menu .ant-menu-item a::before,
.ant-layout-header.header .left-container .ant-menu .ant-menu-submenu a::before {
  bottom: 0;
}
.ant-layout-header.header .right-container {
  display: flex;
  align-items: center;
}
.ant-layout-header.header .button {
  cursor: pointer;
  color: #fff;
  transition: all 0.3s ease-out;
}
.ant-layout-header.header .button:hover {
  color: #ff0066;
  background-color: #f9f9fc;
}
.ant-layout-header.header .header-logo {
  width: 150px;
  height: 72px;
}
@media (max-width: 1200px) {
  .ant-layout-header.header .header-logo {
    margin-left: 10px;
  }
}
@media (max-width: 567px) {
  .ant-layout-header.header .header-logo {
    width: 100px !important;
  }
}
.ant-layout-header.header .header-logo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ant-layout-header.header .search-bar {
  display: flex;
  align-items: center;
  transition: all 0.5s ease-in-out;
}
@media (max-width: 567px) {
  .ant-layout-header.header .search-bar {
    position: absolute;
    top: 70px;
    left: 0;
    height: 40px;
    width: 100%;
    background: #ff0066;
    padding: 0 5px;
    z-index: 1000;
  }
  .ant-layout-header.header .search-bar.hide {
    left: -9999px;
  }
}
.iconButton {
  width: 48px;
  height: 48px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 24px;
  cursor: pointer;
  transition: all 0.3s ease-out;
}
.iconButton:hover {
  background-color: #f9f9fc;
}
.iconButton:hover .iconFont {
  color: #ff0066;
}
.iconButton + .iconButton {
  margin-left: 8px;
}
.iconButton .iconFont {
  color: #b2b0c7;
  font-size: 24px;
}
.notification {
  padding: 24px 0;
  width: 320px;
}
.notification .notificationItem {
  transition: all 0.3s;
  padding: 12px 24px;
  cursor: pointer;
}
.notification .notificationItem:hover {
  background-color: #f9f9fc;
}
.notification .clearButton {
  text-align: center;
  height: 48px;
  line-height: 48px;
  cursor: pointer;
  transition: all 0.3s ease-out;
}
.notification .clearButton:hover {
  background-color: #f9f9fc;
}
.notificationPopover .ant-popover-inner-content {
  padding: 0;
}
.notificationPopover .ant-popover-arrow {
  display: none;
}
.notificationPopover .ant-list-item-content {
  flex: 0;
  margin-left: 16px;
}
.search-icon {
  display: none;
}
@media (max-width: 567px) {
  .search-icon {
    display: flex;
    font-size: 20px;
    color: #fff;
    width: 25px;
    height: 100%;
    align-items: center;
    justify-content: center;
  }
  .search-icon.active {
    background-color: #CE0053;
  }
}
.call-requests {
  cursor: pointer;
  color: #fff;
  margin: 0 15px;
  display: flex;
}
.call-requests .anticon {
  font-size: 22px;
}
.call-requests .ant-badge-count {
  background-color: #f97332;
}
@media (max-width: 567px) {
  .call-requests {
    margin: 0 5px;
  }
}
@media (max-width: 1200px) {
  .ant-layout-header.header {
    height: 72px;
    width: 100%;
    padding: 0 5px;
  }
  .ant-layout-header.header .btn-tokens {
    font-size: 10px;
    padding: 5px 10px;
  }
  .ant-layout-header.header .left-container .menu-left-header {
    position: absolute;
    background-color: #753148;
    height: 40px;
    top: 70px;
    left: 0;
    width: 100%;
    z-index: 999;
  }
  .ant-layout-header.header .left-container .menu-left-header .ant-menu {
    width: 100%;
    margin-left: 0;
    background-color: #753148;
  }
  .ant-layout-header.header .left-container .menu-left-header .ant-menu-item,
  .ant-layout-header.header .left-container .menu-left-header .ant-menu-submenu {
    height: 40px;
    line-height: 40px;
  }
  .ant-layout-header.header .header-logo {
    height: 72px;
    width: 120px;
    display: flex;
  }
}
#layoutHeader {
  background-color: #753148;
}

.ant-layout-footer {
  background: #fff !important;
}
.footer-custom {
  text-align: center;
}

.text-overflow {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.text-gradient {
  background-image: -webkit-gradient(linear, 37.219838% 34.532506%, 36.425669% 93.178216%, from(#29cdff), to(#0a60ff), color-stop(0.37, #148eff));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.background-hover {
  transition: all 0.3s ease-out;
}
.background-hover:hover {
  background-color: #f9f9fc;
}
.primary-icon {
  color: #ff0066 !important;
}
.editable-cell {
  position: relative;
}
.editable-cell-value-wrap {
  padding: 5px 12px;
  cursor: pointer;
}
.editable-row:hover .editable-cell-value-wrap {
  border: 1px solid #d9d9d9;
  border-radius: 4px;
  padding: 4px 11px;
}
[data-theme='dark'] .editable-row:hover .editable-cell-value-wrap {
  border: 1px solid #434343;
}
.public-content {
  min-height: 100vh;
  background: #fff;
  padding: 10px;
  border-radius: 10px;
}
.ant-card-head {
  border: none;
}
.ant-btn-default {
  border-color: #ff0066 !important;
  color: #ff0066 !important;
}
.ant-card-body {
  display: flex;
  flex-wrap: wrap;
}
.ant-card-body::before {
  display: block !important;
}
.ant-card-body .ant-card-grid {
  box-shadow: none;
}
.footer {
  background: #fff;
  margin-top: 0;
  margin-bottom: 0;
  padding-top: 24px;
  padding-bottom: 24px;
  min-height: 72px;
}
@media (max-width: 1200px) {
  .public-content {
    padding: 50px 5px 5px;
  }
}
.ant-space-wrap {
  flex-wrap: wrap;
}
.ant-space-wrap .ant-space-item {
  margin-bottom: 10px;
}
.ant-card-actions {
  background-color: #fff !important;
  border-top: none !important;
}

.text-overflow {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.text-gradient {
  background-image: -webkit-gradient(linear, 37.219838% 34.532506%, 36.425669% 93.178216%, from(#29cdff), to(#0a60ff), color-stop(0.37, #148eff));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.background-hover {
  transition: all 0.3s ease-out;
}
.background-hover:hover {
  background-color: #f9f9fc;
}
.primary-icon {
  color: #ff0066 !important;
}
.editable-cell {
  position: relative;
}
.editable-cell-value-wrap {
  padding: 5px 12px;
  cursor: pointer;
}
.editable-row:hover .editable-cell-value-wrap {
  border: 1px solid #d9d9d9;
  border-radius: 4px;
  padding: 4px 11px;
}
[data-theme='dark'] .editable-row:hover .editable-cell-value-wrap {
  border: 1px solid #434343;
}
.contentInner {
  background: #fff;
  padding: 24px;
  box-shadow: 4px 4px 20px 0 rgba(0, 0, 0, 0.01);
  min-height: calc(100vh - 230px);
  position: relative;
}
@media (max-width: 767px) {
  .contentInner {
    padding: 12px;
    min-height: calc(100vh - 160px);
  }
}

.confirmage__header {
  font-weight: bold;
  font-size: 20px;
  margin-bottom: 10px;
}
.confirmage__description .scroll {
  height: 200px;
  overflow: auto;
  padding: 0 15px 0 10px;
  border: 1px solid #ccc;
  margin: 0 auto;
  text-align: left;
}


.text-overflow {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.text-gradient {
  background-image: -webkit-gradient(linear, 37.219838% 34.532506%, 36.425669% 93.178216%, from(#29cdff), to(#0a60ff), color-stop(0.37, #148eff));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.background-hover {
  transition: all 0.3s ease-out;
}
.background-hover:hover {
  background-color: #f9f9fc;
}
.primary-icon {
  color: #ff0066 !important;
}
.editable-cell {
  position: relative;
}
.editable-cell-value-wrap {
  padding: 5px 12px;
  cursor: pointer;
}
.editable-row:hover .editable-cell-value-wrap {
  border: 1px solid #d9d9d9;
  border-radius: 4px;
  padding: 4px 11px;
}
[data-theme='dark'] .editable-row:hover .editable-cell-value-wrap {
  border: 1px solid #434343;
}
.auth-content {
  background: #fff;
  padding: 10px;
  border-radius: 10px;
}
@media (max-width: 1200px) {
  .auth-content {
    padding: 50px 5px 5px;
  }
}

#form-update-order .ant-form-item-label {
  text-align: left;
}

.token-card {
  text-align: center;
  margin: 10px 20px;
}
.token-card .description {
  color: #000000;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  height: 45px;
  line-height: 20px;
  text-align: center;
}
.token-card .card-image {
  position: relative;
  width: 100%;
}
.token-card .card-image:after {
  content: '';
  display: block;
  padding-bottom: 100%;
}
.token-card .card-image img {
  top: 0;
  width: 60px;
  height: 60px;
}
.token-card .card-image span {
  bottom: 0;
  left: 50%;
  color: #ff0066;
  font-size: 25px;
  font-weight: bolder;
  width: 100%;
  float: left;
}
.token-card .card-image .coin {
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  border: 15px solid transparent;
  background-size: 100% 100%, 50% 50%, 50% 50%, 50% 50%, 50% 50%;
  background-repeat: no-repeat;
  background-image: linear-gradient(white, white), linear-gradient(30deg, #ff0066 50%, #ff99c2 50%), linear-gradient(120deg, #ff0066 50%, #ff99c2 50%), linear-gradient(300deg, #ff0066 50%, #ff99c2 50%), linear-gradient(210deg, #ff0066 50%, #ff99c2 50%);
  background-position: center center, left top, right top, left bottom,
        right bottom;
  background-origin: content-box, border-box, border-box, border-box, border-box;
  background-clip: content-box, border-box, border-box, border-box, border-box;
  transform: rotate(0deg);
}
.token-card .card-image .coin .current-coin {
  width: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: inline-block;
}
.token-card p {
  width: 100%;
  text-align: center;
  font-size: 13px;
  font-weight: bold;
  margin: 5px auto;
  color: #000000;
}
.token-card Button {
  min-width: 100px;
}

.funds-tokens-box {
  background-color: #fff;
  min-height: 100%;
  width: 100%;
}

.transaction-history-page {
  background-color: #fff;
  min-height: 100%;
  width: 100%;
}

.angeregator-filter {
  padding: 0 10px;
}
.angeregator-filter .ant-btn-dashed.active {
  color: #d9005e !important;
  background: #fff !important;
  border-color: #d9005e !important;
}
.angeregator-filter .ant-btn:focus {
  color: #666;
  background: #fff;
  border-color: #e5e5e5;
}

.cam-flag {
  height: 15px;
  width: 20px;
  right: 5px;
  position: absolute;
  top: 5px;
}
.cam-logo {
  height: 25px;
  width: 80px;
  position: absolute;
  left: 55px;
  top: 3px;
}

.cams-details .performer-box {
  width: 100%;
}
.cams-details .tags a {
  padding: 0 2px;
  display: inline-block;
}
.cams-details .custom-button {
  width: 100%;
  display: block;
  height: auto;
  border-radius: 30px;
  text-align: center;
  font-weight: bold;
  text-transform: uppercase;
  word-wrap: normal;
  white-space: pre-wrap;
  overflow-wrap: break-word;
  padding: 10px;
  margin-top: 10px;
}

.contact-page {
  background-color: #fff;
  position: relative;
  display: flex;
}
.contact-page .form-contact-container {
  position: relative;
  background: #fff;
  min-height: calc(100vh * 0.75);
  width: 50%;
  text-align: center;
}
.contact-page .form-contact-container .form-contact-title {
  font-weight: bold;
  font-size: 25px;
  color: #ff0066;
}
.contact-page .form-contact-container form.ant-form {
  margin: 0;
  position: relative;
  padding: 20px 50px;
  width: 100%;
}
.contact-page .form-contact-container form.ant-form .ant-form-item label {
  color: #8c8c8c;
}
.contact-page .form-contact-container form.ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-input,
.contact-page .form-contact-container form.ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-select-selector {
  padding-right: 24px;
  border-radius: unset;
  border: unset;
  border-bottom: 0.5px solid #d9d9d9;
}
.contact-page .form-contact-container form.ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-password {
  border-radius: unset;
  border: unset;
  border-bottom: 0.5px solid #d9d9d9;
}
.contact-page .form-contact-container form.ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-password .ant-input {
  border: unset;
}
.contact-page .form-contact-container form.ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-picker {
  width: 100%;
  border-radius: unset;
  border: unset;
  border-bottom: 0.5px solid #d9d9d9;
}
.contact-page .form-contact-container form.ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-upload span.file-name {
  width: 100%;
  display: block;
  padding: 10px;
  margin-top: 10px;
  border: #ccc dashed 0.5px;
}
.contact-page .form-contact-container form.ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-children-icon {
  color: #ff0066;
}
.contact-page .form-contact-container form.ant-form .row-button-auth {
  margin-bottom: 30px;
}
.contact-page .form-contact-container form.ant-form .input-password label {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.contact-page .form-contact-container form.ant-form .ant-form-item-required::before {
  display: none;
}
.contact-page .form-contact-container .logo {
  display: none;
}
@media (max-width: 567px) {
  .contact-page .form-contact-container .logo {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .contact-page .form-contact-container .logo img {
    width: 100px;
    height: 100px;
  }
}
.contact-page .form-contact-container .logo span {
  vertical-align: text-bottom;
  font-size: 16px;
  text-transform: uppercase;
  display: inline-block;
  font-weight: 700;
  color: #ff0066;
}
.contact-page .form-contact-container button {
  height: 40px;
}
.contact-page .form-contact-container p {
  color: #000000;
  text-align: center;
  margin-top: 16px;
  font-size: 12px;
  display: flex;
  justify-content: space-between;
}
.contact-page .form-register-placeholder {
  background-image: url('/background-login.jpg');
  width: 50%;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
@media screen and (max-width: 767px) {
  .contact-page .form-contact-container {
    width: 100%;
  }
  .contact-page .form-contact-container form.ant-form {
    padding: 20px;
  }
  .contact-page h1 {
    text-align: center;
  }
  .contact-page .form-register-placeholder {
    display: none;
  }
}

.performer-filter {
  padding: 0 10px;
}
.performer-filter .ant-btn-dashed.active {
  color: #d9005e !important;
  background: #fff !important;
  border-color: #d9005e !important;
}
.performer-filter .ant-btn:focus {
  color: #666;
  background: #fff;
  border-color: #e5e5e5;
}

.performer-carousel {
  width: 100%;
  min-height: 1px;
  background: rgba(245, 0, 98, 0.1);
  border-radius: 5px;
  position: relative;
}
.performer-carousel .carousel-header {
  padding: 25px 25px 0 25px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.performer-carousel .carousel-header .carousel-title {
  font-weight: bold;
  color: #000000;
  text-transform: capitalize;
}
.performer-carousel .performer-list {
  position: relative;
  display: flex;
  width: 100%;
  overflow: auto;
  margin: 10px 0;
  -ms-overflow-style: none;
  z-index: 1;
}
.performer-carousel .performer-list::-webkit-scrollbar {
  display: none;
}
.performer-carousel .performer-list .item {
  width: 320px;
  font-size: 14px;
  position: relative;
  font-style: normal;
  font-stretch: normal;
  letter-spacing: normal;
  margin: 5px 15px 5px 0;
  padding: unset;
  float: left;
  align-items: center;
  border-radius: unset;
  background: unset;
  height: unset;
  text-transform: capitalize;
  border-radius: 10px;
}
.performer-carousel .performer-list .item .item-title {
  display: flex;
  justify-content: space-between;
}
.performer-carousel .performer-list .item .item-title .item-name {
  padding: 10px 0;
  font-weight: bold;
  color: #000000;
}
.performer-carousel .performer-list .item .item-title .item-toolbar {
  color: #8c8c8c;
}
.performer-carousel .performer-list .item .item-image {
  position: relative;
  height: 200px;
  width: 320px;
  background-size: cover;
  display: block;
}
.performer-carousel .performer-list .item .item-token {
  bottom: 10px;
  left: 10px;
  padding: 5px 10px;
  background-color: #ffffff42;
  position: absolute;
  color: #fff;
  border-radius: 10px;
  display: flex;
  align-items: center;
  font-weight: bold;
  min-width: 30px;
}
.performer-carousel .performer-list .item .item-description {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.performer-carousel .performer-list .item:hover a.link-to {
  text-decoration: none;
}
@media screen and (min-width: 990px) {
  .performer-carousel .performer-list .item:hover a.link-to {
    color: #fff !important;
    background-color: #ff0066;
    text-decoration: none;
  }
}
.performer-carousel .performer-list .item img {
  width: 320px;
  height: 240px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  display: block;
  object-fit: cover;
}
.performer-carousel .performer-list .item a.link-to {
  color: #333;
  line-height: 25px;
  font-size: 16px;
  display: flex;
  border-radius: 50px;
  align-items: center;
  background: #eeeeee;
  padding: 0px 18px;
  height: 40px;
}
.performer-carousel .performer-list .item a.link-to span {
  white-space: nowrap;
}
.performer-carousel .performer-list .item.active a.link-to {
  color: #fff !important;
  background-color: #ff0066;
}
.performer-carousel .paddle {
  position: absolute;
  top: 50%;
  z-index: 2;
}
@media (max-width: 767px) {
  .performer-carousel .paddle {
    display: none !important;
  }
}
.performer-carousel .left-paddle {
  border-radius: 50%;
  font-size: 30px;
  left: 15px;
  cursor: pointer;
  border: 1px solid;
  background: #ccc;
  color: #fff;
}
.performer-carousel .right-paddle {
  border-radius: 50%;
  font-size: 30px;
  right: 15px;
  padding-right: 0;
  border: 1px solid #ccc;
  cursor: pointer;
  border: 1px solid;
  background: #ccc;
  color: #fff;
}
.performer-carousel .performer-grid {
  padding: 5px;
}
.performer-carousel .performer-grid .ant-card-body {
  flex-wrap: nowrap;
  overflow-x: scroll;
  -ms-overflow-style: none;
}
.performer-carousel .performer-grid .ant-card-body::-webkit-scrollbar {
  display: none;
}
.performer-carousel .performer-grid .ant-card-body .performer-box {
  width: calc(100% / 4);
  min-width: calc(100% / 4);
}
.performer-carousel .performer-grid .ant-card-body .performer-box .performer-avatar {
  height: 200px;
  background-size: cover;
  background-position: center center;
  width: 180px;
}
@media (max-width: 1200px) {
  .performer-carousel .performer-grid .ant-card-body .performer-box {
    width: calc(100% / 3);
    min-width: calc(100% / 3);
  }
}
@media (max-width: 567px) {
  .performer-carousel .performer-grid .ant-card-body .performer-box {
    width: calc(100% / 2);
    min-width: calc(100% / 2);
  }
}

.filter {
  flex-direction: column !important;
}
.filter button {
  margin: 0 20px;
}

.account-setting-page {
  background-color: white;
  height: 100%;
}

.text-overflow {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.text-gradient {
  background-image: -webkit-gradient(linear, 37.219838% 34.532506%, 36.425669% 93.178216%, from(#29cdff), to(#0a60ff), color-stop(0.37, #148eff));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.background-hover {
  transition: all 0.3s ease-out;
}
.background-hover:hover {
  background-color: #f9f9fc;
}
.primary-icon {
  color: #ff0066 !important;
}
.editable-cell {
  position: relative;
}
.editable-cell-value-wrap {
  padding: 5px 12px;
  cursor: pointer;
}
.editable-row:hover .editable-cell-value-wrap {
  border: 1px solid #d9d9d9;
  border-radius: 4px;
  padding: 4px 11px;
}
[data-theme='dark'] .editable-row:hover .editable-cell-value-wrap {
  border: 1px solid #434343;
}
.performer-profile-page {
  background-color: white;
  min-height: 100%;
}
.performer-profile-page .performer-profile-list {
  color: #000000;
}
.performer-profile-page .performer-profile-list .light-text {
  color: #8c8c8c;
}
.performer-profile-page .performer-profile-list .ant-card-head,
.performer-profile-page .performer-profile-list .ant-card-body {
  padding: 0 !important;
  border-bottom: none !important;
}
.performer-profile-page .performer-profile-list .social-media {
  display: flex;
  align-items: center;
  margin-bottom: 15px;
}

.messenger {
  display: flex;
  width: 100%;
}
.message-stream {
  display: flex;
  width: 100%;
  height: 480px;
  position: relative;
  margin-bottom: 5px;
  background-color: transparent;
}
.message-stream.user-logged-in .message-list {
  margin-bottom: 0px;
}
.message-stream.user-logged-in .message-list-container {
  height: calc(100% - 50px) !important;
}
.scrollable {
  position: relative;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
}
.sidebar {
  background-color: #fff;
  display: flex;
  width: 30%;
}
.chat-content {
  background: #fff;
  display: flex;
  width: 70%;
  padding: 20px 0;
  position: relative;
}
.chat-content .close-btn {
  display: none;
}
.footer {
  background: #fff;
}
@media all and (max-width: 768px) {
  .sidebar {
    width: 100%;
  }
  .sidebar.active {
    display: none;
  }
  .chat-content {
    display: none;
  }
  .chat-content.active {
    display: flex;
    width: 100%;
  }
  .chat-content.active .close-btn {
    display: flex;
    position: absolute;
    top: 5px;
    left: 5px;
    z-index: 1;
  }
}

.conversation-list {
  height: 100%;
  width: 100%;
  overflow: hidden;
  padding: 20px 0;
  border-right: 1px #ff0066 solid;
}

.conversation-search {
  padding: 10px;
  display: flex;
  flex-direction: column;
}
.conversation-search-input {
  background: #f4f4f8;
  padding: 8px 10px;
  border-radius: 10px;
  border: none;
  font-size: 14px;
}
.conversation-search-input::placeholder {
  text-align: center;
}
.conversation-search-input:focus::placeholder {
  text-align: left;
}

.conversation-list-item {
  display: flex;
  align-items: center;
  padding: 10px;
  position: relative;
  overflow: hidden;
}
.conversation-list-item .conversation-info {
  overflow: hidden;
}
.conversation-left-corner {
  display: flex;
  flex-direction: column;
  margin-right: 10px;
  align-items: center;
  justify-content: center;
}
.conversation-left-corner span {
  font-size: 10px;
}
.conversation-list-item:hover {
  background: #ffe6eb;
  cursor: pointer;
}
.conversation-list-item.active {
  background: #ffe6eb;
  pointer-events: none;
}
.conversation-photo {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  object-fit: cover;
}
.conversation-title {
  font-size: 14px;
  font-weight: bold;
  text-transform: capitalize;
  margin: 0;
}
.conversation-snippet {
  font-size: 12px;
  color: #888;
  margin: 0;
  height: 20px;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.conversation-time {
  font-size: 10px;
  color: #888;
  margin: 0;
}
.notification-badge {
  position: absolute;
  top: 0;
  left: 10px;
}

.stream-header {
  margin-bottom: 10px;
}
.stream-header .left-content {
  display: flex;
  align-items: center;
}
.stream-header .left-content .stream-title {
  margin-left: 5px;
  font-size: 16px;
  font-weight: bold;
  color: #ff0066;
  display: flex;
  flex-direction: column;
  text-transform: capitalize;
}
.stream-header .left-content .stream-avatar {
  height: 45px;
  width: 45px;
  border-radius: 50%;
}
.button-block {
  width: 100%;
  display: flex;
  justify-content: flex-end;
}
.button-block .ant-btn {
  height: 35px;
  margin: 5px;
}
@media (max-width: 567px) {
  .button-block {
    justify-content: flex-start;
    margin-top: 10px;
    width: 100%;
  }
}

.stream-footer .ant-btn:disabled {
  color: #fff;
  background: #ff0066;
  border-color: #ff0066;
}

.token-radio {
  width: 100%;
  justify-content: space-between;
}
.token-radio .amount {
  width: 150px;
}
@media (max-width: 567px) {
  .token-radio .tip-description {
    display: none;
  }
}

.message-list {
  height: 100%;
  overflow: hidden;
  width: 100%;
  margin-bottom: 0px;
}
.message-list.custom {
  height: 50vh;
}
.message-list-container {
  padding: 10px;
  overflow-y: scroll;
  height: 90%;
}
.sub-text {
  color: #ff0064;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  background: rgba(1, 1, 1, 0.5);
}
@media all and (max-width: 768px) {
  .sub-text {
    font-size: 14px;
  }
}
.start-conversation {
  text-align: center;
  margin-top: 30%;
  font-size: large;
}

.compose {
  padding: 8px 10px;
  display: flex;
  align-items: center;
  position: absolute;
  width: 100%;
  bottom: 0;
  left: 0;
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
  background: #fff;
}
.compose .ant-input-textarea {
  width: 100%;
}
.compose-input {
  flex: 1;
  border: none;
  border-radius: 15px;
  font-size: 14px;
  height: 30px;
  background: none;
  color: #333;
  outline: thin;
  border-color: #CE0053 !important;
  box-shadow: 0 0 0 2px #CE0053 !important;
}
.compose-input:focus {
  border-color: #CE0053 !important;
  box-shadow: 0 0 0 2px #CE0053 !important;
}
.compose-input::placeholder {
  color: #8c8c8c;
}
.compose-input::placeholder {
  opacity: 0.5;
}
.compose .toolbar-button {
  color: #bbbbbf;
  margin-left: 15px;
}
.compose .toolbar-button:hover {
  color: #99999c;
}
.grp-icons {
  padding: 0 10px;
  cursor: pointer;
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.grp-emotions aside.emoji-picker-react {
  display: none;
  position: absolute;
  right: 0;
  bottom: 50%;
}
.grp-emotions:hover aside.emoji-picker-react {
  display: flex;
}
.grp-file-icon {
  background: url('/paperclip-ico.png');
  background-size: 100%;
  background-repeat: no-repeat;
  height: 25px;
  width: 25px;
}
.grp-file-icon .avatar-uploader {
  opacity: 0;
}
.grp-file-icon .avatar-uploader .ant-upload {
  width: 30px;
  height: 30px;
  background: transparent;
  border: none;
  margin: 0;
}
.grp-file-icon .avatar-uploader .ant-upload img {
  width: 20px!important;
  height: 20px;
  object-fit: cover;
}
.grp-file-icon .avatar-uploader .ant-upload-text {
  display: none;
}

.message {
  display: flex;
  flex-direction: column;
}
.message .timestamp {
  display: flex;
  justify-content: flex-start;
  color: #999;
  font-weight: 600;
  font-size: 8px;
  margin: 5px 0px;
}
.message.mine .timestamp {
  justify-content: flex-end;
}
.message .bubble-container {
  font-size: 14px;
  display: flex;
}
.message.mine .bubble-container {
  justify-content: flex-end;
}
.message .bubble-container .bubble {
  margin: 1px 0px;
  background: #f4f4f8;
  padding: 10px 15px;
  border-radius: 5px;
  max-width: 75%;
  position: relative;
  word-break: break-all;
}
.message .bubble-container .bubble .close-btn {
  position: absolute;
  top: -10px;
  right: -7px;
  padding: 0px 7px;
  border: 1px solid;
  border-radius: 5px;
  background: #fff;
}
.message.mine .bubble-container .bubble {
  background: #ff0064;
  color: white;
}
.message.tip .bubble-container .bubble {
  width: 100% !important;
  max-width: 100% !important;
  text-align: center !important;
  background: #ff0066 !important;
  color: white !important;
}
.message.tip .timestamp {
  text-align: center;
  display: inline-block;
}
.message-time {
  font-size: 10px;
  margin: 0;
}

.conversation-stream {
  min-height: 530px;
  border: solid 1px #ff0066;
  border-radius: 15px;
  margin: 0 15px;
}
.conversation-stream .tablist {
  margin: 0;
}
.conversation-stream .ant-tabs > .ant-tabs-nav,
.conversation-stream .ant-tabs > div > .ant-tabs-nav {
  margin: 0 !important;
}
.conversation-stream .ant-tabs-tab-btn {
  transition: all 0.1s;
}
.conversation-stream .ant-tabs-nav-list {
  width: 100%;
  overflow: hidden;
}
.conversation-stream .ant-tabs-nav-list .ant-tabs-tab {
  flex: 1;
  justify-content: center;
  height: 50px;
  margin: 0;
}
.conversation-stream .ant-tabs-nav-list .ant-tabs-tab:first-child {
  border-top-left-radius: 12px;
}
.conversation-stream .ant-tabs-nav-list .ant-tabs-tab:nth-child(2) {
  border-top-right-radius: 12px;
}
.conversation-stream .ant-tabs-nav-list .ant-tabs-tab-active {
  background-color: #ff0066;
  color: #ffffff;
}
.conversation-stream .ant-tabs-nav-list .ant-tabs-tab-active .ant-tabs-tab-btn {
  color: #fff;
}
@media (max-width: 767px) {
  .conversation-stream {
    margin: 15px 0;
  }
}

.private-streaming-container {
  position: relative;
  margin: 5px 0;
  min-height: 520px;
}
.private-streaming-container #private-publisher {
  right: 10px;
  top: 25px;
  height: 145px;
  width: 145px;
  position: absolute;
  z-index: 2;
  object-fit: cover;
}
@media screen and (max-width: 567px) {
  .private-streaming-container #private-publisher {
    right: 5px;
    top: 5px;
    height: 100px;
    width: 100px;
  }
}
.private-streaming-container #private-subscriber {
  width: 100% !important;
  height: 480px;
  object-fit: cover;
}
@media screen and (max-width: 567px) {
  .private-streaming-container #private-subscriber {
    height: 320px;
  }
}

#subscriber {
  min-height: 480px;
  width: 100%;
  object-fit: cover;
}
@media screen and (max-width: 567px) {
  #subscriber {
    min-height: 320px;
    height: 320px;
  }
}
#publisher {
  min-height: 480px;
  width: 100%;
}
@media screen and (max-width: 567px) {
  #publisher {
    min-height: 230px;
    height: 230px;
  }
}
.video-container {
  display: flex;
}
.video-container video {
  width: 100%;
}
.conversation-users .users {
  height: 435px;
  overflow-y: scroll;
  width: 100%;
}
.conversation-users .users .user {
  margin: 15px;
  padding: 10px;
  border-radius: 5px;
  background-color: #ffffff;
}
.conversation-users .users .user .message-username {
  font-weight: 1000;
}
.publishing {
  font-size: 13px;
  font-weight: 500;
  color: #ff0066;
}

.title {
  position: absolute;
  bottom: 0;
}
@media (max-width: 567px) {
  .title {
    position: relative;
  }
}
.streaming-container {
  margin-top: 20px;
  margin-bottom: 20px;
  min-height: 520px;
}
.streaming-container .subscriber {
  height: calc(100% - 50px);
  width: 100%;
  background: #ffffff;
}
.streaming-container .subscriber video {
  width: 100%;
  height: 100%;
}
@media (max-width: 567px) {
  .streaming-container .subscriber {
    height: 480px;
  }
}
.profile-page .performer-grid {
  min-height: 0 !important;
}
.profile-page .performer-grid .ant-card-head {
  padding: 0 20px !important;
}

.conversation {
  width: 100%;
  height: 100%;
  min-height: 320px;
  border: solid 1px #ff0066;
  border-radius: 15px;
}
.conversation .tablist {
  margin: 0;
}
.conversation .ant-tabs-nav-list {
  width: 100%;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  overflow: hidden;
}
.conversation .ant-tabs-nav-list .ant-tabs-tab {
  width: 50%;
  justify-content: center;
  margin: 0;
}
.conversation .ant-tabs-nav-list .ant-tabs-tab-active {
  background-color: #ff0066;
}
.conversation .ant-tabs-nav-list .ant-tabs-tab-active .ant-tabs-tab-btn {
  color: #fff;
}