body {
	font-family: 'Poppins', sans-serif;
	color: #222;
	overflow-x: hidden;
}
a {
	text-decoration: none;
}
.navbar {  
	padding-top: .15rem;
	padding-bottom: .15rem;
}
.nav-link {
	color: rgba(0,0,0,.55);
	font-weight: 500;
}
.tw-shadow {
	text-shadow: 0px 0px 8px #fff;
}
.dao-top-section {
	height: 100%;
	padding: 2rem 1rem 10rem;
	position: relative;
	background: #ECF7FB url(https://cdn.vnoc.com/background/bg-dao-whiteblue.jpg);
	background-size: cover;
	background-position: center;
	z-index: 1;
}
.alert-primary-top {
	color: #fff;
	background-color: #283075;
	border-color: ##283075;
	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 {
	font-family: 'Poppins', sans-serif;
	letter-spacing: -0.05rem;
	width: 100%;
	font-size: 5.15rem;
	line-height: 1.25;
	font-weight: 900;
	margin-top: 0rem;
	margin-bottom: 1.5rem;
	color: #2C2C2C;
}
.col-top-desc {
	margin-bottom: 100px;
}
.col-top-desc p {
	font-size: 2rem;
	font-weight: 700;
	font-family: 'Roboto', sans-serif;
	line-height: 1.25;
}
.col-top-buttons .btn-primary {
	border: 5px solid #1060d7;
	border-radius: .85rem;
}
.col-top-buttons .btn-success {  
	border: 5px solid #07ac60;
	border-radius: .85rem;
}
.ctt-highlight {
	color: #4A90E2;
}
.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: #0495FD;
}
.nf-top-desc {
	font-weight:500;
	font-size:.80rem;
	text-transform:uppercase
}
.col-search h4 {
	color: #050C40;
}
.ig-custom {
	border-radius: 1.25rem;
	padding: .5rem .5rem .5rem;
	background: #D8EDF9;
}
a.col-top-domains {
	display: block;
	margin-bottom: 10px;
	background: #D8EDF9;
	color: #333333;
	padding: 10px;
	border-radius: 6px;
}
a.col-top-domains:hover {
	display: block;
	background: #ADDCF7;
}
span.dna-highlight-value {
	color: #0495FD;
	font-weight: 700;
	font-size: 1.35rem;
}
.col-animation-top {
	position: absolute;
	right: -7%;
	top: 18%;
	z-index: -1;
}
.dao-mid-section {
	background: #F8F8FF;
	padding: 6rem 1rem 6rem;
}
.dao-mid-section h2 {
	font-size: 3.85rem;
	font-weight: 900;
	margin-top: 0rem;
	color: #2C2C2C;
}
.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: #534741
}
.col-sub-amount {
	font-weight: 800;
	font-size: 3rem;
	color: #0495FD
}
.tokensale-section h2 {
	font-size: 3.85rem;
	font-weight: 900;
	margin-top: 0rem;
	color: #2C2C2C;
}
.solve-section {
	position: relative;
	padding: 8rem 1rem 8rem;
}
.solve-section h2 {
	font-size: 3.85rem;
	font-weight: 900;
	margin-top: 0rem;
	color: #2C2C2C;
}
.solve-section .feature-icon img {
	margin-bottom:15px
}
.solve-box h6 {
	font-weight:600;
	color: #756D28;
}
.solve-box .feature {
	background:#fff;
	box-shadow:0 0 8px #ddd;
	padding:1rem;
	border-radius:2px
}
.apps-section .feature-icon img {
	margin-bottom:15px
}
.apps-section .feature {
	margin-bottom:2rem
}
.apps-section h6 {
	font-weight:600;
	color: #756D28;
}
.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: 900;
	margin-top: 0rem;
	color: #2C2C2C;
}
#howitworks2 {
	background: #F8F8FF;
}
.how-box h6 {
	color: #756D28;
}
.marketplace-section {
	position: relative;
	padding: 8rem 1rem 8rem;
}
.marketplace-section h2 {
	font-size: 3.85rem;
	font-weight: 900;
	margin-top: 0rem;
	color: #2C2C2C;
}
.market2 {
	background: #F8F8FF;
}
.img-border {
	box-shadow: 0 0 8px #ddd;
	border-radius: 6px;
	margin-bottom: 20px;
	padding: 8px;
}
.answer-section {
	position: relative;
	padding: 6rem 1rem 8rem;
	background: #F8F8FF;
}
.answer-section h2 {
	font-size: 2.25rem;
	font-weight: 600;
	color: #2C2C2C;
}
#blog-container .card {
	border: none;
}
.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;
	z-index: 999;
}
.col-backtop .bi {
	font-size: 2rem;
}
@media (max-width: 1199.98px) { 
	.col-top-title h1 {
		font-size: 4.55rem;
	}	
}
@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.25rem;
  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%);
  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;
  }
}
