/* google fonts */
@import url('https://fonts.googleapis.com/css2?family=Wix+Madefor+Display:wght@400..800&display=swap');
/* google fonts */

@font-face {
  font-family: 'Domaine Sans Display';
  src: url('../Font/DomaineSansDisplay-ExtraboldItalic.woff2') format('woff2'),
      url('../Font/DomaineSansDisplay-ExtraboldItalic.woff') format('woff');
  font-weight: bold;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Display';
  src: url('../Font/DomaineSansDisplay-Light.woff2') format('woff2'),
      url('../Font/DomaineSansDisplay-Light.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Display';
  src: url('../Font/DomaineSansDisplay-Bold.woff2') format('woff2'),
      url('../Font/DomaineSansDisplay-Bold.woff') format('woff');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Display';
  src: url('../Font/DomaineSansDisplay-LightItalic.woff2') format('woff2'),
      url('../Font/DomaineSansDisplay-LightItalic.woff') format('woff');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Display';
  src: url('../Font/DomaineSansDisplay-Black.woff2') format('woff2'),
      url('../Font/DomaineSansDisplay-Black.woff') format('woff');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Display';
  src: url('../Font/DomaineSansDisplay-BlackItalic.woff2') format('woff2'),
      url('../Font/DomaineSansDisplay-BlackItalic.woff') format('woff');
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Display';
  src: url('../Font/DomaineSansDisplay-Medium.woff2') format('woff2'),
      url('../Font/DomaineSansDisplay-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Display';
  src: url('../Font/DomaineSansDisplay-Extrabold.woff2') format('woff2'),
      url('../Font/DomaineSansDisplay-Extrabold.woff') format('woff');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Display';
  src: url('../Font/DomaineSansDisplay-BoldItalic.woff2') format('woff2'),
      url('../Font/DomaineSansDisplay-BoldItalic.woff') format('woff');
  font-weight: bold;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Display';
  src: url('../Font/DomaineSansDisplay-MediumItalic.woff2') format('woff2'),
      url('../Font/DomaineSansDisplay-MediumItalic.woff') format('woff');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Fine';
  src: url('../Font/DomaineSansFine-Bold.woff2') format('woff2'),
      url('../Font/DomaineSansFine-Bold.woff') format('woff');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Fine';
  src: url('../Font/DomaineSansFine-Black.woff2') format('woff2'),
      url('../Font/DomaineSansFine-Black.woff') format('woff');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Display';
  src: url('../Font/DomaineSansDisplay-Semibold.woff2') format('woff2'),
      url('../Font/DomaineSansDisplay-Semibold.woff') format('woff');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Display';
  src: url('../Font/DomaineSansDisplay-RegularItalic.woff2') format('woff2'),
      url('../Font/DomaineSansDisplay-RegularItalic.woff') format('woff');
  font-weight: normal;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Display';
  src: url('../Font/DomaineSansDisplay-Regular.woff2') format('woff2'),
      url('../Font/DomaineSansDisplay-Regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Display';
  src: url('../Font/DomaineSansDisplay-SemiboldItalic.woff2') format('woff2'),
      url('../Font/DomaineSansDisplay-SemiboldItalic.woff') format('woff');
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Display';
  src: url('../Font/DomaineSansDisplay-Thin.woff2') format('woff2'),
      url('../Font/DomaineSansDisplay-Thin.woff') format('woff');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Fine';
  src: url('../Font/DomaineSansFine-Extrabold.woff2') format('woff2'),
      url('../Font/DomaineSansFine-Extrabold.woff') format('woff');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Fine';
  src: url('../Font/DomaineSansFine-BoldItalic.woff2') format('woff2'),
      url('../Font/DomaineSansFine-BoldItalic.woff') format('woff');
  font-weight: bold;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Fine';
  src: url('../Font/DomaineSansFine-BlackItalic.woff2') format('woff2'),
      url('../Font/DomaineSansFine-BlackItalic.woff') format('woff');
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Display';
  src: url('../Font/DomaineSansDisplay-ThinItalic.woff2') format('woff2'),
      url('../Font/DomaineSansDisplay-ThinItalic.woff') format('woff');
  font-weight: 100;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Fine';
  src: url('../Font/DomaineSansFine-Regular.woff2') format('woff2'),
      url('../Font/DomaineSansFine-Regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Fine';
  src: url('../Font/DomaineSansFine-RegularItalic.woff2') format('woff2'),
      url('../Font/DomaineSansFine-RegularItalic.woff') format('woff');
  font-weight: normal;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Fine';
  src: url('../Font/DomaineSansFine-Semibold.woff2') format('woff2'),
      url('../Font/DomaineSansFine-Semibold.woff') format('woff');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Fine';
  src: url('../Font/DomaineSansFine-Light.woff2') format('woff2'),
      url('../Font/DomaineSansFine-Light.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Fine';
  src: url('../Font/DomaineSansFine-SemiboldItalic.woff2') format('woff2'),
      url('../Font/DomaineSansFine-SemiboldItalic.woff') format('woff');
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Fine';
  src: url('../Font/DomaineSansFine-ExtraboldItalic.woff2') format('woff2'),
      url('../Font/DomaineSansFine-ExtraboldItalic.woff') format('woff');
  font-weight: bold;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Fine';
  src: url('../Font/DomaineSansFine-MediumItalic.woff2') format('woff2'),
      url('../Font/DomaineSansFine-MediumItalic.woff') format('woff');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Fine';
  src: url('../Font/DomaineSansFine-Medium.woff2') format('woff2'),
      url('../Font/DomaineSansFine-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Domaine Sans Fine';
  src: url('../Font/DomaineSansFine-LightItalic.woff2') format('woff2'),
      url('../Font/DomaineSansFine-LightItalic.woff') format('woff');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}


/* Custom fonts */
html,
body,
div,
span,
h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
strong,
i,
ol,
ul,
li,
form,
label,
footer,
header,
menu,
nav,
section {
  margin: 0;
  padding: 0;
}

ol,
ul {
  list-style: none;
}

a {
  text-decoration: none;
}

button:focus,
a:focus,
input:focus,
textarea:focus,
select:focus {
  outline: none;
}


:root {
  --text-white: #fff;
  --text-yellow: #C39D42;
  --text-bg-gradient: rgba(255, 255, 255, 0.56);
  --Domaine: 'Domaine Sans Fine';
}

body {
  box-sizing: border-box;
  overflow-x: hidden;
  scroll-behavior: smooth;
  font-family: "Wix Madefor Display", sans-serif;
  background: #000000;
}
body::-webkit-scrollbar{
  display: none;
}

main {
  overflow-x: hidden;
}
#TermsCondition {
  accent-color: var(--text-yellow);
}
/* ============================
     Common Navbar Start Hare
  ==============================
*/

.navbar--wrapper{
  padding: 36px 0;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 11111;
}
.navbar--main--wrapper{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.navbar--logo{
  width: 40px;
  height: 71px;
}
.navbar--logo svg{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.navbar--item--wrapper{
  padding: 10px 8px;
  border-radius: 100px;
  border: 1px solid rgba(255, 255, 255, 0.10);
  background: rgba(44, 43, 42, 0.35);
  backdrop-filter: blur(5px);
  width: fit-content;
}
.navbar--item--wrapper ul{
  display: flex;
  gap: 57px;
  align-items: center;
}
.navbar--item--wrapper ul li a{
  padding: 12px 15px;
  color: #E2DDDB;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  border-radius: 50px;
  display: flex;
  align-items: center;
  gap: 6px;
  transition: all linear 0.3s;
}
.navbar--item--wrapper ul li a:hover{
  background-color: var(--text-yellow);
  color: #2C2B2A;
}
.navbar--item--wrapper ul li a:hover svg{
  fill: #2C2B2A ;
}
.navbar--menu{
  padding: 0px 14px 0px 27px;
  width: fit-content;
  border-radius: 27px;
  border: 1px solid rgba(255, 255, 255, 0.20);
  display: flex;
  align-items: center;
  gap: 30px;
  cursor: pointer;
  transition: all linear 0.3s;
}
.navbar--menu:hover{
  background: rgba(44, 43, 42, 0.35);
  backdrop-filter: blur(5px);
}
.menu--humburger--Icon{
  width: 24px;
  height: 24px;
}
.menu--humburger--Icon svg{
  width: 100%;
  height: 100%;
  object-fit: cover;
}





/* ============================
     Common Navbar End Hare
  ==============================
*/












/* ===== :: Main Menu Start Hare :: ==== */
.main--menu--wrapper{
  position: fixed;
  left: 0;
  top: 0;
  visibility: hidden;
  -webkit-transition: .4s;
  -o-transition: .4s;
  transition: .4s;
}

.main--menu--wrapper:before {
  position: absolute;
  content: '';
  right: 0;
  top: 0;
  background: rgba(0, 0, 0, .8);
  -webkit-backdrop-filter: blur(27.5px);
  backdrop-filter: blur(27.5px);
  -webkit-transition: -webkit-clip-path .5s;
  transition: clip-path .5s;
  -o-transition: clip-path .5s;
  transition: clip-path .5s, -webkit-clip-path .5s;
  -webkit-clip-path: circle(0% at 100% 0);
  clip-path: circle(0% at 100% 0);
}
.main--menu--wrapper, .main--menu--wrapper:before {
  z-index: -1;
  width: 100%;
  height: 100%;
}


.main--menu--wrapper.show {
  visibility: visible;
  -webkit-transition: linear;
  -o-transition: linear;
  transition: linear;
  z-index: 2200000001;
}
.main--menu--wrapper.show:before {
  -webkit-transition: -webkit-clip-path .7s;
  transition: clip-path .7s;
  -o-transition: clip-path .7s;
  transition: clip-path .7s, -webkit-clip-path .7s;
  -webkit-clip-path: circle(141.4% at 100% 0);
  clip-path: circle(141.4% at 100% 0);
}



.main--menu--wrapper .main--menu--wrapper--inner {
  overflow-y: auto;
  height: 100%;
  width: 100%;
  visibility: hidden;
  opacity: 0;
  transition: ease-in 0.2s;
}

.main--menu--wrapper .main--menu--wrapper--inner.show {
  visibility: visible;
  opacity: 1;
}


.main--menu--wrapper--top--header{
  padding: 70px 150px 0 150px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.close--btn{
  padding: 20px;
  border-radius: 50%;
  border: 1px solid #FFF;
  width: fit-content;
  display: flex;
  justify-content: center;
  cursor: pointer;
  transition: all linear 0.3s;
}
.close--btn:hover{
  background: var(--text-yellow);
  border: 1px solid #C39D42;
}

.main--menu--items--wrapper{
  display: flex;
  justify-content: center;
  align-items: center;
}
.main--menu--wrapper--items{
  margin-top: 50px;
  display: flex;
  flex-direction: column;
  gap: 40px;
  justify-content: center;
  align-items: center;
}
.main--menu--items ul{
  display: flex;
  flex-direction: column;
  gap: 40px;
  align-items: center;
}
.main--menu--items ul li a{
  transition: all linear 0.3s;
  position: relative;
}
.main--menu--items ul li a::after {
  position: absolute;
  content: '';
  height: 4px;
  width: 40%;
  background-color: var(--text-yellow);
  bottom: -10px;
  left: 0;
  transition: all linear 0.3s;
}
.main--menu--items ul li a:hover{
  color: var(--text-yellow);

}
.main--menu--items ul li a:hover::after{
  width: 100%;
}
.nav--menu--textss{
  color: #F2F2F2;
  font-size: 36px;
  font-weight: 600;
  letter-spacing: 0.72px;
  text-transform: uppercase;
}

.main--menu--item--social--links ul{
  display: flex;
  column-gap: 48px;
  align-items: center;
}
.social--icon--linkdin{
  width: 24px;
  height: 24px;
}
.social--icon--linkdin svg{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.nav--menu--textss.logOutBtn{
  background: transparent;
  border: none;
}

.ProfilePic--name{
  color: #FFF;
  font-size: 30px;
  font-style: normal;
  font-weight: 800;
  line-height: 38px;
  letter-spacing: -0.39px;
}
/* ===== :: Main Menu End Hare :: ==== */









/* common styles Start hare */

.sign--in--heading--text{
  color: var(--text-white);
  font-size: 48px;
  font-weight: 600;
  line-height: 64px;
}
.sign--in--pera--text{
  color: var(--text-bg-gradient);
  font-size: 24px;
  font-weight: 400;
  line-height: normal;
}

.signIn--form--texts{
  color: #FFF;
  font-size: 32px;
  font-weight: 500;
}

.email--address--texts{
  color: var(--text-bg-gradient);
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}
.passDirectionText{
  color: var(--text-bg-gradient);
  font-size: 14px;
  font-weight: 400;
  line-height: normal;
}

.signIn--Btn{
  display: flex;
  width: fit-content;
  height: 64px;
  padding: 20px 53px 21px 53px;
  justify-content: center;
  align-items: center;
  border-radius: 40px;
  background: var(--text-yellow);
  color: var(--text-white);
  text-align: center;
  font-size: 18px;
  font-weight: 500;
    border: none;
}
.menuText{
  color: var(--text-white);
  text-align: center;
  font-size: 16px;
  font-weight: 300;
  line-height: 50px;
}


.pageHeading{
  color: var(--text-white);
  font-family: var(--Domaine);
  font-size: 70px;
  font-style: normal;
  font-weight: 400;
  line-height: 70px;
  text-transform: uppercase;
}
.subHeading{
  color: var(--text-white);
  text-align: center;
  font-family: var(--Domaine);
  font-size: 40px;
  font-style: normal;
  font-weight: 300;
  line-height: 44px;
}

.learn--moreBtn{
  width: fit-content;
  padding: 16px 64px;
  border-radius: 50px;
  border: 1px solid var(--text-yellow);
  display: flex;
  justify-content: center;
  align-items: center;
  color: #E2DDDB;
  font-size: 18px;
  font-weight: 500;
  line-height: 24px;
}

.register--Btn{
  width: fit-content;
  padding: 16px 64px;
  border-radius: 50px;
  border: 1px solid var(--text-yellow);
  background: var(--text-yellow);
  color: var(--text-white);
  font-size: 18px;
  font-weight: 500;
  line-height: 24px;
}

.timeSectionSub{
  color: #E2DDDB;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 27px;
}
.duration--text{
  color: var(--text-white);
  font-size: 24px;
  font-weight: 500;
  line-height: 24px;
}
.duration--time--headerss--italic{
  color: var(--text-yellow);
  font-family: var(--Domaine);
  font-size: 16px;
  font-style: italic;
  font-weight: 400;
  line-height: 24px;
}

.duration--day--text--italic{
  color: #FFF;
  font-family: var(--Domaine);
  font-size: 40px;
  font-style: italic;
  font-weight: 400;
  line-height: normal;
}
.StudioAndLuxey--Texts{
  color: #FFF;
  font-size: 30px;
  font-weight: 700;
  line-height: 40px;
  letter-spacing: -0.3px;
  text-transform: uppercase;
}
.effortable--texts{
  color: #000;
  font-family: var(--Domaine);
  font-size: 48px;
  font-style: normal;
  font-weight: 400;
  line-height: 48px;
  letter-spacing: -1.92px;
  text-transform: uppercase;
}
.challangeTexts{
  color: var(--text-yellow);
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 55px;
}
.challangeName--Inner--texts{
  color: #70798B;
  font-size: 20px;
  font-weight: 500;
  line-height: 40px;
}
.accordion--body--text{
  color: rgba(255, 255, 255, 0.80);
  font-feature-settings: 'liga' off, 'clig' off;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 30px;
}
.yellowText{
  color: var(--text-yellow);
}
.far--beyound--text{
  color: var(--text-white);
  font-family: var(--Domaine);
  font-size: 40px;
  font-style: normal;
  font-weight: 500;
  line-height: 48px;
  text-transform: uppercase;
}
.beyond--16pxText{
  color: var(--text-white);
  font-family: var(--Domaine);
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
}
.card--texts{
  color: var(--text-white);
  font-size: 30px;
  font-style: normal;
  font-weight: 500;
  line-height: 30px;
  text-transform: uppercase;
}
.get--inTouch--subHeader{
  color: #BFBFBF;
  font-size: 20px;
  font-weight: 400;
  line-height: 30px;
}
.getInTouch--texts{
  color: #E9E9E9;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
}
.dashboard--text--main{
  color: var(--text-white);
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}
.dashboard--text--email{
  color: rgba(255, 255, 255, 0.66);
  font-size: 12px;
  font-weight: 400;
  line-height: 14px;
}
.daily--update--texts{
  color: #FFF;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}
.seeAll--text{
  color: #C39D42;
  font-size: 14px;
  font-weight: 500;
}
.dashboard--notification--text{
  color: #FFF;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}
.dashboard--notification--NameText{
  color: #FFF;
  font-size: 24px;
  font-weight: 700;
}
.dateUpload{
  color: #6D6D6D;
  font-size: 16px;
  font-weight: 500;
}
.rank--currently--unavailable--text{
  color: var(--text-yellow);
  text-align: center;
  font-family: var(--Domaine);
  font-size: 48px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}
.voting--open16px{
  color: rgba(255, 255, 255, 0.68);
  text-align: center;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}
.giveYour--vote--yellow{
  color: #CFA43D;
  font-family: var(--Domaine);
  font-size: 28px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}
.total--vote--text{
  color: #C39D42;
  font-family: var(--Domaine);
  font-size: 12px;
  font-style: italic;
  font-weight: 300;
  line-height: normal;
  letter-spacing: 0.36px;
}
.sixteenPxYellowText{
  color: var(--text-yellow);
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 18px;
  letter-spacing: -0.08px;
}
.dateUploadName{
  color: #FFF;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 20px;
  letter-spacing: -0.24px;
}
.TotalVoteText{
  color: #FFF;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  letter-spacing: -0.24px;
}
.peopleWhoVoteNameText{
  color: #FFF;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 18px;
}
.ProfilePic--email{
  color: #5A5C5F;
  font-family: "Plus Jakarta Sans";
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
  letter-spacing: -0.144px;
}
/* common styles End hare */





/* =============================================== Sig In Page Start Hare ================================== */
.sign--in--wrapper{
  padding: 80px 74px;
  background: url(../images/SignInPageBg.png) no-repeat;
  background-position: center;
  background-size: cover;
  width: 100%;
}
.sign--in--wrapper--main{
  display: flex;
  justify-content: space-between;

}
.sign--in--content{
  max-width: 894px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.sign--in--content--freame{
  width: 476px;
  height: 476px;
  overflow: hidden;
  margin-top: 60px;
}
.sign--in--content--freame img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.sign--in--form{
  padding: 80px 75px;
  border-radius: 24px;
  border: 1px solid rgba(102, 102, 102, 0.50);
  background: rgba(255, 255, 255, 0.13);
  backdrop-filter: blur(20px);
}


.signIn--inputBox--main{
  margin-top: 32px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.emai--input--box--text--wrapper{
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 4px;
}
.email--inputBox--wrapper{
  width: 534px;
  border-radius: 6px;
  border: 1px solid var(--text-bg-gradient);
}
.email--inputBox--wrapper input{
  width: 100%;
  padding: 10px;
  color: var(--text-white);
  background: transparent;
  border: none;
  outline: none;
}



.passWord--hidden--Text--wrapper{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.passHidden--wrapper{
  display: flex;
  align-items: start;
  gap: 10px;
  cursor: pointer;
}
.passHidden--wrapper span{
  color: var(--text-yellow);
  font-size: 18px;
  font-weight: 400;
}
.hideIcon--svg{
  width: 18px;
  height: 15px;
}
.hideIcon--svg svg{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.checkBox--wrapper{
  max-width: 520px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.checkBox--wrapper a span{
  color: var(--text-yellow);
  text-decoration: underline;
}
.signIn--Btn--wrapper{
  margin-top: 40px;
  display: flex;
  gap: 24px;
  align-items: center;
}
.signIn--Btn--wrapper a span{
  color: var(--text-yellow);
  text-decoration: underline;
}
/* =============================================== Sign In Page End Hare ================================== */





/* =============================================== Sign Up Page Start Hare ================================== */

.signUp--names--wrapper{
  display: flex;
  gap: 16px;
}
.firstName--inputBox--wrapper{
  width: 260px;
  border-radius: 6px;
  border: 1px solid rgba(255, 255, 255, 0.56);
}
.emai--input--box--text--wrapper{
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.firstName--inputBox--wrapper input{
  width: 100%;
  padding: 10px;
  color: var(--text-white);
  background: transparent;
  border: none;
  outline: none;
}
/* =============================================== Sign Up Page End Hare ================================== */





/* =============================================== Index Page Start Hare ================================== */


/* Banner Start hare */
.banner--wrapper{
  padding: 390px 0 200px 0;
  background: url(../images/SignInPageBg.png) no-repeat;
}
.banner--heading{
  text-align: center;
}
.banner--heading p span{
  color: #C39D42;
  margin-top: 24px;
}
.banner--btn{
  margin-top: 52px;
  display: flex;
  gap: 30px;
  justify-content: center;
  align-items: center;
}
/* Banner End hare */



/* time section start hare */
.timeSection--wrapper{
  padding: 410px 0 52px 0;
  background: url(../images/TimeSectionBg.png) no-repeat;
  background-position: center;
  background-size: cover;
  position: relative;
}
.timeSection--freme--upper{
  width: 100%;
  height: 357px;
  position: absolute;
  top: 0;
  left: 0;
}
.timeSection--heading{
  width: 890px;
  display: flex;
  justify-content: start;
  flex-direction: column;
  align-items: start;
  gap: 32px;
}
.pageHeading.two{
  text-align: start;
}
.timeSectionSub.two{
  width: 577px;
}
.timeSection--heading p span{
  color: var(--text-yellow);
  font-size: 24px;
  font-style: italic;
  font-weight: 500;
  line-height: 27px;
}


.duration--Time--wrapper{
  margin-top: 24px;
  display: flex;
  gap: 43px;
}

.duration--Time--item{
  padding-right: 43px;
  position: relative;
  width: fit-content;
}
.duration--Time--item:last-child::after{
  display: none;
}
.duration--Time--item::after{
  position: absolute;
  content: '';
  right: 0;
  bottom: 0;
  height: 80%;
  width: 1px;
  background: var(--text-white);
}
.duration--icon--wrapper{
  display: flex;
  gap: 16px;
  margin-top: 8px;
}
.duration--icon{
  width: 24px;
  height: 24px;
}
.duration--icon svg{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.count--down--time--wrapper{
  margin-top: 56px;
  display: flex;
  gap: 40;
  align-items: center;
}

.count--down--time--item--itemsss{
  padding-right: 20px;
  padding-left: 20px;
  position: relative;
  width: fit-content;
}
.count--down--time--item--itemsss::after{
  position: absolute;
  content: '';
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  height: 40%;
  width: 2px;
  background: var(--text-yellow);
}
.count--down--time--item--itemsss:last-child::after{
  display: none;
}
.count--down--time--item{
  padding: 20px;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(20.5px);
  width: fit-content;
}
.learn--more--btn{
  margin-top: 56px;
}
/* time section End hare */


/* member with benifits section start hare */
.memberWith--benifits--wrapper{
  padding: 80px 0;
  background: #000000;
}
.member--with--benifits--main{
  display: flex;
  gap: 66px;
  align-items: center;
}
.member--with--benifits--item1{
  width: 650px;
  height: 160px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.member--with--benifits--item1 h4{
  text-align: end;
}


.member--with--benifits--img{
  width: 288px;
  height: 288px;
}
.member--with--benifits--img img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* member with benifits section End hare */




/* Studios and luxury section Start hare */
.Studios--luxury--wrapper{
  padding-bottom: 140px;
}

.studio--luxury--main--wrapper{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.studio--luxury--left--item{
  display: flex;
}
.studio--luxury--left--item--img{
  width: 375px;
  height: 375px;
}
.studio--luxury--left--item--img img{
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.studio--luxury--left--item--text{
  background-color: rgba(27, 27, 27, 1);
  width: fit-content;
}
.studio--luxury--left--item--Innertext{
  width: 375px;
  height: 375px;
  border-radius: 50%;
  background-color: #000000;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.studio--luxury--left--item--img--two{
  width: 749px;
  height: 374px;
}
.studio--luxury--left--item--img--two img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* Studios and luxury section End hare */


/* Join Now section Start hare */
.join--now--wrapper{
  padding-bottom: 145px;
}

.join--now--main--wrapper{
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.join--now--main--left{
  min-width: 19.5%;
}
.join--now--main--right{
  width: 79.5%;
  height: 748px;
  position: relative;
}

.join--now--wrapperss {
  position: absolute;
  bottom: -30%;
  right: 25%;
  width: 374px;
  height: 374px;
  border-radius: 50%;
  background: var(--text-yellow);
  display: flex;
  justify-content: center;
  align-items: center;
}
/* Join Now section End hare */



/* effort able section Start hare */
.effort--able--wrapper{
  padding-top: 245px;
  padding-bottom: 116px;
}
.affordable--heading{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  gap: 24px;
}
.affordable--heading p span{
  color: var(--text-yellow);
}

.challangeName--wrapper{
  margin-top: 56px;
  padding: 75px 70px;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.07);
  backdrop-filter: blur(39.5px);
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.challangeName--item1 h4 span{
  color: #70798B;
  font-size: 16px;
  font-weight: 500;
  line-height: 25px;
}

.challangeName--item2{
  display: flex;
  gap: 100px;
  align-items: start;
}

.challangeName--Inner--item{
  display: flex;
  gap: 10px;
  align-items: center;
}
/*  effort able section End hare */


/*  Frequently Asked Questions section Start hare */
.frequently--asked--questions{
  padding-bottom: 150px;
}

.faq--wrapper{
  margin-top: 56px;
}

.accordion.custom{
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.accordion-item.custom{
  border-radius: 14px;
  border: 2px solid rgba(23, 27, 36, 0.72);
  background: rgba(255, 255, 255, 0.05);
  box-shadow: 0px 5px 16px 0px rgba(8, 15, 52, 0.06);
}
.accordion-button.custom{
  background: rgba(255, 255, 255, 0.05);
  box-shadow: none;
  background: transparent;
  color: var(--text-white);
}

.accordion-button.custom::after {
  flex-shrink: 0;
  width: 51px; /* Match the width of your SVG */
  height: 51px; /* Match the height of your SVG */
  margin-left: auto;
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='51' height='51' viewBox='0 0 51 51' fill='none'%3E%3Cg filter='url(%23filter0_b_41_302)'%3E%3Ccircle cx='25.6691' cy='25.3308' r='25.3309' transform='rotate(-180 25.6691 25.3308)' fill='white' fill-opacity='0.05'/%3E%3C/g%3E%3Cpath d='M33.9258 28.4404L25.6692 20.2212L17.4126 28.4404' stroke='%23F4DB0C' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cdefs%3E%3Cfilter id='filter0_b_41_302' x='-299.662' y='-300' width='650.662' height='650.662' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeGaussianBlur in='BackgroundImageFix' stdDeviation='150'/%3E%3CfeComposite in2='SourceAlpha' operator='in' result='effect1_backgroundBlur_41_302'/%3E%3CfeBlend mode='normal' in='SourceGraphic' in2='effect1_backgroundBlur_41_302' result='shape'/%3E%3C/filter%3E%3C/defs%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain; /* Adjust as needed */
  transition: var(--bs-accordion-btn-icon-transition);
}
.accordion-body{
  max-width: 1152px;
}
/*  Frequently Asked Questions section End hare */


/* =============================================== Index Page End Hare ================================== */




/* ======================================== Challange Details Page Start Hare ========================= */



/* Challange Banner start hare */
.Challange--banner--wrapper{
  padding: 290px 0 200px 0;
  background: url(../images/challangeBanner.png) no-repeat;
  background-position: center;
  background-size: cover;
}

.subHeader--mainBox{
  max-width: 1005px;
  margin: 0 auto;
  padding-top: 24px;
}

/* Challange Banner End hare */


/* For Beyound Start hare */
.for--beyond--wrapper{
  padding-bottom: 128px;
}
.far--beyound--inner{
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 72px;
}
.far--beyound--left{
  max-width: 448px;
}
.far--beyound--right{
  max-width: 630px;
}

.far--beyound--banner{
  padding: 90px 64px;
}
.far--beyound--banner--inner{
  padding: 110px 0 110px 56px;
  background: url(../images/forBeyoundBanner.png) no-repeat;
  background-position: center;
  background-size: cover;
  border-radius: 20px;
}

.far--beyound--banner--item--wrapper{
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.far--beyound--banner--item{
  padding: 17px 128px 17px 17px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(7.5px);
  width: 576px;
  display: flex;
  gap: 16px;
  align-items: center;
}


.far--beyound--banner--item--svg{
  width: 42px;
  height: 42px;
}
.far--beyound--banner--item--svg svg{
  width: 100%;
  height: 100%;
}
/* For Beyound End hare */



/* Bonuses Start hare */
.bonuses--wrapper{
  padding-bottom: 220px ;
  background: url(../images/cardsBg.png) no-repeat;
  background-position: center;
  background-size: cover;
}

.bonuses--inner--wrapper{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.bonuses--item--card--wrapper{
  display: flex;
  flex-direction: column;
  gap: 50px;
  padding: 0 50px;
}
.bonuses--item--card{
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.11);
  backdrop-filter: blur(30.5px);
  width: 440px;
}
.bonuses--item--card.rotete--7{
  rotate: -7deg;
}
.bonuses--item--card.rotete5 {
  rotate: 5deg;
  margin-left: 120px;
}
.bonuses--item--card.rotate10{
  rotate: 10deg;
}
.bonuses--item--card.rotete7--custom{
  rotate: -7deg;
  margin-left: -120px;
}
.bonuses--item--card--heading{
  padding: 65px 0 45px 24px;
}
.bonuses--item--card--img{
  width: 100%;
  height: 275px;
}
.bonuses--item--card--img img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.bonuses--item--fream{
  width: 288px;
  height: 288px;
}
.bonuses--item--fream img{
  height: 100%;
  width: 100%;
  object-fit: cover;
}
/* Bonuses End hare */



/* ======================================== Challange Details Page End Hare =========================== */




/* =============================================== Contract Start Hare ================================== */
.getIn--touch--wrapper{
  padding: 195px 0;
}
.get--InTouch--inner--main{
  padding: 64px 32px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.16);
  display: flex;
  gap: 64px;
  align-items: center;
}
.get--in--touch--heeader{
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.get--in--touch--form--wrapper{
  margin-top: 45px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.first--and--last--name--wrapper{
  display: flex;
  gap: 32px;
  align-items: center;
}
.firstName--inputbox{
  width: 408px;
  border-radius: 4px;
  border: 1px solid rgba(255, 236, 189, 0.00);
  background: rgba(255, 255, 255, 0.15);
  box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
  margin-top: 6px;
}
.firstName--inputbox input{
  padding: 12px 16px;
  width: 100%;
  background: transparent;
  border: none;
  outline: none;
  color: #C0C0C0;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}
.email--inputbox{
  width: 850px;
  border-radius: 4px;
  border: 1px solid rgba(255, 236, 189, 0.00);
  background: rgba(255, 255, 255, 0.15);
  box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
  margin-top: 6px;
}
.email--inputbox input{
  padding: 12px 16px;
  width: 100%;
  background: transparent;
  border: none;
  outline: none;
  color: #C0C0C0;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}
.sendMsg--inputbox{
  width: 850px;
  height: 130px;
  border-radius: 4px;
  border: 1px solid rgba(255, 236, 189, 0.00);
  background: rgba(255, 255, 255, 0.15);
  box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
  margin-top: 6px;
}
.sendMsg--inputbox textarea{
  padding: 12px 16px;
  width: 100%;
  height: 100%;
  resize: none;
  background: transparent;
  border: none;
  outline: none;
  color: #C0C0C0;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}
.agreee--checkbox label{
  display: flex;
  gap: 12px;
  align-items: center;
}

.get--in--touch--image{
  width: 830px;
  height: 750px;
}
.get--in--touch--image img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.send--massage--btn{
  margin-top: 32px;
}
.send--massage--btn button{
  padding: 12px 0;
  width: 850px;
  border-radius: 8px;
  border: 1px solid #C39D42;
  background: #C39D42;
  box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
  color: var(--White, #FFF);
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
}
/* =============================================== Contract End Hare ================================== */




/* =============================================== Dashboard Page Start Hare ================================== */
.dashboard--wrapper{
  width: 100%;
  display: flex;
}
.dashboard--left--nav {
  width: 15%;
  background: #212121;
  height: 100vh;
  position: fixed;
  left: 0;
  top: 0;
  padding: 32px 0 32px 32px;
}
.dashboard--header--main{
  display: flex;
  gap: 8px;
  align-items: center;
}
.dashboard--logo{
  width: 38px;
  height: 40px;
}
.dashboard--logo svg{
  height: 100%;
  width: 100%;
  object-fit: cover;
}
.dashboard--nav--main{
  margin-top: 40px;
}
.dashboard--nav--main ul{
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.dashboard--nav--main ul li a{
  display: flex;
  column-gap: 16px;
  align-items: center;
}
.dashboard--nav--main ul li a.active{
  padding: 12px 0;
  position: relative;
  background: var(--fghjk, linear-gradient(270deg, rgba(255, 255, 255, 0.06) 0%, rgba(255, 255, 255, 0.00) 100%));
}
.dashboard--nav--main ul li a.active::after{
  position: absolute;
  content: '';
  right: 0;
  top: 0;
  width: 6px;
  height: 100%;
  border-radius: 3px 0px 0px 3px;
  background: #C39D42;
}
/* dashboard left end hare  */




.dashboard--main {
  width: 62%;
  padding: 32px;
  margin: 0 auto;
}

.dashboard--notification--name--header{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.dashboard--notification--custom--svg{
  width: 45px;
  height: 45px;
  padding: 13px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.15);
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
.dashboard--notification--custom--svg svg{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.dashboard--banner--wrapper{
  margin-top: 42px;
}
.dashboard--banner--item{
  padding: 32px 74px 76px 74px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.15);
}
.bannerMotivated--text{
  color: #FFF;
  font-family:var(--Domaine);
  font-size: 44px;
  font-style: italic;
  font-weight: 400;
  line-height: normal;
}


/* dashboard right side */
.dashboard--right--nav{
  width: 18%;
  background: #212121;
  height: 100vh;
  position: fixed;
  right: 0;
  top: 0;
}
.dashboard--right--nav--main{
  padding: 32px;
  width: 100%;
  height: 100%;
  overflow-y: auto;
}
.dashboard--right--nav--main::-webkit-scrollbar{
  display: none;
}
.dashboard--right--nav--profile{
  padding: 5px 15px 5px 7px;
  border-radius: 44px;
  background: rgba(255, 255, 255, 0.15);
  display: flex;
  gap: 12px;
  align-items: center;
}
.dashboard--right--nav--profile--photo{
  width: 48px;
  height: 48px;
  border-radius: 50%;
}
.dashboard--right--nav--profile--photo img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}

.dashboard--daily--upload--wrapper{
  margin-top: 46px;
}
.dashboard--mobile--upoader{
  margin-top: 20px;
  padding: 24px;
  border-radius: var(--radi-xl, 16px);
  background: rgba(255, 255, 255, 0.07);
  box-shadow: 0px 4px 50px 0px var(--shadow-op2, rgba(33, 33, 33, 0.08)), 0px 4px 6px 0px var(--shadow-op1, rgba(33, 33, 33, 0.04));
}
.dashboard--mobile--upoader--header{
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}
.dashboard--Subtext{
  overflow: hidden;
  color: #6D6D6D;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height:  20px;
}
.cancel--btn--dashboard{
  width: 24px;
  height: 24px;
  cursor: pointer;
}
.cancel--btn--dashboard svg{
  width: 100%;
  height: 100%;
  object-fit: cover;
}



/* image uploader */
.uploader-wrapper {
  text-align: center;
  width: 100%;
}

.uploader {
  border: 2px dashed #ffa726;
  border-radius: 10px;
  padding: 20px;
  background-color: #333;
  cursor: pointer;
  position: relative;
}

.uploader img {
  max-width: 100%;
  max-height: 200px;
  border-radius: 10px;
  display: none;
}

.uploader.active img {
  display: block;
}

.uploader .content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
}

.uploader .icon {
  margin-bottom: 10px;
}

.uploader p, .uploader span {
  margin: 5px 0;
}

.browse {
  font-size: 14px;
  color: #ffa726;
}

.uploader:hover {
  background-color: #444;
}
#message{
  color: rgba(255, 255, 255, 0.56);
  text-align: center;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height:  20px;
}
#separator{
  color: #6D6D6D;
  text-align: center;
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
}
.browse{
  padding: 8px 10px;
  width: 100%;
  border-radius: 50px;
  border: 1px solid #C39D42;
}
/* image Uploader */
.upload--btn{
  margin-top: 16px;
}
.upload--btn button{
  padding: 8px 0;
  width: 100%;
  background: var(--text-yellow);
  border-radius: 50px;
  border: 1px solid #C39D42;
  background: #C39D42;
  color: #FFF;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}



.Announcement--wrapper{
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.announcement--notification--card--wrapper{
  margin-top: 20px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.announcement--notification--card--item{
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.05);
  padding: 8px;
}
.announcement--notification--headerss{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.announcement--notification--headerss--icon--texts{
  display: flex;
  gap: 8px;
  align-items: center;
}
.announcement--notification--headerss--icon{
  padding: 4px;
  background: rgba(22, 179, 100, 1);
  border-radius: 50%;
  width: 28px;
  height: 28px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.theVoting--texts--time{
  color: #DCDCDC;
  font-size: 10px;
  font-weight: 500;
  line-height: 18px;
}
.theVoting--texts{
  color: #FFF;
  font-size: 12px;
  font-weight: 500;
  line-height: 18px;
}
.announcement--notification--content{
  padding-left: 32px;
  margin-top: 10px;
}


/* owl custom */
.owl-dots {
  display: flex;
  gap: 10px;
  position: relative;
  left: 42%;
  top: -25px;
}
.owl-carousel button.owl-dot{
  width: 24px;
  height: 4px;
  border-radius: 20px;
  background: #707070;
}
.owl-carousel button.owl-dot.active{
  background: #fff;
}


.dashboard--photo--upload--gellary{
  margin-top: 50px;
}
.dashboard--photo--upload--gellaryss{
  margin-top: 24px;
  display: flex;
  flex-wrap: wrap;
  justify-content: start;
  gap: 30px;
  width: 100%;
}
.dashboard--photo--upload--card{
  width: 23%;
}
.dashboard--photo--upload--heading{
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.dashboard--photo--upload--image{
  width: 100%;
  height: 320px;
  border-radius: 15px;
}
.dashboard--photo--upload--image img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 15px;
}
.dashboard--photo--upload--text{
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 16px;
}


/* ===========:: Dashboard Rank ::============== */
.dashboard--main.rank {
  width: 85%;
  padding: 32px;
  margin: 0 0 0 15%;
    height: 100vh;
}
/* .dashboard--left--nav.rank{
  position: relative;
} */
.count--down--time--wrapper.rank{
  display: flex;
  justify-content: center;
  align-items: center;
}
.dashBoard--rank--timer--wrapper{
  position: relative;
  left: 50%;
    top: 35%;
  transform: translate(-50%,-50%);
}
.dashboard--rank--navProfile{
  display: flex;
  gap: 62px;
  align-items: center;
}
.dashboard--rank--time--header{
  max-width: 1085px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.dashboard--rank--time--header p{
  color: #FFF;
  font-size: 24px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  text-align: center;
}
.dashboard--time--start--in--wrapper{
  margin-top: 48px;
}
.dashboard--time--start--in--wrapper h5{
  color: #C39D42;
  text-align: center;
  font-family: var(--Domaine);
  font-size: 37px;
  font-style: italic;
  font-weight: 400;
  line-height: normal;
}


.dashborad--rank--voting--timeCountDown--wrapper{
  margin-top: 42px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.05);
  padding: 24px 0;
  width: 100%;
  text-align: center;
}



.rank--countdown {
  display: flex;
  gap: 30px;
  justify-content: center;
  margin-top: 20px;
  color: #FFF;
  font-size: 20px;
}

.rank--countdown-item {
  background-color: #333;
  padding: 20px;
  border-radius: 10px;
  text-align: center;
  width: 80px;
}

.rank--count {
  display: block;
  font-size: 24px;
  font-weight: 400;
  color: #fff;
  font-family: var(--Domaine);
}

.rank--label {
  display: block;
  font-size: 14px;
  margin-top: 5px;
  color: var(--text-yellow);
  font-family: var(--Domaine);
}

.rank--countdown-item:not(:last-child)::after {
  content: '';
  width: 1px;
  height: 40px;
  background-color: var(--text-yellow);
  position: absolute;
  margin-left: 52px;
  margin-top: -45px;
}

/* LeaderBoard */
.dashborad--rank--leaderBoard--wrapper{
  margin-top: 40px;
}

.dashboard--leader--main--wrapper{
  margin-top: 12px;
}

.dashboard--leader--item--content{
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: center;
  padding-bottom: 12px;
  position: relative;
}
.dashboard--leader--item--content::after{
  position: absolute;
  content: '';
  left: 0;
  bottom: 0;
  background-color: #465065;
  width: 100%;
  height: 1px;
}


.dashboard--leader--main--wrapper{
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  gap: 20px;
}
.dashboard--leader--item{
  padding: 55px 20px;
  border-radius: 8px;
  background: #212121;
  width: 33%;
  position: relative;
}
.dashboard--leader--item--ranking {
  padding: 6px;
  border-radius: 50%;
  background-color: #000000;
  position: absolute;
  top: -26px;
  left: 50%;
  transform: translateX(-50%);
}
.dashboard--leader--item--ranking--inner{
  height: 40px;
  width: 40px;
  border-radius: 50%;
  background: #212121;
  display: flex;
  justify-content: center;
  align-items: center;
}
.visit--profile--btn{
  margin-top: 16px;
  text-align: center;
}
.visit--profile{
  color: var(--text-yellow);
  font-size: 13px;
  font-weight: 400;
  line-height: 18px;
  letter-spacing: -0.08px;
  text-decoration: underline;
}


/* Leader Board */
.dashboard--main--ranking--leading--bord--wrappers{
  margin-top: 20px;
  padding: 8px 30px;
  border-radius: 8px;
  background: #212121;
}
.dashboard--main--ranking--leading--inner{
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.dashboard--main--ranking--leading--inner--heading{
  width: 100%;
  display: flex;
  align-items: center;
    margin-bottom: 10px;
}
.Leadernumbers{
  width: 10%;
}
.LeaderNamess{
  width: 30%;
  display: flex;
  gap: 8px;
  align-items: center;
  padding-right: 4px;
}
.whoIsPhoto{
  width: 28px;
  height: 28px;
  border-radius: 50%;
    margin-right: 5px;
}
.whoIsPhoto img{
  width: 100%;
  height: 100%;
  border-radius: 50%;
}


.LeaderBeforeImg{
  width: 10%;
  text-align: center;
}
.LeaderBeforeImg--wrapper{
  width: 100%;
  height: 40px;
}
.LeaderBeforeImg--wrapper img{
  height: 100%;
  width: 100%;
  object-fit: contain;
}


.LeaderNowImg{
  width: 10%;
  text-align: center;
}
.LeaderTotalVote{
  width: 20%;
  text-align: center;
}
.LeaderGiveIngVote{
  width: 20%;
  text-align: center;
}

.voteNowBtn{
  padding: 10px 0;
  width: 90px;
  background: transparent;
  border-radius: 4px;
  border: 1px solid #C39D42;
  color: #FFF;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  transition: all linear 0.3s;
}
.voteNowBtn:hover{
  background: var(--text-yellow);
}

/* ====== :: People Vote You Right Side Nav :: =========== */
.dashboard--people--vote--you--wrapper{
  margin-top: 20px;
}


.people--who--vote--you--wrapper{
  margin-top: 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.people--who--vote--you--item{
  padding: 8px;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.05);
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.prople--who--vote--nameImg--wrapper{
  display: flex;
  gap: 8px;
  align-items: center;
}
.people--who--vote--you--image{
  width: 40px;
  height: 40px;
  border-radius: 50%;
}
.people--who--vote--you--image img{
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
}

.people--who--vote--svg{
  width: 24px;
  height: 24px;
  cursor: pointer;
}
.people--who--vote--svg svg{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.likees.active{
  display: none;
}
.unlikees.active{
  display: none;
}
/* ====== :: People Vote You Right Side Nav :: =========== */



/* DASHBOARD SETTING START HARE */
.dashboard--setting--wrapper{
  margin-top: 42px;
  width: 100%;
  display: flex;
  gap: 80px;
}
.skltbs-tab-group{
  display: flex;
  flex-direction: column;
  gap: 20px;
  position: relative;
}
.skltbs-tab-group::after {
  position: absolute;
  content: '';
  right: -40px;
  top: 0;
  height: 100%;
  max-height: 80vh;
  width: 1px;
  background: linear-gradient(0deg, rgba(255, 255, 255, 0.06) 49.95%, rgba(255, 255, 255, 0.06) 50.05%);
}
.dashboard--setting--wrapper .skltbs-tab{
  padding: 16px;
  width: 296px;
  text-align: start;
  background: transparent;
  border-radius: 39px;
  background: transparent;
  border: none;
  color: #949494;
  font-family: "Wix Madefor Display";
  font-size: 18px;
  font-weight: 400;
  line-height: 16px;
}

.dashboard--setting--wrapper .skltbs-tab.skltbs-active{
  color: #FFF;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.06) 0%, rgba(255, 255, 255, 0.00) 178.21%);
}
.skltbs-mode-tabs .skltbs-panel-group {
  position: relative;
  width: 100%;
}



.genarel--wrapper{
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.genaral--setting--main--wrapper {
  margin-top: 40px;
  display: flex;
  justify-content: space-between;
  align-items: start;
}
.genaral--setting--instraction--wrapper{
  display: flex;
  flex-direction: column;
  gap: 44px;
}

.genaral--setting--profile--picture--ins{
  width: 505px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.dashboard--notification--SubText{
  color: #A5A5A5;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}


.genaral--setting--update--wrapper{
  display: flex;
  flex-direction: column;
  gap: 44px;
}

/* Photo Uploader */
.image-uploader-container {
  display: flex;
  align-items: center;
  gap: 20px;
}

.uploader-section {
  text-align: center;
}

.upload-btn {
  display: inline-block;
  padding: 10px 20px;
  color: #fff;
  border-radius: 44px;
  border: 1px solid #C39D42;
  cursor: pointer;
  font-size: 14px;
  font-weight: bold;
}

.upload-instruction {
  font-size: 12px;
  color: #aaa;
  margin-top: 10px;
}

.preview-section {
  position: relative;
  width: 80px;
  height: 80px;
}

.image-preview {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  overflow: hidden;
  background-color: var(--text-white);
  display: flex;
  justify-content: center;
  align-items: center;
}

.image-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.delete-btn {
  position: absolute;
  top: -5px;
  right: -5px;
  background-color: #e74c3c;
  border: none;
  color: white;
  border-radius: 50%;
  cursor: pointer;
  padding: 5px;
  font-size: 14px;
}

.nameChangeInputBox {
  width: 522px;
  padding: 0 25px;
  border-radius: 38px;
  background: rgba(255, 255, 255, 0.08);
  box-shadow: 0px 4px 250px 0px rgba(0, 0, 0, 0.25);
  margin-top: 14px;
}
.nameChangeInputBox input{
  width: 100%;
  padding: 14px 0;
  background: transparent;
  border: none;
  outline: none;
  color: var(--text-white);
}
.save--change--btn{
  padding-top: 126px;
  display: flex;
  justify-content: end;
}
.save--change--btn button{
  width: 224px;
  padding: 16px 0;
  color: #FFF;
  font-size: 18px;
  font-weight: 500;
  line-height: 24px;

  border-radius: 50px;
  border: 1px solid #C39D42;
  background: #C39D42;
}

/* Photo Uploader */

/* DASHBOARD SETTING END HARE */

/* =============================================== Dashboard Page End Hare ================================== */




/* =============================================== pricing Page Start Hare ================================== */
.pricing--main--wrapper{
  width: 100%;
}

.pricing--main--headeing{
  max-width: 910px;
  margin: 0 auto;
  text-align: center;
}
/* =============================================== pricing Page End Hare ================================== */



/* =============================================== profile Page Start Hare ================================== */

.backBtn--main--svg{
  width: 50px;
  height: 50px;
  cursor: pointer;
  position: fixed;
  left: 10px;
  top: 8px;
  z-index: 111;
}

.backBtn--main--svg svg{
  width: 100%;
  height: 100%;
  object-fit: cover;
}


.profile--cover-photo{
  width: 100%;
  height: 260px;
}
.profile--cover-photo img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.profile--main--wrapper {
	padding: 0 40px;
  position: relative;
	top: -65px;
}


.profile--picture--main{
  width: 128px;
  height: 128px;
  border-radius: 50%;
}
.profile--picture--main img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}

.profile--name--email--wrapper{
  margin-top: 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.dashboard--photo--upload--card.viewOther{
  width: 16%;
}


/* notification */
.modal-header .btn-close {
	padding: 0;
	margin: 0;
  color: white;
}
.modal-header{
  border-bottom: none;
  display: flex;
  justify-content: end;
  align-items: end;
  text-align: end;
  color:  #FFF;
}
.modal-content{
  background: #212121;
}
.notification--header{
  padding-bottom: 10px;
}
.notification--wrapper{
  margin-top: 25px;
  height: 600px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}

.notification--wrapper {
  /* Common styles */
  overflow: auto;

  /* For Firefox */
  scrollbar-width: thin; /* Makes the scrollbar thin */
  scrollbar-color: #ccc transparent; /* Sets the track and thumb colors */
}

.notification--wrapper::-webkit-scrollbar {
  width: 3px; /* Sets scrollbar width for WebKit browsers */
}

.notification--wrapper::-webkit-scrollbar-thumb {
  background-color: #ccc; /* Sets thumb color for WebKit browsers */
  border-radius: 10px; /* Optional: makes the thumb rounded */
}

.notification--wrapper::-webkit-scrollbar-track {
  background: transparent; /* Optional: sets track background */
}

.notification--item{
  padding: 20px 0;
  border-bottom: 1px solid #fff;
}

.notification--header--time--wrapper h3{
  color: #FFF;
  font-family: "Wix Madefor Text";
  font-size: 14px;
  font-weight: 600;
  line-height: 18px;
}
.notification--header--time--wrapper{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.notification--header--time--wrapper p{
  color: var(--color-text-dont-edit-text-quarterary, #667085);
  font-size: 10px;
  font-weight: 400;
  line-height: 18px;
}
.notification--item h4{
  overflow: hidden;
  color: #888;
  font-size: 14px;
  font-weight: 400;
  line-height: 18px;
  margin-top: 8px;
}

.btn:hover {
	color: var(--bs-btn-hover-color);
	background-color: transparent;
	border-color: var(--text-yellow);
}
.btn-primary{
  border-color: var(--text-yellow);
}





/* ==================== Footer Part Start Hare ================== */
.footer--wrapper{
  padding: 120px 0 0 0;
  background-color: #2C2B2A;
}
.footer--menus{
  padding-bottom: 33px;
  position: relative;
}
.footer--menus::after{
  position: absolute;
  content: '';
  height: 1px;
  width: 100%;
  background: #FFF;
  left: 0;
  bottom: 0;
}
.footer--menus ul{
  display: flex;
  gap: 100px;
  align-items: center;
}
.footer--menus ul li a{
  color: #E2DDDB;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  transition: all linear 0.3s;
}
.footer--main--text{
  color: #C39D42;
  font-size: 335.744px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}


/* /forget pass */
.forget--pas--wrapper{
  margin-top: 25px;
}
.signIn--Btn--wrapper.two{
  margin-top: 25px;
}
.signIn--Btn--wrapper.two button{
    width: fit-content;
    padding: 16px 64px;
    border-radius: 50px;
    border: 1px solid var(--text-yellow);
    background: var(--text-yellow);
    color: var(--text-white);
    font-size: 18px;
    font-weight: 500;
    line-height: 24px;

}
/* /forget pass */
















/* =============================================== About US Page Start Hare ================================== */
.Challange--banner--wrapper.banner{
  background: url(../images/About-UsBanner.png);
}

.about--us--banner{
  margin-top: 100px;
}
.far--beyound--banner--inner.banner{
  background: url(../images/banner-second--img.png) no-repeat;
  background-position: center;
  background-size: cover;
}


.our--perpuse--wrapper{
  padding: 350px 0;
  background: url(../images/ourPerposeBanner.png) no-repeat;
  background-position: center;
  background-size: cover;
}

.our--perpose--content{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  max-width: 1290px;
  margin: 0 auto;
  text-align: center;
}
.our--perpose--heading{
  max-width: 830px;
  text-align: center;
  margin-bottom: 24px;
}



.our--growth--wrapper{
  padding: 80px 0;
}
.out--growth--heading{
  max-width: 1063px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.our--growth--inner--wrapper{
  margin-top: 76px;
}

.join--the--search--wrapper{
  padding: 200px 0;
}
.join--the--search--heading{
  max-width: 1383px;
  margin: 0 auto;
  text-align: center;
}

.join--the--search--wrapper{
  padding: 100px 0;
  background: url(../images/aboutUs-Banner4.png) no-repeat;
  background-position: center;
  background-size: cover;
}

.card--wrapper--about{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  row-gap: 20px;
  margin-top: 90px;
}
.bonuses--item--card.about{
  width: 370px;
}
/* =============================================== About US Page End Hare ================================== */



/* opener closer */
.btn--left--opener {
  position: absolute;
  right: -25px;
  top: 50%;
  transform: translateY(-50%);
  width: 30px;
  height: 30px;
  cursor: pointer;
  background-color: var(--text-yellow);
  justify-content: center;
  align-items: center;
  border-radius: 8px;
  color: #FFF;
  display: none;
}


.btn--right--opener{
  position: absolute;
  left: -25px;
  top: 50%;
  transform: translateY(-50%);
  width: 30px;
  height: 30px;
  cursor: pointer;
  background-color: var(--text-yellow);
  justify-content: center;
  align-items: center;
  border-radius: 8px;
  color: #FFF;
  display: none;
}
/* opener closer */
