/* ------------------------- Global style start-------------------------------------- */
iframe {
  pointer-events: none;
}

h4 {
  font-size: 20px !important;
}

.step_container {
  width: 1338px;
  margin: 0 auto;
}

.section_title {
  color: white;
}

@media(max-width:1338px) {
  .step_container {
    width: 90%;
  }
}

hr {
  height: 2px;
  border-width: 0;
  color: gray;
  background-color: gray;
}

.modal_section {
  background: #00000099;
}

.modal_content {
  width: 58%;
  background: transparent;
  margin: 0 auto
}

.modal_body {
  background: #0F0F13;
  color: white;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  grid-gap: 13px;
}

.modal_body div {
  background: rgba(255, 255, 255, 0.1);
  border-radius: 8px;
  border: none;
  padding: 8px;
  width: 100%;
}

.rarityModal_section {
  background: #070707ba;
}

.rarityModal_content {
  width: 450px;
  background: transparent;
  margin: 0 auto;
  background: rgba(255, 255, 255, 0.05);
  border-radius: 8px;
  color: white;
}

.rarityModal_image {
  background: transparent !important;
}

.rewardmodal_content {
  width: 470px;
  margin: 0 auto;
}

.reward_modal {
  background: #0F0F13;
  color: white;
  display: flex;
  flex-direction: column;
  Padding: 20px;
  gap: 20px
}

.reward_modal input {
  width: 100%;
  padding: 16px;
  outline: none;
  background: rgba(255, 255, 255, 0.05);
  border: none;
  border-radius: 8px;
  color: white;
}

@media(max-width:490px) {

  .modal_content,
  .raritymodal_content,
  .rewardmodal_content {
    width: 100%
  }
}

.switch_group {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.addNewRule_modal input {
  width: 100%;
  padding: 16px;
  outline: none;
  background: rgba(255, 255, 255, 0.05);
  border: none;
  border-radius: 8px;
  color: white;
}

/* ------------------------- Global style End -------------------------------------- */


/* ------------------------------- Home Banner Start ---------------------------------- */

.home_container {
  width: 1130px;
  margin: 0 auto;
  position: relative;
}

.banner_control {
  margin: 100px 0px;
  display: flex;
  justify-content: space-between;
}

.banner_left,
.banner_right {
  width: 48%;
}

.banner_title {
  font-size: 56px;
  color: white;
}

.banner_title span {
  background: linear-gradient(90deg, #31dd3b -15%, #d515d6 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.btn_staking_group {
  display: flex;
}

.btn_whitePaper {
  background: linear-gradient(to right, #5CBBFF, #CB5CFF);
  padding: 2px;
  border-radius: 10px;
  display: flex;
  color: white;
}

.btn_whitePaper div {
  background-color: black;
  padding: 5px 54px;
  display: flex;
  align-items: center;
  border-radius: 9px;
  text-transform: uppercase;
}

.banner_control p {
  color: #D0D0DA;
  font-size: 20px;
}

.follow_us {
  display: flex;
  align-items: center;
}

.follow_us div {
  display: flex;
  align-items: center;
}

.follow_us img {
  margin: 0 6px
}

.banner_right_card {
  border-radius: 8px;
  width: 343px;
  margin: 0 auto;
}

.banner_right_card_image {
  width: 343px;

}

.banner_right_card_image img {
  width: 100%;
  border-radius: 8px 8px 0px 0px;
}

.banner_right_card_content {
  display: flex;
  justify-content: space-between;
  background-color: black;
  padding: 16px;
  border: 1px solid #2E2E3A;
  border-radius: 0px 0px 8px 8px;
}

.banner_right_card h2 {
  font-family: 'Satoshi';
  font-weight: 700;
  font-size: 24px;
  color: #FFFFFF;
  margin: 0
}

.banner_right p {
  font-family: 'Satoshi';
  font-style: normal;
  font-weight: 700;
  font-size: 16px;
  color: #FFFFFF;
  margin: 0;
}

.step_stakingPage {
  margin-right: 15px
}

.play_group {
  display: flex;
  align-items: center;
  margin: 15px 0px
}

.play_group a {
  color: white !important;
  text-decoration: underline !important;
  margin-left: 10px;
}


@media(max-width:1130px) {
  .home_container {
    width: 90%;
  }

  .banner_control {
    flex-direction: column;
    justify-content: center;
  }

  .banner_left,
  .banner_right {
    width: 100%;
  }

  .banner_left {
    margin: 30px 0px;
    order: 2;
  }

  .banner_right {
    order: 1;
  }
}

@media(max-width:768px) {
  .banner_title {
    font-size: 32px;
  }
}

@media(max-width:450px) {
  .banner_title {
    font-size: 28px;
  }

  .banner_control p {
    font-size: 16px;
  }

  .btn_staking_group {
    display: block;
    text-align: center;
  }

  .step_stakingPage {
    margin-right: 0;
  }

  .btn_whitePaper {
    display: block;
    max-width: fit-content;
    margin: 15px auto;
  }

  .btn_whitePaper div {
    padding: 10px 46px
  }
}

/* ------------------------------- Home Banner End ---------------------------------- */

/* ------------------------------- Home Launch,About  ,Features Start ---------------------------------- */

.launch_control {
  margin: 50px 0px;
}

.launch_card {
  color: white;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.launch_card_item {
  position: relative;
  width: 265px;
  background: #0F0F13;
  border-radius: 10px;
  margin: 22.5px 0px;
}

.launch_card_image {
  width: 265px;
}

.launch_card_image img {
  width: 100%;
  border-radius: 10px 10px 0px 0px;
}

.launch_card_context {
  padding: 12px
}

.launch_card_context h5 {
  font-size: 20px;
}

.launch_card_context p {
  font-size: 14px
}

.about_control {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 100px 0px
}

.about_left,
.about_right {
  width: 48%
}

.about_title {
  font-family: 'Satoshi';
  font-weight: 700;
  font-size: 45.7648px;
  color: #FFFFFF;
}

.about_left p {
  font-family: 'Satoshi';
  font-weight: 500;
  font-size: 16px;
  line-height: 130%;
  color: #FFFFFF;
}

.about_image {
  width: 400px;
  margin: 0 auto
}

.about_image img {
  width: 100%;
}

.card_featured {
  position: absolute;
  left: 0;
  top: 20px;
  display: flex;
  align-items: center;
  padding: 8px 12px;
  border-radius: 0px 10px 10px 0px;
  background: #A162F7;
  color: white;
  font-size: 12px;
}

.features_control {
  margin: 16% 0px;
}

.features_card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

.features_card_item {
  background: rgba(255, 255, 255, 0.05);
  border-radius: 24px;
  padding: 24px;
  text-align: center;
  color: white;
  margin: 22.5px 0px;
}

.features_card_image {
  width: 142px;
  margin: 0 auto
}

.features_card_image img {
  width: 100%
}

.features_card_context {
  margin-top: 90px;
}

.features_card_context h5 {
  font-size: 24px;
}

.features_card_context p {
  font-size: 14px
}

@media(max-width:1130px) {

  .launch_card,
  .features_card {
    justify-content: center;
  }

  .launch_card_item,
  .features_card_item {
    margin: 22.5px 10px;
  }

  .launch_control {
    margin: 100px 0px
  }

  .about_control {
    flex-direction: column;
  }

  .about_left,
  .about_right {
    width: 100%;
  }

  .about_left {
    order: 2;
    margin-top: 30px;
  }

  .about_right {
    order: 1
  }

  @media(max-width:450px) {
    .about_image {
      width: 330px;
    }
  }
}

/* ------------------------------- Home Launch,About  ,Features End ---------------------------------- */

/* ------------------------------- Home stepStaking Start ---------------------------------- */

.stepStaking_item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 60px 0px
}

.stepStaking_image,
.stepStaking_context {
  width: 47%;
}

.stepStaking_item h1 {
  font-weight: 700;
  font-size: 44px;
  line-height: 120%;
  color: #FFFFFF;
}

.stepStaking_item p {
  font-weight: 500;
  font-size: 20px;
  line-height: 27px;

  color: #70707C;
}

.stepStaking_item img {
  max-width: 100%;
  margin: 0 30px
}

@media(max-width:768px) {
  .stepStaking_item {
    text-align: center;
    flex-direction: column;
  }

  .stepStaking_image,
  .stepStaking_context {
    width: 100%;
  }

  .stepStaking_item_order img {
    order: 2;
  }

  .stepStaking_item h1 {
    font-size: 30px;
  }

  .btn_homeBottom {
    font-size: 30px !important;
  }
}

.last_control {
  text-align: center;
  margin: 16% 0px
}


.edit_group {
  background: none !important;
  border-radius: 8px;
  border: none;
  padding: 8px;
  width: 100%;
  display: flex;
  justify-content: space-evenly;
}

.btn_last {
  background: white;
  border-radius: 8px;
  padding: 12px 20px;
  color: black;
  border: none;
  cursor: pointer;
  margin-top: 30px;
}

/* ------------------------------- Home stepStaking End ---------------------------------- */




/* ------------------------- Background Effect Start -------------------------------------- */

.bg_effect div {
  z-index: -1;
}

.effect_item1 {
  position: absolute;
  width: 20%;
  height: 20%;
  left: -15%;
  top: 18%;
  background: radial-gradient(50% 50% at 50% 50%, #4198FE 0%, #CC3CFF 100%);
  /* opacity: 0.6; */
  filter: blur(137px);
}

.effect_item2 {
  position: absolute;
  width: 20%;
  height: 20%;
  left: 80%;
  top: 9%;
  opacity: 1;
  background: radial-gradient(50% 50% at 50% 50%, #4198FE 0%, #0e0d47 100%);
  filter: blur(90px);
}

.effect_item3 {
  position: absolute;
  width: 39%;
  height: 39%;
  left: -28%;
  top: 151%;
  background: radial-gradient(50% 50% at 50% 50%, #4198FE 0%, #CC3CFF 100%);
  opacity: 0.3;
  filter: blur(232px);
}

.effect_item4 {
  position: absolute;
  width: 20%;
  height: 20%;
  left: 80%;
  top: 183%;
  background: radial-gradient(50% 50% at 50% 50%, #4198FE 0%, #CC3CFF 100%);
  opacity: 0.6;
  filter: blur(124px);
}

.wallet_group {
  background: linear-gradient(to right, #5CBBFF, #CB5CFF);
  padding: 2px;
  border-radius: 10px;
}

/* ------------------------- Background Effect End -------------------------------------- */


/* ------------------------- Header Effect Start -------------------------------------- */

.header_section {
  background: #07070A;
  border-bottom: 1px solid #2e2d2d;
}

.header_container {
  width: 80%;
  margin: 0 auto;
}

.header_control {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 0px;
}


/* ------------------------- Header Effect End -------------------------------------- */

/* ------------------------- First Step Start -------------------------------------- */

.step_control {
  color: white;
  margin: 46px 0px;
}

.step_title_group {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.step_title_group p {
  margin: 0
}

.card_item {
  background: rgba(255, 255, 255, 0.05);
  border-radius: 8px;
  padding: 27px 24px;
  margin: 30px 0px;
}

.step {
  background: linear-gradient(90deg, #5CBBFF -15%, #CB5CFF 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.step_title {
  font-size: 20px;
  margin: 6px 0px !important;
  font-weight: 600;
}

.card_flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
}


.card_flex_item {
  width: 50%;
}

.card_flex_item input {
  width: 90%;
  padding: 16px;
  outline: none;
  background: rgba(255, 255, 255, 0.05);
  border: none;
  border-radius: 8px;
  color: white;
}

.choose_group {
  display: flex;
  align-items: center;
  color: white;
}

.choose_group div:nth-child(1) {
  background: rgba(255, 255, 255, 0.15);
  border-radius: 4px 0px 0px 4px;
  padding: 16px;
  width: 130px;
}

.choose_group div:nth-child(2) {
  width: 60%;
  background: rgba(255, 255, 255, 0.1);
  border-radius: 4px 0px 0px 4px;
  padding: 10px;
  color: #656575;
  height: 56px;
  display: flex;
  align-items: center;
}

.choose_group div:nth-child(3) {
  background: rgba(255, 255, 255, 0.15);
  border-radius: 0px 4px 4px 0px;
  padding: 16px;
  width: 130px;
}

.description textarea {
  width: 100%;
  background: rgba(255, 255, 255, 0.05);
  outline: none;
  border-radius: 8px;
  resize: none;
  height: 100px;
  padding: 16px;
  color: white;
  border: none
}

.collection_logo input {
  width: 100%;
  padding: 16px;
  outline: none;
  background: rgba(255, 255, 255, 0.05);
  border: none;
  border-radius: 8px;
  color: white;
}

.rewards_mint {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.valid_address {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: rgba(255, 255, 255, 0.05);
  border-radius: 8px;
  color: white;
  padding: 16px;
}

.valid_address input {
  background: transparent !important;
  padding: 0px !important;
  margin-right: 10px;
}

.left_item {
  width: 100%
}

.left_item input {
  width: 100%;
  padding: 16px;
  outline: none;
  background: rgba(255, 255, 255, 0.05);
  border: none;
  border-radius: 8px;
  color: white;
}

.right_item {
  width: 33%
}

.right_item input {
  width: 90%;
  padding: 16px;
  outline: none;
  background: rgba(255, 255, 255, 0.05);
  border: none;
  border-radius: 3px;
  color: white;
}

.reward_amount_group {
  display: flex;
  justify-content: space-between;
}

.reward_amount_group div {
  background: rgba(255, 255, 255, 0.15);
  border-radius: 0px 4px 4px 0px;
  padding: 16px;
}

.mint_list textarea {
  width: 100%;
  background: rgba(255, 255, 255, 0.05);
  outline: none;
  border-radius: 8px;
  resize: none;
  height: 100px;
  padding: 16px;
  color: white;
  border: none
}

.marketplace_link_group input {
  width: 100%;
  padding: 16px;
  outline: none;
  background: rgba(255, 255, 255, 0.05);
  border: none;
  border-radius: 8px;
  color: white;
}

.goLiveDate_time input {
  width: 100%;
  padding: 16px;
  outline: none;
  background: rgba(255, 255, 255, 0.05);
  border: none;
  border-radius: 8px;
  color: white;
}

.btn_back_next {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.btn_reward button {
  width: 100%;
}

.btn_reward_back {
  margin-right: 20px;
}

.btn_back {
  background: #1E1E24;
  border-radius: 8px;
  padding: 12px 20px;
  color: white;
  border: none;
}

.btn_pink {
  background: linear-gradient(90deg, #5CBBFF -2.21%, #CB5CFF 100%);
  border-radius: 8px;
  padding: 12px 20px;
  color: white;
  border: none;
  cursor: pointer;
}

.btn_yellow {
  background: #FFF736;
  border-radius: 8px;
  padding: 12px 20px;
  color: black;
  border: none;
  cursor: pointer;
}

.btn_homeBottom {
  position: absolute;
  bottom: -130px;
  width: 100%;
  background: #282935;
  font-weight: 700;
  font-size: 48px;
  color: #8A8A98;
}

@media(max-width:1170px) {
  .card_flex {
    display: block;
  }

  .card_flex_item input {
    width: 100%;
  }

  .card_flex_item {
    width: 100%;
  }

  .choose_group div:nth-child(1) {
    width: 130px;
  }

  .choose_group div:nth-child(2) {
    width: 72%;
  }

  .choose_group div:nth-child(3) {
    width: 130px
  }
}

@media(max-width:768px) {

  .rewards_mint {
    display: block;
  }

  .left_item,
  .right_item {
    width: 100%;
  }
}

/* ------------------------- First Step End -------------------------------------- */

/* ------------------------- Second Step Start -------------------------------------- */
.duration_group {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.duration_group div:first-child {
  width: 100%
}

.group_item_right {
  min-width: 164px;
  margin-left: 20px;
}

.group_item_right p:last-child {
  background: #1E1E24;
  border-radius: 8px;
  padding: 12px 20px;
  color: white;
  border: none;
  margin: 0
}

.duration_group_item div {
  background: #1E1E24;
  border-radius: 8px;
  padding: 12px 20px;
  color: white;
  border: none;
  margin: 20px 0px
}

.btn_add {
  width: 100%;
  background: #535362;
  border-radius: 8px;
  padding: 12px 20px;
  margin: 20px 0px;
  color: white;
  border: none;
  cursor: pointer;
}

.btn_add_passive {
  opacity: 0.6;
  cursor: no-drop !important;
  width: 100%;
  background: #535362;
  border-radius: 8px;
  padding: 12px 20px;
  margin: 20px 0px;
  color: white;
  border: none;
}

.nfts_value_group {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.nfts_left_item {
  width: 85%;
}

.nfts_right_item {
  min-width: 190px;
}

.nfts_left_item div {
  background: rgba(255, 255, 255, 0.05);
  border-radius: 8px;
  padding: 12px 20px;
  color: white;
  margin: 20px 0px;
}

.nfts_count {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: white;
  margin: 18px 0px;
}

.nfts_count button,
.nfts_count div {
  background: rgba(255, 255, 255, 0.05);
  border-radius: 4px;
  border: none;
  padding: 12px 20px;
  margin: 0 3px;
  color: white;
}

.nfts_count_passive button {
  opacity: 0.6 !important;
  background: rgba(255, 255, 255, 0.05);
  border-radius: 4px;
  border: none;
  padding: 12px 20px;
  margin: 0 3px;
  color: white;
  cursor: no-drop !important;
}

.unstaking_fee input,
.wallet_details input {
  width: 100%;
  padding: 16px;
  outline: none;
  background: rgba(255, 255, 255, 0.05);
  border: none;
  border-radius: 8px;
  color: white;
}

.nft_rarity div {
  display: flex;
  align-items: center;
}

.rarity_card_item {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.btn_disconnect {
  background: #1E1E24;
  border-radius: 8px;
  padding: 10px;
  margin-left: 20px;
  border: none;
  color: white;
  cursor: pointer;
}

@media(max-width:400px) {

  .group_item_left p,
  .nfts_left_item p {
    font-size: 13px;
  }
}

/* ------------------------- Second Step End -------------------------------------- */

/* ------------------------- Third Step Start -------------------------------------- */

.step_pricing {
  display: flex;
  justify-content: space-between;
  background: rgba(255, 255, 255, 0.05);
  border-radius: 8px;
  color: white;
  margin: 22.5px 0px;
}

.step_pricing>div {
  width: 33%;
  display: flex;
  flex-direction: column;
  padding: 32px;
}

.step_feature {
  background: rgba(255, 255, 255, 0.1);
  border-radius: 8px 0px 0px 8px;
}

.step_standard {
  border-right: 1px solid #333232;
}

.step_pricing_control {
  display: flex;
  flex-direction: column;
  padding-bottom: 24px;
}

.step_pricing_control p {
  margin: 24px 0px
}

.step_feature h2 {
  font-style: normal;
  font-weight: 700;
  font-size: 24px;
  line-height: 32px;
  text-transform: uppercase;
}

.step_standard h2 {
  font-family: 'Satoshi';
  font-weight: 700;
  font-size: 24px;
  line-height: 32px;
  text-transform: uppercase;
  background: linear-gradient(90deg, #5CBBFF -2.21%, #CB5CFF 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-fill-color: transparent;
}

.step_premium h2 {
  font-family: 'Satoshi';
  font-weight: 700;
  font-size: 24px;
  line-height: 32px;
  text-transform: uppercase;
  color: #FFF736;
}

.step_premium p {
  margin: 18px 0px !important
}

/* ------------------------- Third Step Start -------------------------------------- */

/* ------------------------- Fourth Step Start -------------------------------------- */

.item_layer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: transparent;
}

.item_layer p {
  margin: 0;
}


.card_element {
  padding: 20px;
  background: rgba(255, 255, 255, 0.05);
  border-radius: 8px;
  border: none
}

.card_element_layer {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.card_element_layer p {
  margin: 0
}

.detail_account {
  background: rgba(255, 255, 255, 0.1);
  border-radius: 8px;
  border: none;
  padding: 12px 16px;
}

.btn_advised {
  background: rgba(36, 202, 73, 0.1);
  border-radius: 8px;
  border: none;
  padding: 12px 16px;
  width: 100%;
  color: white;
}

/* ------------------------- Fourth Step End -------------------------------------- */