@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&family=JetBrains+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,700;0,800;1,100;1,200;1,300;1,400;1,700;1,800&family=Lato:wght@100;300;400;700;900&family=Noto+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;1,100;1,200;1,400;1,500&family=Poppins:wght@100;200;300;400;500;600;700;800;900&family=Roboto+Slab:wght@100;200;300;400;500;600;700;800;900&family=Spline+Sans:wght@300;400;500;600;700&display=swap');
body {
	font-family: 'JetBrains Mono', monospace;
	color: #E5E4DC;
	overflow-x: hidden;	
	background: #0d0c0a;
}
a {
	color: #428737;
	text-decoration: none;
}
.lead {
	font-size: 1.15rem;
	font-weight: 300;
}
.navbar {  
	padding-top: .15rem;
	padding-bottom: .15rem;
}
.nav-link {
	color: #E6E4DC;
	font-weight: 500;
}
.nav-link:hover {
	color: #E6E4DC;
	opacity: 0.6;
}
.tw-shadow {
	text-shadow: 0px 0px 8px #fff;
}
.col-top-logo {
	margin-top: 2rem;
}
.dao-top-section {	
	height: 100%;
	padding: 1rem 1rem 6rem;
	position: relative;
}
.alert-primary-top {
	color: #fff;
	background-color: #111010;
	border-color: #111010;
	border-radius: 0;
	font-size: 1rem;
	margin-bottom: 0;
	padding: .5rem 1rem;
}
.alert-primary-top a {
	color: #d9d975;
}
.col-inner {
	position: relative;
}
.col-top-title h1 {
	width: 100%;
	font-size: 4rem;
	line-height: normal;
	letter-spacing: normal;
	text-transform: capitalize;
	font-weight: 500;
	margin-top: 0rem;
	margin-bottom: 1.5rem;
	color: #ffffff;
}
.col-top-desc {
	margin-bottom: 60px;
}
.col-top-desc p {
	font-size: 2rem;
	font-weight: 500;
	line-height: 1.25;
}
.col-top-buttons .btn-primary {
  border: 1px solid rgba(191, 190, 178, 0.3);
  border-radius: 0rem;
  background: #21211F;
  padding: 1.25rem 1rem;
}
.col-top-buttons .btn-primary:hover {
  background: #2F2F2D;
}
.col-top-buttons .btn-success {  
	border: 5px solid #07ac60;
	border-radius: .85rem;
}
.ctt-highlight {
	color: #E5CB85;
}
.dna-logo svg {
	height: 35px;
	height: 35px;
}
.dna-logo {
	width: 100%;
}
.dna-logo img {
	height: 35px;
}
.display-tld {
	font-size: 1.35rem;
	font-weight: 600;
	vertical-align: -7px;
	color: #3d3d3d;
}
.nf-top-value {
	font-size: 1.25rem;
	font-weight: 700;
	color: #E5E4DC;
}
.nf-top-desc {
	font-weight:500;
	font-size:.80rem;
	text-transform:uppercase
}
.col-search h4 {
	color: #050C40;
}
.ig-custom {
	border-radius: 0rem;
	padding: 0rem;
	background: none;
}
a.col-top-domains {
	display: block;
	margin-bottom: 10px;
	background: #282827;
	color: rgba(206, 205, 195, 0.6);
	padding: 30px 15px;
	border: 1px solid rgba(198, 196, 182, 0.3);
	border-radius: 0px;
}
a.col-top-domains:hover {
	display: block;
	background: #3c3c3b;
}
span.dna-highlight-value {
	color: #B0954A;
	font-weight: 700;
	font-size: 1.35rem;
}
.col-animation-top {
	position: absolute;
	right: -7%;
	top: 18%;
	z-index: -1;
}
.col-search .form-control {
	border: 1px solid rgba(191, 190, 178, 0.3);
	border-radius: 0rem;
	background: #21211F;
	padding: 1rem 1rem;
}
.col-search .btn-primary {
	border: 1px solid rgba(191, 190, 178, 0.3);
	border-radius: 0rem;
	background: #21211F;
	padding: 1rem 1.5rem;
}
.col-search .btn-primary:hover {
  background: #2F2F2D;
}
.dao-mid-section {
	padding: 6rem 1rem 6rem;
}
.dao-mid-section h2 {
	font-size: 3.85rem;
	font-weight: 500;
	margin-top: 0rem;
}
.dao-mid-section .btn-primary {
  border: 1px solid rgba(191, 190, 178, 0.3);
  border-radius: 0rem;
  background: #21211F;
  padding: 1.25rem 1rem;
}
.dao-mid-section .btn-primary:hover {
  background: #2F2F2D;
}
.tokensale-section {
	position: relative;
	padding: 6rem 1rem 6rem;
}
.col-sale-inner {
	padding: 1rem 0 1rem
}
.col-sub-desc {
	display: block;
	font-size: 1.375rem;
	font-weight: 700;
	color: #99999b
}
.col-sub-amount {
	font-weight: 800;
	font-size: 3rem;
	color: #E5E4DC;
}
.tokensale-section h2 {
	font-size: 3.85rem;
	font-weight: 500;
	margin-top: 0rem;
}
.solve-section {
	position: relative;
	padding: 8rem 1rem 8rem;
}
.solve-section h2 {
	font-size: 3.85rem;
	font-weight: 500;
	margin-top: 0rem;
}
.solve-section .feature-icon img {
	margin-bottom:15px
}
.solve-box h6 {
	font-weight:600;
	color: #E5CB85;
}
.solve-box .feature {
	margin-bottom: 10px;
	background: #13120F;
	color: rgba(206, 205, 195, 0.6);
	padding: 10px;
	border: 1px solid rgba(198, 196, 182, 0.3);
	border-radius: 0px;
}
.apps-section .feature-icon img {
	margin-bottom:15px
}
.apps-section .feature {
	margin-bottom:2rem
}
.apps-section h6 {
	font-weight:600;
	color: #E5CB85;
}
.flex-lg-row-reverse-custom {
	flex-direction: row-reverse;
}
.howitworks-section {
	position: relative;
	padding: 8rem 1rem 8rem;
}
.howitworks-section .feature-icon img {
	margin-bottom:15px
}
.img-fluid-85 {
	max-width: 85%;
	height: auto;
}
.howitworks-section h2 {
	font-size: 3.85rem;
	font-weight: 500;
	margin-top: 0rem;
	color: #E5E4DC;
}
#howitworks2 {
	background: inherit;
}
.how-box h6 {
	color: #E5CB85;
}
.marketplace-section {
	position: relative;
	padding: 8rem 1rem 8rem;
}
.marketplace-section h2 {
	font-size: 3.85rem;
	font-weight: 700;
	margin-top: 0rem;
	color: #E5E4DC;
}
.marketplace-section .btn-danger {
	border: 1px solid rgba(191, 190, 178, 0.3);
	border-radius: 0rem;
	background: #21211F;
	padding: 1.25rem 1rem;
}
.market2 {
	background: inherit;
}
.img-border {
	margin-bottom: 10px;
	background: none;
	color: rgba(206, 205, 195, 0.6);
	padding: 0;
	border: 0;
	border-radius: 0px;
}
.answer-section {
	position: relative;
	padding: 6rem 1rem 8rem;
	background: inherit;
}
.answer-section h2 {
	font-size: 2.25rem;
	font-weight: 600;
	color: #797979;
}
.answer-section .btn-primary {
	border: 1px solid rgba(191, 190, 178, 0.3);
	border-radius: 0rem;
	background: #21211F;
	padding: 1.25rem 1rem;
}
#blog-container .btn-primary {
	border: 1px solid rgba(191, 190, 178, 0.3);
	border-radius: 0rem;
	background: #21211F;
}
#blog-container .btn-primary:hover {	
	background: #2F2F2D;
}
#blog-container .card {
	border: none;
}
#blog-container .card .display-6a {
	font-size: 2.25rem;
}
.col-footer {
  margin-top: 4rem;
}
.col-footer ul {
  padding-left: 0;
}
.col-footer ul li {
  float: left;
  margin-left: 1.05rem;
  list-style-type: none;
  font-size: 85%;
}
.col-footer .fas {
	margin-right: 5px;
}
.social-media .bi {
	font-size: 2rem;
}
.col-backtop {
	position: fixed;
	bottom: 0;
	right: 0;
	z-index: 999;
}
.col-backtop .bi {
	font-size: 2rem;
}
@media (max-width: 1199.98px) { 
	.col-top-title h1 {
		font-size: 4rem;
	}	
}
@media (max-width: 999.98px) { 	
	.col-topdomain-list .col-md-6 {
		flex: 0 0 auto;
		width: 100%;
	}
}
#myBtn {
	display: none;
}
/******/
#countdown {
 background:#121212;
 display:inline-block;
 padding: 0px 15px 7px;
 border-radius:8px;
  margin-top: 10px;
 margin-bottom: 10px;
}
#countdown ul {
 padding-left:0;
 margin-bottom: 0rem;
}
#countdown ul li div {
 margin-top:1.5rem
}
#countdown li {
 display:inline-block;
 font-size:1rem;
 list-style-type:none;
 padding:0px;
 text-transform:uppercase;
 color: #999;
}
#countdown li span {
 display:block;
 font-size:2.55rem;
 font-weight:800;
 color:#fff;
 background:#121212;
 border-radius:8px;
 padding:0 15px 5px;
 margin-bottom:5px
}
#countdown li b {
	margin-top: -25px;
display: block;
}
/******/
.col-timeline ol {
  margin: 0;
  list-style: none;
  padding: 0;
  --hue: 1;
  --unit: 1rem;
}
.event-date {
  margin: 0 0 0.35rem;
  font-weight: bold;
}
.event-description {
  margin: 0;
}
.col-timeline .fas {
	font-size: 12px;
	font-weight: 600;
}
.col-timeline li {
  --height: 7rem;
  position: relative;
  display: block;
  background-color: hsl(calc(var(--hue) * 360 / 20), 90%, 65%);
  border-color: hsl(calc(var(--hue) * 360 / 20), 90%, 65%);
  color: #2c2c2c;
  padding: 1rem;
  margin: 2rem 0;
}
.col-timeline li::before {
  content: "";
  background-color: inherit;
  position: absolute;
  display: block;
  width: var(--unit);
  height: var(--unit);
  top: 100%;
  left: calc(50% - (var(--unit) / 2));
}
.col-timeline li::after {
  content: "";
  position: absolute;
  display: block;
  top: calc(100% + var(--unit));
  left: calc(50% - (var(--unit)));
  border: var(--unit) solid transparent;
  border-top-color: inherit;
}
.col-timeline li:last-child::before,
.col-timeline li:last-child::after {
  content: none;
}
.col-timeline li:nth-child(20n + 1) {
  --hue: 2;
}
.col-timeline li:nth-child(20n + 2) {
  --hue: 4;
}
.col-timeline li:nth-child(20n + 3) {
  --hue: 6;
}
.col-timeline li:nth-child(20n + 4) {
  --hue: 8;
}
.col-timeline li:nth-child(20n + 5) {
  --hue: 10;
}
.col-timeline li:nth-child(20n + 6) {
  --hue: 12;
}
.col-timeline li:nth-child(20n + 7) {
  --hue: 18;
}
.col-timeline li:nth-child(20n + 8) {
  --hue: 20;
}
.col-timeline li:nth-child(20n + 9) {
  --hue: 9;
}
.col-timeline li:nth-child(20n + 10) {
  --hue: 10;
}
.col-timeline li:nth-child(20n + 11) {
  --hue: 11;
}
.col-timeline li:nth-child(20n + 12) {
  --hue: 12;
}
.col-timeline li:nth-child(20n + 13) {
  --hue: 13;
}
.col-timeline li:nth-child(20n + 14) {
  --hue: 14;
}
.col-timeline li:nth-child(20n + 15) {
  --hue: 15;
}
.col-timeline li:nth-child(20n + 16) {
  --hue: 16;
}
.col-timeline li:nth-child(20n + 17) {
  --hue: 17;
}
.col-timeline li:nth-child(20n + 18) {
  --hue: 18;
}
.col-timeline li:nth-child(20n + 19) {
  --hue: 19;
}
.col-timeline li:nth-child(20n + 20) {
  --hue: 20;
}
@media (min-width: 550px) and (max-width: 899px) {
  .col-timeline li {
    margin: 1rem;
    width: calc(50% - 4rem);
    float: left;
    min-height: var(--height);
  }
 .col-timeline  li:nth-child(4n + 3),
 .col-timeline li:nth-child(4n + 4) {
    float: right;
  }
 .col-timeline li:nth-child(4n + 1)::before {
    top: calc(var(--height) / 2 + var(--unit) / 2);
    left: 100%;
  }
  .col-timeline li:nth-child(4n + 1)::after {
    top: calc(var(--height) / 2);
    left: calc(100% + (var(--unit)));
    border: var(--unit) solid transparent;
    border-left-color: inherit;
  }
  .col-timeline li:nth-child(4n + 3)::before {
    top: calc(var(--height) / 2 + var(--unit) / 2);
    left: -1rem;
  }
  .col-timeline li:nth-child(4n + 3)::after {
    top: calc(var(--height) / 2);
    left: -3rem;
    border: var(--unit) solid transparent;
    border-right-color: inherit;
  }
}
@media (min-width: 900px) and (max-width: 1199px) {
  .col-timeline li {
    margin: 1rem;
    width: calc(33.33% - 4rem);
    float: left;
    min-height: 7rem;
  }
  .col-timeline li:nth-child(6n + 4),
  .col-timeline li:nth-child(6n + 5),
  .col-timeline li:nth-child(6n + 6) {
    float: right;
  }
  .col-timeline li:nth-child(6n + 1)::before,
  .col-timeline li:nth-child(6n + 2)::before {
    top: calc(var(--height) / 2 + var(--unit) / 2);
    left: 100%;
  }
  .col-timeline li:nth-child(6n + 1)::after,
  .col-timeline li:nth-child(6n + 2)::after {
    top: 3.5rem;
    left: calc(100% + (var(--unit)));
    border: var(--unit) solid transparent;
    border-left-color: inherit;
  }
  .col-timeline li:nth-child(6n + 4)::before,
  .col-timeline li:nth-child(6n + 5)::before {
    top: calc(var(--height) / 2 + var(--unit) / 2);
    left: -1rem;
  }
  .col-timeline li:nth-child(6n + 4)::after,
  .col-timeline li:nth-child(6n + 5)::after {
    top: calc(var(--height) / 2);
    left: -3rem;
    border: var(--unit) solid transparent;
    border-right-color: inherit;
  }
}
@media (min-width: 1200px) {
  .col-timeline ol {
    max-width: 1600px;
    margin: 0 auto;
  }
  .col-timeline li {
    margin: 1rem;
    width: calc(25% - 4rem);
    float: left;
    min-height: 7rem;
  }
  .col-timeline li:nth-child(8n + 5),
  .col-timeline li:nth-child(8n + 6),
  .col-timeline li:nth-child(8n + 7),
  .col-timeline li:nth-child(8n + 8) {
    float: right;
  }
  .col-timeline li:nth-child(8n + 1)::before,
  .col-timeline li:nth-child(8n + 2)::before,
  .col-timeline li:nth-child(8n + 3)::before {
    top: calc(var(--height) / 2 + var(--unit) / 2);
    left: 100%;
  }
  .col-timeline li:nth-child(8n + 1)::after,
  .col-timeline li:nth-child(8n + 2)::after,
  .col-timeline li:nth-child(8n + 3)::after {
    top: calc(var(--height) / 2);
    left: calc(100% + (var(--unit)));
    border: var(--unit) solid transparent;
    border-left-color: inherit;
  }
  .col-timeline li:nth-child(8n + 5)::before,
  .col-timeline li:nth-child(8n + 6)::before,
  .col-timeline li:nth-child(8n + 7)::before {
    top: calc(var(--height) / 2 + var(--unit) / 2);
    left: -1rem;
  }
  .col-timeline li:nth-child(8n + 5)::after,
  .col-timeline li:nth-child(8n + 6)::after,
  .col-timeline li:nth-child(8n + 7)::after {
    top: calc(var(--height) / 2);
    left: -3rem;
    border: var(--unit) solid transparent;
    border-right-color: inherit;
  }
}
/*******/
.typing-demo {
  width: 22ch;
  animation: typing 3s steps(22), blink .5s step-end infinite alternate;
  white-space: nowrap;
  overflow: hidden;
  border-right: 3px solid;
  font-family: monospace;
  font-size: 2em;
}

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

.reveal{
  position: relative;
  transform: translateY(150px);
  opacity: 0;
  transition: 1s all ease;
}

.reveal.active{
  transform: translateY(0);
  opacity: 1;
}