
*{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  color: white;
  font-family: 'Poppins', sans-serif;
}
body{
  background: linear-gradient(180deg, rgba(24, 24, 24, 1) 0%, #181818 85.94%);
}

h1{
  font-size:3.125rem;
  font-weight: bold;
  line-height: 5rem;
}
h2{
  font-size:2.37rem;
  font-weight: bold;
  line-height: 3.56rem;
  text-align: center;
  letter-spacing: 0.03em;
}
h3{
  font-size:2rem;
  font-weight: 700;
  line-height: 3rem;
}
h4{
  font-size:1.25rem;
  font-weight: 700;
  line-height: 2rem;
}
li{
  font-size: 1.62rem;
  font-weight: 600;
  line-height: 2.125rem;
}
h5{
  font-size:1.125rem;
  font-weight: 600;
}

p{
  font-size: 1rem;
  font-weight: normal;
  line-height: 1.75rem;
}
.mytext{
  color: #FFC700;
}

@media only screen and (max-width: 991px){
  .hideInMobile{
    display:none !important;
  }
  h1{
    font-size: 1.75rem;
    line-height: 40px;
  }
  h2{
    font-size: 1.5rem;
    line-height: 36px;
  }
  h3{
    font-size: 1.25rem;
    line-height: 30px;
  }
  h4{
    font-size: 0.87rem;
    line-height: 21px;
  }
  li{
    font-size: 0.87rem;
    line-height: 34px;
    font-weight: 600;
  }
  p{
    font-size: 0.75rem;
    line-height: 20px;
    font-weight: normal;
  }
}

.row{
  margin: 0;
  padding: 0
}

@media only screen and (min-width: 992px){
  .hideInDesktop{
    display:none
  }
}.faqC .inner{
  width: 80%;
  margin: auto;
}
.faqC .title{
  margin-top: 121px;
  margin-bottom: 60px
}
.accordion-item{
  background-color: #1B1B1B;
  margin: 15px 0;
}
.accordion-item button, .accordion-item button:not(.collapsed){
  background-color: #1B1B1B;
  border-radius: 0px 0px 12px 12px;
  color: rgba(255, 199, 0, 1);
  font-size: 1.25rem;
  font-weight: 600
}
.accordion-body{
  background-color: #1B1B1B;
  font-family: Poppins;
  font-size: 1rem;
  line-height: 28px;
  letter-spacing: 0.03em;
  color: #FFFFFF;
}
.accordion-button::after,.accordion-button:not(.collapsed)::after{
  background-image: url('/images/accordion.svg');
}

@media only screen and (max-width: 991px){
  .accordion-item button, .accordion-item button:not(.collapsed){
    font-size: 0.87rem
  }
  .accordion-body{
    font-size: 0.75rem;
  }
  .faqC .title {
    margin-top: 0;
    width: 80%;
    margin: auto;
    margin-bottom: 40px;
  }
}.footerC{
  padding-top: 150px;
  padding-bottom: 15px;
}
.subscribe .inner{
  display: flex;
  justify-content: flex-end;
  padding-bottom: 30px
}
.subscribe{
  width: 85%;
  margin: auto;
}
.subscribe input{
  border: none;
  outline: none;
  border: 1px solid lightgray;
  width: 308px;
  height: 56px;
  background: #FFFFFF;
  border-radius: 50px;
  padding: 0 20px
}

.subscribe button{
  border: none; 
  outline: none;
  background: #F7CF3E;
  border-radius: 50px;
  padding: 16px 26px;
  position: relative;
  left: -50px;
  border:1px solid white;
}

.footer-bottom{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 30px;
  width: 85%;
  margin: auto;
}
.footer-bottom p{
  margin: 0;
  padding: 0
}
.footer-bottom svg{
  font-size: 2rem;
  margin-right: 10px
}
.footer-bottom svg:nth-child(3){
  font-size: 2.3rem;
}

.input-group{
  max-width: 394px;
  width: 386px;

}
.input-group-text{
  border-radius: 50px;
  position: absolute;
  right: -25px;
  height: 100%;
  background-color:#F7CF3E;
  color: white;
  padding: 0 30px
}
.input-group>:not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback){
  border-top-left-radius: 50px;
  border-bottom-left-radius: 50px;
  z-index: 100;
}
.subscribe{
    flex-direction: column;
}
.innerSub{
  display: flex;
  justify-content: flex-end;
  width: 95%;
}
.innerSub h5{
  margin-bottom: 15px;
}
@media only screen and (max-width: 991px){
  .subscribe .inner{
    flex-direction: column;
    padding: 20px
  }
  .subscribe input{
    width: 90%;
  }
  .subscribe button{
    position: static;
    width: 170px;
    margin-top: 15px
  }
  .footerC{
    padding-top: 70px;
  }
  .footerIcon{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 30px;
    margin-bottom: 17px;
    padding-bottom: 10px;
    width: 98%;
    margin: auto;
  }
  .footer-bottom{
    justify-content: center;
  }
  .footer-bottom img{
    width: 70px;
    height: 70px;
    margin-right: 20px
  }
  .subscribe{
    justify-content: center;
    padding: 0 30px;
    flex-direction: column;
  }
  .subscribe input{
    font-size: 14px
  }
  .input-group-text{
    padding: 0 20px
  }
  .input-group{
    width: 270px;
  }
  .innerSub{
    display: flex;
    justify-content: center;
  }
  .footLogo img{
    width: 54px;

  }
}

@media only screen and (max-width: 350px){
  .input-group{
    width: 200px;
  }
  .input-group-text {
    padding: 0 7px;
    font-size: 14px
  }
  .innerSub h5{
    margin-left: 20px
  }
}.headerContainer{
  background: linear-gradient(180deg, rgba(24, 24, 24, 1) 0%, #181818 85.94%);
}
.headerC{
  margin-top: 250px;
  
}
.headerContent{
  padding: 0 3rem
}
.headerBgContainer{
  position: relative;
}
.headerBgContainer img{
  position: absolute;
  width: 100%;
}
.headerLeft{
  position: relative;
  top: -8rem;
  padding-left: 3rem;
  
}
.headerLeft p{
  max-width: 677px;
}
.headerLeft h1{
  margin-bottom: 1rem;
}
.headerLeft img{
  width: 100%
}

.headerRightImgContainer img{
  position: relative;
  width: 100%;
  top: -11rem;
}
.headerBtnContainer{
  display: flex;
  align-items: center;
  margin-bottom: 3rem;
  margin-top: 4.9rem;
}
.headerBtnContainer button{
  border: none;
  outline: none;
  background: #ffc700;
  font-size: 1rem;
  line-height: 1.5rem;
  padding: 13px 36px;
  box-shadow: 3px 3px 0px #816811;
  border-radius: 50px;
  color: rgba(24, 24, 24, 1);
  font-weight: 600;
}
.headerBtnContainer p{
  font-weight: 600;
  color: #ffc700;
  margin: 0; 
  padding: 0;
  margin-left: 64px;
  
}

.partnerContainer{
  width: 100%;
  margin: auto;
}
@media only screen and (max-width: 368px){
  .headerBtnContainer button{
    font-size: 12px;
  }
}


@media only screen and (max-width: 991px){
 .headerContent{
   padding: 0;
   text-align: center;
   width: 80%;
   margin: auto;
 }
 .headerLeft{
   padding: 0;
   top: 0
 }
 .headerC {
  margin-top: 46px;
 }
  .headerBtnContainer {
    justify-content: center;
    margin-top: 46px;
  }
  .headerBtnContainer button{
    padding : 10px 30px; 
    
  }
  .headerBtnContainer p{
    margin-left: 50px
  }
  .headerRightImgContainer img{
    top: 0;
  }
  .partnerContainer{
    display: flex;
  }
  .headerBgContainer img{
    bottom: 0
  }
  .icon-bg{
    margin: 0 6px;
  }
}
.journeyC h2{
  margin-bottom: 2.6rem;
  top: -40px;
  position: relative;
}
.journeyImgContainer{
  position: relative;
  margin-bottom: 5.87rem;
}
.journeyImgContainer .main{
  width: 80%;
  display: flex;
  justify-content: center;
  margin: auto;
  border: 20px solid rgba(255, 255, 255, 0.3);
  border-radius: 10px;
}
.journeyImgContainer .top{
  position: absolute;
  left: 5%;
  top: -5%;
  z-index: -100;
}
.journeyImgContainer .bottom{
  position: absolute;
  right: 5%;
  bottom: -5%;
  z-index: -100;
}

.journeyC .secondPart{
  text-align: center;
  width: 80%; 
  margin: auto;
  /* box-shadow: 0 15px 20px rgba(51, 51, 51, 0.753); */
  margin-bottom: 100px;
}
.journeyC .secondPart div{
  padding: 25px 15px;
}
.journeyC .secondPart div:nth-child(even){
  background: rgba(31, 31, 31, 1);
}
.journeyC .secondPart div:nth-child(odd){
  background: rgba(39, 39, 39, 1);
}
.journeyC p{
  margin-top: 12px;
  padding: 0 10px;
}

@media only screen and (max-width: 991px){
  .journeyImgContainer .main{
    width: 90%;
    border: 5px solid rgba(255, 255, 255, 0.3);
    border-radius: 3px;
  }
  .journeyImgContainer .top {
    width: 50px;
    left: 0;
    top: -27px;
    z-index: -100;
  }
  .journeyImgContainer .bottom {
    right: 0;
    width: 50px;
    z-index: -1;
  }
  .journeyC .secondPart{
    box-shadow: none;
    width: 90%;
    margin-bottom: 48px;
  }
  .journeyC h2 {
    position: relative;
    width: 71%;
    margin: auto;
    margin-bottom: 2.6rem;
    margin-top: 20px;
    top: 0
}
}.mynavbarC{
  padding-top: 24px;
  width: 85%;
  margin: auto;
}
.icon-bg{
  background-color: rgba(255, 255, 255, 0.15);
  width: 50px;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 14px;
  border-radius: 50%;

}
.icon-bg:last-child{
  margin-right: 0;
}
.icon-bg:first-child{
  margin-left: 0;
}
.navbar-nav{
  width: 100%;

}
.links a:last-child{
  margin-right: 0;
}
.nav-logo{
  width: 70px;
  height: auto;
}
.nav-icons img{
  width: 100%; 
  padding: 20px
}


.navbar-light .navbar-nav .nav-link {
  text-decoration: none;
  color: white;
  font-weight: 600;
  padding: 0;
  margin: 0 24px;
}
.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover{
  color: #FFC700
}
.navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .show>.nav-link{
  color: #FFC700
}
.navbar-light .navbar-toggler-icon{
  background-image: url('/images/nav.svg');
}

.offcanvas-start{
  width: 50%
}


 /* Custom Sidebar  */
 .customSidebar{
  width: 50%;
  height: 100%;
  z-index: 1000;
  position: fixed;
  left: 0;
  top: 0;
  background-color: #1B1B1B;
  transition: transform 0.7s;

 }
 .customSidebar a{
   line-height: 40px;
 }

.hideIt{
  transform: translateX(-100vw);
  transition: transform 0.7s;
}
.crossbtn{
  width:100%;
  height: 50px;
  background-color: #252525;
  display: flex;
  justify-content: flex-end;
  align-items: center; 
  padding-right: 20px;
  margin-bottom: 20px;
}

.crossbtn svg{
  cursor: pointer
}






@media only screen and (max-width: 991px){
  .nav-logo{
    width: 3.43rem;
  }
  .nav-icon{
    width: 99%;
  }
  .icon-bg{
    width: 40px;
    height: 40px;
  }
  .hideTheMenu{
    display: none;
  }

  
}.roadmapC{
  background: url(/images/roadmap.png);
  background-repeat: no-repeat;
  background-size: cover;
}
.roadmapC h3{
  color: #ffc700;
}
.roadmapC .inner{
  width: 80%;
  margin: auto;
  padding: 100px 0;
}
.phase1{
  border-bottom-left-radius: 10px;
    border-bottom: 5px dashed #ffc700;
    border-left: 5px dashed #ffc700;
    padding: 0 40px 40px;
    position: relative;
}

.phase1:before {
  position: absolute;
  content: "";
  top: 0;
  left: -22px;
  height: 40px;
  width: 40px;
  background: #ffc700;
  border-radius: 50%;
  box-sizing: border-box;
  border: 10px solid #745d0e;
}

.phase2{
  border-bottom-right-radius: 10px;
    border-top-right-radius: 10px;
    border-right: 5px dashed #ffc700;
    padding: 40px;
    margin-right: -6px;
    margin-top: -5px;
    margin-bottom: -5px;
    display: flex;
    justify-content: flex-end;
    position: relative;
}
.phase3 {
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
  border-top: 5px dashed #ffc700;
  border-bottom: 5px dashed #ffc700;
  border-left: 5px dashed #ffc700;
  padding: 40px;
}
.phase4 {
  border-top-right-radius: 10px;
  border-right: 5px dashed #ffc700;
  padding: 40px;
  margin-right: -5px;
  margin-top: -5px;
  position: relative;
  display: flex;
  justify-content: flex-end;
}
.phase4:before {
  position: absolute;
  content: "";
  bottom: 0;
  right: -22px;
  height: 40px;
  width: 40px;
  background: #ffc700;
  border-radius: 50%;
  box-sizing: border-box;
  border: 5px solid #745d0e;
}

@media only screen and (max-width: 991px){
  .roadmapC .inner{
    width: 90%;
    padding-top: 40px;
  }
  .phase1{
    padding-left: 30px;
    border-bottom: 4px dashed #ffc700;
    border-left: 4px dashed #ffc700;
  }
  .phase2{
      border-right: 4px dashed #ffc700;
  }
  .phase3 {
    border-top: 4px dashed #ffc700;
    border-bottom: 4px dashed #ffc700;
    border-left: 4px dashed #ffc700;
  }
  .phase4 {
    border-right: 4px dashed #ffc700;
  }
  li{
    list-style-type: none;
  }
  li::before{
    content: '';
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background-color: white;
    position: absolute;
    margin-top: 14px;
    margin-left: -14px;
  }
}.teamC .sectionA{
  text-align: center;
  max-width: 863px;
  width: 70%;
  margin: auto;
  padding-bottom: 66px
}
.teamC .sectionA h2{
  margin-top: 83px;
  margin-bottom: 31px

}


 /* card  */
.cardContainer{
  width: 80%;
  margin: auto;
  row-gap: 20px;
  
}
 .card-inner{
   display: flex;
   justify-content: center;
   /* background-color: red;
   padding: 30px */
 }

.mycard{
  background-color: rgba(31, 31, 31, 1);
  /* max-width: 248px; */
  padding: 30px;
  border-radius: 10px;
}
.mycard .imgCont img{
  width: 100%;
  margin-bottom: 20px
  
}

.content-part{
  display: flex;
  justify-content: space-between;
}
.content-part p{
  margin: 0;
  padding: 0;
  color: rgba(255, 255, 255, 0.6);
  font-size: 14px;
}
.content-part .tweetCont{
  flex-shrink: 1;
}

@media only screen and (min-width: 768px) and (max-width:1227px){
  .cardContainer{
    width: 93%;
    margin: auto;
    row-gap: 20px;
  }
  .card-inner{
    display: flex;
    justify-content: center;
    /* background-color: rgba(31, 31, 31, 1); */
    /* padding: 20px  */
  }
 
 .mycard{
   background-color: rgba(31, 31, 31, 1);
   padding: 10px;
   border-radius: 10px;
 }
 .mycard .imgCont{
   margin: auto
 }
 .mycard .imgCont img{
  margin-bottom: 20px
  
}
.content-part p{
  font-size: 11px;
}
}