* {
   margin: 0;
   padding: 0;
 }


html {
  box-sizing: border-box;
}




body {
   background-color: black; 
   /* #d1d1d1; */
   
   font-family:'Chakra Petch', sans-serif;
 
   /* Permalink - use to edit and share this gradient:
      https://colorzilla.com/gradient-editor/#fcecfc+0,ffdbf3+44,ff7cd8+100 */

   /* BLUE GRADIENT BACKGROUND: */
   /* background: linear-gradient(to bottom,  #fcecfc 0%,#c7f4ff 44%,#7cc8ff 100%); */

   /* background: linear-gradient(to bottom,  #ff001c 0%,#fffe6e 44%,#0e00fc 100%); */

   /* PINK GRADIENT BACKGROUND: */
   /* background: linear-gradient(to bottom,  #fcecfc 0%,#ffdbf3 44%,#ff7cd8 100%); */
 }
 

/* body .TipAndMint {
   background-color: #505050; 
}



.TipAndMint {
   background-color: #505050; 
} */



#DropDownMenuHeader {
   background-color: red;
   content:"YO!";
}





/* #AboutBody {
   background-color: #505050;
   font-family:'Chakra Petch', sans-serif;
} */
 
 
       
#MasterContainer {
   width: 70%;
   max-width: 1200px;
   margin: auto;
   
   background-color: #dcfcff;

   padding: 15px;

   border-left: 1px solid rgb(0, 0, 0);
   border-right: 1px solid black;
}



#MenuContainer {
   position: relative;
   width: 99%;
   z-index: 1;

   left: 0;
   top: 5px;

   /* border: solid 1px red; */
}



#menu-icon {
   position: absolute;
   margin-right: 5px;
   top: 0;
   right: 0;

   background-color: rgb(0, 0, 0);
   /* background-color: rgb(255, 166, 0); */
   border: solid 1px black;

   cursor: pointer;
   font-size: 36px;
   padding: 10px;
}



#menu {
   display: none;
   position: absolute;
   z-index: 13;

   top: 70px;
   right: 0px;
   width: 150px;
   margin-right: 12px;

   background-color: black;
   color: lime;
   /* color: #1e00ff; */
   /* border: solid 1px yellow; */

   padding: 10px;

   border: solid 1px rgba(0, 255, 0, 0.5);
   border-radius: 5px;
   box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
   
   font-family:'Chakra Petch', sans-serif;
}


#menu a {
   display: block;
   color: lime;
   -webkit-text-stroke: 0px #46fe21;
   /* color: #0011ff; */
   text-decoration: none;
   padding: 8px 0;
   /* transition: background-color 0.3s; */
   border-bottom: solid 1px rgb(99, 99, 99);
}


#menu a:hover {
   background-color: #111111;
   border-bottom: solid 1px lime;
}



#sheroneBeanieDIV {
   position: absolute;
   /* width: 100%; */
   z-index: 3;

   top: 5px;
   left: 0px;
   /* right: 10px; */

   margin: auto;
   margin-top: 0px;
   /* margin-right: 70px; */
   /* margin-bottom: 5px; */

   /* border: solid 1px black; */
   /* background-color: blue; */
   color: antiquewhite;

   text-align: center;
}



#BeanieImage {
   /* border: solid 1px black; */

   background-image: url("../PUNK-IMAGES/Beanie-5230-no-text.png");
   background-repeat: no-repeat;

   width: 84px;
   height: auto;
}



#BeanieImage:hover {
   width: 84px;
   height: auto;

   background-color: #fff7b8;
   background-image: url("../PUNK-IMAGES/Beanie-Pixel-Jam-84x150.png");
   /* background-image: url("../PUNK-IMAGES/Beanie-PixelJam-96x96.png"); */
}



#Web3StatusDIV {
   width: 70%;
   max-width: 1200px;
   margin: auto;
   /* z-index: 1; */

   background-color: #b9a5ff;
    /* rgb(93, 93, 93); */
   color: #000000;
   /* color: #29ffbb; */

   padding: 15px;
   padding-top: 7px;
   /* padding-left: 3px; */
   padding-bottom: 3px;
   /* padding-top: 1px !important; */

   text-align: left;
   font-family:'Courier New', Courier, monospace;
   font-size: 0.95rem;
   letter-spacing: 0;
   /* font-family:'Chakra Petch', sans-serif; */

   border: solid 1px black;
}




.GenArtLogoClass {
   background-color: black;
   width: 50%;
   max-width: 400px;
   height: auto;
}






.ComputerArtCelebrationClass {
   margin-bottom: 9px;
   color: #b4c9ff;
    /* limegreen; */
   font-family: 'Courier New', Courier, monospace;
   font-size: 1.05rem;
   letter-spacing: 0;
}








#HeaderDIV {
   position: absolute;
   position: relative;
   width: 100%;
   z-index: 1;

   left: 0;
   top: 0;

   text-align: center;
   background-color: transparent;
   /* background-color: rgb(44, 44, 44); */
   color: transparent;
   -webkit-text-stroke: 2px  #46fe21;
   /* color: #46fe21; */
   /* color: #00abff; */

   padding: 5px;
   padding-top: 1px !important;

   font-family:'Chakra Petch', sans-serif;

   /* border-bottom: solid 1px rgb(158, 158, 158); */

   /* opacity: 0.65; */
}



#MainHeader {
   width: 75%;
   margin: auto;
   margin-top: 0px;
   margin-bottom: 4px;
   padding-top: 0px;
   
   text-align: center;

   /* Stroke width: */
   /*-webkit-text-stroke-width: 0.65px;*/
   /* OR: 
   -webkit-text-stroke-width: 0.25px; 
   */

   /* Stroke WIDTH + COLOR: */
   -webkit-text-stroke: 0.65px #46fe21;

   /* You can also combine properties: */
   /* -webkit-text-stroke: 2px  #46fe21; */

   /* border: 1px solid yellow; */
   border-radius: 4px;
   font-family:'Chakra Petch', sans-serif;
   padding-bottom: 4px;
   font-size: 2.5rem;
}



#BetaBit {
   border: 1px solid transparent;
   position: relative;
   margin-left: -90px;
   top: 9px;
   color: rgb(255, 236, 160);
   font-size: 1.15rem;
   
   -webkit-text-stroke-width: 0.5px;
   -webkit-text-stroke-color: rgb(84, 84, 84);
}




#HidingHeader {
   position: absolute;
   top: 33px;
   width: 160px;
   right: 150px;


   margin: auto;
   margin-top: -9px;

   padding: 0px;
   color: white;
   font-style: italic;
   font-weight: 500;

   font-size: 1.25rem;
}




#DummyTextDIV {
   position: absolute;
   z-index: 503;

   width: 600px;
   height: fit-content;

   overflow-y: scroll;
   display: inline-block;

   margin: auto;

   padding-top: 17px;
   padding-left: 5px;
   padding-right: 5px;

   text-align: left;

   background-color: black;
   color: lime;
   border: solid 1px rgba(0, 255, 0, 0.5);

   box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}






#MasterUserGalleryDIV {
   width: 98%;
   margin: auto;
   background-color: rgb(195, 249, 255);
   margin-top: 5px;

   padding: 0px;

   border: solid 1px gray;
}



.icebergImageClass {
   width: 90%;
   max-width: 512px;
   height: auto;

   border: solid 1px black;

   background-color: #00abff;
}




#TipMintHeader {
   margin: auto;
   text-align: center;
   text-decoration: underline;

   /* border: solid 1px yellow; */
}




.videoControlsClass {
   width: 80%;
   max-width: 504px;
   height: auto;
   margin: auto;

   background-color: #e6edff;
   
   text-align: left;

   padding: 3px;
   padding-left: 6px;
}
   

.videoControlsClass:hover {
   background-color: #98b5ff;
   box-shadow: 0 0 5px rgba(0, 0, 0, 0.35);
}
   




.contentDIVClassDark {
   width: 98%;
   margin: auto;

   background-color: black;
   color: #b4c9ff;

   padding: 0px;

   /* border: solid 1px gray; */
}




.contentDIVClass {
   width: 98%;
   margin: auto;
   /* background-color: yellow; */

   padding: 0px;

   border: solid 1px gray;
}












#adminButtonsDIV {
   width: 80%; 
   background-color: rgb(211, 239, 216);
   color: rgb(99, 3, 172);

   border: solid 4px rgb(11, 6, 67);

   padding: 10px;
   margin-top: 5px;
   margin-bottom: 5px;
   margin-left: auto;
   margin-right: auto;

   text-align: center;
}





#spinnerDIV {
   z-index: 500;

   display: inline-block;
   position: absolute;
   /* fixed;  */
    /* ; */
   top: 5%;

   text-align: center;
   padding-top: 9px;
   padding-left: 5px;
   padding-right: 5px;

   width: 350px;
   height: 250px;

   background-color: rgb(248, 235, 202);

   border-width: 5px;
   border-style: solid;
   /* border-radius: 0px; */
   /* border-radius: 15.0px; */
   border-color: rgb(62, 63, 65);
}









#slider-container {
   position: absolute;
   bottom: 10px;
   width: 80%;
   margin-left: 10%;
   margin-right: 10%;
   padding: 3px;
   padding-top: 7px;

   background-color: #424242;

   border: solid 1px rgb(48, 48, 48);
   border-radius: 8px;

   opacity: 0.85;

}



#theSlider {
   /* position: absolute; */
   /* bottom: 10px; */
   width: 96%;
   margin-left: 2%;
   margin-right: 2%;

   /* background-color: #3dff53; */
}



#FooterDIV {
   width: 70%;
   max-width: 1200px;
   margin: auto;
   /* width: 100%; */
   /* margin: auto; */
   background-color: rgb(255, 250, 219);

   border: solid 1px gray;

   padding: 15px;
   padding-top: 15px;
}



#hoverInfoDIV {
   position: absolute;
   z-index: 5;

   top: 115px;
   left: 5px;

   width: 215px;
   /* height: 100px; */
   max-height: 300px;

   margin: 0%;
   padding: 9px;
   padding-left: 10px;

   background-color: rgb(27, 0, 35);
   border: solid 2px silver;

   font-family: 'Courier New', Courier, monospace;
   color: #3dff53;
   font-size: 1.03rem;
}



#GUIContainerDIV {
   visibility: visible;
   position: absolute;
   z-index: 5;

   top: 115px;
   right: 5px;

   width: 250px;
   /* max-height: 300px; */

   margin: 0%;
   padding: 9px;

   background-color: rgb(27, 0, 35);

   border: solid 1px silver;
   /* border-radius: 9px; */

   font-family: 'Courier New', Courier, monospace;
   color: #3dff53;
   font-size: 0.9rem;
}



#SettingsButtonDIV {
   visibility: hidden;
   position: absolute;
   z-index: 10;

   top: 100px;
   right: 20px;

   width: 32px;
   height: 32px;

   margin: 0px;
   padding: 0px;

   background-color: rgb(0, 0, 0);
   color: #00da3a;
   
   border: solid 1px silver;

   /* text-align: center;
   font-family: 'Courier New', Courier, monospace;
   font-size: 2.5rem; */

   /* content: "\2699"; */

   /* display: block;
   white-space: nowrap; */
}


#SettingsButton {
   position: absolute;
   z-index: 10;

   top: -12px;
   left: 1px;

   width: 30px;
   height: 30px;

   margin: 0%;

   background-color: transparent;
   color: #00da3a;
   border: solid 0px transparent;

   font-family: 'Courier New', Courier, monospace;
   font-size: 2.75rem;
}


#SettingsButton:hover {
   position: absolute;
   z-index: 10;

   top: -12px;
   left: 1px;

   width: 30px;
   height: 30px;

   margin: 0%;

   background-color: transparent;
   color: #ff72fa;
   border: solid 0px transparent;

   font-family: 'Courier New', Courier, monospace;
   font-size: 2.75rem;
}



input[type="range"] {
   overflow: hidden;
   width: 80px;
   /* -webkit-appearance: none; */
   background-color: transparent;
}


/** FF*/
input[type="range"]::-moz-range-progress {
  background-color: #4349f7; 
}
input[type="range"]::-moz-range-track {  
  background-color: #ff00dd;
}
/* IE*/
input[type="range"]::-ms-fill-lower {
  background-color: #f7e243; 
}
input[type="range"]::-ms-fill-upper {  
  background-color: #2300d2;
}



#punkIDNumberTF {
   padding: 5px 5px 5px 10px;
   border: solid 1px gray;
   border-radius: 6px;

   font-family:'Chakra Petch', sans-serif;
   font-size: 1.0rem;
}



.attributesDisplayStringClass {
   /* color: rgb(255, 62, 255); */
   color: #3dff53;
}



.attyLinkClass {
   color: yellow;
}



.buttonClass {
   padding: 3px 10px 4px 10px;
   
   font-family:'Chakra Petch', sans-serif;
   font-size: 0.95rem;
}



.dropDownMenuClass {
   width: 300px;
   padding: 4px 10px 4px 10px;
   
   font-family:'Chakra Petch', sans-serif;
}



a {
   color: blue;
   text-decoration: none;
}


a:hover {
   color: rgb(255, 0, 0);
   text-decoration: underline;
}


a:visited {
   color: rgb(0, 68, 255);
   color: rgb(255, 0, 221);
}




h2 {
   padding-left: 15px;
   font-family:'Chakra Petch', sans-serif;
}



.contentsParagraph {
   padding-left: 15px;
   padding-right: 7px;
   font-family:'Chakra Petch', sans-serif;
   font-size: 1.0rem;
}







@media (max-width: 810px) {

         
   #MasterContainer {
      width: 85%;
      margin: auto;
      
      border: 1px solid rgb(116, 116, 116);

      padding: 7px;
   }


   #menu-icon {
      position: absolute;
      top: 0;
      right: 0;

      background-color: rgb(219, 219, 219);
      /* background-color: rgb(255, 166, 0); */
      border: solid 1px black;

      cursor: pointer;
      font-size: 32px;
      padding: 10px;
   }


   #hoverInfoDIV {
      position: absolute;
      z-index: 5;
   
      top: 83px;
      left: 10px;
   
      width: 200px;
      /* height: 100px; */
      max-height: 300px;
   
      margin: 0%;
      padding: 9px;
      padding-left: 10px;
   
      background-color: rgb(27, 0, 35);
      border: solid 2px silver;
   
      font-family: 'Courier New', Courier, monospace;
      color: #3dff53;
      font-size: 1.03rem;
   }
   

   #MainHeader {
      width: 75%;
      margin: auto;
      /* margin-bottom: 4px; */

      /* border: 1px solid red; */
      /* border-radius: 4px; */
      padding: 0px;
      /* padding-bottom: 4px; */
      
      text-align: center;
      font-family:'Chakra Petch', sans-serif;
      font-size: 2.05rem;
   }


   #FooterDIV {
      width: 85%;
      margin: auto;
      /* width: 100%; */
      /* margin: auto; */
      background-color: rgb(255, 250, 219);

      border: solid 1px gray;
      /* border-left: none;
      border-right: none; */
      /* border-bottom: none; */
   
      padding: 7px;
      padding-top: 15px;
   }
   


   

   #HidingHeader {
      /* top: 26px; */
      /* right: 90px; */

      margin-top: 10px;

      padding: 0px;
      color: white;
      font-style: italic;
      font-weight: 400;

      font-size: 1.1rem;
   }

   







}




@media (max-width: 768px) {
   /* 576px */
         
   #MasterContainer {
      width: 100%;
      margin: auto;

      
      border: 1px solid rgb(116, 116, 116);

      padding: 7px;
   }



   #menu-icon {
      position: absolute;
      top: 0;
      right: 0;

      background-color: rgb(219, 219, 219);
      /* background-color: rgb(255, 166, 0); */
      border: solid 1px black;

      cursor: pointer;
      font-size: 32px;
      padding: 10px;
   }



   
   #MainHeader {
      width: 65%;
      margin: auto;
      /* margin-bottom: 4px; */

      /* border: 1px solid red; */
      /* border-radius: 4px; */
      padding: 0px;
      /* padding-bottom: 4px; */
      
      text-align: center;
      font-family:'Chakra Petch', sans-serif;
      font-size: 2.05rem;
   }



   #FooterDIV {
      width: 100%;
      margin: auto;
      background-color: rgb(255, 250, 219);

      border: solid 1px gray;
      padding: 0px;
      padding-top: 15px;
   }


}






@media only screen and (max-width: 430px) {
            
   #HeaderDIV {
      position: relative;
      z-index: 1;
      width: 100%;
      height: 70px;

      margin: 0px;

      left: 0;
      top: 0;

      text-align: center;

      background-color: rgb(57, 57, 57);
      color: #00abff;

      padding: 0px;
      padding-top: 0px;

      font-family:'Chakra Petch', sans-serif;
   }



   #MasterContainer {
      width: 100%;
      margin: auto;

      padding: 0px;

      border: none; 
      /* border: 1px solid rgb(116, 116, 116); */

      /* border-left: none;
      border-right: none; */
   }


      
   #MenuContainer {
      position: relative;
      width: 99%;
      z-index: 1;

      left: 0;
      top: 0;

      /* border: solid 1px purple; */
   }


   
   #menu-icon {
      position: absolute;
      top: 4px;
      right: 0;
      margin-right: 3px;

      background-color: rgb(219, 219, 219);
      /* background-color: rgb(255, 166, 0); */
      border: solid 1px rgb(156, 156, 156);

      cursor: pointer;
      font-size: 29px;
      padding: 5px;
   }

   
   #menu {
      display: none;
      position: absolute;
      z-index: 13;
      top: 50px;
      right: 0;
      width: 150px;
      margin-right: 3px;

      background-color: #dcdcdc;
      color: #1e00ff;
      padding: 3px;
      border-radius: 1px;
      box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
      
      font-family:'Chakra Petch', sans-serif;
   }
   

   
 
   #MainHeader {
      width: 120px;
      margin-left: 55px;

      /* border: 1px solid yellow; */
      padding: 0px;
      padding-top: 8px;
      
      text-align: left;

      font-family:'Chakra Petch', sans-serif;
      font-size: 1.35rem;
      line-height: 1.1;
   }

   

   
   #BetaBit {
      border: 1px solid transparent;
      position: relative;
      margin-left: -70px;
      top: 11px;
      color: rgb(255, 45, 45);
      font-size: 0.95rem;
   }
   
   

   #Web3StatusDIV {
      width: 100%;
      margin: auto;
      /* z-index: 1; */

      background-color: rgb(93, 93, 93);
      color: #29ffbb;

      padding: 3px;
      /* padding-top: 1px !important; */

      text-align: left;
      font-family:'Courier New', Courier, monospace;
      font-size: 0.85rem;
      letter-spacing: 0px;
      /* font-family:'Chakra Petch', sans-serif; */

      border: solid 1px black;
   }
  


   #punkIDNumberTF {
      padding: 2px 2px 2px 0px;
      border: solid 1px gray;
      border-radius: 4px;

      font-family:'Chakra Petch', sans-serif;
      font-size: 0.9rem;

      text-align: center;
   }

   


   #HidingHeader {
      position: absolute;
      top: 23px;
      width: 120px;
      right: 90px;

      margin-top: 0px;

      padding: 0px;
      color: white;
      font-style: italic;
      font-weight: 400;

      font-size: 1.1rem;
   }




   .GenArtLogoClass {
      background-color: black;
      /* width: 0%; */
      max-width: 400px;
      height: auto;
   }
   

   



   #DummyTextDIV {
      width: 94%;
      /* width: 400px; */
   }
   


   #TotallyRandom-Button {
      /* content: "&#8635;" */
      /* content: "\8635"; */
      content: "what's ip";

   }


   #sheroneBeanieDIV {
      position: absolute;
      z-index: 3;

      top: 1px;
      left: 0px;

      margin: auto;
      margin-top: 0px;

      /* border: solid 1px black; */
      /* background-color: blue; */
      color: antiquewhite;
      text-align: center;
   }



   #BeanieImage {
      /* border: solid 1px black; */

      background-image: url("../PUNK-IMAGES/Beanie-5230-no-text.png");

      background-repeat: no-repeat;

      width: 64px;
      height: auto;
   }



   #BeanieImage:hover {
      /* border: solid 1px black; */

      background-image: url("../PUNK-IMAGES/Beanie-5230-no-text.png");

      background-repeat: no-repeat;

      width: 64px;
      height: auto;

      background-color: #ff7cd8;
   }



   .contentDIVClass {
      width: 98%;
      margin: auto;
      /* background-color: yellow; */

      padding: 0px;

      border: solid 1px gray;
   }
   



   .contentsParagraph {
      width: 98%;
      margin: auto;
      padding-left: 7px;
      padding-right: 7px;
      font-family:'Chakra Petch', sans-serif;
      font-size: 1.0rem;
   }




   #DataInputDIV {
      position: absolute;
      width: 200px;
      top: 10px;
      right: 0;
      /* border: 2px solid rgb(0, 21, 255); */

      padding-left: 0px;
      margin-left: 0%;

      text-align: left;
   }


   .dropDownMenuClass {
      width: 150px;
      margin-top: 3px;
      padding: 3px 7px 3px 7px;
      
      font-family:'Chakra Petch', sans-serif;
      font-size: 0.8rem;
   }



   #DropDownMenuHeader {
      background-color: red;
      content:"YO!";
   }



   #OrSpan {
      margin-left: 0px;
      visibility: hidden;
   }

    
   #GUIContainerDIV {
      visibility: hidden;
      position: absolute;
      z-index: 5;

      top: 80px;
      right: 10px;

      width: 250px;
      /* max-height: 300px; */

      margin: 0%;
      padding: 9px;

      background-color: rgb(27, 0, 35);

      border: solid 1px silver;
      /* border-radius: 9px; */

      font-family: 'Courier New', Courier, monospace;
      color: #3dff53;
      font-size: 0.9rem;
   }


      
   #SettingsButtonDIV {
      visibility: visible;
      position: absolute;
      z-index: 10;

      top: 75px;
      right: 5px;

      width: 32px;
      height: 32px;

      margin: 0px;
      padding: 0px;

      background-color: rgb(0, 0, 0);
      color: #00da3a;
      
      border: solid 1px silver;

      /* text-align: center;
      font-family: 'Courier New', Courier, monospace;
      font-size: 2.5rem; */

      /* content: "\2699"; */

      /* display: block;
      white-space: nowrap; */
   }


   .buttonClass {
      padding: 1px 5px 1px 5px;
      
      font-family:'Chakra Petch', sans-serif;
      font-size: 0.9rem;

      border-radius: 1px;
   }

   

   #FooterDIV {
      width: 100%;
      margin: auto;
      background-color: rgb(255, 250, 219);

      border-top: solid 1px gray;
      border-left: none;
      border-right: none;
      border-bottom: none;

      padding: 0px;
      padding-top: 15px;
   }



}










@media only screen and (max-width: 414px) {
/* @media (max-width: 576px) { */
         
      
   #HeaderDIV {
      position: relative;
      z-index: 1;
      width: 100%;
      height: 70px;

      margin: 0px;

      left: 0;
      top: 0;

      text-align: center;

      background-color: rgb(57, 57, 57);
      color: #00abff;

      padding: 0px;
      padding-top: 0px;

      font-family:'Chakra Petch', sans-serif;
   }


   #MasterContainer {
      width: 100%;
      margin: auto;

      border: none; 

      /* background-color: red; */
      
      padding: 0px;
       /* 0px solid transparent; */
      /* border-right: 0px solid transparent; */
   }


      
   #MenuContainer {
      position: relative;
      width: 99%;
      z-index: 1;

      left: 0;
      top: 0;

      /* border: solid 1px purple; */
   }


   
   #menu-icon {
      position: absolute;
      top: 4px;
      right: 0;
      margin-right: 3px;

      background-color: rgb(219, 219, 219);
      /* background-color: rgb(255, 166, 0); */
      border: solid 1px rgb(156, 156, 156);

      cursor: pointer;
      font-size: 29px;
      padding: 5px;
   }



   #menu {
      display: none;
      position: absolute;
      z-index: 13;
      top: 50px;
      right: 0;
      width: 150px;
      margin-right: 3px;

      background-color: #dcdcdc;
      color: #1e00ff;
      padding: 3px;
      border-radius: 1px;
      box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
      
      font-family:'Chakra Petch', sans-serif;
   }
   

   
   #MainHeader {
      width: 120px;
      margin-left: 50px;

      /* border: 1px solid yellow; */
      padding: 0px;
      padding-top: 8px;
      
      text-align: left;

      font-family:'Chakra Petch', sans-serif;
      font-size: 1.35rem;
      line-height: 1.1;
   }

   
   
   #BetaBit {
      border: 0px solid transparent;
      position: relative;
      margin-left: -70px;
      top: 8px;
      color: rgb(255, 48, 48);
      font-size: 0.92rem;
   }
   



   .GenArtLogoClass {
      background-color: black;
      width: 80%;
      max-width: 400px;
      height: auto;
   }
   


   .ComputerArtCelebrationClass {
      margin-bottom: 9px;
      /* color: #b4c9ff; */
      color: limegreen;
      font-family: 'Courier New', Courier, monospace;
      font-size: 0.95rem;
      letter-spacing: 0;
   }
   



   #HidingHeader {
      position: absolute;
      top: 13px;
      width: 120px;
      right: 90px;

      margin-top: 0px;

      padding: 0px;
      color: white;
      font-style: italic;
      font-weight: 400;

      font-size: 1.05rem;
   }

   


   #DataInputDIV {
      position: absolute;
      width: 200px;
      top: 10px;
      right: 0;
      /* border: 1px solid rgb(0, 21, 255); */

      padding-left: 0px;
      margin-left: 0%;

      text-align: left;
   }


   .dropDownMenuClass {
      width: 150px;
      margin-top: 3px;
      padding: 3px 7px 3px 7px;
      
      font-family:'Chakra Petch', sans-serif;

   }



   #DropDownMenuHeader {
      background-color: red;
   }



   #OrSpan {
      margin-left: 0px;
      visibility: hidden;
   }



   #sheroneBeanieDIV {
      position: absolute;
      z-index: 3;

      top: 1px;
      left: 0px;

      margin: auto;
      margin-top: 0px;

      /* border: solid 1px black; */
      /* background-color: blue; */
      color: antiquewhite;
      text-align: center;
   }



   #BeanieImage {
      /* border: solid 1px black; */

      background-image: url("../PUNK-IMAGES/Beanie-5230-no-text.png");

      background-repeat: no-repeat;

      width: 64px;
      height: auto;
   }



   #BeanieImage:hover {
      /* border: solid 1px black; */

      background-image: url("../PUNK-IMAGES/Beanie-5230-no-text.png");

      background-repeat: no-repeat;

      width: 64px;
      height: auto;

      background-color: #ff7cd8;
   }

   




   #FooterDIV {
      width: 100%;
      margin: auto;
      background-color: rgb(255, 250, 219);

      /* border: solid 0px transparent; */
      border-top: solid 1px rgb(174, 174, 174);
      border-left: none;
      border-right: none;
      border-bottom: none;

      /* padding: 7px; */
      padding-top: 15px;
   }


      
   h1 {
      padding-left: 10px;
      font-family:'Chakra Petch', sans-serif;
      font-size: 1.65rem;
   }


      
   h2 {
      padding-left: 10px;
      font-family:'Chakra Petch', sans-serif;
      font-size: 1.35rem;
   }



   .contentDIVClass {
      width: 96%;
      margin: auto;
      /* background-color: yellow; */

      padding: 0px;
   }
   



   .contentsParagraph {
      width: 98%;
      margin: auto;
      padding-left: 7px;
      padding-right: 7px;
      font-family:'Chakra Petch', sans-serif;
      font-size: 1.0rem;
   }


      
   #punkIDNumberTF {
      padding: 2px 2px 2px 0px;
      border: solid 1px gray;
      border-radius: 4px;

      font-family:'Chakra Petch', sans-serif;
      font-size: 0.9rem;
   }

   

   .buttonClass {
      padding: 0px 5px 1px 5px;
      
      font-family:'Chakra Petch', sans-serif;
      font-size: 0.95rem;

      border-radius: 2px;
   }



   .dropDownMenuClass {
      padding: 2px 5px 2px 5px;
      
      font-family:'Chakra Petch', sans-serif;
   }



   #hoverInfoDIV {
      position: absolute;
      z-index: 5;
   
      top: 75px;
      left: 3px;
   
      width: 150px;
      /* height: 100px; */
      max-height: 300px;
   
      margin: 0%;
      padding: 9px;
      padding-left: 10px;
   
      background-color: rgb(27, 0, 35);
      border: solid 2px silver;
   
      font-family: 'Courier New', Courier, monospace;
      color: #3dff53;
      font-size: 0.9rem;
   }
      
      
   #GUIContainerDIV {
      visibility: hidden;
      position: absolute;
      z-index: 5;

      top: 75px;
      right: 10px;

      width: 250px;
      /* max-height: 300px; */

      margin: 0%;
      padding: 9px;

      background-color: rgb(27, 0, 35);

      border: solid 1px silver;
      /* border-radius: 9px; */

      font-family: 'Courier New', Courier, monospace;
      color: #3dff53;
      font-size: 0.9rem;
   }


      
   #SettingsButtonDIV {
      visibility: visible;
      position: absolute;
      z-index: 10;

      top: 75px;
      right: 5px;

      width: 32px;
      height: 32px;

      margin: 0px;
      padding: 0px;

      background-color: rgb(0, 0, 0);
      color: #00da3a;
      
      border: solid 1px silver;

      /* text-align: center;
      font-family: 'Courier New', Courier, monospace;
      font-size: 2.5rem; */

      /* content: "\2699"; */

      /* display: block;
      white-space: nowrap; */
   }




   

}
