/* Media query for small screens */
@media (max-width: 1000px) {
    body {
        zoom: 1.4;
        /* font-size: 1.8em; /* Adjust the font size as per your requirement */
    }
}

@media (min-width: 1001px) and (max-width: 100000px) {
    body {
        zoom: 1.4;
    }
}
    
	@import url('https://fonts.cdnfonts.com/css/matrix');
	@import url('https://fonts.googleapis.com/css2?family=VT323&display=swap');
        body {
            font-family: Consolas, monospace;
            background-color: #000000;
            color: #00FF00;
        }

        h1 {
            font-family: 'Matrix', sans-serif;
	        color: #EAB300;
            text-align: center;
            position: relative;
            z-index: 3;
            font-size: 50px;
            font-weight: bold;
        }

        h3 {
            font-family: 'Crypto', sans-serif;
	        color: #EAB300;
            text-align: center;
            position: relative;
            z-index: 3;
            font-size: 20px;
            font-weight: bold;
        }

        table {
            border-collapse: collapse;
            width: auto;
            margin: 20px auto;
            background-color: #000000;
            border: 1px solid #00FF00;
            position: relative;
            z-index: 3;
        }
 
        th, td {
            border: 1px solid #00FF00;
            padding: 5px;
            white-space: nowrap;
       }

        th {
            background-color: #000000;
            color: #00FF00;
        }

        td {
 //           text-align: right;
        }

        tr:nth-child(even) {
            background-color: #000000;
        }

        tr:hover {
            background-color: #000000;
        }

        * {
            margin: 0;
            padding: 0;
        }

        body {
            background: black;
        }

        canvas {
            display: block;
            position: fixed;
            top: 0;
            left: 0;
            z-index: 2;
        }

    .countdown {
      z-index: 5;
      
.Screen {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 5;
  background-color: rgba(0,0,0,0.15);
  animation: ScreenEffect 0.05s ease infinite;
  cursor: pointer;
}

@keyframes ScreenEffect {
  0% { opacity: 0 }
  50% { opacity: 1 }
  100% { opacity: 0 }
}

.Pulse {
  animation: Pulse 1.5s ease infinite;
}

@keyframes Pulse {
  0% { opacity: 0 }
  50% { opacity: 1 }
  100% { opacity: 0 }
}

.DivClass {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  background: #0F140F;
  padding: 5% 5% 5% 5%;
}

.MatrixTextEffect {
  color: rgba(234,179,0,0.75);
  font-family: 'VT323', monospace;
  font-size: 75px;
  text-shadow: 0 0 5px rgba(125,225,125,0.5), 0 0 15px rgba(125,250,125,1);
}

body {
  background: #0F0F0F;
}

    #formContainer {
      z-index: 20; /* Adjusted z-index value */
    }
    #donateContainer {
      z-index: 20; /* Adjusted z-index value */
     font-size: 10px !important;
    }

    .mint-button {
      display: inline-block;
      width: 115px;
      height: 30px;
      padding: 4px;
      background-color: #4CAF50;
      color: white;
      text-align: center;
      text-decoration: none;
      font-size: 15px;
      font-weight: bold;
      font-family: Arial, sans-serif;
      border-radius: 4px;
      border: none;
      cursor: pointer;
    }


  .justified-div {
    text-align: justify;
  }

.hovertext {
  position: relative;
  border-bottom: 1px dotted black;
}

.hovertext:before {
  content: attr(data-hover);
  visibility: hidden;
//  opacity: 100;
  width: 140px;
//  background-color: black;
  color: #00FF00;
  font-size: 10px;
  text-align: center;
  border-radius: 5px;
  padding: 5px 0;
//  transition: opacity 1s ease-in-out;

  position: absolute;
  z-index: 1;
  left: 100;
  bottom: 40%;
}

.hovertext:hover:before {
//  opacity: 100;
  visibility: visible;
}

        .pagination {
            display: flex;
            justify-content: center;
            list-style: none;
            padding: 0;
        }

        .pagination li {
            margin: 0 5px;
            z-index: 21;
        }

        .pagination a {
            text-decoration: none;
            padding: 5px 10px;
            border: 1px solid #00FF00;
            color: #00FF00;
        }

        .pagination a:hover {
            background-color: #007bff;
        }

        .pagination .active {
            font-weight: bold;
            background-color: #ccc;
        }


/* Define the flame animation */
@keyframes flameAnimation {
  0% { background-position: 0 0; }
  100% { background-position: 100% 0; }
}

/* Apply the flames animation to table cells */
.flame-cell {
  background: linear-gradient(to right, #ff0000, #ff9900, #ff0000); /* Flame colors */
  background-size: 200% auto;
  animation: flameAnimation 3s infinite alternate; /* Adjust animation speed */
  padding: 10px; /* Adjust as needed */
}