/* 27374D, 526D82, 9DB2BF, DDE6ED */

    .td-body {
      overflow-y: hidden;
      margin:0;
      font-family: Poppins;
      color: white;
      background-color: #27374D;
    }

    .td-bg {
      display: flex;
      justify-content: center;
    }

    .td-bg-img {
      position: fixed;
      width:auto;
      height:80vh;
      opacity: .03;
      margin:10vh;
      z-index: -1000;
    }

    /* Header css */

    .td-hdr {
      background-color: #27374D;
      height: 65px;
      border-bottom: 1px solid #526D82;
      box-shadow: 0px 0px 10px #526D82;
      display: flex;
      justify-content: center;
      position: relative;
      z-index: 1000;
    }

    .td-menu-btn {
      width:34px;
      height:34px;
      border-radius:5px;
      border-color: transparent !important;
      background-color: #526D82;
      color:white;
      left:10px;
      box-sizing: content-box;
      padding: 0;
      position: absolute;
      top:15px;
      display: none;
    }

    .td-menu-btn:hover {
      filter: drop-shadow(0 0 7px #DDE6ED);
    }

    .td-menu-icon {
      fill:white;
      margin:3px;
    }

    .td-topbar, .td-midbar, .td-btmbar {
      -webkit-transition: all .35s linear;
      -moz-transition: all .35s linear;
      -o-transition: all .35s linear;
      transition: all .35s linear;
    }

    .td-menu-btn.open .td-topbar {
      -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
      transform: rotate(45deg);
    }
    
    .td-menu-btn.open .td-btmbar {
      -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
      transform: rotate(-45deg);
    }

    .td-menu-btn.open .td-midbar {
      width:0;
      opacity: 0; 
    }

    .td-menu {
      margin: auto;
      width: 500px;
      height: 65px;
      display: flex;
      justify-content: space-evenly;
      background-color: none;
      border-right:none;
      box-shadow: none;
      position: absolute;
      top:0;
    }

    .td-menu-item {
      font-size: 23px;
      padding-top: 15px;
      color:white;
      text-decoration: none;
      display:flex;
    }

    .td-menu-item:hover {
      filter: drop-shadow(0 0 10px white);
      text-decoration: underline;
      cursor: pointer;
    }

    .td-menu-item.active {
      filter: drop-shadow(0 0 10px white);
      text-decoration: underline;
    }

    .td-logo {
      color:white;
      position: absolute;
      left: 25px;
    }

    .td-img {
      height:45px;
      margin-top:14px;
    }

    .td-connect {
      background-color: white;
      box-sizing: border-box;
      width:165px;
      height:42px;
      border-radius: 21px;
      border-color: #999;
      position: absolute;
      top:15px;
      right:10px;
      font-family: Poppins;
      font-size:18px;
      transition: width 1s;
      cursor: pointer;
      display: none;
    }

    .td-connect:hover{
      filter: drop-shadow(0 0 7px rgba(255,255,255,.6));
    }

    .td-connect-img {
      width:25px;
      height:25px;
      /*margin-top:6px;*/
      position: absolute;
      left:8px;
      top:10px;
      text-align: center;
      font-size: 20px;
    }

    .td-connect-lbl {
      position: absolute;
      left:40px;
      top:8px;
      font-size: 14px;
      width: calc(100% - 47px);
      cursor: pointer;
    }

    .disconnected {
      color: red;
    }

    .connected {
      color: green;
    }

    /* Featured css */

    .td-featured {
      background-color: #FFA500;
      width: 100%;
      height: 65px;
      display:none;
      justify-content: center;
    }

    .td-featured.active {
      display: flex;
    }

    .td-featured-close {
      font-size: 40px;
      padding-top: 12px;
      color:white;
      position: absolute;
      left:20px;
    }

    .td-featured-close span {
      font-family: Poppins;
      font-size: 30px;
      padding-left: 10px;
      position: absolute;
      top:18px;
      font-weight: 100;
    }

    .td-featured-close:hover {
      cursor: pointer;
      filter: drop-shadow(0 0 10px white);
    }

    .td-featured-text {
      font-size: 28px;  
      color:white;
      padding: 11px 30px;
      width:700px;
      justify-content: space-around;
    }
    
    .td-featured-text.large {
      display: flex;
    }
    
    .td-featured-text:hover {
      cursor: pointer;
    }

    .td-featured-text.small {
      display: none;
    }

    /* Content css */

    .td-ct {
      position: absolute;
      width:100%;
      height:calc(100% - 65px); 
      margin:auto;
    }

    .td-ct.listed {
      height:calc(100% - 65px);
    }
    
    .td-ct.featured {
      height:calc(100% - 65px - 65px);
    }
    
    .td-ct.featured.listed {
      height:calc(100% - 65px - 65px);
    }

    .td-ct-cont {
      width:100%;
      height:100%;
      padding: 0px 0px 0px 0px;
      overflow-y: auto;
      overflow-x: hidden;
    }

    .td-ct-cont.listed {
      margin-top:75px;
      height:calc(100% - 75px);
    }

    .td-page-cont {
      width: 100%;
      min-height: 100%;
    }
    
    .td-page {
      font-size:24px; 
      text-align: center;
      width: 100%;
      height: 100%;
      display: none;
      padding-bottom: 50px;
    }
    
    .td-page.active {}
  
    .td-page-title-block {
      color: white;
      width: 100%;
      /* height:40vh; */
      position: relative;
      margin-bottom: 50px;
    }

    .td-page-title-block-img {
      height:70px;
    }

    .td-page-title-block-img-sep {
      font-size: 70px;
      position: relative;
      top: -16px;
      left: 5px;
    }

    .td-page-title {
      padding:40px 0;
      font-weight: bold;
      margin: 0;
      animation: 1s ease-out 1.5s 1 tdTitleHeight forwards;
    }

    @keyframes tdTitleHeight {
      0% {
        padding:40px 0;
      }
      100% {
        padding:105px 0;
      }      
    }

    .td-page-title-img {
      height:120px;
      position: relative;
      top: 10px;
    }

    .td-page-title-img.left {
      /* left:156px; */
      left:-93px;
      top:70px;
      animation: 1s ease-out 1.5s 1 tdTitleImgShiftLeft forwards;
    }

    @keyframes tdTitleImgShiftLeft {
      0% {
        height:120px;
        /* left:156px; */
        left:-93px;
        top:70px;
      }
      100% {
        height: 55px;
        left:0;
        top:10px;
        filter: drop-shadow(0 0 10px white);
      }      
    }

    .td-page-title-img.right {
      /* right:127px; */
      right:-99px;
      top:-70px;
      animation: 1s ease-out 1.5s 1 tdTitleImgShiftRight forwards;
    }

    @keyframes tdTitleImgShiftRight {
      0% {
        height:120px;
        /* right:127px; */
        right:-99px;
        top:-70px;
      }
      100% {
        height: 55px;
        right: 0;
        top: 10px;
        filter: drop-shadow(0 0 10px white);
      }      
    }

    .td-page-title-text {
      position: relative;
      opacity:0;
      /* font-size: 0; */
      font-size:50px;
      animation: 1s ease-out 1.5s 1 tdTitleTextFade forwards;
    }

    @keyframes tdTitleTextFade {
      0% {
        opacity: 0;
        /* font-size: 0; */
      }
      100% {
        opacity: 1;
        /* font-size: 50px; */
      }      
    }
            
    .td-page-sep-nrw {
      width:50%;
      margin: 10px auto 10px auto;
    }

    .td-page-sep-wd {
      width:90%;
      margin: 10px auto 10px auto;
    }
            
    .td-page-subtitle {
      width:70%;
      margin: auto;
      font-size: 30px;
    }

    .td-page-subtitle-img {
      height: 33px;
      position: relative;
      top:6px;
    }

    .td-page-title-intro-img {
      height: 600px;
      filter: drop-shadow(12px -9px 13px white);
    }

    .td-grp-hdr {
      /* width: 575px; */
      font-size: 36px;
      font-weight: bold;
      padding: 15px 10% 0px 10%;
      color: #DDE6ED;
      text-align: left;
      position: relative;
      z-index: 1;
      display:flex;
    }

    .td-grp-hdr span { 
      margin-left: 20px;
      background: #27374D;
      padding: 0 10px; 
    }

    .td-grp-dtl {
      width:80%;
      min-height: 250px;
      display: flex;
      flex-wrap: wrap;
      margin: -26px 10% 50px 10%;
      padding-bottom: 10px;
      border: 1px solid #DDE6ED;
      border-radius: 5px;
      font-size: 12px;
      box-shadow: 0px 0px 7px #DDE6ED;
      position: relative;
    }

    .td-grp-item3, .td-grp-list3 {
      position: relative;
      /* margin: 30px auto auto auto; */
      margin: 30px 10px 20px 10px;
      width: calc((100% - 60px) / 3);
      min-width: 300px;
      min-height: 210px;
    }

    .td-grp-item3 {
      max-width: 500px;
    }

    .td-grp-list3 {
      max-width: 350px;
    }

    .td-grp-item-hdr {
      height:50px;
      width:calc(100% - 30px);
      margin-top: 20px;
      position: absolute;
      z-index: 20;
      font-size: 32px;
      color: #27374D;
      font-weight:bold;
      
      border: 1px solid #9DB2BF;
      border-radius: 5px;
      box-shadow: 3px 3px 5px #27374D;
      background-color: #9DB2BF;
    }

    .td-grp-item-hdr-lock { 
      padding-right: 10px;
    }

    .td-grp-item-hdr-img {
      height:35px;
      position: relative;
      top:6px;
    }

    .td-grp-item-dtl {
      min-height:450px;
      width:calc(100% - 30px);
      margin-left:30px;
      position: relative;
      z-index: 10;
      font-size: 18px;
      padding-top: 65px;
      text-align: left;
      height: calc(100% - 50px);
      border: 1px solid #526D82;
      border-radius: 5px;
      /* box-shadow: 0px 0px 7px #526D82; */
    }

    .td-grp-item-dtl:hover {
      background-color: #526D82;
      /* color:#27374D; */
      font-weight: bold;
    }

    .td-grp-list3.active:hover {
      cursor: pointer;
      filter: drop-shadow(0 0 4px white);
    }

    .td-grp-item-listing {
      min-height:380px;
      width:calc(100% - 30px);
      margin-left:30px;
      position: relative;
      z-index: 10;
      font-size: 18px;
      padding-top: 65px;
      text-align: center;
      height: calc(100% - 50px);
      border: 1px solid #526D82;
      border-radius: 5px;
      background-color: #526D82;
      /* box-shadow: 0px 0px 7px #526D82; */
    }

    .td-grp-item-logo {
      /* height:325px; */
      margin: 30px auto 15px auto;
      filter: drop-shadow(0 0 25px #9DB2BF);
      min-width: 250px;
      max-width: calc(100% - 100px);
    }

    .td-grp-item-banner {
      margin:0 5px 10px 5px;
      padding: 5px 20px;
      font-size: 20px;
      font-weight: bold;
      color:#9DB2BF;
      background-color: #27374D;
    }

    .td-grp-item-dtl-img {
      height:20px;
      position: relative;
      top:4px;
    }

    .td-nft-layout-dg, .td-nft-layout-specs {
      min-width: 600px;
      /* height: 600px; */
      margin: 30px 15px 5px 15px;
      flex:1;
    }

    .td-nft-layout-img {
      width: 400px;
      height: 400px;
    }

    .td-nft-layout-unique {
      width: 400px;
      height: 400px;
      display: none;
    }

    .td-nft-layout-body, .td-nft-layout-slide, .td-nft-layout-quote, .td-nft-layout-podium {
      stroke-width: 4;
      stroke: #DDE6ED;
      fill:none;
      display: none;
    }

    .td-nft-layout-body.fill, .td-nft-layout-slide.fill, .td-nft-layout-quote.fill, .td-nft-layout-podium.fill {
      fill:#DDE6ED;
    }

    .td-nft-layout-body.text, .td-nft-layout-slide.text, .td-nft-layout-quote.text, .td-nft-layout-podium.text {
      fill:#DDE6ED;
      font-size: 26px;
      stroke: none;
    }

    .td-nft-layout-dtl-hdr {
      width: 575px;
      font-size: 20px;
      padding: 15px 15px 0px 15px;
      color: #9DB2BF;
      text-align: left;
      position: relative;
      z-index: 1;
    }

    .td-nft-layout-dtl-hdr span {
      margin-left: 20px;
      background: #27374D;
      padding: 0 10px;
    }

    .td-nft-layout-dtl-img {
      height: 20px;
      position: relative;
      top: 4px;
      left: 26px;
      padding-left:5px;
      background-color: #27374D;
    }

    .td-nft-layout-dtl {
      /* width:100%; */
      margin: -15px 15px 5px 15px;
      display: flex;
      flex-wrap: wrap;
      border: 2px solid #9DB2BF;
      border-radius: 5px;
      padding-bottom:10px;
      padding-top:15px;
    }

    .td-nft-layout-dtl:hover {
      background-color: #526D82;
    }

    .td-nft-layout-grp {
      position: relative;
      margin: 15px 15px 0px 15px;
      min-width: 175px;
      text-align: left;
      flex:1;
    }

    .td-nft-layout-grp.long {
      /* min-width: 575px; */
      min-width: 100%;
    }

    .td-nft-layout-label {
      position: absolute;
      left: 0;
      top: -7px;
      color: #9DB2BF;
      background-color: transparent;
      z-index: 10;
      font-size: 12px;  
    }
    
    .td-nft-layout-item {
      position: relative;
      padding: 5px 5px 2px 15px;
      width: 100%;
      outline: 0;
      border: 0;
      color: #DDE6ED;
      /* box-shadow: 0 1px 0 0 #9DB2BF; */
      margin-top: 10px;
      background-color: transparent;
      font-size: 20px;
    }

    .td-nft-layout-item span {
      font-size: 10px;
      top: -5px;
      position: relative;
      padding-left: 5px;
    }

    .td-nft-layout-text {
      margin: 7px 15px 0 15px;
      text-align: left;
      font-size: 13px;
    }

    /* Listing */

    .td-list-banner {
      height: 75px;
      width: 100%;
      background-color: #526D82;
      display: flex;
      justify-content: center;
      position: fixed;
      margin-top:-75px;
    }
    
    .td-list-back {
      font-size: 40px;
      padding-top: 17px;
      color:white;
      position: absolute;
      left:20px;
    }

    .td-list-back span {
      font-family: Poppins;
      font-size: 30px;
      padding-left: 10px;
      position: absolute;
      top:23px;
      font-weight: 100;
    }

    .td-list-back:hover {
      cursor: pointer;
      filter: drop-shadow(0 0 10px white);
    }

    .td-list-banner-text {
      font-size: 33px;  
      color:white;
      padding: 11px 30px;
      font-weight: bold;
      width:300px;
      display: flex;
      justify-content: space-around;
    }

    .td-list-banner-flag {
      width:40px;
      height:30px;
      background-repeat: no-repeat;
      margin-top: 9px;
    }

    .td-buy-now-hdr, .td-buy-now-ftr {
      background-color: white;
      box-sizing: border-box;
      width:135px;
      height:42px;
      border-radius: 21px;
      border-color: #999;
      position: absolute;
      right:10px;
      font-family: Poppins;
      font-size:18px;
      transition: width 1s;
      cursor: pointer;
    }

    .td-buy-now-hdr {
      top:17px;
    }
    
    .td-buy-now-ftr {
      top:15px;
    }

    .td-mint-btn {
      background-color: white;
      box-sizing: border-box;
      width:135px;
      height:42px;
      border-radius: 21px;
      border-color: #999;
      position: relative;
      font-family: Poppins;
      font-size:18px;
      transition: width 1s;
      cursor: pointer;
      margin: 35px auto;
    }

    .td-buy-now-hdr:hover, .td-buy-now-ftr:hover, .td-mint-btn:hover{
      filter: drop-shadow(0 0 10px white);
    }

    .td-buy-now-ftr{
      display:none;
    }

    .td-buy-now-img {
      width:25px;
      height:25px;
      /*margin-top:6px;*/
      position: absolute;
      left:8px;
      top:10px;
      text-align: center;
      font-size: 20px;
      color:#526D82;
    }

    .td-buy-now-lbl {
      position: absolute;
      left:40px;
      top:5px;
      font-size: 18px;
      width: calc(100% - 47px);
      color:#526D82;
    }

    .td-buy-now-mobile {
      display:none;
    }

    .td-mint-btn-lbl {
      /* position: absolute;
      left:40px;
      top:5px; */
      font-size: 18px;
      font-weight: bold;
      color:#526D82;
    }

    .td-opensea-hdr {
      position: absolute;
      right: 170px;
      top: 13px;
    }

    .td-opensea-ftr {
      position: absolute;
      left: 20px;
      top: 9px;
      display:none;
    }

    .td-opensea-hdr:hover, .td-opensea-ftr:hover{
      filter: drop-shadow(0 0 10px white);
    }

    .td-opensea-hdr-img {
      width: 140px;
      border-radius: 5px;
      box-shadow: 0px 1px 6px rgba(0, 0, 0, 0.25);
    }

    .td-opensea-ftr-img {
      width: 116px;
      border-radius: 5px;
      box-shadow: 0px 1px 6px rgba(0, 0, 0, 0.25);
    }

    .td-list-hdr {
      display:flex;
      width:100%;
      flex-wrap:wrap;
    }

    .td-list-pfp-cont {
      width: 400px;
      height: 720px;
      position: relative;
      margin: 0 25px;
      display: flex;
      min-width: 300px;
    }

    .td-list-pfp-top {
      position: absolute;
      bottom: 500px;
      width: 100%;
      height: 50px;
      z-index: 100;
      border-left: 1px solid #dde6ed;
      border-top: 1px solid #dde6ed;
      border-right: 1px solid #dde6ed;
      border-top-left-radius: 5px;
      border-top-right-radius: 5px;
      box-shadow: 0px 0px 7px #DDE6ED;
      clip-path: inset(-7px -7px 0px -7px);
    }

    .td-list-pfp-img {
      width: calc(100% - 50px);
      position: absolute;
      z-index: 150;
      bottom: 0;
      left: 25px;
      filter: drop-shadow(3px -8px 12px #9DB2BF66);
      flex:1;
    }

    .td-list-pfp-btm {
      position: absolute;
      z-index: 200;
      width: 100%;
      height: 500px;
      bottom: 0;
      border-left: 1px solid #dde6ed;
      border-bottom: 1px solid #dde6ed;
      border-right: 1px solid #dde6ed;
      border-bottom-left-radius: 5px;
      border-bottom-right-radius: 5px;
      box-shadow: 0px 0px 7px #DDE6ED;
      clip-path: inset(0px -7px -7px -7px);
    }

    .td-list-info {
      flex:1;
      margin: 90px 25px 0 25px;
      border: 1px solid #dde6ed;
      border-radius: 5px;
      box-shadow: 0px 0px 7px #DDE6ED;
      min-width: 650px;
      padding-bottom:10px;
    }
    
    .td-list-info-hdr {
      width:100%;
      height:75px;
      background-color: #9DB2BF;
      border-top-left-radius: 5px;
      border-top-right-radius: 5px;
      text-align: left;
    }

    .td-list-info-hdr-text{
      font-size: 33px;  
      color:#27374D;
      padding: 11px 30px;
      font-weight: bold;
    }

    .td-list-info-hdr-img {
      height: 36px;
      position: relative;
      top: 8px;
    }

    .td-list-info-dtl-hdr {
      width: 575px;
      font-size: 20px;
      padding: 15px 15px 0px 15px;
      color: #9DB2BF;
      text-align: left;
      position: relative;
      z-index: 1;
    }

    .td-list-info-dtl-hdr span {
      margin-left: 20px;
      background: #27374D;
      padding: 0 10px;
    }

    .td-list-info-dtl-img {
      height: 20px;
      position: relative;
      top: 4px;
      left: 26px;
      padding-left:5px;
      background-color: #27374D;
    }

    .td-list-info-dtl {
      /* width:100%; */
      margin: -15px 15px 5px 15px;
      display: flex;
      flex-wrap: wrap;
      border: 2px solid #9DB2BF;
      border-radius: 5px;
      padding-bottom:10px;
      padding-top:15px;
    }

    .td-list-info-grp {
      position: relative;
      margin: 15px 15px 0px 15px;
      min-width: 175px;
      text-align: left;
      flex:1;
    }

    .td-list-info-grp.long {
      /* min-width: 575px; */
      min-width: 100%;
    }

    .td-list-info-label {
      position: absolute;
      left: 0;
      top: -7px;
      color: #9DB2BF;
      background-color: transparent;
      z-index: 10;
      font-size: 12px;  
    }
    
    .td-list-info-item {
      position: relative;
      padding: 5px 5px 2px 15px;
      width: 100%;
      outline: 0;
      border: 0;
      color: #DDE6ED;
      /* box-shadow: 0 1px 0 0 #9DB2BF; */
      margin-top: 10px;
      background-color: transparent;
      font-size: 20px;
    }

    .td-list-info-item span {
      font-size: 10px;
      top: -5px;
      position: relative;
      padding-left: 5px;
    }

    .td-list-info-img {
      height: 22px;
      position: relative;
      top: 3px;
      margin-left: -10px;
    }

    .td-list-chart {
      max-width:150px;
      height: 210px;
      margin: 5px 15px 0 15px;
      flex:1;
    }

    .td-list-score {
      max-width: 150px;
      margin: 17px 15px 0 15px;
      flex:1;
    }

    .td-list-score-cont {
      border: 2px solid #9DB2BF;
      border-radius: 25px;
      padding:10px;
    }

    .td-list-score-cont.green {
      border-color: #43AA8B;
    }

    .td-list-score-cont.yellow {
      border-color: #F9C74F;
    }

    .td-list-score-cont.red {
      border-color: #F94144;
      box-shadow: 0px 0px 7px #F94144;
    }

    .td-list-score-img {
      height:30px;
      position: relative;
      top:6px;
    }

    .td-list-score-rank {
      font-size: 30px;
      position: relative;
    }

    .td-list-score-rank.green {
      color: #43AA8B;
    }

    .td-list-score-rank.yellow {
      color: #F9C74F;
    }

    .td-list-score-rank.red {
      color: #F94144;
    }

    .td-list-score-value {
      font-size: 50px;
      position: relative;
      font-weight: bold;
    }

    .td-list-score-value.green {
      color: #43AA8B;
    }

    .td-list-score-value.yellow {
      color: #F9C74F;
    }

    .td-list-score-value.red {
      color: #F94144;
    }

    .td-list-summary {
      margin: 17px 15px 0 15px;
      flex:1;
      text-align: left;
      font-size: 13px;
    }

    .td-list-copy, .td-list-link {
      padding-left:10px;
      color: #DDE6ED;
    }

    .td-list-copy:hover, .td-list-link:hover {
      filter: drop-shadow(0 0 10px white);
      cursor: pointer;
    }

    .td-list-copy-addr {
      display: contents;
    }

    .td-list-copy-lbl {
      position: absolute;
      top: -22px;
      color: #27374D;
      background-color: transparent;
      z-index: 10;
      font-size: 12px;
      margin-left:-12px;
      background-color: #DDE6ED;
      padding: 3px 6px;
      border-radius: 3px;
      font-weight: bold;
      display:none;
    }

    .td-list-icon {
      padding-right:5px;
    }

    .td-list-nft-summary {
      margin: 7px 15px 0 15px;
      flex:1;
      text-align: left;
      font-size: 13px;
    }

    .td-list-nft-summary-text {
      margin: 0px 0px 8px 0px;
    }

    .td-list-text {
      margin: 7px 15px 0 15px;
      text-align: left;
      font-size: 13px;
    }

    .td-list-img {
      height:485px;
      float: left;
      border-radius: 10px;
    }

    .td-list-sub-grp {
      display: flex;
      width: 100%;
      flex-wrap: wrap;
      padding: 15px;
    } 

    .td-ptnr, .td-aso {
      padding:20px;
    }

    .td-ptnr-img, .td-aso-img {
      max-height:100px;
      max-width:100%
    }
    
    /* Footer */

    .td-ftr {
      width:100%;
      height:250px;
      display: flex;
      position: relative;
      justify-content: center;
    }

    .td-pwr {
      font-size: 28px;
      position: absolute;
      left:5%;
      bottom:104px;
    }

    .td-pwr-img {
      height: 30px;
      position: relative;
      top:6px;
    }

    .td-pwr-img:hover {
      filter: drop-shadow(0 0 10px white);
      cursor: pointer;
    }

    .td-ftr-logo {
      justify-content: center;
      height:150px;
      margin-top:50px;
    }

    .td-socials {
      position: absolute;
      right:5%;
      bottom:111px;
      display: flex;
      flex-wrap: wrap;
      max-width: 40%;
      justify-content: center;
    }

    .td-link {
      text-decoration: none;
    }

    .td-icon {
      font-size: 28px;
      color: white;
      padding-left: 15px;
      padding-top: 15px;
    }

    .td-icon:hover {
      filter: drop-shadow(0 0 10px white);
    }
      
    /* Pop-up css */

    .td-mint, .td-wl, .td-ld, .td-err, .td-help, .td-info {
      position: fixed;
      top:0;
      left:0;
      width: 100%;
      height: 100%;
      z-index: 99999;
      background-color: rgba(115, 147, 153, .7);
      justify-content: center;
      align-items: center;
      display: none;
    }

    .td-err-exit {
      color:rgba(223, 171, 171, 1);
      position: absolute;
      right:5px;
      top:5px;
      font-size:30px;
    }

    .td-err-exit:hover {
      text-shadow:0 0 10px rgba(223, 171, 171, 1);
      cursor: pointer;
    }

    .td-mint-exit, .td-wl-exit, .td-help-exit, .td-info-exit {
      color:#DDE6ED;
      position: absolute;
      right:5px;
      top:5px;
      font-size:30px;
    }

    .td-mint-exit:hover, .td-wl-exit:hover, .td-help-exit:hover, .td-info-exit:hover {
      text-shadow:0 0 10px #DDE6ED;
      cursor: pointer;
    }

    .td-mint-cnt{
      position: absolute;
      width: 600px;
      height: 600px;
      border-radius: 5px;;
      z-index: 100000;
      background-color: #27374D;
    }

    .td-mint-img-cnt {
      position: absolute;
      width: 600px;
      height: 600px;
      display: flex;
      justify-content: center;
      align-items: center;
    }

    .td-mint-img {
      /* position: fixed; */
      width: 80%;
      height: 80%;
      opacity: .03;
      /* margin: 10vh; */
      z-index: -1000;
    }

    .td-ld-cnt, .td-err-cnt, .td-help-cnt, .td-info-cnt {
      position: absolute;
      width: 400px;
      min-height: 250px;
      max-height: 80%;
      border-radius: 5px;;
      z-index: 100000;
      background-color: #27374D;
    }

    .td-wl-cnt {
      position: absolute;
      width: 400px;
      min-height: 250px;
      max-height: 80%;
      border-radius: 5px;;
      z-index: 100000;
      background-color: #27374D;
      overflow-y: hidden;
      height:100%;
    }

    .td-err-lbl {
      color:rgba(223, 171, 171, 1);
      /* text-shadow:0 0 10px rgba(223, 171, 171, 1); */
      padding:10px;
      text-align: center;
      font-size:30px;
    }

    .td-err-msg {
      color:rgba(223, 171, 171, 1);
      padding:15px;
      text-align: left;
      font-size:18px;
      white-space: pre-line;
      min-height:185px;
      max-height: 60%;
      overflow-y:scroll;
    }

    .td-mint-lbl, .td-wl-lbl, .td-ld-lbl, .td-help-lbl, .td-info-lbl {
      color:#DDE6ED;
      /* text-shadow:0 0 10px #DDE6ED; */
      padding:10px;
      text-align: center;
      font-size:30px;
    }

    .td-mint-msg {
      height:calc(100% - 65px);
      overflow-x: hidden;
      overflow-y: auto;
      width: 50%;
      text-align: center;
    }

    .td-mint-msg.left{
      float: left;
    }
    
    .td-mint-msg.right{
      float: right;
    }

    .td-wl-msg {
      height:calc(100% - 65px);
      overflow-y: auto;
    }

    .td-help-msg, .td-info-msg {
      color:#DDE6ED;
      padding:15px;
      text-align: left;
      font-size:18px;
      white-space: pre-line;
      min-height:185px;
      max-height: 60%;
      overflow-y:scroll;
    }

    .td-err-msg::-webkit-scrollbar-track {
      /* background: rgba(166, 178, 180,1); */
      box-shadow: rgba(166, 178, 180, 0) 0px 0px 2px inset;
      border-radius: 6px;
    }

    .td-err-msg::-webkit-scrollbar-thumb {
      background: rgba(223, 171, 171, 1);
      border-radius: 4px;
    }

    .td-help-msg::-webkit-scrollbar-track, .td-info-msg::-webkit-scrollbar-track {
      /* background: rgba(166, 178, 180,1); */
      box-shadow: rgba(166, 178, 180, 0) 0px 0px 2px inset;
      border-radius: 6px;
    }

    .td-help-msg::-webkit-scrollbar-thumb, .td-info-msg::-webkit-scrollbar-thumb {
      background: rgba(171, 223, 223, 1);
      border-radius: 4px;
    }

    .td-mint-grp {
      position: relative;
      margin: 25px 15px 0px 15px;
      min-width: 250px;
      text-align: left;
      flex:1;
      border: solid 1px white;
      border-radius: 5px;
      padding: 5px 10px 10px 10px;
    }

    .td-mint-label {
      position: absolute;
      left: 0;
      top: -10px;
      color: white;
      background-color: #27374D;
      z-index: 10;
      font-size: 14px;  
      left:15px;
      padding: 0 5px;
    }
    
    .td-mint-item {
      position: relative;
      padding: 10px;
      width: calc(100% - 20px);
      outline: 0;
      border: 0;
      color: #27374D;
      /* box-shadow: 0 1px 0 0 #9DB2BF; */
      margin-top: 10px;
      background-color: #DDE6ED;
      font-size: 20px;
      text-align: right;
    }
    
    .td-mint-item.readonly {
      color: #DDE6ED;
      background-color: transparent;
    }

    .td-mint-item.check {
      height:24px;
    }

    .td-mint-item span {
      font-size: 10px;
      top: -5px;
      position: relative;
      padding-left: 5px;
    }

    .td-mint-note {
      font-size: 12px;
      padding-top:10px;
    }

    .td-mint-desc {
      font-size: 14px;
      padding-top:10px;
    }

    .td-mint-submit {
      width: 175px;
      height: 50px;
      margin: 20px auto;
      font-family: Poppins;
      font-size: 20px;
      background-color: #9DB2BF;
      color:#27374D;
      border-radius: 5px;
    }

    .td-ld-ring {
      margin-top:20px;
      position:absolute;
      top:50%;
      left:50%;
      transform:translate(-50%,-50%);
      width:150px;
      height:150px;
      background:transparent;
      border:3px solid #3c3c3c;
      border-radius:50%;
      text-align:center;
      line-height:150px;
      font-size:20px;
      color:rgba(171, 223, 223, 1);
      letter-spacing:4px;
      text-transform:uppercase;
      text-shadow:0 0 10px rgba(171, 223, 223, 1);
      box-shadow:0 0 20px rgba(0,0,0,.5);
    }

    .td-ld-ring:before {
      content:'';
      position:absolute;
      top:0px;
      left:0px;
      width:100%;
      height:100%;
      border:3px solid transparent;
      border-top:3px solid rgba(171, 223, 223, 1);
      border-right:3px solid rgba(171, 223, 223, 1);
      border-radius:50%;
      animation:animateC 2s linear infinite;
    }

    .td-ld-ring-dot {
      display:block;
      position:absolute;
      top:calc(50% - 2px);
      left:50%;
      width:50%;
      height:4px;
      background:transparent;
      transform-origin:left;
      animation:animate 2s linear infinite;
    }

    .td-ld-ring-dot:before {
      content:'';
      position:absolute;
      width:16px;
      height:16px;
      border-radius:50%;
      background:rgba(171, 223, 223, 1);
      top:-6px;
      right:-8px;
      box-shadow:0 0 20px rgba(171, 223, 223, 1);
    }

    @keyframes animateC {
      0%
      {
        transform:rotate(0deg);
      }
      100%
      {
        transform:rotate(360deg);
      }
    }

    @keyframes animate {
      0%
      {
        transform:rotate(45deg);
      }
      100%
      {
        transform:rotate(405deg);
      }
    }

    ::-webkit-scrollbar{
      width: 7px;
      height: 7px;
    }

    ::-webkit-scrollbar-thumb {
      background: rgba(5,9,8,.3);
      border-radius: 4px;
    }

    ::-webkit-scrollbar-track {
      box-shadow: rgba(166, 178, 180,1) 0px 0px 2px inset;
      border-radius: 6px;
    }

    .coming-soon { 
      color:white;
      font-size:120px; 
      text-shadow: 0 0 10px white;
      text-align: center;
      width: 100%;
      padding-top: calc((100vh / 2) - 185px);
    }

    .td-flag {
      width:40px;
      height:30px;
      margin-top: 11px;
      padding-right: 10px;
      background-color: #27374D;
      background-repeat: no-repeat;
    }

    .pressed{
      transform: translate(2px, 2px);
      box-shadow: none;
    }

    .copyright {
      display:flex;
      align-items: center;
      padding:0;
      box-sizing: border-box;
      height:35px;
      padding-left: 20px;
      position: absolute;
      bottom: 35px;
      left:5%;
      color: white;
      font-size: 13px;
    }

    .td-cr-icon {
      padding-right:5px;
    }

    .td-cr-text {

    }

    /* submission */

    .td-form-dtl {
      /* width:100%; */
      display: flex;
      flex-wrap: wrap;
      padding-bottom:20px;
    }

    .td-form-grp {
      position: relative;
      margin: 25px 15px 0px 15px;
      min-width: 250px;
      text-align: left;
      flex:1;
      border: solid 1px white;
      border-radius: 5px;
      padding: 5px 10px 10px 10px;
    }

    .td-form-label {
      position: absolute;
      left: 0;
      top: -10px;
      color: white;
      background-color: #27374D;
      z-index: 10;
      font-size: 12px;  
      left:15px;
      padding: 0 5px;
    }
    
    .td-form-item {
      position: relative;
      /* padding: 10px; */
      width: calc(100% - 10px);
      outline: 0;
      border: 0;
      color: #DDE6ED;
      /* box-shadow: 0 1px 0 0 #9DB2BF; */
      margin-top: 10px;
      background-color: #27374D;
      font-size: 20px;
    }

    .td-form-item.check {
      height:24px;
    }

    .td-form-item span {
      font-size: 10px;
      top: -5px;
      position: relative;
      padding-left: 5px;
    }

    .td-form-note {
      font-size: 12px;
      padding-top:10px;
    }

    .td-form-submit {
      width: 175px;
      height: 50px;
      margin: 20px auto;
      font-family: Poppins;
      font-size: 20px;
      background-color: #9DB2BF;
      color:#27374D;
      border-radius: 5px;
    }


    @media only screen and (max-width: 450px) {
      .td-menu-btn {
        display: initial;
      }

      .td-menu {
        width:0px;
        height:calc(100vh - 65px);
        background-color: #526D82;
        border-right: 1px solid #526D82;
        box-shadow: 0px 0px 10px #526D82;
        position: absolute;
        top:65px;
        left:0;
        z-index: 100;
        -webkit-transition: width 1s;
        -moz-transition: width 1s;
        -o-transition: width 1s;
        transition: width 1s;
        display:block;
      }

      .td-menu-item{
        opacity: 0;
        visibility:hidden;
        width:0;
        overflow-x: hidden;
        padding:7px 0 7px 10px;
      }
      
      .td-menu-item.active {
        text-decoration: none;
        font-weight: bold;
        color:#27374D;
        filter: drop-shadow(0 0 10px #27374D);
        border-right: 5px solid #9DB2BF !important;
        background-color: #DDE6ED;
      }

      .td-menu-item.visible {
        animation: 1s 0s 1 visibileMenuItem forwards;      
      }

      @keyframes visibileMenuItem {
        0% {
          opacity: 0;
          visibility:hidden;
          width:0;
        }
        /* 50% {
          opacity:0.5;
          visibility:initial;
          width:90px;
        } */
        100% {
          opacity: 1;
          visibility:initial;
          width:180px;
        }
      }

      .td-menu-item.hidden {
        animation: 1s 0s 1 hiddenMenuItem forwards;      
      }

      @keyframes hiddenMenuItem {
        0% {
          opacity: 1;
          visibility:initial;
          width:180px;
        }
        /* 50% {
          opacity:0.5;
          visibility:initial;
          width:90px;
        } */
        100% {
          opacity: 0;
          visibility:hidden;
          width:0;
        }
      }
    
      .td-logo {
        left: 65px;
      }

      .td-connect {
        width:70px;
      }

      .td-connect-img {
        font-size: 14px;
        top:5px;
        left:21px;
      }

      .td-connect-lbl {
        font-size: 10px;
        bottom:2px;
        top:initial;
        left:12px;
      }
      
      @keyframes tdTitleHeight {
        0% {
          padding:40px 0;
        }
        100% {
          padding:79px 0;
        }      
      }

      .td-featured {
        height:60px;
        justify-content: right;
      }

      .td-featured-close {
        font-size: 28px;
        padding-top: 16px;
      }

      .td-featured-close span {
        font-size: 20px;
        top:20px;
      }
      
      .td-featured-text {
        font-size: 18px;  
        max-width: calc(100% - 140px);
        line-height: 1.2;
        text-align: right;
        padding: 10px 20px;
        justify-content: right;
      }
      
      .td-featured-text.large {
        display:none;  
      }
      
      .td-featured-text.small {
        display:flex;  
      }

      .td-ct.listed {
        height:calc(100% - 65px - 60px); 
      }

      .td-ct.featured.listed {
        height:calc(100% - 65px - 60px - 60px); 
      }

      .td-ct-cont.listed {
        margin-top: 60px;
        height: calc(100% - 60px);
      }

      .td-page-title-text {
        font-size: 37px;
      }

      .td-page-title-img {
        height:80px;
      }

      .td-page-title-img.left {
        /* left:156px; */
        left:-56px;
        top:47px;
        animation: 1s ease-out 1.5s 1 tdTitleImgShiftLeft forwards;
      }

      @keyframes tdTitleImgShiftLeft {
        0% {
          height:80px;
          /* left:156px; */
          left:-56px;
          top:47px;
        }
        100% {
          height: 41px;
          left:0;
          top:8px;
          filter: drop-shadow(0 0 10px white);
        }      
      }

      .td-page-title-img.right {
        /* right:127px; */
        right:-70px;
        top:-47px;
        animation: 1s ease-out 1.5s 1 tdTitleImgShiftRight forwards;
      }

      @keyframes tdTitleImgShiftRight {
        0% {
          height:80px;
          /* right:127px; */
          right:-70px;
          top:-47px;
        }
        100% {
          height: 41px;
          right: 0;
          top: 8px;
          filter: drop-shadow(0 0 10px white);
        }      
      }

      .td-page-sep-nrw {
        width:65%;
      }
              
      .td-page-subtitle {
        width:80%;
        margin: auto;
        font-size: 20px;
      }

      .td-page-subtitle-img {
        height: 22px;
        position: relative;
        top:4px;
      }

      .td-grp-hdr {
        font-size: 30px;
        padding: 15px 10% 0px 7%;
      }

      .td-grp-dtl {
        width:90%;
        margin:-24px 5% 5px 5%;
      }

      .td-grp-item3, .td-grp-list3 {
        width:calc(100% - 20px);
      }

      .td-grp-item-logo {
        height:250px;
      }

      .td-grp-item-listing {
        min-height: 380px;
      }

      .td-nft-layout-dg, .td-nft-layout-specs {
        min-width: 250px;
      }

      /* Listing */

      .td-list-banner {
        height: 60px;
        justify-content: right;
        margin-top: -60px;
      }

      .td-list-back {
        font-size: 28px;
        padding-top: 16px;
      }

      .td-list-back span {
        font-size: 20px;
        top:20px;
      }

      .td-list-banner-text {
        font-size: 20px;  
        font-weight: bold;
        width:190px;
        line-height: 1;
        text-align: right;
        padding: 10px 20px;
      }

      .td-list-banner-flag {
        margin-top: 6px;
        margin-left: 10px;
      }

      .td-buy-now-hdr {
        display:none;
      }

      .td-buy-now-ftr {
        position: fixed;
        top:auto;
        right:20px;
        bottom:9px;
        z-index: 150;
        display: block;
      }

      .td-buy-now-mobile {
        position: fixed;
        bottom:0;
        width:100%;
        height:60px;
        background-color: #526D82;
        z-index: 100;
        display:none;
      }

      .td-mint-cnt {
        width: 90%;
        overflow-y: auto;
        height: 80%;
      }

      .td-mint-img-cnt {
        width: 90%;
        top: calc((100vh - (100vw * .90)) / 2);
        height: auto;
        position: fixed;
      }

      .td-mint-msg {
        height: auto;
      }

      .td-mint-msg.left, .td-mint-msg.right {
        float: initial;
        width: 100%;
      }

      .td-opensea-hdr {
        display: none;
      }

      .td-opensea-ftr {
        display:block;
      }

      .td-list-pfp-cont {
        height:650px;
      }
      
      .td-list-info {
        min-width: 300px;
        margin: 50px 25px 0 25px;
      }

      .td-list-info-hdr-text{
        font-size: 28px;  
        padding: 16px 20px;
      }

      .td-list-info-hdr-img {
        height: 30px;
        top: 6px;
      }

      .td-list-info-grp {
        margin: 20px 15px 0px 15px;
      }

      .td-list-chart, .td-list-score, .td-list-summary { 
        min-width: calc(100% - 30px);
      }

      /* Footer */

      .td-pwr {
        font-size: 20px;
        bottom:35px;
      }

      .td-pwr-img {
        height: 26px;
      }

      .td-ftr-logo {
        position: absolute;
        margin-top: 0;
        left: 65px;
        height: 125px;
        top: 15px;
      }

      .copyright {
        left:auto;
        right:5%;
      }

      .coming-soon { 
        font-size:80px; 
      }
    }

    @media only screen and (max-width: 400px) {
      .td-list-pfp-cont {
        height:600px;
      }

      .td-pwr {
        font-size: 16px;
      }

      .td-pwr-img {
        height: 22px;
        top: 5px;
      }

      .copyright {
        font-size: 10px;
      }
    }

    /* Universal */

    li {
      padding-right: 18px;
    }

    #content {
      margin-top: 50px;
      text-align: center;
    }

    section.timeline-outer {
      width: 70%;
      margin: 0 auto;
    }

    /* Timeline */

    .timeline {
      border-left: 8px solid #9DB2BF;
      border-bottom-right-radius: 2px;
      border-top-right-radius: 2px;
      box-shadow: 0 2px 5px 0 #9DB2BF29, 0 2px 10px 0 #9DB2BF1F;
      color: #DDE6ED;
      margin: 50px auto;
      letter-spacing: 0.5px;
      position: relative;
      line-height: 1.4em;
      padding: 20px;
      list-style: none;
      text-align: left;
    }

    .timeline h1,
    .timeline h2,
    .timeline h3 {
      font-size: 1.4em;
    }

    .timeline .event {
      border-bottom: 1px solid #9DB2BF33;
      padding-bottom: 15px;
      margin-bottom: 20px;
      position: relative;
    }

    .timeline .event:last-of-type {
      padding-bottom: 0;
      margin-bottom: 0;
      border: none;
    }

    .timeline .event:before,
    .timeline .event:after {
      position: absolute;
      display: block;
      top: 0;
    }

    .timeline .event:before {
      left: -177.5px;
      color: #9DB2BF;
      content: attr(data-date);
      text-align: right;
      /*  font-weight: 100;*/

      font-size: 16px;
      min-width: 120px;
    }

    .timeline .event:after {
      box-shadow: 0 0 0 8px #9DB2BF;
      left: -30px;
      background: #526D82;
      border-radius: 50%;
      height: 11px;
      width: 11px;
      content: "";
      top: 5px;
    }

    @media (max-width: 945px) {
      section.timeline-outer {
        width: 90%;
      }

      .timeline .event::before {
        left: 0.5px;
        top: 20px;
        min-width: 0;
        font-size: 13px;
      }
      .timeline h3 {
        font-size: 16px;
      }
      .timeline p {
        padding-top: 20px;
      }
      section.lab h3.card-title {
        padding: 5px;
        font-size: 16px;
      }
    }

    @media (max-width: 768px) {
      .timeline .event::before {
        left: 0.5px;
        top: 20px;
        min-width: 0;
        font-size: 13px;
      }
      .timeline h3 {
        font-size: 16px;
      }
      .timeline p {
        padding-top: 20px;
      }
    }