/*****
* Your Project's styles goes here
*****/
    :root{

      --primary-bg: #fe6601;
      --sec: #FF5733;
      --dark: #14171A;
      --gray: #657786;
      --lightgray: #AAB8C2;
      --lightergray: #E1E8ED;
      --lightestgray: #F5F8FA;
      --icon: #657786;
        --svg-eye-open: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjMyIiBoZWlnaHQ9IjMyIj4gPHBhdGggZD0iTTEyIDRDNCA0IDEgMTIgMSAxMkMxIDEyIDQgMjAgMTIgMjBDMjAgMjAgMjMgMTIgMjMgMTJDMjMgMTIgMjAgNCAxMiA0IHogTSAxMiA3QzE0Ljc2MSA3IDE3IDkuMjM5IDE3IDEyQzE3IDE0Ljc2MSAxNC43NjEgMTcgMTIgMTdDOS4yMzkgMTcgNyAxNC43NjEgNyAxMkM3IDkuMjM5IDkuMjM5IDcgMTIgNyB6IE0gMTIgOSBBIDMgMyAwIDAgMCA5IDEyIEEgMyAzIDAgMCAwIDEyIDE1IEEgMyAzIDAgMCAwIDE1IDEyIEEgMyAzIDAgMCAwIDEyIDkgeiIgZmlsbD0iIzIxMjUyOWJmIiAvPjwvc3ZnPg==");
  --svg-eye-close: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjMyIiBoZWlnaHQ9IjMyIj48cGF0aCBkPSJNNC4yMDcwMzEyIDIuNzkyOTY4OEwyLjc5Mjk2ODggNC4yMDcwMzEyTDUuMDc2MTcxOSA2LjQ5MDIzNDRDMi4xOTkzNDQ3IDguODM4MjAwNSAxIDEyIDEgMTJDMSAxMiA0IDIwIDEyIDIwQzE0LjA3NTU2OCAyMCAxNS44MDYwMDMgMTkuNDU0NzMgMTcuMjQyMTg4IDE4LjY1NjI1TDE5Ljc5Mjk2OSAyMS4yMDcwMzFMMjEuMjA3MDMxIDE5Ljc5Mjk2OUw0LjIwNzAzMTIgMi43OTI5Njg4IHogTSAxMiA0QzEwLjc4OCA0IDkuNzA1Nzk2OSA0LjE5OTcxODcgOC43MTY3OTY5IDQuNTExNzE4OEwxMS4yNzczNDQgNy4wNzIyNjU2QzExLjUxNDM0NCA3LjAzNzI2NTYgMTEuNzUzIDcgMTIgN0MxNC43NjEgNyAxNyA5LjIzOSAxNyAxMkMxNyAxMi4yNDcgMTYuOTYyNzM0IDEyLjQ4NTY1NiAxNi45Mjc3MzQgMTIuNzIyNjU2TDIwLjM1NzQyMiAxNi4xNTIzNDRDMjIuMjA0NDIyIDE0LjEwMjM0NCAyMyAxMiAyMyAxMkMyMyAxMiAyMCA0IDEyIDQgeiBNIDcuODMzOTg0NCA5LjI0ODA0NjlMOS4yOTY4NzUgMTAuNzEwOTM4QzkuMTA4MTU5NSAxMS4xMDA4MjkgOSAxMS41MzY1NjYgOSAxMkM5IDEzLjY1NyAxMC4zNDMgMTUgMTIgMTVDMTIuNDYzNDM0IDE1IDEyLjg5OTE3MSAxNC44OTE4NCAxMy4yODkwNjIgMTQuNzAzMTI1TDE0Ljc1MTk1MyAxNi4xNjYwMTZDMTMuOTYyMDM5IDE2LjY4OTc1OCAxMy4wMTkyNzEgMTcgMTIgMTdDOS4yMzkgMTcgNyAxNC43NjEgNyAxMkM3IDEwLjk4MDcyOSA3LjMxMDI0MTUgMTAuMDM3OTYxIDcuODMzOTg0NCA5LjI0ODA0NjkgeiIgZmlsbD0iIzIxMjUyOWJmIiAvPjwvc3ZnPg==");
      
    }
        	@media only screen and (max-width: 767.98px) {
        		.header .header-left .logo{
        			padding-right: 100rem !important;
        		}

        		.header-left .logo.logo-small {
				    display: inline-block;
				}
        	}
        





.btn-toggle-password-visibility {
  width: 24px;
  height: 24px;
  background-image: var(--svg-eye-close);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
}



.form-group:has(input:not([type="password"])) .btn-toggle-password-visibility {
  background-image: var(--svg-eye-open);
}


.lightestgray-bg{
  background: var(--lightestgray);
}
.lightergray-bg{

  background: var(--lightergray);

}
.text-red{
  color:red;
}
.light-btn{
background: var(--lightergray) !important;
border-radius: 5px;
font-size: 12px;
}
.light-text{
  color: var(--lightgray);
}
.end-clearfix{
  height: 80px;
}
.table-img{
  width: 28px;
  height: 28px;
  border-radius: 100%;
  object-fit: cover;
}
/*
.bg{
background: rgba(255, 255, 255, 0.9);
box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
backdrop-filter: blur(5px);
-webkit-backdrop-filter: blur(5px);
}*/
.side-nav{
  position: fixed;
  right:5px;
  top:10px;
  z-index: 100;
}
.search-box{
  background: var(--lightestgray);
  padding: 15px;
  width:100%;
  border-radius: 50px;
  margin-top: 10px;
}
.search-box input{
  outline:none;
  background: transparent;
  border:none;
  width:100%;
}
.fixed-top{
  position: fixed;
  left:0;
  top:0;
  width:100%;
}
  .app-nav{
    padding: 10px;
  }
  .chat-nav .nav-image{
    height: 30px;
    width:30px;
    border-radius: 100%;
    position: relative;
    top:-2px;
    margin-right: 5px;
    display: inline-block;
    object-fit: cover;
  }
  .chat-nav .back-btn{
    position: relative;
    bottom:-3px;
  }
  .page-container{
    margin-top:80px
  }
  
.yform{
  margin-bottom: 15px;
}
.yform textarea{
  resize: none;
  height: 100px;
}
  .yform label{
    display: block;
    padding-bottom:5px;
  }
  .yinput{
    border:1px solid var(--lightergray);
    padding: 12px;
    border-radius:5px;
    outline: none;
    display: block;
    width:100%;
    
  }
  .yinput.error{
    border:1px solid red;
  }

  .select-container{
    height: 100%;
    width:100%;
    position: fixed;
    left: 0;
    top:0;
   display: none;
   z-index: 1;
   overflow: auto;
  }
  
  .select-data img{
    height: 40px;
    width:40px;
    border:3px solid var(--lightestgray);
    border-radius: 5px;
    object-fit: cover;
  }
.block{
  display: block;
}
.nav-link.active{
  color: var(--primary);
  background: #fff !important;
}
.top-nav{
  padding: 15px 15px 15px 10px;
}
.min-hround{
  border-radius: 10px !important;
}
.auth-logo{
  height: 100px;
}
.top-nav span{
  font-size:18px;
  font-weight: 600;
  display: block;
}
.top-nav .avatar{
  height: 45px;
  width:45px;
  border-radius: 100%;
  float:right;
  object-fit: cover;
}
.top-nav .logo{
  height: 35px;
  width:35px;
}
.category-card .category-header{
  padding: 2px 15px;
}
.category-header span{
  font-weight: 500;
  font-size:18px;
  display: inline-block;
}


  .app-footer a{
    display: block;
    color: var(--icon);
    padding: 10px;
  }
  .app-footer a.active{
    color: var(--primary);
  }

  .category-content{
  height: 250px;
  
  }
  .category-meta{
    padding:5px;
  }

  .cover-img img{
    height: 180px;
    width:100%;
    border-radius: 10px 10px 0px 0px;
    object-fit: cover;
  }
.bmBtn{
  position: relative;
  top:-5px;
  color: var(--lightgray);

}

  div.scrollmenu {
  background-color: #fff;
  overflow: auto;
  white-space: nowrap;
  padding-left: 15px;
}

div.scrollmenu a {
  display: inline-block;
  background-color: var(--lightestgray);
  color: var(--dark);
  text-align: center;
  font-size: 12px;
  padding: 5px 10px;
  text-decoration: none;
  border-radius: 25px;
}

div.scrollmenu a:hover {
  background-color: var(--lightestgray);
}
div.scrollmenu a.active{
  background: var(--primary);
  color:#fff;
  font-weight: bold;
}
.scrollmenu img{
  height: 25px;
  border-radius: 5px;
}
.scrollmenu .layout{
  display: inline-block;
}

.nobar::-webkit-scrollbar {
  display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.nobar {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}
.bookmarkCount{
  
  font-weight: 600;
  position: relative;
  left:-10px;
  
}
.post-list-layout{
  border:1px solid var(--lightergray);
  padding: 15px;
  border-radius: 25px;
  margin-top:15px;
  position: relative;
}
.post-list-layout .thumbnail{
  height: 110px;
  width:100%;
  object-fit: cover;
  border-radius: 15px;
  border: 4px solid var(--lightergray);
}
.post-list-layout .avatar{
  height: 25px;
  width:25px;
  border-radius: 100%;
}
.post-list-layout .profile-row{
  margin-top:10px;
  color:var(--gray);
  line-height: 1em;
}
.post-list-layout .brand-name{
  font-size:12px;
}
.post-list-layout .post-location{
  font-size: 10px;
}
.post-list-layout .bookmark{
  position: absolute;
  right:5px;
  bottom:2px;
}
.post-list-layout .label{
  padding: 2px;
  border-radius: 2px;
  text-align: center;
  font-size: 10px;
  border:1px solid var(--lightergray);
  color:var(--lightgray);
  position: absolute;
  right:10px;
  top:-25px;
  background: #fff;
}
.profile-list-layout{
  height: 150px;
  width:100%;
  border: 1px solid #fff;
  position: relative;
}
.profile-list-layout .thumbnail{
  height: 100%;
  width: 100%;
  object-fit: cover;
}
.profile-list-layout .model{
  width:100%;
  position: absolute;
  left: 0;
  color: #000;
  bottom:0;
  padding: 5px;
  font-size:10px;
  
}
.ycard{

  border:1px solid var(--lightergray);

  border-radius: 15px;
  padding: 15px;
  margin-bottom: 15px;
}
.ycard .title{
  font-size:16px;
  margin: 0px !important;
  padding: 0px !important;
  font-weight: 800;
  line-height: 1.6em;
}
.profile-row img{
  height: 40px;
  width:40px;
  border-radius: 100%;
}
.text-svg{
  position: relative;
  top:-1px;
}
.slide-template{
  margin-top:50px;
  height: 300px;
  width:100%;
  background: var(--lightergray);
}
.slide-template .swipe-img img{
  height: 300px;
  width:100%;
  object-fit: cover;
}
  .swipe-img a{
    display: none;
  }
  .swipe-img a:first-child{
    display: block;
  }
  .abs-wrapper{
    position:relative ;
    top:-50px;
    background: #fff;
    height: 100vh;
    border-radius: 15px;
    padding-top:10px;
  }
  .details-wrapper #location, #csrf,#category, #price,#youtube_link,#description{
    display:none;
  }
  .details-wrapper .label{
    font-size:13px;
    color:var(--lightgray);
    margin-bottom:10px;
  }
  .btn-round{
    border-radius: 25px !important;
  }
#search-bar{
  z-index: 50;
}
.message-box{
position: fixed;
width: 100%;
bottom:0;
left: 0;
padding: 10px;
background:#fff ;
}
.message-box .input-box{
  outline: none;
  resize: none;
  
  padding: 10px;
  border:1px solid var(--lightergray);
  height: 40px;
  border-radius: 20px;
  width:100%;
  
}
.chat-container{
  padding: 10px;
}
.chat.out .chat-plate{
  background: var(--primary);
  color:#fff;
  padding: 10px;
  
  border-radius: 25px 25px 0px 25px;
  margin-top: 10px;
}
.chat-container img{
  max-height:250px;
  max-width:100%;
  border-radius: 15px;
  object-fit: cover;
}
.chat{
  
}


.chat-plate.in .msg-box{
  background: var(--primary);
  color:#fff;
  padding: 10px;
  display: block;
  border-radius: 25px 25px 0px 25px;
 max-width: 80%;
 
    float: right;
  margin-top: 10px;
}
 .text-meta small{
  font-size: 12px;
  color: var(--gray);
}

#prv{
  height: 35px;
  width:35px;
  position: absolute;
  border-radius: 5px;
  z-index: 100;
  border:thin solid var(--lightestgray);
  object-fit: cover;
  
}
.message-list{
  margin-bottom: 25px;
}
.message-list img{
  height: 40px;
  width:40px;
  border-radius: 100%;
  display: block;
  margin-right: 10px;
}
.message-list .name{
  font-size: 15px;
  font-weight: 600;
}
.message-list .time{
  font-size:12px;
  color: var(--gray);
}
.unread-bg span{
  display: inline-block;
  background: var(--primary);
  padding: 2px;
  text-align: center;
  color: #fff;
  border-radius: 100%;
  min-height: 20px;
  min-width:20px;
  font-size: 10px;
}
.sticker-container{
  height: 200px;
  overflow: auto;
  text-align: center;
  width: 100%;
}
.sticker-container div{
  margin-bottom: 20px;
}
.sticker-container img{
  height: 50px;
  width: 50px;

}
.profile-header img{
  height: 80px;
  width:80px;
  border-radius:100%;
  object-fit: cover;
}
.edit-profile-wrapper{
  background: #fff;
  position: fixed;
  top:0;
  left: 0;
height: 100%;
width: 100%;
z-index: 100;
overflow: auto;
display: none;
}
.edit-profile-wrapper .prv-btn{
  height: 80px;
  width:80px;
  border-radius: 100%;
  margin: 0 auto;
  position: relative;
  background: #000;
}
.edit-profile-wrapper .prv-btn svg{
  position: absolute;
  left:35%;
  top:35%;
}
.edit-profile-wrapper .avatar-preview{
  height: 80px;
  width:80px;
  border-radius:100%;
  opacity: .5;
  object-fit: cover;
}
.edit-profile-wrapper .update-profile-btn{
  position: fixed;
  right:10px;
  top:15px;
  z-index: 100;
}
.settings-list .sitem{
  display: block;
  padding: 15px;
  border-bottom: thin solid var(--lightergray);
  color:#000;
}
.follow-class{
  background: var(--primary) !important;
  color: #fff !important;
  padding-right:25px;
  padding-left: 25px;
}
.review-btn{
  position: fixed;
  bottom:0;
  text-align: center;
  padding: 15px;
  width: 100%;
  left: 0;
  border-radius:25px 25px 0px 0px;
  
}
.reviews-card{
  border:1px solid var(--lightergray);
  border-radius: 15px;
  padding: 10px;
  width:100%;
  margin-bottom: 10px;
}
.reviews-card img{
  height: 40px;
  width: 40px;
  border-radius: 100%;
}
.reviews-card .meta .name{
  font-weight: 600;
  display: block;
}
.reviews-card .meta .username{
  font-size: 12px;
  color: var(--lightgray);
  display: block;
}
.ct-margin{
  margin-top:140px;
}
.post-status{
  position: absolute;
  top:0; 
  left: 0;
  padding: 5px;
  font-size: 12px;
}
.post-status span{
  background: var(--primary);
  color: #fff;
  padding:2px 5px;
  border-radius: 5px;
}
.select-body{
  margin-top:120px;
}
      
.shimmer-line {
    height: 10px;
    margin-top: 20px;
    background: #777;
}

.shimmer-line-br {
    border-radius: 8px;
}
.shimmer-line {
    height:100px;
    width:100%;
}

.shimmer-circle {
    background: #777;
    border-radius: 50%;
}

.shimmer-wrapper {
    width:100%;
    height:100%;
    animation: shimmer-full-view 0.5s forwards cubic-bezier(0.250, 0.460, 0.450, 0.940);
}

@keyframes shimmer-full-view {
    0% {
        background-position: -1000px 0;
    }
    100% {
        background-position: 1000px 0;
    }
}

@keyframes shimmer-animation {
    0% {
        background-position: -1000px 0;
    }
    100% {
        background-position: 1000px 0;
    }
}

.shimmer-animate {
    animation : shimmer-animation 2s infinite linear;
    background: linear-gradient(to right, #eff1f3 4%, #e2e2e2 25%, #eff1f3 36%);
    background-size: 1000px 100%;
}
.bg{
  background-color: #ffffff7d;   
        
        backdrop-filter: blur(33px);
        background-blend-mode: overlay;
        
  
}

.bg-shadow{
  box-shadow: 0 10px 15px rgb(0 0 0 / 20%);
}