@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap");

body {
  margin: 0;
  padding: 0;
  height: 100%;
  width: 100%;
  background: #191c1f;
  overflow-x: hidden;
  color: #ffffff;
  font-family: "Poppins", sans-serif;
}

body::-webkit-scrollbar {
  display: none;
  /* for Chrome, Safari, and Opera */
}

/* ----- The Modal (background) ---- */

.modal-window {
  display: none;
  position: fixed; 
  z-index: 1030;
  left: 0;
  top: 0;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  background-color: #191c1f;
  background: rgba(36, 40, 44, 0.57);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

/* Modal Content/Box */
.modal-window-content {
  float: right;
  color: #ffffff;
  background: #191c1f;
  margin: 15px 20px;
  padding: 20px 15px;
  height: 94vh;
  border-radius: 20px;
  width: 30%;
  overflow: auto;
  overflow-x: hidden;

  box-shadow: 0px 0px 15px 5px rgba(0, 0, 0, 0.4);
  -webkit-box-shadow: 0px 0px 15px 5px rgba(0, 0, 0, 0.4);
  -moz-box-shadow: 0px 0px 15px 5px rgba(0, 0, 0, 0.4);
}

.modal-window-content::-webkit-scrollbar {
  display: none;
  /* for Chrome, Safari, and Opera */
}

.account-tab {
  padding: 5px 0;
}

.account-tab .btn {
  background: #222528;
  border: 1px solid #222528;
}

.account-tab .acct-tab-profile {
  display: flex;
  flex-direction: row;
  flex: auto;
  justify-content: space-between;
  margin-bottom: 20px;
}

.account-tab .acct-tab-profile .profile-container {
  display: flex;
  flex: auto;
  flex-direction: row;
}

.account-tab .acct-tab-profile .profile-container .profile-img img {
  margin-top: 10px;
  width: 40px;
  height: 40px;
  border-radius: 20px;
  margin-right: 15px;
}

.account-tab .acct-tab-profile .profile-container .profile-info p {
  margin: 0;
  padding: 0;
}

.account-tab .acct-tab-profile .profile-container .profile-info p.username {
  font-size: 20px;
  font-weight: 600;
  text-transform: lowercase;
}

.account-tab .acct-tab-profile .profile-container .profile-info p a {
  text-decoration: none;
  font-size: 13px;
  font-weight: 600;
  color: #aaaaaa;
}

.account-tab .acct-tab-profile .minimize-modal .btn {
  border-radius: 10px;
  background: transparent;
  font-size: 15px;
  border: 0 solid transparent;
  color: #aaaaaa;
  padding: 8px 12px;
}

.account-tab .acct-tab-profile .minimize-modal .btn:hover {
  border-radius: 10px;
  background: #3d4145;
  font-size: 16px;
  border: 0 solid transparent;
  color: #ffffff;
}

.account-tab .acct-tab-list {
  margin-top: 20px;
}

.account-tab .acct-tab-list ul {
  list-style: none;
  padding-left: 0;
}

.account-tab .acct-tab-list ul li {
  margin: 12px 5px;
}

.account-tab .acct-tab-list ul li a {
  font-size: 26px;
  font-weight: 500;
  text-decoration: none;
  color: #ffffff;
}

.account-tab .connected-wallet {
  margin-top: 30px;
  padding: 5px;
}

.account-tab .connected-wallet .title {
  font-size: 13px;
  font-weight: 500;
  color: #aaaaaa;
}

.account-tab .connected-wallet .wallet-box {
  border: 1px solid #3d4145;
  border-radius: 20px;
  padding: 20px;
}

.account-tab .connected-wallet .wallet-box .wallet-balance {
  border: 1px solid #3d4145;
  border-radius: 10px;
  padding: 10px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  flex: auto;
}

.account-tab .connected-wallet .wallet-box .wallet-balance p {
  margin-bottom: 0;
  padding-bottom: 0;
  font-size: 13px;
  font-weight: 500;
  color: #aaaaaa;
}

.account-tab .connected-wallet .wallet-box .eth-wallets {
  margin-top: 15px;
}

.account-tab .connected-wallet .wallet-box .eth-wallets .eth-address {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.account-tab .connected-wallet .wallet-box .eth-wallets .eth-address .address-section p {
  margin-bottom: 0;
  padding-bottom: 0;
}

.account-tab .connected-wallet .wallet-box .eth-wallets .eth-address .address-section p.title {
  font-size: 13px;
  font-weight: 500;
  color: #aaaaaa;
}

.account-tab .connected-wallet .wallet-box .eth-wallets .eth-address .address-section p.address {
  font-size: 14px;
  font-weight: 500;
  color: #ffffff;
  letter-spacing: 1px;
}


.account-tab .connected-wallet .wallet-box .eth-wallets .eth-address .eth-buttons .btn {
  font-size: 13px;
  border-radius: 12px;
  padding: 8px 12px;
  margin-left: 5px;
}

.account-tab .connected-wallet .wallet-box .eth-wallets .eth-connect-button {
  margin-top: 10px;
}

.account-tab .connected-wallet .wallet-box .eth-wallets .eth-connect-button .btn {
  border-radius: 8px;
  color: #ffffff;
  font-size: 14px;
  font-weight: 500;
  padding: 10px 30px;
}

.account-tab .connected-wallet .wallet-box .wallet-buttons {
  margin-top: 20px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.account-tab .connected-wallet .wallet-box .wallet-buttons .btn {
  font-size: 14px;
  font-weight: 500;
  color: #ffffff;
  padding: 8px 20px;
  border-radius: 10px;
}

.account-tab .logout {
  margin-top: 35px;
  margin-left: 10px;
}

.account-tab .logout .btn {
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 1px;
  border-radius: 10px;
}

/* DASHBOARD SECTIONS AND STYLES STARTS HERE */

/* owners dashboard section */
.dashboard-section {
  padding: 10px 20px 20px;
  top: 80px;
  position: relative;
}

.owner-section {
  padding: 0 15px 20px;
}

.owner-section .owner-profile-images {
  height: 350px;
}

.owner-section .owner-profile-images .cover-photo {
  height: 320px;
  background: #272a2d;
  border-radius: 20px;
  overflow: hidden;
}

.owner-section .owner-profile-images .cover-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.owner-section .owner-profile-images .profile-img {
  overflow: hidden;
  height: 130px;
  width: 130px;
  background: #222528;
  margin-left: 30px;
  position: relative;
  top: -90px;
  border-radius: 65px;
}

.owner-section .owner-profile-images .profile-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.owner-section .owner-profile-info {
  display: flex;
  flex: auto;
  flex-direction: row;
  justify-content: space-between;
  margin-bottom: 50px;
}

.owner-section .owner-profile-info .profile-details {
  margin-top: 15px;
  margin-left: 20px;
  max-width: 60%;
}

.owner-section .owner-profile-info .profile-details p {
  margin-bottom: 0;
  padding-bottom: 0;
}

.owner-section .owner-profile-info .profile-details p.username {
  font-size: 24px;
  font-weight: 600;
  color: #ffffff;
  text-transform: lowercase;
}

.owner-section .owner-profile-info .profile-details p.fullname {
  font-size: 20px;
  font-weight: 500;
  color: #d7d7d7;
  text-transform: capitalize;
}

.owner-section .owner-profile-info .profile-details p.short-bio {
  margin-top: 10px;
  font-size: 14px;
  font-weight: 500;
  color: #aaaaaa;
}

.owner-section .owner-profile-info .profile-details .profile-buttons {
  margin-top: 15px;
  display: flex;
  flex-direction: row;
}

.owner-section .owner-profile-info .profile-details .profile-buttons .btn {
  margin-right: 15px;
  font-size: 14px;
  font-weight: 500;
  color: #ffffff;
  border-radius: 10px;
  padding: 10px 20px;
  background: #303336;
  border: 1px solid #303336;
}

.owner-section .owner-profile-info.creator-profile .wallet-box {
  visibility: hidden;
}

.owner-section .owner-profile-info .wallet-box {
  position: relative;
  top: -10px;
  border: 1px solid #3d4145;
  border-radius: 20px;
  padding: 10px;
  width: 320px;
}

.owner-section .owner-profile-info .wallet-box .btn {
  background: #303336;
  border: 1px solid #303336;
}

.owner-section .owner-profile-info .wallet-box .wallet-balance-box {
  border: 1px solid #3d4145;
  border-radius: 10px;
  padding: 10px;
}

.owner-section .owner-profile-info .wallet-box .wallet-balance-box .title {
  font-size: 13px;
  font-weight: 500;
  color: #f1f3f3;
  margin-bottom: 5px;
  padding-bottom: 0;
}

.owner-section .owner-profile-info .wallet-box .wallet-balance {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  flex: auto;
}

.owner-section .owner-profile-info .wallet-box .wallet-balance p {
  margin-bottom: 0;
  padding-bottom: 0;
  font-size: 13px;
  font-weight: 500;
  color: #aaaaaa;
}

.owner-section .owner-profile-info .wallet-box .eth-wallets {
  margin-top: 15px;
}

.owner-section .owner-profile-info .wallet-box .eth-wallets .eth-address {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.owner-section .owner-profile-info .wallet-box .eth-wallets .eth-address .address-section p {
  margin-bottom: 0;
  padding-bottom: 0;
}

.owner-section .owner-profile-info .wallet-box .eth-wallets .eth-address .address-section p.title {
  font-size: 13px;
  font-weight: 500;
  color: #aaaaaa;
}

.owner-section .owner-profile-info .wallet-box .eth-wallets .eth-address .address-section p.address {
  font-size: 14px;
  font-weight: 500;
  color: #ffffff;
  letter-spacing: 1px;
}

.owner-section .owner-profile-info .wallet-box .eth-wallets .eth-address .eth-buttons .btn {
  font-size: 13px;
  border-radius: 12px;
  padding: 8px 12px;
  margin-left: 5px;
}



.owner-section .owner-profile-info .wallet-box .eth-wallets .eth-connect-button {
  margin-top: 10px;
}

.owner-section .owner-profile-info .wallet-box .eth-wallets .eth-connect-button .btn {
  border-radius: 8px;
  color: #ffffff;
  font-size: 13px;
  font-weight: 500;
  padding: 10px 30px;
}

.owner-section .owner-profile-info .wallet-box .wallet-buttons {
  margin-top: 20px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.owner-section .owner-profile-info .wallet-box .wallet-buttons .btn {
  font-size: 14px;
  font-weight: 500;
  color: #ffffff;
  padding: 8px 20px;
  border-radius: 10px;
}

/* owners nft section */
.owner-nft-section {
  border-top: 1px solid #303336;
  padding-top: 50px;
}

/* dashboard sidebar content */

.dash-sidebar .show-menu {
  visibility: hidden;
}

.dash-sidebar .menu-button {
  margin-bottom: 20px;
}

.dash-sidebar .menu-button .btn {
  border-radius: 10px;
  font-size: 14px;
  font-weight: 500;
  color: #ffffff;
  padding: 12px 20px;
  background: #222528;
  border: 0 solid #222528;
}

.dash-sidebar .menu-button .btn .fas {
  margin-left: 5px;
}

.dash-sidebar .dash-sidebar-content {
  border: 1px solid #303336;
  border-radius: 15px;
  padding: 15px 20px 0;
}

.dash-sidebar .dash-sidebar-content ul {
  list-style: none;
  padding-left: 0;
}

.dash-sidebar .dash-sidebar-content ul li {
  padding: 16px 0;
  border-bottom: 1px solid #303336;
  cursor: pointer;
}

.dash-sidebar .dash-sidebar-content ul li.last-one {
  border-bottom: 0 solid transparent;
}

.dash-sidebar .dash-sidebar-content ul li .fas {
  float: right;
}

.dash-sidebar .dash-sidebar-content ul li .list-item {
  color: #ffffff;
  text-decoration: none;
  font-size: 18px;
  font-weight: 600;
}

/* dashboard main content */
.dash-main-content .note {
  margin-top: 20px;
  font-size: 15px;
  font-weight: 400;
  color: #ffffff;
}

.dash-main-content .note .text-bold {
  font-weight: 600;
}

/* dashboard nft styles */
.dash-owner-nfts {
  margin-top: 15px;
  padding: 0 10px;
  height: 100vh;
  width: 100%;
  overflow: auto;
  overflow-x: hidden;
}

.dash-owner-nfts::-webkit-scrollbar {
  display: none;
}

/* empty content styles */

.dash-main-content .empty-nft-content {
  border-radius: 20px;
  width: 100%;
  background: transparent;
  border: 1px solid #303336;
  height: 400px;
  padding: 10px;
  margin: 10px 0 50px;
}

.dash-main-content .empty-nft-box {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  background: #212427;
  border-radius: 15px;
  padding: 10px;
}

.dash-main-content .empty-nft-box .empty-nft {
  margin: auto;
  max-width: 300px;
  text-align: center;
}

.dash-main-content .empty-nft-box .empty-nft h5 {
  font-size: 24px;
  font-weight: 600;
}

.dash-main-content .empty-nft-box .empty-nft p {
  font-size: 16px;
  font-weight: 500;
  color: #a3a3a5;
  margin-bottom: 20px;
}

.dash-main-content .empty-nft-box .empty-nft p.or {
  font-size: 13px;
  font-weight: 500;
  color: #a3a3a5;
  text-transform: uppercase;
  margin: 10px 0;
}

.dash-main-content .empty-nft-box .empty-nft .btn {
  padding: 12px 15px;
  font-size: 13px;
  font-weight: 600;
  border-radius: 10px;
  letter-spacing: 0.5px;
  border: 1px solid #585a5c;
  background: transparent;
  color: #ffffff;
}


.dash-main-content .empty-nft-box .empty-nft .btn.btn-primary {
  padding: 12px 25px;
  font-size: 13px;
  font-weight: 600;
  color: #ffffff;
  letter-spacing: 0.5px;
  background: #191c1f;
  border: 1px solid #3d4145;
  border-radius: 10px;
}


/* nft content here */
.dash-owner-nfts .col-lg-4 {
  margin: 0;
  padding: 6px;
}

.dash-nft-box {
  border-radius: 15px;
  background: transparent;
  margin-bottom: 30px;
  border: 1px solid #3d4145;
  padding: 5px;
  cursor: pointer;
  transition: transform 0.5s ease;
  transform-origin: center;
}

.dash-nft-box:hover {
  transform: scale(1.03);
  /* transform-origin: 0 0; */
  /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
  z-index: 2;
}

.dash-nft-box .nft-img {
  height: 240px;
  width: 100%;
}

.dash-nft-box .nft-img img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  object-position: center;
  border-radius: 10px;
}

.dash-nft-box .nft-body {
  padding: 10px 0 5px;
}

.dash-nft-box .dash-nft-info {
  margin-bottom: 10px;
  padding: 10px 5px 0;
}

.dash-nft-box .dash-nft-info .name {
  font-size: 13px;
  color: #aaaaaa;
  font-weight: 500;
  text-transform: capitalize;
  margin-bottom: 2px;
}

.dash-nft-box .dash-nft-info .nft-name {
  font-size: 15px;
  font-weight: 500;
  text-transform: capitalize;
  margin-bottom: 0;
}

.dash-nft-box .price-box {
  padding: 8px 15px;
  background: #222528;
  border-radius: 10px;
  margin-bottom: 10px;
}

.dash-nft-box .price-box .title {
  font-size: 13px;
  color: #a3a3a5;
  font-weight: 500;
  text-transform: capitalize;
  margin-bottom: 5px;
}

.dash-nft-box .price-box .nft-price {
  font-size: 13px;
  color: #ffffff;
  font-weight: 500;
  text-transform: none;
  margin-bottom: 0;
}

.dash-nft-box .price-box .nft-price .d-price {
  font-size: 12px;
  color: #a3a3a5;
  float: right;
}

.dash-nft-box .dash-nft-button {
  text-align: center;
  visibility: hidden;
}

.dash-nft-box:hover .dash-nft-button {
  visibility: visible;
}

.dash-nft-box .dash-nft-button .btn {
  width: 80%;
  background: #ffffff;
  color: #000000;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  border: 1px solid #ffffff;
  padding: 8px;
}

/* activities styles are here joor */
.activity-content .activity-filters .note {
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 0.5px;
}

.activity-content .activity-filters ul {
  list-style: none;
  padding-left: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.activity-content .activity-filters ul li {
  margin-right: 15px;
}

.activity-content .activity-filters ul li .btn .fas,
.fab {
  margin-right: 8px;
}

.activity-content .activity-filters ul li .btn {
  padding: 8px 14px;
  font-size: 14px;
  font-weight: 500;
  border-radius: 10px;
  border: 1px solid #303336;
  background: transparent;
  color: #ffffff;
}

.activity-content .activity-filters ul li .btn:hover {
  border: 1px solid #3d4145;
}

.activity-content .activity-filters ul li .btn.active {
  padding: 8px 14px;
  font-size: 14px;
  font-weight: 500;
  border-radius: 10px;
  border: 1px solid #ffffff;
  background: #ffffff;
  color: #191c1f;
}

.activity-content .activity-list {
  margin-top: 30px;
  height: 100vh;
  overflow: auto;
  overflow-x: hidden;
}

.activity-content .activity-list::-webkit-scrollbar {
  display: none;
}

.activity-content .activity-list .activity-box {
  display: flex;
  flex-direction: row;
  border: 1px solid #303336;
  padding: 20px;
  border-radius: 15px;
  margin-bottom: 20px;
}

.activity-content .activity-list .activity-box .processing {
  color: #FFA500;
}

.activity-content .activity-list .activity-box .failed {
  color: #FF0000;
}

.activity-content .activity-list .activity-box .successful {
  color: #00FF00;
}

.activity-content .activity-list .activity-box .activity-img {
  margin-right: 15px;
  width: 70px;
  height: 70px;
}

.activity-content .activity-list .activity-box .activity-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  border-radius: 10px;
}

.activity-content .activity-list .activity-box .activity-img img.funds {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  border-radius: 10px;
  padding: 10px;
  background: #222528;
}

.activity-content .activity-list .activity-box .activity-info p {
  margin-bottom: 3px;
  padding-bottom: 0;
}

.activity-content .activity-list .activity-box .activity-info .name {
  font-size: 14px;
  font-weight: 600;
  color: #ffffff;
}

.activity-content .activity-list .activity-box .activity-info .name a {
  color: #ffffff;
  text-decoration: none;
}

.activity-content .activity-list .activity-box .activity-info .name .dollar {
  font-size: 13px;
  font-weight: 500;
  color: #aaaaaa;
  margin-left: 10px;
}

.activity-content .activity-list .activity-box .activity-info .activity {
  font-size: 13px;
  font-weight: 500;
  color: #959798;
}

.activity-content .activity-list .activity-box .activity-info .date {
  font-size: 14px;
  font-weight: 400;
  color: #959798;
}

/* empty content styles */

.activity-content .empty-activity {
  border-radius: 20px;
  width: 100%;
  height: 350px;
  padding: 10px;
  margin: 10px 0 50px;
}

.activity-content .empty-activity .empty-activity-wrapper {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  padding: 10px;
}

.activity-content .empty-activity .empty-activity-wrapper .empty-activity-box {
  margin: auto;
  max-width: 300px;
  text-align: center;
}

.activity-content .empty-activity .empty-activity-wrapper .empty-activity-box h5 {
  font-size: 22px;
  font-weight: 600;
}

.activity-content .empty-activity .empty-activity-wrapper .empty-activity-box p {
  font-size: 15px;
  font-weight: 500;
  color: #a3a3a5;
  margin-bottom: 20px;
}

.activity-content .empty-activity .empty-activity-wrapper .empty-activity-box a.btn {
  font-size: 13px;
  font-weight: 500;
  text-transform: capitalize;
  padding: 12px 15px;
  border-radius: 12px;
  background: #303336;
  border: 1px solid #303336;
}

/* deposit funds style here */
.deposit-container {
  margin-top: 15px;
  margin-bottom: 30px;
}

.deposit-container .note {
  font-size: 17px;
  font-weight: 500;
  line-height: 28px;
  letter-spacing: 0.5px;
}

.deposit-container .deposit-wrapper {
  margin-top: 20px;
  border: 1px solid #303336;
  padding: 20px 30px;
  border-radius: 25px;
}

.deposit-container .deposit-wrapper.withdraw-wrapper {
  padding: 0 20px 20px;
}

.deposit-container .deposit-wrapper.withdraw-wrapper .form-group .summary-box {
  border: 1px solid #3d4145;
  background: #212427;
  border-radius: 15px;
  font-size: 14px;
  padding: 10px 20px;
}

.deposit-container .deposit-wrapper.withdraw-wrapper .form-group .summary-box p {
  margin-bottom: 0;
  padding-bottom: 0;
  font-weight: 500;
}

.deposit-container .deposit-wrapper.withdraw-wrapper .form-group .summary-box p .d-price {
  color: #aaaaaa;
  font-size: 14px;
}

.deposit-container .deposit-wrapper.withdraw-wrapper .form-group .p-status {
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.5px;
  text-align: center;
  margin: 0 0;
  padding: 7px 15px;
  border-radius: 10px;
  cursor: pointer;
  /* visibility: hidden; */
}

.deposit-container .deposit-wrapper.withdraw-wrapper .form-group .p-status a {
  text-decoration: none;
  color: inherit;
}

.deposit-container .deposit-wrapper.withdraw-wrapper .form-group .p-status.success {
  color: #0077b5;
  background: #d5f0ff;
}

.deposit-container .deposit-wrapper.withdraw-wrapper .form-group .p-status.failed {
  color: #d50843;
  background: #e1c4cd;
}


.deposit-container .deposit-wrapper .deposit-limit-box {
  display: flex;
  justify-content: center;
}

.deposit-container .deposit-wrapper .deposit-limit {
  border: 1px solid #303336;
  padding: 15px 20px 5px;
  border-radius: 10px;
  display: flex;
  flex-direction: row;
  background: #222528;
  max-width: 70%;
}

.deposit-container .deposit-wrapper .deposit-limit p {
  margin-bottom: 10px;
  padding-bottom: 0;
  font-size: 15px;
  font-weight: 400;
}

.deposit-container .deposit-wrapper .deposit-limit .deposit-limit-sub-title {
  margin-left: 20px;
}

.deposit-container .deposit-wrapper .deposit-limit .deposit-limit-sub-title p {
  font-weight: 600;
}

.deposit-container .deposit-wrapper .deposit-form {
  margin-top: 30px;
}

.deposit-container .deposit-wrapper .deposit-form .form-group {
  margin: 30px 10px;
}

.deposit-container .deposit-wrapper .deposit-form .form-group .form-inline {
  display: flex;
  flex-direction: row;
  border: 1px solid #3d4145;
  border-radius: 10px;
  padding: 0;
  background: #2c2c2e;
}

.deposit-container .deposit-wrapper .deposit-form .form-control:focus {
  box-shadow: none;
  outline: none;
}

.deposit-container .deposit-wrapper .deposit-form .form-group label {
  font-size: 13px;
  color: #a3a3a5;
  margin-bottom: 5px;
}

.deposit-container .deposit-wrapper .deposit-form .form-group .form-inline input {
  font-size: 15px;
  height: 50px;
  background: #212427;
  color: #ffffff;
  border: 0 solid transparent;
  border-radius: 1px;
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
}



.deposit-container .deposit-wrapper .deposit-form .form-group .form-inline .btn {
  width: 30%;
  font-size: 15px;
  font-weight: 500;
  color: #ffffff;
  height: 50px;
  letter-spacing: 0.5px;
  background: #272a2d;
  border: 0 solid transparent;
  border-radius: 1px;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}

.deposit-container .deposit-wrapper .deposit-form .form-group input {
  border: 1px solid #3d4145;
  font-size: 15px;
  height: 50px;
  background: #212427;
  color: #ffffff;
  border-radius: 10px;
}

.deposit-container .deposit-wrapper .deposit-form .form-group select {
  border: 1px solid #3d4145;
  font-size: 13px;
  font-weight: 500;
  height: 50px;
  background: #212427;
  color: #ffffff;
  border-radius: 10px;
}

.deposit-container .deposit-wrapper .deposit-form .form-group p.connect-p {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.5px;
  text-align: center;
  background: #272a2d;
  padding: 10px 10px;
  border-radius: 8px;
}

.deposit-container .deposit-wrapper .deposit-form .form-button {
  margin-top: 60px;
  text-align: center;
}

.deposit-container .deposit-wrapper .deposit-form .form-button .btn {
  width: 70%;
  border-radius: 30px;
  height: 47px;
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 0.5px;
  border: 1px solid #feda03;
  background: #feda03;
  color: #000000;
}

#importForm .form-button .btn {
  width: 50%;
}

/* pay to deposit funds container */

.deposit-container .deposit-wrapper.pay-wrapper {
  padding: 10px;
}

.deposit-pay-box {
  padding: 25px 20px;
  border-radius: 15px;
  background: #222528ab;
  border: 1px solid #303336;
}


.deposit-pay-box .pay-box .header {
  display: flex;
  flex: auto;
  flex-direction: row;
  justify-content: space-between;
  margin-bottom: 20px;
  padding: 0px 10px;
}

.deposit-pay-box .pay-box .header p {
  margin: 0;
  padding: 0;
}

.deposit-pay-box .pay-box .header p.link {
  font-size: 13px;
  color: #a3a3a5;
  text-transform: capitalize;
  text-decoration: none;
  cursor: pointer;
}

.deposit-pay-box .pay-box .header p.link .fas {
  margin-right: 5px;
}

.deposit-pay-box .pay-box .header p.time {
  border: 2px solid #feda03;
  padding: 5px 20px;
  font-size: 13px;
  border-radius: 5px;
  color: #feda03;
}

.deposit-pay-box .pay-box p.title {
  font-size: 13px;
  color: #a3a3a5;
  text-align: center;
  margin-top: 10px;
  max-width: 400px;
}

.deposit-pay-box .pay-box .qr-img {
  text-align: center;
}

.deposit-pay-box .pay-box .qr-img .img-fluid {
  width: 120px;
}

.deposit-pay-box .pay-box .qr-img a.how-to {
  font-size: 12px;
  color: #feda03;
  font-weight: 500;
  margin-top: 10px;
  text-decoration: none;
}

.deposit-pay-box .pay-box .pay-form {
  margin-top: 20px;
  padding: 20px 10px 0;
  border-top: 1px solid #303336;
}

.deposit-pay-box .pay-box .pay-form .form-group {
  margin: 0 0 30px;
  text-align: left;
}

.deposit-pay-box .pay-box .pay-form .form-group label {
  font-size: 13px;
  color: #a3a3a5;
  margin-bottom: 5px;
}

.deposit-pay-box .pay-box .pay-form .form-group label .network {
  margin-left: 20px;
  color: #feda03;
  font-size: 12px;
}

.deposit-pay-box .pay-box .pay-form .form-control:focus {
  box-shadow: none;
  outline: none;
}

.deposit-pay-box .pay-box .pay-form .form-group input {
  border: 1px solid #3d4145;
  font-size: 13px;
  font-weight: 400;
  height: 45px;
  background: #212427;
  color: #ffffff;
  border-radius: 10px;
}

.deposit-pay-box .pay-box .pay-form .form-group .form-inline {
  display: flex;
  flex-direction: row;
  border: 1px solid #3d4145;
  border-radius: 10px;
  padding: 0;
  background: #2c2c2e;
}

.deposit-pay-box .pay-box .pay-form .form-group .form-inline input {
  font-size: 15px;
  height: 45px;
  background: #212427;
  color: #ffffff;
  border: 0 solid transparent;
  border-radius: 1px;
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
}

.deposit-pay-box .pay-box .pay-form .form-group .form-inline.w-address input {
  font-size: 13px;
  font-weight: 400;
  padding: 3px 5px;
}

.deposit-pay-box .pay-box .pay-form .form-group .form-inline .btn {
  width: 15%;
  font-size: 13px;
  font-weight: 500;
  color: #ffffff;
  height: 45px;
  letter-spacing: 0.5px;
  background: #272a2d;
  border: 0 solid transparent;
  border-radius: 1px;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}

.deposit-pay-box .pay-box .pay-form .form-group .form-inline .btn .far {
  font-size: 16px;
}

.deposit-pay-box .footer-box {
  display: flex;
  flex: auto;
  flex-direction: row;
  justify-content: space-between;
  padding: 15px 30px;
  margin-top: 20px;
  border-radius: 15px;
  border: 1px solid #3d4145;
  background: #191c1f;
}

.deposit-pay-box .footer-box p {
  margin-bottom: 0;
  padding-bottom: 0;
}

.deposit-pay-box .footer-box p.amt {
  margin-top: 10px;
  font-weight: 600;
  letter-spacing: 0.5px;
  font-size: 15px;
  margin-bottom: 0;
  padding-bottom: 0;
}

.deposit-pay-box .footer-box .btn {
  border-radius: 10px;
  padding: 10px 20px;
  font-size: 14px;
  color: #000000;
  text-transform: capitalize;
  letter-spacing: 1px;
  font-weight: 500;
  background: #feda03;
  border: 1px solid #feda03;
  margin-bottom: 0px;
}


/* avalaible providers section */

.deposit-pay-box .providers-box {
  margin-top: 30px;
}

.deposit-pay-box .providers-box .providers-link {
  display: flex;
  flex-direction: column;
}

.deposit-pay-box .providers-box label {
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.5px;
}

.deposit-pay-box .providers-box p.p-label {
  font-size: 14px;
  font-weight: 500;
  color: #a0aec0;
  letter-spacing: 0.5px;
  margin-bottom: 8px;
}

.providers-link .btn {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  border-radius: 10px;
  background: #191c1f;
  padding: 8px 10px;
  border: 1px solid #3d4145;
  margin: 8px 0 0;
}

.providers-link .btn img {
  width: 28px;
  background: #3d4145;
  border-radius: 14px;
  object-fit: cover;
  object-position: center;
}

.providers-link .btn .btn-title {
  font-size: 13px;
  font-weight: 600;
  padding-left: 5px;
}

.providers-link .btn .btn-right {
  margin-top: auto;
  margin-bottom: auto;
}

.providers-link .btn .pills {
  padding: 3px 7px 1px;
  background: #212427;
  border-radius: 5px;
  font-size: 10px;
  text-transform: uppercase;
  font-weight: 700;
  color: #aaaaaa;
  text-align: center;
  margin-right: 5px;
}

.providers-link .btn .btn-right .fas {
  font-size: 12px; 
  color: #aaaaaa;
}

/* payment method styles */
.connect-dapp .payment-method{
  margin-top: 20px;
}
 

.payment-method .method-tab {
  display: flex;
  flex-direction: row;
  background: transparent;
  justify-content: space-evenly;

}

.payment-method .method-tab .btn {
  width: 100%;
  padding: 13px;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.5px;
  color: #f7f7f7;
  border-radius: 0;
  background: #191c1f;
  border: 1px solid #303336;
  border-bottom-width: 0;
}

.payment-method .method-tab .btn.btn-right{
  border-top-right-radius: 15px;
}
.payment-method .method-tab .btn.btn-left{
  border-top-left-radius: 15px;
}

.payment-method .method-tab #credit_account_tab.btn{
  border-right-width: 0;
  border-left-width: 0;
}

.payment-method .method-tab .btn.active {
  background: #222528;
}

.payment-method .payment-method-body {
  padding: 0 20px;
  border: 1px solid #303336;
  border-bottom-left-radius: 15px;
  border-bottom-right-radius: 15px;
}
.payment-method .form-group {
  margin: 20px 0;
}

.payment-method .form-group input {
  font-size: 14px;
  font-weight: 500;
  background: #222528;
  border: 0 solid transparent;
  color: #ffffff;
  height: 50px;
  padding-left: 20px;
  border-radius: 15px;
}

.payment-method .form-group input::placeholder {
  color: #585a5c;
}

.payment-method .form-group input:focus {
  box-shadow: none;
  outline: none;
  border: 1px solid #3d4145;
  background: transparent;
}

.payment-method .form-group label {
  margin-bottom: 5px;
  font-size: 15px;
  font-weight: 500;
}

.payment-method .form-btn {
  margin-top: 30px;
}

.payment-method .form-btn .btn {
  background: #ffffff;
  border: 1px solid #ffffff;
  color: #191c1f;
  font-size: 14px;
  font-weight: 600;
  padding: 12px 16px;
  border-radius: 15px;
  width: 50%;
}

.payment-method .payment-method-body #viewCard {
  display: none;
}

.payment-method .payment-method-body #viewConnect {
  display: none;
}

/* connect dapp styles */

.payment-method .connect-content {
  padding: 15px 5px;
} 

.payment-method .connect-content .connect-dapp-header {
  margin-bottom: 30px;
}

.payment-method .connect-content .connect-dapp-header .title {
  font-size: 18px;
  font-weight: 500;
  color: #ffffff;
}

.payment-method .connect-content .connect-dapp-header .sub-title {
  font-size: 14px;
  font-weight: 400;
  color: #a3a3a5;
}

.payment-method .connect-content .dapp-wallets {
  display: flex;
  justify-content: center;
  align-items: center;
}

.payment-method .connect-content .dapp-wallets .dapp-wallet-wrapper {
  max-width: 80%;
  min-width: 60%;
}

.payment-method .connect-content .dapp-wallets .dapp-wallet-box {
  border: 1px solid #464545;
  padding: 15px 15px;
  border-radius: 10px;
  margin: 10px 0 30px;
}


.payment-method .connect-content .dapp-wallets .dapp-wallet-box p {
  margin-bottom: 8px;
  padding-bottom: 0;
  font-size: 14px;
  color: #aaaaaa;
  font-weight: 500;
  letter-spacing: 0.5px;
}

.payment-method .connect-content .dapp-wallets .dapp-wallet-box .btn {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  background: #3d4145;
  border: 1px solid #3d4145;
  padding: 13px 20px;
  border-radius: 25px;
  width: 100%;
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 1px;
}

.payment-method .connect-content .dapp-wallets .dapp-wallet-box .btn .icon {
  margin-left: 20px;
}

.payment-method .connect-content .dapp-wallets .dapp-wallet-box .btn .icon .fas {
  font-size: 20px;
}


/* secret content styles */

.secret-container {
  height: 95vh;
  background: transparent;
  text-align: center;
}

.secret-container .secret-header {
  padding-top: 0;
}

.secret-container .secret-header h5 {
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 0.5px;
  color: #f7f7f7;
}

.secret-container .secret-header h5 .fas {
  font-size: 17px;
  color: #feda03;
  margin-right: 5px;
}

.secret-container .secret-header .p-tag {
  display: flex;
  justify-content: center;
}

.secret-container .secret-header p {
  font-size: 14px;
  font-weight: 300;
  max-width: 90%;
  color: #f7f7f7;
  line-height: 25px;
}

.secret-container .important {
  font-weight: 500;
  color: #aaaaaa;
}

.secret-container .secret-content {
  margin: 10px 0;
}

.secret-container .secret-content p.copy {
  font-size: 14px;
  color: #feda03;
  font-weight: 600;
  cursor: pointer;
}

.secret-container .secret-content p.copy .far {
  margin-right: 10px;
}

.secret-container .secret-content .secret-box {
  display: flex;
  justify-content: center;
}

.secret-container .secret-content .secret-content-box {
  border: 0px solid rgb(44, 43, 43);
  max-width: 80%;
  padding: 10px 20px;
  border-radius: 20px;
  margin-bottom: 20px;

  box-shadow: 1px 2px 12px 2px rgba(0, 0, 0, 0.4);
  -webkit-box-shadow: 1px 2px 12px 2px rgba(0, 0, 0, 0.4);
  -moz-box-shadow: 1px 2px 12px 2px rgba(0, 0, 0, 0.4);
}

.secret-container .secret-content .secret-content-box p {
  line-height: 30px;
  font-size: 14px;
  font-weight: 500;
  color: #aaaaaa;
  word-spacing: 20px;
  letter-spacing: 0.5px;
}

.secret-container .secret-content p.eyes-only {
  color: #a3a3a5;
  font-size: 13px;
  text-align: center;
  font-weight: 600;
  margin-bottom: 5px;
  padding-bottom: 0px;
}

.secret-container .secret-content .secret-content-footer {
  display: flex;
  justify-content: center;
}

.secret-container .secret-content .secret-content-footer .secret-box-foot {
  max-width: 95%;
}

.secret-container .secret-content p {
  font-size: 13px;
  text-align: center;
  margin-top: 0px;
  padding-top: 0px;
}

.secret-container .secret-button {
  margin: 20px 0 20px;
}

.secret-container .secret-button .btn.btn-primary {
  width: 90%;
  border-radius: 25px;
  font-size: 15px;
  font-weight: 500;
  height: 45px;
  border: 2px solid #212427;
  color: #ffffff;
  background-color: #212427;
  box-shadow: 1px 3px 10px 4px rgba(0, 0, 0, 0.4);
  -webkit-box-shadow: 1px 3px 10px 4px rgba(0, 0, 0, 0.4);
  -moz-box-shadow: 1px 3px 10px 4px rgba(0, 0, 0, 0.4);
}

.secret-container .secret-button .btn .fa-solid {
  font-size: 17px;
  margin-right: 10px;
}

.secret-container .secret-button .btn:focus {
  outline: none;
  box-shadow: none;
}


/* profile setting styles are here */
.profile-settings {
  margin-top: 30px;
}

.profile-settings .title {
  font-size: 35px;
  font-weight: 600;
  letter-spacing: 0.5px;
}

.profile-form {
  margin-top: 30px;
}

.profile-form .edit-profile-images {
  height: 350px;
}

.profile-form .check_data {
  font-size: 13px;
  margin-left: 20px;
}

.profile-form .edit-cover-photo {
  position: relative;
  height: 300px;
  width: 100%;
  background: #272a2d;
  border-radius: 20px;
  overflow: hidden;
  cursor: pointer;
}

.profile-form .edit-cover-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.profile-form .edit-cover-photo:hover .btn {
  visibility: visible;
  transition-delay: 0s;
  opacity: 1;
}

.profile-form .edit-cover-photo .btn {
  visibility: hidden;
  transition: opacity 0.3s ease-in-out, visibility 0s linear 0.3s;
  opacity: 0;
  position: absolute;
  top: 20px;
  z-index: 1;
  right: 20px;
  background: #ffffff;
  border: 1px solid #ffffff;
  color: #191c1f;
  font-size: 14px;
  font-weight: 600;
  padding: 10px 20px;
  border-radius: 10px;
}

.profile-form .edit-profile-img {
  position: relative;
  overflow: hidden;
  height: 120px;
  width: 120px;
  background: #222528;
  margin-left: 20px;
  position: relative;
  top: -80px;
  border-radius: 60px;
  cursor: pointer;
}

.profile-form .edit-profile-img:hover .overlay {
  visibility: visible;
  opacity: 1;
}

.profile-form .edit-profile-img .img-fluid {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.profile-form .edit-profile-img .overlay {
  visibility: hidden;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  background: #95979780;
  text-align: center;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.profile-form .edit-profile-img .overlay .img-overlay {
  margin: 35% auto;
  width: 40px;
  border-radius: 8px;
  padding: 10px;
  background: #222528d0;
}

.profile-form-details {
  margin: 10px 0 30px;
}

.profile-form-details .form-group {
  margin: 20px 0;
}

.profile-form-details .form-group .form-control {
  font-size: 14px;
  font-weight: 500;
  background: #222528;
  border: 0 solid transparent;
  color: #ffffff;
}


.profile-form-details .form-group select {
  background: transparent;
  border: 1px solid #3d4145;
  padding: 10px 20px;
  font-size: 15px;
  color: #ffffff;
  font-weight: 500;
  border-radius: 10px;
  height: 50px;
}

.profile-form-details .form-group select option {
  color: #ffffff;
  background: #222528;
}

.profile-form-details .form-group .form-control::placeholder {
  color: #585a5c;
}

.profile-form-details .form-group .form-control:focus {
  box-shadow: none;
  outline: none;
  border: 1px solid #3d4145;
  background: transparent;
}

.profile-form-details .form-group input {
  height: 50px;
  padding-left: 20px;
  border-radius: 15px;
}

.profile-form-details .form-group textarea {
  padding-left: 20px;
  padding-top: 15px;
  border-radius: 15px;
}

.profile-form-details .form-group label {
  margin-bottom: 5px;
  font-size: 15px;
  font-weight: 500;
}

.profile-form-details .form-group p.form-note {
  font-size: 12px;
  font-weight: 500;
  color: #a3a3a5;
  margin: 5px 0 0;
  padding: 0;
}

.profile-form-details .form-group .form-inline {
  display: flex;
  flex-direction: row;
  height: 50px;
  border: 0 solid #3d4145;
  border-radius: 15px;
  background: #222528;
}

.profile-form-details .form-group .form-inline p {
  margin: auto;
  padding: 0;
  text-align: center;
  width: 50px;
  font-size: 15px;
}

.profile-form-details .form-group .form-inline .form-control {
  background: transparent;
  border: 0 solid transparent;
  padding-left: 0;
}

.profile-form-details .form-group .form-inline:hover {
  background: transparent;
  border: 1px solid #3d4145;
}

.social-links {
  margin-top: 40px;
}

.social-links .s-title {
  font-size: 22px;
  font-weight: 600;
  color: #ffffff;
}

.social-links .s-sub-title {
  font-size: 15px;
  font-weight: 500;
  color: #a3a3a5;
}

.profile-form-details .form-button {
  margin-top: 50px;
}

.profile-form-details .form-button .btn {
  background: #ffffff;
  border: 1px solid #ffffff;
  color: #191c1f;
  font-size: 14px;
  font-weight: 600;
  padding: 12px 16px;
  border-radius: 15px;
}


/* nft details collection */
.nft-details-content-left {
  margin-bottom: 30px;
}

.nft-details-content-left .nft-details-img {
  margin-top: 50px;
  text-align: center;
}

.nft-details-content-left .nft-details-img img {
  width: 380px;
  height: 380px;
  object-fit: cover;
  border-radius: 20px;
  cursor: zoom-in;
}

.nft-details-content-left .nft-description {
  margin-top: 30px;
}

.nft-details-content-left .overview {
  margin: auto;
  background: #222528;
  border-radius: 20px;
  padding: 5px;
  max-width: 380px;
}

.nft-details-content-left .overview .btn {
  padding: 7px 15px;
  border-radius: 15px;
  border: 0 solid transparent;
  font-size: 14x;
  background: #191c1f;
  color: #ffffff;
  font-weight: 500;
}

.nft-details-content-left .nft-description .desc-title {
  font-size: 24px;
  font-weight: 600;
  margin-top: 30px;
  margin-bottom: 10px;
}

.nft-details-content-left .nft-description .desc-text {
  font-size: 14px;
  font-weight: 500;
  color: #a3a3a5;
  max-width: 600px;
}

.nft-details-content-right {
  margin-top: 50px;
}

.nft-collection {
  font-size: 17px;
  font-weight: 500;
  margin-bottom: 15px;
}

.nft-name {
  font-size: 27px;
  font-weight: 600;
}

.current-owner {
  margin-top: 40px;
  display: flex;
  margin-bottom: 30px;
}

.current-owner .owner-img {
  width: 40px;
  height: 40px;
  border-radius: 20px;
  overflow: hidden;
}

.current-owner .owner-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.current-owner .owner-info {
  margin-left: 15px;
}

.current-owner .owner-info p {
  margin-bottom: 0;
  padding-bottom: 0;
}

.current-owner .owner-info .owner-note {
  font-size: 13px;
  color: #a3a3a5;
  font-weight: 500;
}

.current-owner .owner-info .username a {
  font-size: 15px;
  color: #ffffff;
  text-decoration: none;
  font-weight: 500;
}

.nft-view-container {
  display: flex;
  flex-direction: row;
 padding: 5px 0 20px;
  /* border-top: 1px solid #303336; */
}

.nft-view-container .nft-views{
  margin-right: 5px;
}

.nft-view-container .btn{
  border: 0 solid transparent;
  color: #ffffff;
  font-weight: 500;
  font-size: 15px;
  padding-left: 15px;
}

.nft-view-container .far{
  padding-right: 5px;
  font-size: 16px;
}

.nft-view-container .fas{
  padding-right: 5px;
  font-size: 16px;
  color: #FF3131;
}
.nft-view-container .btn:hover{
  color: #757677;
}

.blockchain {
  display: flex;
  padding: 15px;
  margin-bottom: 30px;
  border-top: 1px solid #303336;
  border-bottom: 1px solid #303336;
}

.blockchain p {
  margin: 0;
  padding: 0;
  font-size: 15px;
}

.blockchain .chain {
  font-weight: 400;
}

.blockchain .chain-name {
  font-weight: 500;
  color: #aaaaaa;
  margin-left: 20px;
}

.blockchain .chain-name img {
  width: 12px;
  margin-right: 5px;
}

.nft-price-wrapper {
  border: 1px solid #303336;
  border-radius: 20px;
  padding: 15px;
}

.nft-price-wrapper .price-wrapper {
  background: #222528;
  border-radius: 15px;
  padding: 15px;
}

.nft-price-wrapper .price-wrapper p {
  margin-bottom: 5px;
  padding-bottom: 0;
}

.nft-price-wrapper .price-wrapper .price-note {
  font-size: 13px;
  color: #a3a3a5;
  font-weight: 500;
}

.nft-price-wrapper .price-wrapper .eth-price {
  font-size: 18px;
  color: #ffffff;
  font-weight: 600;
  letter-spacing: 0.5px;
}

.nft-price-wrapper .price-wrapper .dollar-price {
  font-size: 14px;
  color: #757677;
  font-weight: 600;
  margin-bottom: 0;
}

.nft-price-wrapper .price-button {
  margin-top: 20px;
}

.nft-price-wrapper .price-button .btn {
  text-align: center;
  padding: 12px 20px;
  width: 100%;
  background: #ffffff;
  border: 0 solid transparent;
  border-radius: 15px;
  font-size: 15px;
  font-weight: 600;
  color: #191c1f;
}

.more-collections {
  margin-top: 50px;
  margin-bottom: 8%;
}

.more-collections h3.title {
  text-align: center;
  font-size: 25px;
  font-weight: 600;
  margin-bottom: 40px;
}

/* create nft section */
.create-nft-box {
  padding: 20px 0;
}

.create-form {
  padding: 30px 20px;
  height: 100vh;
  overflow: auto;
  overflow-x: hidden;
}

.create-form::-webkit-scrollbar {
  display: none;
}

.create-form .main-text {
  font-size: 35px;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 10px;
}

.create-form .sub-text {
  font-size: 16px;
  font-weight: 500;
  color: #aaaaaa;
}

.create-form .blockchain {
  margin-top: 30px;
  border: 1px solid #303336;
  border-radius: 15px;
  padding: 20px 30px;
}

.create-form .upload-nft {
  margin-top: 20px;
}

.create-form .label {
  font-size: 15px;
  font-weight: 500;
  color: #ffffff;
  margin-bottom: 8px;
}

.upload-nft .upload-nft-box {
  border: 2px dashed #303336;
  border-radius: 15px;
  text-align: center;
  min-height: 150px;
  max-height: 300px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.upload-nft .upload-nft-box .text {
  font-size: 15px;
  color: #a3a3a5;
  font-weight: 500;
}

.upload-nft .upload-nft-box .btn {
  font-size: 14px;
  font-weight: 500;
  color: #ffffff;
  padding: 10px 15px;
  background: #303336;
  border: 0 solid transparent;
  border-radius: 12px;
}

.upload-nft .upload-nft-box .upload-button-box {
  display: block;
}

.upload-nft .upload-nft-box .nft-image-container {
  width: 100%;
  height: 300px;
  padding: 20px;
  position: relative;
  display: none;
}

.upload-nft .upload-nft-box .nft-image-container img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 15px;
  object-position: center;
}

.upload-nft .upload-nft-box .nft-image-container .btn {
  background: #303336;
  border-radius: 5px;
  padding: 3px 10px;
  font-size: 15px;
  z-index: 1030;
  position: absolute;
  right: 30px;
  top: 30px;
}

.put-marketplace {
  display: flex;
  justify-content: space-between;
  margin-top: 30px;
}

.put-marketplace p {
  margin-bottom: 0;
  padding-bottom: 0;
}

.put-marketplace .left-section .text {
  font-size: 16px;
  font-weight: 600;
  color: #ffffff;
  letter-spacing: 0.5px;
  margin-bottom: 5px;
}

.put-marketplace .left-section .sub-text {
  font-size: 13px;
  font-weight: 500;
  color: #a3a3a5;
  margin-bottom: 5px;
}

/* checkbox and toggle button styles */

/* https://www.w3schools.com/howto/howto_css_switch.asp */
.put-marketplace .switch {
  position: relative;
  display: inline-block;
  width: 46px;
  height: 20px;
}

.put-marketplace .switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.put-marketplace .slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border-radius: 20px;
  background-color: #303336;
  border: 1px solid #303336;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}

.put-marketplace .slider:before {
  position: absolute;
  content: "";
  height: 13px;
  width: 13px;
  left: 4px;
  bottom: 3px;
  border-radius: 50%;
  background-color: #ffffff;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}

.put-marketplace input:checked+.slider {
  background-color: #ffffff;
}

.put-marketplace input:checked+.slider:before {
  background-color: #191c1f;
}

.put-marketplace input:focus+.slider {
  box-shadow: 0 0 1px #303336;
}

.put-marketplace input:checked+.slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

.nft-price-section {
  margin-top: 20px;
}

.create-form .form-group {
  margin: 30px 0;
}

.create-form .form-group .form-control {
  font-size: 14px;
  font-weight: 500;
  background: #222528;
  border: 0 solid transparent;
  color: #ffffff;
}

.create-form .form-group .form-control::placeholder {
  color: #585a5c;
}

.create-form .form-group .form-control:focus {
  box-shadow: none;
  outline: none;
  border: 1px solid #3d4145;
  background: transparent;
}

.create-form .form-group input {
  height: 47px;
  padding-left: 20px;
  border-radius: 15px;
}

.create-form .form-group select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  height: 47px;
  padding-left: 20px;
  border-radius: 15px;
  font-size: 14px;
  font-weight: 500;
  padding: 10px 20px;
  color: #ffffff;
  background: #222528;
  border: 0 solid transparent;
}

.create-form .form-group select option {
  color: #ffffff;
  background: #222528;
  font-size: 14px;
  border-radius: 15px !important;
}

.create-form .form-group textarea {
  padding-left: 20px;
  padding-top: 15px;
  border-radius: 15px;
}

.create-form .form-group .p-note {
  font-size: 12px;
  font-weight: 500;
  color: #a3a3a5;
  margin: 5px 0 0;
  padding: 0;
}

.create-form .form-group .form-inline {
  display: flex;
  flex-direction: row;
  height: 47px;
  border: 0 solid #3d4145;
  border-radius: 15px;
  background: #222528;
}

.create-form .form-group .form-inline p {
  margin: auto;
  padding: 0;
  text-align: center;
  width: 20%;
  font-size: 14px;
  color: #a3a3a5;
}

.create-form .form-group .form-inline p .fab {
  margin-left: 5px;
}

.create-form .form-group .form-inline .form-control {
  background: transparent;
  border: 0 solid transparent;
  padding-right: 0;
}

.create-form .form-group .form-inline:hover {
  background: transparent;
  border: 1px solid #3d4145;
}

.price-return {
  display: flex;
  flex-direction: row;
  border: 1px solid #303336;
  padding: 15px 20px 7px;
  border-radius: 15px;
  justify-content: space-between;
}

.price-return p {
  margin-bottom: 8px;
  padding-bottom: 0;
  font-size: 13px;
  font-weight: 500;
}

.price-return .price-title p {
  color: #a3a3a5;
}

.price-return .price-sub-text p {
  text-align: right;
}

.mint-nft {
  border: 1px solid #303336;
  border-radius: 15px;
  padding: 10px 20px 5px;
  margin-bottom: 20px;
}

.mint-nft p {
  margin-bottom: 5px;
}

.mint-nft .dollar-price {
  font-size: 13px;
  color: #a3a3a5;
  font-weight: 500;
}

.mint-nft .eth-price {
  font-size: 15px;
  color: #ffffff;
  font-weight: 500;
}

.form-button {
  margin-top: 30px;
  margin-bottom: 40px;
}

.form-button .btn {
  background: #ffffff;
  width: 40%;
  color: #191c1f;
  padding: 12px 30px;
  border-radius: 15px;
  font-size: 14px;
  font-weight: 600;
}

.nft-preview-box {
  margin-top: 50px;
}

.nft-preview-box .preview-title {
  font-size: 15px;
  font-weight: 500;
}

.nft-preview-box .preview-content {
  border: 1px solid #303336;
  border-radius: 15px;
  height: 60vh;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.nft-preview-box .preview-content .preiview-text {
  text-align: center;
  font-size: 13px;
  color: #a3a3a5;
  font-weight: 500;
  padding: 20px;
}

.nft-preview-box .preview-content:hover {
  border: 2px solid #303336;
}

.preview-nft-box {
  display: none;
  border-radius: 15px;
  background: transparent;
  margin-bottom: 30px;
  border: 1px solid #3d4145;
  padding: 5px;
  cursor: pointer;
  transition: transform 0.5s ease;
  transform-origin: center;
}

.preview-nft-box:hover {
  transform: scale(1.03);
  /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
  z-index: 2;
}

.preview-nft-box .nft-img {
  height: 240px;
  width: 100%;
  background: #222528;
  border-radius: 10px;
}

.preview-nft-box .nft-img img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  object-position: center;
  border-radius: 10px;
}

.preview-nft-box .nft-body {
  padding: 10px 0 5px;
}

.preview-nft-box .nft-info {
  margin-bottom: 10px;
  padding: 5px 5px 0;
}

.preview-nft-box .nft-info .name {
  font-size: 13px;
  color: #aaaaaa;
  font-weight: 500;
  text-transform: capitalize;
  margin-bottom: 5px;
}

.preview-nft-box .nft-info .nft-name {
  font-size: 15px;
  font-weight: 500;
  text-transform: none;
  margin-bottom: 0;
}

.preview-nft-box .price-box {
  padding: 8px 15px;
  background: #222528;
  border-radius: 10px;
  margin-bottom: 10px;
}

.preview-nft-box .price-box .title {
  font-size: 13px;
  color: #a3a3a5;
  font-weight: 500;
  text-transform: capitalize;
  margin-bottom: 5px;
}

.preview-nft-box .price-box .nft-price {
  font-size: 14px;
  color: #ffffff;
  font-weight: 500;
  text-transform: capitalize;
  margin-bottom: 0;
}

.preview-nft-box .price-box .nft-price .d-price {
  font-size: 12px;
  color: #a3a3a5;
  float: right;
}

.preview-nft-box #display-price {
  display: none;
}

/* ----- The Portal (background) ---- */
#coverImagePortal {
  display: none;
}

#profileImagePortal {
  display: none;
}

#verifyAcctPortal {
  display: none;
}


.portal-window { 
  position: fixed;
  z-index: 1030;
  left: 0;
  top: 0;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  background-color: #191c1f;
  background: rgba(25, 28, 31, 0.8);
  display: flex;
  justify-content: center;
  align-items: center;
}

#verifyAcctPortal .form-group input {
  font-size: 20px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 5px;
  text-align: center;
  height: 60px;
  background: #222528;
  color: #ffffff;
  border: 0 solid transparent;
  border-radius: 10px;
}

#verifyAcctPortal .form-group input:focus {
  box-shadow: none;
  outline: none;
}

.change-password {
  margin-bottom: 60px;
}

/* Portal Content/Box */
.portal-window-content {
  color: #ffffff;
  background: #1e2025;
  border: 1px solid #3d4145;
  margin: auto;
  padding: 20px 15px;
  border-radius: 20px;
  width: 30%;
}

.upload-portal {
  padding: 15px;
}

.upload-portal .title {
  font-size: 22px;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 15px;
}


.upload-portal .sub-title {
  font-size: 15px;
  font-weight: 500;
  color: #a3a3a5;
  margin-bottom: 30px;
}

#verifyEmail .upload-portal .sub-title {
  font-size: 15px;
  font-weight: 500;
  color: #e9e9e9;
  margin-bottom: 5px;
}

#verifyEmail .upload-portal .sub-note {
  font-size: 12px;
  font-weight: 400;
  color: #a3a3a5;
  margin-bottom: 30px;
}


#verifyEmail .form-group input {
  font-size: 20px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 5px;
  text-align: center;
  height: 60px;
  background: #222528;
  color: #ffffff;
  border: 0 solid transparent;
  border-radius: 10px;
}

#verifyEmail .form-group input:focus {
  box-shadow: none;
  outline: none;
}

.upload-portal .btn {
  width: 100%;
  color: #ffffff;
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 0.5px;
  padding: 12px 25px;
  text-align: center;
  border-radius: 15px;
}



.upload-portal .btn.btn-secondary {
  background: #ffffff;
  color: #191c1f;
  border: 1px solid #ffffff;
}

.upload-portal .btn.btn-outline {
  margin-top: 20px;
  background: transparent;
  color: #ffffff;
  border: 1px solid #303336;
}

.upload-portal input[type="file"] {
  display: none;
  font-size: 13px;
  margin-top: 30px;
  border-radius: 3px;
  border: 1px solid transparent;
}

.nft-details-content-right .label {
  font-size: 15px;
  font-weight: 500;
  color: #ffffff;
  margin-bottom: 8px;
}

.nft-details-content-right .form-group {
  margin: 30px 0;
}

.nft-details-content-right .form-group .form-control {
  font-size: 14px;
  font-weight: 500;
  background: #222528;
  border: 0 solid transparent;
  color: #ffffff;
}

.nft-details-content-right .form-group .form-control::placeholder {
  color: #585a5c;
}

.nft-details-content-right .form-group .form-control:focus {
  box-shadow: none;
  outline: none;
  border: 1px solid #3d4145;
  background: transparent;
}

.nft-details-content-right .form-group input {
  height: 47px;
  padding-left: 20px;
  border-radius: 15px;
}

.nft-details-content-right .form-group .form-inline {
  display: flex;
  flex-direction: row;
  height: 47px;
  border: 0 solid #3d4145;
  border-radius: 15px;
  background: #222528;
}

.nft-details-content-right .form-group .form-inline p {
  margin: auto;
  padding: 0;
  text-align: center;
  width: 20%;
  font-size: 14px;
  color: #a3a3a5;
}

.nft-details-content-right .form-group .form-inline p .fab {
  margin-left: 5px;
}

.nft-details-content-right .form-group .form-inline .form-control {
  background: transparent;
  border: 0 solid transparent;
  padding-right: 0;
}

.nft-details-content-right .form-group .form-inline:hover {
  background: transparent;
  border: 1px solid #3d4145;
}




/* nft import preview collection */

.import-details-wrapper .nft-details-content-left {
  margin-bottom: 30px;
}

.import-details-wrapper .nft-details-content-left .nft-details-img {
  margin-top: 50px;
  text-align: center;
}

.import-details-wrapper .nft-details-content-left .nft-details-img img {
  width: 350px;
  height: 350px;
  object-fit: cover;
  border-radius: 20px;
  cursor: zoom-in;
}

.import-details-wrapper .nft-details-content-right {
  margin-top: 50px;
}

.import-details-wrapper .nft-collection {
  font-size: 15px;
  font-weight: 500;
  color: #008000;
  margin-bottom: 15px;
}

.import-details-wrapper .nft-name {
  font-size: 27px;
  font-weight: 600;
}

.import-details-wrapper .current-owner {
  margin-top: 20px;
  display: flex;
  margin-bottom: 30px;
}

.import-details-wrapper .current-owner .owner-img {
  width: 40px;
  height: 40px;
  border-radius: 20px;
  overflow: hidden;
}

.import-details-wrapper .current-owner .owner-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.import-details-wrapper .current-owner .owner-info {
  margin-left: 15px;
}

.import-details-wrapper .current-owner .owner-info p {
  margin-bottom: 0;
  padding-bottom: 0;
}

.import-details-wrapper .current-owner .owner-info .owner-note {
  font-size: 13px;
  color: #a3a3a5;
  font-weight: 500;
}

.import-details-wrapper .current-owner .owner-info .username {
  font-size: 15px;
  color: #ffffff;
  text-decoration: none;
  font-weight: 500;
}

.import-details-wrapper .blockchain {
  display: flex;
  padding: 15px;
  margin-bottom: 10px;
  border-top: 1px solid #303336;
  border-bottom: 1px solid #303336;
}

.import-details-wrapper .blockchain p {
  margin: 0;
  padding: 0;
  font-size: 15px;
}

.import-details-wrapper .blockchain .chain {
  font-weight: 400;
}

.import-details-wrapper .blockchain .chain-name {
  font-weight: 500;
  color: #aaaaaa;
  margin-left: 20px;
}

.import-details-wrapper .blockchain .chain-name img {
  width: 12px;
  margin-right: 5px;
}

.import-details-wrapper .nft-price-wrapper {
  border: 0 solid transparent;
  border-radius: 20px;
  padding: 15px;
}

.import-details-wrapper .nft-price-wrapper .price-button .btn {
  text-align: center;
  padding: 12px 20px;
  width: 100%;
  background: #ffffff;
  border: 0 solid transparent;
  border-radius: 15px;
  font-size: 15px;
  font-weight: 600;
  color: #191c1f;
}

.import-nft-header {
  margin-top: 10px;
  margin-bottom: 20px;
}

.import-nft-header h5 {
  font-size: 20px;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 15px;
}

.import-nft-header p {
  font-size: 14px;
  font-weight: 400;
  color: #aaaaaa;
  text-align: justify;
}

.bottom-note {
  font-size: 13px;
  font-weight: 500;
  text-align: center;
  color: #a3a3a5;
}

.display-imported-nfts {
  margin-top: 30px;
}

.dashboard-section .verify-box {
  background: #222528;
  padding: 8px;
  border-radius: 15px;
}

.dashboard-section .verify-box .verify-box-img img {
  width: 100%;
}

.verify-box-text {
  margin-top: 15px;
}

.verify-box-text h5 {
  font-size: 16px;
  font-weight: 600;
  color: #ffffff;
}

.verify-box-text p {
  font-size: 13px;
  font-weight: 500;
  color: #a3a3a5;
}

.dashboard-section .verify-box .btn {
  background: transparent;
  border-radius: 10px;
  border: 1px solid #3d4145;
  font-size: 14px;
  font-weight: 500;
  width: 100%;
  padding: 10px;
}