.home-container {
  width: 100%;
  height: 100%;
  /* display: flex; */
  flex: 1;
  align-items: center;
  flex-direction: column;
  overflow: hidden;
}

.home-container001 {
  width: 100%;
  height: 100%;
  display: flex;
  flex: 1;
  flex-direction: column;
  overflow: hidden;
  position: relative;
  z-index: +2;
}

#virtual{
  display: none;
}

.home-view{
    position: absolute !important;
    top: 0;
    left: 0;
}

.pop-view{
  z-index: +1;
  position: absolute;
}

.home-posts-view {
  flex: 1;
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
}

.home-posts-view > .main{
  flex: 1;
  width: 100%;
  height: 100%;
  display: flex;
  padding: 0 5px;
  overflow: hidden;
  position: relative;
  align-items: flex-start;
  flex-direction: column;
  align-items: center;
}



.live-events-drawer {
  display: flex;
  justify-content: center;
  height: 30px;
  width: 35px;
  position: fixed;
  position: fixed;
  right: 0;
  top: 0;
  z-index: +1;
  fill: green;
  padding: 5px;
  opacity: 0;
  border-radius: 10px;
  margin: 10px;
  transition: 0.2s all linear;
  box-shadow: 0 0 5px 0 rgba(0,0,0,0.5);
}

.live-events-drawer svg{
  height: 100%;
  width: 30px;
}

.no-live-event {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-size: 18px;
}

.live-events-container {
  height: 100px;
  width: 100%;
  font-size: 14px;
  transition: 0.2s all linear;
  flex-shrink: 0;
  position: absolute;
  z-index: +1;
  align-self: flex-end;
  overflow-y: hidden;
}

.live-events{
  width: 100%;
  overflow-x: scroll;
}

.live-events-banner {
  width: 80px;
  background: rgba(0,100,0,1);
  box-shadow: 0 0 20px 10px var(--theme-back);
  height: 90px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: +1;
  font-weight: bold;
  font-size: 16px;
  padding: 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  text-align: center;
  border-radius: 0 0px 20px 0;
  overflow: hidden;
  transition: 0.2s all linear;
  color: white;
}

.live-events-banner svg {
  fill: white;
  width: 22px;
  height: 22px;
}

.live-events-hor-scroll {
  height: 100px;
  min-width: 100%;
  width: max-content;
  overflow-x: visible;
  padding-left: 90px;
}

.live-event {
  float: left;
  width: 80px;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  padding: 10px;
}

.live-host-handle, .live-cohost-handle {
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
}

.live-participants-pic {
  height: 43px;
  width: 45px;
}

.live-host-profile-pic {
  width: 30px;
  height: 30px;
  border: 3px var(--theme-back) solid;
  position: relative;
  z-index: +1;
}

.live-cohost-profile-pic {
  width: 25px;
  height: 25px;
  position: relative;
  left: 14px;
  top: -12px;
  border: none;
}

.posts-container{
  width: 100%;
  max-width: 100vh;
  display: flex;
  flex-direction: column;
  overflow-y: scroll;
  overflow-x: hidden;
  overscroll-behavior-y: contain;
  overscroll-behavior-x: none;
  gap: 10px;
  background-color: var(--theme-back-light);
  /* scroll-snap-type: y mandatory; */
}

.live-events-filler {
  height: 100px;
  flex-shrink: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 20px;
  font-weight: bold;
}

.post-not-found{
  width: 100%;
  height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 20px;
}

.post-not-found .my-button{
  padding: 10px;
  border-radius: 10px;
}

.home-post {
  flex: 0 0 auto;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  width: 100%;
  position: relative;
  background: var(--theme-back);
  padding-bottom: 15px;
  /* scroll-snap-stop: normal;
  scroll-snap-align: start; */
}

.share-post{
    position: absolute;
    top: 20px;
    right: 10px;
    /* width: 24px; */
    height: 24px;
    display: flex;
    gap: 10px; 
}

.share-post svg{
    width: 24px;
    height: 24px;
}

.home-post-head {
  gap: 5px;
  flex: 1;
  width: 100%;
  height: 100px;
  display: flex;
  align-items: center;
  padding-top: 10px;
  padding-bottom: 10px;
}
.home-container002 {
  flex: 0 0 auto;
  width: 50px;
  height: 50px;
  display: flex;
  overflow: hidden;
  align-items: flex-start;
  border-color: var(--theme-mid);
  border-width: 1px;
  border-radius: 50%;
}
.home-image {
  width: 100%;
  object-fit: cover;
}
.home-container003 {
  width: 100%;
  display: flex;
  align-self: stretch;
  align-items: flex-start;
  padding-top: 2px;
  flex-direction: column;
  padding-bottom: 5px;
  justify-content: space-between;
}
.home-text {
  font-weight: bold;
}
.home-text003 {
  font-size: 12px;
}
.home-post-body {
  width: 100%;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

.swiper{
  /* height: 100%; */
  width: 100%;
}

.home-post .swiper{
  max-height: 70vh;
}

.swiper-wrapper{
  height: 100%;
}

.swiper-slide{
  /*
  align-items: center;
  justify-content: center;
  position: relative; */
  display: flex;
  height: 100%;
}

.post-picture-blur-overlay {
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}

.post-picture-reload-button {
  width: 50px;
  height: 50px;
  display: none;
  position: absolute;
  fill: var(--theme-fore-light);
}

.post-picture {
  transition: 0.3s all cubic-bezier(0.19, -0.52, 0, 1.3);
}

.post-picture-height-preference{
  height: 100%;
}

.post-picture-width-preference{
  width: 100%;
}

.post-picture-expandable {
  width: 5%;
  aspect-ratio: 1;
  position: absolute;
  top: 20px;
  right: 20px;
  display: none;
}

.post-picture-expandable svg {
  width: 100%;
}


.post-picture-expandable-container .post-picture-expandable{
  display: flex;
}

.full-post-image{

}

.swiper-slide video{
}

.swiper-slide-active{
  z-index: +1;
}

/* .dependent-image{
  position: absolute;
  height: 100%;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.independent-image{
  width: 100%;
} */

.home-post-reactions {
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  padding: 10px;
  align-items: flex-start;
  justify-content: space-between;
}
.home-container004 {
  gap: 5px;
  flex: 0 0 auto;
  width: auto;
  height: auto;
  display: flex;
  align-items: center;
}
.home-icon {
  width: 16px;
  height: 16px;
}

.post-liked, .comment-liked{
  fill: red !important;
}
.home-text004 {
  font-size: 12px;
}
.home-text007 {
  width: 100%;
  font-size: 12px;
  text-align: center;
}
.home-container005 {
  gap: 5px;
  flex: 0 0 auto;
  width: auto;
  height: auto;
  display: flex;
  align-items: center;
}
.home-icon02 {
  fill: grey; /* var(--dl-color-danger-500); */
  width: 16px;
  height: 16px;
}
.home-text008 {
  font-size: 12px;
}
.home-container006 {
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  align-items: flex-start;
  padding-top: 5px;
  flex-direction: column;
  padding-bottom: 15px;
}
.home-text011 {
  font-size: 14px;
  padding-left: 5px;
  padding-right: 5px;
  white-space: pre-line;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  overflow-wrap: break-word;
  width: 100%;
}
.home-comment-section {
  width: 100%;
  display: flex;
  align-items: center;
  padding-left: 10px;
  padding-right: 10px;
}
.home-container007 {
  flex: 0 0 auto;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: flex-start;
}
.home-image01 {
  width: 40px;
  object-fit: cover;
}
.home-container008 {
  flex: 1;
  width: 100%;
  display: flex;
  align-self: stretch;
  align-items: flex-start;
  border-color: #828282;
  border-width: 0px;
  padding-left: 10px;
  padding-right: 10px;
  flex-direction: column;
  justify-content: center;
  border-bottom-width: 0px;
}

.post-comment-input {
  width: 100%;
  padding: 5px;
  transition: 0.3s;
  border-color: var(--theme-mid);
  border-width: 0px;
  background-color: transparent;
  border-bottom-width: 0.5px;
}

.post-comment-input:focus {
  outline: none;
}

.home-icon04 {
    display: flex;
    align-items: center;
  width: 24px;
  height: 24px;
}

.home-icon04 svg{
  width: 100%;
}

.inline-comment{
  margin: 15px 10px 0 10px;
  font-size: 14px;
  opacity: 0.7;
}

.inline-comment-body{
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 10px 10px 0 15px;
  font-style: italic;
}

.inline-comment-author{
  font-weight: 500;
}

.comment-indicator{
  font-style: italic;
}

.load-comments{
  font-size: 14px;
  margin: 10px 10px 0 10px;
  text-align: right;
  width: 95%;
}

.home-demacator {
  width: calc(100% + 10px);
  height: 10px;
  display: flex;
  position: relative;
  margin-top: 15px;
  align-items: flex-start;
  margin-left: -5px;
  margin-right: -5px;
  margin-bottom: 0px;
  display: none;
}

#postsView .home-post:last-child .home-demacator, #postsView2 .home-post:last-child .home-demacator{
    display: none;
}

.post-loading{
    padding: 60px;
    background-color: var(--theme-back);
}

.post-loading .theme-fore-icon{
  opacity: 0.7;
}

.home-post1 {
  flex: 0 0 auto;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-post-head1 {
  gap: 5px;
  flex: 1;
  width: 100%;
  height: 100px;
  display: flex;
  align-items: center;
  padding-top: 10px;
  padding-bottom: 10px;
}
.home-container009 {
  flex: 0 0 auto;
  width: 50px;
  height: 50px;
  display: flex;
  overflow: hidden;
  align-items: flex-start;
  border-color: var(--dl-color-gray-black);
  border-width: 1px;
  border-radius: 50%;
}
.home-image02 {
  width: 100%;
  object-fit: cover;
}
.home-container010 {
  width: 100%;
  display: flex;
  align-self: stretch;
  align-items: flex-start;
  padding-top: 2px;
  flex-direction: column;
  padding-bottom: 5px;
  justify-content: space-between;
}
.home-text012 {
  font-weight: bold;
}
.home-text015 {
  font-size: 12px;
}
.home-post-body1 {
  width: 100%;
}
.home-post-reactions1 {
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  padding: 10px;
  align-items: flex-start;
  justify-content: space-between;
}
.home-container011 {
  gap: 5px;
  flex: 0 0 auto;
  width: auto;
  height: auto;
  display: flex;
  align-items: center;
}
.home-icon06 {
  width: 16px;
  height: 16px;
}
.home-text016 {
  font-size: 12px;
}
.home-text019 {
  width: 100%;
  font-size: 12px;
  text-align: center;
}
.home-container012 {
  gap: 5px;
  flex: 0 0 auto;
  width: auto;
  height: auto;
  display: flex;
  align-items: center;
}
.home-icon08 {
  fill: var(--dl-color-danger-500);
  width: 16px;
  height: 16px;
}
.home-text020 {
  font-size: 12px;
}
.home-container013 {
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  align-items: flex-start;
  padding-top: 5px;
  flex-direction: column;
  padding-bottom: 15px;
}
.home-text023 {
  font-size: 14px;
  padding-left: 5px;
  padding-right: 5px;
}
.home-comment-section1 {
  width: 100%;
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}
.home-container014 {
  flex: 0 0 auto;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: flex-start;
}
.home-image03 {
  width: 40px;
  object-fit: cover;
}
.home-container015 {
  flex: 1;
  width: 100%;
  display: flex;
  align-self: stretch;
  align-items: flex-start;
  border-color: #828282;
  border-width: 0px;
  padding-left: 10px;
  padding-right: 10px;
  flex-direction: column;
  justify-content: center;
  border-bottom-width: 0px;
}
.home-textinput1 {
  width: 100%;
  padding: 5px;
  transition: 0.3s;
  border-color: #000000;
  border-width: 1px;
  border-radius: 10px;
  background-color: transparent;
}
.home-textinput1:focus {
  outline: none;
}
.home-icon10 {
  width: 24px;
  height: 24px;
}
.home-demacator1 {
  width: calc(100% + 10px);
  height: 10px;
  display: flex;
  position: relative;
  margin-top: 0px;
  align-items: flex-start;
  margin-left: -5px;
  margin-right: -5px;
  margin-bottom: 0px;
}
.home-post2 {
  flex: 0 0 auto;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-post-head2 {
  gap: 5px;
  flex: 1;
  width: 100%;
  height: 100px;
  display: flex;
  align-items: center;
  padding-top: 10px;
  padding-bottom: 10px;
}
.home-container016 {
  flex: 0 0 auto;
  width: 50px;
  height: 50px;
  display: flex;
  overflow: hidden;
  align-items: flex-start;
  border-color: var(--dl-color-gray-black);
  border-width: 1px;
  border-radius: 50%;
}
.home-image04 {
  width: 100%;
  object-fit: cover;
}
.home-container017 {
  width: 100%;
  display: flex;
  align-self: stretch;
  align-items: flex-start;
  padding-top: 2px;
  flex-direction: column;
  padding-bottom: 5px;
  justify-content: space-between;
}
.home-text024 {
  font-weight: bold;
}
.home-text027 {
  font-size: 12px;
}
.home-post-body2 {
  width: 100%;
}
.home-post-reactions2 {
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  padding: 10px;
  align-items: flex-start;
  justify-content: space-between;
}
.home-container018 {
  gap: 5px;
  flex: 0 0 auto;
  width: auto;
  height: auto;
  display: flex;
  align-items: center;
}
.home-icon12 {
  width: 16px;
  height: 16px;
}
.home-text028 {
  font-size: 12px;
}
.home-text031 {
  width: 100%;
  font-size: 12px;
  text-align: center;
}
.home-container019 {
  gap: 5px;
  flex: 0 0 auto;
  width: auto;
  height: auto;
  display: flex;
  align-items: center;
}
.home-icon14 {
  fill: var(--dl-color-danger-500);
  width: 16px;
  height: 16px;
}
.home-text032 {
  font-size: 12px;
}
.home-container020 {
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  align-items: flex-start;
  padding-top: 5px;
  flex-direction: column;
  padding-bottom: 15px;
}
.home-text035 {
  font-size: 14px;
  padding-left: 5px;
  padding-right: 5px;
}
.home-comment-section2 {
  width: 100%;
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}
.home-container021 {
  flex: 0 0 auto;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: flex-start;
}
.home-image05 {
  width: 40px;
  object-fit: cover;
}
.home-container022 {
  flex: 1;
  width: 100%;
  display: flex;
  align-self: stretch;
  align-items: flex-start;
  border-color: #828282;
  border-width: 0px;
  padding-left: 10px;
  padding-right: 10px;
  flex-direction: column;
  justify-content: center;
  border-bottom-width: 0px;
}
.home-textinput2 {
  width: 100%;
  padding: 5px;
  transition: 0.3s;
  border-radius: 10px;
}
.home-textinput2:focus {
  outline: none;
}
.home-icon16 {
  width: 24px;
  height: 24px;
}
.home-demacator2 {
  width: calc(100% + 10px);
  height: 10px;
  display: flex;
  position: relative;
  margin-top: 0px;
  align-items: flex-start;
  margin-left: -5px;
  margin-right: -5px;
  margin-bottom: 0px;
}

.comments-window{
  width: 100%;
  height: 100%;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: +2;
  opacity: 0;
  transition: 0.2s all linear;
  /* display: contents; */
}

.comments-window-container{
  position: absolute;
  display: flex;
  flex-direction: column;
  width: 100%;
  bottom: 0px;
  padding-bottom: var(--foot-offset);
  height: 70%;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  box-shadow: 0 -2px 2px 0 rgba(0,0,0,0.1);
  overflow-y: hidden;
  /* display: none; */
}

.comments-window-heading{
  padding: 10px 10px;
  font-weight: bold;
  border-bottom: 2px var(--theme-mid) solid;
  /* background-color: #565656; */
  /* color: transparent; */
  /* text-shadow: 0px 2px 3px rgba(255,255,255,0.5); */
  /* -webkit-background-clip: text; */
     /* -moz-background-clip: text; */
          /* background-clip: text; */
}

.comments-window-body{
  padding: 0px 5px;
  display: flex;
  flex-direction: column;
  gap: 15px;
  /* padding-bottom: 50px; */
  overflow-y: scroll;
  height: 100%;
  /* border: 2px red solid; */
}

.comments-window-body-scrollview{
  height: 100%;
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 0 0px 20px 0;
  gap: 10px;
  /* box-shadow: inset 0 0 10px 0 white; */
  scroll-behavior: smooth;
  overscroll-behavior: contain;
  overflow-y: scroll;
}

.no-comment{
  color: var(--theme-fore-light);
  text-align: center;
}

.new-comment{
    display: flex;
    flex-direction: column-reverse;
    gap: 10px;
    transition: 0.3s all linear;
    scroll-behavior: smooth;
}

.comment-container{
  display: flex;
  flex-direction: row;
  gap: 10px;
  padding: 5px;
  transition: 0.3s all linear;
  /* border-bottom: 1px var(--theme-mid) solid; */
}

.comment-profile-picture{
    width: 40px;
    height: 40px;
    border-radius: 50%;
}

.comment-content{
    width: 100%;
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 5px;
}

.comment-head{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  width: 100%;
  font-size: 12px;
}

.comment-author{
  /* font-weight: 600; */
  opacity: 0.7;
}

.comment-time{
  opacity: 0.6;
}

.comment-text{
  font-size: 14px;
  /* padding: 0 10px; */
  display: -webkit-box;
  white-space: pre-line;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.comment-actions{
    font-size: 12px;
    padding-top: 4px;
    color: var(--theme-fill);
    display: flex;
    flex-direction: column;
    gap: 5px;
    align-items: center;
}

.comment-actions-row{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  gap: 20px;
  align-items: center;
  width: 100%;
  padding-right: 20px;
}

.flex-left{
  display: flex;
  direction: row;
  gap: 20px;
}

.like-comment{
  display: flex;
  align-items: center;
  gap: 4px;
}

.like-comment svg{
    width: 14px;
    height: 14px;
}

.comment-replies{
    border-left: 1px var(--theme-mid) solid;
    padding-left: 10px;
    padding-right: 10px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.comment-replies-filler{
    min-height: 20px;
}

.new-reply{
    display: flex;
    flex-direction: column-reverse;
    gap: 20px;
}

.new-reply .comment-reply:last-child{
    margin-top: 20px;
}

.comment-reply{
    font-size: 14px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 10px;
    padding: 5px;
    transition: 0.3s all linear;
}

.comment-reply-profile-picture{
    width: 25px;
    height: 25px;
    border-radius: 50%;

}

.comment-reply-content{
    width: 100%;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.comment-reply-head{
    display: flex;
    flex-direction: row;
    gap: 5px;
    justify-content: space-between;
    font-size: 12px;
    color: var(--theme-fill);
}

.comment-reply-author{

}

.comment-reply-time{

}

.comment-reply-body{

}

.commment-reply-text {
  display: -webkit-box;
  white-space: pre-line;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.comment-reply-actions {
  margin-top: 7px;
  font-size: 12px;
  color: var(--theme-fill);
}

.show-replies{
    font-size: 12px;
    color: var(--theme-fill);
    padding-left: 12px;
}

.comments-window-comment-section{
    width: 100%;
    display: flex;
    align-items: center;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    border-top: 2px var(--theme-mid) solid;
    border-bottom: 2px var(--theme-mid) solid;
    position: relative;
}


.comments-window .home-comment-section{
  position: absolute;
  bottom: 10px;
}

.comments-window-input{
    width: 100%;
    padding: 5px;
    transition: 0.3s;
    border-color: var(--theme-mid);
    border-width: 0px;
    background-color: transparent;
}

.comments-window-input:focus{
    outline: 2px var(--theme-fore-light) solid;
    border-radius: 5px;
}

.replying-to{
    font-size: 12px;
    position: absolute;
    right: 40px;
    top: -25px;
    border-radius: 10px;
    padding: 5px 10px;
    border: 1px var(--theme-fore-light) solid;
    display: flex;
    align-items: center;
    gap: 10px;
    opacity: 0;
}

.replying-to-cancel{
    display: flex;
}

.replying-to-cancel svg{
    width: 18px;
    height: 18px;
    fill: var(--theme-fill);
}


.load-more-posts-trigger{
  /* position: absolute; */
  bottom: 0;
  height: 100px;
  width: 100px;
  background-color: black;
}

.home-stars-view {
  flex: 1;
  width: 100%;
  height: 100%;
  position: relative;
}

.home-stars-view > .main{
  width: 100%;
  height: 100%;
  display: flex;
  overflow: scroll;
  position: relative;
  align-items: center;
  flex-direction: column;
  justify-content: flex-start;
}

.home-star-search {
  width: 100%;
  display: flex;
  padding: 10px;
  align-items: center;
  flex-direction: column;
  justify-content: flex-start;
}
.home-container023 {
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  align-items: flex-start;
  padding-top: 4px;
  padding-left: 10px;
  border-radius: 12px;
  padding-right: 10px;
  padding-bottom: 4px;
}
.home-textinput3 {
  flex: 1;
  width: 100%;
  font-size: 14px;
  border-radius: 10px;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  padding: 5px 10px;
}
.home-search-button {
  min-width: 50px;
  height: auto;
  display: flex;
  align-self: stretch;
  min-height: 20px;
  align-items: center;
  padding-top: 5px;
  padding-left: 10px;
  border-radius: 10px;
  padding-right: 10px;
  padding-bottom: 5px;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.home-search {
  font-size: 14px;
}
.home-container024 {
  gap: 20px;
  flex: 1;
  width: 100%;
  height: 100%;
  display: flex;
  padding: 10px;
  overflow-y: scroll;
  align-items: center;
  flex-direction: column;
  justify-content: flex-start;
}
.home-stars-list-cont {
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  overflow: scroll;
  align-items: flex-start;
  flex-direction: column;
}
.search-star-result-container{
  opacity: 0;
  transition: 0.3s all linear;
}
.home-stars-list-category {
  gap: 15px;
  width: 100%;
  display: flex;
  position: relative;
  align-items: flex-start;
  padding-top: 15px;
  padding-left: 10px;
  border-radius: 10px;
  padding-right: 10px;
  flex-direction: column;
  padding-bottom: 0px;
}

.close-search-result{
  position: absolute;
  right: 10px;
  top: 10px;

}

.close-search-result svg{
  width: 22px;
}

.home-stars-list-category-title {
  font-weight: bold;
}

.home-stars-list {
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 2.75%;
}
.home-star {
  gap: 4px;
  flex: 0 0 auto;
  width: 31.5%;
  display: flex;
  align-items: center;
  margin-bottom: 40px;
  flex-direction: column;
}
.home-profile-picture-cont {
  flex: 0 0 auto;
  width: 100%;
  aspect-ratio: 1/1;
  display: flex;
  border-radius: 10px;
  box-shadow: 0 0 3px 0 rgba(0,0,0,0.3);
  position: relative;
  align-items: flex-start;
  flex-direction: column;
}
.home-image06 {
  width: 100px;
  object-fit: cover;
  border-radius: 5px;
}
.home-rank-container {
  top: -10px;
  right: -10px;
  width: 20px;
  height: 20px;
  display: flex;
  padding: 5px;
  position: absolute;
  align-items: center;
  border-radius: 50%;
  flex-direction: column;
  justify-content: center;
  background-color: var(--dl-color-success-300);
}
.home-rank {
  color: #ffffff;
  font-size: 10px;
  font-weight: bold;
}
.home-container025 {
  flex: 0 0 auto;
  width: auto;
  height: auto;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}
.home-star-display-name {
  font-weight: bold;
}
.home-container026 {
  flex: 0 0 auto;
  width: 100%;
  height: auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.home-text040 {
  font-size: 14px;
}
.home-container027 {
  gap: 2px;
  display: flex;
  align-items: center;
}
.home-text041 {
  font-size: 14px;
  line-height: 1;
  padding-top: 1px;
}
.home-icon18 {
  width: 16px;
  height: 16px;
}
.home-star01 {
  gap: 4px;
  flex: 0 0 auto;
  width: 30%;
  display: flex;
  align-items: center;
  flex-direction: column;
}
.home-profile-picture-cont01 {
  flex: 0 0 auto;
  width: auto;
  display: flex;
  position: relative;
  align-items: flex-start;
  flex-direction: column;
}
.home-image07 {
  width: 100px;
  object-fit: cover;
  border-radius: 5ox;
}
.home-rank-container1 {
  top: -10px;
  right: -10px;
  width: 20px;
  height: 20px;
  display: flex;
  padding: 5px;
  position: absolute;
  align-items: center;
  border-radius: 50%;
  flex-direction: column;
  justify-content: center;
  background-color: var(--dl-color-success-300);
}
.home-rank1 {
  color: rgb(255, 255, 255);
  font-size: 10px;
  font-weight: bold;
}
.home-container028 {
  flex: 0 0 auto;
  width: auto;
  height: auto;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}
.home-star-display-name01 {
  font-weight: bold;
}
.home-container029 {
  flex: 0 0 auto;
  width: 100%;
  height: auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.home-text044 {
  font-size: 14px;
}
.home-container030 {
  gap: 2px;
  display: flex;
  align-items: center;
}
.home-text045 {
  font-size: 14px;
  line-height: 1;
  padding-top: 1px;
}
.home-icon21 {
  width: 16px;
  height: 16px;
}
.home-star02 {
  gap: 4px;
  flex: 0 0 auto;
  width: 30%;
  display: flex;
  align-items: center;
  flex-direction: column;
}
.home-profile-picture-cont02 {
  flex: 0 0 auto;
  width: auto;
  display: flex;
  position: relative;
  align-items: flex-start;
  flex-direction: column;
}
.home-image08 {
  width: 100px;
  object-fit: cover;
  border-radius: 5px;
}
.home-rank-container2 {
  top: -10px;
  right: -10px;
  width: 20px;
  height: 20px;
  display: flex;
  padding: 5px;
  position: absolute;
  align-items: center;
  border-radius: 50%;
  flex-direction: column;
  justify-content: center;
  background-color: var(--dl-color-success-300);
}
.home-rank2 {
  color: rgb(255, 255, 255);
  font-size: 10px;
  font-weight: bold;
}
.home-container031 {
  flex: 0 0 auto;
  width: auto;
  height: auto;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}
.home-star-display-name02 {
  font-weight: bold;
}
.home-container032 {
  flex: 0 0 auto;
  width: 100%;
  height: auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.home-text048 {
  font-size: 14px;
}
.home-container033 {
  gap: 2px;
  display: flex;
  align-items: center;
}
.home-text049 {
  font-size: 14px;
  line-height: 1;
  padding-top: 1px;
}
.home-icon24 {
  width: 16px;
  height: 16px;
}
.home-stars-list-cont1 {
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  overflow: scroll;
  align-items: flex-start;
  flex-direction: column;
}
.home-stars-list-category1 {
  gap: 20px;
  width: 100%;
  display: flex;
  position: relative;
  align-items: flex-start;
  padding-top: 15px;
  padding-left: 10px;
  border-radius: 10px;
  padding-right: 10px;
  flex-direction: column;
  padding-bottom: 15px;
}
.home-stars-list-category-title1 {
  font-weight: bold;
}
.home-stars-list1 {
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
}
.home-star03 {
  gap: 4px;
  flex: 0 0 auto;
  width: 30%;
  display: flex;
  align-items: center;
  margin-bottom: 40px;
  flex-direction: column;
}
.home-profile-picture-cont03 {
  flex: 0 0 auto;
  width: auto;
  display: flex;
  position: relative;
  align-items: flex-start;
  flex-direction: column;
}
.home-image09 {
  width: 100px;
  object-fit: cover;
  border-radius: 5px;
}
.home-container034 {
    flex: 0 0 auto;
    width: auto;
    height: auto;
    text-overflow: ellipsis;
    width: 80%;
    overflow: hidden;
    text-align: center;
}
.home-star-display-name03 {
  font-weight: bold;
}
.home-container035 {
  flex: 0 0 auto;
  width: 100%;
  height: auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.home-text052 {
  font-size: 14px;
}
.home-container036 {
  gap: 2px;
  display: flex;
  align-items: center;
}
.home-text053 {
  font-size: 14px;
  line-height: 1;
  padding-top: 1px;
}
.home-icon27 {
  width: 16px;
  height: 16px;
}
.home-star04 {
  gap: 4px;
  flex: 0 0 auto;
  width: 30%;
  display: flex;
  align-items: center;
  margin-bottom: 20px;
  flex-direction: column;
}
.home-profile-picture-cont04 {
  flex: 0 0 auto;
  width: auto;
  display: flex;
  position: relative;
  align-items: flex-start;
  flex-direction: column;
}
.home-image10 {
  width: 100px;
  object-fit: cover;
  border-radius: 5px;
}
.home-container037 {
  flex: 0 0 auto;
  width: auto;
  height: auto;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}
.home-star-display-name04 {
  font-weight: bold;
}
.home-container038 {
  flex: 0 0 auto;
  width: 100%;
  height: auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.home-text056 {
  font-size: 14px;
}
.home-container039 {
  gap: 2px;
  display: flex;
  align-items: center;
}
.home-text057 {
  font-size: 14px;
  line-height: 1;
  padding-top: 1px;
}
.home-icon30 {
  width: 16px;
  height: 16px;
}
.home-star05 {
  gap: 4px;
  flex: 0 0 auto;
  width: 30%;
  display: flex;
  align-items: center;
  margin-bottom: 20px;
  flex-direction: column;
}
.home-profile-picture-cont05 {
  flex: 0 0 auto;
  width: auto;
  display: flex;
  position: relative;
  align-items: flex-start;
  flex-direction: column;
}
.home-image11 {
  width: 100px;
  object-fit: cover;
  border-radius: 5px;
}
.home-container040 {
  flex: 0 0 auto;
  width: auto;
  height: auto;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}
.home-star-display-name05 {
  font-weight: bold;
}
.home-container041 {
  flex: 0 0 auto;
  width: 100%;
  height: auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.home-text060 {
  font-size: 14px;
}
.home-container042 {
  gap: 2px;
  display: flex;
  align-items: center;
}
.home-text061 {
  font-size: 14px;
  line-height: 1;
  padding-top: 1px;
}
.home-icon33 {
  width: 16px;
  height: 16px;
}
.home-star06 {
  gap: 4px;
  flex: 0 0 auto;
  width: 30%;
  display: flex;
  align-items: center;
  margin-bottom: 40px;
  flex-direction: column;
}
.home-profile-picture-cont06 {
  flex: 0 0 auto;
  width: auto;
  display: flex;
  position: relative;
  align-items: flex-start;
  flex-direction: column;
}
.home-image12 {
  width: 100px;
  object-fit: cover;
  border-radius: 5px;
}
.home-container043 {
  flex: 0 0 auto;
  width: auto;
  height: auto;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}
.home-star-display-name06 {
  font-weight: bold;
}
.home-container044 {
  flex: 0 0 auto;
  width: 100%;
  height: auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.home-text064 {
  font-size: 14px;
}
.home-container045 {
  gap: 2px;
  display: flex;
  align-items: center;
}
.home-text065 {
  font-size: 14px;
  line-height: 1;
  padding-top: 1px;
}
.home-icon36 {
  width: 16px;
  height: 16px;
}
.home-star07 {
  gap: 4px;
  flex: 0 0 auto;
  width: 30%;
  display: flex;
  align-items: center;
  margin-bottom: 20px;
  flex-direction: column;
}
.home-profile-picture-cont07 {
  flex: 0 0 auto;
  width: auto;
  display: flex;
  position: relative;
  align-items: flex-start;
  flex-direction: column;
}
.home-image13 {
  width: 100px;
  object-fit: cover;
  border-radius: 5px;
}
.home-container046 {
  flex: 0 0 auto;
  width: auto;
  height: auto;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}
.home-star-display-name07 {
  font-weight: bold;
}
.home-container047 {
  flex: 0 0 auto;
  width: 100%;
  height: auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.home-text068 {
  font-size: 14px;
}
.home-container048 {
  gap: 2px;
  display: flex;
  align-items: center;
}
.home-text069 {
  font-size: 14px;
  line-height: 1;
  padding-top: 1px;
}
.home-icon39 {
  width: 16px;
  height: 16px;
}
.home-star08 {
  gap: 4px;
  flex: 0 0 auto;
  width: 30%;
  display: flex;
  align-items: center;
  margin-bottom: 20px;
  flex-direction: column;
}
.home-profile-picture-cont08 {
  flex: 0 0 auto;
  width: auto;
  display: flex;
  position: relative;
  align-items: flex-start;
  flex-direction: column;
}
.home-image14 {
  width: 100px;
  object-fit: cover;
  border-radius: 5px;
}
.home-container049 {
  flex: 0 0 auto;
  width: auto;
  height: auto;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}
.home-star-display-name08 {
  font-weight: bold;
}
.home-container050 {
  flex: 0 0 auto;
  width: 100%;
  height: auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.home-text072 {
  font-size: 14px;
}
.home-container051 {
  gap: 2px;
  display: flex;
  align-items: center;
}
.home-text073 {
  font-size: 14px;
  line-height: 1;
  padding-top: 1px;
}
.home-icon42 {
  width: 16px;
  height: 16px;
}
.home-star09 {
  gap: 4px;
  flex: 0 0 auto;
  width: 30%;
  display: flex;
  align-items: center;
  margin-bottom: 40px;
  flex-direction: column;
}
.home-profile-picture-cont09 {
  flex: 0 0 auto;
  width: auto;
  display: flex;
  position: relative;
  align-items: flex-start;
  flex-direction: column;
}
.home-image15 {
  width: 100px;
  object-fit: cover;
  border-radius: 5px;
}
.home-container052 {
  flex: 0 0 auto;
  width: auto;
  height: auto;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}
.home-star-display-name09 {
  font-weight: bold;
}
.home-container053 {
  flex: 0 0 auto;
  width: 100%;
  height: auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.home-text076 {
  font-size: 14px;
}
.home-container054 {
  gap: 2px;
  display: flex;
  align-items: center;
}
.home-text077 {
  font-size: 14px;
  line-height: 1;
  padding-top: 1px;
}
.home-icon45 {
  width: 16px;
  height: 16px;
}
.home-star10 {
  gap: 4px;
  flex: 0 0 auto;
  width: 30%;
  display: flex;
  align-items: center;
  margin-bottom: 20px;
  flex-direction: column;
}
.home-profile-picture-cont10 {
  flex: 0 0 auto;
  width: auto;
  display: flex;
  position: relative;
  align-items: flex-start;
  flex-direction: column;
}
.home-image16 {
  width: 100px;
  object-fit: cover;
  border-radius: 5px;
}
.home-container055 {
  flex: 0 0 auto;
  width: auto;
  height: auto;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}
.home-star-display-name10 {
  font-weight: bold;
}
.home-container056 {
  flex: 0 0 auto;
  width: 100%;
  height: auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.home-text080 {
  font-size: 14px;
}
.home-container057 {
  gap: 2px;
  display: flex;
  align-items: center;
}
.home-text081 {
  font-size: 14px;
  line-height: 1;
  padding-top: 1px;
}
.home-icon48 {
  width: 16px;
  height: 16px;
}
.home-star11 {
  gap: 4px;
  flex: 0 0 auto;
  width: 30%;
  display: flex;
  align-items: center;
  margin-bottom: 20px;
  flex-direction: column;
}
.home-profile-picture-cont11 {
  flex: 0 0 auto;
  width: auto;
  display: flex;
  position: relative;
  align-items: flex-start;
  flex-direction: column;
}
.home-image17 {
  width: 100px;
  object-fit: cover;
  border-radius: 5px;
}
.home-container058 {
  flex: 0 0 auto;
  width: auto;
  height: auto;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}
.home-star-display-name11 {
  font-weight: bold;
}
.home-container059 {
  flex: 0 0 auto;
  width: 100%;
  height: auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.home-text084 {
  font-size: 14px;
}
.home-container060 {
  gap: 2px;
  display: flex;
  align-items: center;
}
.home-text085 {
  font-size: 14px;
  line-height: 1;
  padding-top: 1px;
}
.home-icon51 {
  width: 16px;
  height: 16px;
}
.home-star12 {
  gap: 4px;
  flex: 0 0 auto;
  width: 30%;
  display: flex;
  margin-top: 0px;
  align-items: center;
  margin-bottom: 40px;
  flex-direction: column;
}
.home-profile-picture-cont12 {
  flex: 0 0 auto;
  width: auto;
  display: flex;
  position: relative;
  align-items: flex-start;
  flex-direction: column;
}
.home-image18 {
  width: 100px;
  object-fit: cover;
  border-radius: 5px;
}
.home-container061 {
  flex: 0 0 auto;
  width: auto;
  height: auto;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}
.home-star-display-name12 {
  font-weight: bold;
}
.home-container062 {
  flex: 0 0 auto;
  width: 100%;
  height: auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.home-text088 {
  font-size: 14px;
}
.home-container063 {
  gap: 2px;
  display: flex;
  align-items: center;
}
.home-text089 {
  font-size: 14px;
  line-height: 1;
  padding-top: 1px;
}
.home-icon54 {
  width: 16px;
  height: 16px;
}

.home-stars-profile-view{
  flex: 1;
  gap: 15px;
  width: 100%;
  height: 100%;
  display: flex;
  padding: 5px;
  overflow: auto;
  align-items: center;
  flex-direction: column;
  justify-content: flex-start;
}

.home-profile-details-container {
  gap: 10px;
  width: 100%;
  display: flex;
  padding: 0px;
  align-items: center;
  border-radius: 10px;
  flex-direction: column;
  justify-content: flex-start;
}
.home-profile-details {
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  padding: 10px;
  align-items: flex-start;
  border-radius: 10px;
  justify-content: space-between;
  gap: 10px;
}
.home-profile-picture-container {
  flex: 0 0 auto;
  width: 150px;
  height: 150px;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  box-shadow: 0 0 2px 0 rgba(0,0,0,0.3);
  border-radius: 5px;
}

.home-profile-data-container {
  flex: 1;
  width: 200px;
  overflow: hidden;
  display: flex;
  padding: 5px;
  align-self: stretch;
  align-items: flex-end;
  flex-direction: column;
  justify-content: space-between;
}
.home-display-name {
  font-size: 20px;
  font-weight: bold;
  text-wrap: nowrap;
  display: block;
  width: 100%;
  text-align: right;
  text-overflow: ellipsis;
  overflow: hidden;
}
.home-follow-container {
  flex: 0 0 auto;
  width: 100%;
  height: auto;
  display: flex;
  color: white;
  padding: 8px;
  align-items: center;
  border-radius: 10px;
  justify-content: center;
}

.home-text090 {
  font-weight: bold;
}
.home-container064 {
  gap: 2px;
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  align-items: flex-start;
}
.home-container065 {
  flex: 1;
  width: 100%;
  height: auto;
  display: flex;
  padding: 5px;
  align-items: flex-start;
  border-radius: 10px;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.home-text093 {
  color: #ffffff;
}
.home-container066 {
  flex: 1;
  width: 100%;
  display: flex;
  padding: 5px;
  align-items: flex-start;
  border-radius: 10px;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  gap: 10px;
}

.home-container066 svg{
  fill: white;
  width: 18px;
}

.home-text094 {
  color: #ffffff;
}
.home-text097 {
  font-size: 14px;
  text-align: center;
}
.home-profile-details-posts {
  gap: 10px;
  flex: 1;
  width: 100%;
  height: 100%;
  display: flex;
  overflow: hidden;
  flex-direction: column;
}
.home-text098 {
  font-weight: bold;
}
.home-container067 {
  width: 100%;
  height: 100%;
  overflow-y: scroll;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  max-height: 100%;
  align-content: flex-start;
}

.no-post{
  text-align: center;
  position: relative;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.home-container068 {
  width: 100%;
  height: auto;
  display: flex;
  flex-wrap: wrap;
  max-height: 100%;
  overflow-x: scroll;
  align-items: flex-start;
  border-color: var(--dl-color-gray-black);
  border-width: 1px;
  flex-direction: column;
}
.home-container069 {
  flex: 0 0 auto;
  width: calc(33.33% - 2px);
  aspect-ratio: 1/1;
  display: flex;
  justify-content: space-between;
  align-self: flex-start;
  align-items: flex-start;
  border-color: var(--theme-mid);
  margin: 1px;
  flex-direction: column;
}

.home-container070 {
  flex: 0 0 auto;
  width: 150px;
  height: 150px;
  display: flex;
  align-self: flex-start;
  align-items: flex-start;
  border-color: #ffffff;
  border-width: 1px;
  flex-direction: column;
  background-size: cover;
  background-image: url("public/playground_assets/davido-afrimma-1500h.jpg");
}
.home-container071 {
  flex: 0 0 auto;
  width: 150px;
  height: 150px;
  display: flex;
  align-self: flex-start;
  align-items: flex-start;
  border-color: #ffffff;
  border-width: 1px;
  flex-direction: column;
  background-size: cover;
  background-image: url("public/playground_assets/davido-post-1500h.jpg");
}
.home-container072 {
  flex: 0 0 auto;
  width: 150px;
  height: 150px;
  display: flex;
  align-self: flex-start;
  align-items: flex-start;
  border-color: #ffffff;
  border-width: 1px;
  flex-direction: column;
  background-size: cover;
  background-image: url("public/playground_assets/wizkid-post-1500w.jpg");
}
.home-container073 {
  flex: 0 0 auto;
  width: 150px;
  height: 150px;
  display: flex;
  align-self: flex-start;
  align-items: flex-start;
  border-color: #ffffff;
  border-width: 1px;
  flex-direction: column;
  background-size: cover;
  background-image: url("public/playground_assets/leaf-200h.jpg");
}
.home-container074 {
  flex: 0 0 auto;
  width: 150px;
  height: 150px;
  display: flex;
  align-self: flex-start;
  align-items: flex-start;
  border-color: #ffffff;
  border-width: 1px;
  flex-direction: column;
  background-size: cover;
  background-image: url("public/playground_assets/davido-200h.png");
}
.home-container075 {
  flex: 0 0 auto;
  width: 150px;
  height: 150px;
  display: flex;
  align-self: flex-start;
  align-items: flex-start;
  border-color: #ffffff;
  border-width: 1px;
  flex-direction: column;
  background-size: cover;
  background-image: url("public/playground_assets/burna-1500h.jpg");
}
.home-container076 {
  flex: 0 0 auto;
  width: 150px;
  height: 150px;
  display: flex;
  align-self: flex-start;
  align-items: flex-start;
  border-color: #ffffff;
  border-width: 1px;
  flex-direction: column;
  background-size: cover;
  background-image: url("public/playground_assets/wizkid-1500h.jpg");
}
.home-container077 {
  flex: 0 0 auto;
  width: 150px;
  height: 150px;
  display: flex;
  align-self: flex-start;
  align-items: flex-start;
  border-color: #ffffff;
  border-width: 1px;
  flex-direction: column;
  background-size: cover;
  background-image: url("public/playground_assets/wizkid-200h.webp");
}
.home-auction-details-view {
  gap: 10px;
  flex: 1;
  width: 100%;
  height: 100%;
  display: flex;
  padding: 5px;
  overflow: scroll;
  position: relative;
  box-sizing: border-box;
  align-items: center;
  flex-direction: column;
  justify-content: flex-start;
}

.auction-ended{
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap:  20px;
  opacity: 0.8;
  font-weight: bold;
}

.auction-ended .my-button{
  padding: 10px;
  border-radius: 10px;
}

.home-profile-details-container1 {
  gap: 10px;
  width: 100%;
  display: flex;
  align-items: center;
  padding-top: 0px;
  border-color: var(--theme-mid);
  border-width: 0px;
  padding-left: 0px;
  padding-right: 0px;
  flex-direction: column;
  padding-bottom: 20px;
  justify-content: flex-start;
  border-bottom-width: 1px;
}
.home-profile-details1 {
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  padding: 10px;
  align-items: flex-start;
  border-radius: 10px;
  justify-content: space-between;
}
.home-profile-picture-container1 {
  flex: 0 0 auto;
  width: 150px;
  height: 150px;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-profile-picture1 {
  width: 100%;
  object-fit: cover;
  border-radius: 10px;
}
.home-profile-data-container1 {
  flex: 1;
  width: 200px;
  display: flex;
  padding: 5px;
  align-self: stretch;
  align-items: flex-end;
  flex-direction: column;
  justify-content: space-between;
}
.home-display-name1 {
  font-size: 20px;
  font-weight: bold;
}
.home-follow-container1 {
  flex: 0 0 auto;
  width: 100%;
  height: auto;
  display: flex;
  padding: 8px;
  align-items: center;
  border-radius: 10px;
  justify-content: center;
}
.home-text099 {
  font-weight: bold;
}
.home-container078 {
  gap: 5px;
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  align-items: flex-start;
}
.share-auction-button{
    background: green;
    border-radius: 50%;
    padding: 5px;
 }

.share-auction-button svg{
    width: 20px;
    fill: white;
}

.home-container079 {
  flex: 1;
  width: 100%;
  display: flex;
  padding: 5px;
  align-items: flex-start;
  border-radius: 10px;
}
.home-text102 {
  color: #ffffff;
}
.home-text105 {
  font-size: 14px;
  text-align: center;
}
.home-auction-section {
  gap: 10px;
  flex: 1;
  width: 100%;
  display: flex;
  position: relative;
  align-items: flex-start;
  flex-direction: column;
}
.auction-countdown {
  gap: 5px;
  width: 100%;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}
.home-text106 {
  font-weight: bold;
}
.home-container081 {
  gap: 10px;
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}
.home-container082 {
  gap: 2px;
  display: flex;
  align-items: center;
  flex-direction: column;
}
.home-container083 {
  gap: 2px;
  display: flex;
  align-items: flex-start;
}
.home-text109 {
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
}
.home-container086 {
  gap: 2px;
  display: flex;
  align-items: center;
  flex-direction: column;
}
.home-container087 {
  gap: 2px;
  display: flex;
  align-items: flex-start;
}
.home-text114 {
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
}
.home-container090 {
  gap: 2px;
  display: flex;
  align-items: center;
  flex-direction: column;
}
.home-container091 {
  gap: 2px;
  display: flex;
  align-items: flex-start;
}
.home-text119 {
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
}

.event-details{
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  padding: 10px;
}

.event-details-title{
  font-weight: bold;
  margin-bottom: 10px;
}

.event-details-subcontainer{
  display: flex;
  flex-direction: row;
  gap: 10px;
  width: 100%;
  flex-wrap: wrap;
  justify-content: space-between;
  /* border: 1px red solid; */
}

.event-details-subcontainer-column{
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.event-details-item{
  /* width: 45%; */
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.event-details .item-name{
  font-size: 12px;
}

.bids-section {
  gap: 10px;
  flex: 1;
  width: 100%;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}

.place-bid-container {
  gap: 10px;
  flex: 1;
  width: 100%;
  display: flex;
  padding: 5px;
  align-items: center;
  flex-direction: column;
}

.home-text122 {
  font-weight: bold;
}

.place-bid-form{
  display: flex;
  flex-direction: column;
  width: 100%;
}

.home-container096 {
  flex: 0 0 auto;
  gap: 3px;
  width: 100%;
  display: flex;
  padding: 2px;
  position: relative;
  align-items: center;
  border-radius: 10px;
  flex-direction: column;
  background-color: var(--dl-color-success-300);
  border-bottom-left-radius: 11px;
  border-bottom-right-radius: 11px;
}

.home-text123 {
  color: #ffffff;
  font-size: 14px;
}

.bid-input-wrapper{
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
}

.home-textinput4 {
  width: 100%;
  padding-left: 16px;
  border-radius: 10px;
}

.bid-total{
  color: white;
  align-self: right;
  font-size: 14px;
}

.home-text124 {
  /* bottom: 2.5px; */
  left: 6px;
  /* margin-bottom: 0.2px; */
  position: absolute;
}

.place-bid-error{
  font-size: 13px;
  align-self: left;
  color: var(--error-color);
  margin: 4px 0 7px 5px;
}

.home-container097 {
  flex: 0 0 auto;
  width: 100%;
  height: auto;
  display: flex;
  padding: 5px;
  align-items: center;
  border-radius: 10px;
  flex-direction: column;
}

.anonymous{
  margin-top: 10px;
  margin-left: 0px;
  font-size: 14px;
  display: flex;
  gap: 5px;
  align-items: center;
}

.checkbox-wrapper{
  display: flex;
  padding: 2px;
  background: var(--theme-fore-light);
  border-radius: 2px;
}

.home-text126 {
  font-size: 14px;
}
.home-fan-bid-container {
  gap: 10px;
  flex: 1;
  width: 100%;
  display: flex;
  padding: 5px;
  align-items: flex-start;
  flex-direction: column;
}
.home-fan-bid {
  gap: 5px;
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  padding: 10px;
  align-items: flex-start;
  flex-direction: column;
}
.home-text127 {
  font-style: normal;
  font-weight: 600;
}
.home-container098 {
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.home-image19 {
  height: 40px;
}
.home-fan-bid1 {
  gap: 5px;
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text132 {
  font-style: normal;
  font-weight: 600;
}
.home-container100 {
  flex: 1;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.home-image20 {
  height: 40px;
}
.home-container102 {
  flex: 1;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.home-image21 {
  height: 40px;
}
.home-container104 {
  flex: 1;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.home-image22 {
  height: 40px;
}


.home-notifications-view {
  width: 100%;
  height: 100%;
}

.home-notifications-view > .main{
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
}

.notifications-scroll-view {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 5px;
  height: 100%;
}

.notifications-head, .profile-route-head {
  display: flex;
  width: 100%;
  flex-direction: row;
  align-items: center;
  gap: 10px;
  border-bottom: 1px var(--theme-back-light) solid;
  font-size: 20px;
  font-weight: bold;
  padding: 10px;
  position: relative;
}

.notifications-head-back-button, .profile-route-head-back-button {
  width: 30px;
  height: 30px;
}

.notifications-head-text, .profile-route-head-text {
  padding-top: 2px;
}

.notifications-scroll-view {
  width: 100%;
  height: 100%;
  overflow-y: scroll;
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.notification {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
  padding: 10px;
  font-size: 14px;
  flex-shrink: 0;
}

.notification-actor-head {
  width: 30px;
  height: 30px;
}

.notification-details {
  /* display: flex; */
  flex-direction: row;
  gap: 10px;
  align-items: center;
  height: min-content;
  width: 100%;
  overflow: hidden;
}

.notification-details div {
  height: min-content;
}

.notification-actor-handle {
  font-weight: bold;
}

.notification-object{
  font-weight: bold;
  overflow-wrap: break-word;
}

.notification-time {
  font-size: 12px;
  opacity: 0.7;
  white-space: nowrap;
}

.notification-action-button {
  padding: 7px;
  border-radius: 5px;
  font-weight: bold;
}

/* AUCTIONS VIEW */

.home-auctions-view {
  height: 100%;
  width: 100%;
}

.home-auctions-view > .main {
  height: 100%;
  width: 100%;
}

.auctions-scroll-view {
    height: 100%;
    width: 100%;
    display: flex;
    gap: 20px;
    padding: 10px;
    position: relative;
    overflow-y: scroll;
    align-items: flex-start;
    flex-direction: column;
}

.welcome-to-auctions {
  width: 100%;
  display: flex;
  padding: 10px;
  align-items: flex-start;
  border-radius: 10px;
  flex-direction: column;
}

.auctions-info.theme-fore-icon {
  width: 22px;
  height: 22px;
  position: absolute;
  right: 20px;
}

.home-text145 {
  width: 100%;
  text-align: center;
  font-weight: bold;
}

.home-ul {
  font-size: 14px;
  margin-top: 10px;
  padding-left: 0px;
  margin-bottom: 10px;
  padding-right: 0px;
  list-style-type: square;
  list-style-position: inside;
}

.auctions-login-button{
  padding: 5px 10px;
  border-radius: 5px;
}

.auctions-big-container{
    position: relative;
    width: 100%;
    padding: 10px;
    border-radius: 10px;
}

.home-auctions-search {
    width: 100%;
    display: flex;
    padding: 10px 0;
    align-items: center;
    flex-direction: column;
    justify-content: flex-start;
  }

.close-auction-search-result{
    position: absolute;
    right: 10px;
    top: 0px;
}

.close-auction-search-result svg{
    width: 22px;
}

.auctions-container {
    position: relative;
  gap: 15px;
  width: 100%;
  display: flex;
  padding: 0px;
  align-items: flex-start;
  flex-direction: column;
}

.auction-content{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.my-auction{
  width: 100%;
  padding: 10px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}

.create-auction-button{
  padding: 10px;
  border-radius: 5px;
  flex-shrink: 0;
  font-weight: bold;
}

.no-auction{
    padding: 10px;
    width: 100%;
}

.pop-leaderboard{
  position: absolute;
  bottom: 20px;
  right: 20px;
  width: 40px;
  border-radius: 50%;
  border: 2px rgba(200,150,0,1) solid;
  padding: 5px 7px 10px 7px;
  background-image: linear-gradient(45deg, black, rgba(255,200,0,1), black);
}

.pop-leaderboard svg{
  fill: var(--theme-back);
  stroke: var(--theme-back)
}

.create-auction-window, .leaderboard-window, .auctions-info-window{
  position: fixed;
  display: flex;
  justify-content: center;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 20px;
  opacity: 0;
  transition: 0.2s all linear;
  z-index: +2;
  overflow-y: scroll;
}

.blank-space{
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

.create-auction-window-form{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 5px;
  padding: 20px;
  border-radius: 10px;
  width: 90%;
  max-width: 500px;
  z-index: +1 ;
  margin: auto;
}

.create-auction-window-form .input-wrapper{
  display: flex;
  flex-direction: column;
  gap: 4px;
  width: 100%;
  position: relative;
  padding-bottom: 10px;
}

.create-auction-window-form .input-wrapper.row{
  flex-direction: row;
  align-items: center;
}

.create-auction-window-form .input-wrapper.row .input{
  width: 100%;
  flex: 1;
  align-items: center;
}

.create-auction-window-form .input{
  /* width: calc(100vw - 80px); */
  width: 100%;
  padding: 5px 10px;
}

.create-auction-window-form label{
  opacity: 0.7;
}
.create-auction-window-form button{
  width: 100%;
  padding: 10px;
  margin: 5px 0;
  border-radius: 5px;
}

.leaderboard-container {
  padding: 20px 0;
  border-radius: 10px;
  z-index: +1;
  max-height: 80vh;
  min-height: 430px;
  width: 90%;
  max-width: 500px;
  overflow-y: hidden;
  display: flex;
  flex-direction: column;
  margin: auto;
}

.leaderboard-title, .auctions-info-title {
  text-align: center;
  padding: 10px 20px 30px 20px;
  font-size: 22px;
  font-weight: bold;
}

.leaderboard-head {
  margin: 0 20px 10px 20px;
  display: flex;
  justify-content: space-around;
  background: var(--theme-mid);
  border-radius: 13px;
  padding: 5px;
  overflow: hidden;
  flex-shrink: 0;

}

.leaderboard-button {
  width: 100%;
  text-align: center;
  padding: 5px;
  transition: 0.2s all linear;
}

.leaderboard-head .swiper-button-disabled{
  background: var(--swiper-button-active);
  border-radius: 10px;
  box-shadow: 0 0 3px 0 rgba(0,0,0,0.4);
  font-weight: bold;
}

.leaderboard-body {
  overflow-y: scroll;
}

.leaderboard-body .swiper-slide {
  flex-direction: column;
  padding: 0 20px;
  height: auto;
}

.leaderboard-body-title {
  width: 100%;
  text-align: center;
  font-weight: bold;
  padding: 10px;
  margin: 20px 0;
}

.leaders-container {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding-bottom: 5px;
}

.leaderboard-failed {
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 20px;
    background-color: var(--theme-mid);
    border-radius: 10px;
}

.leader {
  display: flex;
  justify-content: space-between;
  padding: 20px 10px;
  border-radius: 10px;
  background-color: var(--theme-mid);
  position: relative;
  overflow: hidden;
  color: var(--theme-fore);
  font-weight: bold;
  text-shadow: 0 0 2px var(--theme-back);
  box-shadow: 0 0 5px 0 rgba(0,0,0,0.4);
  gap: 15px;
}

.leader.shine, .leader.shine2{
  height: 82px;
}

.leader > div {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.leader-username {
  width: 50%;
  flex: 1;
}

.leader-username > div {
  text-overflow: ellipsis;
  overflow: hidden;
  text-wrap: nowrap;
}

.leaderboard-trophy {
  width: 70px;
  height: 70px;
  background-image: url(assets/trophy.png);
  background-size: cover;
  position: absolute;
  right: 10px;
  top: 25px;
  transform: rotate(15deg);
}

.leader-badge {
  position: absolute;
  width: 100px;
  height: 16px;
  background-image: linear-gradient(353deg, transparent, rgba(255,220,0,0.5), rgba(255,220,0,0.5), transparent);
  transform: translate(-45%, -75%) rotate(-45deg);
  display: none !important;
}

.leader.gold {
  background-image: linear-gradient(145deg, var(--theme-back), rgba(255,220,0,0.3), var(--theme-back));
  border: 1px rgba(255,220,0,1) solid;
  background-color: var(--theme-back);
}

.leader.silver {
  background-image: linear-gradient(145deg, var(--theme-back), rgba(150,150,150,0.3), var(--theme-back));
  border: 1px silver solid;
}

.leader.bronze {
  background-image: linear-gradient(145deg, var(--theme-back), rgba(255,150,0,0.2), var(--theme-back));
  border: 1px rgba(255,150,0,1) solid;
}

.leaderboard-footer {
  padding: 20px 20px;
  font-size: 14px;
  text-align: center;
}

/* AUCTIONS INFO STARTS */

.auctions-info-container {
  padding: 20px 0;
  border-radius: 10px;
  z-index: +1;
  max-height: 80vh;
  overflow-y: hidden;
  display: flex;
  flex-direction: column;
}

.auctions-info-body {
  overflow-y: scroll;
  padding: 0 20px;
}

.auctions-info-body p {
  margin: 10px 0;
}

.auctions-info-body li {
  padding: 10px 2px;
}

.home-text156 {
  font-weight: bold;
}
.home-container108 {
  gap: 10px;
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  padding: 5px;
  align-items: flex-start;
  border-radius: 10px;
  flex-direction: row;
}
.home-container109 {
  gap: 5px;
  flex: 0 0 auto;
  width: 100px;
  display: flex;
  overflow: hidden;
  align-items: center;
  flex-direction: column;
}
.home-image23 {
  width: 70px;
  aspect-ratio: 1/1;
  background-position: center;
  background-size: cover;
  border-color: var(--dl-color-gray-black);
  border-width: 1px;
  border-radius: 10px;
}
.home-text157 {
  font-size: 14px;
  font-weight: bold;
  width: 100%;
  text-overflow: ellipsis;
  overflow: hidden;
  text-align: center;
}
.home-container110 {
  flex: 1;
  height: 85px;
  display: flex;
  flex-wrap: wrap;
  align-self: center;
  margin-top: 0px;
  align-items: flex-start;
  flex-direction: column;
  justify-content: space-between;
}
.home-container111 {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  min-width: 50%;
}
.home-text158 {
  font-size: 12px;
}
.home-text159 {
  font-size: 14px;
  font-weight: bold;
}
.home-container112 {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text162 {
  font-size: 12px;
}
.home-text163 {
  font-size: 14px;
  font-weight: bold;
}
.home-container113 {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text166 {
  font-size: 12px;
}
.home-text167 {
  font-size: 14px;
  font-weight: bold;
}
.home-container114 {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text170 {
  font-size: 12px;
}
.home-text171 {
  font-size: 14px;
  font-weight: bold;
}
.home-container115 {
  flex: 0 0 auto;
  width: 30px;
  display: flex;
  align-self: stretch;
  margin-top: -5px;
  align-items: center;
  margin-right: -5px;
  border-radius: 0px;
  margin-bottom: -5px;
  flex-direction: column;
  justify-content: center;
  background-color: var(--dl-color-success-300);
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}
.home-icon57 {
  fill: #ffffff;
  width: 24px;
  height: 24px;
}
.home-container116 {
  gap: 10px;
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  padding: 5px;
  align-items: flex-start;
  border-radius: 10px;
  flex-direction: row;
}
.home-container117 {
  gap: 5px;
  flex: 0 0 auto;
  width: 70px;
  display: flex;
  overflow: hidden;
  align-items: center;
  flex-direction: column;
}
.home-image24 {
  width: 100%;
  object-fit: cover;
  border-color: var(--dl-color-gray-black);
  border-width: 1px;
  border-radius: 10px;
}
.home-text174 {
  font-size: 14px;
  font-weight: bold;
}
.home-container118 {
  flex: 1;
  height: 70px;
  display: flex;
  flex-wrap: wrap;
  margin-top: 5px;
  align-items: center;
  margin-left: 10px;
  flex-direction: column;
  justify-content: space-between;
}
.home-container119 {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text177 {
  font-size: 12px;
}
.home-text178 {
  font-size: 14px;
  font-weight: bold;
}
.home-container120 {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text181 {
  font-size: 12px;
}
.home-text182 {
  font-size: 14px;
  font-weight: bold;
}
.home-container121 {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text185 {
  font-size: 12px;
}
.home-text186 {
  font-size: 14px;
  font-weight: bold;
}
.home-container122 {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text189 {
  font-size: 12px;
}
.home-text190 {
  font-size: 14px;
  font-weight: bold;
}
.home-container123 {
  flex: 0 0 auto;
  width: 30px;
  display: flex;
  align-self: stretch;
  margin-top: -5px;
  align-items: center;
  margin-right: -5px;
  border-radius: 0px;
  margin-bottom: -5px;
  flex-direction: column;
  justify-content: center;
  background-color: var(--dl-color-success-300);
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}
.home-icon59 {
  fill: #ffffff;
  width: 24px;
  height: 24px;
}
.home-container124 {
  gap: 10px;
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  padding: 5px;
  align-items: flex-start;
  border-radius: 10px;
  flex-direction: row;
}
.home-container125 {
  gap: 5px;
  flex: 0 0 auto;
  width: 70px;
  display: flex;
  overflow: hidden;
  align-items: center;
  flex-direction: column;
}
.home-image25 {
  width: 100%;
  object-fit: cover;
  border-color: var(--dl-color-gray-black);
  border-width: 1px;
  border-radius: 10px;
}
.home-text193 {
  font-size: 14px;
  font-weight: bold;
}
.home-container126 {
  flex: 1;
  height: 70px;
  display: flex;
  flex-wrap: wrap;
  align-self: flex-start;
  margin-top: 5px;
  align-items: center;
  flex-direction: column;
  justify-content: space-between;
}
.home-container127 {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text196 {
  font-size: 12px;
}
.home-text197 {
  font-size: 14px;
  font-weight: bold;
}
.home-container128 {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text200 {
  font-size: 12px;
}
.home-text201 {
  font-size: 14px;
  font-weight: bold;
}
.home-container129 {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text204 {
  font-size: 12px;
}
.home-text205 {
  font-size: 14px;
  font-weight: bold;
}
.home-container130 {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text208 {
  font-size: 12px;
}
.home-text209 {
  font-size: 14px;
  font-weight: bold;
}
.home-container131 {
  flex: 0 0 auto;
  width: 30px;
  display: flex;
  align-self: stretch;
  margin-top: -5px;
  align-items: center;
  margin-right: -5px;
  border-radius: 0px;
  margin-bottom: -5px;
  flex-direction: column;
  justify-content: center;
  background-color: var(--dl-color-success-300);
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}
.home-icon61 {
  fill: #ffffff;
  width: 24px;
  height: 24px;
}
.home-container132 {
  gap: 5px;
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  padding: 5px;
  align-items: flex-start;
  flex-direction: column;
}
.home-text212 {
  font-weight: bold;
}
.home-container133 {
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  align-items: flex-start;
  padding-top: 4px;
  padding-left: 10px;
  border-radius: 12px;
  padding-right: 10px;
  padding-bottom: 4px;
}
.home-textinput5 {
  flex: 1;
  width: 100%;
  font-size: 12px;
  border-radius: 10px;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  padding: 5px 10px;
}
.home-search-button1 {
  width: auto;
  height: auto;
  display: flex;
  align-self: stretch;
  min-height: 20px;
  align-items: center;
  padding-top: 5px;
  padding-left: 10px;
  border-radius: 5px;
  padding-right: 10px;
  padding-bottom: 5px;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.home-search1 {
  font-size: 14px;
}
.home-text215 {
  color: rgba(0, 0, 0, 0.45);
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
}
.home-container134 {
  gap: 15px;
  width: 100%;
  display: flex;
  padding: 0px;
  align-items: flex-start;
  flex-direction: column;
}
.home-text216 {
  font-weight: bold;
}
.home-container135 {
  gap: 10px;
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  padding: 5px;
  align-items: flex-start;
  border-radius: 10px;
  flex-direction: row;
}
.home-container136 {
  gap: 5px;
  flex: 0 0 auto;
  width: 70px;
  display: flex;
  overflow: hidden;
  align-items: center;
  flex-direction: column;
}
.home-image26 {
  width: 100%;
  object-fit: cover;
  border-color: var(--dl-color-gray-black);
  border-width: 1px;
  border-radius: 10px;
}
.home-text217 {
  font-size: 14px;
  font-weight: bold;
}
.home-container137 {
  flex: 1;
  height: 70px;
  display: flex;
  flex-wrap: wrap;
  align-self: flex-start;
  margin-top: 5px;
  align-items: center;
  flex-direction: column;
  justify-content: space-between;
}
.home-container138 {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text218 {
  font-size: 12px;
}
.home-text219 {
  font-size: 14px;
  font-weight: bold;
}
.home-container139 {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text222 {
  font-size: 12px;
}
.home-text223 {
  font-size: 14px;
  font-weight: bold;
}
.home-container140 {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text226 {
  font-size: 12px;
}
.home-text227 {
  font-size: 14px;
  font-weight: bold;
}
.home-container141 {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text230 {
  font-size: 12px;
}
.home-text231 {
  font-size: 14px;
  font-weight: bold;
}
.home-container142 {
  flex: 0 0 auto;
  width: 30px;
  display: flex;
  align-self: stretch;
  margin-top: -5px;
  align-items: center;
  margin-right: -5px;
  border-radius: 0px;
  margin-bottom: -5px;
  flex-direction: column;
  justify-content: center;
  background-color: var(--dl-color-success-300);
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}
.home-icon63 {
  fill: #ffffff;
  width: 24px;
  height: 24px;
}
.home-container143 {
  gap: 10px;
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  padding: 5px;
  align-items: flex-start;
  border-radius: 10px;
  flex-direction: row;
}
.home-container144 {
  gap: 5px;
  flex: 0 0 auto;
  width: 70px;
  display: flex;
  overflow: hidden;
  align-items: center;
  flex-direction: column;
}
.home-image27 {
  width: 100%;
  object-fit: cover;
  border-color: var(--dl-color-gray-black);
  border-width: 1px;
  border-radius: 10px;
}
.home-text234 {
  font-size: 14px;
  font-weight: bold;
}
.home-container145 {
  flex: 1;
  height: 70px;
  display: flex;
  flex-wrap: wrap;
  margin-top: 5px;
  align-items: center;
  margin-left: 10px;
  flex-direction: column;
  justify-content: space-between;
}
.home-container146 {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text237 {
  font-size: 12px;
}
.home-text238 {
  font-size: 14px;
  font-weight: bold;
}
.home-container147 {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text241 {
  font-size: 12px;
}
.home-text242 {
  font-size: 14px;
  font-weight: bold;
}
.home-container148 {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text245 {
  font-size: 12px;
}
.home-text246 {
  font-size: 14px;
  font-weight: bold;
}
.home-container149 {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text249 {
  font-size: 12px;
}
.home-text250 {
  font-size: 14px;
  font-weight: bold;
}
.home-container150 {
  flex: 0 0 auto;
  width: 30px;
  display: flex;
  align-self: stretch;
  margin-top: -5px;
  align-items: center;
  margin-right: -5px;
  border-radius: 0px;
  margin-bottom: -5px;
  flex-direction: column;
  justify-content: center;
  background-color: var(--dl-color-success-300);
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}
.home-icon65 {
  fill: #ffffff;
  width: 24px;
  height: 24px;
}
.home-container151 {
  gap: 10px;
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  padding: 5px;
  align-items: flex-start;
  border-radius: 10px;
  flex-direction: row;
}
.home-container152 {
  gap: 5px;
  flex: 0 0 auto;
  width: 70px;
  display: flex;
  overflow: hidden;
  align-items: center;
  flex-direction: column;
}
.home-image28 {
  width: 100%;
  object-fit: cover;
  border-color: var(--dl-color-gray-black);
  border-width: 1px;
  border-radius: 10px;
}
.home-text253 {
  font-size: 14px;
  font-weight: bold;
}
.home-container153 {
  flex: 1;
  height: 70px;
  display: flex;
  flex-wrap: wrap;
  align-self: flex-start;
  margin-top: 5px;
  align-items: center;
  flex-direction: column;
  justify-content: space-between;
}
.home-container154 {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text256 {
  font-size: 12px;
}
.home-text257 {
  font-size: 14px;
  font-weight: bold;
}
.home-container155 {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text260 {
  font-size: 12px;
}
.home-text261 {
  font-size: 14px;
  font-weight: bold;
}
.home-container156 {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text264 {
  font-size: 12px;
}
.home-text265 {
  font-size: 14px;
  font-weight: bold;
}
.home-container157 {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text268 {
  font-size: 12px;
}
.home-text269 {
  font-size: 14px;
  font-weight: bold;
}
.home-container158 {
  flex: 0 0 auto;
  width: 30px;
  display: flex;
  align-self: stretch;
  margin-top: -5px;
  align-items: center;
  margin-right: -5px;
  border-radius: 0px;
  margin-bottom: -5px;
  flex-direction: column;
  justify-content: center;
  background-color: var(--dl-color-success-300);
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}
.home-icon67 {
  fill: #ffffff;
  width: 24px;
  height: 24px;
}
.home-profile-view {
  flex: 1;
  width: 100%;
  height: 100%;
  overflow-y: hidden;
}

.home-profile-view > .main{
  gap: 10px;
  width: 100%;
  height: 100%;
  display: flex;
  overflow-y: hidden;
  align-items: flex-start;
  flex-direction: column; 
}

.children {
  width: 100%;
  height: 100%;
  position: absolute;
}

.my-profile-details{
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
}

.home-container159 {
  gap: 5px;
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  position: relative;
  align-items: center;
  padding-top: 30px;
  border-color: var(--theme-mid);
  border-width: 0px;
  padding-left: 10px;
  padding-right: 10px;
  flex-direction: column;
  padding-bottom: 30px;
  justify-content: center;
  border-bottom-width: 1px;
}
.home-container160 {
  top: 5px;
  right: 0px;
  width: 100%;
  height: auto;
  display: flex;
  padding: 10px;
  position: absolute;
  align-items: flex-start;
  justify-content: space-between;
}
.home-container161 {
  gap: 2px;
  flex: 0 0 auto;
  width: auto;
  height: auto;
  display: flex;
  align-items: flex-start;
}
.home-text272 {
  font-size: 14px;
}
.home-text273 {
  font-size: 14px;
  font-weight: bold;
}
.home-container162 {
  flex: 0 0 auto;
  height: auto;
  display: flex;
  align-items: flex-start;
  padding: 10px 15px;
  border-radius: 10px;
}

.home-container162.wide {
  min-width: 100%;
}
.home-text274 {
  font-size: 14px;
  font-weight:;
}
.home-container163 {
  width: 200px;
  height: 200px;
  display: flex;
  position: relative;
  align-items: center;
  justify-content: center;
}
.home-container164 {
  flex: 0 0 auto;
  display: flex;
  position: relative;
  align-items: flex-start;
  background-size: cover;
  background-position: center center;
}
.home-image29 {
  width: 100%;
  object-fit: contain;
}
.home-container165 {
  right: 10px;
  bottom: 10px;
  display: flex;
  padding: 5px;
  position: absolute;
  align-items: center;
  border-color: var(--dl-color-gray-black);
  border-width: 1px;
  border-radius: 10px;
  justify-content: center;
  background-color: #D9D9D9;
}

.select-profile-picture{
  width: 30px;
  height: 30px;
  position: absolute;
  opacity: 0.0001;
}

.label-for-profile-picture-input{
  line-height: 0;
}

.home-icon69 {
  width: 24px;
  height: 24px;
}
.home-container166 {
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  align-items: center;
  flex-direction: column;
}

.share-my-profile {
  position: absolute;
  bottom: 15px;
  right: 15px;
  width: 25px;
}

.home-container167 {
  gap: 100px;
  flex: 0 0 auto;
  display: flex;
  align-items: flex-start;
}
.home-container168 {
  gap: 5px;
  flex: 0 0 auto;
  width: auto;
  height: auto;
  display: flex;
  align-items: center;
}
.home-icon71 {
  width: 24px;
  height: 24px;
}
.home-container169 {
  gap: 5px;
  flex: 0 0 auto;
  width: auto;
  height: auto;
  display: flex;
  align-items: center;
}
.home-icon76 {
  width: 24px;
  height: 24px;
}
.home-container170 {
  gap: 15px;
  flex: 1;
  width: 100%;
  height: 100%;
  display: flex;
  padding: 10px;
  overflow-y: scroll;
  touch-action: pan-y;
  align-items: flex-start;
  flex-direction: column;
}

.home-container171{
  width: 100%;
}

.profile-details-buttons {
  display: flex;
  flex-direction: row;
  margin: 8px 0;
  gap: 10px;
  padding: 0 10px;
  color: white;
}

.profile-details-create-post-button {
  padding: 8px;
  background: green;
  text-align: center;
  font-weight: bold;
  width: 100%;
  border-radius: 10px;
}

.contact-support {
  background: orange;
  border-radius: 10px;
  flex-shrink: 0;
  padding: 8px;
  font-weight: bold;
}

.profile-details-logout-button {
  color: red;
  font-weight: bold;
  padding: 8px;
  border-radius: 10px;
  width: min-content;
  font-weight: bold;
  font-size: larger;
}

.profile-view-routes {
  font-weight: bold;
  gap: 7px;
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  align-items: center;
  flex-direction: row;
  justify-content: space-between;
  padding: 10px;
}

.profile-view-routes svg {
  width: 20px;
  height: 20px;
  opacity: 0.6;
}

.home-text279 {
  font-weight: bold;
}
.home-container172 {
  flex: 0 0 auto;
  width: 100%;
  height: auto;
  display: flex;
  padding: 10px;
  align-items: flex-start;
  border-radius: 10px;
}
.home-container173 {
  gap: 7px;
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text281 {
  font-weight: bold;
}
.home-container174 {
  gap: 15px;
  flex: 0 0 auto;
  width: 100%;
  height: auto;
  display: flex;
  padding: 8px 10px;
  border-radius: 10px;
  justify-content: space-between;
  align-items: center;
  overflow: hidden;
}

.profile-email {
  width: 100%;
  text-overflow: ellipsis;
  overflow: hidden;
}

.verify-email {
  background: green;
  color: white;
  padding: 3px 8px;
  border-radius: 5px;
  font-weight: bold;
  flex-shrink: 0;
}

.email-verified{
  color: green;
  padding: 3px 0px;
  font-weight: bold;
  flex-shrink: 0;
}

.home-container175 {
  gap: 7px;
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text285 {
  font-weight: bold;
}
.home-container176 {
  flex: 0 0 auto;
  width: 100%;
  height: auto;
  display: flex;
  padding: 10px;
  align-items: flex-start;
  border-radius: 10px;
}
.home-container177 {
  gap: 7px;
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text287 {
  font-weight: bold;
}
.home-container178 {
  flex: 0 0 auto;
  width: 100%;
  height: auto;
  display: flex;
  padding: 10px;
  align-items: flex-start;
  border-radius: 10px;
}
.home-container179 {
  gap: 7px;
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text289 {
  font-weight: bold;
}
.home-container180 {
  flex: 0 0 auto;
  width: 100%;
  height: auto;
  display: flex;
  padding: 10px;
  align-items: flex-start;
  border-radius: 10px;
}
.home-container181 {
  gap: 7px;
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.home-text291 {
  font-weight: bold;
}
.home-container182 {
  flex: 0 0 auto;
  width: 100%;
  height: auto;
  display: flex;
  padding: 10px;
  align-items: flex-start;
  border-radius: 10px;
}
.home-container183 {
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  padding: 10px;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}
.home-text293 {
  color: var(--dl-color-danger-500);
  font-weight: bold;
}

.upload-profile-picture-window{
  position: fixed;
  height: 100%;
  width: 100%;
 bottom: 0px;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  transition: 0.2s all linear;
  z-index: +2;
  overflow: scroll;
  padding: 20px;
}

.upload-profile-picture-window .blank-space{
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: -1;
}

.upload-profile-picture-body{
  width: 80vw;
  /* height: 80Vw; */
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: auto;
}

.temp-profile-picture{
  width: 100%;
  height: 80vw;
  background-color: black;
  border-radius: 10px 10px 0 0;
  background-size: cover;
  background-position: center center;
}

.change-profile-picture-button{
  width: 100%;
  padding: 10px;
}

.upload-profile-picture-button{
  width: 100%;
  padding: 10px;
  border-radius: 0 0 10px 10px;
  font-weight: bold;
}

.pending-transactions-window, .transaction-history-window{
  position: fixed;
  height: 100%;
  width: 100%;
 bottom: 0px;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  transition: 0.2s all linear;
  z-index: +2;
}

.pending-transactions-window .blank-space, .transaction-history-window .blank-space{
  z-index: -1;
}

.pending-transactions-body, .transaction-history-body{
  width: 90%;
  max-width: 600px;
  display: flex;
  flex-direction: column;
  align-items: center ;
  gap: 25px;
  border-radius: 10px;
  padding: 20px;
}

.pending-transactions-title, .transaction-history-title{
  font-size: 20px;
  font-weight: 600;
}

.pending-transactions-description, .transaction-history-description, .withdrawal-description{
  width: 100%;
  text-align: center;
  font-size: 14px;
}

.withdrawal-description-column{
  display: block;
}

.withdrawal-description-row{
  display: none;
}

.pending-transactions, .transaction-histories{
  display: flex;
  flex-direction: column;
  gap: 15px;
  width: 100%;
  max-height: 50vh;
  overflow-y: scroll;
  overscroll-behavior: contain;
}

.pending-transaction, .transaction-history{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 10px;
  border-radius: 10px;
  width: 100%;
}

.tx-credit{
  color: var(--color-credit);
}

.tx-debit{
  color: var(--color-debit);
}

.pt-button{
  min-width: 40px;
  padding: 8px 5px;
  border-radius: 5px;
}

.add-funds-window, .withdraw-funds-window{
  position: fixed;
  height: 100%;
  width: 100%;
 bottom: 0px;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  transition: 0.2s all linear;
  z-index: +2;
  padding: 20px;
  overflow-y: scroll;
}

.add-funds-window .blank-space, .withdraw-funds-window .blank-space{
  z-index: -1;
}

.add-funds-body, .withdraw-funds-body{
  width: 90%;
  max-width: 600px;
  display: flex;
  flex-direction: column;
  margin: auto;
}

.add-funds-column-group, .withdraw-funds-column-group {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 25px;
  border-radius: 10px;
  padding: 20px;
  width: 100%;
}


.add-funds-title, .withdraw-funds-title{
  font-size: 20px;
  font-weight: 600;
}

.add-funds-inputs-row, .withdraw-funds-inputs-row{
  display: flex;
  width: 100%;
  flex-direction: row;
  gap: 10px;
  height: 40px;
  align-items: center;
}

.input-group.currency{
  width: auto;
}

.add-funds-input, .withdraw-funds-input{
  height: 100%;
  width: 100%;
  flex: 1;
  padding: 10px;
}

.add-funds-input.currency, .withdraw-funds-input.currency{
  width: auto;
}

.input-group{
    display: flex;
    flex-direction: column;
  height: 100%;
  width: 100%;
  position: relative;
}

.funds-window-error-inline{
    font-size: 12px;
    padding-top: 5px;
    color: red;
}

.account-name-loading{
    position: absolute;
    right: 10px;
    width: 30px;
    height: 100%;
    display: flex;
    align-items: center;
}


.add-funds-button, .withdraw-funds-button{
  padding: 10px;
  border-radius: 10px;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.withdraw-funds-button.disabled{
    opacity: 0.5;
}

.add-funds-demacator{
    width: 100%;
    height: 2px;
}

.info-window{
  position: fixed;
  display: flex;
  flex-direction: column;
  justify-content: center;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 20px;
  opacity: 0;
  transition: 0.2s all linear;
  z-index: +2;
}

.info-window-container {
  padding: 20px 0;
  border-radius: 10px;
  z-index: +1;
  max-height: 80vh;
  overflow-y: hidden;
  display: flex;
  flex-direction: column;
}

.info-window-title {
  text-align: center;
  padding: 10px 20px 30px 20px;
  font-size: 22px;
  font-weight: bold;
}

.info-window-body {
  overflow-y: scroll;
  padding: 0 20px;
}

.infow-window-body p {
  margin: 10px 0;
}

.my-profile-posts, .my-profile-personal-details{
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.my-profile-posts-head{
}

.my-profile-posts-title, .my-profile-personal-details-title{

}

.my-profile-personal-details-body{
  width: 100%;
  height: 100%;
  padding: 10px 15px;
  display: flex;
  flex-direction: column;
  align-items: center;
  overflow-y: scroll;
  gap: 10px;
}

.my-profile-posts-body{
  height: 100%;
  width: 100%;
  flex: 1;
  overflow-y: scroll;
  touch-action: pan-y;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-content: flex-start;
  flex-wrap: wrap;
}

.my-profile-posts-post{
  width: 33%;
  aspect-ratio: 1;
  margin:0 0 0.25vw 0.25vw;
}

.add-post-btn{
  position: absolute;
  bottom: 20px;
  right: 20px;
  padding: 10px;
  border-radius: 50%;
  box-shadow: 0 0 4px 0 rgba(0,0,0,0.3);
}

.add-post-icon{
  fill: green;
  width: 20px;
  height: 20px;
  margin: 0;
  vertical-align: top;
}

.my-profile-aande{
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.my-profile-aande-head{
  /* box-shadow: 0 2px 3px 0 rgba(0,0,0,0.4); */
}

.my-profile-aande-title{

}

.my-profile-aande-buttons{
  width: 95%;
  font-size: 18px;
  font-weight: bold;
  display: flex;
  flex-direction: row;
  border-radius: 13px;
  margin: 10px 0 0px 0;
  padding: 5px;
  background-color: var(--theme-mid);
}

.my-profile-aande-button{
    padding: 5px 10px;
    width: 100%;
    text-align: center;
    border-radius: 10px;
    transition: 0.2s all linear;
}


.my-profile-aande-button.swiper-button-disabled{
    box-shadow: 0 0 5px 0 rgba(0,0,0,0.3);
    background-color: var(--swiper-button-active);
}

.active {
    padding: 5px 10px;
    width: 100%;
    text-align: center;
    border-radius: 10px;
    box-shadow: 0 0 5px 0 rgba(0,0,0,0.3);
}

.my-profile-aande-body{
  height: 100%;
  flex: 1;
  /* overflow-y: scroll; */
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-content: flex-start;
  flex-wrap: wrap;
}

.my-profile-auctions, .my-profile-events{
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.my-profile-auctions-head, .my-profile-events-head{
  padding: 0px 0;
}

.my-profile-auctions-description, .my-profile-events-description{
  padding: 15px 10px;
  font-size: 14px;
  text-align: center;
  border-bottom: 1px rgba(0,0,0,0.3) solid;
}

.my-profile-auctions-body, .my-profile-events-body{
  height: 100%;
  flex: 1;
  overflow-y: scroll;
  touch-action: pan-y;
  display: flex;
  flex-direction: column;
  /* justify-content: space-around; */
  /* align-content: flex-start; */
  /* border: 1px red solid; */
  /* flex-wrap: wrap; */
}

.my-profile-aande-category{
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 10px 0;
}

.my-profile-aande-category-title{
  font-weight: bold;
  font-size: 16px;
  padding: 0 10px 10px 10px;
  width: 100%;
  text-align: center;
  border-bottom: 2px rgba(0,0,0,0.4) solid;
}

.my-profile-aande-category-body{
  /* border: 1px red solid; */
  width: 100%;
  padding: 0 10px 20px 10px;
}

.my-profile-aande-subcategory{
  display: flex;
  flex-direction: column;
  width: 100%;
  /* border: 1px blue solid; */
}

.my-profile-aande-subcategory-title{
  font-weight: bold;
  padding: 10px;
}

.my-profile-aande-subcategory-body{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 3%;
  min-height: 40px;
  width: 100%;
}

.my-profile-aande-subcategory-body .no-item{
  width: 100%;
  padding: 10px;
  border-radius: 5px;
  align-self: flex-start;
}

.my-profile-aande-item{
  display: flex;
  flex-direction: column;
  width: 31%;
  padding: 10px 5px;
  align-items: center;
  border-radius: 5px;
  gap: 10px;
  margin-bottom: 10px;
  font-size: 14px;
  box-shadow: 0 0 3px 0 rgba(0,0,0,0.3);
}

.aande-creator{
  font-weight: 600;

}

.aande-details-row{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  width: 100%;
  gap: 10px;
}

.aande-winner-column{
  display: flex;
  flex-direction: column;
  align-items: center;
}

.aande-winner-title{
  font-size: 12px;
}

.aande-top-bid-column{
  display: flex;
  flex-direction: column;
  align-items: center;
}

.aande-top-bid-title{
  font-size: 12px;
}

.meeting-complain {
  background: red;
  color: white;
  padding: 5px 10px;
  width: 100%;
  text-align: center;
  border-radius: 5px;
}

.aande-category-demacator{
  width: 100%;
  padding: 10px;
}

.profile-view-nav-button{
    position: absolute;
    top: calc(50% - 15px);
    width: 30px;
    border-radius: 50%;
    z-index: +1;
}

.profile-view-nav-button.swiper-button-disabled{
    display: none;
}

.profile-view-nav-button.left{
    left: 10px;
}

.profile-view-nav-button.right{
    right: 10px;
}

.profile-view-nav-button svg{
    fill: var(--theme-fore-light)
}

/*PROFILE VIEW ENDS*/

/* REPORT EVENT STARTS */

.report-event-window {
  position: fixed;
  height: 100%;
  width: 100%;
  bottom: 0px;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  transition: 0.2s all linear;
  z-index: +2;
}

.report-event-window .blank-space {
  z-index: -1;
}

.report-event-body {
  width: 90%;
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 10px;
}

.report-event-title {
  padding: 10px 0 0 0;
  text-align: center;
  font-weight: bold;
  font-size: 20px;
}

.report-event-input {
  display: flex;
  flex-direction: column;
  padding: 0 10px;
  gap: 20px;
}

.report-event-input-text {
  font-size: 18px;
}

input#starAbsent {
  position: absolute;
  opacity: 0.00001;
  z-index: -1;
}


.report-event-input-buttons {
  display: flex;
  justify-content: space-around;
}

.report-event-input-buttons div {
  border-radius: 10px;
  padding: 10px 20px;
  background: var(--theme-mid);
}

input#starAbsent:checked + .report-event-input-buttons .report-event-yes {
  background: green;
}

input#starAbsent:not(:checked) + .report-event-input-buttons .report-event-no {
  background: red;
}

textarea#reportEventAdditionalNote {
  margin: 0 10px;
  padding: 10px;
  border-radius: 5px;
  background: var(--theme-back-light);
  border: none;

}

textarea#reportEventAdditionalNote:focus {
  outline: 2px var(--theme-fore-light) solid;
}

.report-event-submit-button {
  margin: 10px;
  background: red;
  color: white;
  padding: 10px;
  text-align: center;
  font-weight: bold;
  border-radius: 5px;
}

/* VIDEO CALL START */

.video-call{
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  z-index: +2;
  /* display: none; */
}

.close-video-call{
  position: absolute;
  top: 10px;
  right: 10px;
}

.close-video-call svg{
  fill: white;
  height: 35px;
  width: 35px;
  z-index: +1;
}

.video-call-timer {
  position: absolute;
  left: 50%;
  top: 10px;
  background: var(--theme-fore-light);
  color: white;
  padding: 4px;
  border-radius: 5px;
  transform: translateX(-50%);
  transition: 0.3s all linear;
  width: 60px;
  font-size: 14px;
  white-space: nowrap;
  overflow: hidden;
  text-align: center;
}

.video-call-at-end{
  width: 250px
}

.video-call-ended{
    width: 10px;
    height: 10px;
    border-radius: 10px;
    left: 20px;
    top: 15px;
}

.video-call-window{
  position: fixed;
  height: calc(100%);
  width: 100%;
  bottom: 0; /*49px;*/
  left: 0;
  background-color: rgba(0,0,0,0.7);
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  transition: 0.2s all linear;
  z-index: +1;
}

.video-call-window .blank-space{
  z-index: -1;
}


.video-call-body{
  width: 90%;
  display: flex;
  flex-direction: column;
  align-items: center ;
  /* gap: 25px; */
  border-radius: 10px;
  padding: 20px;
  position: relative;
}


#videoContainer{
  position: fixed;
  top: 0;
  height: 100%;
  width: 100%;
  z-index: -1;
  /* background: black; */
  display: flex;
  justify-content: center;
}

#videosdk-frame{
  z-index: +1;
}

.video-frame:not(.mini){
  height: 100%;
  border: 2px red solid;
  
}

.mini{
  position: absolute;
    right: 20px;
    bottom: 20px;
    width: 30%;
}

.no-display-audio{
  display: none;
}


/* MAKE POST SECTION */
.home-make-post-view {
  flex: 1;
  width: 100%;
  height: 100%;
  display: flex;
  padding: 0px;
  align-items: flex-start;
  flex-direction: column;
  overflow: scroll;
}

.home-container184 {
  flex: 0 0 auto;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}

.home-make-post-head {
  width: 100%;
  height: 50px;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  position: relative;
}

.head-back-btn{
  position: absolute;
  left: 10px;
  height: 100%;
  display: flex;
  align-items: center;
}

.head-back-icon{
  height: 60%;
  vertical-align: top;
}

.home-text296 {
  width: 100%;
  height: auto;
  padding: 10px;
  text-align: center;
  font-weight: bold;
}
.home-make-post-body {
  gap: 20px;
  flex: 1;
  width: 100%;
  height: 100%;
  display: flex;
  padding: 10px;
  align-items: center;
  flex-direction: column;
  overflow-y: scroll;
  overflow-x: hidde;
}
.home-container185 {
  flex: 0 0 auto;
  width: 100%;
  height: calc(100vw - 10px);
  display: flex;
  align-items: center;
  border-style: groove;
  border-width: 2px;
  flex-direction: column;
  justify-content: center;
  position: relative;
  overflow: hidden;

  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

.select-media-span{
  position: relative;
}


.post-upload-preview{
  flex: 0 0 auto;
  width: 100%;
  height: 100px;
  display: flex;
  flex-direction: row;
  overflow-x: scroll;
  overflow-y: visible;
}

.post-upload-preview-item{
  position: relative;
  height: 80px;
}

.post-upload-preview .image{
  height: 80px;
  width: 80px;
  border: 1px black solid;
  margin: 0 5px;

  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}


.cancel-icon{
    position: absolute;
    left: 50%;
    bottom: 0px;
    transform: translate(-50%, 50%);
    width: 25px;
    height: 25px;
    opacity: 0.5;
}

.cancel-icon svg{
  width: 100%;
  height: 100%;
}

.home-container186 {
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.post-caption-group{
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.home-textarea {
  width: 100%;
  transition: 0.3s;
  border-width: 0px;
  border-radius: 0px;
  background-color: transparent;
  border-bottom-width: 1px;
}
.home-textarea:focus {
  outline: none;
}

.upload-progress-bar{
  height: 2px;
  background: green;
  width: 0%;
  position: relative;
  transition: 0.3s all linear;
}

.upload-percent{
  position: absolute;
  top: 3px;
  right: 0;
  font-size: 12px;
}

.home-button1 {
  font-weight: bold;
}
.home-navbar {
  flex: 0 0 auto;
  width: 100%;
  height: 50px;
  display: flex;
  position: fixed;
  bottom: 0;
  align-items: flex-start;
  border-width: 0px;
  flex-direction: row;
  border-top-width: 1px;
  z-index: +1;
  margin-bottom: var(--foot-offset);
}

.home-navbar-alt{
	flex: 0 0 auto;
	width: 100%;
	height: 50px;
	display: flex;
	position: relative;
	align-items: flex-start;
	flex-direction: row;
    margin-bottom: var(--foot-offset);
    z-index: -1;

}
.home-container187 {
  flex: 1;
  height: 100%;
  display: flex;
  min-width: 50px;
  align-self: stretch;
  align-items: center;
  justify-content: center;
}
.home-icon78 {
  width: 24px;
  height: 24px;
}
.home-container188 {
  flex: 1;
  height: 100%;
  display: flex;
  min-width: 50px;
  align-items: center;
  justify-content: center;
}
.home-icon80 {
  width: 24px;
  height: 24px;
}
.home-container189 {
  flex: 1;
  height: 100%;
  display: flex;
  min-width: 50px;
  align-items: center;
  justify-content: center;
}
.home-icon82 {
  width: 24px;
  height: 24px;
}
.home-container190 {
  flex: 1;
  width: auto;
  height: 100%;
  display: flex;
  min-width: 50px;
  align-items: center;
  justify-content: center;
}
.home-icon84 {
  width: 24px;
  height: 24px;
}
.home-container191 {
  flex: 1;
  width: auto;
  height: 100%;
  display: flex;
  min-width: 50px;
  align-items: center;
  justify-content: center;
}
.home-icon86 {
  width: 24px;
  height: 24px;
}

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

  /* Home */

  .home-container{
    flex-direction: row-reverse;
  }

  .home-container001 {
    width: auto;
    height: 100%;
    flex: 1;
  }

  .home-navbar-alt {
    flex: 0 0 auto;
    width: 50px;
    height: 100%;
  }

  .home-navbar {
    width: 50px;
    height: 100%;
    top: 0;
    left: 0;
    flex-direction: column;
    border-top-width: 0px;
    border-left-width: 1px;
  }


  /* STARS VIEW */

  .home-star{
    width: 17.7%;
  }

  /* Profile View*/

  .my-profile-details{
    flex-direction: row;
  }

  .home-container163 {
    aspect-ratio: 1;
  }

  .profile-details-buttons {
    flex-direction: column;
    justify-content: flex-end;
  }

  .upload-profile-picture-body{
    width: auto;
    height: 80vh;
  }

  .home-container159{
    flex: 1;
  }

  .home-container170{
    /* justify-content: space-between; */
  }

  .add-funds-body, .withdraw-funds-body{
    flex-direction: row;
  }

  .add-funds-group{
    width: 100%;
    flex: 1;
  }

  .add-funds-demacator {
    width: 2px;
    height: auto;
}

  .add-funds-other-options{
    width: 250px;
  }

  .withdrawal-description-column{
    display: none;
  }

  .withdrawal-description-row{
    display: block;
  }

  .my-profile-posts-post {
    width: 24.6%;
  }
  

  /* Make Post View */

  .home-make-post-body {
    flex-direction: row;
  }

  .home-container185 {
    width: auto;
    height: 80%;
    aspect-ratio: 1;
  }

  .post-upload-preview {
    flex-direction: column;
    justify-content: center;
    height: 100%;
    width: 100px;
    overflow-y: scroll;
    overflow-x: visible;
  }

  .cancel-icon {
    top: 50%;
    right: 0px;
    left: auto;
    transform: translate(0%, -50%);
  }

  .post-caption-group{
    display: flex;
    flex-direction: column;
    flex: 1;
  }

  .home-container186 {
    flex: 1;
  }

  .home-button1{
    width: 100%;
  }

  /* STARS PROFILE VIEW */

  .home-stars-profile-view{
    flex-direction: row;
  }

  .home-profile-details-container {
    justify-content: flex-start;
    width: 50%;
    height: 100%;
    flex-shrink: 0;
  }

  .home-profile-details-posts {
    flex: 1;
  }

  .home-container069 {
    width: calc(50% - 2px);
  }

  /* AUCTION DETAILS VIEW */

  .home-auction-details-view{
    flex-direction: row;
  }

  .home-profile-details-container1 {
    height: 100%;
    width: 50%;
    padding-right: 5px;
    overflow-y: scroll;
    border-right-width: 1px;
    border-bottom-width: 0;
  }

  .home-auction-section {
    height: 100%;
    overflow-y: scroll;
    padding-top: 10px;
  }

  /* POSTS VIEW */
  .home-post .swiper {
    max-height: 95vh;
  }

}

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

  /* PROFILE VIEW */

  .my-profile-posts-post {
    width: 19.6%;
  }

  /* STARS PROFILE VIEW */

  .home-container069 {
    width: calc(33.33% - 2px);
  }
}