/**
  * Name: Axies - NFT Marketplace React Template
  * Version: 1.0.1
  * Author: Themesflat
  * Author URI: http://www.themesflat.com
*/

@import "ntfs.css";
@import "shortcodes.css";
@import "responsive.css";
@import "animate.css";
@import "font-awesome.css";
@import url("https://fonts.googleapis.com/css2?family=Urbanist:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
@import "bootstrap.css";

/**
  	* Reset Browsers
    * General
	* Elements
  	* Forms
	* Typography
	* Extra classes
	* link style
	* Root
	* Header
	* Site Logo
    * Menu
    * Header Fixed
    * Pagination
    * Footer
    * Scroll Top
    * Widget
*/

/* Reset Browsers
-------------------------------------------------------------- */

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
    font-family: inherit;
    font-size: 100%;
    font-style: inherit;
    font-weight: inherit;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}

html {
    font-size: 62.5%;
    overflow-y: scroll;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}

*,
*:before,
*:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

body {
    background: var(--primary-color);
    line-height: 1;
    padding-right: 0 !important;
    overflow: hidden;
    height: 100%;
    width: 100%;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
nav,
section {
    display: block;
}

ol,
ul {
    list-style: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

caption,
th,
td {
    font-weight: normal;
    text-align: left;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: "";
    content: none;
}

blockquote,
q {
    quotes: none;
}

a img {
    border: 0;
}

img {
    max-width: 100%;
    height: auto;
}

select {
    max-width: 100%;
}

/* General
-------------------------------------------------------------- */

body,
button,
input,
select,
textarea {
    font-family: "Urbanist", sans-serif;
    color: var(--primary-color2);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

img {
    height: auto;
    max-width: 100%;
    vertical-align: middle;
    -ms-interpolation-mode: bicubic;
}

p {
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
    color: var(--primary-color4);
}

strong,
b,
cite {
    font-weight: bold;
}

dfn,
cite,
em,
i,
blockquote {
    font-style: italic;
}

abbr,
acronym {
    border-bottom: 1px dotted #e0e0e0;
    cursor: help;
}

mark,
ins {
    text-decoration: none;
}

sup,
sub {
    font-size: 75%;
    height: 0;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

small {
    font-size: 75%;
}

big {
    font-size: 125%;
}

address {
    font-style: italic;
    margin: 0 0 20px;
}

code,
kbd,
tt,
var,
samp,
pre {
    margin: 20px 0;
    padding: 4px 12px;
    background: #f5f5f5;
    border: 1px solid #e0e0e0;
    overflow-x: auto;
    -webkit-hyphens: none;
    -moz-hyphens: none;
    hyphens: none;
    border-radius: 0;
    height: auto;
}

/* Elements
-------------------------------------------------------------- */

html {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

*,
*:before,
*:after {
    -webkit-box-sizing: inherit;
    -moz-box-sizing: inherit;
    box-sizing: inherit;
}

hr {
    margin-bottom: 20px;
    border: dashed 1px #ccc;
}

/* List */

ul,
ol {
    padding: 0;
}

ul {
    list-style: disc;
}

ol {
    list-style: decimal;
}

li>ul,
li>ol {
    margin-bottom: 0;
}

li {
    list-style: none;
}

ul li,
ol li {
    padding: 0.1em 0;
}

dl,
dd {
    margin: 0 0 20px;
}

dt {
    font-weight: bold;
}

del,
.disable {
    text-decoration: line-through;
    filter: alpha(opacity=50);
    opacity: 0.5;
}

/* Table */

table,
th,
td {
    border: 1px solid #1e3b8a08;
}

table {
    border-collapse: separate;
    border-spacing: 0;
    border-width: 1px 0 0 1px;
    margin: 0 0 30px;
    table-layout: fixed;
    width: 100%;
}

caption,
th,
td {
    font-weight: normal;
    text-align: left;
}

th {
    border-width: 0 1px 1px 0;
    font-weight: bold;
}

td {
    border-width: 0 1px 1px 0;
}

th,
td {
    padding: 8px 12px;
}

/* Media */

embed,
object,
video {
    margin-bottom: 20px;
    max-width: 100%;
    vertical-align: middle;
}

p>embed,
p>iframe,
p>object,
p>video {
    margin-bottom: 0;
}

/* Forms
-------------------------------------------------------------- */

.dropdown-collections {
    display: flex;
    align-items: center;
}

.dropdown-collections select {
    display: flex;
  flex-direction: column;
  width: 200px;
  background-color: #1e3b8a08;
  justify-content: center;
  border-radius : 6px;
  color: white;
  padding: 10px;
  margin-top: 10px;
 
}


.value {
    background-color: transparent;
    border: none;
    padding: 10px;
    color: white;
    display: flex;
    position: relative;
    gap: 5px;
    cursor: pointer;
    border-radius: 4px;
  }

  .value:not(:active):hover,
.value:focus {
  background-color: #313841;
}

.value:focus,
.value:active {
  background-color: #21262c;
  outline: none;
}

.value::before {
  content: "";
  position: absolute;
  top: 5px;
  left: -10px;
  width: 5px;
  height: 80%;
  background-color: #ffffff;
  border-radius: 5px;
  opacity: 0;
}

.value:focus::before,
.value:active::before {
  opacity: 1;
}

.value svg {
  width: 15px
}


.btn-sort-collections {
    font-size: 12px;
    font-weight: 700;
    border: 1px solid #1e3b8a08;
    padding: 10px;
    border-radius: 6px;
    background-color: transparent;
    margin-top: 10px;
    margin-left: 25px;
    width: 150px;
    
}

.btn-sort-collections:hover {
    font-size: 12px;
    font-weight: 700;
    border: 1px solid #1e3b8a08;
    padding: 10px;
    border-radius: 6px;
    background-color: #21262c;
    color: white;
    text-shadow: 0 0 10px #ffffff;
    box-shadow: 0 0 10px white;
}

.label-collections {
    font-size: 12px;
    padding: 10px;
}

.title-collections {
    text-align: center;
    
}

.collection-details p{
    font-size: 14px;
    text-align: center;
    margin-top: 10px;
}

.collection-details p span:hover {
    text-shadow: 0 0 5px white;
}

.double-title {
    font-size: 58px;
    
}

.slider-minting {
    cursor: grab;
    height: fit-content;
    transition: transform 0.3s ease;
  }
  
  .slider-minting:hover {
    transform: translateX(-20px); /* Adjust the amount you want the slider to move to the left */
  }

  .see-more-swiper {
    padding-bottom: 10px;
    margin-bottom: 10px;
    font-size: 16px;
    text-align: center;
    font-weight: bold;
  }

.artworks {
    background-color: #1e3b8a08;
}

.mint-price {
    font-size: 12px;
    padding-bottom: 10px;
    color: white;
}

.mint-prices {
    font-size: 16px;
    padding-bottom: 10px;
    color: white;
}

.mint-prices:hover {
    font-size: 16px;
    padding-bottom: 10px;
    color: white !important;
}

.dropdown-with-scrollbar {
    overflow: scroll;
  scrollbar-color: red orange;
  scrollbar-width: thin;
  }

  

.btn-selector {
    width: 250px;
}

.nft-item-details {
    
    border-radius: 6px;
    padding: 10px;
    padding-left: 20px;
    padding-right: 20px;
    background-color: #7E94C5;
    border: 1px solid #1e3b8a08;
    padding-bottom: 20px;
}

.nft-item-details-meta {
    border-radius: 6px;
    padding: 10px;
    padding-left: 40px;
    padding-right: 40px;
    background-color: #1e3b8a08;
    border: 1px solid #1e3b8a08;
    margin-top: 10px;
    
}

.tabs-meta {
    font-size: 14px;
    border-bottom: 1px solid #1e3b8a41;
    margin: 5px;
}

.content-row-item {
    font-size: 14px !important;
}

.content-row-detail {
    font-size: 14px !important;
    color: white !important;
}

.style2  {
    text-align: center;
    padding-top: 10px;
    }

.style2-link {
    text-align: center;
    font-size: 12px;
}

.style2-link:hover {
    text-shadow: 0 0 3px white;
    text-align: center;
}

/* Default styles for .item-detail-collection */
.item-detail-collection {
    border-radius: 6px;
    border: 1px solid #1e3b8a08;
    background-color: #1e3b8a2c;
    margin-left: 0px;
    margin-top: 25px;
    margin-bottom: 25px;
  }
  
  /* Media query for screens with a maximum width of 768px */
  @media (max-width: 768px) {
    .item-detail-collection {
      width: 100%; /* Width is 100% to center and fill the screen */
      margin: 0; /* Remove margin for smaller screens */
      margin-top: 25px;
      margin-bottom: 25px;
    }
  }

.modal-make-offer {
    width: fit;
    border-radius: 6px !important;
    padding: 5px;
   border: 1px solid #1e3b8a08;
    margin: 0px;
}
  
.item-detail-owner {
    background: #1e3b8a08;
  border-radius: 6px;
  width: 100%;
  padding: 8px;
}

.item-detail-info {
    
    font-size: 12px;
    margin-top: 5px;
}

.p-offers {
    text-align: center;
    font-size: 25px !important;
    padding: 10px;
}

.text-link-detail {
    font-size: 14px !important;
}

.item-detail-desription {
    color: white;
    font-size: 12px;
}

.popup {
    padding: 0px;
    border-radius: 6px !important;
    margin-top: 10%;
}

.innerbody-modal {
    background-color: #1e3b8a08;
    border-radius: 6px !important;
    padding: 8px;
}

.sc-btn-modal {
    display: inline-block;
 border: 1px solid #1e3b8a08;
  color: white;
  box-sizing: border-box;
  padding: 11px 35px;
  border-radius: 6px;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
  margin-left: 40%;
  font-size: 14px;
  
}

.sc-btn-modal:hover {
    text-shadow: 0 0 3px white;
}

.item-meta-price {
    width: fit-content;
    padding: 5px;
    padding-left: 15px;
    padding-right: 15px;
}

.meta-item-details-price {
    border-radius: 6px;
    padding: 10px;
    background-color: #1e3b8a2c;
    border: 1px solid #1e3b8a08;
    margin-bottom: 25px;
    justify-content: center;
    align-items: center;
    display: flex;
}

.price {
    margin-top: 5px;
}

.btn-item-detail {
    font-size: 12px;
    font-weight: 700;
    border: 3px solid white;
    padding: 10px;
    border-radius: 6px;
    margin-bottom: 10px;
    width: 100%;
    text-align: center;
    text-transform: uppercase;
    background-color: #1e3b8a08;
}

.btn-item-detail:hover {
    color: white;
    cursor: pointer;
    text-shadow: 0 0 10px #ffffff;
    box-shadow: 0 0 10px white;
}

.media-item-detail {
    display: flex;
    justify-content: center;
    align-items: center;
}

.media-item-detail img {
   border: 1px solid #1e3b8a08;
    border-radius: 6px;
}

.content-left {
    margin-top: 20px;
}

.collection-info {
    display: flex;
}

.collection-info p {
    margin-top: 10px;
    font-size: 14px;
    margin-left: 10px;
    color: white;
}

.collection-info p:hover {
    text-shadow: 0 0 10px #ffffff;
}

.collection-info img {
    width: 45px !important;
    height: 45px;
    border-radius: 6px;
    margin: 5px;
    border: 1px solid #1e3b8a08;
    margin-bottom: 10px;
}

.carousel-live-auctions {
    border-radius: 6px;
    padding: 10px;
    background-color: #1e3b8a08;
   border: 1px solid #1e3b8a08;
    margin-bottom: 10px;
    height: fit-content;
}

.carousel-live-auctions:hover {
    box-shadow: 0 0 10px white;
}

.carousel-card-media {
    overflow: hidden;
    border-radius: 5px;
    max-height: 350px;
    min-height: 350px;
    min-width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.carousel-card-media img {
    width: 100%;
    height: 100%;
    padding: 0px;
    margin: 0px;
    object-fit: cover; /* Use 'cover' to maintain aspect ratio and crop the image */
}

.imgauction {
    width: 100%;
}

.market-card-media {
    overflow: hidden;
    border: 1px solid #1e3b8a08;
    border-radius: 6px;
    position: relative; /* Set position to relative */
    padding-bottom: 100%; /* 1:1 Aspect Ratio (square) */
    display: flex;
    align-items: center;
    justify-content: center;
}

.market-card-media img {
    position: absolute; /* Set position to absolute */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover; /* Use 'cover' to maintain aspect ratio and crop the image */
}

.market-card-media-project {
    overflow: hidden;
    border: 1px solid #1e3b8a08;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    object-fit: cover;
}

  
.info-card-carousel {
    border-radius: 6px;
    background-color: transparent;
   
    height: fit-content;
    margin-top: 10px;
}

.card-title-carousel {
    text-align: left;
    padding: 5px;
    font-size: 14px !important;
    height: 35%;
    
}

.card-title-carousel-name {
    border-bottom: 1px solid #1e3b8a2c;
    font-size: 18px !important;
    padding: 5px;
}

.meta-info-carousel {
    justify-content: space-between;
    display: block; 
}

.card-rank-carousel {
    padding: 5px;
    font-size: 12px !important;
    border-bottom: 1px solid #1e3b8a2c;
}

/* .info-group {
    text-align: center;
}

.info-group h6, .info-group h5 {
    font-weight: bold;
    margin-bottom: 5px;
}

.info-group span {
    display: block; 
}
    /* Display each value on a new line */
 
.box-rank {
    font-size: 14px;
    padding: 5px;
}
.author-carousel {
    display: flex;
    align-items: left;
    
}

.info-auction-carousel {
    font-size: 14px !important;
    border-bottom: 1px solid #1e3b8a2c;
}

.price {
    display: flex;
    align-items: left;
    padding: 5px;
}

.price-card {

    display: flex;
    align-items: left;
    padding: 5px;
}

.owner-carousel {
    text-align: left;
    padding: 5px;
}

.address-carousel {
    padding: 5px;
}

.address-carousel h6 {
    color: white !important;
    padding: 5px;
    margin: 5px;
}

.address-carouseli {
    color: white !important;
    padding: 5px;
    font-size: 8px !important;
}

.address-carousel:hover {
    text-decoration: underline;
    color: white !important;
}

.owner-carousel span {
    font-size: 14px !important;
    padding: 5px;
    color: white !important;
}

.buy-now-button {
    display: flex; /* Use flex container */
    align-items: center; /* Center vertically */
    justify-content: space-between; /* Center horizontally */
    font-size: 12px;
    font-weight: 700;
   border: 1px solid #1e3b8a2c;
    padding: 10px;
    border-radius: 6px;
    margin-bottom: 10px;
   margin-top: 10px;
    text-align: center;
    background-color: transparent;
}

.buy-now-button:hover {
    text-shadow: 0 0 5px #ffffff;
    color: white !important;
   border: 1px solid #1e3b8a08;
    background-color: transparent;
}

.edit-now-button {
    display: flex; /* Use flex container */
    align-items: center; /* Center vertically */
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
   border: 1px solid #1e3b8a08;
    padding: 10px;
    border-radius: 6px;
    margin-bottom: 10px;
   margin-top: 10px;
    background-color: transparent;
}

.edit-now-button:hover {
    text-shadow: 0 0 5px #ffffff !important;
    box-shadow: 0 0 5px #ffffff !important;
    color: white !important;
   border: 1px solid #1e3b8a08;
    background-color: transparent;
}

.swiper-pagination-bullet {
    color: white !important;
    fill: white !important;
}

.swiper-pagination-bullet-active {
    color: white !important;
   border: 1px solid #1e3b8a08;
    fill: white !important;
}

.center-button {
    display: flex; /* Use flex container */
    align-items: center; /* Center vertically */
    justify-content: center; /* Center horizontally */
    
}

.Market-card {
    border-radius: 6px;
    padding: 10px;
    background-color: #7E94C5;
   border: 1px solid #1e3b8a08;
    margin-bottom: 25px;
    margin-left: -15px;
    height: fit-content;
}

.wht-txt {
    color: white !important;
}

.Market-card:hover {
    box-shadow: 0 0 10px white;
}

.mainslider {
    padding-top: 4.2%;
    width: 100%;
    height: 100%;
}

@media screen and (max-width: 768px) {
    .mainslider {
        padding-top: 3.2%; /* Adjust the padding for screens wider than 768px */
        width: 100%;
        text-align: center;
        font-size: smaller;
    }
}

/* Media Query for screens 992px wide and above */
@media screen and (min-width: 992px) {
    .mainslider {
        padding-top: 2.2%; /* Adjust the padding for screens wider than 992px */
    }
}

.info-collection-market {
    display: flex;
    align-items: center; /* Center vertically */
    justify-content: center; /* Center horizontally */
}

.info-collection-market h6 {
    font-size: 14px;
    margin-left: 5px;
}

.info-collection-market h6:hover {
    color: white !important;
    text-shadow: 0 0 5px #ffffff;
}

.white-text-hover:hover {
    color: white !important;
    text-shadow: 0 0 5px #ffffff;
}

.card-title-market-name {
    border-bottom: 1px solid white;
    font-size: 16px !important;
    padding-bottom: 8px;
    margin-top: 2px;
    min-height: 40px;
    align-items: center; /* Center vertically */
    justify-content: center; /* Center horizontally */
}

.link-market:hover {
    text-shadow: 0 0 5px #ffffff;
    color: white !important;
}

.card-title-market {
    text-align: center;
    padding: 5px;
    }

.card-title-collection-name {
    text-align: center;
    padding: 10px;
    border-bottom: 1px solid white;
    display: flex;
    align-items: center; /* Center vertically */
    justify-content: center; /* Center horizontally */
}

.card-title-collection-name:hover {
    text-shadow: 0 0 5px #ffffff;
    color: white !important;
}

.ranking-market {
    height: 23px;
}

.explore-slider {
    font-size: 14px;
    text-decoration: underline;
}

.explore-slider:hover {
    color: white !important;
    text-decoration: underline;
    font-size: 16px;
}

.explore-slider-sale {
    font-size: 18px;
    text-decoration: underline;
    text-align: center;
    display: flex;
  justify-content: center;
  align-items: center;
  padding-bottom: 20px;
}

.explore-slider-sale:hover {
    
    text-decoration: underline;
    color: white !important;
    text-shadow: 0 0 5px #ffffff;
}


.rank-market {
    padding: 5px;
    display: flex;
    justify-content: space-between;
    align-items: center; /* Center vertically */
    justify-content: center; /* Center horizontally */
}

.rank-market-collection {
    padding: 5px;
    display: flex;
    justify-content: space-between;
    align-items: center; /* Center vertically */
    justify-content: center; /* Center horizontally */
    border-bottom: 1px solid white;
}

.tool-buttons-basket {
    display: flex;
  justify-content: flex-end;
  align-items: center;
  min-height: 40px;
}

.tool-buttons-basket > svg {
    fill: #fff; /* Set the fill color to white */
    margin-left: 10px; /* Add spacing between icons if needed */
    margin-top: 10px;
  }

  .tool-buttons-basket > svg:hover {
    fill: #fff; /* Set the fill color to white */
  }

.hover-scale-basket {
    color: white !important;
}

.buy-now-message {
    display: none;
    position: absolute;
    background-color: #1e3b8a08;
    color: white;
    padding: 5px 10px;
    border-radius: 6px;
    top: 430px; /* Adjust this value to position the message as needed */
    right: 0;
    font-size: 14px;
   border: 1px solid #1e3b8a08;
  }
  
  .tool-buttons-basket:hover .buy-now-message {
    display: block;
  }
  

.price-market {
    display: flex; /* Use flex container */
    justify-content: space-between;
    margin-top: 10px;
}

.price-project-market {
    display: flex; /* Use flex container */
    justify-content: space-between;
   margin: 5px;
}

.font-price-market {
    font-size: 14px;
}

.bg-main-slider {
    background-color: #A6B9DD !important;
    display: flex;
    align-items: center; /* Center vertically */
    justify-content: center; /* Center horizontally */
}

.text-main-slider {
    padding-top: 20%;
    
}

.image-main-slider {
    display: none !important;
    height: 500px;
    padding-top: 20%;
    align-items: center; /* Center vertically */
    justify-content: center; /* Center horizontally */
}

@media screen and (max-width: 768px) {
    .image-main-slider {
        padding-top: 3.2%; /* Adjust the padding for screens wider than 768px */
        width: 100%;
        text-align: center;
        padding-left: 0px;
        display: none; /* Hide the image on screens less than 768px wide */
    }
}

/* Media Query for screens 992px wide and above */
@media screen and (min-width: 1090px) {
    .image-main-slider {
        padding-top: 2.2%; /* Adjust the padding for screens wider than 992px */
        display: flex; /* Hide the image on screens less than 768px wide */
    }
}


.heading-slider {
    font-size: 60px;
   
    
}

@media screen and (max-width: 768px) {
    .heading-slider {
        padding-top: 3.2%; /* Adjust the padding for screens wider than 768px */
        width: 100%;
    }
}

/* Media Query for screens 992px wide and above */
@media screen and (min-width: 1080px) {
    .heading-slider {
        padding-top: 2.2%; 
       
        padding-left: 0px;/* Adjust the padding for screens wider than 992px */
    }
}

.heading-slider-2 {
    font-size: 60px;
   
    padding-top: 20px;
}

@media screen and (max-width: 768px) {
    .heading-slider-2 {
        padding-top: 3.2%; /* Adjust the padding for screens wider than 768px */
        
       
        padding-left: 0px;
    }
}

/* Media Query for screens 992px wide and above */
@media screen and (min-width: 992px) {
    .heading-slider-2 {
        padding-top: 2.2%;
        width: 100%;
        
        padding-left: 0px; /* Adjust the padding for screens wider than 992px */
    }
}

.sub-heading-slider {
    font-size: 35px;
    color: white;
}

.rocket {
    color: white !important;
}

.rocket:hover {
    color: white !important;
}

.minting-now-swiper-block {
    background-color: #313841;
    
    border-radius: 6px;
   border: 1px solid #1e3b8a08;
    margin-top: 50px;
}

.listed-now-swiper-block {
    background-color: #313841;
    padding: 10px;
    border-radius: 6px;
   border: 1px solid #1e3b8a08;
    margin-top: 10px;
}

.some-info-block {
    background-color: #313841;
    padding: 10px;
    border-radius: 6px;
   border: 1px solid #1e3b8a08;
    min-height: max-content;
    align-items: center; /* Center vertically */
    margin-top: 50px;
}

.new-collections-block {
    background-color: #313841;
    padding: 10px;
    border-radius: 6px;
   border: 1px solid #1e3b8a08;
    text-align: center;
}

.new-collections-block-page {
    background-color: #313841;
    padding: 10px;
   border: 1px solid #1e3b8a08;
    text-align: center;
    border-top: 1px solid transparent;
}

/* Add this to your CSS */
.create-card {
    background-color: #fff; /* Set the background color you prefer */
    border: 1px solid #e5e5e5; /* Add a border */
    border-radius: 5px; /* Round the corners */
    padding: 20px; /* Adjust padding as needed */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Add a shadow for a card-like effect */
    transition: transform 0.2s; /* Add a smooth hover effect */
    flex: 0 1 calc(33.33% - 20px); /* Set the width of each item (adjust as needed) */
  }

  .items-info-block {
    display: flex; /* Use flex display for the container */
    flex-wrap: wrap; /* Allow items to wrap to the next line when they reach the container's width */
    padding: 10px;
    background-color: #1e3b8a4b;  
    margin-top: 10px;
    border-radius: 5px;
}
  .create-card:hover {
    transform: translateY(-5px); /* Raise the card slightly on hover */
  }

  .card-info-more {
   border: 1px solid #1e3b8a08;
    background-color: #47a432 !important;
  }

  .heading-info-block {
    color: white;
    padding: 10px;
  }

  .heading-info-block:hover {
    color: white !important;
    text-shadow: 0 0 5px #ffffff;
  }
  

.new-collections-swiper-block {
    background-color: #313841;
    padding: 10px;
    border-radius: 6px;
   border: 1px solid #1e3b8a08;
    padding-bottom: 10px;
}

.header-swiper-minting {
    display: flex;
    align-items: center; /* Center vertically */
    justify-content: center; /* Center horizontally */
    padding-top: 10px;
}

.mint-now-text {
   border: 1px solid #1e3b8a08;
    text-align: left;
    width: 100%;
    padding: 7px;
    border-radius: 6px;
    background-color: transparent;
}

.swaptxt {
    
    text-align: center;
    width: 100%;
    padding: 7px;
    border-radius: 6px;
    
    font-size: 36px;
}

.vechain {
    align-items: center;
    justify-content: center;
    display: flex;
}

.centertxtswap {
    align-items: center;
    justify-content: center;
    display: flex;
}

.txtenergy {
    font-size: 16px;
}
.txtenergy:hover {
    font-size: 18px;
    color: white !important;
    text-shadow: 0 0 10px white;
    
}

.bg-main-slider {
    border-bottom: 2px solid white;
}

.onrampbtnblock {
    align-items: center;
    justify-content: center;
    padding-top: 3%;
   
}

.onrampbtnblockt {
    padding-top: 5%;
    padding-bottom: 50px;
}

.paddingbtn {
    margin: 7px;
    
}

.paddingbtnt {
    margin: 10px;
    
    --glow-color: rgb(179, 200, 226);;
 --glow-spread-color: rgba(185, 200, 240, 0.781);
 --enhanced-glow-color: rgb(147 197 253);;
 --btn-color: rgb(119, 143, 210);
 border: 1px solid #1e3b8a08;
 padding: 10px;
 justify-content: center;
  align-items: center;
  display: flex;
 color: white;
 font-size: 15px;
 font-weight: bold;
 background-color: #1e3b8a4b;
 border-radius: 6px;
 outline: none;
 box-shadow: 0 0 1em .25em var(--glow-color),
        0 0 4em 1em var(--glow-spread-color),
        inset 0 0 .75em .25em var(--glow-color);
 text-shadow: 0 0 .5em var(--glow-color);
 position: relative;
 transition: all 0.3s;
 width: 200px !important;  /* Adjust as needed */
 height: 50px;  /* Adjust as needed */
}

.button-group {
    display: flex;
    flex-direction: column;
    gap: 10px; /* Adjust the gap between button pairs */
  }
  
  .button-pair {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
  }

.paddingbtnt::after {
    pointer-events: none;
    content: "";
    position: absolute;
    top: 120%;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: var(--glow-spread-color);
    filter: blur(2em);
    opacity: .7;
    transform: perspective(1.5em) rotateX(35deg) scale(1, .6);
   }
   
   .paddingbtnt:hover {
    color: var(--btn-color);
    background-color: var(--glow-color);
    box-shadow: 0 0 1em .25em var(--glow-color),
           0 0 4em 2em var(--glow-spread-color),
           inset 0 0 .75em .25em var(--glow-color);
   }
   
   .paddingbtnt:active {
    box-shadow: 0 0 0.6em .25em var(--glow-color),
           0 0 2.5em 2em var(--glow-spread-color),
           inset 0 0 .5em .25em var(--glow-color);
   }

   /* Responsive styles using media queries */
@media screen and (max-width: 600px) {
    .vechain, .centertxtswap, .onrampbtnblock, .onrampbtnblockt {
        flex-direction: column;
        align-items: stretch;
       
    }

    .swaptxt {
        font-size: 24px;
    }

    .txtenergy {
        font-size: 14px;
    }

    .txtenergy:hover {
        font-size: 16px;
    }

    .paddingbtn, .paddingbtnt {
        font-size: 12px;
        padding: 0.5em 1.5em;
        margin: 5px;
        flex-direction: column;
    }
}

.create-now-text {
   border: 1px solid #1e3b8a08;
    text-align: center;
    width: 100%;
    padding: 7px;
    border-radius: 6px;
    background-color: #1e3b8a08;
    margin-top: 10px;
}

.for-sale-now-text {
   border: 1px solid #1e3b8a08;
    text-align: center;
    width: 100%;
    padding: 7px;
    border-radius: 6px;
    background-color: #1e3b8a08;
}

.mint-now-text-desc {
    padding: 10px;
    font-size: 14px;
}



.test-class {
    border: 2px solid green;
    text-align: center;
    width: fit-content;
    padding: 7px;
    border-radius: 6px;
    background-color: #1e3b8a08;
}

/* Styles for screens larger than 768px (adjust as needed) */
.block-grid {
    width: 44.5%;
}

.block-grider {
    width: 100%;
background-color: transparent !important;
align-items: center;
justify-content: center;
display: flex;
padding-bottom: 10px;
}

.grid-size-buttons {
    align-items: center;
    margin: 10px;
    font-size: 12px;
}

.grid-size-button {
    border-radius: 6px;
   border: 1px solid #1e3b8a08;
    margin-left: 10px;
    font-size: 12px;
    
}

.grid-size-button:active::after {
    color: #17255484 ;
}

.grid-size-button:hover {
    color: white;
   border: 1px solid #1e3b8a08;
    text-shadow: 0 0 5px #ffffff;
}

.search-bar {
    display: flex;
    padding-left: 26%;
}

.input-cltn {
    border: 2px solid rgb(255, 255, 255) !important;
}

.btn-search-cltn {
    border: 1px solid #1e3b8a08;
    margin-left: 10px;
    border-radius: 6px;
}

/* Media query for screens smaller than 768px (adjust as needed) */
@media (max-width: 768px) {
    .block-grid {
        display: none; /* Hide grid size options */
    }

    .search-bar {
        
        padding-top: 10px;
        padding-left: 0;
    }

    .grid-size-buttons {
        display: none; /* Hide grid size buttons on mobile */
    }

    .sorting-container {
        display: none;
    }

    .dropdown-collections {
        display: none;
    }
}

.social-icons {
    display: flex;
    align-items: center;
    justify-content: center;
    color: white !important;
    fill: white;
    padding: 10px;
}

.social-icons img:hover {
    transform: scale(1.1); /* Scale the image up slightly on hover */
}

.social-icons a {
    margin-right: 10px; /* Adjust the spacing between icons */
}

.social-icons img {
    width: 45px; /* Adjust the icon size as needed */
    height: 45px; /* Adjust the icon size as needed */
}

.footer-light-style {
    border-top: 2px solid white;
}

.btn-copycode {
    color: white !important;
}

.avatar-profile {
   border: 1px solid #1e3b8a08;
    border-radius: 6px;
    width: 50%; /* default width for larger screens */
    transition: none; /* disable any transition effects */
}

/* adjust the width for smaller screens */
@media screen and (max-width: 768px) {
    .avatar-profile {
        width: 30%;
    }
}

/* adjust the width for even smaller screens */
@media screen and (max-width: 480px) {
    .avatar-profile {
        width: 50%;
    }
}

.username-profile {
    display: flex;
    font-size: 2.5vw;
    align-items: center; /* Center vertically */
    justify-content: left;
}

.content-profile {
    display: flex;
    min-height: 50%;
    
}

.address-profile {
    width: 100%;
    display: flex;
    border: 1px solid #1e3b8a08;
    border-radius: 6px;
    margin: 10px;
}

.inputcopy {
   border-radius: 6px !important;
   background-color: transparent !important;
}

.btn-copycode:hover {
    text-shadow: 0 0 5px #ffffff;
}

.author-profile {
    display: flex; /* align child elements in a row */
    
    align-items: center; /* center child elements vertically */
    border: 1px solid #1e3b8a08;
    border-top-left-radius: 6px !important;
    border-top-right-radius: 6px !important;
    background-color: #1e3b8a08 !important;
    padding: 10px; /* add some space around the content */
    margin-top: 50px; /* adjust as needed to prevent the banner from being hidden */
}



.author-profile .info {
    display: flex;
    flex-direction: column;
    flex-grow: 1; /* allow the info to take up the remaining space */
}

.info .username-profile,
.info .content-profile,
.info .address-profile {
    margin-bottom: 10px; /* add some space between the elements */
}

/* other styles remain the same */

/* ... */

.widget-social:hover {
    text-shadow: 0 0 5px #ffffff;
}

.grid-container {
    display: grid;
    grid-template-columns: 1fr 1fr; /* this will create two columns of equal width */
    gap: 10px; /* optional: this will create a 10px gap between the columns */
    width: 100%;
  }

.tab-list-with-border {
    border-top: 2px solid transparent;
    border: 1px solid #1e3b8a08;
    border-radius: 6px;
    color: white;
    display: flex;
    flex-direction: column;
    background-color: #1e3b8a4b;

    width: 100%;
}

.bordercollected {
    
    border-radius: 6px;
   display: flex;
    margin-top: 10px;
    width: 100%;
}

.Grid {
    border: 1px solid #1e3b8a08;
    border-radius: 6px;
   display: flex;
    margin-top: 10px;
    width: 100%;
    justify-content: center;
    align-items: center;
    max-height: 45%;
    background-color: #1e3b8a4b;

}

.Gridje {
    border: 1px solid #1e3b8a08;
    border-radius: 6px;
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    max-height: 45%;
    background-color: #1e3b8a4b;
    margin-top: 10px;
}

.Gride {
    border: 1px solid #1e3b8a08;
    border-radius: 6px;
    top: 10px;
    margin-top: 10px;
    width: 100%;
    justify-content: center;
    align-items: center;
    display: flex;
    max-height: 55%;
    background-color: #1e3b8a4b;

    box-sizing: border-box; /* Include padding in width calculation */
}

.Gridetxt {
    font-size: 12px !important;
    
}

.bggride {
    background-color: #17255484 !important;
}

.paddingsort {
    padding: 5px;
    font-size: 12px !important;

}

.active-tab {
    border: 1px solid #1e3b8a08;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: transparent !important;
}

.custom-tab {
    display: flex;
    border: 1px solid #1e3b8a08;
    padding: 10px;
    border-radius: 6px !important;
    margin: 10px;
    width: 95%;
   justify-content: center;
    align-items: center;
    background-color: #17255484  !important;
    color: white !important;
    cursor: pointer;
    font-size: 12px;
  }
  
  .custom-tab:hover {
    text-shadow: 0 0 5px #ffffff;
    background-color: transparent;
    color: rgb(255, 255, 255) !important; /* Set text color to black on hover */
    box-shadow: 0 0 5px #ffffff;
  }
  
  .custom-tab.active {
    background-color: white !important;
    color: black !important; /* Set text color to black for the active tab */
    box-shadow: 0 0 5px #ffffff !important;
  }
  
  .content-tab-profile {
    padding-top: 10px;
    
  }

 .content-tab-profiles {
    display: flex !important;
    border: 1px solid #1e3b8a08;
 }

 .horizontalsortdiv {
    display: flex;
    justify-content: right;
    align-items: right;
    padding: 10px;
    border: 1px solid #1e3b8a08;
    border-radius: 6px;
    margin-top: 10px;
    background-color: #1e3b8a08;
    width: 100% ;
    font-size: 12px !important;
 }

 @media (max-width: 600px) {
    .grid-container {
      grid-template-columns: 1fr; /* Change to a single column layout */
      max-width: 100% !important; /* Adjust max-width for smaller screens */
    }
  
    .Grid,
    .tab-list-with-border,
    .Gride {
      width: 100% !important; /* Set width to 100% for smaller screens */
      
    }
  
    .tab-list-with-border {
      padding: 5px; /* Add padding to the tab list */
    }
  
    .Gridetxt {
      font-size: 10px !important; /* Decrease font size for smaller screens */
    }

    .Grid {
        margin-top: -3px !important;
    }
  }
  

  .ranking-marketi {
    height: 30px;
  }

  .priceprice-market {
    justify-content: center;

  }

/* Fixes */

button,
input {
    line-height: normal;
}

button,
input,
select,
textarea {
    font-size: 100%;
    line-height: inherit;
    margin: 0;
    vertical-align: baseline;
}

input,
textarea,
select {
    font-size: 14px;
    max-width: 100%;
    background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0),
            rgba(255, 255, 255, 0));
}

textarea {
    overflow: auto;
    vertical-align: top;
}

input[type="checkbox"] {
    display: inline;
}

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
    line-height: 1;
    cursor: pointer;
    -webkit-appearance: button;
    border: 0;
}

input[type="checkbox"],
input[type="radio"] {
    padding: 0;
    width: 18px;
    height: 18px;
    margin-right: 11px;
    cursor: pointer;
    vertical-align: sub;
}

input[type="search"] {
    -webkit-appearance: textfield;
}

input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0;
}

/* Remove chrome yellow autofill */

input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px #f7f7f7 inset;
}

/* Reset search styling */

input[type="search"] {
    outline: 0;
}

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
    display: none;
}

/* Contact Form 7 */

.wpcf7-form select,
.wpcf7-form textarea,
.wpcf7-form input {
    margin-bottom: 0;
}

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -ms-appearance: none;
}

.select {
    position: relative;
    overflow: hidden;
}

.select::after {
    font-family: "Font Awesome 5 Pro";
    content: "\f078";
    font-size: 14px;
    right: 10px;
    font-weight: 600;
    color: #1f1f2c;
    display: block;
    position: absolute;
    background: 0 0;
    top: 50%;
    pointer-events: none;
    -webkit-transition: 0.25s all ease;
    -o-transition: 0.25s all ease;
    transition: 0.25s all ease;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

select option {
    font-size: 15px;
    line-height: 24px;
    color: #1f1f2c;
}

textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"] {
    border: 1px solid rgba(138, 138, 160, 0.3);
    outline: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    font-size: 18px;
    line-height: 28px;
    border-radius: 4px;
    padding: 13px 15px;
    width: 100%;
    background: transparent;
    color: #fff;
}

/* Input focus */

textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus {
    border: 1px solid #fff;
    outline: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

textarea::placeholder,
input[type="text"]::placeholder,
input[type="password"]::placeholder,
input[type="datetime"]::placeholder,
input[type="datetime-local"]::placeholder,
input[type="date"]::placeholder,
input[type="month"]::placeholder,
input[type="time"]::placeholder,
input[type="week"]::placeholder,
input[type="number"]::placeholder,
input[type="email"]::placeholder,
input[type="url"]::placeholder,
input[type="search"]::placeholder,
input[type="tel"]::placeholder,
input[type="color"]::placeholder {
    font-size: 18px;
    font-weight: 400;
    line-height: 28px;
    color: #fff;
}

/* Button */

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    background-color: var(--primary-color3);
    color: #fff;
    border-radius: 30px;
    padding: 15px 39px;
    border: 1px solid var(--primary-color3);
    display: inline-block;
    -webkit-appearance: none;
    -webkit-transition: all ease 0.3s;
    -moz-transition: all ease 0.3s;
    transition: all ease 0.3s;
}

/* Button hover + focus */

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover,
button:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
input[type="submit"]:focus {
    outline: 0;
    border: 1px solid var(--primary-color3);
    color: var(--primary-color3);
    /* background: transparent; */
}

/* Placeholder color */

::-webkit-input-placeholder {
    color: #ffffff;
}

:-moz-placeholder {
    color: #ffffff;
}

::-moz-placeholder {
    color: #ffffff;
    opacity: 1;
}

.error {
    font-size: 16px;
    color: var(--primary-color2);
    margin-bottom: 10px;
    -webkit-transition: all ease 0.3s;
    -moz-transition: all ease 0.3s;
    transition: all ease 0.3s;
}

/* Since FF19 lowers the opacity of the placeholder by default */

:-ms-input-placeholder {
    color: #ffffff;
}

/* Typography
-------------------------------------------------------------- */

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 700;
    text-rendering: optimizeLegibility;
}

h1 {
    font-size: 48px;
}

h2 {
    font-size: 36px;
}

h3 {
    font-size: 24px;
}

h4 {
    font-size: 20px;
}

h5 {
    font-size: 13px;
}

h6 {
    font-size: 11px;
}

.fs-16 {
    font-size: 16px;
}

/* h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
    color: inherit
} */

/* Extra classes
-------------------------------------------------------------- */

.msg-success {
    background: linear-gradient(to right, #9b92f1, #6154d6, #9b92f1);
    background-clip: text;
    -webkit-background-clip: text;
    font-weight: 700;
    background-size: 200% 200%;
    animation: rainbow 2s ease-in-out infinite;
    color: rgb(0 0 0 / 0);
    transition: color 0.2s ease-in-out;
    font-size: 18px;
    font-weight: 400;
    line-height: 28px;
}

label.error {
    color: red;
}

.live-auctions .swiper-button-next:after,
.live-auctions .swiper-button-prev:after {
    font-family: "Font Awesome 5 Pro";
    font-size: 20px;
}

.live-auctions .swiper-button-next:after {
    content: "\f061";
}

.live-auctions .swiper-button-prev:after {
    content: "\f060";
}

.flex {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.wrap-inner {
    display: block;
    width: 100%;
}

.center,
.text-center {
    text-align: center;
    
}

.text-center .heading  {
    color: transparent;
    
}

.fs-30 {
    font-size: 30px !important;
}

.fs-32 {
    font-size: 32px !important;
}

.pd-0 {
    padding: 0 !important;
}

.mg-t-29 {
    margin-top: 29px;
}

.mg-bt-50 {
    margin-bottom: 50px;
}

.mg-bt-60 {
    margin-bottom: 60px;
}

.mg-bt-62 {
    margin-bottom: 62px;
}

.mg-bt-10 {
    margin-bottom: 10px;
}

.mg-r-12 {
    margin-right: 12px;
}

.mg-bottom-0 {
    margin-bottom: 0;
}

.mg-t16 {
    margin-top: 16px;
}

.mg-bt-32 {
    margin-bottom: 32px !important;
}

.mg-bt-12 {
    margin-bottom: 12px;
}

.mg-bt-2 {
    margin-bottom: 2px;
}

.mg-bt-21 {
    margin-bottom: 21px;
}

.mg-l-39 {
    margin-left: 39px;
}

.mg-bt-31 {
    margin-bottom: 31px;
}

.mg-bt-43 {
    margin-bottom: 43px;
}

.mg-bt-23 {
    margin-bottom: 23px;
}

.mg-bt-16 {
    margin-bottom: 16px !important;
}

.mg-bt-20 {
    margin-bottom: 20px;
}

.mg-bt-30 {
    margin-bottom: 30px;
}

.mg-bt-13 {
    margin-bottom: 13px;
}

.mg-t-24 {
    margin-top: 24px;
}

.mg-t-20 {
    margin-top: 20px;
}

.mg-t-22 {
    margin-top: 22px;
}

.mg-t-15 {
    margin-top: 15px;
}

.mg-t-21 {
    margin-top: 21px;
}

.mg-t-37 {
    margin-top: 37px;
}

.mg-t-9 {
    margin-top: -9px;
}

.mg-t-4 {
    margin-top: -4px;
}

.mg-t-2 {
    margin-top: -2px;
}

.mg-t2 {
    margin-top: 2px;
}

.mg-t32 {
    margin-top: 32px;
}

.mg-bt-24 {
    margin-bottom: 24px;
}

.mg-bt-22 {
    margin-bottom: 22px;
}

.mg-bt-40 {
    margin-bottom: 40px;
}

.mg-bt-41 {
    margin-bottom: 41px;
}

.mg-bt-44 {
    margin-bottom: 44px;
}

.pad-r-50 {
    padding-right: 50px;
}

.pad-t-23 {
    padding-top: 23px;
}

.pad-t-24 {
    padding-top: 24px;
}

.pad-t-17 {
    padding-top: 17px;
}

.pad-t-20 {
    padding-top: 20px;
}

.pad-t-4 {
    padding-top: 4px;
}

.pad-b-60 {
    padding-bottom: 60px !important;
}

.pad-b-54 {
    padding-bottom: 54px !important;
}

.pad-b-74 {
    padding-bottom: 74px !important;
}

.mg-t-40 {
    margin-top: 40px;
}

.mg-t-36 {
    margin-top: 36px;
}

.mg-bt-18 {
    margin-bottom: 18px;
}

.pad-l-7 {
    padding-left: 7px;
}

.pad-0-15 {
    padding: 0 15px;
}

.mg-r-3 {
    margin-right: 3px;
}

.mg-r-1 {
    margin-right: 1px;
}

.color-47A432 {
    background-color: #47a432 !important;
}

.color-9835FB {
    background-color: #9835fb !important;
}

.color-DF4949 {
    background-color: #df4949 !important;
}

.no-box-shadown {
    -moz-box-shadow: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.pad-b-60 {
    padding-bottom: 60px !important;
}

.pad-b-20 {
    padding-bottom: 20px !important;
}

.pad-400 {
    padding: 0 400px;
}

.pad-420 {
    padding: 0 420px;
}

.mg-t-10 {
    margin-top: 10px;
}

.mg-l-8 {
    margin-left: 10px;
}

.mg-r-8 {
    margin-right: 10px;
}

.mg-t-11 {
    margin-top: 11px !important;
}

.mg-t-12 {
    margin-top: 12px !important;
}

.mg-t-6 {
    margin-top: 6px !important;
}

.pd-t-20 {
    padding-top: 20px;
}

.pd-15 {
    padding: 0 15px;
}

.bg-style {
    background-color: #7E94C5 !important;
}

.bg-style2 {
    background-color: #fff !important;
}

.is_dark .bg-style2 {
    background-color: #1f1f2c !important;
}

.bg-style3 {
    background-color: #f8f8f8;
}

.is_dark .bg-style3 {
    background-color: #1f1f2c !important;
}

.home-3 .bg-home-3 {
    background-color: var(--primary-color5) !important;
}

.home-1 .bg-home,
.home-2 .bg-home {
    background-color: var(--primary-color5) !important;
}

.mg-t-42 {
    margin-top: 42px;
}

.pb-10 {
    padding-bottom: 10px !important;
}

.pb-11 {
    padding-bottom: 11px !important;
}

.pb-12 {
    padding-bottom: 12px !important;
}

.pb-24 {
    padding-bottom: 24px !important;
}

.pb-16 {
    padding-bottom: 16px !important;
}

.pb-23 {
    padding-bottom: 23px !important;
}

.pb-39 {
    padding-bottom: 39px !important;
}

.pb-40 {
    padding-bottom: 40px !important;
}

.pd-40 {
    padding: 40px;
}

.pb-15 {
    padding-bottom: 15px !important;
}

.pb-17 {
    padding-bottom: 17px !important;
}

.pb-18 {
    padding-bottom: 18px !important;
}

.pb-20 {
    padding-bottom: 20px !important;
}

.pb-22 {
    padding-bottom: 22px !important;
}

.pb-24 {
    padding-bottom: 24px !important;
}

.mt-21 {
    margin-top: 21px;
}

.mt-29 {
    margin-top: 29px;
}

.mb-11 {
    margin-bottom: 11px;
}

.mb-35 {
    margin-bottom: 35px;
}

.mb-15 {
    margin-bottom: 15px;
}

.mt-6 {
    margin-top: 6px;
}

.mt-9 {
    margin-top: 9px;
}

.mt-21 {
    margin-top: 21px;
}

.pt-24 {
    padding-top: 24px;
}

.mb-25 {
    margin-bottom: 25px;
}

.mb-24 {
    margin-bottom: 24px;
}

.mg-bt-3 {
    margin-bottom: 3px;
}

.pl-17 {
    padding-left: 17px;
}

.pl-34 {
    padding-left: 34px;
}

.pl-51 {
    padding-left: 51px;
}

.pl-68 {
    padding-left: 68px;
}

.pl-20 {
    padding-left: 20px;
}

.mg-style2 {
    margin-left: -3px;
    margin-right: -3px;
}

#wrapper {
    position: relative;
    overflow: hidden;
    max-width: 100%;
    height: 100%;
}

.color-popup {
    color: var(--primary-color2);
}

/* link style
-------------------------------------------------------------- */

a {
    text-decoration: none;
    color: var(--primary-color2);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    letter-spacing: 0.1px;
}

a:hover,
a:focus {
    color: var(--primary-color3);
    text-decoration: none;
    outline: 0;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.hover-ecfect,
.exp {
    background: linear-gradient(to right, #9b92f1, #6154d6, #9b92f1);
    background-clip: text;
    -webkit-background-clip: text;
    font-weight: 700;
    background-size: 200% 200%;
    animation: rainbow 2s ease-in-out infinite;
    color: var(--primary-color2);
    transition: color 0.2s ease-in-out;
}

.hover-ecfect:hover,
.exp:hover {
    color: rgba(0, 0, 0, 0) !important;
}

@keyframes rainbow {
    0% {
        background-position: left;
    }

    50% {
        background-position: right;
    }

    100% {
        background-position: left;
    }
}

.link-style-1 a {
    text-decoration: none;
    color: var(--primary-color4);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.link-style-1 a:hover,
.link-style-1 a:focus {
    color: var(--primary-color3);
    text-decoration: none;
    outline: 0;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

/* Root
-------------------------------------------------------------- */

:root {
    /* color */
    --primary-color: #fff;
    --primary-color2: #1e3b8a08;
    --primary-color3: #1e3b8a08;
    --primary-color4: #1e3b8a08;
    --primary-color5: #f8f8f8;
    --primary-color6: #1e3b8a08;
    --primary-color7: #f8f8f8;
    --bg-section: #1e3b8a08;
    --bg-section2: #f8f8f8;
    --primary-color8: #21262c;
    --primary-color9: #21262c;
}

.is_dark {
    --primary-color: rgb(255, 255, 255)08;
    --primary-color2: #fff;
    --primary-color4: #1e3b8a0b;
    --primary-color5: #1e3b8a08;
    --primary-color6: #ffffff;
    --primary-color7: #1e3b8a08;
    --bg-section: #1e3b8a4b;
    --bg-section2: #1e3b8a4b;
    --primary-color8: #fff;
    --primary-color9: #1e3b8a08;
}

/* Header
-------------------------------------------------------------- */

.dark .logo_header {
    width: 135px !important;
    height: 56px !important;
}

header {
    padding-right: 0 !important;
}

.header_1 {
    position: absolute;
    z-index: 100;
    height: 80px;
    width: 100%;
    border-bottom: 1px solid rgba(235, 235, 235, 0.2);
}

.header_1.header_2.style2 {
    height: 104px;
    border: none;
    font-size: 1.5rem;
    font-weight: 500;
    display: flex;
    align-items: center;
}

.header-wallet-style {
    font-size: 12px;
    font-weight: 700;
   border: 1px solid #1e3b8a08;
    padding: 10px;
    border-radius: 6px;
}

.header-wallet-style:hover {
    color: white;
    cursor: pointer;
    text-shadow: 0 0 10px #ffffff;
    box-shadow: 0 0 10px white;
}

.admin_active {
    display: none;
}

.connect-wal .admin_active {
    display: block;
}

.main-nav {
    position: absolute;
    left: 26%;
    top: 0;
    z-index: 0;
}

.header_1-inner {
    position: relative;
    height: 80px;
}

.header_1 .header_avatar {
    border-radius: 2000px;
    border: solid 1px #e2eef1;
    background: #f9fbfc;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    z-index: 9;
}

.header_1 .header_avatar .avatar {
    height: 40px;
    width: 40px;
    border-radius: 2000px;
    -o-object-fit: cover;
    object-fit: cover;
}

.header_1 .header_avatar .price {
    padding: 0 100px 0 -50px;
    font-size: 14px;
    color: #14141f;
}

.header_1 .header_avatar .avatar_popup {
    position: absolute;
    right: 0;
    padding: 30px;
    top: 60px;
    overflow: hidden;
    border-radius: 6px;
    background: #ffffff;
    -webkit-transition: all 0.25s ease-in-out;
    transition: all 0.25s ease-in-out;
    -webkit-box-shadow: 0px 17px 13px 0px #192c4b05;
    box-shadow: 0px 17px 13px 0px #192c4b05;
    border: solid 1px #1e3b8a08;
    visibility: hidden;
    opacity: 0;
    -webkit-transform: translateY(-1rem);
    transform: translateY(-1rem);
    font-size: 16px;
}

.header_1 .header_avatar .avatar_popup.visible {
    visibility: visible;
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
}

.header_1 .header_avatar .avatar_popup .links {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.header_1 .header_avatar .avatar_popup .links a {
    color: #ffffff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.header_1 .header_avatar .avatar_popup .links a i {
    margin-right: 5px;
    font-size: 20px;
}

.header_1 .header_avatar .avatar_popup .links a:hover {
    color: var(--primary-color);
}

.header_1 .header__notifications .js-notifications-icon {
    cursor: pointer;
}

.header_1 .header_avatar .avatar_popup .links a i {
    margin-right: 10px;
    font-size: 16px;
}

.space-y-20> :not([hidden])~ :not([hidden]) {
    --cb-space-y-reverse: 0;
    margin-top: calc(20px * calc(1 - var(--cb-space-y-reverse)));
    margin-bottom: calc(20px * var(--cb-space-y-reverse));
}

.mt-20 {
    margin-top: 20px;
}

.mt-10 {
    margin-top: 10px;
}

.mt-15 {
    margin-top: -15px;
}

.mt-19 {
    margin-top: 19px !important;
}

.mb-40 {
    margin-bottom: 40px !important;
}

.ml-10 {
    margin-left: 10px;
}

.avatar_popup .copy-text a,
.avatar_popup .copy-text span {
    color: #14141f;
}

/* Site Logo
-------------------------------------------------------------- */

#site-logo {
    width: auto;
    height: 100px;
    padding: 20px;
    margin-bottom: -15px;
}

.flat-search-btn {
    display: flex;
    padding: 16px 0;
    position: absolute;
    right: 15px;
    top: 0px;
    bottom: 0px;
    justify-content: end;
    align-items: center;
}

#site-logo-inner {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.main-logo img {
    width: auto;
    height: 100px;
    padding-bottom: 10px;
    padding: 15px;
    margin-bottom: 10px;
}

.main-logo img,
.main-logo h2 {
    float: left;
}

.logo-dark {
    display: none;
}

.logo-light {
    display: block;
}

.is_dark .logo-dark {
    display: block;
}

.is_dark .logo-light {
    display: none;
}

/* Menu
-------------------------------------------------------------- */

/* Main Nav */

.main-nav ul {
    margin: 0px;
}

.main-nav ul.menu {
    display: flex;
}

.main-nav ul li {
    position: relative;
    list-style: none;
}

.main-nav>ul>li {
    padding: 26px 25px 26px 13px;
}

.main-nav>ul>li>a {
    position: relative;
    font-size: 18px;
    line-height: 26px;
    font-weight: 700;
    color: #fff;
    padding-right: 15.5px;
}



.main-nav>ul>li>a:hover::before {
    transform: scale(1.1);
    box-shadow: 0 0 15px #ffffff;
  }

.main-nav>ul>li>a:hover {
    color: #ffffff;
    text-shadow: 0 0 10px #ffffff;
}

.main-nav>.menu>li.menu-item-has-children>a::after {
    content: "\f107";
    font-family: "Font Awesome 5 Pro";
    font-weight: 300;
    position: absolute;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

/* Sub Menu */

.main-nav .sub-menu {
    position: absolute;
    top: 100%;
    left: 0;
    width: 250px;
    background-color: #7E94C5;
    border-radius: 6px;
    box-shadow: -2px 6px 23px #ffffff4f;
    z-index: 9999;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    -webkit-transform: translateY(15px);
    -moz-transform: translateY(15px);
    -ms-transform: translateY(15px);
    -o-transform: translateY(15px);
    transform: translateY(15px);
    border: 1px solid #1e3b8a08;
}

.main-nav .sub-menu::before {
    content: "";
   
}

.main-nav .right-sub-menu {
    left: auto;
    right: 0;
}

.main-nav .sub-menu li a {
    display: block;
    font-size: 18px;
    color: #ffffff;
    padding: 10px;
    font-weight: 700;
}

.main-nav .sub-menu li:not(:last-child) a {
    border-bottom: 1px solid #e1e1e18e;
}

.main-nav li:hover .sub-menu {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
}

.main-nav .sub-menu li.current-item a,
.main-nav .sub-menu li a:hover {
    color: white;
}

.main-nav>ul>li>a:hover {
    color: #fff;
}

.main-nav>ul>li .sub-menu li {
    position: relative;
}

.main-nav>ul>li .sub-menu li a {
    transition: all 0.15s linear;
    -webkit-transition: all 0.15s linear;
    -moz-transition: all 0.15s linear;
    -o-transition: all 0.15s linear;
}

.main-nav>ul>li .sub-menu li a:hover,
.main-nav>ul>li .sub-menu li.current-item a {
    padding-left: 10px;
    text-shadow: 0 0 10px #ffffff;
}

.main-nav>ul>li .sub-menu li a:hover::after,
.main-nav>ul>li .sub-menu li.current-item a:after {
    width: fit-content;

}

.main-nav>ul>li .sub-menu li a::after {
    content: "";
    position: absolute;
    width: 0;
    height: 2px;
    background: var(--primary-color3);
    left: 15px;
    top: 28px;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

@media only screen and (max-width: 1600px) {
    .main-nav {
        left: 18%;
    }

    .main-nav>ul>li {
        padding: 26px 12px 26px 12px;
    }
}

/* Mobile Menu */

@media only screen and (max-width: 991px) {
    .main-nav {
        margin: 0 auto;
        width: 20%;
        height: 100vh;
        position: absolute;
        top: 0;
        left: -6px;
        z-index: 999999;
        background-color: #fff;
        box-shadow: 0px 3px 16px rgb(47 83 109 / 12%);
        transform: translateX(-100%);
        transition: transform 0.5s ease;
    }

    .is_dark .main-nav {
        background: #1e3b8a08;
        opacity: 90%;
    }

    .main-nav ul.menu {
        flex-direction: column;
    }

    .main-nav>ul>li:first-child {
        border: none;
    }

    .main-nav>ul>li {
        padding: 0;
        border-top: 1px solid rgba(138, 138, 160, 0.3);
    }

    .main-nav ul>li>a {
        line-height: 48px;
        padding: 0 15px;
        font-size: 16px;
        font-weight: 500;
        display: inline-block;
    }

    .main-nav.active {
        transform: translateX(0);
    }

    .main-nav.active ul {
        flex-direction: column;
    }

    .main-nav.active ul li {
        margin: 0;
        text-align: left;
        cursor: pointer;
        padding: 0;
        border-top: 1px solid rgba(138, 138, 160, 0.3);
        background-color: #fff;
    }

    .is_dark .main-nav.active ul li {
        background-color: #14141f;
    }

    .main-nav.active ul>li>a {
        color: #14141f;
        display: inline-block;
        font-size: 16px;
        line-height: 48px;
        padding: 0 15px;
        font-weight: 500;
    }

    .is_dark .main-nav.active ul>li>a {
        color: #fff;
    }

    .main-nav.active ul li:first-child {
        border-top: 0px;
    }

    .main-nav.active ul li>ul>li:first-child {
        border-top: 1px solid rgba(138, 138, 160, 0.3);
    }

    .main-nav.active ul>li.current-menu-item>a {
        color: tr;
    }

    .is_dark .main-nav.active ul>li.current-menu-item>a {
        background: linear-gradient(216.56deg, #9b92f1 5.32%, #6154d6 94.32%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    .main-nav.active .current-item>a,
    .main-nav.active ul>li>a:hover {
        color: white;
    }

    .is_dark .main-nav.active .current-item>a,
    .is_dark .main-nav.active ul>li>a:hover {
        background: linear-gradient(216.56deg, #ffffff 5.32%, #ffffff 94.32%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    .main-nav.active .sub-menu .menu-item a {
        margin-left: 15px;
    }

    .main-nav.active .menu-item-has-children .arrow {
        cursor: pointer;
        display: inline-block;
        font-size: 20px;
        font-family: "FontAwesome";
        line-height: 48px;
        position: absolute;
        right: 15px;
        text-align: center;
        top: 0;
        width: 48px;
    }

    .main-nav.active .menu-item-has-children .arrow:before {
        font-family: "Font Awesome 5 Pro";
        content: "\f107";
        color: transparent;
    }

    .main-nav.active .menu-item-has-children.current-menu-item .arrow:before {
        color: var(--primary-color3);
    }

    .main-nav.active .menu-item-has-children.current-menu-item .arrow:before {
        background: linear-gradient(216.56deg, #9b92f1 5.32%, #6154d6 94.32%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    .main-nav.active .menu-item-has-children .arrow.active {
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        transform: rotate(180deg);
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease;
    }

    .main-nav.active .menu-item-has-children .arrow.active:before {
        content: "\f107";
    }

    .main-nav.active ul ul li {
        background-color: var(--primary-color);
        border-top: 1px solid rgba(138, 138, 160, 0.3);
    }

    .is_dark .main-nav.active ul ul li {
        background-color: #14141f;
    }

    .main-nav .sub-menu {
        width: 100%;
    }

    .is_dark .main-nav .sub-menu {
        background: #14141f;
    }

    .main-nav .sub-menu::before {
        display: none;
    }

    .main-nav.active .sub-menu {
        position: relative;
        display: none;
        opacity: 1;
        visibility: visible;
        box-shadow: none;
    }

    .main-nav.active .menu-item.active .sub-menu {
        display: block;
    }

    .main-nav.active .sub-menu::before {
        display: none;
    }

    .main-nav.active .sub-menu li:not(:last-child) a {
        border: none;
    }

    .header_1.header_2 #main-nav {
        left: 0;
    }
}

@media only screen and (max-width: 767px) {
    .main-nav {
        width: 65%;
    }
}

/* Search icon */

#site-header .header-search-icon {
    display: block;
    font-size: 14px;
    line-height: 100px;
}

.opacity_0 {
    opacity: 0;
}

/* Search Form */

.header-search {
    position: relative;
    margin-right: 36px;
    padding: 14px 0;
}

.header-search .show-search {
    font-size: 20px;
    color: #fff;
}

.top-search.active {
    visibility: visible;
    filter: alpha(opacity=100);
    opacity: 1;
}

.top-search {
    position: absolute;
    right: -16px;
    top: 130%;
    width: 250px;
    opacity: 0;
    visibility: hidden;
}

.disconnect-wallet {
    position: absolute;
    top: 100%;
    width: 250px;
    opacity: 0;
    visibility: hidden;
    right: 0px;
    display: flex;
    
}

.disconnect-wallet.active {
    visibility: visible;
    opacity: 1;
}

.disconnect-wallet>button {
    margin-left: auto;
}

.search-submit {
    position: absolute;
    top: 0;
    right: 0;
    font-size: 20px;
    background: none;
    color: #14141f;
    border-radius: 0;
    -webkit-transition: all ease 0.3s;
    -moz-transition: all ease 0.3s;
    transition: all ease 0.3s;
    border: none;
    border-radius: 30px;
    line-height: 20px;
    padding: 15px 15px;
    background: transparent;
}

.search-submit:hover {
    border: none;
    color: #fff;
}

.search-form {
    position: relative;
}

.search-form .search-field:focus,
.search-form .search-field {
    background: #f8f8f8;
    color: #14141f;
    width: 100%;
    padding-left: 20px;
    border: 1px solid #fff;
    border-radius: 30px;
    line-height: 23px;
    padding: 13px 50px 13px 15px;
}

.search-form .search-field::placeholder {
    color: #14141f;
    line-height: 23px;
    font-size: 16px;
}

.icon-fl-search-filled {
    color: #14141f;
}

/* Mobile Menu Button */

.mobile-button {
    display: none;
    position: absolute;
    width: 26px;
    height: 26px;
    float: right;
    top: 50%;
    right: 15px;
    background-color: transparent;
    cursor: pointer;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.mobile-button:before,
.mobile-button:after,
.mobile-button span {
    background-color: #ffffff;
    -webkit-transition: all ease 0.3s;
    -moz-transition: all ease 0.3s;
    transition: all ease 0.3s;
}

.mobile-button:before,
.mobile-button:after {
    content: "";
    position: absolute;
    top: 0;
    height: 3px;
    width: 100%;
    left: 0;
    top: 50%;
    -webkit-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
}

.mobile-button span {
    position: absolute;
    width: 100%;
    height: 3px;
    left: 0;
    top: 50%;
    overflow: hidden;
    text-indent: 200%;
}

.mobile-button:before {
    -webkit-transform: translate3d(0, -7px, 0);
    -moz-transform: translate3d(0, -7px, 0);
    transform: translate3d(0, -7px, 0);
}

.mobile-button:after {
    -webkit-transform: translate3d(0, 7px, 0);
    -moz-transform: translate3d(0, 7px, 0);
    transform: translate3d(0, 7px, 0);
}

.mobile-button.active span {
    opacity: 0;
}

.mobile-button.active:before {
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    -moz-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
}

.mobile-button.active:after {
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    -moz-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
}

.tf-button-submit:hover {
    opacity: 0.9;
    color: #fff;
}

.is_dark .tf-button-submit:hover {
    color: #fff;
}

/* Header Fixed */

.header_1.is-fixed {
    position: fixed;
    top: -161px;
    left: 0;
    width: 100%;
    box-shadow: 1px 1px 5px 0px rgb(0 0 0 / 30%);
    z-index: 9999;
    background: linear-gradient(227.3deg, #9b92f1 0%, #6154d6 100.84%);
    border: none;
    opacity: 1;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.is_dark .header_1.is-fixed {
    background: #21262c;
    box-shadow: 1px 1px 5px 0px rgb(0 0 0 / 50%);
}

.header_1.header_2.is-fixed .mode_switcher {
    display: inline-flex;
}

.header_1.is-fixed.is-small {
    top: 0;
}

#header_admin.is-fixed {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    box-shadow: 1px 1px 5px 0px rgb(0 0 0 / 30%);
    z-index: 9999;
    background-color: rgb(81 66 252 / 93%);
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.header_1.is-fixed .search-form .search-field:focus,
.header_1.is-fixed .search-form .search-field {
    background-color: #ffffff;
    box-shadow: 0px 2px 6px 0px rgb(47 47 47 / 30%);
}

.header_1.is-fixed .search-form .search-field:focus,
.header_1.is-fixed .search-form .search-field,
.header_1.is-fixed .search-form .search-field::placeholder,
.header_1.is-fixed .search-submit {
    color: #14141f;
}

/* Pagination
-------------------------------------------------------------- */

.themesflat-pagination {
    margin: 32px 30px;
}

.themesflat-pagination ul {
    margin: 0px;
    position: relative;
}

.themesflat-pagination ul li {
    display: inline-block;
    padding: 0px;
    margin-right: 7px;
}

.themesflat-pagination ul li .page-numbers {
    display: inline-block;
    font-size: 14px;
    font-family: "Rubik", sans-serif;
    font-weight: 400;
    color: #787878;
    text-align: center;
    width: 29px;
    height: 30px;
    border-radius: 3px;
    border: 1px solid var(--primary-color4);
    line-height: 30px;
}

.themesflat-pagination ul li .page-numbers:hover,
.themesflat-pagination ul li .page-numbers.current {
    background-color: var(--primary-color);
    color: #fff;
    border-color: var(--primary-color);
}

.themesflat-pagination ul li .next,
.themesflat-pagination ul li .prev {
    font-size: 14px;
    font-weight: 700;
    color: #878787;
}

.themesflat-pagination ul li .next:hover,
.themesflat-pagination ul li .prev:hover {
    color: var(--primary-color);
}

/* Footer
-------------------------------------------------------------- */

#footer {
    padding: 80px 0 80px;
    background: var(--bg-section);
}

#footer.style-2 {
    background-color: #ffffff;
}

.home-5 #footer,
.home-3 #footer {
    background: #fff !important;
}

.home-6 #footer {
    background: var(--bg-section) !important;
}

.is_dark .home-5 #footer,
.is_dark .home-3 #footer {
    background: #0d0d11 !important;
}

.is_dark #footer.style-2 {
    background-color: #14141f;
}

/* Scroll Top
-------------------------------------------------------------- */

#scroll-top {
    position: fixed;
    display: block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    z-index: 1;
    right: 14px;
    bottom: 23px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    cursor: pointer;
    background-color: #9b92f1;
}

.is_dark #scroll-top {
    background: #fff;
}

#scroll-top:after {
    content: "\f077";
    font-family: "Font Awesome 5 Pro";
    font-size: 18px;
    color: #ffffff;
    font-weight: 600;
}

.is_dark #scroll-top:after {
    color: #9b92f1;
}

#scroll-top:hover {
    transform: translateY(-7%);
}

/* Widget
-------------------------------------------------------------- */

.widget p,
.widget .title-widget {
    color: var(--primary-color2);
}

.fl-dark .widget p,
.fl-dark .widget .title-widget {
    color: var(--primary-color);
}

#footer .widget p {
    font-size: 14px;
    line-height: 22px;
}

.side-bar .widget p {
    font-size: 15px;
}

#footer .title-widget {
    line-height: 26px;
}

#side-bar .title-widget {
    line-height: 30px;
    margin-bottom: 20px;
}

#side-bar .title-widget.style-2 {
    line-height: 26px;
    margin-bottom: 14px;
}

#side-bar .widget {
    margin-bottom: 40px;
}

#side-bar .widget.mgbt-24 {
    margin-bottom: 24px;
}

.sc-widget.style-1 {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    justify-content: space-between;
}

#side-bar.style-2 {
    padding-left: 50px;
}

#side-bar .widget.mgbt-0 {
    margin-bottom: 0;
}

#side-bar.style-3 {
    padding-right: 55px;
}

.sub-title.small {
    font-size: 14px;
    line-height: 22px;
}

.sub-title.style-2 {
    margin-bottom: 40px;
}

/*widget-logo*/

.widget-logo .logo-footer a {
    color: var(--primary-color3);
}

.widget-logo .logo-footer a {
    font-size: 36px;
    font-weight: bold;
}

.widget-logo .logo-footer {
    margin-bottom: 13px;
}

.widget-logo .sub-widget-logo {
    padding-right: 35px;
    margin-bottom: 26px;
}

/* widget-social */

.widget-social ul {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.widget-social.style-1 a {
    background-color: #ebebeb;
    color: #7a798a;
}

.is_dark .widget-social.style-1 a {
    background-color: #21262c;
    color: #ffffff;
}

.widget-social.style-1 a:hover {
    color: var(--primary-color);
    background-color: var(--primary-color3);
}

.is_dark .widget-social.style-1 a:hover {
    color: #ffffff;
    background-color: var(--primary-color3);
}

.widget-social.style-1 ul li {
    margin-right: 12px;
}

.widget-social.style-1 ul li:last-child {
    margin-right: 0;
}

.widget-social.style-1 ul li a {
    width: 40px;
    height: 40px;
    border-radius: 5px;
    text-align: center;
    justify-content: center;
    align-items: center;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    font-size: 21px;
}

.widget-social.style-1 ul li.style-2 a {
    font-size: 22px;
}

.widget-social.style-2 {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.widget-social.style-2 .title-widget {
    line-height: 26px;
    margin-right: 17px;
}

.widget-social.style-2 ul {
    margin-right: 3px;
}

.widget-social.style-2 ul li {
    margin-left: 12px;
}

.widget-social.style-2 ul li:first-child {
    margin-left: 0px;
}

.widget-social.style-2 ul li a {
    font-size: 16px;
    line-height: 26px;
    color: #7a798a;
}

.widget-social.style-2 ul li a:hover {
    color: var(--primary-color3);
}

.is_dark .widget-social.style-2 ul li a:hover {
    color: #fff;
}

.widget-social.style-3 ul li a {
    background-color: #fff;
    color: #14141f;
}

.widget-social.style-3 ul li a:hover {
    color: #fff;
    background-color: #000000;
}

.widget-social.style-3 ul li {
    margin-right: 12px;
}

.widget-social.style-3 ul li:last-child {
    margin-right: 0;
}

.widget-social.style-3 ul li a {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    text-align: center;
    justify-content: center;
    align-items: center;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    font-size: 25px;
}

.widget-social.style-3 ul li.style-2 a {
    font-size: 22px;
}

/* widget-menu */

.widget-menu {
    padding-top: 18px;
}

.widget-menu.style-1 {
    padding-left: 30px;
}

.widget-menu.style-2 {
    padding-left: 38px;
}

.widget-menu.fl-st-3 {
    padding-left: 33px;
}

.widget-menu .title-widget {
    margin-bottom: 24px;
}

.widget-menu ul li {
    margin-bottom: 14px;
}

.widget-menu ul li:last-child {
    margin-bottom: 0px;
}

.widget-menu ul li a {
    font-size: 14px;
    line-height: 22px;
    position: relative;
}

.widget-menu ul li a::after {
    content: "";
    width: 0;
    height: 1px;
    position: absolute;
    background: var(--primary-color3);
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.widget-menu ul li a:hover::after {
    width: 100%;
    visibility: visible;
    opacity: 1;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

/* widget-subcribe */

.widget-subcribe {
    padding-top: 17px;
    padding-left: 20px;
}

.widget-subcribe .title-widget {
    margin-bottom: 25px;
}

.widget-subcribe .sub-widget-subcribe {
    padding-right: 5px;
    margin-bottom: 23px;
}

.widget-subcribe .form-subcribe form {
    position: relative;
}

.widget-subcribe .form-subcribe input {
    border-radius: 10px;
    background: #f8f8f8;
    width: 100%;
    padding: 13px 50px 12px 22px;
    font-size: 14px;
    border: 1px solid rgba(138, 138, 160, 0.3);
}

.is_dark .widget-subcribe .form-subcribe input {
    background: transparent;
}

.widget-subcribe .form-subcribe input:focus {
    border: 1px solid #9b92f1;
}

.widget-subcribe .form-subcribe input {
    border: 1px solid rgba(138, 138, 160, 0.3);
}

.widget-subcribe .form-subcribe input::placeholder {
    font-size: 14px;
    white-space: nowrap;
    max-width: 70%;
    overflow: hidden;
}

.widget-subcribe .form-subcribe button {
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    position: absolute;
    top: 0;
    right: 0;
    background-color: var(--primary-color3);
    font-size: 21px;
    padding: 15px 18px 14px 19px;
    color: var(--primary-color);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.widget-subcribe .form-subcribe button .icon-fl-send {
    color: #ffffff;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.widget-subcribe .form-subcribe button:hover .icon-fl-send {
    color: #fff;
}

.widget-subcribe .form-subcribe button:hover {
    opacity: 0.9;
}

/* widget-recent-post */

.box-recent-post,
.widget-recent-post ul li.box-recent-post {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    width: 100%;
    align-items: center;
    padding: 8px 12px 8px 8px;
    border-radius: 6px;
    cursor: default;
    box-shadow: 0px 2px 6px 0px rgb(47 47 47 / 10%);
}

.is_dark .widget-recent-post ul li.box-recent-post {
    background: #21262c;
}

.widget-recent-post ul li.box-recent-post {
    margin-bottom: 16px;
}

.widget-recent-post ul li:last-child {
    margin-bottom: 0px;
}

.box-recent-post .box-feature img {
    width: 47px;
    height: 44px;
    border-radius: 6px;
    object-fit: cover;
}

.box-recent-post .box-content {
    padding-left: 10px;
    width: 86%;
}

.box-recent-post .box-content span {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    justify-content: space-between;
}

.box-recent-post .box-content .title-recent-post {
    font-size: 14px;
    font-weight: bold;
    line-height: 22px;
}

.box-recent-post .box-content .sub-recent-post {
    font-size: 13px;
    line-height: 18px;
    margin-top: 4px;
    color: var(--primary-color4);
}

.box-recent-post .box-content .day-recent-post {
    font-size: 13px;
    line-height: 18px;
    margin-top: 4px;
    color: var(--primary-color9);
}

.box-recent-post .box-content .day-recent-post:hover {
    color: var(--primary-color3);
}

/* widget-tag */

.widget-tag.style-1 {
    margin-right: -5px;
}

.widget-tag ul {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
}

.widget-tag.style-1 ul li {
    margin-right: 12px;
    margin-bottom: 13px;
}

.widget-tag a.box-widget-tag {
    line-height: 38px;
    padding: 0 28px;
    font-size: 15px;
    font-weight: 600;
    border-radius: 40px;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    justify-content: center;
    align-items: center;
}

.widget-tag a.box-widget-tag {
    box-shadow: 0px 2px 6px 0px rgb(47 83 109 / 10%);
    background-color: var(--primary-color);
}

.widget-tag a.box-widget-tag:hover {
    background-color: var(--primary-color3);
    color: #fff;
}

.fl-dark .widget-tag a.box-widget-tag {
    background-color: #21262c;
}

.fl-dark .widget-tag a.box-widget-tag:hover {
    background-color: var(--primary-color3);
    color: var(--primary-color);
}

.fl-dark .widget-tag a.box-widget-tag {
    background-color: #21262c;
}

.fl-dark .widget-tag a.box-widget-tag:hover {
    background-color: var(--primary-color3);
    color: var(--primary-color);
}

.widget-tag.style-2 {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.widget-tag.style-2 .title-widget {
    line-height: 26px;
    margin-right: 15px;
}

.widget-tag.style-2 ul li {
    margin-right: 6px;
}

.widget-tag.style-2 ul li::after {
    content: ",";
}

.widget-tag.style-2 ul li:last-child::after {
    content: "";
}

.widget-tag.style-2 ul li a {
    font-size: 18px;
    line-height: 28px;
}

.widget-tag.style-2 ul li a {
    color: #7a798a;
}

.widget-tag.style-2 ul li a:hover {
    color: var(--primary-color3);
}

.is_dark .widget-tag.style-2 ul li a:hover {
    color: #fff;
}

/* widget-search */

.widget-search form {
    position: relative;
}

.widget-search input {
    border-radius: 10px;
    background: transparent;
    width: 100%;
    padding: 10px 70px 8px 19px;
    font-size: 13px;
    border: 1px solid rgba(138, 138, 160, 0.3);
}

.widget-search input.style-2 {
    padding: 14px 70px 12px 19px;
    font-size: 14px;
}

.widget-search input.style-2::placeholder {
    letter-spacing: 0px;
}

.widget-search input:focus {
    border: 1px solid rgba(52, 52, 68, 1);
    background: 343444;
}

.widget-search input::placeholder {
    font-size: 14px;
    letter-spacing: -0.5px;
}

.widget-search button {
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    position: absolute;
    top: 0;
    right: 0;
    background-color: var(--primary-color3);
    font-size: 17px;
    padding: 12.5px 22px;
    border: none;
    color: #fff;
}

.widget-search button.style-2 {
    padding: 16.5px 22px;
}

.widget-search button i {
    color: #fff;
}

/* widget-filter */

.widget-filter ul {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 8px;
}

.widget-filter.style-2 ul li {
    margin-right: 12px;
    margin-bottom: 13px;
}

.widget-filter a.box-widget-filter i {
    margin-right: 8px;
    color: var(--primary-color3);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.is_dark .widget-filter a.box-widget-filter i {
    color: #fff;
}

.widget-filter a.box-widget-filter.active i,
.widget-filter a.box-widget-filter:hover i {
    color: #ffffff;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.widget-filter a.box-widget-filter {
    line-height: 38px;
    padding: 0 20px;
    font-size: 15px;
    font-weight: 600;
    border-radius: 40px;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--primary-color2);
}

.widget-filter a.box-widget-filter {
    box-shadow: 0px 2px 6px 0px rgb(47 83 109 / 10%);
    background-color: var(--primary-color);
}

.widget-filter a.box-widget-filter.active,
.widget-filter a.box-widget-filter:hover {
    background-color: var(--primary-color3);
    color: #ffffff;
}

.widget-filter .btn-filter {
    color: var(--primary-color3);
    font-size: 16px;
    line-height: 26px;
    font-weight: 700;
    position: relative;
    cursor: pointer;
}

.widget-filter .btn-filter.style-2 {
    padding-top: 5px;
}

.widget-filter .btn-filter:hover {
    color: var(--primary-color2);
}

.widget-filter.style-1 .header-widget-filter {
    justify-content: space-between;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.widget-filter.style-1 form label {
    line-height: 26px;
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 20px;
    position: relative;
    cursor: pointer;
    padding-left: 40px;
}

.widget-filter.style-1 form label.mgbt-none {
    margin-bottom: 0;
}

.widget-filter.style-1 input {
    position: absolute;
    opacity: 0;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
    margin-right: 0px;
}

.widget-filter .btn-checkbox {
    position: absolute;
    top: 0;
    left: 0;
    width: 28px;
    height: 28px;
    background-color: transparent;
    border-radius: 8px;
}

.widget-filter .btn-checkbox {
    border: 1px solid #7a798a;
}

.fl-dark .widget-filter .btn-checkbox {
    border: 1px solid #21262c;
}

.widget-filter.style-1 form label input:checked~.btn-checkbox {
    background-color: var(--primary-color3);
    border: 1px solid var(--primary-color3);
}

.widget-filter .btn-checkbox:after {
    content: "";
    position: absolute;
    display: none;
}

.widget-filter.style-1 form label input:checked~.btn-checkbox:after {
    display: block;
}

.widget-filter .btn-checkbox:after {
    content: "\e921";
    font-family: "nfts";
    left: 6px;
    top: 2px;
    color: #fff;
}

/* widget-category */

.widget-category.boder-bt {
    border-bottom: 1px solid #ebebeb;
}

.is-dark .widget-category.boder-bt {
    border-bottom: 1px solid #21262c;
}

.widget-category .title-wg-category {
    justify-content: space-between;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    cursor: pointer;
}

.widget-category .title-wg-category i {
    font-size: 7px;
    padding-top: 9px;
    font-weight: 600;
}

.widget-category .title-widget {
    line-height: 26px;
}

.widget-category form {
    margin-bottom: 23px;
}

.widget-category form label {
    line-height: 16px;
    font-size: 14px;
    margin-bottom: 12px;
    position: relative;
    cursor: pointer;
    padding-left: 24px;
    letter-spacing: -0.5px;
}

.widget-category form label.mgbt-none {
    margin-bottom: 0;
}

.widget-category input {
    position: absolute;
    opacity: 0;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
    margin-right: 0px;
}

.widget-category .btn-checkbox {
    position: absolute;
    top: 0;
    left: 0;
    width: 16px;
    height: 16px;
    background-color: transparent;
    border-radius: 4px;
}

.widget-category .btn-checkbox {
    border: 1px solid #7a798a;
}

.widget-category form label input:checked~.btn-checkbox {
    background-color: var(--primary-color3);
    border: 1px solid var(--primary-color3);
}

.widget-category .btn-checkbox:after {
    content: "";
    position: absolute;
    display: none;
}

.widget-category form label input:checked~.btn-checkbox:after {
    display: block;
}

.widget-category .btn-checkbox:after {
    content: "\e921";
    font-family: "nfts";
    font-size: 10px;
    left: 2px;
    top: 0px;
    color: #fff;
}

/* --------------widget-filter-----------*/

.widget-filter a i {
    margin-right: 8px;
}

.widget-filter a.box-widget-filter {
    line-height: 38px;
    padding: 0 20px;
    font-size: 15px;
    font-weight: 600;
    border-radius: 40px;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    justify-content: center;
    align-items: center;
}

.widget-filter a.box-widget-filter {
    box-shadow: 0px 2px 6px 0px rgb(47 83 109 / 10%);
    background-color: var(--primary-color);
}

.fl-dark .widget-filter a.box-widget-filter {
    background-color: #21262c;
}

.fl-dark .widget-filter a.box-widget-filter:hover {
    background: var(--primary-color3);
    color: var(--primary-color);
}

.widget-filter .btn-filter {
    color: var(--primary-color3);
    font-size: 16px;
    line-height: 26px;
    font-weight: 700;
    position: relative;
    cursor: pointer;
}

.widget-filter .btn-filter.style-2 {
    padding-top: 5px;
}

.widget-filter .btn-filter:hover {
    color: var(--primary-color2);
}

.fl-dark .widget-filter .btn-filter:hover {
    color: var(--primary-color);
}

.widget-filter.style-1 .header-widget-filter {
    justify-content: space-between;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.widget-filter.style-1 form label {
    line-height: 26px;
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 20px;
    position: relative;
    cursor: pointer;
    padding-left: 40px;
}

.widget-filter.style-1 form label.mgbt-none {
    margin-bottom: 0;
}

.widget-filter.style-1 input {
    position: absolute;
    opacity: 0;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
    margin-right: 0px;
}

.widget-filter .btn-checkbox {
    position: absolute;
    top: 0;
    left: 0;
    width: 28px;
    height: 28px;
    background-color: transparent;
    border-radius: 8px;
}

.widget-filter .btn-checkbox {
    border: 1px solid #7a798a;
}

.widget-filter.style-1 form label input:checked~.btn-checkbox {
    background-color: var(--primary-color3);
    border: 1px solid var(--primary-color3);
}

.widget-filter .btn-checkbox:after {
    content: "";
    position: absolute;
    display: none;
}

.widget-filter.style-1 form label input:checked~.btn-checkbox:after {
    display: block;
}

.widget-filter .btn-checkbox:after {
    content: "\e921";
    font-family: "nfts";
    left: 6px;
    top: 2px;
    color: #fff;
}

/* widget-category */

.widget-category.boder-bt {
    border-bottom: 1px solid #ebebeb;
}

.is_dark .widget-category.boder-bt {
    border-color: #21262c;
}

.widget-category .title-wg-category {
    justify-content: space-between;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    cursor: pointer;
}

.widget-category .title-wg-category i {
    font-size: 7px;
    padding-top: 9px;
    font-weight: 600;
}

.widget-category .title-widget {
    line-height: 26px;
}

.widget-category form {
    margin-bottom: 23px;
}

.widget-category form label {
    line-height: 16px;
    font-size: 14px;
    margin-bottom: 12px;
    position: relative;
    cursor: pointer;
    padding-left: 24px;
    letter-spacing: -0.7px;
}

.widget-category form label.mgbt-none {
    margin-bottom: 0;
}

.widget-category input {
    position: absolute;
    opacity: 0;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
    margin-right: 0px;
}

.widget-category .btn-checkbox {
    position: absolute;
    top: 0;
    left: 0;
    width: 16px;
    height: 16px;
    background-color: transparent;
    border-radius: 4px;
}

.widget-category .btn-checkbox {
    border: 1px solid #7a798a;
}

.widget-category form label input:checked~.btn-checkbox {
    background-color: var(--primary-color3);
    border: 1px solid var(--primary-color3);
}

.widget-category .btn-checkbox:after {
    content: "";
    position: absolute;
    display: none;
}

.widget-category form label input:checked~.btn-checkbox:after {
    display: block;
}

.widget-category .btn-checkbox:after {
    content: "\e921";
    font-family: "nfts";
    font-size: 10px;
    left: 2px;
    top: 0px;
    color: #fff;
}

.fill-height-or-more {
    display: flex;
    flex-direction: column;
    justify-content: stretch;
    flex: 1 0 auto;
}

.fill-height-or-more>div {
    flex-grow: 1;
}

.c-img-area-1 {
    max-height: 100px;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
}

.c-img-area-2 {
    max-height: 285px;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
}

.test:after {
    content: "\2807";
    font-size: 22px;
    display: inline;
}

.dropdown-toggle::after {
    display: none !important;
}

.btn-primary {
    color: #000000;
    background-color: #ffffff;
    border-color: #1e3b8a08;
}

.btn-primaryt {
    color: #000000;
}

.special-modal .modal-content {
    background-color: var(--bg-section);
    color: white;
}

.modal-backdrop {
    background-color: white;
}

input,
.button1 {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    border: 0;
    outline: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    padding: 3px 9px;
}

code {
    text-decoration: underline;
}

.taginput {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    border: 2px solid #2d3436;
    border-radius: 4px;
}

.tag {
    text-align: center;
    display: flex;
    align-items: center;
    margin: 0.25em;
    background: #2d3436;
    line-height: 2;
    border-radius: 10%;
    padding-left: 15px;
}

.tag button {
    cursor: pointer;
    font-weight: bold;
}

.input {
    flex: 1;
    display: flex;
    align-items: center;
    margin: 0.25em;
}

.input input {
    flex: 1;
    line-height: 2;
}

.dropdown1 {
    width: 300px;
    border-radius: 10px;
    background-color: rgb(202, 198, 198);
}

.dropdown-header {
    padding: 15px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 2rem;
}

.dropdown-body {
    padding: 5px;
    border-top: 1px solid #000000;
    display: none;
    font-size: 2rem;
}

.dropdown-body.open {
    display: block;
}

.dropdown-item {
    padding: 0px;
}

.dropdown-item:hover {
    cursor: pointer;
}

.dropdown-item-dot {
    opacity: 0;
    color: #91a5be;
    transition: all 0.2s ease-in-out;
}

.dropdown-item-dot.selected {
    opacity: 1;
}

.icon {
    font-size: 13px;
    color: white;
    transform: rotate(0deg);
    transition: all 0.2s ease-in-out;
}

.icon.open {
    transform: rotate(90deg);
}

.tag {
    text-align: center;
    display: flex;
    align-items: center;
    margin: 0.25em;
    background: #2d3436;
    line-height: 2;
    border-radius: 5%;
    padding-left: 15px;
}

.media-images-collection {
    width: 100%;
    display: flex;
    align-items: center;
}

.media-images-collection img {
    border-bottom: 2px solid #1e3b8a08;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

@media (max-width: 768px) {
    .media-images-collection img{
        width: 100%;
        height: 100%;
    }

}

.collection-avatar {
    position: fixed;
    bottom: 30px;
    left: 10px;
    border: transparent !important;
}

.author .sc-author-box .author-avatar .collection-badge {
    position: fixed;
    bottom: 55px;
    left: 95px;
    color: transparent;
}



.sc-card-collection .card-bottom .author .collection-title h4 {
    color: #fff !important;
    font-size: 14px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.3s; /* Add a smooth transition effect */
    margin-top: 10px;
}

.collection-title:hover h4 {
    text-shadow: 0 0 15px #ffffff;
    color: white !important;
    opacity: 1; /* Set opacity to 1 to make it fully visible */
}


.page-title-description {
    width: 100%;
    display: flex;
    justify-content: center;
    color: #fff;
    font-size: 18px;
    line-height: 28px;
    
}

.page-title-description span {
    max-width: 600px;
    text-align: center;
}

.collection-overlay {
    height: 100%;
    width: 100%;
    position: relative;
}

.collection-overlay img {
    height: 250px;
    width: 100%;
    object-fit: cover;
   border: 1px solid #1e3b8a08;
}

.collection-title-page.inner {
    background: var(--bg-section) !important;
    padding-top: 80px;
}

.collection-logo>img {
    position: absolute;
    bottom: -60px;
    left: 60px;
    width: 120px;
    height: 120px;
    border-radius: 6px;
   border: 1px solid #1e3b8a08;
}

.collection-header {
    font-size: 20px;
    display: flex;
        
}

.collection-header span {
    margin: 10px;
    
}

.sc-card-product {
    display: flex;
    justify-content: space-between;
}

.sc-card-product .card- img {
    width: 300px !important;      
    height: 300px !important;     
    object-fit: cover !important; 
    object-position: center;  /* Center the image horizontally */
    
}


.sc-card-detail {
    width: 100%;
    display: table-row;
}
    

.sc-card-detail>div {
    display: table-cell;
    flex: 0 0 auto;
    width: auto;
    padding: 5px 50px 5px 0;
    position: relative;
    font-size: 16px;
    line-height: 22px;
    font-weight: 500;
}

.content-row-item:after {
    content: ":";
    right: 10px;
    top: 0;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    
}

.sc-card-detail .content-row-detail {
    color: #f0bc88;
    

}

.content-description {
    color: #f0bc88;
    font-weight: 500;
    font-style: italic;
    font-size: 16px;
    line-height: 22px;
}

.body.light .sc-card-detail .content-row-detail {
    color: rgb(30 58 138);
}

.body.light .content-description {
    color: rgb(30 58 138);
}

.Toastify {
    position: fixed;
    z-index: 9999999999;
    font-size: 12px;
}

.w-auto {
    width: auto !important;
}

.popup-font {
    font-weight: 700;
    font-size: 15px;
}

.btn-none {
    background-color: transparent;
    border-radius: 0;
    color: #ccc;
}

.btn-none:hover,
.btn-none:active {
    border: 0;
    color: #fff;
    font-weight: 600;
}

.select-box select {
    width: 100%;
    font-size: 14px;
    border: 1px solid rgba(138, 138, 160, 0.3);
    border-radius: 6px;
    padding: 16px 20px;
    color: #fff;
    background: transparent;
    -moz-appearance: none;
    -webkit-appearance: none;
}

.sc-highest-bidder {
    font-size: 14px;
    font-weight: 600;
    text-align: center;
    margin-bottom: 2rem;
    color: #f0bc88;
}

.pr-8 {
    padding-right: 4rem !important;
}

.custom-image {
    width: "100%";
    height: "100%";
    overflow: "hidden";
    display: "flex";
    flex-direction: "row";
    justify-content: "center";
    align-items: "center";
    border-radius: 6px;
    
    
}

.custom-image img {
    width: " 100%";
    height: "100%";
    object-fit: "cover";
    
}

@keyframes spinner {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.loading-spinner {
    margin-top: 50px;
}

.loading-spinner svg polyline {
    fill: none;
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .loading-spinner svg polyline#back {
    fill: none;
    stroke: #444444e1;
  }

  .loading-spinner svg polyline#front {
    fill: none;
    stroke: #ffffff;
    stroke-dasharray: 48, 144;
    stroke-dashoffset: 192;
    animation: dash_682 1.4s linear infinite;
  }

  @keyframes dash_682 {
    72.5% {
      opacity: 0;
    }
  
    to {
      stroke-dashoffset: 0;
    }
  }

  .author-profile {
    background-color: #21262c !important;
  }
  

.tab-authors .author-profile .avatar {
    width: 200px;
    height: 200px;
    object-fit: cover;
    
    
}

@media (min-width: 768px) {
    .tab-authors .author-profile .avatar {
        width: 150px;
        height: 150px;
        object-fit: cover;
    }
}

@media (min-width: 1024px) {
    .tab-authors .author-profile .avatar {
        width: 200px;
        height: 200px;
        object-fit: cover;
    }
}

@media (min-width: 1430px) {
    .tab-authors .author-profile .avatar {
        width: 250px;
        height: 250px;
        object-fit: cover;
    }
}

.b-radius {
    border-radius: 6px;
}

.collection-detail-page .themesflat-container {
    padding-top: 20px;
    
}

@media (max-width: 768px) {
    .collection-detail-page .themesflat-container {
        padding-top: 80px;
    }
}

.collection-heading {
    color: white;
}

.dropdown:hover ul {
    z-index: 999;
}

.dropdown:hover ul {
    display: block !important;
}

.dropdown ul {
    display: none !important;
}

.dotafter {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.dotafter:after {
    font-size: 13px;
    content: "................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................";
}

.category-list {
    height: auto;
    max-height: 60vh;
    overflow: hidden scroll;
}

.category-list::-webkit-scrollbar {
    width: 3px;
    background-color: var(--primary-color5);
}

.category-list::-webkit-scrollbar-thumb {
    background-color: #fff;
    height: 1px;
    border-radius: 100px;
}

.hover-scale {
    cursor: pointer;
    transition: all 0.2s;
    fill: #9b92f1;
}

.hover-scale:hover {
    fill: #6154d6;
    transform: scale(1.02);
}

/* new style bvm */

.turtle {
    background-color: #1e3b8a4b !important;
}

.turtle-2 {
    background-color: #1e3b8a4b !important;
}

.turtle-3 {
    background-color: #1e3b8a8b;
}

.author-profile {
  display: flex;
}

.feature-profile {
  width: 15%;
}

.info {
  flex: 1;
  padding-left: 20px;
}

.widget-social {
  text-align: right;
  flex-shrink: 0; /* Prevent social media icons from shrinking */
}

.widget-social ul {
  list-style: none;
  padding: 0;
}

.widget-social ul li {
  display: block;
  margin-bottom: 10px;
}

/* Media query for smaller screens */
@media (max-width: 768px) {
  .author-profile {
    flex-direction: column; /* Stack items vertically on smaller screens */
  }
  
  .feature-profile {
    width: 100%; /* Full width for the image on smaller screens */
    margin-bottom: 20px; /* Add spacing between image and text */
  }

  .info {
    padding-left: 0; /* Remove left padding for text on smaller screens */
  }

  .widget-social {
    text-align: left; /* Align social media icons to the left on smaller screens */
  }
}
  
  .widget-social ul {
    list-style: none;
    padding: 0;
  }
  
  .widget-social ul li {
    display: inline-block; /* Display social media icons horizontally */
    margin-left: 10px; /* Add spacing between social media icons */
  }
  
  .themesflat-containert {
        position: relative;
        margin-left: auto;
        margin-right: auto;
        padding-right: 15px;
        padding-left: 15px;
        width: 1440px;
        max-width: 100%;
        display: flex;
    justify-content: flex-end;
  }

  /* new style bvm */

  /* profile page */

  .container {
    width: 100%;
    
   
    
}

.profile {
    display: flex;
    align-items: center;
    border: 1px solid #1e3b8a08;
    border-radius: 6px;
    background-color: #1e3b8a4b;
    padding: 10px;
    margin-top: 50px;
    max-width: 100%;
}

.feature {
    margin-right: 20px;
    flex: 0 0 15%; /* Adjust the width of the profile picture */
}

.profile-image {
    border: 1px solid #1e3b8a08;
    border-radius: 6px;
    width: 100%; /* Make sure the image fills its container */
    height: auto; /* Allow the height to adjust proportionally */
}

.info {
    flex-grow: 1;
}

.profile-username {
    font-size: 14px;
    margin-top: 1vh;
    margin-bottom: 1vh;
}

.profile-content {
    font-size: 10px;
    margin-top: 0.5vh;
    margin-bottom: 1vh;
}

.profile-address {
    display: flex;
    align-items: center;
}

.address-container {
    display: flex;
    align-items: center;
}

.profile-input-copy {
    flex: 1;
    border: none;
    padding: 2px !important;
    font-size: 10px !important;
    border-radius: 4px 0 0 4px;
}

.profile-btn-copy {
    background-color: transparent;
    border: none;
    padding: 2px;
    padding-left: 3%;
    border-radius: 0 4px 4px 0;
    cursor: pointer;
}

.profile-btn-copy i {
    color: #ffffff;
}


.social-widget {
    flex-grow: 1;
    margin-top: 20px;
}

.social-widget ul {
    display: flex;
    justify-content: flex-end;
}

.social-widget a {
    margin-left: 10px;
}


/* profile page List Grid */

.IDNFTlist {
    align-items: center;
    display: flex;
    justify-content: center;
    margin-top: 5px;
}

.Colelctionheader {
    color: #fff;
    font-size: 15px;
    margin-top: 10px;
    margin-bottom: 20px;
}

.list-item-style {
    display: flex;
    flex-direction: column;
    margin-bottom: 20px; /* Adjust as needed */
    background-color: #1e3b8a4b;
    margin-left: 10px;
    margin-right: 5px;
    border-radius: 5px;
  }
  
  .list-item-content {
    display: flex;
    align-items: flex-start;
  }
  
  .list-item-thumbnail {
    margin: 5px; /* Adjust as needed */
  }
  
  .list-item-thumbnail img {
    width: 100px; /* Adjust as needed */
    height: auto;
    border-radius: 5px;
  }
  
  .list-item-details {
    flex: 1;
    margin-left: 5px;
  }
  
  .list-item-meta {
    margin-top: 5px; /* Adjust as needed */
  }
  
  .list-item-actions {
    display: flex;
    justify-content: right;
    margin: 10px; /* Adjust as needed */
    
  }
  
  .list-item-actions > * {
    margin-right: 10px; /* Adjust as needed */
  }
  

  #profile_collected_container .col-xl-4,
#profile_collected_container .col-lg-4,
#profile_collected_container .col-md-6,
#profile_collected_container .col-12 {
  padding: 0 5px; /* Adjust as needed */
}

.carouselhero {
    width: 40vw;
    margin: 25px;
    padding-top: 50px;
    display: block;
    cursor: pointer;
}

@media (max-width: 990px) {
    .carouselhero {
        display: none;
    }
}

.carousel-image {
    display: block;
    width: 100%;
    height: auto;
    cursor: pointer;
}

.launch-collection-container {
  background-color: #A6B9DD; /* Dark background */
  color: #fff; /* White text */
  padding: 40px; /* Increase padding for better spacing */
  border-radius: 20px; /* More rounded corners */
  text-align: center;
  max-width: 100%; /* Max width for the container */
  margin: 40px auto; /* Center the container */
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); /* Add shadow for better separation */
}

.collection-cards {
  display: flex;
  justify-content: space-around;
  margin: 40px 0; /* Increase margin for better spacing */
}

.card {
  background-color: #A6B9DD; /* Darker card background */
  padding: 20px; /* Increase padding for better spacing */
  border-radius: 10px; /* Rounded corners */
  width: 30%; /* Fixed width for cards */
  text-align: center;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Add shadow to cards */
  transition: transform 0.3s ease; /* Smooth hover effect */
}

.card:hover {
  transform: scale(1.05); /* Slightly enlarge card on hover */
}

.card img {
  width: 100%;
  border-radius: 10px;
  margin-bottom: 10px; /* Space between image and text */
}

.card-info {
    background-color: transparent;
}

.card-info h3 {
  margin: 10px 0 5px;
  font-size: 1.2em; /* Larger font size */
}

.card-info p {
  margin: 5px 0; /* Consistent margin for text */
  color: #ffffff; /* Light grey text */
}

.collection-features {
  list-style: none;
  padding: 0;
}

.collection-features li {
  margin: 10px 0;
  color: #ffffff; /* Light grey for feature list */
}

.launch-button {
  background-color: #A6B9DD; /* Pink button background */
  color: #fff; /* White text */
  padding: 15px 30px; /* Larger padding */
  border-color: #1e3b8a08;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 5px;
  cursor: pointer;
  font-size: 1.1em; /* Larger font size */
  transition: background-color 0.3s ease; /* Smooth background color transition */
}

.btnalign {
    display: flex;
    justify-content: center;
    align-items: center;
}

.margincollections {
    padding-left: 20px;
    padding-right: 20px;
}

.custom-collection-cards {
    display: flex;
    justify-content: space-around;
    margin: 20px 0;
  }
  
  .custom-card {
    background-color: #2e2e2e;
    padding: 10px;
    border-radius: 10px;
    width: 45%;
    text-align: center;
  }
  
  .custom-card-info h1 {
    margin: 10px 0 5px;
  }
  
  .custom-card-info p {
    margin: 5px 0;
    color: #ffffff !important;
    align-items: center;
    justify-content: center;
    display: flex;
    font-size: 14px;
  }
  
  .custom-btn-group {
    display: flex;
    justify-content: center;
    margin-top: 20px;
  }
  
  .custom-btn {
    
    color: #fff !important;
  }
  
  /* .new-collections-blockj {
    background-image: url('../../../src/assets/images/slider/jk.png');
    background-size: cover; /* Cover the entire block */
   /* background-position: center; /* Center the background image */
  /*  background-repeat: no-repeat; /* Do not repeat the background image */
 /* } */
  
 .bannerimg {
    width: 100vw;
    margin-top: -15px;
 }

 .editstyle {
    color: white !important;
    border-radius: 5px;
    background-color: #1e3b8a4b;
    padding: 5px;
 }

 .centered {
    align-items: center;
    justify-content: center;
    display: flex;
 }

 .new-collections-blockj {
    align-items: center;
    justify-content: center;
    display: flex;
    border-radius: 5px;
    margin-top: -30px;
    max-height: 50px !important;
    background-color: #A6B9DD;
    padding: 10px;
 }
  
  .custom-btnalign {
    text-align: center;
    margin-top: 20px;
  }
  
  .progress-bar-container {
    position: relative;
    width: 100%;
    height: 100px;
    background-color: #f5e6b1; /* Background color to match the reference image */
    padding: 20px;
  }
  
  .progress-bar-background {
    position: relative;
    width: 100%;
    height: 30px;
    background-color: #f5b104;
    border-radius: 15px;
    overflow: hidden;
  }
  
  .progress-bar {
    height: 100%;
    background-color: #ff8c00;
  }
  
  .sloth {
    position: absolute;
    top: -30px;
    width: 50px;
  }
  
  .milestone {
    position: absolute;
    top: 50px;
    text-align: center;
  }
  
  .arrow {
    color: #ff8c00;
    font-size: 24px;
  }
  
  .label {
    background-color: #ff8c00;
    padding: 5px 10px;
    border-radius: 5px;
    color: #fff;
    font-weight: bold;
    margin-top: 5px;
  }
  
  .centered {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .selectable-card {
    position: relative;
    transition: all 0.3s ease-in-out;
}

.selected-card {
    border: 3px solid #FFD700;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.8);
}

.grid-batch-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

.grid-batch-container .Grid {
    display: flex;
    align-items: center;
}

.grid-batch-container .batch-mode {
    margin-top: 10px;
}

@media (min-width: 768px) {
    .grid-batch-container {
        flex-direction: column;
    }

    .grid-batch-container .Grid {
        margin-bottom: 10px;
    }

    .grid-batch-container .batch-mode {
        margin-top: 10px;
        width: 100%;
        text-align: center;
    }
}

.total-price {
    font-size: 16px;
    font-weight: 600;
    padding-right: 10px;
    display: flex;
}

/* BuyNowModal.css */

.react-modal-overlay {
    background: rgba(0, 0, 0, 0.75);
    display: flex;
    align-items: center;
    justify-content: center;
}

.buy-now-modal {
    background: #3a3f74;
    border-radius: 20px;
    padding: 30px;
    width: 40%;
    max-width: 500px;
    text-align: center;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

.buy-now-modalt {
    background: #3a3f74;
    border-radius: 20px;
    padding: 30px;
    
    
    text-align: center;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

.modal-content {
    position: relative;
    color: #ffffff;
}

.turtle-4 {
    background-color: #ffffff !important;
    color: #000000 !important;
}

.nft-image {
    width: 150px;
    height: 150px;
    margin-bottom: 20px;
    display: block;
    margin-left: auto;
    margin-right: auto;
    border-radius: 10px;
}

.buttons-container {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-top: 20px;
}

.paddingbtntt {
    background-color: #4a64f3;
    color: white;
    border: none;
    padding: 10px 20px;
    border-radius: 10px;
    cursor: pointer;
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-size: 16px;
    font-weight: bold;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    transition: background-color 0.3s ease;
}

.paddingbtntt:hover {
    background-color: #2a5fa0;
}

.twitter-share-button span {
    margin-left: 10px;
}

.twitter-share-buttont {
    color: white !important;
}

.twitter-share-button {
    display: flex;
    align-items: center;
    justify-content: center;
    color: black !important;
    background-color: transparent !important; /* Ensuring same background color */
    border-radius: 10px;
    padding: 10px 20px;
    font-size: 16px;
    font-weight: bold;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    transition: background-color 0.3s ease;
    cursor: pointer;
    text-decoration: none;
}

.twitter-share-button:hover {
    background-color: #2a5fa0;
}



/* Overlay styles */
.react-modal-overlay {
    background: rgba(0, 0, 0, 0.75); /* Dark semi-transparent background */
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

@media (max-width: 768px) {
    .collection-cards {
      display: flex;
      flex-direction: column;
    }
  
    .collection-cards .card {
      width: 100%;
      margin-bottom: 20px;
    }
  
    .collection-cards .card:last-child {
      margin-bottom: 0;
    }
  
    .btnalign {
      display: flex;
      justify-content: center;
      margin-top: 20px;
    }
  
    .paddingbtnt {
      width: 100%;
      max-width: 300px;
    }
  }
  

  .flat-accordion2 {
    padding: 10px;
    border-radius: 5px;
  }