.center-text {
   text-align: center;
   align-items: center;
   justify-content: center;
   display: flex;
   flex-direction: column; 
   align-items: center;
   flex-wrap: wrap;
}

.left-text {
   text-align: left;

}

.grid-container {
   display: grid;
   place-items: center;
   align-items: center;
   gap: 10px;
   padding: 10px;
}

.mobile-only {
   display: none;
}

p {

   color:#d689ff;
   font-size: clamp(14px, 4vw, 18px);
   font-family: Lucida Console, monospace;
   text-align: center;
   align-items: center;
   word-spacing: 5px;
   border-color: #a600ff; 
   border-width: 5px; 
   border-top-style: double; 
   border-bottom-style: double; 
   border-left-style: solid; 
   border-right-style: solid; 
   width: 100%;
   max-width: 1000px;
   padding: 10px;
   margin: 20px auto;
   box-sizing: border-box;

}

 h6 {

   color:#d689ff;
   font-size: clamp(14px, 4vw, 18px);
   font-family: Lucida Console, monospace;
   text-align: center;
   align-items: center;
   word-spacing: 1px;
   border-color: #a600ff; 
   border-width: 5px; 
   border-top-style: double; 
   border-bottom-style: double; 
   border-left-style: solid; 
   border-right-style: solid; 
   width: 100%;
   max-width: 1000px;
   margin: 20px auto;
}

h1 {
   color:#d689ff;
   font-size: clamp(18px, 6vw, 25px);
   font-family: Lucida Console, monospace;
   text-align: center;
   align-items: center;
   padding: 0 10px;
   margin: 10px auto;

}

h2 {
   color:#d689ff;
   font-size: clamp(24px, 8vw, 40px);
   font-family: Lucida Console, monospace;
   text-align: center;
   align-items: center;

}
h3 {
   color:#080708;
   font-size: clamp(10px, 3vw, 12px);
   font-family: Lucida Console, monospace;
   text-align: center;
   align-items: center;

}


.p1 {
   width: 100%;
   max-width: 1000px;
}

body {
   padding: 0;
   margin: 0;
   width: 100%;
   background-color: #080708;
   line-height: 23px;
}

a {
   text-decoration: none;
   font-size: clamp(16px, 5vw, 25px);
   font-family: Lucida Console, monospace;
   color:#d689ff;
   margin: 5px;
   display: inline-block;
   padding: 8px 12px;
   border-radius: 4px;
   transition: all 0.3s ease;
}

a:hover {
   text-decoration: underline;
   transform: scale(1.02);
}

a:active {
   text-decoration: underline;
   font-family: Lucida Console, monospace;
   color:#e3afff;
   margin: 5px;
}

@media (max-width: 1080px) {
   p, h6, img {
      width: 100%;
      margin: 15px auto;
      border-width: 3px;
   }
   
   
   
   .top-IMGS img {
      width: 30%;
      max-width: 10000px;
      
   }
   
   h1 {
      font-size: clamp(16px, 5vw, 22px);
   }
   
   h2 {
      font-size: clamp(20px, 6vw, 32px);
   }
   
   a {
      font-size: clamp(14px, 4vw, 20px);
      margin: 4px 3px;
      padding: 6px 10px;
   }
   
   .center-text {
      flex-direction: column;
   }
   
   .center-text h1 {
      word-break: break-word;
   }
   
   .divider img {
      width: 104%;
      height: auto
   }
}

@media (max-width: 1080px) {
      p, h6, img {
      width: 100%;
      margin: 10px auto;
      border-width: 2px;
      padding: 8px;
      font-size: clamp(12px, 3.5vw, 16px);
   }

   .mobile-only {
      display: block;
   }

   .top-IMGS img {
      width: 90%;
      max-width: 300px;
   }
   
   h1 {
      font-size: clamp(14px, 4vw, 18px);
      margin: 8px auto;
   }
   
   h2 {
      font-size: clamp(18px, 5vw, 26px);
   }
   
   a {
      font-size: clamp(12px, 3vw, 16px);
      margin: 3px 2px;
      padding: 5px 8px;
   }
   
   body {
      line-height: 20px;
   }
   
   .grid-container {
      gap: 8px;
      padding: 8px;
   }


   .divider img {
      width: 104%;
      height: auto;
   }

}