@font-face {
  font-family: "medel";
  src: url(./Images/Medel.ttf);
}
html,
body {
  width: 100%;
  overflow-x: hidden;
}
#bc-body {
  /* box-shadow: 0 3px 0px 0px turquoise; */
  display: inline-block;
  margin: 0;
  padding: 0;
  background-color: #191a2e;
  width: 100%;
}
#bc-body h2 {
  box-shadow: 0 3px 0 turquoise;
  display: inline-block;
  padding: 5px 0;
  margin: 15px 0;
  font-size: 1.5em;
}
button.navbar-toggler {
  background-color: unset !important;
}
#bc-body .row.container {
  margin: auto;
}
#bc-body button {
  color: black;
  background-color: #78fff1;
}
.bg-container {
  position: relative;
}
.bc-home-video {
  width: 100%;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
#bc-home-logo {
  height: 1.5em;
}
#navbarNavAltMarkup .nav-link {
  margin: 0 1%;
}
#navbarNavAltMarkup .navbar-nav {
  width: 100%;
}

#navbarNavAltMarkup .navbar-nav .nav-link span {
  color: turquoise;
}

#navbarNavAltMarkup .navbar-nav .nav-link .badge {
  padding: 0 !important;
}

#home-content {
  position: relative;
}
.continuum-container {
  padding-bottom: 15% !important;
}

#roadmap-container.container {
  padding: 5% 0;
}
.home-btn {
  padding: 8px 24px;
}
.home-text-color {
  color: #78fff1;
}
.home-text-center {
  text-align: center;
}
.home-header {
  text-align: center;
  padding: 2%;
}
.home-text-color-white {
  color: white;
}

.home-social-icon {
  font-size: 2em !important;
  color: white;
}
.icon-container {
  padding-top: 15px;
}
.home-social-media {
  padding: 60px 0;
}

.home-social-media a {
  text-decoration: none;
  padding: 15px 15px 0;
  color: white;

  /* margin: 0px 20px 0 0; */
}
.home-social-media a i:hover {
  color: turquoise;
  transition: color 0.5s;
}
#home-footer {
  text-align: center;
}

#home-footer .bc-home-logo {
  width: 100px;
  margin: 0 50px;
}
.col.home-content-2-img img {
  width: 95%;  
}
.home-footer-logos {
  width: 100%;
  padding: 80px 80px 80px 80px;
}
.web3-logo {
  width: 300px !important;
}
.continuum-container,
.bc-container,
.block-container,
.economy-container,
.residents-container,
.tewai-chain-container {
  margin: auto;
}
.bc-container {
  padding: 5% 0;
}
.bc-container-reverse {
  flex-direction: row-reverse;
}
.video-container-img {
  background-image: url("./Images/video-bg-min.png");
  background-repeat: repeat-y;
  background-size: 100%;
  opacity: 0.22;
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
}
.video-container {
  position: relative;
  width: 100%;
  height: inherit;
  margin: 0;
  text-align: center;
}
.main-gallery {
  max-width: 1500px;
  margin: auto;
}
.home-content-2-img {
  text-align: center !important;
}
.row.roadmap-container {
  position: relative;
  width: 100%;
  margin: 0;
  padding: 5%;
  height: inherit;
}
.roadmap-bg {
  background-image: url("./Images/Roadmap-bg.png");
  background-repeat: no-repeat;
  background-size: 53%;
  opacity: 0.3;
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  z-index: 0;
}
.roadmap-container .row.container {
  width: 80%;
  padding: 5% 0;
  z-index: 1;

}
.home-content-2-text {
  background: linear-gradient(180deg, #393d6780 10%, #191a2e 90%);
  border-radius: 10px;
}

.home-tewai-chain-content {
  color: white;
  padding: 2%;
}
#bc-home-bg-parent {
  position: relative;
  padding-top: 5%;
}
#bc-home-bg {
  background-image: url("./Images/background-min.png");
  background-repeat: no-repeat;
  background-size: 100%;
  opacity: 0.6;
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  z-index: -999;
}
.tewai-chain-container {
  background-image: url("./Images/Tewai-Chain-blur-ball-min.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% auto;
  padding: 5%;
}
.tewai-chain-content-container {
  border-radius: 10px;
  margin: 5% 0;
  z-index: 1;
  background: #58585873;
}
.home-tewai-chain-content .col {
  margin: 2%;
}

.flickity-page-dots {
  bottom: 50px !important;
}
.flickity-page-dots .dot {
  background-color: white !important;
}
.gallery-cell {
  width: 50%;
  text-align: center;
  z-index: 0;
  filter: brightness(0.5) blur(3px);
}

.gallery-cell iframe {
  width: 80%;
  height: 800px;
  pointer-events: none;
}
.gallery-cell.is-selected {
  filter: brightness(1) blur(0);
  z-index: 1;
}

.gallery-cell.is-selected iframe {
  padding: unset !important;
  -webkit-border-radius: 20px;
  border-radius: 20px;
  z-index: 1;
  width: 100% !important;
  transform: scale(1.3);
  pointer-events: unset;
}
.roadmap-dot {
  border: 2px #ffa50082 solid;
  border-radius: 50%;
  height: 24px;
  width: 24px;
}
.roadmap-dot.current {
  border: 2px turquoise solid;
}

#bc-body .roadmap-line {
  border-left: 2px grey solid;
  height: 30vh;
  margin-left: 11px;
}

.roadmap-gp {
  justify-content: center;
  display: grid;
}

.hero {
  display: flex;
  align-items: center;
  min-height: 48em;
  height: 100%;
  position: relative;
  filter: brightness(0.5);
}

.hero .hero-background,
.hero .hero-background2 {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero .hero-background2 {
  object-fit: fill;
  opacity: 0.7;
}

.hero .headline-slogan .long-logo {
  padding-top: 25%;
  height: 100%;
  position: relative;
}

.hero .headline-slogan .long-logo img {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  object-fit: contain;
  width: 100%;
  height: 100%;
}

.hero .ant-row {
  flex: 1;
}
.hero .video-btn {
  margin-left: auto;
  margin-right: auto;
  left: 0;
  right: 0;
  text-align: center;
  position: absolute;
  bottom: 100px;
  width: 300px;
  height: 50px;
  filter: brightness(1) drop-shadow(2px 4px 6px grey);
}

.investors-img {
  width: 100%;
  max-width: 1500px;
  padding: 0px 1rem;
  object-fit: contain;
  margin: auto;
}

#home-footer {
  background: black;
}

::-webkit-scrollbar {
  width: 10px;
}
/* Handle */
::-webkit-scrollbar-thumb {
  background: grey;
  /* border-radius: 5px; */
}
::-webkit-scrollbar-track {
  background: #3e3d3d; /* color of the tracking area */
}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: lightgray;
}

.alert {
  background-color: transparent;
  color: #ffffff;
  border-color: #78fff1;
  text-align: center;
}

#bg-video {
  width: 100%;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  height: 100%;
  object-fit: cover;
}
#bg-video-text {
  position: absolute;
  top: 30%;
  left: 16%;
  width: 75%;
}

.home-footer-logos div {
  /* padding: 5% 0; */
}
#web3-logo,
#bbx-logo {
  width: 100%;
}
#footer-bc-logo {
  width: 30%;
}
.home-footer-logos col {
  padding: 5% 0;
}
/* responsive */
/* Small devices (landscape phones, 576px and up) */

@media (min-width: 576px) {
  #bg-video-text {
    width: 80%;
  }
  #bc-body .roadmap-line {
    height: 25vh;
  }
  #web3-logo,
  #bbx-logo {
    width: 60%;
  }
  #footer-bc-logo {
    width: 40%;
  }
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
  #bg-video-text {
    width: 70%;
  }
  #bc-body .roadmap-line {
    height: 19vh;
  }
  #web3-logo,
  #bbx-logo {
    width: 90%;
  }
  #footer-bc-logo {
    width: 40%;
  }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
  #bg-video-text {
    width: 50%;
  }
  #bc-body .roadmap-line {
    height: 14vh;
  }
  #web3-logo,
  #bbx-logo {
    width: 80%;
  }
  #footer-bc-logo {
    width: 30%;
  }
}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
  #bg-video-text {
    width: 40%;
  }
  #bc-body .roadmap-line {
    height: 12vh;
  }
  #web3-logo,
  #bbx-logo {
    width: 60%;
  }
  #footer-bc-logo {
    width: 30%;
  }
  .web3-logo-col {
    text-align: end;
  }
  .bbx-logo-col {
    text-align: start;
  }
}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {
  #bg-video-text {
    width: 40%;
  }
  #bc-body .roadmap-line {
    height: 10vh;
  }
  #web3-logo,
  #bbx-logo {
    width: 40%;
  }
  #footer-bc-logo {
    width: 20%;
  }
  .web3-logo-col {
    text-align: end;
  }
  .bbx-logo-col {
    text-align: start;
  }
}

.no-shadow {
  background: none !important;
}

/* #early-access > iframe {
  width: 100%;
  height: 100%;
  text-align: center;
} */

.request-access-row {
  height: 70vh;
  margin: 0;
}
.request-access-row iframe {
  width: 100%;
  height: 100%;
  text-align: center;
}

.typing-wrapper {
  /*This part is important for centering*/
  display: flex;
  align-items: left;
  justify-content: left;
}

.typing-text {
  /* width: 23ch; */
  /* animation: typing 2s steps(20), blink .5s step-end infinite alternate; */
  /* white-space: nowrap; */
  /* overflow: hidden;  */
  /* border-right: 3px solid; */
  font-size: 1em;
  margin-bottom: 10px;
}

@keyframes typing {
  from {
    width: 0
  }
}
    
@keyframes blink {
  50% {
    border-color: transparent
  }
}